@charset "utf-8";
/* CSS Document */

*{
	margin: 0;
	padding: 0;
	}
	
	
body{
	background-color: #263F52;
	font-family: Tahoma, Geneva, sans-serif;
	}
	
h1, h2, h3{
	font-family: 'Mouse Memoirs', sans-serif;
	font-weight: normal;
    font-style: normal;
	}
	
p{
	font-size: 14px;
	}
	
h1{
	font-size: 60px;
	margin: 10px 10px;
	color: #093d52;
	}
	
h2{
	font-size: 40px;
	letter-spacing: -1px;
	margin: 10px 10px;
	color: #C00;
	}
	
h3{
	font-size: 30px;
	color: #093d52;
	}
	
h4{
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
	}
	
a{
	color: #093d52;
	}
	
a:hover{
	color: #FFF;
	}	
	
	
	
	
/*------------------ESTILOS PARA EL FONDO DE EDIFICIOS---------------------*/


div#contenedor_fondo{
	position:fixed !important;
	width: 100%;
	height: 250px;
	text-align: center;
	background-color: #FFF;
	-webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
	}
	
#fondo_edificios{
	width: 100%;
	height: 250px;
	background: url(../images/fondo_edificios.png) repeat-x;
	}



/*------------------FIN ESTILOS PARA EL FONDO DE EDIFICIOS---------------------*/


/*------------------ESTILOS PARA EL CONTENIDO---------------------*/


div#contenedor_cont{
	position: absolute;
	width: 100%;
	text-align: center;
	top: 0px;
	z-index: 2;
	}
	
div#centrada_cont{
	width: 950px;
	margin: auto;
	text-align: right;
	}
	
#cont{
	width: 630px;
	height: 100%;
	background-color: #FFF;
	float: right;
	-webkit-box-shadow: 0px 0px 60px rgba(50, 50, 50, 1);
    -moz-box-shadow: 0px 0px 60px rgba(50, 50, 50, 1);
    box-shadow: 0px 0px 60px rgba(50, 50, 50, 1);
	}
	


/*------------------FIN ESTILOS PARA EL CONTENIDO---------------------*/



/*------------------ESTILOS PARA LA CAPA SUPERIOR - MENU y LOGO COMEDIA---------------------*/


div#contenedor_sup{
	position:fixed !important;
	position: absolute;
	width: 100%;
	text-align: center;
	top: 0px;
	z-index: 3;
	}
	
div#contenedor_menu{
	width: 100%;
	height: 55px;
	text-align: center;
	background-image: linear-gradient(bottom, #263F52 0%, #132028 87%);
    background-image: -o-linear-gradient(bottom, #263F52 0%, #132028 87%);
    background-image: -moz-linear-gradient(bottom, #263F52 0%, #132028 87%);
    background-image: -webkit-linear-gradient(bottom, #263F52 0%, #132028 87%);
    background-image: -ms-linear-gradient(bottom, #263F52 0%, #132028 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #263F52),color-stop(0.87, #132028));
	overflow: hidden;
	}
	
div#centrada_menu{
	width: 950px;
	margin: auto;
	}
	

/*-------ESTILOS MENU---------*/
	
#menu_principal{
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: 'Mouse Memoirs', sans-serif;
	}
	
#menu_principal li{
	float: left;
	}
	
#menu_principal li a{
	display: block;
	text-decoration: none;
	font-size: 24px;
	padding: 5px 25px;
	-moz-border-radius-bottomright: 10px;
    -webkit-border-bottom-right-radius: 10px;
    border-bottom-right-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -webkit-border-bottom-left-radius: 10px;
    border-bottom-left-radius: 10px;
	background-image: linear-gradient(bottom, #FFF 0%, #8F8F8F 87%);
    background-image: -o-linear-gradient(bottom, #FFF 0%, #8F8F8F 87%);
    background-image: -moz-linear-gradient(bottom, #FFF 0%, #8F8F8F 87%);
    background-image: -webkit-linear-gradient(bottom, #FFF 0%, #8F8F8F 87%);
    background-image: -ms-linear-gradient(bottom, #FFF 0%, #8F8F8F 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #FFF),color-stop(0.87, #8F8F8F));
	border: 2px solid #8F8F8F;
	}
	
#item2 a:hover{
	background-image: linear-gradient(bottom, #B3C617 0%, #718802 87%);
    background-image: -o-linear-gradient(bottom, #B3C617 0%, #718802 87%);
    background-image: -moz-linear-gradient(bottom, #B3C617 0%, #718802 87%);
    background-image: -webkit-linear-gradient(bottom, #B3C617 0%, #718802 87%);
    background-image: -ms-linear-gradient(bottom, #B3C617 0%, #718802 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #B3C617),color-stop(0.87, #718802));
	border: 2px solid #718802;
	}
	
#item3 a:hover{
	background-image: linear-gradient(bottom, #FC0006 0%, #9C0101 87%);
    background-image: -o-linear-gradient(bottom, #FC0006 0%, #9C0101 87%);
    background-image: -moz-linear-gradient(bottom, #FC0006 0%, #9C0101 87%);
    background-image: -webkit-linear-gradient(bottom, #FC0006 0%, #9C0101 87%);
    background-image: -ms-linear-gradient(bottom, #FC0006 0%, #9C0101 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #FC0006),color-stop(0.87, #9C0101));
	border: 2px solid #9C0101;
	}
	
#item4 a:hover{
	background-image: linear-gradient(bottom, #FD8200 0%, #B63901 87%);
    background-image: -o-linear-gradient(bottom, #FD8200 0%, #B63901 87%);
    background-image: -moz-linear-gradient(bottom, #FD8200 0%, #B63901 87%);
    background-image: -webkit-linear-gradient(bottom, #FD8200 0%, #B63901 87%);
    background-image: -ms-linear-gradient(bottom, #FD8200 0%, #B63901 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #FD8200),color-stop(0.87, #B63901));
	border: 2px solid #B63901;
	}
	
#item5 a:hover{
	background-image: linear-gradient(bottom, #11A4DB 0%, #025FA0 87%);
    background-image: -o-linear-gradient(bottom, #11A4DB 0%, #025FA0 87%);
    background-image: -moz-linear-gradient(bottom, #11A4DB 0%, #025FA0 87%);
    background-image: -webkit-linear-gradient(bottom, #11A4DB 0%, #025FA0 87%);
    background-image: -ms-linear-gradient(bottom, #11A4DB 0%, #025FA0 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #11A4DB),color-stop(0.87, #025FA0));
	border: 2px solid #025FA0;
	}
	
#item6 a:hover{
	background-image: linear-gradient(bottom, #BA6FED 0%, #892CBE 87%);
    background-image: -o-linear-gradient(bottom, #BA6FED 0%, #892CBE 87%);
    background-image: -moz-linear-gradient(bottom, #BA6FED 0%, #892CBE 87%);
    background-image: -webkit-linear-gradient(bottom, #BA6FED 0%, #892CBE 87%);
    background-image: -ms-linear-gradient(bottom, #BA6FED 0%, #892CBE 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #BA6FED),color-stop(0.87, #892CBE));
	border: 2px solid #892CBE;
	}
	
#item7 a:hover{
	background-image: linear-gradient(bottom, #FDC900 0%, #BE7A00 87%);
    background-image: -o-linear-gradient(bottom, #FDC900 0%, #BE7A00 87%);
    background-image: -moz-linear-gradient(bottom, #FDC900 0%, #BE7A00 87%);
    background-image: -webkit-linear-gradient(bottom, #FDC900 0%, #BE7A00 87%);
    background-image: -ms-linear-gradient(bottom, #FDC900 0%, #BE7A00 87%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #FDC900),color-stop(0.87, #BE7A00));
	border: 2px solid #BE7A00;
	}
	
/*-------FIN ESTILOS MENU---------*/

	
div#centrada_comedia{
	width: 950px;
	margin: auto;
	}
	
#logotipo{
	width: 445px;
	height: 286px;
	float: left;
	clear: both;
	}
	
#pie{
	width: 320px;
	float: left;
	clear: both;
	}



/*------------------FIN ESTILOS PARA LA CAPA SUPERIOR - MENU y LOGO COMEDIA---------------------*/




.img_social { /* el rectángulo contenedor */
    position:relative; /* indicamos esto para poder posicionar su contenido de maera absoluta */
    height:55px; /* le damos una cierta altura */
    width:55px; /* le damos un cierto ancho */
	margin-left: 10px;
	float: left;
   }

.img_social img { /* el contenido */
    left: 0; /* posición izquierda */
    position:absolute; /* indicamos que su posición es absoluta con respecto al contenedor */
    top: 0; /* posición superior */
	-moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
  }
  /* y ponemos propiedades en las clases de cada imagen */
  /* la primera no será visible por defecto */
.img_social img.novisible {opacity:0;filter:alpha(opacity=0);}
  /* y se verá cuando pongamos el cursor encima del DIV */
.img_social:hover img.novisible {opacity:1;filter:alpha(opacity=100);}
  /* la segunda se ocultara siempre que pongamos el cursor encima del DIV o de la imagen */
.img_social:hover img.visible {opacity:0;filter:alpha(opacity=0);}
.img_social img.visible:hover {opacity:0;filter:alpha(opacity=0);} 





#copyright{
	width: 320px;
	clear: both;
	padding-top: 10px;
	} 
	
#copyright p{
	font-size: 11px;
	color: #5e8fb4;
	}







