/*Documento CSS style_album_maria_fernandes.css*/

body  {    
    margin: 0;     
	padding: 0;  
	background-attachment: fixed; /*fixa o fundo*/
	background: beige; /*#DDD;*/
	background-image:url(/static/img/marrom.jpg);
	/*background-image:url(/static/img/textura-calcamento-paint.png);*/
	/*background-repeat: no-repeat;
	background-position: 5px;*/
	} 

/*Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.*/
@media screen and (max-width: 720px) {
      #container, .img, .ul, .li, .p, #footer{
	  min-width: 240px;
	  width: 240px;
	 /*background-color: aqua;*/
  }
}	
	       
#container{
	border: 1em groove #EBD699;
	width: 55%;
	margin: 0 auto;
	padding-left: 16px;
        background: #FAF5E6;
	}
	
.foto1{
        position: relative;
        float: left;
        border: 0.5em groove #EBD699;
	width: 16%;
	height:120px;
	padding:  0.7em;
	margin-top: 10px;
	margin-left: 16px;
	text-align: center;
	background: #000 url(/static/img/white-rose-on-the-black-background.jpg);
	background-repeat: no-repeat;
	background-position: -15px;
	/*z-index:1;*/
	}	
		
	
.foto2{ 
       position: relative;
        float: left;
        border: 0.5em groove #EBD699;
	width: 17%;
	height:120px;
	padding:  0.7em;
	margin-top: 10px;
	margin-left:  0.5em;
	text-align: center;
	}	
		
.foto3{
        position: relative;
        float: left;
        border: 0.5em groove #EBD699;
	width: 17%;
	height:120px;
	padding:  0.7em;
	margin-top: 10px;
	margin-left:  0.5em;
	text-align: center;
	}			
.foto4{
         position: relative;
        float: left;
        border: 0.5em groove #EBD699;
	width: 17%;
	height:120px;
	padding:  0.7em;
	margin-top: 10px;
	margin-left:  0.5em;
	text-align: center;
}
		
   h2, h4{
	color: #002088;
	text-align:center;
  }

  h3{
	color: #B00000;
  }	
  
  em{
    color: #B00000;
	font-size: 20px;
  }
  
  li{
   /*list-style:none;*/
   padding-left: 15px;
   font-size: 18px;
  }
  
  p{
   text-align: justify;
   padding-left: 10px;
   padding-right: 10px;
   font-size: 16px;
  }
#footer{  
	width: 55%; 
	height: 80px;
	float: left;
	margin-left: 20%;
	text-align: center;
 }