@font-face {
   /* font-family: Genome;
    src: url(../fonts/Genome-Thin.otf); /* Menu */
}
@font-face {
   /* font-family: sketchMe;
    src: url(../fonts/sketch-me__FREE-version.ttf);*/
}

/* 
------------------------------ STRUCTURE ------------------------------
*/
*{color: #FFF}
html,
body {
	margin:0;
	padding:0;
	height:100%;
	font-family: sketchMe;
	font-weight: bolder
	color: #FFF;
	font-size: 25px;
}
#wrapper {
	min-height:100%;
	width: 100%;
	z-index: 0;
	background: #FFF;
	position:relative;
}
a{
	text-decoration: none;
}
/* 
------------------------------ CLASSES ------------------------------
*/
.icones{
	//width: 19%;
	width: 25%;
	//margin: 3%;
	margin: 4.1%;
	display: inline-block;
	text-align: center;
}
.icones img{
	max-width: 100%;
}
h1{padding: 0; margin: 0; font-family: 'Exo 2', sans-serif; font-weight: normal; font-size: 40px;clear:both; color: #FFF; transition: all 0.5s ease;}
h1:hover{color: #6a3339}
h4:hover{color: #6a3339}
.boxes2:hover{background:rgba(170,149,145,0.75);}
h4{
	font-size: 24px;
	font-family: 'Exo 2', sans-serif;
	text-transform: uppercase;
}
.centralizar{
	width: 90%;
	left: 0; right: 0; margin: auto;
}

.boxes2{
	display: inline-block;
    vertical-align: middle;
    width: 40%;
    padding: 0;
    margin: 8px;
    border-style: solid;
    border-color: #fdfdfd;
}

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

#content {
	width: 100%;
}
#content section{
	width: 100%;
	position: fixed;
	padding: 0%;
	height: 100%;
	z-index: 1;
}
section .boxes2 div{
	display: table;
	height: 100%;
	width: 100%;
}
/***** banner *****/
#banner{
	background: #fffdd0;
	background-size: cover;
	position: relative;
	width: 100%;
	font-weight: bold;
	padding: 0 !important;
}
#banner .square{
	width: 100%;
}
#banner .square:after{
	padding-bottom: 58%;
}
#menu-mobile{
	display: none;
}
#box{
	top: 0; bottom: 0; right: 0; left: 0;
	margin: auto;
	position: absolute;
	width: 100%;
	z-index: 2;
	background: rgba(106,51,57,0.75);
	text-align: center;
	padding: 5% 0;
	vertical-align: middle;
}
#box img{
	width: 40%;
}
nav{
	padding: 2% 0;
	width: 100%;
	height: 240px;
	text-align: center;
	margin-top: 80px;
}
#logo{
	top: 0;
}
#inf h4{
	font-family: Genome;
	text-transform: none;
	text-align: center;
	font-size: 18px;
}
div#inf {
    margin-top: 150px;
}
@media all and (max-width: 800px){
	.boxes3{
		width: 100%;
	}
	nav{
		min-height: 400px;
		margin-top: 1px; 
	}
	#box img{
		width: 80%;
	}
	h1{padding: 0; margin: 0; font-family: 'Exo 2', sans-serif; font-weight: normal; font-size: 35px;clear:both; color: salmon; transition: all 0.5s ease;}
	h1:hover{color: #FFF}
	h4{
		font-size: 15px;
		font-family: 'Exo 2', sans-serif;
		text-transform: uppercase;
	}	
	div#inf {
		margin-top: 1px;
	}
	.boxes2{
		width: 100%;
		display: inline-block;
		vertical-align: middle;
		padding: 0;
		margin: 0;
		border-style: none;
		/* border-color: #fdfdfd; */
	}
}