/*#########--------------CYRIL CSS--------------#########
        #########--------------CYRIL CSS--------------#########
        #########--------------CYRIL CSS--------------#########*/
* {
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

body {
    margin: 0;
}

textarea:focus, input:focus {
    outline: none;
}

img {
    max-width: 100%;
}
/*#########--------------VARIABLE CSS--------------#########
#########--------------VARIABLE CSS--------------#########
#########--------------VARIABLE CSS--------------#########*/
:root {
    /*ROUGE FONCÉ*/
    /*--primary-color: #531629;*/
    --primary-color: #900625;
    --primary-color-hover: #75051E;
    /*--primary-color-hover: #6e1c36;*/
    --primary-color-transparent: #e3bec7;
    /*ROUGE*/
    --accent-color: #900625;
    /*BLEU*/
    --secondary-color: #29adbb;
    --secondary-color-hover: #13c4d4;
    --secondary-color-transparent: #a0cacf;
    /*VERT*/
    --tertiary-color: #7aaf38;
    --tertiary-color-hover: #90c251;
    --tertiary-color-transparent: #a5d865;
    /*WHITE*/
    --white-100-color: #ffffff;
    --white-200-color: #f5f5f5;
    /*GRAY*/
    --gray-100-color: #aaaaaa;
    --gray-200-color: #cccccc;
    --gray-300-color: #eeeeee;
    /*DARK*/
    --dark-100-color: #000000;
    --dark-200-color: #222222;
    --dark-300-color: #333333;
    --dark-400-color: #444444;
    /*--dark-500-color: #555555;*/
    --dark-500-color: #909090;
    /*BLEU*/
    /*--blue-100-color: #bddbdd;*/
    --blue-100-color: #d1e2e4;
    --blue-200-color: #29adbb;
    --blue-300-color: #0F95A1;
    /*--blue-100-color: #E5F7F8;*/
    /*VERT*/
    --green-100-color: #a5d865;
    --green-200-color: #7aaf38;
    /*ROUGE*/
    --red-100-color: #900625;
    --red-200-color: #75051E;
    --success-color: #7aaf38;
    --info-color: #29adbb;
    --warning-color: #fbbc03;
    /*--danger-color: #900625;*/
    --danger-color: #d9534f;
    /*--text-color: #333333;*/
    /*--background-color: #ffffff;*/
    --font-size: 16px;
    --line-height: 1.5;
    --font-family: "proxima-nova", Poppins, Roboto, Helvetica, Arial, sans-serif, FontAwesome;
    --max-width: 960px;
    --padding: 16px;
    --margin: 8px;
    --border-radius: 4px;
    --box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    --transition-duration: 0.3s;
    --hover-opacity: 0.8;
}

.primary-color {
    color: var(--primary-color);
}

.secondary-color {
    color: var(--secondary-color);
}

.tertiary-color {
    color: var(--tertiary-color);
}

.dark-color {
    color: var(--dark-300-color);
}

.gray-color {
    color: var(--gray-200-color);
}

.white-color {
    color: var(--white-100-color);
}

.white-bgcolor {
    background-color: var(--white-100-color);
}

.black-color {
    color: var(--dark-100-color);
}

.black-bgcolor {
    background-color: var(--dark-100-color);
}

.success-color {
    color: var(--success-color);
}

.success-bgcolor {
    background-color: var(--success-color);
}

.info-color {
    color: var(--info-color);
}

.info-bgcolor {
    background-color: var(--info-color);
}

.warning-color {
    color: var(--warning-color);
}

.warning-bgcolor {
    background-color: var(--warning-color);
}

.danger-color {
    color: var(--danger-color);
}

.danger-bgcolor {
    background-color: var(--danger-color);
}

.primary-bgcolor {
    background-color: var(--primary-color);
}

.secondary-bgcolor {
    background-color: var(--secondary-color);
}

.tertiary-bgcolor {
    background-color: var(--tertiary-color);
}

.dark-bgcolor {
    background-color: var(--dark-300-color);
}

.white-bgcolor {
    background-color: var(--white-100-color);
}

.primary-button-1 {
    border: none;
    color: var(--white-100-color);
    background-color: var(--primary-color);
}

    .primary-button-1:hover {
        color: var(--white-100-color);
        background-color: var(--primary-color-hover);
    }

.primary-button-2 {
    color: var(--primary-color);
    background-color: var(--white-100-color);
    border: 2px solid var(--primary-color);
    /*    box-shadow: var(--primary-color-box-shadow);*/
}

    .primary-button-2:hover {
        color: var(--primary-color-hover);
        background-color: var(--white-100-color);
        border: 2px solid var(--primary-color-hover);
        /*        box-shadow: var(--primary-color-hover-box-shadow);*/
    }

.primary-button-3 {
    border: none;
    color: var(--primary-color);
    /*background-color: var(--white-100-color);*/
    box-shadow: none;
    text-decoration: underline;
}

    .primary-button-3:hover {
        font-weight: 700;
        color: var(--primary-color-hover);
        /*background-color: var(--white-100-color);*/
        border-bottom: none;
        box-shadow: none;
    }

.secondary-button-1 {
    border: none;
    color: var(--white-100-color);
    background-color: var(--secondary-color);
    /* box-shadow: var(--secondary-color-box-shadow);*/
}

    .secondary-button-1:hover {
        color: var(--white-100-color);
        background-color: var(--secondary-color-hover);
        /*box-shadow: var(--secondary-color-hover-box-shadow);*/
    }

.secondary-button-2 {
    color: var(--secondary-color);
    background-color: var(--white-100-color);
    border: 2px solid var(--secondary-color);
    /* box-shadow: var(--secondary-color-box-shadow);*/
}

    .secondary-button-2:hover {
        color: var(--secondary-color-hover);
        background-color: var(--white-100-color);
        border: 2px solid var(--secondary-color-hover);
        /*  box-shadow: var(--secondary-color-hover-box-shadow);*/
    }

.secondary-button-3 {
    color: var(--secondary-color);
    /*background-color: var(--white-100-color);*/
    border-bottom: none;
    box-shadow: none;
    text-decoration: underline;
}

    .secondary-button-3:hover {
        font-weight: 700;
        color: var(--secondary-color-hover);
        /*background-color: var(--white-100-color);*/
        border-bottom: none;
        box-shadow: none;
    }

.tertiary-button-1 {
    color: var(--white-100-color);
    background-color: var(--tertiary-color);
    border: none;
    outline: none;
    /* box-shadow: var(--tertiary-color-box-shadow);*/
}

    .tertiary-button-1:hover {
        color: var(--white-100-color);
        background-color: var(--tertiary-color-hover);
        /*box-shadow: var(--tertiary-color-hover-box-shadow);*/
    }

.tertiary-button-2 {
    color: var(--tertiary-color);
    background-color: var(--white-100-color);
    border: 2px solid var(--tertiary-color);
    /*box-shadow: var(--tertiary-color-box-shadow);*/
}

    .tertiary-button-2:hover {
        color: var(--tertiary-color-hover);
        background-color: var(--white-100-color);
        border: 2px solid var(--tertiary-color-hover);
        /*box-shadow: var(--tertiary-color-hover-box-shadow);*/
    }

.tertiary-button-3 {
    color: var(--tertiary-color);
    /*background-color: var(--white-100-color);*/
    border-bottom: none;
    box-shadow: none;
    text-decoration: underline;
}

    .tertiary-button-3:hover {
        font-weight: 700;
        color: var(--tertiary-color-hover);
        /*background-color: var(--white-100-color);*/
        border-bottom: none;
        box-shadow: none;
    }

.dark-button-1 {
    color: var(--white-100-color);
    background-color: var(--dark-300-color);
    /*border: 1px solid var(--white-100-color);*/
    /*box-shadow: var(--dark-color-box-shadow);*/
}

    .dark-button-1:hover,
    .dark-button-1:focus {
        color: var(--white-100-color);
        background-color: var(--dark-400-color);
        /*border: 1px solid var(--white-100-color);*/
        /* box-shadow: var(--dark-color-hover-box-shadow);*/
    }

.dark-button-2 {
    color: var(--dark-300-color);
    background-color: inherit;
    border: 2px solid var(--dark-300-color);
    /*box-shadow: var(--dark-color-box-shadow);*/
}

    .dark-button-2:hover {
        color: var(--dark-400-color);
        background-color: inherit;
        border: 2px solid var(--dark-400-color);
        /*box-shadow: var(--dark-color-hover-box-shadow);*/
    }

.dark-button-3 {
    color: var(--dark-300-color);
    background-color: inherit;
    border-bottom: none;
    box-shadow: none;
    text-decoration: underline;
}

    .dark-button-3:hover {
        font-weight: 700;
        color: var(--dark-400-color);
        background-color: inherit;
        border-bottom: none;
        box-shadow: none;
    }

.black-button-1 {
    color: var(--white-100-color);
    background-color: var(--dark-100-color);
    /*border: 1px solid var(--white-100-color);*/
    /*box-shadow: var(--dark-color-box-shadow);*/
}

    .black-button-1:hover,
    .black-button-1:focus {
        color: var(--white-100-color);
        background-color: var(--dark-200-color);
        /*border: 1px solid var(--white-100-color);*/
        /* box-shadow: var(--dark-color-hover-box-shadow);*/
    }

.black-button-2 {
    color: var(--dark-100-color);
    background-color: inherit;
    border: 2px solid var(--dark-100-color);
    /*box-shadow: var(--dark-color-box-shadow);*/
}

    .black-button-2:hover {
        color: var(--dark-200-color);
        background-color: inherit;
        border: 2px solid var(--dark-200-color);
        /*box-shadow: var(--dark-color-hover-box-shadow);*/
    }

.black-button-3 {
    color: var(--dark-100-color);
    background-color: inherit;
    border-bottom: none;
    box-shadow: none;
    text-decoration: underline;
}

    .black-button-3:hover {
        font-weight: 700;
        color: var(--dark-200-color);
        background-color: inherit;
        border-bottom: none;
        box-shadow: none;
    }

.light-button-1 {
    /*border: 1px solid var(--dark-300-color);*/
    color: var(--dark-300-color);
    background-color: var(--white-100-color);
    /*box-shadow: var(--white-color-box-shadow);*/
}

    .light-button-1:hover {
        /*border: 1px solid var(--dark-300-color);*/
        color: var(--dark-400-color);
        background-color: var(--white-100-color);
        /*box-shadow: var(--white-color-hover-box-shadow);*/
    }

.light-button-2 {
    color: var(--white-200-color);
    background-color: inherit;
    border: 2px solid var(--white-100-color);
    /*box-shadow: var(--white-color-box-shadow);*/
}

    .light-button-2:hover {
        color: var(--white-100-color);
        background-color: inherit;
        border: 2px solid var(--white-100-color);
        /*box-shadow: var(--white-color-hover-box-shadow);*/
    }

.light-button-3 {
    color: var(--white-100-color);
    background-color: inherit;
    border-bottom: none;
    box-shadow: none;
    text-decoration: underline;
}

    .light-button-3:hover {
        font-weight: 700;
        color: var(--white-100-color);
        background-color: inherit;
        border-bottom: none;
        box-shadow: none;
    }

.ez-tag-red.red-button {
    border: none;
    color: var(--white-100-color);
    background-color: var(--red-100-color);
}

.red-button {
    border: none;
    color: var(--white-100-color);
    background-color: var(--red-100-color);
}

    .red-button:hover {
        color: var(--white-100-color);
        background-color: var(--red-200-color);
    }

.green-button {
    border: none;
    color: var(--white-100-color);
    background-color: var(--green-200-color);
}

    .green-button:hover {
        color: var(--white-100-color);
        background-color: var(--green-100-color);
    }
/*MASTER BUTTON STYLE*/

.ezinput {
    height: 30px;
    max-width: 150px;
    margin: 0 5px;
    background-color: white;
    font-size: 12px;
    font-family: Arial, FontAwesome;
    font-weight: 600;
    opacity: 1;
    border: 1px solid #aaa;
    color: #333333;
    padding: 6px 5px 6px 5px;
    border-radius: 4px;
    -webkit-transition: all 0.7s ease 0s;
}

.ezinput-lg {
    text-align: center;
    height: 50px;
    max-width: 150px;
    margin: 0 5px;
    background-color: white;
    font-size: 36px;
    font-family: Arial, FontAwesome;
    font-weight: 700;
    opacity: 1;
    border: 1px solid #aaa;
    color: #333333;
    padding: 6px 5px 6px 5px;
    border-radius: 4px;
    -webkit-transition: all 0.7s ease 0s;
}

.ezselect {
    height: 30px;
    max-width: 150px;
    margin: 0 5px;
    background-color: white;
    font-size: 12px;
    font-family: Arial, FontAwesome;
    font-weight: 600;
    opacity: 1;
    border: 1px solid #aaa;
    color: #333333;
    padding: 6px 5px 6px 5px;
    border-radius: 4px;
    -webkit-transition: all 0.7s ease 0s;
    cursor: pointer;
}

.ezlink {
    background-color: inherit;
    color: #333333;
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    border-radius: 5px;
    border: none;
    padding: 10px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 0px;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.ezlink-red:hover {
    color: #d33b32;
    background-color: rgba(211,59,50,0.2);
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ezlink-blue:hover {
    color: #486da5;
    background-color: rgba(72,109,165,0.2);
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ezlink-green:hover {
    color: #2d9345;
    background-color: rgba(45,147,69,0.2);
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ezlink-gold:hover {
    color: #DC9F07;
    background-color: rgba(220,159,7,0.2);
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ezlink:hover .button-icon-left i,
.ezlink:hover .button-icon-right i {
    transform: scale(1.2);
}
.ezbutton {
    font-size: 14px;
    font-weight: 700;
    text-transform: initial;
    /*border-radius: 40px;*/
    border-radius: 4px;
    /*border: none;*/
    height: 40px;
    /*color: white;*/
    padding: 0px 15px;
    /*text-decoration: none;*/
    margin: 0px 2px;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ezbutton-sm {
    font-size: 14px;
    font-weight: 700;
    text-transform: initial;
    /*border-radius: 30px;*/
    border-radius: 4px;
    /*border: none;*/
    height: 30px;
    /*color: white;*/
    padding: 0px 10px;
    /*text-decoration: none;*/
    margin: 0px 2px;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ezbutton-sm-round {
    font-size: 14px;
    font-weight: 700;
    text-transform: initial;
    border-radius: 30px;
    border: none;
    height: 30px;
    width: 30px;
    color: white;
    padding: 0px 10px;
    text-decoration: none;
    margin: 0px 2px;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ezbutton-sm-square {
    font-size: 16px;
    font-weight: 700;
    text-transform: inherit;
    border-radius: 0px;
    border: none;
    height: 30px;
    width: 30px;
    padding: 0px 10px;
    text-decoration: none;
    margin: 0px 2px;
    cursor: pointer;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.ezbutton:hover .button-icon-left {
    transform: scale(1.1);
}

.ezbutton:hover .button-icon-right {
    transform: scale(1.1);
}

.ezbutton-red {
    background-color: #e84336;
}

    .ezbutton-red:hover {
        background-color: #d33b32;
    }

.ezbutton-blue {
    background-color: #517bbd;
}

    .ezbutton-blue:hover {
        background-color: #486da5;
    }

.ezbutton-green {
    background-color: #31a853;
}

    .ezbutton-green:hover {
        background-color: #2d9345;
    }

.ezbutton-gold {
    background-color: #fbbc03;
}

    .ezbutton-gold:hover {
        background-color: #DC9F07;
    }
/*ICONE DANS LE BOUTON*/
.button-icon-left {
    padding-right: 5px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.button-icon-right {
    padding-left: 5px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

    .button-icon-left i,
    .button-icon-right i {
        -webkit-transition: all 300ms ease;
        transition: all 300ms ease;
    }

.ezbutton-icon {
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    display: inline-block;
    width: 30px;
    margin: 0px 5px;
    height: 30px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    line-height: 14px;
    color: black;
    border: 1px solid #dadbdf;
    border-radius: 15px;
    background: -webkit-linear-gradient(#ffffff, #f5f5f5);
    background: -o-linear-gradient(#ffffff, #f5f5f5);
    background: -moz-linear-gradient(#ffffff, #f5f5f5);
    background: linear-gradient(#ffffff, #f5f5f5);
    cursor: pointer;
    box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.1);
}

    .ezbutton-icon:active {
        transform: translateY(1px);
        box-shadow: none;
    }

    .ezbutton-icon:hover {
        background: -webkit-linear-gradient(#f7f7f7, #f4f4f4);
        background: -o-linear-gradient(#f7f7f7, #f4f4f4);
        background: -moz-linear-gradient(#f7f7f7, #f4f4f4);
        background: linear-gradient(#f7f7f7, #f4f4f4);
    }
/*COLORS RED, BLUE, GREEN, GOLD*/
.body-color-red {
    background: linear-gradient(356deg, rgba(211,59,50,0.3) 0%, rgba(232,67,54,0.3) 15%, rgba(255,255,255,1) 80%);
    background-attachment: fixed;
}

.body-color-blue {
    background: linear-gradient(356deg, rgba(211,59,50,0.3) 0%, rgba(232,67,54,0.3) 15%, rgba(255,255,255,1) 80%);
    background-attachment: fixed;
}

.body-color-green {
    background: linear-gradient(356deg, rgba(45,147,69,0.3) 0%, rgba(49,168,83,0.3) 15%, rgba(255,255,255,1) 80%);
    background-attachment: fixed;
}

.color-red-1 {
    color: #e84336;
}

.color-red-2 {
    color: #d33b32;
}

.color-blue-1 {
    color: #517bbd;
}

.color-blue-2 {
    color: #486da5;
}

.color-green-1 {
    color: #31a853;
}

.color-green-2 {
    color: #2d9345;
}

.color-gold-1 {
    color: #fbbc03;
}

.color-gold-2 {
    color: #d33b32;
}
/*COLORS BLACKS AND WHITES*/
.color-white {
    color: #ffffff;
}

.color-light-gray-1 {
    color: #DADBDF;
}

.color-light-gray-2 {
    color: #cccccc;
}

.color-mid-gray-1 {
    color: #80858a;
}

.color-mid-gray-2 {
    color: #6f7375;
}

.color-dark-gray-1 {
    color: #555555;
}

.color-dark-gray-2 {
    color: #444444;
}

.color-dark-1 {
    color: #333333;
}

.color-dark-2 {
    color: #222222;
}

.color-black {
    color: #000000;
}
/*BACKGROUND-COLORS RED, BLUE, GREEN, GOLD*/
.background-color-red-1 {
    background-color: #e84336;
}

.background-color-red-2 {
    background-color: #d33b32;
}

.background-color-blue-1 {
    background-color: #517bbd;
}

.background-color-blue-2 {
    background-color: #486da5;
}

.background-color-green-1 {
    background-color: #31a853;
}

.background-color-green-2 {
    background-color: #2d9345;
}

.background-color-gold-1 {
    background-color: #fbbc03;
}

.background-color-gold-2 {
    background-color: #d33b32;
}
/*BACKGROUND-COLORS BLACKS AND WHITES*/
.background-color-white {
    background-color: #ffffff;
}

.background-color-light-gray-1 {
    background-color: #DADBDF;
}

.background-color-light-gray-2 {
    background-color: #cccccc;
}

.background-color-mid-gray-1 {
    background-color: #80858a;
}

.background-color-mid-gray-2 {
    background-color: #6f7375;
}

.background-color-dark-gray-1 {
    background-color: #555555;
}

.background-color-dark-gray-2 {
    background-color: #444444;
}

.background-color-dark-1 {
    background-color: #333333;
}

.background-color-dark-2 {
    background-color: #222222;
}

.background-color-black {
    background-color: #000000;
}

/*DEBUT FLEXS*/
.flex {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.flex_auto {
    -ms-flex: auto;
    flex: auto;
}

.flex_rw {
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
}

.flex_col {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex_center {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.flex_start {
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.flex_spc_evenly {
    -webkit-justify-content: space-evenly;
    justify-content: space-evenly;
}

.flex_spc_btw {
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.flex_spc_arnd {
    -webkit-justify-content: space-around;
    justify-content: space-around;
}

.flex_align_start {
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.flex_align_center {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.flex_align_end {
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.flex_self_center {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
}

.flex_self_start {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
}

.flex_self_end {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: flex-end;
    align-self: flex-end;
}
/*FIN FLEXS*/
/*#########--------------CYRIL CSS--------------#########
#########--------------CYRIL CSS--------------#########
#########--------------CYRIL CSS--------------#########*/