@charset "UTF-8";
/* CSS Document */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}












body{
margin: 0;
padding: 0;
z-index: 0;
background-color:#fff;
font-family: 'Montserrat', sans-serif;
font-weight: 400;
-webkit-font-smoothing: antialiased;
-moz-transition:0.2s;
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
}



a {
	text-decoration:none;
	color:#767676;
	transition: 0.2s;
	-moz-transition:0.2s;
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
	
}
a:hover{
	text-decoration:none;
	color:#1f1f1f;
	
	
}

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

/* TEXTE */

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



p {
	font-size:14px;
	line-height:24px;
	-moz-transition:0.2s;
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
	
	
}

p.small {
	font-size:12px;
	line-height:24px;
	letter-spacing:0.2em;
	padding-top:25px;

	
	
}

h1 {
	font-size:65px;
	line-height:95px;
	font-weight:400; 

}

h2{
	font-family: 'Montserrat', sans-serif;
    font-weight: 400; 
	font-size:34px;
	line-height:46px;
}


h3{
	font-family: 'Montserrat', sans-serif;
    font-weight: 400; 
	font-size:15px;
	line-height:22px;
}

.text_28{
 
	font-size:28px;
	line-height:36px;
}

.text_45{
 
	font-size:45px;
	line-height:36px;
}

.text_22{
 
	font-size:22px;
	line-height:36px;
}

.text_18{
 
	font-size:18px;
	line-height:36px;
}

.text_bold {
	font-weight:700;
	 -webkit-font-smoothing: antialiased;
	
}

.text-center {
	text-align: center;
}


.text_orange {
	color:#f77257;
}

.text_white {
	color:#fff;
}

.text_grey {
	color:#999;;
}

.text_grey1 {
	color:#d4d4d4;;
}

.text_dark_grey {
	color:#515151;
}


h1.titre_projet {
	line-height:95px;
    font-size:80px;
    opacity:0.8;
    letter-spacing:0.2em;
    margin-bottom:20px;
}

h1.titre_projet_white_transparent {
	line-height:95px;
    font-size:80px;
    opacity:0.5;
    letter-spacing:0.2em;
   margin-bottom:20px;
}


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

/* REUTILISABLE */

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

.margin_top {
	margin-top:55px;
}

.margin_top {
	margin-top:35px;
}

.margin_top2 {
	margin-top:22px;
}

.margin_bottom_20 {
	margin-bottom:20px;
}

.margin_bottom_50 {
	margin-bottom:50px;
}

.margin_bottom_175 {
	margin-bottom:175px;
}

.margin_right_64 {
	margin-right:64px;
}

.margin_left_64 {
	margin-left:64px;
}


.pading_bottom_50 {
	padding-bottom:50px;
	
}
.pading_bottom_100 {
	padding-bottom:100px;
	
}

.padding_top {
	padding-top:50px;
	
	}
	
	
.padding_left {
	padding-left:50px;
}
.padding_right {
	padding-right:50px;
}

.background_grey {
	background-color:#0FF;
}


div.tiret3 {
	width:52px;
	height:3px;
	background-color:#464646;
	position:relativee;
	opacity:0.2;


}
.opacity {
	opacity:0.3;
}

.letter_spacing {
	letter-spacing:18px;
}

.inclinaison {
	  -moz-transform: rotate(10deg) skewY(-20deg);
    -webkit-transform:rotate(10deg) skewY(-20deg);
    -o-transform: rotate(10deg) skewY(-20deg);
}

.height_400 {
	height:345px;
}

div.tiret2 {
	width:26px;
	height:4px;
	background-color:#464646;
	position:relative;
	z-index:2;
    margin-bottom:20px;
	margin-top:20px;
    opacity:0.5;
	margin-left:-13px;
	left:50%;
}

div.tiret4 {
	width:26px;
	height:4px;
	background-color:#464646;
	position:relative;
	z-index:2;
    margin-bottom:40px;

    opacity:0.5;
	margin-left:-13px;
	left:50%;
}

div.tiret5 {
	width:26px;
	height:4px;
	background-color:#464646;
	position:relative;
	z-index:2;
 
	
    opacity:0.5;
	margin-left:-13px;
	left:50%;
}

#empty_marge {
	height:150px;

}

#empty_marge2 {
	height:120px;

}

.fixed {
	position:fixed;
}



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

/* MENU */

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



div.header {
	top:0;
     z-index:3;
	position:fixed;
  width:100%;
 /* background-image:url(images/bg_header.png); */
  opacity:0,9;
  height:83px;
  -moz-transition:0.4s;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
  
}
div.header:hover {
  background-color:#fff;
  opacity:1;
 
}


div.logo {
	margin-top:10px;
	margin-left:12px;
	height:86px;
	width:69px;
}

div.menu {
	position:relative;
	font-family: 'Montserrat', sans-serif;
font-weight: 700; 
	font-size:14px;
	letter-spacing:0.34em;

}


div.container_menu {
	position:absolute;
	top:0;
	margin-top:29px;
	margin-left:80px;

}
.reseau {
	position: absolute;
	right:40px;
	display: inline-block;
	top:28px;
}
span.label_menu {
	margin-left:45px;
	line-height:25px;
}




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

/* FULL SCREEN */

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



.slides {
  position: relative;
  background-color:#47dfdc;
}

.container {
	width: 100%;
	font-family: 'Montserrat', sans-serif;
}

div.presentation {
	font-family: 'Montserrat', sans-serif;
    font-weight:700; 
	font-size:94px;
	position:absolute;
	z-index:2;
    margin-left:20%;
	margin-top:125px;
    -moz-transform: rotate(10deg) skewY(-20deg);
    -webkit-transform:rotate(10deg) skewY(-20deg);
    -o-transform: rotate(10deg) skewY(-20deg);
}

div.tiret1 {
	width:72px;
	height:8px;
	background-color:#464646;
	position:absolute;
	left:50%;
	margin-left:-36px;
	z-index:2;
	top:50%;
}

#scroll_down {
	width:72px;
	height:72px;
	position:absolute;
	left:50%;
	margin-left:-36px;
	z-index:2;
	bottom:2%;
    text-align:center;
	background-image:url(images/home/fleche_bas.png);
	font-size:12px;
	
	
}



img.img_phone {
	z-index:3;
	position:absolute;
	height:100%;
	width:100%;
}



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

/* CONTAINER CENTRE */

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






.container_centre {
	position:relative;
    margin:auto;
    width:808px;

    text-align:center;

}

.container_centre_100 {
	position:relative;
    margin:auto;
    width:100%;

    text-align:center;

}

.container_height380 {
	height:380px;
	margin-bottom:175px;
}


.container_height150 {

	margin-bottom:30px;
}

.actweb {
	padding-bottom:50px;
}


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

/* MASSONRY PROJETS */

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



#container_project {
	margin:auto;
	position:relative;
    margin-left:50px;
	margin-right:50px;
    margin-bottom:125px;

}



#container {
	margin:auto;
	}


.item { 
	overflow: hidden;
   
    height:300px;
	width:400px;
}

.item img {
	display: block;
}

#fit-width .masonry {
  margin: 0 auto;
}


.roll_thumb {
	height:100%;
	width:100%;
	 opacity:0;
	 position:absolute;
	 z-index:2;
   transition:0.7s;
	-moz-transition:0.7s;
    -webkit-transition: 0.7s;
    -o-transition:0.7s;
	padding-top:50px;
	
	
}

.roll_thumb:hover {
	opacity:1;
	transition:0.3s;
	-moz-transition:0.5s;
    -webkit-transition: 0.5s;
    -o-transition:0.5s;
	padding-top:0px;

	}



div.text_project {
	position:relative;
	padding-top:80px;
    text-align:center;


}


.orange {
    background-color:#f5c4a4;
}

.grey {
    background-color:#6494e4;
}

.blue {
    background-color:#23c0ed;
}

.turquoise {
    background-color:#5cd5e6;
}


.pink {
    background-color:#ffadb9;
}

.grey1 {
    background-color:#dad9de;
}

.green {
    background-color:#3bd9da;
}

.red {
    background-color:#fc4454;
}


.yellow {
    background-color:#ffef6c;
}








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

/* PROJETS */

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




.container_titre_projet {
	

	position:absolute;
	z-index:2;
    width:700px;
	left:50%;
	margin-left:-350px;
	top:15%;

}




div.projet_text_client {
	width:370px;
	float:left;


    text-align:left;

}

div.projet_text_client2 {
	width:200px;
	float:right;
    text-align:right;
	padding-right:80px;


}


div.projet_image_annexe {
	width:372px;
    float:right;
	text-align:left;

}


img.image_projet {
	margin-top:45px;



}

img.image_projet_1 {

	margin-bottom:80px;


}


img.image_projet_fat {
	margin-top:55px;
	margin-bottom:90px;


}

img.image_projet_fat_about {
	margin-top:20px;


}




/* about   */

div.presentation_about {
	font-family: 'Montserrat', sans-serif;
    font-weight:700; 
	font-size:56px;
	position:absolute;
	z-index:2;
    margin-left:25%;
	margin-top:185px;
    -moz-transform: rotate(10deg) skewY(-20deg);
    -webkit-transform:rotate(10deg) skewY(-20deg);
    -o-transform: rotate(10deg) skewY(-20deg);

}


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

/*  FOOTER        */

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



div.footer {

	height:150px;
	width:100%;
	position:absolute;
	
	float:inherit;
	margin-top:20px;


	
}


@media screen  and (max-width: 1260px) { 


img.image_projet_fat {
	margin-top:65px;
	margin-bottom:40px;
	width:89%;


}



}



 @media screen  and (max-width: 914px) {  
 
 p {
	 font-size:22px;
 }
 
 
.container_centre {
	position:relative;
    margin:auto;
    width:100%;
	margin-top:50px;
    text-align:center;

}
 
 .container_titre_projet {

	text-align:center;
	width:400px;
	left:50%;
	margin-left:-200px;
	top:25%;

}

h1.titre_projet {
	line-height:65px;
	color:#1f1f1f;
	font-size:60px;
    opacity:0.8;
    letter-spacing:0.2em;
    margin-bottom:20px;
	text-align:center;
}

h1.titre_projet_white_transparent {
	line-height:65px;
	color:#FFFFFF;
	font-size:60px;
    opacity:0.5;
    letter-spacing:0.2em;
    margin-bottom:20px;
	text-align:center;
}


div.projet_text_client {

    float:left;
	margin-bottom:95px;
	text-align:left;

	padding-left:54px;
	width:80%;
	

}

div.projet_image_annexe {

    float:left;
	margin-bottom:95px;
	text-align:center;

	padding-left:54px;
	width:80%;
	

}



img.image_projet {
	margin-top:25px;
	margin-bottom:40px;
	width:88%;


}

.display_none {
	display:none;
}


 }
 


