#wrap{
  margin:0 auto; 
  width:800px; 
  position:relative
}


#viewport {
position: relative;
width: 86%; 

        float: left;
        display: block;
height: 495px;
overflow: hidden;
background:url('img/smoke-texture.png') no-repeat;

padding-left: 90px;

}
#viewport .smoke {
position: absolute;

width: 50%;

 
height: 250px;
background:url('img/smoke-texture.png') no-repeat;
bottom: 150px;
margin-left:0px


}




#viewport img {
 margin-left: 70px;

background-position:center;

}
	


@media screen and (max-width: 768px){
	

#viewport {
height:200px;
padding-top:20px;


}

	

	
	
#viewport img {
 margin-left: 50px;

background-position:center;

}
	
	
	
	
	#viewport .foto img {
	

	margin-right:70px;
	
	width:90%;
	
	}
	
}





@media screen and (max-width: 340px){
	

#viewport {
height:220px;
padding-top:20px;

margin-right: 60px;
}
	

	
}





.foto {

  position: relative;
  width: 100%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }

.foto a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 100%;
  left: 0;
  top: 0;
    
  }
  
  
.foto a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.foto img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
padding: 0;

  }
  
  
  
  
 
.img {

  position: relative;
  width: 60%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }

.img a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 60%;
  left: 0;
  top: 0;
    
  }
  
  
.img a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.img img {
  display: block;
  height: auto;
  float: left;
  width: 60%;
  border: 0;
padding: 0;

  }
   
   
   

.war {

  position: relative;
  width: 75%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }

.war a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 75%;
  left: 0;
  top: 0;
    
  }
  
  
.war a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.war img {
  display: block;
  height: auto;
  float: left;
  width: 75%;
  border: 0;
padding: 0;

  }
  
 

.map {

  position: relative;
  width: 90%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }

.map a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 90%;
  left: 0;
  top: 0;
    
  }
  
  
.map a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.map img {
  display: block;
  height: auto;
  float: left;
  width: 90%;
  border: 0;
padding: 0;

  }  
  
  
  
  
  
  
  
  
  
  
  
.foto2{

  position: relative;
  width: 85%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }
  
  
.foto2  {
  display: block;
  height: auto;
  float: left;
  width: 80%;
  border: 0;
padding: 0;

  }
  

  /*
.foto2 #audio1 {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 100%;
  left: 0;
  top: 0;
    
  }
  
  
.foto2 #audio1:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.foto2 #audio1 {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
padding: 0;

  }
  
  */
  
  
  

.esp {

  position: relative;
  width: 60%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
 padding: 0;
  margin-right: 0;
  }

.esp a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 60%;
  left: 0;
  top: 0;
    
  }
  
  
.esp a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.esp img {
  display: block;
  height: auto;
  float: left;
  width: 60%;
  border: 0;
padding: 0;

  }
  
  
  
  
  
.coci {

  position: relative;
  width: 100%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
  padding: 0;
  margin: 0;
  
  }

.coci a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 100%;
  left: 0;
  top: 0;
    
  }
  
  
.coci a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

.coci img {
  display: block;
  height: auto
  float: left;
  width: 100%;
  border: 0;

  }
  
  
  
  
#viewport{

  position: relative;
  width: 75%;
  
  height: auto !important;
  float:left;
  list-style: none;
  overflow: hidden;   
  padding: 0;
  margin: 0;
  
  }

#viewport a {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
   width: 75%;
  left: 0;
  top: 0;
    
  }
  
  
#viewport a:first-child {
  position: relative;
  display: block;
  float: left;
 
  }

#viewport img {
  display: block;
  height: auto;
  float: left;
  width: 75%;
  border: 0;

  }