body{
	background-image: url("img/13.jpg");
}

.main{
	width:60%;
    margin: 0 auto;
    border: 1px solid hsla(0,0%,4%,.25);
    border-radius: 3px;
    position: relative;
    color: #0a0a0a;
   
	margin-bottom:1%;
	background-color:rgba(77, 142, 172, 0.6);
	
}

#header{
padding-top:3%;	
padding-bottom:2%;	
padding-left:2%;	
}


#header h1{
font-size:1.6em;
color:#fff;
  text-shadow: 2px 2px #000;
}


#header h2{
font-size:1.4em;
color:#fff;
  text-shadow: 2px 2px #000;
}

hr#linha{
	color:#000;
	width:100%;
}

nav.busca{
	width:100%;
	margin-left:-7%;
}

nav.busca ul{
	width:100%;
}

nav.busca li{
	display:block;
	margin-right:;
border:1px solid #000;
	list-style:none;
	max-height:;
	max-width:;
	width:100%;
	border-radius:5px;
}



nav.busca li a{
font-size:1.2em;
text-align:center;
color:#000;
  text-shadow: 1px 1px #ccc;
}



.busca li a:link, .busca li a:visited{
		display:block;
		text-decoration:none;
		background-color:;
		padding:0.3em 1em;
	

		}
		
		.busca li a:hover{
			color:#fff;
			
		background-color:#ccc;
		transition:all .8s ease;
		}
		
		form.example input{
			margin-top: -5%;
			border:1px solid #ccc;
		}
		
		.callout{
	  box-shadow: 3px 5px #000;

		}
		
		.row{
			max-width: 80.0rem
		}

.logo-img{
  width: 30%;
}



div.secondary.callout.text-center{
  min-height: 242px;
}

div.secondary.callout.text-center-02{
  min-height: 42px;
  background-color:#000;
}

h3#favoritos{
font-size:1.4em;
color:#ccc;
  text-shadow: 2px 2px #000;	
}

img.favoritos{
	border:3px solid #fefefe;
}

img.favoritos:hover{
	border:3px solid #ccc;
}

ul.favoritos li{
		display:block;
	list-style:none;
	width:100%;
	
}

a.favoritos{
	font-size:1.3em;
text-align:center;
color:#000;
  text-shadow: 2px 2px #ccc;
	
}

a.favoritos:hover{
	font-size:1.3em;
text-align:center;
color:#fff;
  text-shadow: 2px 2px #000;
	
}

h3#post{
font-size:1.8em;
color:#ccc;
  text-shadow: 2px 2px #000;	
}



h4#post{
font-size:1.5em;
color:#000;
  text-shadow: 2px 2px #ccc;	
}

img.post{
	width:100%;
}

p.post{
	text-align:left;
	margin:1%;
	font-size:1.1em;
color:#000;
  text-shadow: 2px 2px #ccc;	
}

	
textarea.form-control{
	
	width:100%;
}

h3.comentario{
font-size:1.6em;
color:#ccc;
  text-shadow: 2px 2px #000;	
  text-align:left;
}

.button {
  background-color: #000; /* Green */
  border: none;
  color: white;
  padding: 15px 32px;

  text-decoration: none;
  display: inline-block;
  font-size: 16px;

  cursor: pointer;
}

section.comentario{
	width:100%;
	height:114px;
	border: 2px solid #ccc;
	border-radius:10px;
	margin-bottom:1%;
}

div.icon{
	float:left;
	margin:2%;
	width:90px;
	height:90px;
	
}

p.comentarios{
	font-size:1.1em;
	text-align:left;
	margin-top:45px;
	color:#000;
	text-shadow: 2px 2px #ccc;
}



@media only screen and (max-width: 1700px) {
	
	.main{
	width:65%; 
	
}
	
}

@media only screen and (max-width: 1600px) {
	
	.main{
	width:70%; 
	
}
	
}

@media only screen and (max-width: 1500px) {
	
	.main{
	width:75%; 
	
}
	
}

@media only screen and (max-width: 1400px) {
	
	.main{
	width:80%; 
	
}

}

@media only screen and (max-width: 1300px) {
	
	.main{
	width:85%; 
	
}

}

@media only screen and (max-width: 1200px) {
	
	.main{
	width:90%; 
	
}

p.comentarios{
	font-size:1.0em;
}

}


@media only screen and (max-width: 1100px) {
	

p.comentarios{
	font-size:0.9em;
}

p.post{
	font-size:1.0em;
}

}

@media only screen and (max-width: 1050px) {
	
	img.favoritos{
	margin-left:10%;
	width:80%;
}

}


@media only screen and (max-width: 950px) {
	
#header h1{
font-size:1.5em;
}


#header h2{
font-size:1.3em;
}


p.comentarios{
	font-size:0.8em;
}

p.post{
	font-size:0.9em;
}

h3.comentario{
font-size:1.5em;

}


h3#post{
font-size:1.6em;

}

h3#favoritos{
font-size:1.3em;

}

}

@media only screen and (max-width: 850px) {
	
#header h1{
font-size:1.4em;
}


#header h2{
font-size:1.2em;
}

}

@media only screen and (max-width: 750px) {
	
div#coluna-01{
	display:none;
}

#header h1{
font-size:1.3em;
}


#header h2{
font-size:1.1em;
}

}





