
body{
	width: 100%;	
	height: auto;
	margin: 0 auto;
}


h1{
	text-shadow: 0px 1px 1px #000;
	font-size: 25pt;	
}

h2{
	text-shadow: 0px 1px 1px #000;
	font-size: 18pt;
	color: #fff;
}

h3{
	text-shadow: 0px 1px 1px #000;
	font-size: 16pt;
	color: #fff;
}

h4{
	text-shadow: 0px 1px 1px #000;
	font-size: 14pt;
	color: rgb(0, 0, 100);
}


h5{
	text-shadow: 0px 1px 1px #000;
	font-size: 13pt;
	color: #fff;
}


p{
	line-height: 40px;
	text-align: left;
	text-indent: 12px;
	font-size: 12pt;
}

.img_servicos{
	width: 60%;
	height: 100%;
}

/*------------------ CONSTRUÇÃO -----------------------*/
section#construcao{
	width: 100%;
	height: 700px;
}

.imgConstrucao{
	position: absolute;
	width: 50%;
	right: 5%;
}

article#construcao{
	position: absolute;
	width: 30%;
	height: auto;
	margin-top: 5%;
	left: 5%;
	color: rgb(0, 0, 50);
	text-align: left;
}

article#construcao h1{	
	color: rgb(0, 0, 50);
	text-shadow: none;
	text-align: left;
}

article#construcao h2{	
	color: rgb(0, 0, 50);
	text-shadow: none;
}

article#construcao a{
	font-size: 30pt;
}

.fontConstrucao{
	text-decoration: none;
	color: rgb(100, 100, 100);
}

.fontConstrucao:hover{
	text-shadow: 0px 0px 1px rgb(100, 100, 100);
}

/*------------------ SERVIÇOS -----------------------*/
section#servicos{
	position: relative;
	width: 100%;
	background: rgba(255, 255, 255, 1.0);
	padding: 30px 0px;
	text-align: center;
	z-index: 9;
}

article#servicos{
	margin: 5%;
}

article#item_servico{
	position: relative;
	width: 250px;
	height: auto;
	margin: 1%;
	text-align: center;
	line-height: 20px;
	display: inline-block;
}

article#servicos h1{
	position: relative;
	text-align: left;
	color: rgba(0, 0, 100, 1.0);
	font-size: 20pt;
}

article#servicos h4{
	position: relative;
	margin-top: 0px;
}

article#servicos h5{
	position: relative;
	text-decoration: none;
	color: rgba(0, 100, 100, 1.0);
	margin-top: -15px;
	opacity: 0;
}

article#item_servico:hover h5{
	opacity: 1;
}

article#servicos a{
	position: relative;
	text-decoration: none;
	color: rgba(0, 0, 50, 1.0);
	margin-top: 0;
}

article#item_servico:hover a{
	text-shadow: 0px 0px 1px #000;
}

figcaption#servicos{
	position: absolute;
	margin-top: 0;
}

hgroup#desenvolvimento{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/desenvolvimento.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#desenvolvimento{
	background: url('../img/servicos/desenvolvimento2.png');
	background-size: 100% 100%;	
}

hgroup#personalizado{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/personalizado.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#personalizado{
	background: url('../img/servicos/personalizado2.png');
	background-size: 100% 100%;	
}

hgroup#loja{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/loja.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#loja{
	background: url('../img/servicos/loja2.png');
	background-size: 100% 100%;	
}

hgroup#blog{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/blog.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#blog{
	background: url('../img/servicos/blog2.png');
	background-size: 100% 100%;	
}

hgroup#reconstrucao{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/reconstrucao.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#reconstrucao{
	background: url('../img/servicos/reconstrucao2.png');
	background-size: 100% 100%;	
}

hgroup#manutencao{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/manutencao.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#manutencao{
	background: url('../img/servicos/manutencao2.png');
	background-size: 100% 100%;	
}

hgroup#email{
	position: relative;
	width: 70%;
	height: 150px;
	margin-left: 15%;
	background: url('../img/servicos/email.png');
	background-size: 100% 100%;	
}

article#item_servico:hover hgroup#email{
	background: url('../img/servicos/email2.png');
	background-size: 100% 100%;	
}

article#apresenta_servicos{
	width: 45%;
	height: auto;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	margin-right: 2%;
}


/*--------------------- APRESENTE DESENVOLVIMENTO ----------------------------*/
section#apresenta_desenvolvimento{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;
	padding: 7rem 0;
}

section#apresenta_desenvolvimento h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_desenvolvimento h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_desenvolvimento p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE DESENVOLVIMENTO ----------------------------*/
section#apresenta_design{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;	
	padding: 7rem 0;
}

section#apresenta_design h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_design h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_design p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE LOJA ----------------------------*/
section#apresenta_loja{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;	
	padding: 7rem 0;
}

section#apresenta_loja h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_loja h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_loja p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE BLOG ----------------------------*/
section#apresenta_blog{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;
	
	padding: 30px 0px;
}

section#apresenta_blog h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_blog h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_blog p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE RECONSTRUCAO ----------------------------*/
section#apresenta_reconstrucao{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;
	
	padding: 30px 0px;
}

section#apresenta_reconstrucao h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_reconstrucao h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_reconstrucao p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE MANUTENCAO ----------------------------*/
section#apresenta_manutencao{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;
	
	padding: 30px 0px;
}

section#apresenta_manutencao h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_manutencao h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_manutencao p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}

/*--------------------- APRESENTE EMAIL ----------------------------*/
section#apresenta_email{
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;	
	padding: 7rem 0;
}

section#apresenta_email h1{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_email h2{
	
	color: rgba(0, 0, 100, 1.0);
}

section#apresenta_email p{
	font-size: 14pt;
	color: rgba(0, 0, 100, 1.0);
}


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

	/*------------------ CONSTRUÇÃO -----------------------*/
	section#construcao{
		width: 100%;
		height: 28rem;
	}

	article#construcao{
	    position: absolute;
	    width: 90%;
	    height: auto;
	    margin-top: 5%;
	    left: 5%;
	    color: rgb(0, 0, 50);
	    text-align: center;
	    display: inline-block;
	}

	article#construcao h1{
	    font-size: 14pt;
	    color: rgb(0, 0, 50);
	    text-shadow: none;
	    margin: 14px 0px;
	    text-align: center;
	}

	article#construcao h2{
	    font-size: 12pt;
	    color: rgb(0, 0, 50);
	    text-shadow: none;
	    text-align: left;
	    /* line-height: 18px; */
	    margin: 10px 0;
	}

	article#construcao a{
    	font-size: 16pt;
	}

	.fontConstrucao{
		text-decoration: none;
		color: rgb(100, 100, 100);
	}

	.fontConstrucao:hover{
		text-shadow: 0px 0px 1px rgb(100, 100, 100);
	}

	.imgConstrucao {
	    position: absolute;
	    width: 90%;
	    left: 5%;
	    margin-top: 65%;
	}

/*********************************** APRESENTAÇÃO **************************************/
	article#apresenta_servicos{
		width: 90%;
		height: auto;
		display: inline-block;
		text-align: center;
		vertical-align: middle;
		margin-right: 0;
	}

}