:root {
    /* colors */
    --primary: #63b496;
    --secondary: #f4f4f4;
    --darkGray: #4a4a4a;
    --nav-black: #000;
    --nav-white: #fff;

    --font: 'Montserrat', 'sans-serif';

    --fond1 : rgb(255, 255, 255);
    --2 : #fafafa;
    --border : rgb(0, 0, 0);
    --font1 : rgb(0, 0, 0);
    --font2 : rgb(29, 29, 29);
    --hover : rgb(245, 245, 245) ;
    --amyblue : #243e66 ;

    /* theme 
    --fond1: #fff;
    --2: #fafafa;
    --border: rgb(0, 0, 0);
    --font1: rgb(0, 0, 0);
    --font2: rgb(29, 29, 29);
    --hover: rgb(245, 245, 245) ;
    --amyblue : #243e66 ;
    */

    transition: 10s;
}
:root, 
:root.light {
    --fond1 : rgb(255, 255, 255);
    --2 : #fafafa;
    --border : rgb(130, 130, 130);
    --font1 : rgb(0, 0, 0);
    --font2 : rgb(29, 29, 29);
    --hover : rgb(245, 245, 245) ;
    --amyblue : #243e66 ;
    --holiva-blue-green : #22baba;
    --holiva-blue : #226eba;
    --green : #afffb4 ;
    --optioncode: #dfeaef;
    --lvl2title: #e5dfef;
    --radio-back: white;
    --radio-border: rgb(20, 20, 20);
    --radio-center: #1266f1;
    --checked-back: white;
    --logo: url("/web/images/items/holiva-logo/holiva-logo-white.png");
    --addCustom: #dfefe0;
    --addCustomHover: #d7e7d8;
    }

.dark {
    --fond1 : #1d1d1d !important;
    --2 : rgb(15, 15, 15) !important;
    --border : rgb(142, 142, 142) !important;
    --font1 : rgb(221, 221, 221) !important;
    --font2 : rgb(236, 236, 236) !important;
    --hover : rgb(51, 51, 51)!important ;
    --amyblue : #ededed !important ;
    --green : #66bb6a ;
    --optioncode : rgb(56 56 56);
    --lvl2title: #443849e0;
    --radio-back: rgba(0, 0, 0, 0); 
    --radio-border: #ffffff85;
    --radio-center: #66bb6a;
    --checked-back: rgba(255, 255, 255, 0);
    --logo: url("/web/images/items/220x220/amy-logo-white.png");
    
}

@media(max-width: 768px) {
.dark {
    --border : rgb(95, 95, 95) !important;
    }
}