/**
 * Forms
 */

/* All elements */
.field { margin-bottom: 30px; position:relative; }
.field label { display: inline-block; margin:0; }

[data-validate-for] { display:none; font-size:10px; line-height:10px; position:absolute; right:0; bottom:-1.2em; }
[data-validate-for].visible { display:block; }

/* Textfields & textareas */
.field.textfield input,
.field.textarea textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; }

/* Checkbox & Radio */
.field.checkbox label,
.field.radio label { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; position:relative; margin-bottom:10px; cursor: pointer; }

.field.checkbox input,
.field.radio input,
.field.checkbox span:before,
.field.radio span:before { width:20px; height:20px; margin-right:10px; }

.field.checkbox span:before,
.field.radio span:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); border:1px solid #ccc; background:#fff; }

.field.checkbox span:after,
.field.radio span:after { content:''; position:absolute; left:3px; top:50%; transform:translateY(-50%); width: 14px; height:14px; background:#ccc; opacity:0; transition:all 0.5s ease 0s; }

.field.checkbox input:checked+span:after,
.field.radio input:checked+span:after { opacity: 1; }

.field.checkbox span:before,
.field.checkbox span:after { border-radius: 0; }

.field.radio span:before,
.field.radio span:after { border-radius: 50%; }

.field.radio.inline,
.field.checkbox.inline { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
.field.radio.inline label,
.field.checkbox.inline label { margin-right:15px; margin-bottom:0; }

/* Select */
.field.select select { display:block; width:100%; padding:10px; border:1px solid #ccc; }

/* Captcha */
.field.captcha { display:flex; flex-direction:row; justify-content:center; }

/**
 * Navigation
 **/
 
/* Frontend editor */
.ct-widget.ct-ignition { position:fixed; left:auto; top:auto; right:20px; bottom:20px; z-index:10000; transition:all 0.5s ease 0s; }
.ct-widget.ct-ignition .ct-ignition__button { position:static; margin-top:10px;}

.ce-element { outline:2px dashed rgba(243, 156, 18, 0.5); }
.ce-element--focused, .ce-element:focus { outline:2px dashed rgba(243, 156, 18, 1); }

/**
 * Legal
 **/
.legal { margin:60px 0; }
.legal h1 { font-size:4rem; margin:0 0 1em 0; }
.legal h2 { font-size:3rem; margin:1em 0; }
.legal h3 { font-size:2.5rem; margin:1em 0; }
.legal h4 { font-size:2rem; margin:1em 0; }
.legal h5 { font-size:1.5rem; margin:1em 0; }
.legal table { width:100%; margin:2em 0; }
.legal table th,
.legal table td { padding:1em; border:1px solid rgba(0,0,0,0.25); }
/**
 * General Elements
 **/

html { font-size:10px; }
body { font-size:1.8rem; font-family:'Montserrat', sans-serif; background:#dfe5f0; color:#072557; } 
:focus, button:focus { outline:none; }

/* Images */
img, svg { max-width:100%; height:auto; }
img[data-sizes] { display:block; width:100%; }

/* Paragraphs */
p { margin-bottom:1em; line-height:1.8em; }
p:last-child { margin-bottom:0; }

/* Link */
a { color:inherit; }
a:hover { text-decoration:none; }

/* Lists */
ul, ol { margin-bottom:0; padding:0; list-style:none; }

/* Titles */
h1 { font-size:4rem; font-weight:900; color:#2B559B; text-align:center; margin-bottom:1em; text-transform:uppercase; line-height:1.2em; }
h2 { font-size:3.6rem; font-weight:900; color:#2B559B; margin-bottom:1em; }
h3 { font-weight:800; }

/**
 * Components
 **/

/* General */
.padding { padding-top:80px; padding-bottom:80px; }
.arrow-bottom { margin:15px auto; position:relative; width:48px; display:block; }
.trait:before { content:''; width:50px; height:8px; background:#FF0000; display:block; margin:50px 0 50px 0; }
.mini { padding-left:100px; padding-right:100px; }
.fullwidth { margin-left:-30px; margin-right:-30px; }
.text-center { text-align:center; }

/* Alert */
.alert { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; }
.alert .close { display:none; }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; }
.alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db; }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }
.alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }

/* Buttons */
.btn { display:inline-flex; flex-direction:row; align-items:center; justify-content:center; border:1px solid #fff; font-size:2rem; font-weight:800; border-radius:50px; padding:15px 50px; transition:all 0.5s ease 0s; }
.btn svg { margin-left:15px; min-width:15px; position:relative; right:0; transition:all 0.3s ease 0s; }
.btn:hover svg { right:-5px; }

.btn.red { /*background: linear-gradient(to bottom, rgba(255,0,0,1) 0%,rgba(128,0,0,1) 100%);*/  color:#fff; border:none; position:relative; z-index:1; }
.btn.red:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; border-radius:50px; background: linear-gradient(to right, #f00 0%, #800000 100%); z-index:-1; transition:all 0.3s ease 0s; }
.btn.red:hover:before { transform:scale(1.1); }


.btn.outline { border-color:#fff; color:#fff; background:transparent; position:relative; }
.btn.outline.blue { position:relative; border:none; color:#072557; }
.btn.outline.blue svg { stroke:#072557; }

.btn.outline.blue:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #072557; border-radius:50px; transition:all 0.3s ease 0s; }
.btn.outline.blue:hover:before { transform:scale(1.1); }

/* Forms */
.field label { font-size:1.6rem; position:absolute; left:30px; top:50%; transform:translateY(-50%); transition:all 0.3s ease 0s; }

.field.textfield input { border:none; box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2); padding:25px 0px 5px 30px; }

.field.textarea label { top:30px; transform:translateY(0); }
.field.textarea textarea { border:none; box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.2); padding:30px; }

.field.active label,
.field.filled label { top:5px; transform:translateY(0); }

[data-validate-for] { bottom:-1.8em; }

/* Hamburgers */
.hamburger { display:none; padding:0; height:24px; }

/**
 * Layout
 **/

#page { position:relative; width:100%; overflow:hidden; }
#main { margin-top:150px; }
#bg { background:#fff; padding:30px; position:relative;  }
#emblem { position:absolute; right:0; top:200px; margin-right:-200px; max-width:400px; opacity:0.06; z-index:2; animation: spin 60s linear infinite; pointer-events:none; }
@keyframes spin { 
    from { transform: rotate(0deg); } 
    to { transform: rotate(360deg); }
}

#header { position:fixed; left:0; top:0; width:100%; background:#fff; z-index:5; /*border-bottom:1px solid #dedede; */}
#header .mainrow { height:150px; align-items:stretch; justify-content:space-between; transition:all 0.5s ease 0s; }

#header .logo { display:flex; flex-direction:column; align-items:flex-start; justify-content: center; padding-top:20px; padding-bottom:20px;}
#header .logo, #header .logo * { height:100%; transition:all 0.5s ease 0s; }
#header .navigation { display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; }
#header .navigation .menu { display:flex; flex-direction:row; align-items:flex-start; justify-content: flex-end; }
#header .navigation .menu .item { margin-left:30px; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; flex-wrap:nowrap; }
#header .navigation .menu .icon { margin-right:15px; }
#header .navigation .menu .item.active > a > span { position:relative; }
#header .navigation .menu .item.active > a > span:after { content:''; position:absolute; left:0; bottom:-41px; width:100%; height:5px; background:#ff0000; transition:all 0.5s ease 0s; }
#header .navigation .top { position:relative; color:#fff; padding:15px 0 15px 80px; }
#header .navigation .top:after { content:''; position:absolute; left:0; top:0; width:100vw; height:100%; background:#072557; z-index:-1; }
#header .navigation .bottom { display:flex; height:100%; flex-direction:row; align-items:center; justify-content:flex-end; }
#header .navigation .bottom .item { margin-left:25px; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; position:relative; }
#header .navigation .bottom .item a { white-space:nowrap; font-weight:600; }
#header .navigation .bottom .item a:hover { color:#ff0000; }
#header .navigation .bottom .icon { margin-left:5px; }
#header .navigation .bottom .dropdown-menu { position:absolute; padding:10px 0; left:-10px; top:54px; height:auto; background:#fff; opacity:0; pointer-events:none; transition:all 0.5s ease 0s; box-shadow: 0px 3px 6px rgba(7, 37, 87, 0.16); }
#header .navigation .bottom .dropdown-menu a { padding:15px; display:block; }
#header .navigation .bottom .dropdown-menu span { padding:0 5px; position:relative; display:inline-block; }
#header .navigation .bottom .dropdown-menu span:after { content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#fff; }
#header .navigation .bottom .dropdown-menu li { margin:0; }
#header .navigation .bottom .dropdown-menu li.dropdown-active span:after { background:#ff0000; }
#header .btn.responsive { display:none; }

#header .btn.red:after { content:''; position:absolute; left:0; top:0; width:100%; height:100%; animation:micropulse 2s infinite; border-radius:50px; pointer-events:none; }
#header .btn.red:hover:after { animation:none; }
@keyframes micropulse { 
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0.55); }
    70% { transform: scale(1); box-shadow: 0 0 0 25px rgba(192, 13, 25, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0); }
}

#header .navigation .bottom li.open .dropdown-menu { opacity:1; pointer-events: auto; }


#header .socials { display:flex; flex-direction:column; align-items:flex-start; justify-content: center; }
#header .socials ul { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; }
#header .socials li { margin:0 10px; }
#header .socials a { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; }
#header .socials svg { fill:#072557; }

#header.not-top .navigation { font-size:1.6rem; }
#header.not-top .mainrow { height:120px; }
#header.not-top .navigation .bottom .dropdown-menu { top:45px;}
#header.not-top .navigation .menu .item.active > a > span:after { bottom:-26px; }
#header.not-top .btn.red { font-size:1.6rem; }

#header .btn.red { padding:10px 15px; text-transform:uppercase; font-size:1.8rem; white-space:nowrap; margin-left:15px; }

#header .trigger { position:relative; cursor:pointer; }
#header .dropdown { opacity:0; pointer-events:none; transition:all 0.5s ease 0s; position:absolute; left:0; top:35px; background:#072557; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; padding:15px; z-index:2; }
#header .dropdown li { white-space:nowrap; margin:5px 0; }
#header .trigger.open .dropdown { opacity:1; pointer-events:auto; }

#magic-line { position: absolute; bottom: -3px; left: 0; width:100%; height: 7px; }
#magic-line-inner { position:absolute; width:50px; left:50%; transform:translateX(-50%); height:100%; background:#ff0000; }

#header .navigation .bottom .active .icon { transform:rotate(0); }

#footer { background:#2B559B; color:#fff; }
#footer .left, #footer .right { padding:50px 30px; }
#footer .left { background:#072557; }
#footer .left .menu { font-size:1.8rem; text-transform:uppercase; }
#footer .left .menu li { margin-bottom:15px; }
#footer .left .logos { text-align:center; }
#footer .left .logos .idoux { margin-top:30px; display:inline-block; }
#footer .left .bottom { margin-top:50px; font-size:1.2rem; }
#footer .left .bottom ul { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#footer .left .bottom li { margin:0 10px; }
#footer .right .top .address { display:flex; flex-direction:row; align-items:flex-start; justify-content: flex-start; font-size:1.6rem; }
#footer .right .top .address img { margin-right:15px; }
#footer .right .top .address b { font-weight:900; }
#footer .right .top .address a:hover { color:#fff; text-decoration:underline; }
#footer .right .bottom { text-align:center; margin-top:50px; }
#footer .right .bottom .title { font-size:1.6rem; font-weight:900; margin-bottom:30px; }
#footer .right .bottom .contact .btn { padding:10px 30px; text-transform:uppercase; font-weight:bold; max-width:100%; }
#footer .right .bottom .contact .btn svg { margin-left:30px; min-width:30px; }
#footer .right .bottom .evolutrans .title { font-weight:500; font-size:1.2rem; line-height:2.2em; }
#footer .right .bottom .socials ul { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#footer .right .bottom .socials li { margin:0 15px; }
#footer .right .bottom .socials svg { width:25px; max-height:25px; }

#sticky { position:fixed; right:0; bottom:100px; }
#sticky a { display:block; width:100px; height:100px; display:flex; flex-direction:row; align-items:center; justify-content:center; padding:30px; transition:all 0.5s ease 0s; }
#sticky img { filter:brightness(0) invert(1); }
#sticky li:nth-child(odd) a { background-color:#072557; }
#sticky li:nth-child(odd) a:hover { background-color:#144493; }
#sticky li:nth-child(even) a { background-color:#144493; }
#sticky li:nth-child(even) a:hover { background-color:#072557; }

#heading { margin-left:-30px; margin-right:-30px; position:relative; }
#heading.trait:before { margin-left:30px; margin-bottom:0; }
#heading video { position:absolute; width:100%; height:100%; object-fit:cover; object-position:center center; }

#panels { margin-left:-30px; margin-right:-30px; }

#intro { position:relative; }
#intro h2 { margin-top:1em; font-size:2.6rem; font-weight:800; margin:2em 0 1em 0; color:#072557; }
#intro h3 { font-size:2.2rem; font-weight:800; margin:2em 0 1em 0; }
#intro ul { margin-bottom:15px; }
#intro li { display:flex; flex-direction:row; align-items:flex-start; justify-content: flex-start; }
#intro li:before { content:'-'; display:inline-block; margin-right:15px; }


#next { position:relative; }
#next h2 { margin-top:1em; font-size:2.6rem; font-weight:800; margin:2em 0 1em 0; color:#072557; }
#next h3 { font-size:2.2rem; font-weight:800; margin:2em 0 1em 0; }
#next ul { margin-bottom:15px; }
#next li { display:flex; flex-direction:row; align-items:flex-start; justify-content: flex-start; }
#next li:before { content:'-'; display:inline-block; margin-right:15px; }

#breadcrumb { color:rgba(43,85,155,0.5); font-size:1.6rem; font-weight:bold; text-transform:uppercase; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; margin-bottom:15px; }
#breadcrumb img { margin-right:15px; }

/**
 * Page specific
 **/

/* Accueil */

#accueil #main { margin-top:150px; }
#accueil #bg { padding-bottom:0; }
#accueil #heading { min-height:600px; max-height:700px; background-size:cover; background-repeat:no-repeat; background-position:center center; position:relative; overflow:hidden; }
#accueil #heading .panel { transition:all 1s ease 0s; clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%); transform:translateX(-100%); background:#072557; height:calc(100% + 60px); width:30%; position:absolute; left:0; top:-30px; z-index:2; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; }
#accueil #heading .panel .logo { margin-right:20%; max-width:50%; }
#accueil #heading.open .panel { transform:translateY(0); }
#accueil #emblem { top:200px; }
#accueil #intro { padding-top:30px; padding-bottom:30px; }
#accueil #icons { text-align:center; padding-top:30px; padding-bottom:30px; }
#accueil #icons .row { align-items:flex-start; justify-content: center; }
#accueil #icons .title { font-size:2rem; font-weight:900; color:#072557; margin-bottom:15px; }
#accueil #intro .text h1 { text-align:left; font-size:6rem; color:#072557; line-height:1.2em; }
#accueil #intro .text p { font-weight:300; }
#accueil #intro .images { margin-top:50px; }
#accueil #intro .images li:before { content:none; }
#accueil #intro .images .link { position:relative; display:block; overflow:hidden; width:100%; }
#accueil #intro .images .link img { transition:all 0.5s ease 0s; }
#accueil #intro .images .caption { position:absolute; left:30px; bottom:50px; font-size:1.6rem; font-weight:900; color:#fff; z-index:2; text-transform:uppercase; letter-spacing:1px; }
#accueil #intro .images .link:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:#072557; opacity:0.50; z-index:1; pointer-events:none; }
#accueil #intro .images .link:hover img { transform:scale(1.1); }
#accueil #intro .arrow-bottom { margin-top:50px; }
#accueil #panels .caption { text-align:center; }
#accueil #panels .caption .text { margin-bottom:15px; }
#accueil #panels .brochure .caption { position:absolute; z-index:2; right:50px; bottom:30px; color:#fff;}
#accueil #panels .facebook { background:rgba(43,85,155,0.3); display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:30px; }
#accueil #panels .facebook .caption { margin-top:30px; }
#accueil #panels .item { height:100%; }
#accueil #panels .item img { height:100%; object-fit:cover; }
#accueil #form .container { min-width:900px; }
#accueil #form .bottom { align-items:center; justify-content: flex-end; }
#accueil #form .captcha,
#accueil #form .submit { margin:0; }

/* Agences */
#agences #panels .image { position:relative; text-align:center; }
#agences #panels .image .caption { position:absolute; left:0; bottom:0; width:100%; padding:30px 60px 15px 60px; color:#fff; background:rgba(6,35,82,0.5);}
#agences #panels .image .title { font-size:3rem; font-weight:800; text-transform:uppercase; color:#fff; }
#agences #panels .image .row { align-items:center; justify-content: space-evenly; font-size:5rem; font-weight:800; }
#agences #panels .image .chiffres img { position:relative; bottom:15px; }
#agences #panels .text { padding:30px; }
#agences #panels .text h3 { font-size:2.2rem; font-weight:800; margin:0 0 1em 0; }
#agences #panels .gallery .image { text-align:left; }

#agences #images { margin-top:50px; }
#agences #images .row {  }
#agences #images ul { list-style:disc; margin-left:50px; }
#agences #images ul li { margin:10px 0; }
#agences #images .right img { padding:0 100px; }

#agences #images .image { position:relative; overflow:hidden; margin-bottom:10px; }
#agences #images .image .hover { position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; object-fit:cover; object-position:center center; opacity:0; transition:all 0.5s ease 0s; }
#agences #images .image:hover .hover { opacity:1; }

/* Transport */
#transport #heading { position:relative; margin:0 -30px 50px -30px; }
#transport #heading .caption { position:absolute; left:0; top:0; width:100%; text-align:center; padding:50px 100px; background:rgba(6,35,82,0.5); color:#fff; font-weight:1.8rem; font-weight:bold; }
#transport #heading .caption .col { display:flex; flex-direction:column; justify-content:flex-start; align-items:center; }
#transport #heading .caption .icon { margin-bottom:30px; height:80px; max-width:130px; }
#transport #intro h3 { font-size:2.2rem; font-weight:900; margin:2em 0 0 0; }
#transport #intro li:before { content:'-'; display:inline-block; }
#transport #map { text-align:center; position:relative; }
#transport #map .bigmarker { position:absolute; margin-left:-25px; margin-top:-65px; }
#transport #map .bigmarker1 { left:58.5%; top:63%; }
#transport #map .bigmarker2 { left:55%; top:69%; }
#transport #map .bigmarker img { position:relative; z-index:1; }
#transport #map .bubble { position:absolute; top:100px; right:100px; max-width:350px; text-align:left; }
#transport #map .bubble li { position:relative; }
#transport #map .bubble li:nth-child(1):before { content:''; position:absolute; left:-30px; top:2px; width:20px; height:20px; border-radius:50%; background:#78bce1; }
#transport #map .bubble li:nth-child(3):before { content:''; position:absolute; left:-30px; top:2px; width:20px; height:20px; border-radius:50%; background:#bce5f9; }
#transport #map .pulse { position:absolute; z-index:0; bottom:-25px; left:50%; background: rgba(192, 13, 25, 0.55); border-radius: 50%; box-shadow: 0 0 0 0 rgba(192, 13, 25, 0.55); margin-left:-30px; height: 60px; width: 60px; transform: scale(1); animation: pulse 2s infinite; }
@keyframes pulse { 
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0.55); }
    70% { transform: scale(1); box-shadow: 0 0 0 50px rgba(192, 13, 25, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0); }
}

/* Distribution */

#distribution #heading { margin-top:50px; }
#distribution #heading .swiper-pagination { position:static; display:flex; flex-direction:row; align-items:center; justify-content:center; margin-top:30px; }
#distribution #map { position:relative; }
#distribution #map .bigmarker { position:absolute; margin-left:-25px; margin-top:-65px; }
#distribution #map .bigmarker1 { left:28%; top:66%; }
#distribution #map .bigmarker2 { left:26%; top:69%; }
#distribution #map .bigmarker img { position:relative; z-index:1; }
#distribution #map .bubble { position:absolute; top:50px; left:0; text-align:left; }
#distribution #map .pulse { position:absolute; z-index:0; bottom:-25px; left:50%; background: rgba(20, 68, 147, 0.55); border-radius: 50%; box-shadow: 0 0 0 0 rgba(20, 68, 147, 0.25); margin-left:-30px; height: 60px; width: 60px; transform: scale(1); animation: pulse2 2s infinite; }
@keyframes pulse2 { 
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(20, 68, 147, 0.55); }
    70% { transform: scale(1); box-shadow: 0 0 0 50px rgba(20, 68, 147, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(20, 68, 147, 0); }
}

/* Qui sommes-nous */
#qui-sommes-nous #valeurs { text-align:center; }
#qui-sommes-nous #valeurs .row { margin-top:50px; }
#qui-sommes-nous #valeurs .icon { height:60px; max-width:100px; margin-bottom:50px; }
#qui-sommes-nous #valeurs .bg { margin-left:-30px; margin-right:-30px; }

#qui-sommes-nous #history h2 { text-align:center; }
#qui-sommes-nous #history .date { display:flex; flex-direction:row; align-items:flex-start; justify-content: flex-start; margin-bottom:30px; }
#qui-sommes-nous #history .date .annee { font-weight:bold; font-size:2.6rem; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#qui-sommes-nous #history .dot .inner { content:''; display:block; width:16px; height:16px; background:#072557; border-radius:100%; margin:8px 30px 0 30px; }

/* Partenaires */
#partenaires #intro { padding:50px 0; text-align:center;}
#partenaires #listing li:nth-child(odd) .text { order:1; }
#partenaires #listing li:nth-child(odd) .image { order:2; }
#partenaires #listing li:nth-child(even) .text { order:2; }
#partenaires #listing li:nth-child(even) .image { order:1; }
#partenaires #listing .record { margin-bottom:80px; }
#partenaires #listing .record .row { justify-content: space-between; }
#partenaires #listing .record .title { text-transform:uppercase; }

/* Logistique */
#logistique #intro .images img { margin-bottom:30px; }
#logistique #intro .center { display:block; margin:0 auto; }

/* Contact */
#contact .sidebar img { margin:0 auto 30px auto; display:block; }
#contact .sidebar h1 { color:#072557; text-align:left; text-transform:none; font-size:4.9rem; margin-bottom:0.5em; }

#contact #form .bottom { justify-content: flex-end; align-items:center; }
#contact #form .bottom .field { margin-bottom:0; }

#contact #map { text-align:center; position:relative; }
#contact #map .bigmarker { position:absolute; margin-left:-25px; margin-top:-65px; }
#contact #map .bigmarker1 { left:67.9%; top:23%; }
#contact #map .bigmarker2 { left:60%; top:69%; }
#contact #map .bigmarker img { position:relative; z-index:1; }
#contact #map .bubble { position:absolute; top:100px; right:100px; max-width:350px; text-align:left; }
#contact #map .pulse { position:absolute; z-index:0; bottom:-25px; left:50%; background: rgba(192, 13, 25, 0.55); border-radius: 50%; box-shadow: 0 0 0 0 rgba(192, 13, 25, 0.55); margin-left:-30px; height: 60px; width: 60px; transform: scale(1); animation: pulse3 2s infinite; }
@keyframes pulse3 { 
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0.55); }
    70% { transform: scale(1); box-shadow: 0 0 0 50px rgba(192, 13, 25, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(192, 13, 25, 0); }
}

/* Idoux */
#idoux h1 + p { text-align:center; font-size:2rem; font-weight:bold; }
#idoux #intro { text-align:center; }
#idoux #intro .btn { margin-bottom:50px; }
#idoux #intro .url { font-size:2.6rem; font-weight:bold; }

/* Actualités */
#actualites-listing #bg { padding-left:5vw; padding-right:5vw; }
#actualites-listing h1 { margin-bottom:0.5em; }
#actualites-listing .baseline { text-align:center; font-size:2.2rem; font-weight:800; color:#072557; }
#actualites-listing .records { margin-top:30px; overflow:visible !important; }
#actualites-listing .record { box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15); margin-bottom:30px; display:block; }
#actualites-listing .record .image { border-top:8px solid #FF0000; overflow:hidden; }
#actualites-listing .record .image img { transition:all 1s ease 0s; }
#actualites-listing .record .text { padding:30px; }
#actualites-listing .record .btn { margin-top:30px; padding:10px 30px;  }
#actualites-listing .record:hover .image img { transform:scale(1.2); }
#actualites-listing .record:hover .btn:before { transform:scale(1.1); }

#actualites-listing .pagination ul { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#actualites-listing .pagination li { margin:0 1rem; }
#actualites-listing .pagination li.prev svg,
#actualites-listing .pagination li.next svg { width:32px; height:32px; display:flex; align-items:center; justify-content:center; border:1px solid #707070; padding:8px; border-radius:50%; }
#actualites-listing .pagination li.prev a,
#actualites-listing .pagination li.next a { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#actualites-listing .pagination li.prev { margin-right:auto; font-size:1.3rem; text-transform:uppercase; font-weight:bold; width:20%; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#actualites-listing .pagination li.next { margin-left:auto; font-size:1.3rem; text-transform:uppercase; font-weight:bold; width:20%; display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
#actualites-listing .pagination li.prev svg { margin-right:1rem; }
#actualites-listing .pagination li.next svg { margin-left:1rem; }
#actualites-listing .pagination li.number a { width:50px; height:50px; border-radius:50%; border:1px solid #707070; color:#2B559B; display:flex; align-items:center; justify-content:center; transition:all 0.5s ease 0s; font-weight:bold; }
#actualites-listing .pagination li.number.active a,
#actualites-listing .pagination li.number a:hover { background:#2B559B; color:#fff; border-color:#2B559B; }

#actualites-detail h1 { text-align:left; margin-top:1em; }
#actualites-detail #breadcrumb { margin-bottom:50px; }
#actualites-detail .content .date { font-weight:600; display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#actualites-detail .content .date svg { margin-right:1rem; }
#actualites-detail .content { padding-left:5vw; padding-right:5vw; }
#actualites-detail .content .image { border-top:8px solid #FF0000; box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15); }
#actualites-detail .content .right .cta { margin-top:50px; }
#actualites-detail .content .right .btn { padding:10px 15px; }
#actualites-detail .content .right .latest { margin-top:50px; }
#actualites-detail .content .right .latest ul { background:#2B559B; padding:30px; }
#actualites-detail .content .right .latest li:not(:last-child) { margin-bottom:15px; }
#actualites-detail .content .right .latest a { color:#fff; font-weight:bold; display:flex; flex-direction:row; align-items:center; justify-content:space-between; font-size:1.4rem; }
#actualites-detail .content .right .latest svg { min-width:32px; min-height:32px; border:1px solid rgba(255,255,255,0.3); border-radius:50%; display:flex; align-items:center; justify-content:center; padding:8px; stroke:#fff; margin-left:15px; position:relative; right:0; transition:all 0.5s ease 0s; }
#actualites-detail .content .right .latest span { position:relative; }
#actualites-detail .content .right .latest span:after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:#fff; transition:all 0.5s ease 0s; }
#actualites-detail .content .right .latest a:hover span:after { width:100%; }
#actualites-detail .content .right .latest a:hover svg { right:-5px; }


#actualites-detail .bottom-latest { margin-top:30px; padding-top:30px; }
#actualites-detail .bottom-latest .slider { position:relative; }
#actualites-detail .bottom-latest { border-top:1px solid rgba(53,85,150,0.3); margin-left:5vw; margin-right:5vw; }
#actualites-detail .bottom-latest h2 { font-size:2.2rem; font-weight:bold; margin-top:0; margin-bottom:30px; }
#actualites-detail .bottom-latest .swiper { }
#actualites-detail .bottom-latest .swiper-wrapper { box-sizing:border-box; }
#actualites-detail .bottom-latest .swiper-slide {  }
#actualites-detail .bottom-latest .record { border:1px solid rgba(53,85,150,0.3); margin-bottom:30px; display:block; /*box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15);*/ }
#actualites-detail .bottom-latest .record h3 { color:#2B559B; }
#actualites-detail .bottom-latest .record .image { border-top:none; box-shadow:none; overflow:hidden; }
#actualites-detail .bottom-latest .record .image img {transition:all 1s ease 0s;}
#actualites-detail .bottom-latest .record:hover .image img { transform:scale(1.2); }
#actualites-detail .bottom-latest .record .text { padding:30px; margin:0; }
#actualites-detail .bottom-latest .record .btn { margin-top:30px; font-size:1.4rem; font-weight:700; text-transform:uppercase; }
#actualites-detail .bottom-latest .prev,
#actualites-detail .bottom-latest .next { width:56px; height:56px; top:50%; display:flex; align-items:center; justify-content:center; padding:8px; background:#144493; border-radius:50%; z-index:2; cursor:pointer; }
#actualites-detail .bottom-latest .prev svg,
#actualites-detail .bottom-latest .next svg { stroke:#fff; }
#actualites-detail .bottom-latest .prev { position:absolute; left:0vw; transform:translateX(-50%); }
#actualites-detail .bottom-latest .next { position:absolute; right:0vw; transform:translateX(50%); }



/* Guide */
#guides-listing #bg { }
#guides-listing h1 { margin-bottom:0.5em; }
#guides-listing .baseline { text-align:center; font-size:2.2rem; font-weight:800; color:#072557; }
#guides-listing .records { margin-top:30px; overflow:visible !important; }
#guides-listing .record { box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15); margin-bottom:30px; display:block; }
#guides-listing .record h2 { margin-bottom:0; }
#guides-listing .record .image { position:relative; }
#guides-listing .record .image:before { content:''; display:block; width:46px; height:8px; background:#ff0000; position:absolute; left:30px; top:0; transform:translateY(-100%); }
#guides-listing .record .download { position:absolute; left:50%; top:60%; transform:translate(-50%, -50%); opacity:0; transition:all 0.5s ease 0s; width:40%; height:auto; }
#guides-listing .record:hover .download { top:50%; opacity:1; }
#guides-listing .record .text { padding:30px; }
#guides-listing .record .btn { margin-top:30px; font-size:1.4rem; font-weight:700; text-transform:uppercase; }

#guides-detail #breadcrumb { margin-bottom:50px; }
#guides-detail .content { padding-left:10vw; padding-right:10vw; }
#guides-detail .content .image { position:relative; box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15); }
#guides-detail .content .image:before { content:''; display:block; width:46px; height:8px; background:#ff0000; position:absolute; left:30px; top:0; transform:translateY(-100%); }
#guides-detail h1 { text-align:left; margin-top:1em; }
#guides-detail .form { background:#fff; padding:50px; border-radius:8px; box-shadow: 0px 4px 80px rgba(7, 37, 87, 0.15); margin-top:30px; margin-bottom:50px; }
#guides-detail .form h2 { font-weight:bold; color:#ff0000; }

/* guide + actus */
.content .text { margin:50px 0 0 0; }
.content .text ul { list-style:disc; margin:15px 0; padding-left:20px; }
.content .text .btn { margin:30px 0; font-size:1.4rem; font-weight:700; text-transform:uppercase; }
.content .featured { margin:50px 0; font-weight:bold; padding:0 0 0 30px; border-left:8px solid #ff0000; }




/**
 * Extra large
 **/
@media (min-width: 1600px) {
    .container { max-width:1430px; }
}

/**
 * Extra large
 **/
@media (max-width: 1599px) {
    html { font-size:9px; }
    .mini { padding-left:80px; padding-right:80px; }
    .padding { padding-top:60px; padding-bottom:60px; }
    .btn { font-size:1.8rem; }
    #emblem { max-width:300px; }
    
    #header .navigation .top { padding-left:30px; }
    #header .navigation .top { font-size:1.6rem; }
    #header .navigation .bottom .item a { font-size:1.6rem; }
    #header .navigation .bottom .icon { margin-left:0; }
    #header .logo .baseline { display:none; }
    #footer .right .bottom .contact .btn svg { margin-left:15px; min-width:20px; }
    #sticky a { width:80px; height:80px; padding:20px; }
    
    #accueil #heading { min-height: 500px; max-height: 600px; }
    #accueil #intro .text h1 { font-size:5rem; }
    #transport #heading .caption { padding:30px 50px; }
    
    #actualites-detail .bottom-latest .prev { top:43%; }
    #actualites-detail .bottom-latest .next { top:43%; }
    
    #header .btn.red { font-size:1.6rem; }
}

/**
 * Large devices
 **/
@media (max-width: 1199px) {
    html { font-size:8px; }
    .mini { padding-left:60px; padding-right:60px; }
    .padding { padding-top:40px; padding-bottom:40px; }
    #emblem { max-width:200px; margin-right:-100px; }
    #sticky a { width:60px; height:60px; padding:15px; }
    #accueil #heading { min-height: 400px; max-height: 500px; }
    #transport #heading .caption { padding:15px 30px; }
    #transport #heading .caption .icon { height:60px; max-width:100px; }
    #transport #map .bubble { top:50px; right:0; }
    
    #actualites-detail .bottom-latest .prev, 
    #actualites-detail .bottom-latest .next { width:46px; height:46px; top:41%; }
    
    #header.not-top .navigation .bottom .dropdown-menu { top:32px; }
    #header .navigation .bottom .item { margin-left:10px; }
    
}

/**
 * Medium devices
 **/
@media (max-width: 991px) {
    h2 { font-size:2.8rem; }
    .mini { padding-left:40px; padding-right:40px; }
    .hamburger { display:block; position:relative; z-index:5; }
    #bg { padding:15px; }
    #sticky a { width:40px; height:40px; }
    #header .navigation { justify-content:center; display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
    #header .navigation .top, 
    #header .navigation .bottom { opacity:0; pointer-events:none; transition:all 0.5s ease 0s; }
    #header .navigation .top { position:fixed; top:60vh; padding-left:0; width:100%; height:40vh; left:0; text-align:center; z-index:2;  display:flex; flex-direction:column; justify-content:center; align-items:center; }
    #header .navigation .bottom { position:fixed; top:0; width:100%; height:60vh; left:0; text-align:center; z-index:2; background:#fff; display:flex; flex-direction:column; justify-content:center; align-items:center; }
    #header .navigation .menu { flex-direction:column; align-items:center; justify-content:center; font-size:2.4rem; text-transform:uppercase; font-weight:bold }
    #header .navigation .menu li { margin:5px 0; }
    #header .navigation .menu .item { margin-left:0; }
    #header .navigation .bottom .item a { font-size:2.4rem; }
    #header .navigation .bottom .icon { display:none; }
    body.open #header .navigation .top,
    body.open #header .navigation .bottom { opacity:1; pointer-events:auto; }
    #magic-line { display:none; }
    #transport #heading .caption .col { min-width:33.33%; }
    #transport #heading .caption .icon { height:40px; max-width:80px; }
    
    #header .btn.responsive { display:block; margin-right:15px; }
    
    #panels { margin-left:-15px; margin-right:-15px; }
    #heading  { margin-left:-15px; margin-right:-15px; }
    #transport #heading { margin-left:-15px; margin-right:-15px; }
    
    #accueil #heading { min-height: 350px; max-height: 450px; }
    #accueil #intro .text h1 { font-size:4rem; }
    #accueil #intro .images .caption { left:15px; bottom:15px; }
    #transport #map .bubble { position:static; max-width:100%; text-align:center; }
    #footer .left .menu { display:none; }
    #footer .right .top .address img { display:none; }
    #footer .right .bottom { display:none; }
    #footer .container { position:relative; padding-left:0; padding-right:0; }
    #footer .left { position:static; padding-bottom:80px; }
    #footer .left .bottom { position:absolute; width:100%; bottom:20px; }
    #footer .left .logos .idoux { min-width:300px; }
    
    #accueil #form .container { min-width:200px; }
    
    #distribution #map .bigmarker2 { left:27%; top:72%; }
    #distribution #map .bigmarker1 { left:30%; top:70%; }
    
    #partenaires #listing li .image { order:1 !important; }
    #partenaires #listing li .text { order:2 !important; }
    
    #qui-sommes-nous #history .dot .inner { display:none; }
    
    #accueil #main,
    #main { margin-top:100px; }
    
    #actualites-detail .content { padding-left:2vw; padding-right:2vw; }
    #actualites-detail .content .right .latest ul { padding:15px; }
    #actualites-detail .content .right .latest svg { min-width:24px; min-height:24px; padding:5px; }
    
    #actualites-detail .bottom-latest .prev, #actualites-detail .bottom-latest .next { top:47%; }
    
    #header .navigation .bottom li.with-dropdown { flex-direction:column; margin:0; }
    #header .navigation .bottom li.with-dropdown > a { display:none; }
    #header .navigation .bottom .dropdown-menu a { padding:0; }
    #header .navigation .bottom .dropdown-menu li.dropdown-active span:after { content:none; }
    #header .navigation .bottom li.with-dropdown .dropdown-menu { position:static; opacity:1; left:0; top:0; pointer-events:auto; }
    #header .navigation .bottom .dropdown-menu li { margin:5px 0; }
    
    #actualites-listing .record .text,
    #guides-listing .record .text { padding:15px; }
    
    #guides-detail .content { padding-left:5vw; padding-right:5vw; }
    #guides-detail .form { padding:30px; }
    
}

/**
 * Small devices
 **/
@media (max-width: 767px) {
    .mini { padding-left:20px; padding-right:20px; }
    html { font-size:7px; }
    .padding { padding-top:20px; padding-bottom:20px; }
    #sticky { display:none; }
    #emblem { display:none; }
    #footer .right { text-align:center; }
    #footer .right address { margin-bottom:30px; }
    #footer .right .top .address { justify-content:center; }
    #accueil #heading { min-height: 300px; max-height: 400px; }
    #accueil #intro .images li { margin-bottom:30px; }
    #accueil #intro .images .caption { left:30px; bottom:30px; }
    #accueil #icons li { margin-bottom:30px; }
    
    #qui-sommes-nous #valeurs .icon { margin-top:30px; }
    
    #actualites-detail .content .right .latest { display:none; }
    
    #guides-detail .content { padding-left:2vw; padding-right:2vw; }
    #guides-detail .form { padding:15px; }
    
    
}

/**
 * Extra small devices
 **/
@media (max-width: 575px) {
    .mini { padding-left:0; padding-right:0; }
    
    #accueil #heading { min-height: 200px; max-height: 300px; }
    #accueil #form .container { min-width:200px; } { text-align:center; }
    #accueil #form .bottom { justify-content:center; }
    #accueil #form .submit { margin-top:30px; }
    
    #distribution #map .bigmarker { display:none; }
    #distribution #map .bigmarker2 { display:none; }
    #contact #map .bigmarker1 { display:none; }
    #contact #map .bigmarker2 { display:none; }
    
    #qui-sommes-nous #history .date { text-align:center; }
        #qui-sommes-nous #history .date .annee { justify-content:center; }
    }
    
}