/*
 * @autor : dynamic creative
 * @date : 2019-2023
 * @version : 1.5
 * @bootstrap : 5
 */

/* ---------------------------- */
/*	   Mise en page générale	*/
/* ---------------------------- */
:root {
    --color-303 : #F59C00;
    --color-304 : #F57100;
    --color-404 : #7061A8;
    --color-308 : #A51008;
    --color-504 : #00ADBA;
    --color-505 : #006D8A;
    --color-808 : #0056A4;
    --color-bt-icon : #D9000D;
    --color-titre : #0070C0;
    --color-titre-2 : #1D1D1B;
}

/**/
#global {max-width:1920px; margin:0 auto;}
.container {max-width: 1170px;}

.light {font-weight: 200!important;}
.semi {font-weight: 500;}
.regular {font-weight: 400;}

.anim {visibility: hidden;}

.wimg {max-width: 100%; height: auto;}
.img-wrap {display:inline-block; overflow: hidden;}
.img-wrap img {transition: all 350ms ease; transform:scale(1);}
.img-wrap:hover img {transform:scale(1.02);}

h1 {font-size:56px;}
h1.titre--1 {color:#004695; text-transform: uppercase;}
h2 {font-size:32px; line-height: 1;}
h3 {font-size:24px; font-weight: bold; color:#004695;}

.titre--2 {position:relative; font-size:32px; color:#004695; font-weight: bold; margin-left:32px; padding-left:100px; margin-bottom:50px;}
.titre--2:before {content:''; position:absolute; top:50%; transform:translateY(-50%); left:0; width:64px; height:56px; background: url(../img/icon-bt.svg) center top no-repeat; background-size:contain;}

.titre--3 {font-size: 24px; color:var(--color-titre); text-transform: uppercase;}
.titre--4 {font-size: 32px; color:var(--color-titre-2); text-transform: uppercase;}

p.titre_1 {font-size:24px; font-weight:bold;}

video {width:100%; height:auto;}

/*loader*/
#loader {background:#38597c; width:100%; height: 100%; position:fixed; top:0; left:0; z-index: 999999; visibility:visible; opacity: 1; transition: all 500ms ease; text-align: center;}
#loader img {position: relative; top:50%; transform:translateY(-50%);}
.loaded #loader {visibility:hidden; opacity: 0;}

.json {position: relative; min-height:80px;}
.loadjson {position:absolute; top:15px; left:50%; transform:translateX(-50%);}

/*header*/
header {position: fixed; left:0; width:100%; z-index: 10; color:#fff; background-color:rgba(5,34,67,.85); height:100px; border-bottom:1px solid rgba(255,255,255,0.6); padding-top:16px; top:0; backdrop-filter: blur(3px);}
#logo {cursor: pointer;}

.menu-top li > a {position:relative; display:block; color:#fff;  padding:17px 16px; line-height: 1; font-size:14px; font-weight: bold; transition:all 350ms ease;}
.menu-top li > a:hover, .menu-top > li.active > a {text-decoration: none; color:#0070C0;}
.menu-top li > a:after {content:''; position: absolute; left:0; bottom:0; height:2px; width:0%; background:#0070C0; transition: all 350ms ease;}
.menu-top li:hover > a:after, .menu-top > li.active > a:after {width:100%;}
.menu-top li > a:before {content:''; position: absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:20px; background:#fff;}
.menu-top li:first-child > a:before {display:none;}

.tel {font-weight: bold;}
.tel-top .txt {border-left:1px solid #fff; margin-left:14px; padding-left:14px;}

header .container {transition:all 350ms ease;}
header a {color:#fff;}  


.hamburger {display:none;}

/*sous menu*/
.bl--ssmenu {visibility: hidden; opacity: 0; position:absolute; left:0; width:100%; background:rgba(5,34,67,.95); transition:all 350ms ease; padding:20px 0;}
.ssmenu:hover .bl--ssmenu  {/*display:block;*/ visibility: visible; opacity: 1;}
.cat--name {background:#004695; text-transform: uppercase; color:#A4A4A4; padding:7px 15px; font-size:14px; font-weight: bold;}
.cat--name.actif {color:#fff;}
.cat--link {height: 60px; position: relative; margin-top:1px;}
.cat--link:before {content:''; position: absolute; top:0; left:0; width:4px; height:100%; transition:all 350ms ease;}
.cat--link.cat--link-disabled:before {background-color:#5D5D5D;}
.cat--link:not(.cat--link-disabled):hover:before, .cat--link.active:not(.cat--link-disabled):before {width:100%;}
.cat a, .cat a:not([href]):not([tabindex]) {display:block; position: relative; color:#5D5D5D; font-size:16px; font-weight: bold; line-height: 1; padding-left:20px;}
.cat a:link, .cat a:visited {color:#fff;}
.cat a:hover {text-decoration: none;}
.cat a > span {display:block; font-weight:600; font-size:14px;}
.cat a > span.soon { font-size:10px; margin-top:2px;}

.c303.cat--link:before {background-color:var(--color-303);}
.c303 .liste li:before, .c303 h3 {color:var(--color-303);}
.c304.cat--link:before {background-color:var(--color-304);}
.c304 .liste li:before, .c304 h3 {color:var(--color-304);}
.c404.cat--link:before {background-color:var(--color-404);}
.c404 .liste li:before, .c404 h3 {color:var(--color-404);}
.c308.cat--link:before {background-color:var(--color-308);}
.c308 .liste li:before, .c308 h3 {color:var(--color-308);}
.c504.cat--link:before {background-color:var(--color-504);}
.c504 .liste li:before, .c504 h3 {color:var(--color-504);}
.c505.cat--link:before {background-color:var(--color-505);}
.c505 .liste li:before, .c505 h3 {color:var(--color-505);}
.c808.cat--link:before {background-color:var(--color-808);}
.c808 .liste li:before, .c808 h3 {color:var(--color-808);}


/*fil d'ariane*/
#ariane {font-size:14px;}
#ariane .ct {padding:20px 0; border-bottom:1px solid #F2F2F2;}
#ariane a {color:#1D1D1B;}
#ariane .current {color:#0070C0;}

/*footer*/
footer {position:relative; background:#052243 url(../img/map.png) center center no-repeat; background-size:cover; color:#fff; padding:150px 0 50px;}
footer a {color:#fff;}
.m_foot {margin-top:90px;}
.m_foot a {padding:0 5px;}
.m_foot a.active, .m_foot a:hover {text-decoration: none; color:#0070C0;}


/*rgpd*/
#rgpd{background:#3d3d3d; color:#fff; position: fixed; bottom: 0; left: 0; right: 0; z-index: 65530; display: none;}
section#rgpd > div > div {min-height: calc(2vh); padding: 1rem; font-size: 10pt; }
section#rgpd > div  a{ color: white; }

/*popup*/
.close {position: absolute; top:5px; right:10px; z-index: 2;}
.modal-content {border:none;}
.modal h2 {padding:0 0 20px;}

/*anim intro*/
header {transition:top 1000ms ease;}

.slide-home {display: flex;}
.slide-1 .txt {max-width: 768px;}
.logos {position: relative; height:64px;}
.logo_bt {position: absolute; left:calc(50% + 10px); top:0;}
.logo_vi {position: absolute; right:calc(50% + 10px); top:0;}
.logo_vi img {height:64px; width:auto;}

/*HOME*/
#s_top {background:#1f426a url(../img/intro.jpg) center top no-repeat; background-attachment: fixed; height:100vh; min-height:700px; /*transition:background-position 1.5s ease, background-size 1.5s ease;*/ color:#fff; overflow: hidden; padding-top:100px;}
#s_top .container {position: relative;}
#s_top .titre--1 {font-size:56px; text-transform: uppercase; color:#fff;}
/*.txtanim {opacity:0; top:300px;}*/
.header--list {margin-top:5%;}

.list--check {font-size:24px;}
.list--check li {position: relative; padding-left:70px; margin-bottom:30px;}
.list--check li:before {content:''; position: absolute; top:50%; left:0; transform: translateY(-50%); width:48px; height:48px; background:url(../img/check.svg) center top no-repeat; background-size: contain;}
#s_pr_bt {background:rgba(255,255,255,0.8); position: relative; z-index: 100; backdrop-filter: blur(3px);}
#s_pr_bt img {max-width:468px; width:100%; height:auto; transition: all 350ms ease;}
#s_pr_bt.isSticky {position: sticky; top:0;}
#s_pr_bt.isSticky img {width:200px;}
#s_pr .txt {padding:0 30px;}
#s_pr .titre-produit {font-weight: bold; text-transform: uppercase; /*margin-bottom:40px;*/ line-height: 1.2;}
#s_pr .titre-produit > div:first-child {margin-right:35px;}
#s_pr .b_btn > div + div {margin-left:16px;}
.img-produit img {border-radius: 20px;}

.item--distri {margin-bottom:30px;}
.item--distri:last-child {margin:0;}
.item--distri .txt {margin-left:48px;}

.list-picto > div {padding:5px 10px;}
.list-picto > div:first-child {/*padding-left:0;*/}
.list-picto > div:last-child {padding-right:0;}

/*Produits*/
#s_produits .item {perspective: 800px;}
#s_produits .bloc {position: relative;  }
#s_produits .bloc a {position: absolute; top:0; left:0; width:100%; height:100%;}
#s_produits .bloc {transition:all 500ms ease; transform: rotateY(0deg);}
#s_produits .bloc:hover {transform: rotateY(20deg);}

.logo-produit-sm {height:40px; width:auto;}
.logo-produit-lg {height:80px; width:auto;}

.b_car ul.liste li {margin-bottom:4px;}
ul.liste li {margin-bottom:12px;}
ul.liste li:before {content:'●'; font-size:10px; display: inline-block; vertical-align: top; margin-top:6px; padding-right:10px;}
.liste li:before {color:var(--color-titre);}
ul.liste-light li {margin-bottom:5px;}
ul.liste-light li:before {margin-top:4px;}

/*Produit*/
table {font-size:16px;}
table tr td {background-color:#E5ECF4; padding:15px 18px;}
table tr:nth-child(even) td {background-color:#F2F5FA;}

table.tab-type2 tr:nth-child(even) td {background-color:#F9F9F9;}

.b_car > .row {margin-bottom:30px;}
.b_car .bloc h3 {margin-bottom:15px;}
.b_car > .row > div > .bloc + .bloc {margin-top:30px;}

/*FAQ*/
#p_faq {background:url(../img/bg-faq.jpg) center top no-repeat;}
#b_faq .item {position:relative; margin-bottom:30px; background:rgba(255,255,255,0.75); padding-left:90px;}
#b_faq .item:before {content:''; position: absolute; top:30px; left:30px; width:32px; height:32px; background:url(../img/bulle-question.svg) center top no-repeat; background-size: contain;}
#b_faq .item h2 {font-size:16px; font-weight: bold; color:#004695; margin-bottom:10px;}
#b_faq .item p {font-size:14px;}
#b_faq .item a {color:#0070C0;}

/*MARQUE*/
#s_marque .b_img > div {text-align: right; margin-right:116px;}
#s_marque .b_img > div.img-decal {position:relative; margin-right:0; margin-top:-30px; margin-bottom:-30px; z-index: 2;}

.ct-txt h2, .ct-txt h3 {margin:20px 0;}
.ct-txt h1 {font-size:30px;}
.ct-txt h2 {font-size:20px;}
.ct-txt h3 {font-size:16px; color:#1D1D1B;}

/*connecte*/
.banniere-top {position: relative; padding:55px; overflow: hidden;}
.banniere-top .txt {max-width: 600px;}
.banniere-top h1 {font-size:32px;}
.banniere-top p {font-size:24px;}
.banniere-top .bg {position: absolute; top:50%; right:0; height:100%; width:auto; transform: translateY(-50%);}

.bloc-demi .item {max-width: 500px; margin-bottom:30px;}
.bloc-demi .item .img {margin-top:40px;}
.img-radius {border-radius: 20px; overflow: hidden;}

.pos-cee {position: absolute; top:0; right:20px; transform: translateY(-50%);}

.bloc-abo .bloc-prix {border-radius: 20px; color:#fff; font-size:34px; font-weight: bold; text-align: center; padding:45px 20px;}
.bloc-prix .t1 {font-size:2.75em;}
.bloc-prix .t2 {font-size:0.91em;}
.bloc-prix .t3 {font-size:0.53em;}

.img-fit {height:343px; width:100%; object-fit: cover;}

.img-produit-acc {position:relative; margin-top:-120px;}

/**/
body:not(.home) #global {padding-top:100px;}

.bloc {position: relative; -webkit-box-shadow: 0 8px 20px 0 rgba(0,0,0,0.06);
box-shadow: 0 8px 20px 0 rgba(0,0,0,0.06); border-radius:16px; background:#fff;}
.bloc-type1 {padding:60px;}
.bloc-type2 {padding:30px;}

/*bouton*/
.btn-primary {line-height: normal; background:#004695; color:#fff; border: none; border-radius: 50px; padding: 16px 1.5rem; width: auto; font-size:14px; font-weight: 700; text-transform: uppercase;}
.btn-primary:hover,.btn-primary:active,.btn-primary:focus {background:#004695; color:#fff; border: none; }
.btn-primary:not(:disabled):not(.disabled):active{ background:#004695; color:#fff; }

.btn-secondary {line-height: normal; background:#D9000D; color:#fff; border: none; border-radius: 50px; padding: 16px 1.5rem; width: auto; font-size:14px; font-weight: 700; text-transform: uppercase;}
.btn-secondary:hover,.btn-secondary:active,.btn-secondary:focus {background:#D9000D; color:#fff; border: none; }
.btn-secondary:not(:disabled):not(.disabled):active{ background:#D9000D; color:#fff; }

.btn-icon {line-height: 1; position: relative; padding-left: 25px;}
.btn-icon span {position: absolute; top: 50%; transform: translateY(-50%); left: 0;}
.btn-doc span img {height:20px; width:auto;}
.btn-doc {text-transform: uppercase; font-size:14px; color:var(--color-bt-icon); font-weight: bold;}

/*FORM*/
.form-control-lg { color: #ffffff; background:transparent; border: solid 2px #fff; font-family: 'Helvetica Now Display', sans-serif; border-radius:24px; padding: .5rem 1.1rem;}
.form-control:focus { color:#003760;  background:#fff; border-color:#fff; }
textarea.form-control-lg {min-height:120px; padding-top:18px;}
/*
input::placeholder { color: #ffffff; }
input::-webkit-input-placeholder { color: #ffffff !important; }
input::-moz-placeholder { color: #ffffff !important; }
input:-ms-input-placeholder { color: #ffffff !important; }
input:-moz-placeholder { color: #ffffff !important; }
*/
select.form-control-lg {padding:0rem .8rem;}

div.error {font-size:12px; color:orangered; position: absolute; bottom:-15px; margin:0;}
.custom-checkbox div.error {}

.btn-loader {position: relative;}
.btn-loader img {display:none; position: absolute; top:50%; right:20px; transform:translateY(-50%);}
form.active .btn-loader img {display:block;}

/*formules*/
.item-formule > .ct {background:#fff; box-shadow: 0 8px 20px 0 rgba(0,0,0,.06); border-radius: 16px; height: 100%;}
.formule-top {border-radius: 16px; background:#A4A4A4; padding:24px; font-weight: bold; font-size:38px; text-align: center; color:#fff; line-height: 1; min-height: 209px;}
.formule-titre {font-size:1em;}
.formule-bt {padding:0 24px 24px;}
.formule-prix div:first-child {font-size:1.79em;}
.formule-prix div:last-child {font-size:.58em; text-align: left; padding-bottom: 8px; padding-left: 5px;}
.formule-install {font-size: 0.6em;}
.formule-desc {font-size:.42em;}
.formule-ct {padding:24px;}
.formule-ct .item {position: relative; font-size:14px; font-weight:500; padding:10px 0 0 30px;}
.formule-ct .item .item-titre-1 {display:block; font-size:12px; text-transform: uppercase;}
.formule-ct .item:before {content:''; width:24px; height:24px; position: absolute; top:6px; left:0;}
.item.check:before {background:url(../img/icon-check.svg) no-repeat;}
.item.uncheck:before {background:url(../img/icon-uncheck.svg) no-repeat;}
.item.uncheck {color:#A4A4A4; text-decoration:line-through; }

.item-formule-perso .formule-top {font-size:27px; background-color:#052243;}
.item-formule-perso .formule-sstitre {font-size:0.83em;}
.item-formule-perso .formule-desc {font-size:0.83em;}

.item-formule-standard .formule-top {background-color:#0070C0;}
.item-formule-premium .formule-top {background-color:#004695;}

.formules-ast {color:#a4a4a4;}

/*plugin*/
#scrollUp { bottom: 10px; right: 10px; height: 48px; width: 48px; overflow: hidden; background: none; /*font-size: 40px; color: #3494BA; text-shadow: 0 0 4px rgba(0,0,0,0.2);*/ z-index: 99998 !important; }

/*bt 4 to 5*/
.form-floating > .form-control, .form-floating > .form-control-plaintext {
}
.form-floating > .form-control, .form-floating > .form-control-plaintext, .form-floating > .form-select {height:50px;}
.form-floating > label {padding:.8rem 1.4rem 0;}
.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {color:#d7d3d9;}
.form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:not(:placeholder-shown), .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown){padding-top:1.4rem;}

/*MODAL*/
.modal {
    --bs-modal-width: 760px;
    --bs-modal-padding: 20px;
    --bs-modal-bg:#fff;
    --bs-modal-border-width: 0;
    --bs-modal-border-radius: 20px;
    --bs-modal-box-shadow: -48px 96px 160px rgba(0, 0, 0, 0.25);
}

.modal-form {
    --bs-modal-width: 480px;
}

.modal.fade .modal-dialog.modal-dialog-zoom {-webkit-transform: translate(0,0)scale(.5);transform: translate(0,0)scale(.5);}
.modal.show .modal-dialog.modal-dialog-zoom {-webkit-transform: translate(0,0)scale(1);transform: translate(0,0)scale(1);}

.modal .btn-close {position: absolute; top:10px; right:10px; background-size: contain; width:16px; height:16px; z-index: 3; padding:0; color:#3D4246; opacity: 1;}
.btn-close:focus {box-shadow: none;}
.btn-close {transform:rotate(0); transition:all 350ms ease;}
.btn-close:hover {transform:rotate(180deg); transform-origin: center;}