/******************************************************************

     ██████╗ ██████╗ ██╗      ██████╗ ██╗   ██╗██████╗ ███████╗
    ██╔════╝██╔═══██╗██║     ██╔═══██╗██║   ██║██╔══██╗██╔════╝
    ██║     ██║   ██║██║     ██║   ██║██║   ██║██████╔╝███████╗
    ██║     ██║   ██║██║     ██║   ██║██║   ██║██╔══██╗╚════██║
    ╚██████╗╚██████╔╝███████╗╚██████╔╝╚██████╔╝██║  ██║███████║
     ╚═════╝ ╚═════╝ ╚══════╝ ╚═════╝  ╚═════╝ ╚═╝  ╚═╝╚══════╝

 ******************************************************************/



    .responsiville {
        --nvm-red                     : 202,  28,  37;
        --nvm-orange                  : 236, 185, 123;
        --nvm-green                   : 183, 191,  29;
        --nvm-blue                    :  12, 155, 212;
        --nvm-white                   : 255, 255, 255;
        --nvm-gray-1                  : 240, 240, 240;
        --nvm-gray-2                  : 210, 210, 210;
        --nvm-gray-3                  : 180, 180, 180;
        --nvm-gray-4                  : 150, 150, 150;
        --nvm-gray-5                  : 120, 122, 122;
        --nvm-gray-6                  :  92,  92,  92;
        --nvm-gray-7                  :  62,  62,  62;
        --nvm-gray-8                  :  31,  31,  31;
        --nvm-gray-9                  :  15,  15,  15;
        --nvm-black                   :   0,   0,   0;

        --nvm-color-red               : rgb(var(--nvm-red));
        --nvm-color-orange            : rgb(var(--nvm-orange));
        --nvm-color-green             : rgb(var(--nvm-green));
        --nvm-color-blue              : rgb(var(--nvm-blue));
        --nvm-color-white             : rgb(var(--nvm-white));
        --nvm-color-gray-1            : rgb(var(--nvm-gray-1));
        --nvm-color-gray-2            : rgb(var(--nvm-gray-2));
        --nvm-color-gray-3            : rgb(var(--nvm-gray-3));
        --nvm-color-gray-4            : rgb(var(--nvm-gray-4));
        --nvm-color-gray-5            : rgb(var(--nvm-gray-5));
        --nvm-color-gray-6            : rgb(var(--nvm-gray-6));
        --nvm-color-gray-7            : rgb(var(--nvm-gray-7));
        --nvm-color-gray-8            : rgb(var(--nvm-gray-8));
        --nvm-color-gray-9            : rgb(var(--nvm-gray-9));
        --nvm-color-black             : rgb(var(--nvm-black));

        --nvm-color-text              : var(--nvm-color-gray-8); 
        --nvm-color-text-link         : var(--nvm-color-gray-8); 
        --nvm-color-text-selection    : var(--nvm-color-white); 
        --nvm-color-text-selection-bg : var(--nvm-color-gray-8); 
    }



/***************************************************************************

    ██╗   ██╗ █████╗ ██████╗ ██╗ █████╗ ██████╗ ██╗     ███████╗███████╗
    ██║   ██║██╔══██╗██╔══██╗██║██╔══██╗██╔══██╗██║     ██╔════╝██╔════╝
    ██║   ██║███████║██████╔╝██║███████║██████╔╝██║     █████╗  ███████╗
    ╚██╗ ██╔╝██╔══██║██╔══██╗██║██╔══██║██╔══██╗██║     ██╔══╝  ╚════██║
     ╚████╔╝ ██║  ██║██║  ██║██║██║  ██║██████╔╝███████╗███████╗███████║
      ╚═══╝  ╚═╝  ╚═╝╚═╝  ╚═╝╚═╝╚═╝  ╚═╝╚═════╝ ╚══════╝╚══════╝╚══════╝
                                                                        
 ****************************************************************************/


   
    .responsiville {
        --nvm-panel-wide-width   : 1920px;  /* The width of the wide panel element */
        --nvm-panel-xlarge-width : 1680px;  /* The width of the xlarge panel element */
        --nvm-panel-medium-width : 1440px;  /* The width of the medium panel element */
        --nvm-panel-normal-width : 1280px;  /* The width of the normal panel element */
        --nvm-panel-narrow-width : 1024px;  /* The width of the narrow panel element */
        --nvm-panel-small-width  :  768px;  /* The width of the very narrow panel element */
    }

    .small {
        --nvm-base-font-size     : 16px;  /* The body element base font size */
        --nvm-base-line-height   : 1.5;     /* The default line height of all elements */
        --nvm-text-line-height   : 1.5;     /* The default line height of text elements */
        --nvm-heading-line-height: 1.3;     /* The line height of heading elements */

        --nvm-text-rhythm        : 20px;    /* Vertical margins between text elements */
        --nvm-grid-gutter        : 10px;    /* Paddings between columns, the grid gutters */
        --nvm-grid-rhythm        : 30px;    /* Vertical margins between major grid sections */
    }

    .tablet {
        --nvm-base-font-size     : 17px;  /* The body element base font size */
        --nvm-base-line-height   : 1.5;     /* The default line height of all elements */
        --nvm-text-line-height   : 1.5;     /* The default line height of text elements */
        --nvm-heading-line-height: 1.25;    /* The line height of heading elements */

        --nvm-text-rhythm        : 25px;  /* Vertical margins between text elements */
        --nvm-grid-gutter        : 10px;    /* Paddings between columns, the grid gutters */
        --nvm-grid-rhythm        : 45px;  /* Vertical margins between major grid sections */
    }

    .laptop {
        --nvm-base-font-size     : 18px;  /* The body element base font size */
        --nvm-base-line-height   : 1.5;     /* The default line height of all elements */
        --nvm-text-line-height   : 1.5;     /* The default line height of text elements */
        --nvm-heading-line-height: 1.2;     /* The line height of heading elements */

        --nvm-text-rhythm        : 30px;    /* Vertical margins between text elements */
        --nvm-grid-gutter        : 10px;    /* Paddings between columns, the grid gutters */
        --nvm-grid-rhythm        : 60px;    /* Vertical margins between major grid sections */
    }



 /***************************************************

    ███████╗ ██████╗ ███╗   ██╗████████╗███████╗
    ██╔════╝██╔═══██╗████╗  ██║╚══██╔══╝██╔════╝
    █████╗  ██║   ██║██╔██╗ ██║   ██║   ███████╗
    ██╔══╝  ██║   ██║██║╚██╗██║   ██║   ╚════██║
    ██║     ╚██████╔╝██║ ╚████║   ██║   ███████║
    ╚═╝      ╚═════╝ ╚═╝  ╚═══╝   ╚═╝   ╚══════╝
                                                
 ***************************************************/



    .responsiville {
        --nvm-font-serif     : Baskerville, Georgia, serif;
        --nvm-font-sans-serif: 'Segoe UI', Arial, sans-serif;
        --nvm-font-display   : Constantia, Impact, sans-serif;
        --nvm-font-monospace : Consolas, 'Courier New', monospace;
        --nvm-font-icons     : 'Responsiville icons';
    }



/******************************************************************

    ██╗     ███████╗███╗   ██╗ ██████╗████████╗██╗  ██╗███████╗
    ██║     ██╔════╝████╗  ██║██╔════╝╚══██╔══╝██║  ██║██╔════╝
    ██║     █████╗  ██╔██╗ ██║██║  ███╗  ██║   ███████║███████╗
    ██║     ██╔══╝  ██║╚██╗██║██║   ██║  ██║   ██╔══██║╚════██║
    ███████╗███████╗██║ ╚████║╚██████╔╝  ██║   ██║  ██║███████║
    ╚══════╝╚══════╝╚═╝  ╚═══╝ ╚═════╝   ╚═╝   ╚═╝  ╚═╝╚══════╝
                                                            
 ******************************************************************/



    .responsiville {
        --nvm-length-small:  calc(0.5*var(--nvm-grid-rhythm));
        --nvm-length-medium: calc(1.0*var(--nvm-grid-rhythm));
        --nvm-length-normal: calc(1.5*var(--nvm-grid-rhythm));
        --nvm-length-large:  calc(2.0*var(--nvm-grid-rhythm));
        --nvm-length-xlarge: calc(2.5*var(--nvm-grid-rhythm));
    }
