/*Documento CSS style_estilizacao_cabecalhos_aula17.css  aula 17 XTI*/
 body  {    
        margin: 0;     
	padding: 0;    
	background-attachment:fixed; 
	background-image:url(/static/img/textura-escura1.jpg);
	/*background-repeat: no-repeat;
	background-position: 5px;*/
	}  
h1{
width: 50%;
height:25%;
margin: 0 auto;/*centraliza a página*/
border:60% solid beige;
background-color: #A2B5CD; /*colocando background-color: ActiveBorder; fica com a cor da janela ativa*/
background-image:url(/static/img/cssdraw4.jpg);
padding-left:3em;
background-repeat: no-repeat;
background-position: top right;
box-shadow: 0.1em 0.5em 0.2em 0.2em #181818;

color: orangered;
text-align: left;
font-size: 3em;
font-weight: 800;
letter-spacing: 0.2em; /*espaçamento entre as letras*/
line-height: 1em;
padding-top: 0.4em;
padding-bottom: 0.5em;
text-shadow: 10px 12px 3px #000; /*sombra no título*/

/*radius para arredondar as bordas - se quiser todas colocar bottom-left-radius, etc*/
border-top-left-radius: 1em;
border-bottom-right-radius: 1em;
webkit-border-top-left-radius: 1em;
webkit-border-bottom-right-radius: 1em;

}
/*Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.*/
@media screen and (max-width: 720px) {
    #container, .h1, .em, .p, .img{
	  min-width: 240px;
	  width: 240px;
	 /*background-color: aqua;*/
  }
}	
#container{
	width: 50%;
	margin: 0 auto;/*centraliza a página*/
	background-color: beige; /*colocando background-color: ActiveBorder; fica com a cor da janela ativa*/
	border-top:1px dotted black;
	border: 0.1em dotted #336600;
	padding: 2em;/*afasta o texto da margem esquerda da div e não do browser*/	 
	}

em {
  color: #009933; /*verde*/
}	
	
p{
  font-family: "lucinda grande", "lucinda sans", verdana, sans-serif;
  font-size: 1em; /*verde*/
  color: #2e2e2e;
	}
h1{
-moz-hyphens:auto;  
-ms-hyphens:auto;  
-webkit-hyphens:auto;  
hyphens:auto;  
word-wrap:break-word; 
}