* {
    font-size: 15px !important;
    font-family: 'Roboto', sans-serif;
}

body {
    background-color: #fff;
    min-width: 350px !important;
}

a:focus,
button:focus {
    outline: none!important;
}

.larrow::before {
    content: "→";
    display: inline-block;
    margin-right: -12px;
    opacity: 0;
    transform: translateX(-5px);
    transition: all 0.3s ease;
}

.larrow:hover::before {
    margin-right: 8px;
    opacity: 1;
    transform: translateX(0);
}

.icones {
    transform: scale(2);
}

.icones_media {
    border: 8px solid #eee;
}

.contenu {
    margin-top: 50px;
}

h1 {
    font-size: 34px !important;
}

h1.text {
    font-size: 20px !important;
}

h2 {
    font-size: 30px !important;
}

h3 {
    font-size: 24px !important;
}

h4,
h4 span,
.hr .text {
    font-size: 18px !important;
}
.hr .text {
    min-width: 150px;
    max-width: 775px;
    word-break: break-word;
}

.btn-outlined-responsive {
    border: 1px solid #323266!important;
    color: #323266;
    background-color: #fff;
    border-radius: 0px!important;
}

.btn-outlined {
    max-width: 215px;
}

.btn-outlined-responsive:hover  {
    color: #fff;
    background-color: #323266;
    transition: all 0.25s linear 0s;
    -o-transition: all 0.25s linear 0s;
    -ms-transition: all 0.25s linear 0s;
    -moz-transition: all 0.25s linear 0s;
    -webkit-transition: all 0.25s linear 0s;
}

.font-large {
    font-size: 14px !important;
}
.font-normal,
.font-normal a,
.font-normal em {
    font-size: 12px !important;
}
.font-small {
    font-size: 10px !important;
}
.font-bold {
    font-weight: bold;
}

a.list-group-item {
    font-size: 15px !important;
}

.panel {
    border-radius: 0px !important;
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.border-radius-0 {
    border-radius: 0px !important;
}

.border-radius-3 {
    border-radius: 3px !important;
}

.panel-login {
    border-color: #323266;
    box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.25);
}

.panel-heading {
    color: #323266;
    background-color: #fff;
}

.panel-footer {
    border-top: none;
    background-color: #fff !important;
}

.form-group {
    background-color: #fff !important;
    border: 1px solid #eee;
}

.btn {
    border: none;
}

span.fleche {
    content: "";
    display: block;
    margin-right: -80px;
    height: 30px;
    width: 110px;
}

span.fleche-sm {
    height: 20px !important;
    width: 100px !important;
}

span.fleche.fleche-rouge {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34.509 74.926"><path id="" data-name="" d="M-2044.958,566.257h57.824l17.1,17.254-17.1,17.255h-57.824l19.274-17.255Z" transform="translate(600.766 2044.958) rotate(90)" fill="rgb(197, 41, 38)"></path></svg>') no-repeat;
}

span.fleche.fleche-bleu {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34.509 74.926"><path id="" data-name="" d="M-2044.958,566.257h57.824l17.1,17.254-17.1,17.255h-57.824l19.274-17.255Z" transform="translate(600.766 2044.958) rotate(90)" fill="rgb(20, 20.4, 40)"></path></svg>') no-repeat;
}

span.fleche.fleche-blanc {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34.509 74.926"><path id="" data-name="" d="M-2044.958,566.257h57.824l17.1,17.254-17.1,17.255h-57.824l19.274-17.255Z" transform="translate(600.766 2044.958) rotate(90)" fill="rgb(255, 255, 255)"></path></svg>') no-repeat;
}


.hr {
    align-items: center;
    display: flex;
    text-align: center;
}
.hr-rouge::before,
.hr-rouge::after,
.hr-bleu::before,
.hr-bleu::after,
.hr-blanc::before,
.hr-blanc::after {
    content: "";
    flex: 1;
    height: 1px;
    margin: 0 .5em;
}
.hr-rouge::before,
.hr-rouge::after {
    background: #CD1719;
}
.hr-bleu::before,
.hr-bleu::after {
    background: #323266;
}
.hr-blanc::before,
.hr-blanc::after {
    background: #ffffff;
}

.list-group-item-info {
    background-color: #333466 !important;
    color: #fff !important;
}

.panel-heading a {
    color: #fff !important;
}

.tab-content {
    margin-bottom: 15px;
    padding: 15px;
}

select {
    border-color: #aaa;
    border-top: none!important;
    border-right: none!important;
    border-left: none!important;
    box-shadow: none!important;
    outline: none!important;
    border-radius: 0px!important;
}

.select2-container .select2-selection--single {
    height: 34px !important;
    border-radius: 0px!important;
    border-top: none!important;
    border-right: none!important;
    border-left: none!important;
    box-shadow: none!important;
    outline: none!important;
}

.list-group-item {
    font-size: 14px !important;
}

.m-b-sm {
    margin-bottom: 10px;
}

.triangle-wrapper-100 {
    width: 100%;
    height: 15px;
    display:flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.triangle-right {
    right: 0px;
    width: 100%;
    height: 15px;
}

.triangle-left {
    left: 0px;
    width: 100%;
    height: 15px;
    transform: scaleX(-1);
}

.triangle-right-rouge {
    background: linear-gradient(to right bottom, #CD1719 50%, transparent calc(50% + 1px));
}

.triangle-left-rouge {
    background: linear-gradient(to right top, #CD1719 50%, transparent calc(50% + 1px));
}

.color-rouge,
.color-rouge a {
    color: #CD1719!important;
}
.color-rouge a {
    text-decoration: underline;
}
.background-rouge {
    background-color: #CD1719;
}
.border-rouge {
    border-color: #CD1719;
}
.color-bleu {
    color: #333466 !important;
}
.color-bleu-clair {
    color: #c5c5e1 !important;
}
.color-blanc {
    color: #ffffff;
}
.background-bleu {
    background-color: #333466;
}
.border-bleu {
    border: 1px solid #333466 !important;
}
.border-gris {
    border: 1px solid rgba(0,0,0,0.2) !important;
}

.grayscale {
    filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="g"><feColorMatrix type="matrix" values="0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0"/></filter></svg>#g');
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1);
}

.footer {
    margin-top: 25px;
    padding-top: 0px !important;
    border: none;
    border-top: 1px solid #ccc;
}

.foot1 {
    padding-top: 20px;
    background-color: #eee;
    min-height: 320px;
}

.foot2 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    color: #fff;
    padding-top: 15px;
    min-height: 95px;
}

#nav-rapide .list-group a.list-group-item.active {
    position: sticky;
    top: -1px;
    background-color: #CD1719 !important;
}

.sidebar {
    height: auto !important;
    top: 0px !important;
    opacity: 1 !important;
    border-right: 2px solid #323266 !important;
    -webkit-box-shadow: 7px 0px 10px -5px rgba(0,0,0,0.55);
    box-shadow: 7px 0px 10px -5px rgba(0,0,0,0.55);
}

.toggler {
    top: 25% !important;
    width: 40px !important;
    background-color: #323266 !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    border-right: 5px solid #CD1719 !important;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

.sidebar-left > .toggler {
    right: -40px !important;
}

.head_titre {
    background-color: #333565;
    padding-top: 50px;
}

/*
* MENU
*/
.navbar {
    border-bottom: 1px solid #656792!important;
}
.navbar.fixed {
    border-bottom: 1px solid #333565!important;
    box-shadow: 0px 1px 3px 0px rgba(20,20.8,39.6,0.65);
    -webkit-box-shadow: 0px 1px 3px 0px rgba(20,20.8,39.6,0.65);
    -moz-box-shadow: 0px 1px 3px 0px rgba(20,20.8,39.6,0.65);
}
.navbar-default {
    opacity: 1;
}
.navbar-brand {
    margin-left: -10px!important;
}
.navbar-right-internet {
    background-color: inherit!important;
    margin-right: -15px;
}
.navbar-default .nav.navbar-nav .dropdown-menu {
    border-bottom: 1px solid #656792!important;
}
.navbar-default.fixed .nav.navbar-nav .dropdown-menu {
    border-bottom: 1px solid #333565!important;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:visited,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:visited,
.navbar-default .navbar-toggle,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:visited,
.navbar-default .navbar-nav .dropdown-menu > .active > a,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus,
.dropdown-menu {
    border: none !important;
}

.dropdown-submenu {
    position: relative;
}
.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    border: none !important;
}
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}
.dropdown-submenu > a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    margin-top: 5px;
    margin-right: -10px;
}

.navbar-default,
.navbar-right-internet,
.megamenu> li ul > li > a,
.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus,
.navbar-default .nav.navbar-nav > li > a:hover,
.navbar-default .nav.navbar-nav > li > a:focus,
.navbar-default .navbar-nav .dropdown-menu,
.navbar-default .nav.navbar-nav .dropdown-menu > li > a,
.navbar-default .nav.navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .nav.navbar-nav .open .dropdown-menu > li > a:focus,
.navbar-default .nav.navbar-nav > .open > a,
.navbar-default .nav.navbar-nav > .open > a:hover,
.navbar-default .nav.navbar-nav > .open > a:focus {
    background-color: #333565!important;
}
.navbar-default.fixed,
.navbar-right-internet.fixed,
.fixed .megamenu > li ul > li > a,
.navbar-default.fixed .nav.navbar-nav > li > a:hover,
.navbar-default.fixed .nav.navbar-nav > li > a:focus,
.navbar-default.fixed .navbar-nav .dropdown-menu,
.navbar-default.fixed .nav.navbar-nav .dropdown-menu > li > a,
.navbar-default.fixed .nav.navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default.fixed .nav.navbar-nav .open .dropdown-menu > li > a:focus,
.navbar-default.fixed .nav.navbar-nav > .open > a,
.navbar-default.fixed .nav.navbar-nav > .open > a:hover,
.navbar-default.fixed .nav.navbar-nav > .open > a:focus {
    background-color: #efefef!important;
}
.navbar-default .navbar-toggle .icon-bar,
.navbar-default .nav.navbar-nav > .open > a .caret,
.navbar-default .navbar-collapse .nav.navbar-nav > li > a,
.navbar-default .nav.navbar-nav > li > a,
.navbar-default .navbar-right-internet > li > a,
.navbar-default .nav.navbar-nav > .open > a,
.navbar-default .nav.navbar-nav > .open > a:hover,
.navbar-default .nav.navbar-nav > .open > a:focus,
.navbar-default .nav.navbar-nav > .dropdown > .dropdown-menu > li,
.navbar-default .nav.navbar-nav > .dropdown > .dropdown-menu > li > a,
.navbar-default .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > a,
.navbar-default .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > .dropdown-menu > li > a {
    color: #efefef!important;
}
.navbar-default .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > a:after {
    border-left-color: #efefef!important;
}
.megamenu > li ul > li.active > a,
.megamenu > li ul > .dropdown-header {
    color: #CD1719!important;
}
.megamenu > li ul > .dropdown-header {
    border-bottom-color: #CD1719!important;
}
.fixed .megamenu > li ul > li > a,
.navbar-default.fixed .nav.navbar-nav > .open > a .caret,
.navbar-default.fixed .navbar-collapse .nav.navbar-nav > li > a,
.navbar-default.fixed .nav.navbar-nav > li > a,
.navbar-default.fixed .navbar-right-internet > li > a,
.navbar-default.fixed .nav.navbar-nav > .open > a,
.navbar-default.fixed .nav.navbar-nav > .open > a:hover,
.navbar-default.fixed .nav.navbar-nav > .open > a:focus,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > li,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > li > a,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > li > a:hover,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav .dropdown-menu > .active > a,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > a,
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > .dropdown-menu > li > a {
    color: #333565!important;
}
.navbar-default.fixed .nav.navbar-nav > .dropdown > .dropdown-menu > .dropdown-submenu > a:after {
    border-left-color: #333565!important;
}
.fixed .megamenu > li ul > li.active > a,
.fixed .megamenu > li ul > .dropdown-header {
    color: #CD1719!important;
}
.fixed .megamenu > li ul > .dropdown-header {
    border-bottom-color: #CD1719!important;
}

.brand.ecox_blanc,
.brand.ecox_bleu {
    transform: scale(1.3);
}
.navbar-default .brand.ecox_blanc {
    display: block;
}
.navbar-default.fixed .brand.ecox_blanc {
    display: none;
}
.navbar-default .brand.ecox_bleu {
    display: none;
}
.navbar-default.fixed .brand.ecox_bleu {
    display: block;
}
/*
* MENU
*/

.hover {
    transition: all 0.2s linear 0s;
    -o-transition: all 0.2s linear 0s;
    -ms-transition: all 0.2s linear 0s;
    -moz-transition: all 0.2s linear 0s;
    -webkit-transition: all 0.2s linear 0s;
}

.hover:hover {
    box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.35)!important;
    -webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.35)!important;
    -moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.35)!important;
}

.vertical-text {
    z-index: -1;
    position: fixed;

    top: 0;
    height: 100vh;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;

    font-family: 'Present-Black'!important;
    font-size: 19vh!important;
    line-height: 1;
    font-weight: bold;
    cursor: default;
}

.vertical-text.text1 {
    left: 0;
    color: rgba(20, 20.8, 39.6, 0.1);
}

.vertical-text.text2 {
    left: 35px;
    color: rgba(20, 20.8, 39.6, 0.035);
}

.vertical-text.text3 {
    left: 70px;
    color: rgba(20, 20.8, 39.6, 0.015);
}

.material-symbols-outlined {
    font-size: inherit;
    line-height: inherit;
    vertical-align: bottom;
}

.icon_savoir_plus {
    font-size: 42px !important;
}