#contenedor {
  width:1200px;
height: 100%;
margin: 0 auto;
/* background-image:  url("files/images/bg.png") ; */
top: 50%; /* Buscamos el centro horizontal (relativo) del navegador */
left: 50%; /* Buscamos el centro vertical (relativo) del navegador */
/*margin-top: -200px; /* Restamos la mitad de la altura del objeto con un margin-top */
/*margin-left: 4%; /* Restamos la mitad de la anchura del objeto con un margin-left */

}


#cabecera {
width: 100%;
}

#logo {
float: left;
width: 40%;
text-align: center;
}

#logo img{
height: 125px;
width: 490px;
}

#datos {
padding-top: 10px;
float: right;
width: 40%;
text-align: right;
color: #A4A4A4;
}

#datos a{
text-decoration: none;
color: #A4A4A4;
}

#datos a:hover{
text-decoration: none;
color: #81BEF7;
}


#menu{
width: 100%;
min-width: 800px;


}

#menu ul {

list-style: none;
margin-top: 30px;
margin-bottom: 30px;
padding: 0px;
float: left;
width: 100%;

}

#menu  ul li{
float: left;
width: 25%;
}

#menu ul li a {
display: block;
border-radius: 2px;
padding: 17px 10px 3px 10px;
text-decoration: none;
color: #00BFFF;
font-size: 40px;
text-align: center;
background-image: url("http://www.ferranyepes.net/files/images/sprite2Total.jpg");
background-position: 0 0;
height: 60px;
background-position: top;
 background-size: 100% 161px;
 border: 1px solid #D8D8D8;
}

#menu ul li a:hover{
color: #81BEF7;
text-shadow: 0 0 0.5em #CEF6F5;
background-color: #ba9e66;
background-position: 0 -80px;


}
#contenido {
  float: left;
  display: inline;
  text-align: justify;
  width: 100%;
  margin-bottom: 7%;

    
}

#extras {
float: left;
width: 30%;
padding: 10px;
}

#extras iframe {
margin-left: 50px;
}

#informacion{
float: right;
width: 60%;
color: #848484;
padding: 10px;
text-align: justify;

}

#presentacionFotos{
float: left;
width: 35%;
color: #848484;
padding: 10px;
text-align: justify;
min-width: 360px;
}

#informacionFotos{
float: right;
width: 24%;
color: #848484;
padding: 10px;
text-align: justify;

}

#informacionFotos a {
font-size: 15px;
text-decoration: none;
color: #00BFFF;
}

#informacionFotos a:hover{
font-size: 15px;
text-decoration: none;
color: #81BEF7;
}

#informacionDiseno{
float: right;
width: 60%;
color: #848484;
padding: 10px;
text-align: justify;

}

#informacionDiseno img{
height: 134px;
width: 108px;
margin: 4px;
}


#informacion img{
height: 180px;
width: 190px;
float: right;
box-shadow: 0px 0px 15px 5px #666;
margin-left: 20px;
margin-bottom: 5px;
border-radius: 5px;
}

#pie {
width: 99%;    

    clear: both;
    text-align: center;
    color: #6E6E6E;
   
    margin-top: 30px;
    position: relative;
    bottom: 0;
}



#figura1  {
 background: #fff;
 float:left;
  width: 217px;
 height: 340px;
 padding: 3px;
 border: 1px solid #fff; 
 

 
 box-shadow: 0px 0px 15px 5px #666;
 
 transform:rotate(-10deg);
 -ms-transform:rotate(-10deg); /* IE 9 */
 -moz-transform:rotate(-10deg); /* Firefox */
 -webkit-transform:rotate(-10deg); /* Safari and Chrome */
 -o-transform:rotate(-10deg); /* Opera */

 
 border-radius: 5px;

}

#figura2  {
 background: #fff;
 display: inline;
 float:left;
 margin: 80px;
 width: 235px;
 height: 340px;
 padding: 3px;
 border: 1px solid #fff; 
 
 box-shadow: 0px 0px 15px 5px #666;
 
 /* position: absolute; 
 top: 35%;
 left: 38%;  */
 
  margin-left: -130px;
  margin-top: 20px;
 
 transform:rotate(15deg);
 -ms-transform:rotate(15deg); /* IE 9 */
 -moz-transform:rotate(15deg); /* Firefox */
 -webkit-transform:rotate(15deg); /* Safari and Chrome */
 -o-transform:rotate(15deg); /* Opera */

border-radius: 5px;
 
}

#figura1 img  {
 background: #fff;
 width: 217px;
 height: 340px;
 
 }
 
 #figura2 img  {
 background: #fff;

 width: 235px;
 height: 340px;
 
 }
 
 #galeria{
float: left;
width: 53%;
color: #848484;
padding: 10px;
text-align: justify;


}

.thumb {
    width: 190px;
    height: 140px;
    overflow: hidden;
	float: left;
	margin-top: 0px;
	margin: 10px;
	 -webkit-transition:-webkit-transform 1s ease-out;
-moz-transition:-moz-transform 1s ease-out;
-o-transition:-o-transform 1s ease-out;
-ms-transition:-ms-transform 1s ease-out;
transition:transform 1s ease-out;
position: relative; overflow: hidden; 
}
.thumb img {
 
    min-width: 200px;
    min-height: 150px;
    width: 200px;
	display:block!important;
    -webkit-transition:-webkit-transform 1s ease-out;
-moz-transition:-moz-transform 1s ease-out;
-o-transition:-o-transform 1s ease-out;
-ms-transition:-ms-transform 1s ease-out;
transition:transform 1s ease-out;
}

.thumb:hover {
   /*  width: 210px;
	 height: 160px;
	 margin: -10px; */
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
box-shadow: 0px 0px 15px 2px #666;
}

 .thumb img:hover {
  /*    width: 210px;
	 height: 160px;
	 margin: -10px;
	 -moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1) */
} 

.thumb span.tooltip {display: none;}
.thumb:hover span.tooltip {
background: #81BEF7;
opacity: 0.8;
font-size:35px;
font-family: georgia;
text-align: center;
font-variant: small-caps;
left:0;
position:absolute;
top:0;
left:0;
display:block;
z-index:10;
width: 192px;
height: 40px;
}

.thumb:hover span.text {
opacity: 100;
opacity: 1;
color:#FFF;
font-size:35px;
font-family: georgia;
text-align: center;
font-variant: small-caps;
left:0;
position:absolute;
top:0;
left:0;
display:block;
z-index:10;
width: 192px;
height: 40px;
}

#paginas {
float: right;
padding-top: 15px;


}

#paginas img {
width: 15px;
height: 15px;
}

#paginas a {
font-size: 12px;
text-decoration: none;
color: #A4A4A4;
}

#paginas a:hover{
font-size: 12px;
text-decoration: none;
color: #81BEF7;
}


#clientes {

width: 140px;
padding-top: 5px;
padding-bottom: 5px;
position: absolute;
top: 50%;
 left: -60px; 
transform:rotate(-90deg);
 -ms-transform:rotate(-90deg); /* IE 9 */
 -moz-transform:rotate(-90deg); /* Firefox */
 -webkit-transform:rotate(-90deg); /* Safari and Chrome */
 -o-transform:rotate(-90deg); /* Opera */
 border: 1px solid #A4A4A4;
text-align: center;
 font:13px arial,sans-serif;
 color: #fff;
 background-color: #5882FA;
}

#clientes a{
text-decoration: none;
color: #fff;
}

#clientes:hover{
text-decoration: none;
background-color: #0000FF;
}

/* .over {position: relative; overflow: hidden; width:500px;}
.over span.tooltip {display: none;}
.over:hover span.tooltip {
background: rgba(128,0,0, .6);
color:#000000;
font-size:1em;
font-family: georgia;
text-align: justify;
font-variant: small-caps;
left:0;
position:absolute;
top:0;
left:0;
display:block;
z-index:10;
} */