/*

Project : Starter CSS
Author  : Nom prénom
Version : v.1.0.0
Date    : 2023/11/05

*/
@font-face {
  font-family: 'Belleza';
  src: url('../fonts/Belleza/Belleza.eot');
  src: url('../fonts/Belleza/Belleza.eot?#iefix') format('embedded-opentype'),  
	   url('../fonts/Belleza/belleza-regular-webfont.woff2') format('woff2'), 
	   url('../fonts/Belleza/belleza-regular-webfont.woff')  format('woff'), 
	   url('../fonts/Belleza/Belleza.svg#Belleza') format('svg');
  font-weight: normal;
  font-style: normal;
}


/*--------------------------------------------*/
/* GLOBAL */
/*--------------------------------------------*/

html {
	box-sizing: border-box;
	font-size: 100%;
	
}




*, *::before, *::after {
	box-sizing: inherit;
}


body{
	font-family: 'Belleza';
	margin: 0;
	position: relative;
	font-size: 1em;
	line-height: 1.5;
	font-weight: 500;
	color: #0b0a0a;
	 padding: 0;
    overflow-x: hidden;
    background-color : #F9FAFE;

	/*background-color: /*rgba(236, 205, 166, 0.9);
	rgba(158, 158, 158, 0.41);
	background-image: url('../img/960_grid_12_col.jpg');
	filter: grayscale(40%);
	background-size: cover;
	background-repeat: no-repeat;**/


}

/* Typographie */
/*--------------------------*/
h1, .h1-like,
h2, .h2-like,
h3, .h3-like,
h4, .h4-like,
h5, .h5-like,
h6, .h6-like {
	font-weight: 500;
	/*line-height: 1.5em;*/
	margin: 0;
}

h1 {

	font-size: 2.5em;
	color: #ff0000;
	/*color: #bd1820;*/
	line-height: 1;

	}

.h1-like{

	font-size:3.5em;
	color: #ff0000;
	/*color: #bd1820;*/
	
	line-height: 1;
	/*padding-top:40px;*/
}


h2, .h2-like {
	font-size: 2em;
	line-height: 1;
	
	
}


h3, .h3-like {
	font-size: 1.5em;
	
}
h4, .h4-like {
	font-size: 1.1em;

}

p {
	margin: 0 0 0 0;

}


 .li-like{
	font-size: 1em;

}


.project-number{
	font-size:3em;
	margin: 50px 0;
}


.color-secondaire {

	opacity:  0.7;

}

.small-text{
	font-size:0.8em;
	line-height: 1.3em;
	opacity: 0.7;

}
.chip {
position: relative;
display: inline-block;
border: solid 0.5px;
border-radius: 24px;
padding: 0 0.75em;
line-height: 1.75em;
white-space: nowrap;

 
 transition: background-color .3s linear 0s;
 -webkit-transition:background-color 0.3s linear 0s;

}


.animated-line {
  margin:0 auto;
  width:2px;
  height:40px;
  overflow:hidden;
  background:#ff00004a;
  position:relative;
  margin-top : -50px;
 

}

.animated-line::before {
  content:'';
  display:block;
  width:2px;
  height:40px;
  background:red;
  position:absolute;
  top:-100%;
  left:0;
  animation: animate 3s ease-in-out infinite;
}

@keyframes animate {
  0% { top: -100%; }
  50% { top: 0; }
  100% { top: 100%; }
}

/* links */
/*--------------------------*/
	.scale-hover, a {
		text-decoration: none;
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;

		
	}

	a{
		color: #0b0a0a;
	}
	a:hover, a:active {
		color: #ff0000;
	/*color: #bd1820;*/
		
		
	}

.scale-hover:hover, 
.scale-hover:active {
	opacity: 0.7;
	-ms-transform: scale(1.05); /* IE 9 */
    -webkit-transform: scale(1.05); /* Safari */
    transform: scale(1.05);
}

/*.bg-gradient a{
	 background-color: white;
     background-image: linear-gradient(white, rgba(255,255,255,0));
  	transition: background-color 0.3s ease-in-out;
  	-webkit-transition:background-color 0.3s ease-in-out;
}


.bg-gradient a:hover, .bg-gradient a:active{
	background-color: rgba(189, 24, 32, 0.5);

}*/

.bg-gradient{
	background: linear-gradient(#ff0000,#ff0000) bottom no-repeat;
  background: -webkit-linear-gradient(#ff0000,#ff0000) bottom no-repeat;
  /*
  background: linear-gradient(#bd1820,#bd1820) bottom no-repeat;
  background: -webkit-linear-gradient(#bd1820,#bd1820) bottom no-repeat;*/
  background-size: 100% 0px;
  transition: background-size 0.1s;

 }

.bg-gradient:hover
{
  background-size: 100% 100%;
  color: #F9FAFE;
}

.txt-gradient{
  transition: all 0.3s ease;
 }

.txt-gradient:hover
{
    /*background: linear-gradient(white, #ff0000);*/
    background: linear-gradient(white, #bd1820);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bg2{
 background-color: #ffffff;
 margin-top: -100px;
 padding-top : 80px;
 margin-left: -100px;
 margin-right: -100px;
 padding-left: 100px;
 padding-right: 100px;
}

.bg3{
 background-color: #ffffff;
 
}

/*---forme geométrique----*/
#cercle {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: green;
}

.carre {
    height: 30px;
    width: 30px;
    background: #F9FAFE;
    -ms-transform: rotate(45deg); /* Internet Explorer */
    -moz-transform: rotate(45deg); /* Firefox */
    -webkit-transform: rotate(45deg); /* Safari et Chrome */
    -o-transform: rotate(45deg); /* Opera */
    border-color: 10px solid #0b0a0a;
}

/* Grouping content */
/*--------------------------*/

figure {
	margin: 0;
}

audio{
	max-width: 100%;
	vertical-align: bottom;
}
/* Iframe */
/*--------------------------*/
.box-iframe {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.box-iframe iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* Buttons */
/*--------------------------*/
.btn {
position: relative;
display: inline-block;
color:  #ff0000;
/*color:  #bd1820;*/
border: solid 1px #ff0000;
/*border: solid 1px #bd1820;*/
padding: 0.25em 0.75em;
line-height: 1.75em;
white-space: nowrap;

 /*background-color: white;*/
 transition: background-color .3s linear 0s;
 -webkit-transition:background-color 0.3s linear 0s;

}

.btn:active, 
.btn:hover {
top: 1px;
background-color: rgba(189, 24, 32, 0.5);


}



/*.btn-scroll{
	position: relative;
}

.btn-scroll:active, 
.btn-scroll:hover {
top: 1px;
color: #0b0a0a;
}*/



/*--------------------------------------------*/
/* list */
/*--------------------------------------------*/

ul{
	list-style-type: none;
}

#aboutme li{
	margin-left: -20px !important;
}


/*--------------------------------------------*/
/* GRID */
/*--------------------------------------------*/
.grid:before,
.grid:after{
	display: block;
	content:"";
	clear:both;
}
/*.grid{
	margin-left: -10px;
	margin-right: -10px;*/
}
	
[class*="col-"] {
	width: 100%;
}/*Pour simplier lécriture dans html en accumulant col-d col-m col-t*/

.grid [class*="col-"] {
	float: left;
	/*padding-left: 10px;
	padding-right: 10px;*/
}
.table {
		display: table;
		width: 100%;
		padding-left: 10px;

	}
	.fixed {
		table-layout: fixed;
	}

	
	.row {
		display: table-row;
	}
	.cell {
		display: table-cell;
		padding:0;
		margin:0;			
	}

.col-m-1{
	width:8.333%;
}
.col-m-2{
	width:16.667%;
}
.col-m-3{
	width:25%;
}
.col-m-4{
	width:33.333%;
}
.col-m-5{
	width:41.667%;
}
.col-m-6{
	width:50%;
}
.col-m-7{
	width:58.333%;
}
.col-m-8{
	width:66.667%;
}
.col-m-9{
	width:75%;
}
.col-m-10{
	width:83.333%;
}
.col-m-11{
	width:91.667%;
}
.col-m-12{
	width:100%;
}

/* GRID TABLET VIEW */
/*--------------------------*/
@media (min-width: 481px) {



	.col-t-1{
		width:8.333%;
	}
	.col-t-2{
		width:16.667%;
	}
	.col-t-3{
		width:25%;
	}
	.col-t-4{
		width:33.333%;
	}
	.col-t-5{
		width:41.667%;
	}
	.col-t-6{
		width:50%;
	}
	.col-t-7{
		width:58.333%;
	}
	.col-t-8{
		width:66.667%;
	}
	.col-t-9{
		width:75%;
	}
	.col-t-10{
		width:83.333%;
	}
	.col-t-11{
		width:91.667%;
	}
	.col-t-12{
		width:100%;
	}



} /* END OF GRID TABLET VIEW */

@media (min-width: 769px) {
	

	.col-d-1{
		width:8.333%;
	}
	.col-d-2{
		width:16.667%;
	}
	.col-d-3{
		width:25%;
	}
	.col-d-4{
		width:33.333%;
	}
	.col-d-5{
		width:41.667%;
	}
	.col-d-6{
		width:50%;
	}
	.col-d-7{
		width:58.333%;
	}
	.col-d-8{
		width:66.667%;
	}
	.col-d-9{
		width:75%;
	}
	.col-d-10{
		width:83.333%;
	}
	.col-d-11{
		width:91.667%;
	}
	.col-d-12{
		width:100%;
	}

}/* END OF GRID DESKTOP VIEW */


/* Helpers */
/*--------------------------*/
.txt-left {
	text-align: left;
}
.txt-center {
	text-align: center;
}
.txt-right {
	text-align: right;
}


/*--------------------------*/
.v-top {
	vertical-align: top;
}
.v-middle {
	vertical-align: middle;
}
.v-bottom {
	vertical-align: bottom;
}


/*
m = margin

a = all
t = top
b = bottom

n = none
s = small
m = medium
l = large
*/

.man {
	margin: 0 !important;
}
.mas {
	margin: 20px !important;
}
.mam {
	margin: 40px !important;
}
.mal {
	margin: 60px !important;
}

.mtn {
	margin-top: 0 !important;
}

.mtneg{
	margin-top:-5px !important;
}
.mts {
	margin-top: 20px !important;
}
.mtm {
	margin-top: 40px !important;
}
.mtl {
	margin-top: 60px !important;
}
.mtxl {
	margin-top: 150px !important;
}



.mbn {
	margin-bottom: 0 !important;
}
.mbxs {
	margin-bottom: 10px !important;
}
.mtxs {
	margin-top: 10px !important;
}
.mbs {
	margin-bottom: 20px !important;
}
.mbm {
	margin-bottom: 40px !important;
}
.mbl {
	margin-bottom: 60px !important;
}

.mbxl {
	margin-bottom: 150px !important;
}
.mrn {
	margin-left:  0 !important;
}
.mls {
	margin-left: 20px !important;
}
.mlm {
	margin-left: 40px !important;
}
.mll {
	margin-left: 60px !important;
}


.mrn {
	margin-right:  0 !important;
}
.mrs {
	margin-right: 20px !important;
}

.mrxs {
	margin-right: 10px !important;
}
.mrm {
	margin-right: 40px !important;
}
.mrl {
	margin-right: 60px !important;
}

.mrxl {
	margin-right: 180px !important;
}

.pas{
	padding: 20px !important;
}

.mans{
	margin-left: -20px;
	margin-right:-20px;
}
.ptn{
	padding-top: 0px !important;
}
.pll{
	padding-left: 60px !important;
}

.plxl{
	padding-left: 180px !important;
}


/*.ptxl{
	padding-top: 180px !important;

}*/

.ptl{
	padding-top:60px !important;
}

.ptm{
	padding-top:40px !important;
}



.pts{
	padding-top:16px !important;
}


.pbxl{
	padding-bottom: 180px !important;
}

.pbl{
	padding-bottom: 60px !important;
}


.pls{
	padding-left:20px !important;
}
.prs{
	padding-right:20px !important;
}
.prl{
	padding-right: 60px !important;
}
.prxs{
	padding-right:10px !important;
}
.plxs{
	padding-left:10px !important;
}
.plm{
	padding-left:40px !important;
}
.prm{
	padding-right:40px !important;
}


/*--------------------------------------------*/
/* Others*/
/*--------------------------------------------*/

.browsehappy{
	background-color: #5ab1ab;
	color:#324b4b;
	padding: 20px;
	margin: 20px 0;
	border: 10px solid;
	text-align: center;
}

.browsehappy a{
	color:#F9FAFE;
	text-decoration: underline;
}

.browsehappy a:hover{
	color:#F9FAFE;
	text-decoration: none;
}




/*--------------------------------------------*/
/* CONTENT */
/*--------------------------------------------*/

.container-cover {
    display: flex;
    align-items: center; /* Centre verticalement */
    justify-content: center; /* Centre horizontalement */
    flex-wrap: wrap; /* Permettre le wrapping des colonnes */
}

.column {
    padding: 60px 20px 60px 20px;
    flex: 1 1 45%; /* Permettre aux colonnes de s'ajuster dynamiquement */
    max-width: 45%; /* Limiter la largeur des colonnes */
}

.column img {
    max-width: 100%;
    height: auto;
}





img{

  max-width: 100%;
  height: auto;
  display:block;
  margin:0 auto;
 }

.wrap {
	max-width:1920px;
	width:100%;
	margin:0 auto;
	padding: 20px;

	}

/*.wrap{
	position: absolute;
	top:0;
	margin:0 auto;
	overflow: hidden;
	clear:both;
}*//*wrap responsive*/




/* Header */
/*--------------------------*/
/*#header {
		padding: 10px;
}*/

/* logo */
	/*--------------------------*/
	.logo{
		padding-top: 10px;
		
	}

	.logo img, .logo p {
		padding-right: -20px;
	}
	.logo img, .logo a, header a {
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
}

	.logo a:hover img, 
	.logo a:active img,
	.logo a:focus img	{
		opacity: 0.8;

}

	
	header a:hover,
	
	header a:active,
	 
	header a:focus{
		color: #424242;

}



/* Menu */
/*--------------------------*/
/* Menu */
/*--------------------------*/
.menu{
	height: 0;
	opacity: 0;
	overflow:hidden;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
} 

.menu-collapse{
	height: auto;
	opacity: 1;
}
/*pour cacher le menu*/
.menu ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}
.menu a {
	display: block;
	padding: 1em;
	color: #ededed;
	text-align: center;
}
.menu .current {
	background-color: #d35f60;
	color: #ff0000;

	/*color: #bd1820;*/
}
/* Burger */
/*--------------------------*/

/*#header .wrap{
	position:relative;
}au cas ou on a besion de menu burger dans la version desktop*/
/*.btn-menu{
	color: #bd1820;
	position: absolute;
	top: 20px;
	right: 10px;
}*/



/* Main*/
/*--------------------------*/
/*main{
	overflow:hidden;
	clear:both;
}*/



.rs{
	padding: 0;
	list-style-type: none;
	background: #d35f60;
	padding: 20px 0;
	text-align: center;
}

.rs li {
	display: inline-block;
}


.rs .fa{
	color: #F9FAFE;
	margin: 0 10px;
	transition: all 0.3s ease-in-out;
}

.rs a:hover .fa{
	color: #212121;

}




.block-center{
	
	max-width:100%;
	width:500px;
	padding:0 20px;

}

.float-right{
	float:right;
	overflow:hidden;
}

.clearfix{
	overflow: hidden;
}

.bg-index{
	/*box-shadow:2px 1px 5px 2px #dedbde;*/
	padding: 20px 20px 30px 20px;
	max-width:100%;
	background-color: #fff;
	/*border: solid 0.5px #80808087;*/

	/*box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;*/
	/*border: solid  0.5px  #ff0000;*/
	

	box-shadow: 0 10px 19px 7px rgb(33 35 36/4%);
	}

.container-index{
	padding: 0 16px;
	margin: 0 auto;

}
.bg-index img{
	max-width:100%;
	height:auto;

}



#projects .h2-like{
line-height: 0.5em;
}

.red-txt{
	/*color:#bd1820;*/
	color:#ff0000;
}

.white-txt{
	color:#F9FAFE;
}

/*.btn-scroll {
	padding: 0;
	list-style-type: none;
	background: #d35f60;
	/*padding: 20px 0;
	text-align: center;
}*/
/*.btn-return {

	position: absolute;
	top: 15%;
	left: 6%;
	z-index: 999;
	/*width: 5%;*/

/*}

.btn-return-secondary {

	position: absolute;
	top: 15%;
	left: 51%;
	z-index: 999;
	/*width: 5%;*/

/*}*/


.rs li {
	display: inline-block;

}


.rs .fa,
.btn-scroll .fa{
	color: #ff0000;
	/*color: #bd1820;*/
	transition: all 0.3s ease-in-out;
}

.rs a:hover .fa,
.rs a:active .fa,
.rs a:focus .fa,
.btn-scroll a:hover .fa,
.btn-scroll a:active .fa,
.btn-scroll a:focus .fa{
	color: #424242;

}

.btn-plus em{
	opacity: 0;
}

.btn-plus:hover em{
	background-color:rgba(16, 16, 16, 0.89);
	opacity:1;
	color: #F9FAFE;
	font-size:0.8em;
}

.btn-plus i{
	color:#d45466;
	margin: 0 10px;
	transition: all 0.3s ease-in-out;
}



.btn-plus a:hover .fa, 
.btn-plus i:hover{
	color: #F9FAFE;
}

.tooltips {
    position: relative;
    display: inline-block; 
    }

/* Tooltip text */
.tooltips .tooltipstext {
    visibility: hidden;
    width: 160px;
    font-size: 0.8em;
    color: #F9FAFE;
    background-color: rgba(16, 16, 16, 0.89);
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text */
    position: absolute;
    z-index: 10;
    bottom: 125%;
    left: 50%;
    margin-left: -80px;
   /* opacity: 0;*/
    transition: opacity 1s;
}

/* Tooltip arrow */
.tooltips .tooltipstext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltips:hover .tooltipstext {
    visibility: visible;
    opacity: 1;
}

	

.in-middle {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  height: 100vh;
}

.in-middle h2,
{
	line-height: 1;
}

/*burger test-------------------------------------------------------------------------*/






  .hamburger {
    display: block;
    cursor: pointer;
  width: 40px;
  height: 50px;
  position: fixed;
  top: 20px;
  right: 20px;
   z-index: 2;
}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 3px;
  background-color: #ff0000;
   /*background-color: #bd1820;*/
  margin: 7px 0;    
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

.cross .bar1 {
    transform: rotate(-45deg) translate(-9px, 9px);
    background-color: #F9FAFE;
}

.cross .bar2 {
  opacity: 0;
}

.cross .bar3 {
    transform: rotate(45deg) translate(-5px, -5px);
    background-color: #F9FAFE;
}






.hamburger-menu-hidden {
  text-align: center;	
  position: absolute;
  width: 100vw;
  height:110vh;
  right: 0;
  top:-60px;

  background-color: #ff0000;
   /*background-color: #bd1820;*/

list-style-type: none;
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

.hamburger-menu-displayed {
  transform: translateX(0);
}

.hamburger-item-list 
{
  list-style-type: none;
  margin: 0 auto;
}

.hamburger-item
{
  text-decoration: none;
  color: #F9FAFE;
  text-align:center;
  font-size: 4em;
}

.logo-mini
{
	top:20px;
	left:20px;
	position:fixed;
}

.btn-return{
	top:95px;
	left:20px;
	position:fixed;
	color: #ff0000;
	/*font-color: #bd1820;*/
}



.cache{
position: absolute;
background-color: #F9FAFE;
width:220vw;
height:20vh;
top:-50px;
left:-50px;
z-index: 999;

}

/*#maison-bio h2,
#maison-bio .h2-like{
color:#45aead!important;
}*/




.txt-link a{


font-size:1.1em;
line-height: 2;

transition: background-size 0.1s;
text-decoration: underline;

}

.bg-white{


background-color:white;

}

/*#maison-bio .txt-link a{
color: #45aead;
background: linear-gradient(#45aead,#45aead) bottom no-repeat;
background: -webkit-linear-gradient(#45aead,#45aead) bottom no-repeat;
background-size: 100% 2px;
}

#maison-bio .txt-link a:hover,
#maison-bio .txt-link a:active{
background-size: 100% 100%;
color: #F9FAFE!important;
}


#ombres-chinoises .txt-link a{
color: #d45466;
background: linear-gradient(#d45466,#d45466) bottom no-repeat;
background: -webkit-linear-gradient(#d45466,#d45466) bottom no-repeat;
background-size: 100% 2px;
}

#ombres-chinoises .txt-link a:hover,
#ombres-chinoises .txt-link a:active{
background-size: 100% 100%;
color: #F9FAFE!important;
}








#ombres-chinoises h2,
#ombres-chinoises .h2-like{
color:#d45466!important;
}



#pultrusion .txt-link a{
color: #029463!important;
background: linear-gradient(#d45466,#d45466) bottom no-repeat;
background: -webkit-linear-gradient(#d45466,#d45466) bottom no-repeat;
background-size: 100% 2px;
}

#pultrusion .txt-link a:hover,
#pultrusion .txt-link a:active{
background-size: 100% 100%;
color: #F9FAFE!important;
}








#pultrusion h2,
#pultrusion .h2-like{
color:#029463!important;
}


#biotrial .txt-link a{

background: linear-gradient(#d45466,#d45466) bottom no-repeat;
background: -webkit-linear-gradient(#d45466,#d45466) bottom no-repeat;
background-size: 100% 2px;
}

#biotrial .txt-link a:hover,
#biotrial .txt-link a:active{
background-size: 100% 100%;
color: #ffffff!important;
}

#biotrial h2,
#biotrial .h2-like{
color:#008A53!important;
}




#minette-matou h2,
#minette-matou .h2-like{
color:#029463!important;

}


#colibee-corporate h2,
#colibee-corporate .h2-like{
color:#EE532D!important;

}

#colibee-connect h2,
#colibee-connect .h2-like{
color:#834d88!important;

}


#starboisson-details h2,
#starboisson .h2-like{
/*color:#bd1820!important;
color:#ff0000!important;

}

#colibee-connect-details h2,
#colibee-connect-details .h2-like{
color:#834d88!important;

}


#colibee-connect-details .h3-like{
color:#834d88!important;
font-size: 1.9em;
line-height: 1.1em;

}

/*.cover{
	background-image: url('../img/banner-maison-bio.jpg');
	position:absolute;
	top:0;
	left:0;
	background-size: cover;
	background-repeat: no-repeat;
	background-position:100%;
}





#maison-bio .cover{
	background-color:#45aead1c;
	margin-left:-80px;
	margin-top:-60%;
	
}


#ombres-chinoises .cover{
	background-color:rgba(158, 158, 158, 0.41);
	margin-left:-80px;
	margin-top:-60%;
	
}

#pultrusion .cover{
	background: linear-gradient(white,40%,#55BE9B,#272C5F);
	/*background-color:rgba(158, 158, 158, 0.41);
	margin-left:-80px;
	margin-top:-70%;
	margin-bottom: -20px;
	
}

#biotrial .cover{
	
	background: linear-gradient(#F09297,white,60%,#CCEADE,#8ABCAC,#008A53);
	
	margin-left:-80px;
	margin-top:-70%;
	margin-bottom: -20px;
	
}

#colibee-corporate .wrap-intro{
	background-color:#ee532d1f;

	margin-left: -180px;
	margin-top: -300px;
	padding-top: 160px;
	padding-left: 145px;
	padding-right: 80px;
	padding-bottom: 20px;
	
	
}

#colibee-connect .wrap-intro{
	background-color:#5b09651f;

	margin-left: -180px;
	margin-top: -300px;
	padding-top: 160px;
	padding-left: 145px;
	padding-right: 80px;
	padding-bottom: 20px;
	
	
}

#sb .wrap-intro{
	background-color:#fb002526;

	margin-left: -180px;
	margin-top: -300px;
	padding-top: 200px;
	padding-left: 145px;
	padding-right: 80px;
	padding-bottom:20px;
	
	
}

#tba .wrap-intro{
	background: linear-gradient(white,#b0d7ec,#A8C3F6);

	margin-left: -180px;
	margin-top: -300px;
	padding-top: 200px;
	padding-left: 145px;
	padding-right: 80px;
	padding-bottom:130px;
}

#tba .h1-like{
	color:#0251e6;
}

#tba-details .h2-like{
	color:#0251e6;
}*/


.mt-cover{


	

	margin-top: 120px;
	
	}






.cover img{
	text-align: right;
	padding-top:25%;
	margin-left:auto;
	margin-right:auto;
	display: block;
	max-width: 100%;
	height:auto;

}


.bg-color{
	background-color: #45aead1c;
}

.shadow{
	box-shadow:2px 1px 5px 2px #dedbde;
}

video{
	width:100%;
}



/*---------------------------------------------------------------------------------*/











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

#index footer {
	
	padding: 10px 0px;
	background-color: #ff0000;
	/*background-color: #bd1820;*/
	color: /*#ec8d91;*/ #f8f8f8;
	margin-right:-80px;
}

#index footer i {
	
	color:#f8f8f8;
}

/*#index footer:hover,
#index footer i:hover{
	color:#fff;
}*/
/*#totop {
	display: block;
	/*text-align: center;*/
	/*background-color: #d35f60;*/
	/*color: #fff;*/
	/*padding: 1em 2em;*/
	/*margin: 20px 0;
	border-radius: 5px;*/
	/*position:relative;
	bottom:5px;
	right:20px;

}*/

.box-contact{

	flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  height: 90vh;

}




#header {
	position:fixed;
	width: 100%;
	z-index: 999;
	top:0;
	}


/*--------------------------------------------*/
/* RDW */
/*--------------------------------------------*/

/* MOBILE VIEW */
/*--------------------------*/
@media (max-width: 480px){



.m-txt-left{
	text-align: left;
}


.m-pan{
	padding:0 !important;
}



#introduction img{
	width:50%;
}

.hamburger-item
{
  font-size: 2.5em;
}
/*#hamburger .bar1,
#hamburger .bar2,
#hamburger .bar3{
	width:80%;
	
}*/

.btn-return{
	top:65px;
	left:20px;
	position:fixed;
	font-color: #ff0000;
	/*font-color: #bd1820;*/
}






.m-hidden{
	display:none;
}

.btn-return{
	left:5px;
	top:20px;
}

.m-img-center{
	display: block;
	margin:0 auto;
	padding:10px !important;
	max-width: 100%;
}
.mal{
	margin: 20px !important;
}


.mbs{
	margin-bottom: 5px !important;
}

.mtl{
	margin-top: 20px !important;
}

.mbl{
	margin-bottom: 20px !important;
}

.m-mtxl{
	margin-top:30px !important;
}

.m-pas{
	padding: 5px !important;
}

.m-pal{
	padding: 20px !important;
}
.m-width{
	width:50%;
}
footer span{
	font-size:0.85em;
}


}

/* TABLET VIEW */
/*--------------------------*/
@media (max-width: 768px) {

	/* Menu */
	/*--------------------------*/

	 .container-cover {
        flex-direction: column; /* Afficher les colonnes l'une en dessous de l'autre */
        text-align: center; /* Centrer le texte */
    }

    .column {
        width: 100%; /* Occuper toute la largeur */
        max-width: 440px;
        margin-bottom: 20px; /* Espacement entre les colonnes */
    }


#ombres-chinoises .cover{
	margin-top:-300px;
	margin-left:-30px;
	margin-right:-30px;
}





#maison-bio .cover{
	margin-top:-300px;
	margin-left:-30px;
	margin-right:-30px;
}




.cover img{
	padding-top:140px;
	display:block;
	margin:0 auto;
	max-width: 90%;
	padding-bottom: 20px;
	
}

.t-pam{
	padding:20px !important;
}

.t-plrm{
	padding-left:20px !important;
	padding-right:20px !important;
}


.t-mtn{
	margin-top: 0!important;
}

h1 {

	font-size: 2em;
	/*color: #bd1820;*/
	color: #ff0000;
	line-height: 1;

	}

.h1-like{

	font-size:2em;
	/*color: #bd1820;*/
	color: #ff0000;
	line-height: 1;
	/*padding-top:40px;*/
}


h2, .h2-like {
	font-size: 1.5em;
	
	
}


h3, .h3-like {
	font-size: 1.25em;
	
}
h4, .h4-like {
	font-size: 1em;

}

p,
li {
	margin: 0 0 0 0;
	font-size:0.8em;

}




.project-number{
	font-size:2em;
	margin: 50px 0;
}



.ptxl{
		padding-top: 40px !important;
	}

/*

.prl{
	padding-right: 30px !important;
}

.pll{
	padding-left: 30px !important;
}

.mbm{
	margin-bottom: 20px !important;
}


*/
.fa-2x{
	font-size: 1em;
}




/*#header{
	background-color:rgba(158, 158, 158, 0.41);
	height:75px;
}*/


.box-contact ul{
	margin-left:-60px;
}






} /* END OF TABLET VIEW */


/* DESKTOP VIEW */
/*--------------------------*/
@media (min-width: 769px) {


	/* Menu */
	/*--------------------------*/
	/* Menu */
	/*--------------------------*/


	.menu{
	height: auto;
	opacity: 1;
	
	}
	.menu li {
		display: inline-block;
	}
	.menu a {
		padding: 0.5em 1em;
	}

	.d-pll{
		padding-left: 60px !important;
		}
	.d-prs{
		padding-right: 20px !important;
	}

	.d-prm{
		padding-right: 40px !important;
	}

.d-plm{
		padding-right: 40px !important;
	}



	.d-mbm{
		margin-bottom: 40px !important;
	}
	
	.ptxl{
		padding-top: 180px !important;
	}


.onecolumn{
	
	padding-left: 180px;
	padding-right: 180px;
	
	
	
}



@media only screen and (min-width: 1920px) {
    .wrap {
        width: 1920px; 
        padding : 0 20px;/* Largeur fixe pour les grands écrans */
        
    }
}







	/* Burger */
	/*--------------------------*/
/*.btn-menu{
		display:none;
	}*/


	/* Burger */
	/*--------------------------
.btn-menu{
		display:none;
	}*/


	/* Links */
	/*--------------------------*/



	/* logo */
	/*--------------------------*/

	.logo a:hover img, 
	.logo a:active img,
	.logo a:focus img

	{
		opacity: 0.8;

	}
	.logo img, .logo a, header a {
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		color: #F9FAFE;
	}

	
/*
	
	header a:hover,
	
	header a:active,
	 
	header a:focus{
		color: #424242;

	}*/



	/* Buttons */
	/*--------------------------*/
	.btn,
	.btn-scroll
	 {
		cursor:pointer;
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}


/*	.btn:hover {
		background-color: #a84b4b;
		color: #fff;
	}
	.btn--secondary:hover {
		background-color: #666;
		color: #ededed;
	}
*/
	/* Menu */
	/*--------------------------*/

		/* Menu */
	/*--------------------------*/

	.menu a:hover,
	.menu a:active,
	.menu a:focus {
		
		color:#424242;
	}
	/* Footer */
	/*--------------------------*/
	#totop:hover,
	#totop:active,
	#totop:focus
	 {
		color: #424242;
	}

/*h1, .h1-like {
	font-size: 3em;
	color: #fff;
	
}*/

footer small {
		display: inline;
		text-align: left;
		
	}
	#totop {
		display: inline;
	/*	text-align: inherit;*/
		/*background-color: inherit;
		color: #fff;*/
		padding: 0;
		margin: 0;
		border-radius: 0;
		}


	.btn-scroll .fa,
	.btn-return .fa{
		/*color: #bd1820;*/
	color: #ff0000;

	}

	.bg-color{
		position: sticky;
		top:0;
		right:0;
		bottom: 620px;
		background-color:#000;
		z-index: 999;
	}

	.wrap{
		padding-left:80px !important;
		padding-right:80px !important;
	}

	.cover img{
		padding-bottom: 150px;
	}

	.box-contact li{
		padding-right: 104px;
		text-align: right;
	}
	.box-contact li:last-child{
		padding-right: 0!important;
	}

	.box-contact li:first-child{
	margin-left:-40px;

}

.box-contact li{
	padding-right: 60px;

}

.box-contact li:last-child{
	padding-right: 0;

}
	/*#logo-project-details img{
		max-width: 100%;
		display:block;
		margin:0 auto;
	}*/
} /* END OF DESKTOP VIEW */