/*-----------------------------------------------------------------------
  == Header
----------------------------------------------------------------------- */
#contact-always{
	position: fixed;
	right: 20px;
	bottom: 100px;
	z-index: 200;
	width: 60px;
	height: auto;
}
#contact-always a img{
	opacity: 0.8;
}
#contact-always a:hover img{
	opacity: 1;
}

header.header{
    height: 100vh;
    position: relative;
    /*display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;*/
    overflow: hidden;
    transition: all 0.7s ease-in;
}




#header-background{
	position: absolute;
	height: 101%;
	width: 100%;
	top: 0;
	left: -10px;
	filter: blur(4px);
	background-size: cover;
	z-index: 60;
	transition: all 0.7s ease-in;
}
.go #header-background{
	filter: blur(0);
}

header.header .logos{
	z-index: 80;
    position: absolute;
    top: calc(100% + 150px);
    transition: all 0.7s ease-in;
}
header.header.title-up .logos{
    top: calc(50% - 150px);
    width: 100%;
    left: 0;
    text-align: center;
}

header.header .logos img{
	max-width: 1000px;
}

header.header .logo-first{
	opacity: 1;
	transition: all 0.7s ease-in;
}
header.header.go .logo-first{
	opacity: 0;
}
header.header .logo-second{
	margin-top:-164px;
	opacity: 0;
	transition: all 0.7s ease-in;
}
header.header.go .logo-second{
	opacity: 1;
}



#header-cache{
	position: absolute;
	height: 100%;
	width: 48%;
	top: 0;
	right: 0;
	background-color: #fff;
	z-index: 70;

	background-size: cover !important;
    background-position: left center;
    background: linear-gradient(to right, transparent 30%, #fff 70%), url(../img/main-cache.svg);
    background-repeat: no-repeat;
	transition: all 0.7s ease-in;
}


/*
background: linear-gradient(to right, #fff 50%, #000 50%);
background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(https://www.team-arkea-samsic.fr/wp-content/uploads/2021/11/p1016500-scaled.jpg);
background: linear-gradient(to right, transparent 50%, #000 50%), url(../img/main-cache.svg);
*/


.go #header-cache{
	width: 70%;
}

.down #header-cache {
    width: 110%;
}







#languages-menu{
	position: absolute;
	top:20px;
	right: 20px;
	z-index: 300;
}

#languages-menu .lang-item-en span, #languages-menu .lang-item-fr span{
    border-right: 1px solid #000;
    padding-right: 5px;
}
#languages-menu .lang-item a{
    font-weight: bold;
}
#languages-menu .current-lang a{
	color: #fc4d3f;
}
#languages-menu ul {
    display: inline-block;
    padding: 0 0 0 5px;
}
#languages-menu li{
    padding: 0 1px;
    margin: 0 1px;
    display: inline-block;
}










#main-texts{
	position: absolute;
	bottom:15vh;
	right: 10vh;
	z-index: 0;
	opacity: 0;
	width: 50%;
	transition: all 2s ease-in;
	transform: rotate(-30deg);
	transform-origin: top right;
}
/*#main-texts .subtitle{
	color:#47C0C3;
	font-weight: bold;
	font-size: 80px; 
	display: inline-block;
	width: 250px;
	margin-right: 4%;
}*/
#main-texts .main-text{
	display: inline-block;
	width: 80%;
	font-size: 30px;
	background-color: rgba(255, 255, 255, 0.5);
	padding: 10px 20px;
	border-radius: 5px;
	z-index: 30;
	position: relative;
}
.go #main-texts{
	z-index: 90;
	opacity: 1;
	transform: rotate(0deg);
	bottom:14vh;
}


header.header #main-texts .background-image {
    position: absolute;
    top:0;
    z-index: 20;
    left: -1200px;
    opacity: 0;
    max-width: 590px;
    transition: all 2s ease-in;
}


header.header.go #main-texts .background-image{
	left: 0;
	opacity: 1;
	z-index: 20;
}


/*-----------------------------------------------------------------------
  == Footer
----------------------------------------------------------------------- */



footer.footer{
	background-color: #fff;
	padding:40px 0;
	font-size: 18px;
}

footer.footer .footer-container{

}
footer.footer .block{
	display: inline-block;
	vertical-align: top;
	width: 49%;
}
footer.footer .left{
	text-align: left;
}
footer.footer .right{
	text-align: right
}
footer.footer .socials{
    
}
footer.footer .socials .title{
	font-size: 29px;
    letter-spacing: 0;
	text-transform: uppercase;
	font-weight: bold;
}
	
footer.footer a{
	color: #3B3A38;
	text-decoration: none;
}
footer.footer a:hover{
	text-decoration: underline;
}
footer.footer strong a{
	font-size: 26px;
    letter-spacing: 0;
	font-weight: bold;
	margin-top: 30px;
}
footer.footer h2{
	font-size: 26px;
    letter-spacing: 0;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 10px;
}