
/*/////////////////////// 768 À 1024 ///////////////////////*/
/* #1- Large desktop */
@media (min-width: 1024px) {

#mobile-menu, #mobile-menu-scroll{
display:none !important;
}


}

@media (min-width: 768px) and (max-width: 1023px) {

	#header{
	background-image: url("../images/header-light.jpg");
	transition: background 0.3s;
	-webkit-transition: background 0.3s; /* Safari */
	}
	#mobile-menu, #mobile-menu-scroll{
	display:none !important;
	}
	.menu-p li a{
	margin-right:20px;
	padding:0 20px 5px 0;
	transition: padding 0.3s, margin-right 0.3s;
	-webkit-transition: padding 0.3s, margin-right 0.3s; /* Safari */
	}
	.menu-p li a:hover{
	padding:0 30px 5px 0;
	margin-right: 10px ;
	}		
	#menu-u li{
	margin-left:10px;
	transition: margin-left 0.3s;
	-webkit-transition: margin-left 0.3s; /* Safari */
	}
	#discover a{
	color:#606161;
	}
	#content h2{
	margin-left:0px;	
	}
	#content .content-top img{
	margin-top:125px;
	margin-left:-50px;
	width:450px;
	}
	#footer{
	background-position:150px 0;
	}
	

}





@media (max-width: 767px) {

	#header{
	background-image: url("../images/header-light.jpg");
	transition: background 0.3s;
	-webkit-transition: background 0.3s; /* Safari */
	}
	#mobile-menu-icon{
	position: relative;
	width: 34px;
	height: 30px;
	background: url("../images/mobile-menu.png");
	float:left;
	margin-top:47px;
	z-index:995;
	cursor: pointer;
	}	
	#mobile-menu-scroll-icon{
	position: relative;
	width: 34px;
	height: 30px;
	background: url("../images/mobile-menu.png");
	float:left;
	margin-top:25px;
	z-index:995;
	cursor: pointer;
	}	
	.menu-p{
	display:none;
	}
	#header .logo{
	margin-top:75px;
	transition: margin 0.3s;
	-webkit-transition: margin 0.3s; /* Safari */
	}
	#header .content{
	width:100%;
	margin-top: 50px;
	}
	#discover a{
	color:#606161;
	}
	#content a{
	margin-top:25px;
	}
	#content h2{
	margin-left:0px;	
	}
	#content .content-top{
	margin-bottom:75px;
	}
	#content .content-top img{
	width:100%;
	margin-left:0;
	}
	#content input.simple-field{
	width:96%;
	padding:0 2%;
	margin:auto;
	}
	.float, .float-55, .float-35{
	width: 100%;
	margin:auto;
	}
	#content .float, .float-55, .float-35{
	margin-bottom:55px;
	} 
	#footer{
	background-position:100px 0;
	}
	#inuit-art{
	border-bottom: 1px solid rgba(63,63,63,0.22);
	}
		
}
@media (max-width: 480px) {
	
	#header{
	background-image: url("../images/header-light.jpg");
	transition: background 0.3s;
	-webkit-transition: background 0.3s; /* Safari */
	}
	#header h1{
	font-size: 3.4em;
	margin-bottom:50px;
	transition: font-size 0.3s;
	-webkit-transition: font-size 0.3s; /* Safari */
	}
	#header h2{
	font-size: 2.5em !important;
	transition: font-size 0.3s;
	-webkit-transition: font-size 0.3s; /* Safari */
	}
	#discover a{
	color:#606161;
	}
	#content .content-top{
	margin-bottom:75px;
	}
	#footer{
	background-position:-50px 0;
	}
	
	
}


























/*/////////////////////// STYLES ///////////////////////////*/
/*body{
font-family: 'cabin'; 
color:#606161;
}
#header{
position: relative;
width:100%;
height: 860px;
background: #e8e8e8;
}
	#header .wrapper{
	position:relative;
	width:960px;
	height: 860px;
	margin: auto;
	}
	#background-header{
	position:absolute;
	left:-755px;
	top:0;
	z-index: 0;
	}
	#menu-p li{
	position: relative;
	display:inline-block;
	z-index: 5;
	margin-top:50px;
	font-family: 'geogrotesque';
	text-transform: uppercase;
	float: left;
	}
		#menu-p li a{
		color: #606161;
		text-decoration: none;
		border-bottom: solid 1px #606161;
		margin-right:35px;
		padding:0 25px 5px 0;
		transition: padding 0.3s, margin-right 0.3s;
		-webkit-transition: padding 0.3s, margin-right 0.3s; 
		}
		#menu-p li a:hover{
		padding:0 45px 5px 0;
		margin-right:15px;
		}
	#menu-u li{
	position: relative;
	display:inline-block;
	z-index: 5;
	margin-left:25px;
	margin-top:50px;
	font-family: 'geogrotesque';
	text-transform: uppercase;
	float: right;
	color:#aaaaaa;
	transition: margin-left 0.3s;
	-webkit-transition: margin-left 0.3s; 
	}
		#menu-u li a{
		color: #aaaaaa;
		text-decoration: none;
		border-bottom: solid 1px #aaaaaa;
		font-size: 0.8em;
		padding:0 0 5px 0;
		transition: color 0.3s;
		-webkit-transition: color 0.3s; 
		}
		#menu-u li a:hover{
		color: #606161;	
		}
	#logo{
	position: relative;
	z-index: 5;
	margin-top:135px;
	float: left;
	}
	#header .content{
	position: relative;
	z-index: 5;
	float:right;
	margin-top:135px;
	width:500px;	
		
	}
		#header h1{
		color: #e66132;
		font-family: 'geogrotesque-bold';
		font-size:4.7em;
		text-transform: uppercase;
		margin-bottom: 65px;
		}
		#header p{
		line-height: 36px;
		font-size:1.4em;
		}
		#discover a{
		display: block;
		width:150px;
		font-family: 'geogrotesque';
		height: 95px;
		text-transform: uppercase;
		color:#aaaaaa;
		margin:auto;
		background-image: url("../images/arrow-header.jpg");
		background-repeat: no-repeat;
		background-position: 50% 50%;
		text-align: center;
		margin-top:60px;
		line-height: 20px;
		text-decoration: none;
		transition: background-position 0.3s, color 0.3s;
		-webkit-transition: background-position 0.3s, color 0.3s; 
		}
			#discover a:hover{
			background-position: 50% 100%;
			color: #e66132;
			}
#content{
position: relative;
width:100%;
height: auto;
background: #e76132;
color:#ffffff;	
}
	#content .wrapper{
	position: relative;
	width: 960px;
	margin:auto;
	padding-top:75px;
	padding-bottom: 125px;
	}
	#background-content{
	position:absolute;
	left:-425px;
	top:0;
	z-index: 0;
	}			
	#content .content-top{
	position: relative;
	height: auto;
	margin:0 0 100px 0;
	z-index: 999;
	}
			#content h2{
			font-family: 'geogrotesque';
			font-size: 2.4em;
			display: inline-block;
			padding:70px 0 70px 25px;
			background-image: url("../images/bg-h2-home.jpg");
			background-repeat: no-repeat;
			background-position: left 50%;
			margin-left:-25px;	
			padding-right: 30px;
			}
			#content p{
			display: block;
			font-family: 'cabin';
			line-height: 36px;
			font-size:1.4em;
			color: #552616;	
			}
			#content a{
			display: inline-block;
			color: #552616;	
			margin-top:50px;
			line-height: 1.3em;
			border-bottom: 1px solid #552616;
			font-size:1em;
			text-decoration: none;
			padding:0 0 5px 0;
			}
			#content .content-top img{
			margin-top:60px;
			margin-right:-175px;
			}
	#content .content p{
	display: inline-block;
	font-family: 'cabin';
	line-height: 2em;
	font-size:1em;
	color: #552616;	
	}
	#content .content h3{
	font-family: 'geogrotesque';
	font-size: 2em;
	display: block;
	padding:45px 110px 45px 0;
	background-repeat: no-repeat;
	background-position: right 50%;	
	}
		#content .content h3.boat{
		background-image: url("../images/boat.jpg");	
		}
		#content .content h3.truck{
		background-image: url("../images/truck.jpg");	
		}
	#content .content a{
	float: right;	
	}
#footer{
background: #e8e8e8;
height: 145px;	
}	
	#footer .wrapper{
	position: relative;
	width: 960px;
	margin:auto;
	z-index: 0;
	}
		#inuit-art{
		position:relative;
		float: left;
		width:400px;
		height: 145px;
		background: url("../images/inuit-art.jpg") no-repeat left 50%;
		z-index: 999;
		}
			#inuit-art p{
			padding: 60px 0 0 65px;
			color: #aaaaaa;
			font-family: 'geogrotesque';
			}
			#inuit-art a{
			color: #606161;
			transition: color 0.3s;
			-webkit-transition: color 0.3s; 
			text-decoration:none;
			}
				#inuit-art a:hover{
				color: #e66132;
				}
		#coordonees{
		position:relative;
		float: right;
		width:350px;
		height: 145px;
		z-index: 999;
		font-family: 'cabin'; 
		}
			#coordonees .float-47 p{
			padding-top:25px;
			line-height: 1.3em;
			color: #aaaaaa;
			}
			#coordonees .float-47 span{
			color: #e66132;
			line-height: 1.7em;
			}
		#background-footer{
		position:absolute;
		right:-300px;
		top:0;
		z-index: 0;
		}
		
	

		
		
		
		
		
		
		
		
		
		
		
		
		
*/		
/*//////////////////////// STYLES ///////////////////////////*/
/*
.clr-both{
clear: both
}
.float{
float:left;
width: 45%;
}
.float-47{
float:left;
width: 47.5%;
}
.float-55{
width:55% !important;
}
.float-35{
width:35% !important;
}
.margin-10{
margin-right:10%;
}
.margin-5{
margin-right:5%;
}	
.align-right{
text-align: right;
}	
*/
		