@import url('https://fonts.googleapis.com/css2?family=Maven+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Overpass:wght@600;700&display=swap');

/*@font-face {
    font-family: 'Trade Gothic LT Std';
    src: url('fonts/TradeGothicLTStd.woff2') format('woff2'),
        url('fonts/TradeGothicLTStd.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}*/

@font-face {
    font-family: 'ClanPro';
    src: url('fonts/ClanPro-Book.woff2') format('woff2'),
        url('fonts/ClanPro-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Logo */
#topnav:not(.scroll) .logo a { display: block; /* background: #005a6d; */ }
#topnav .logo img {
	transition: initial !important;
	-webkit-transition: initial !important;
}
#topnav .navigation-menu >li >a {
    font-family: 'Overpass', sans-serif;
    font-weight: 700 !important;
    font-size: 12px !important;
}
.flex-control-nav { display: none!important; }

/* Disable click on portfolio */

.work-item a {
	/* pointer-events: none*/
}

h3:before {
	content:"";
	display: block;
	width:80px;
	height: 2px;
	background-color: #005A6D;
	margin-bottom:15px;
}

#topnav.scroll.dark .navigation-menu >li.active >a {
	color: #89BBC5 !important
}

.work-detail h3:before {
	background-color: white!important;
}

.swiper-container-rtl .swiper-button-prev {
    right: 15px !important;
    left: auto;
}

.swiper-container-rtl .swiper-button-next {
    left: 15px !important;
    right: auto;
}
.work-info {
    background-color: rgb(0,90,109,0.8) !important;
}

div p {
	font-size:16px !important;
}


@media(min-width: 1000px) {

	/* body .title h3 {
    	font-size: 26px !important;
	    line-height: 36px
	}*/

	#topnav:not(.scroll) .logo a {
		position: absolute;
	    top: 0;
	    left: 0;
	    max-height: initial;
	    max-width: 230px;
	    /* width: 200px;
	    height: 200px; */
	    padding: 30px 30px 40px 30px;
		/*background-image: linear-gradient(to right bottom, #00333d, #003a45, #00414e, #004957, #005060, #005364, #005769, #005a6d, #005a6d, #005a6d, #005a6d, #005a6d);*/
	}
	#topnav:not(.scroll) .logo a img {
		width: 150px;
	    max-height: initial !important;
	}
	#topnav .navigation-menu >li >a {
	    font-size: 13px !important;
	    padding-left: 30px!important;
	    padding-right: 30px !important;
	}

	#works-grid.three-col .work-item .work-info h3 {
		padding-left: 80px;
	    padding-right: 80px;
	    margin-bottom: 10px;
	    line-height: 1;
	}
	#works-grid.three-col .work-item .work-info h3:before{
		margin-left: -80px;
		width:0px;
		transition: width .5s ease-in-out
	}
	#works-grid.three-col .work-item:hover .work-info h3:before {
		width:80px;
	}
}

#topnav.dark .navbar-toggle:hover span {
	background-color: white!important
}

@media(max-width: 991px) {
	#topnav {
		padding: 0 0 20px 0 !important;
	}
	#navigation { top: 82px !important; }
	.button-decouvrir {
		text-align: center;
	}
}

@media(min-width:1000px){
	#offres, .acces.alignfull {
		height:90vh;
	}
}

.title h3 { font-size: 25px !important; }

body { overflow-x: hidden; font-family: 'Montserrat', sans-serif !important;  }

@media(max-width: 980px){
	.logo {
		position: absolute;
	    left: 50%;
	    top: 50%;
	    transform: translate(-50%, -50%);
	}
	.logo a img {
		display: block;
		    width: 90px;
		    height: auto !important;
		    max-height: initial !important;
		}
	}
}


section { border-bottom: none!important; padding-top: 0px!important;
	padding-bottom: 0px!important; }

section.vc_row {
	overflow: visible;
	padding-top: 0px!important;
	padding-bottom: 0px!important;
	border:none!important;
}

.slide-wrap { background-color: transparent!important ; }

@media (min-width:1024px){
	.slide-content h1 { font-size: 60px !important; }
}


.text-base { font-size: 14px; }

.clan-book { font-family: 'ClanPro'; }

.trade, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif !important; font-weight: 900 }

@media(min-width: 1000px) {
	h3 {
		font-size: 25px !important; ;
		line-height: 1.14;
		text-transform: uppercase;
	}
	.work-info h3 {
		font-size: 30px !important;
	}
	p {
		font-size:20px;
		line-height: 1.4;
	}
}

.title hr, .red-dot { display: none !important }
/* Backgrounds */
.bg-blue-light {
	background-color: #026D84;
}
.bg-blue {
	background-color: #005A6D;
}
.text-blue {
	color: #005A6D;
}



.formulaire-container h3:before { display: none; }

.bg-blue h3:before {

	background-color: white !important;
}


.text-white { color: white }

.bg-white { background-color: white }

.formulaire {
	width:90%;
	max-width: 500px;
}
	.select-hidden {
	  display: none;
	  visibility: hidden;
	  padding-right: 10px;
	}

	.select {
	  cursor: pointer;
	  display: inline-block;
	  position: relative;
	  font-size: 16px;
	  color: #fff;
	  width: 100%;
	  height: 45px;
	}

	.select-styled {
	  position: absolute;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  left: 0;
	  background-color: #026D84;
	  padding: 8px 15px;
	  -moz-transition: all 0.2s ease-in;
	  -o-transition: all 0.2s ease-in;
	  -webkit-transition: all 0.2s ease-in;
	  transition: all 0.2s ease-in;
	  font-family: 'Maven Pro', sans-serif;
	}



	

	.select-styled:after {
	  content: "";
	  width: 30px;
	  height: 30px;
	  background-image: url('images/arrow-left.svg');
	  background-position: center;
	  background-repeat: no-repeat;
	  background-size: 12px;
	  position: absolute;
	  top: 50%;
	  transition: all .5s ease-in-out;
	  transform: translateY(-50%);
	  right: 5px;

	}
	.select-styled:hover {
	  background-color: #005a6d;
	}
	.select-styled:active, .select-styled.active {
	  background-color: #005a6d;
	}
	.select-styled:active:after, .select-styled.active:after {
	  border-color: transparent transparent #fff transparent;
	  transform: translateY(-50%) rotate(90deg);
	}

	.select-options {
	  display: none;
	  position: absolute;
	  top: 100%;
	  right: 0;
	  left: 0;
	  z-index: 999;
	  margin: 0;
	  padding: 0;
	  list-style: none;
	  background-color: #026D84;
	}
	.select-options li {
	  margin: 0;
	  padding: 4px 0;
	  text-indent: 15px;
	  border-top: 1px solid #026D84;
	  -moz-transition: all 0.15s ease-in;
	  -o-transition: all 0.15s ease-in;
	  -webkit-transition: all 0.15s ease-in;
	  transition: all 0.15s ease-in;
	  font-family: 'Maven Pro', sans-serif;
	}
	.select-options li:hover {
	  color: #fff;
	  background: #005a6d;
	}
	.select-options li[rel="hide"] {
	  display: none;
	}

	input[type="text"],
	input[type="email"] {
		opacity: 0.47;
		background: #026D84;
		font-family: 'Maven Pro', sans-serif;
		font-size: 14px;
		color: #FFFFFF;
		letter-spacing: -0.54px;
		line-height: 20px;
		border: 1px solid #FFFFFF;
		padding: 8px 15px;
		width: 100%;
	}

	input[type="text"].bg-red,
	input[type="email"].bg-red {
		background-color: #b10404!important;
	}

	input[type="text"].date {
		background-image: url('images/calendar.svg');
		background-repeat: no-repeat;
		background-position: 100% center;
		background-size:40px;
	}

	.retour img,
	.success-mail img {
		transform: rotate(-180deg)
	}

	.mlk-btn {
		padding:15px 20px;
		font-size: 14px;
		position: relative;
	}

	@media(min-width:1000px){
		.mlk-btn {
			padding:20px 30px;
		}
	}

	/* BTN */
	.btn-outline {
		border: 1px solid #026D84;
		color: white; /* #026D84*/ ;
		background-color: #026D84;
		font-weight: bold;
	}
	.btn-outline-white {
		border: 1px solid #fff;
		color: #026D84;
		background-color: white;
		bont-weight:900;
	}


	.mlk-btn .mask {
		width:0%;
		height: 100%;
		background:#fff;
		position: absolute;
		top: 0;
		left: 0;
		transition: all .5s ease-in-out;
		z-index: 10
	}

	.mlk-btn span:not(.mask) {
		z-index: 20;
		position: relative;
	}

	.mlk-btn:hover .mask {
		width:100%;		
		color: white
	}
	.mlk-btn:hover span:not(.mask){
		color: #026D84;
		
	}
	.btn-outline-white:hover{
		border:1px solid #026D84;
	}

	.btn-outline-white:hover span.mask {
		background-color: #026D84;
	}

	.btn-outline-white:hover span:not(.mask) {
		color:white;
	}

	/* ----- FULL WIDTH  */
	.alignwide {
        margin-left  : -80px;
        margin-right : -80px;
    }
    .alignfull {
        margin-left  : calc( -100vw / 2 + 100% / 2 );
        margin-right : calc( -100vw / 2 + 100% / 2 );
        max-width    : 100vw;
    }
    .alignfull img.fullwidth {
        width: 100vw;
    }

    /* Navigation */
    .swiper-secondary-navigation {
    	background: #026D84;
	    position: absolute;
	    width: 120px;
	    height: 60px;
	    bottom: 0;
	    right: 0;
    }
	.btn.btn-color.btn-scroll { display:none!important; }
    .swiper-secondary-navigation .swiper-button-next:after, 
    .swiper-secondary-navigation .swiper-button-prev:after {
    	font-size: 18px;
    	color: white;
    }
    .swiper-secondary-navigation:before {
	    content: "";
	    width: 1px;
	    height: 100%;
	    background-color: white;
	    opacity: .2;
	    display: block;
	    left: 50%;
	    transform: translateX(-50%);
	    position: absolute;
	}
	.formulaire-swiper {
		overflow: initial !important;
	}
	.formulaire-swiper .swiper-slide { opacity:0!important; transition : opacity .5s ease-in-out }
	.formulaire-swiper .swiper-slide-active { opacity: 1!important; }

	/* Accès */
	.acces-item:hover, .acces-item:hover div {
		background-color: #026D84;
		color: white !important
	}

	.acces-item:hover g{
		fill:#ffffff;
	}

	.acces-item .text-base {
		color: #9E9E9E;
	}

	.acces-item .icone svg { margin:auto; }

	#topnav.scroll.dark .navigation-menu >li >a:hover{
		background-color: #026D84;
		color: white !important;
	}
	#topnav .navigation-menu >li.bg-white > a {
		color: #026D84 !important
	}
	#topnav .navigation-menu >li.bg-white > a:hover {
		color: #ffffff !important;
		background-color: #026D84!important;
	}

	@media(min-width:1000px) {
		.select, .select-styled,
		input[type="text"], input[type="email"] {
			height:55px !important;
		}
		.select-styled { display: flex; align-items: center; }
	}

	::-webkit-input-placeholder { /* Chrome/Opera/Safari */
		 color: white !important;
	}
	::-moz-placeholder { /* Firefox 19+ */
		 color: white !important;
	}
	:-ms-input-placeholder { /* IE 10+ */
		 color: white !important;
	}
	:-moz-placeholder { /* Firefox 18- */
		 color: white !important;
	}