/*
Theme Name: madeserpa
Theme URI: http://underscores.me/
Author: Girohost Soluções em Tecnologia
Author URI: http://girohost.com.br/
Description: A empresa Giro Host lhe proporciona assessoria completa, para que sua empresa tenha o crescimento duplicado na internet.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: madeserpa
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

madeserpa is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

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

* {
	margin:0;
	padding:0;
}

body{
	margin:0;
	font-family: 'Ubuntu', sans-serif;
	background-color: #f7f7f7;
}

#cabecalho{
	border-top:3px solid rgba(0, 0, 0, 0.3);
	background-image:url(imagens/madeira.jpg);
	background-size: 100%;
}

#topo{
	margin:0 auto;
	border:0px solid blue;
	max-width:1100px;
	padding: 0px 20px 15px 20px;
}

#contato-topo{
	width:170px;
	background-color: rgba(0, 0, 0, 0.5);
	text-align: center;
	color:white;
	float: right;
	padding: 5px;
	font-size: 14px;
	-webkit-border-bottom-right-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
	-moz-border-radius-bottomright: 15px;
	-moz-border-radius-bottomleft: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
}

#contato-topo-telefone{
	border:0px solid white;
	background-image:url(imagens/telefone.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: inline-block;
	vertical-align: middle;
	padding: 5px 0px 5px 25px;
}

#contato-topo-whatsapp{
	border:0px solid white;
	background-image:url(imagens/whatsapp.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: inline-block;
	vertical-align: middle;
	padding: 5px 0px 5px 25px;
}

.clear{
	clear:both;
}

#logo{
	border:0px solid yellow;
	margin:20px 0px 30px 20px;
	padding:5px;
	max-width: 250px;
	float:left;
}

#logo img{
	width: 100%;
}

/* Formatação do menu (Início) */

#menu li{
display: inline-block;

}
#barra-menu{
padding: 10px 0px;
margin: 0 auto;
background-color: #A62A2A;
}
#menu li a{
	text-decoration: none;
	color: #ffffff;
	margin-left: 50px;
	padding: 20px 0px;
}


.conteudo{
	margin:0 auto;
	border:0px solid blue;
	padding: 40px 20px 20px 20px;
	max-width: 1100px;
	min-height: 500px;
	color:gray;
}

.conteudo li{
	line-height:150%;
	margin-left: 20px;
}

h1{
	border:0px solid blue;
	background-image:url(imagens/back-h1.png);
	background-repeat: no-repeat;
	background-size: cover !important;
	max-width: 1024px;
	margin-bottom:20px;
	font-size:24px;
	padding: 5px 0px 5px 40px;
	text-align:left;
	color:white;
}

a{
	text-decoration: none;
	-moz-transition: all .3s;
	-o-transition:  all .3s;
	-webkit-transition: all .3s;
	transition:  all .3s;
}

p{
	font-size:16px;
	text-align:justify;
	line-height:150%;
	margin-bottom:15px;
}

.cada_produto{
    border:1px solid lightgray;
    display: inline-block;
    vertical-align: top;
    text-align: justify;
    margin: 1%;
    padding: 5px;
    width: 29%;
}

.cada_produto img{
    width: 100%;
}

.cada_produto h4{
    margin: 10px 0px 10px 0px;
    text-align: center;
    color:#A62A2A;
}

#info-produto{
	border:0px solid blue;
}

.info-produto-um{
	background-color:gray;
    text-align: left;
    margin: 0.5%;
    padding: 5px 0px 5px 10px;
    color:white;
    width: 30%;
    display: inline-block;
}

.info-produto-dois{
	background-color:lightgray;
    text-align: center;
    margin: 0.5%;
    padding: 5px 0px 5px 0px;
    color:gray;
    width: 63%;
    display: inline-block;
}

.mais{
	width: 1024px;
}
.mais a{
	margin:0 auto;
	border:2px solid gray;
	text-decoration: none;
	font-weight: bold;
	width: 130px;
	padding: 5px 10px 5px 10px;
	color: gray;
text-align: center;

}

.mais a:hover{
	background-color: gray;
	color:white;
}

#formulario-contato{
	border:0px solid blue;
	width:65%;
	display: inline-block;
	vertical-align: top;
}

#carta{
	border:0px solid blue;
	margin-top:70px;
	width:30%;
	display: inline-block;
	vertical-align: top;
}

#carta img{
	width:100%;
}

#orcamento{
	border:0px solid blue;
	margin-top:100px;
	width:30%;
	text-align: center;
	display: inline-block;
	vertical-align: top;
}

#orcamento img{
	width:80%;
}

#footer{
	background-color: #A62A2A;
}

#rodape{
	margin:0 auto;
	border:0px solid white;
	padding: 20px 20px 20px 20px;
	text-align: center;
	max-width: 1100px;
	line-height:150%;
	color:white;
}

#desenvolvido {
	margin:0 auto;
	border:0px solid blue;
	background-image:url(imagens/madeira.jpg);
	text-align: center;
	color:lightgray;
	padding:10px;
	font-size:12px;
}

#paginacao {text-align:center; margin:30px auto 0; color:gray;}
#paginacao a {border:2px solid gray; padding:5px 8px; color:gray; margin:0 1px; -webkit-transition: background-color 0.5s;}
#paginacao a:hover, #paginacao .current {background-color:gray; color:white; -webkit-transition: background-color 0.5s;}
#paginacao .current {cursor:default; color:white;}

/* Para alinhamento de imagens (Início) */

img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

/* Para alinhamento de imagens (Fim) */

#gallery-1{ margin: auto; }

#gallery-1 dl.gallery-item img{ width:220px; height:160px; margin-bottom:-15px; }

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
	border:0px solid blue;
	text-align: center;
}

.gallery-item {
	display: inline-block;
	margin-bottom:30px;
	text-align: center;
	vertical-align: top;
	width: 100%;
	border:0px solid blue;
}

.gallery-columns-2 .gallery-item {
	/*max-width: 50%;*/
	max-width: 467px;
}

.gallery-columns-3 .gallery-item {
	/*max-width: 33.33%;*/
	max-width: 311px;
}

.gallery-columns-4 .gallery-item {
	/*max-width: 25%;*/
	max-width: 233px;
}

.gallery-columns-5 .gallery-item {
	/*max-width: 20%;*/
	max-width: 187px;
}

.gallery-columns-6 .gallery-item {
	/*max-width: 16.66%;*/
	max-width: 180px;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}



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

	#contato-topo{
		margin:0 auto;
		margin-bottom: 20px;
		float: none;
	}

	#contato-topo-telefone{
		margin-right: 5px;
		padding: 5px 0px 5px 25px;
	}

	#contato-topo-whatsapp{
		border:0px solid white;
		padding: 5px 0px 5px 25px;
	}

	#logo{
		margin:0 auto;
		border:0px solid yellow;
		margin-bottom:20px;
		padding:10px;
		float:none;
	}

	#box_menu{
		margin: 0 auto;
		border:0px solid blue;
		margin-top:15px;
		width:100%;
		float:none;
	}

}


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

	.cada_produto{
	    border:1px solid lightgray;
	    display: inline-block;
	    vertical-align: top;
	    text-align: justify;
	    margin: 1%;
	    padding: 5px;
	    width: 45%;
	}

}


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

	.info-produto-um{
		background-color:gray;
	    text-align: center;
	    margin: 0.5%;
	    padding: 5px 0px 5px 0px;
	    color:white;
	    width: 100%;
	}

	.info-produto-dois{
		background-color:lightgray;
	    text-align: center;
	    margin: 0.5%;
	    padding: 5px 0px 5px 0px;
	    color:gray;
	    width: 100%;
	}

}


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

	#formulario-contato{
		margin: 0 auto;
		border:0px solid blue;
		width:90%;
		display: inherit;
	}

	#carta{
		display: none;
	}
	
	#orcamento{
		display: none;
	}

}


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

	.cada_produto{
		margin-bottom: 20px;
	    width: 90%;
	}

}