:root {

/* ---------- font size ---------- */
    --font-base: 16px;
    --font-h1: 2em;
    --font-h2: 1.5em;
    --font-h3: 1.2em;
    --font-h4: 1em;
    --font-h1-medium: 1.5em;
    --font-h2-medium: 1.2em;
    --font-h3-medium: 1em;
    --font-h4-medium: .94em;
    --font-h1-small: 1.2em;
    --font-h2-small: 1em;
    --font-h3-small: 1em;
    --font-h4-small: .84em;
    --font-button: .875em;
    --font-option: .875em;
    --font-small: .875em;

/* ---------- COLOR ---------- */
    
    --w-color-text: #2a2b3d;
    --w-color-text-bold:;
    --w-color-text-apici:;
    --w-color-bg: #ffffff;
    --w-color-1: #111827;
    --w-color-2:#84c920;
    --w-color-3:#6f6486;
    --w-color-4:#f1f1f1;
    --w-color-5: linear-gradient(43deg, rgba(0,0,0,1) 0%, rgba(69,68,88,1) 52%); 
    --w-color-hover: #111827;
    --w-black-gradient: linear-gradient(0deg, rgba(0,0,0,0) 59%, rgba(0,0,0,0.725910432532388) 100%); 

    --w-header-color: #ffffff;
    --w-header-color-small: #fffffff0;
    
    --w-gray-100: #F3F4F6;
    --w-gray-200: #E5E7EB;
    --w-gray-300: #D1D5DB;
    --w-gray-400: #9CA3AF;
    --w-gray-500: #6B7280;
    --w-gray-600: #4B5563;
    --w-gray-700: #374151;
    --w-gray-800: #1F2937;
    --w-gray-900: #111827;
    --w-hover: #20c997;
    --sup: white;

    --button-green: #198754;
    --button-blue: #0d6efd;
    --button-yellow: #ffc107;
    --button-orange: #fd7e14;
    --button-red: #dc3545;
    --button-purple: #6f42c1;
    --button-cyano: #00b7ff;

/* ---------- BOX PROPERTY ---------- */

    --m60: 60px !important;
    --m55: 55px !important;
    --m50: 50px !important;
    --m45: 45px !important;
    --m35: 35px !important;
    --m30: 30px !important;
    --m25: 25px !important;
    --m20: 20px !important;
    --m15: 15px !important;
    --m10: 10px !important;
    --m5: 5px !important;
    --m0: 0px !important;
    --mAuto: 0 auto;

    --p60: 60px !important;
    --p55: 55px !important;
    --p50: 50px !important;
    --p45: 45px !important;
    --p40: 40px !important;
    --p35: 35px !important;
    --p30: 30px !important;
    --p25: 25px !important;
    --p20: 20px !important;
    --p15: 15px !important;
    --p10: 10px !important;
    --p5: 5px !important;
    --p0: 0px !important;

    --radio-0: 0px !important;
    --radio-5: 0px !important;
    --radio-8: 8px !important;
    --radio-10: 10px !important;
    --radio-15: 15px !important;
    --radio-20: 20px !important;
    --radio-25: 25px !important;
    --radio-30: 30px !important;
    --radio-35: 35px !important;
    --radio-50p: 50% !important;
    --radio-100p: 100% !important;

    --w-100: 100%;
    --w-90: 90%;
    --w-80: 80%;
    --w-70: 70%;
    --w-60: 60%;
    --w-50: 50%;
    --w-40: 40%;
    --w-33: 33%;
    --w-30: 30%;
    --w-25: 25%;
    --w-20: 20%;
    --w-15: 15%;
    --w-10: 10%;
    --w-936: 1200px;

    --flex: flex;
    --media-tablet: 900px;

/* ---------- PERSONALIZZAZIONI ---------- */

    --h-header: 220px;
    --h-header-small: 60px;
    --padding-menu-1: 0% 0% 0% 0%;
    --h-header-padding: 70px;
    --main-max:1300px;
    --h-input: 60px;

}

@media screen and (max-width: 800px){

:root {
    --w-936: 100% !important;
    --w-90: 100% !important;
    --w-80: 100% !important;
    --w-70: 100% !important;
    --w-60: 100% !important;
    --w-50: 100% !important;
    --w-40: 100% !important;
    --w-33: 100% !important;
    --w-30: 100% !important;
    --w-20: 100% !important;
    --w-25: 100% !important;

    --h-header: 0px;
    --h-header-small: 60px;
    --padding-menu-1: 0% 0% 0% 0%;
    --h-header-padding: 0px;
    --main-max:100% !important;
    --h-input: 60px;
    --flex: inline-block !important;
    --m10: 0px !important;

}