/*Documento CSS  style_bordado_maquina.css*/

 body{
        background-attachment: fixed;
       /* background-color:#F8F8F8;*/
	background-image:url(/static/img/bordado.jpg);
	/*background-repeat: no-repeat;
	background-position: 5px;*/
        /*text-align: center;*/
        /*color:#330066;*/
   }

/*Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.*/
@media screen and (max-width: 720px) {
      #container, .h1, .h2, .p, .a, #footer{
	  min-width: 240px;
	  width: 240px;
	 /*background-color: aqua;*/
  }
}

#container{
	border:0.1em solid #CCCC33; /*Considerada ultrapassada por alguns, largura, tipo e cor da borda*/
	position: relative;
	width: 55%;/*largura da div*/
	height:900px;/*altura da div*/
	margin: 0 auto;/*centraliza a página*/
	padding: 1.6em;/*afasta o texto da margem superior da div e não do browser*/
	background-color: #D3D3D3; /*cor de fundo*/
	box-shadow:0.5em 0.5em  0.8em  0.8em  #8B4513; /*sombra ao redor da div*/ 
	background-size: 100% 100%;
    }

 h1{
	margin: 1.2em; 
	font-family: "Segoe Print", "lucinda grande", "lucinda sans", verdana, sans-serif;
	font-style:italic; /*pode-se escolher entre oblique, normal, inherit*/
	font-weight: bold; /*define a tonalidade da fonte baseado em um parâmetro chamado peso varia de 100 a 900*/ 
	text-align: center;
        font-size: 2em;
	color:#6B8E23;
	}

h2{
  /* border:1px solid #CCCC33; Considerada ultrapassada por alguns, largura, tipo e cor da borda*/
   position: relative;
   width: 50%;/*largura da div*/
   height: 190px;/*altura da div*/
   margin: 0 auto;/*centraliza a página*/
   background-image:url(/static/img/bordado-agulha-magica.jpg);
   background-repeat: no-repeat;
   background-position: center;
   margin-bottom: 10%;
   /*text-align: center;*/
   /*color:#330066;*/
}

p{
border:0.1em dotted #3CB371;/*#E3BC58;*/
width: 50%;/*largura da div*/
border-radius: 1.25em; 
-moz-border-radius: 1.25em; 
-webkit-border-radius: 1.25em; 
padding: 0.2em; /*desloca o texto da margem esquerda da div. Não do browser*/
float: left;
text-align: center;
background-color: #FFEFD5;
 }

 a{
/*e todas as propriedades que ele terá*/
font-family: "Segoe Print", "Comic Sans MS", "Challenge Extra Bold", Arial, Helvetica, sans-serif;
/*Obs: Colocar mais de uma fonte, porque o browser escolhe a que tiver instalada.*/
font-size: 1.25em; 
color: #6B8E23;
text-decoration: none;
}

#footer{
     display: block;
     position: relative;
     float: left;
     width: 100%; 
     text-align: right;
}