/*Documento CSS style-links-interessantes.css*/
	 
body{
     background-image:url(/static/img/ecologia-pedra.jpg);/*declarar uma imagem*/
     /*background-repeat: no-repeat;
      background-position: 5px;*/
      background-attachment: fixed;
      /*background-color: #F8F8F8;*/
 }
	
/*Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.*/
@media screen and (max-width: 720px) {
      #container, .p, em, .h3{
		   min-width: 240px;
		  width: 240px;
		 /*background-color: aqua;*/
	
  }
}
	
#container{ /*Lembrete: cuidado ao digitar, a cerquilha deve estar colada a palavra div. Se ficar espaço não funciona*/
	width: 55%; /*largura da div que o texto está dentro*/
	/*height: 60px; /*tirar a altura por causa do texto*/
	border: 1px solid #90dc61; /*#3CB371;/*#CCC;*/
	margin: 0 auto;/*centraliza a div automaticamente na janela do browser*/
	/*background-color:#CCCC33;*/
	padding: 1.4em; /*desloca o texto da margem esquerda da div. Não do browser*/
	background-image:url(/static/img/fundoverdeagua.jpg);
	/*background-repeat: no-repeat;*/
	background-position: 5px;
	font-family: "lucinda grande", "lucinda sans", verdana, sans-serif;
	font-size: 1em;/*tamanho em pixels*/ 
	/*color: #FFFFFF;/*muda a cor da fonte para branca*/
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	/*box-shadow:5px 10px 10px 10px #CCC; *#8B4513;/*sombra ao redor da div*/
	}
	
em{
	  font-size: 1.4em;
	  color:#000;/*muda a cor da fonte*/
	  text-align: center;  
	}
	
a{
	text-decoration:none;
	font-size: 1em;
	}

 h2{
	 font-family: "lucinda grande", "lucinda sans", verdana, sans-serif;
	 /*font-size: 36px;/*tamanho em pixels*/ 
	 color:#002059;/*muda a cor da fonte*/
	 text-align: center;  
	 padding-left: 0.8em;
	 }
	 
	 
p{
	border: 1px dotted #3CB371;/*#E3BC58;*/
	margin: 0 auto;
	/*text-align: justify;/*alinhamento justificado. Ocupa todo o espaço em branco*/
	border-radius: 1.25em; 
	-moz-border-radius: 1.25em;
	-webkit-border-radius: 1.25em;
	padding: 0.75em; /*desloca o texto das margens da div*/
	text-align: center;
	 }
	 	
span.destaque{
	  border: 1px dotted black;
	  width: 45%;
	  height:150px;
	  float:right;
	  margin: 0.3em;/*Afasta das margens da div*/
	  background-image:url(/static/img/colorcalc-small.jpg);
	  background-repeat: no-repeat;
	  padding-left: 0.5em; /*afasta o texto da lateral esquerda do box*/
	  padding-right: 0.5em; /*afasta o texto da lateral esquerda do box*/
	  padding-top: 0.875em; /*afasta o texto do topo do box*/
	  padding-bottom: 0.875em; /*afasta o texto da parte inferior do box*/
	  font-size: 0.625em;
	  box-shadow: 0.2em 0.2emx 0.1em 0.4em #FFFF99; /*1ªdireita, 2ªinferior,  3ªnão faz diferença, 4ªdistribui em torno de tudo*/
	  }	 
	  
span.destaque1{
	  border: 1px dotted black;
	  width: 45%;
	  /*height:170px;*/
	  float:right;
	  margin: 0.5em;/*Afasta das margens da div*/
	  background-color: #F5F5DC;
	  padding-left: 0.5em; /*afasta o texto da lateral esquerda do box*/
	  padding-right: 8px; /*afasta o texto da lateral esquerda do box*/
	  padding-top:  0.875em; /*afasta o texto do topo do box*/
	  padding-bottom:  0.875em; /*afasta o texto da parte inferior do box*/
	  font-size:  0.875em;
	  color: #330066;
	  }
		
h2, em{
-moz-hyphens:auto;
-ms-hyphens:auto; 
-webkit-hyphens:auto;
hyphens:auto;
word-wrap:break-word;
}