@import url("reset.css"); 
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic);
/*font-family: 'Roboto', sans-serif; */

body {
	font: normal normal 400 12px/normal 'Roboto', Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	top:    0px;
	color:  #333333;
}


#header {
	background:#FFFFFF url(../imagenes/banner_fondo.gif) repeat-y;
	width: 970px;
	height: 6.3em; 
	margin: .8em auto 0;
	border: 1px solid #CCCCCC;
	border-bottom: 1px none #CCC;
	position:relative;
	z-index:10;
}

#header h1 {
	font:  normal 2.2em 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #666666;
	margin: .5em 0px 0px 20px;
	padding: 0px;
	width: 520px;
} 

#header h2 {
	font: 1.2em/1.4em lighter 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #666666;
	margin: 8px 0px 0px 40px;
	padding: 0px;
}

#header a {
	text-decoration: none;
	padding: 0 10px;
	color: #666666;
}

#header a:hover {
	color: #666666;
	background-image: url(../imagenes/banner_fondo_ahoover.jpg);
}

.blanco{
	background-color: #B0B0B0;
	padding-bottom: 2px;
	border: 1px solid #CCCCCC;
}

#header h3 {
	font: .9em lighter 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
    color: #999999;
    text-align: right;
    position: absolute;
    top: 1em;
    width: 70px;
    right: 17px;
    line-height: 140%;
}

#col2interna div.container {
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
	position: relative; 
	display: table
}

img.displayed {
	display: block; 
	margin: 0em auto;
}
 
#col2interna p {
	 display: table-cell; 
	 vertical-align: middle; 
	 text-align: center
} 

#col2interna img {
	width:124px;
	height:auto;
} 

#cuerpo {
	width: 970px;
	min-height: 500px;
	border-right: solid 1px #CCC;
	border-left:  solid 1px #CCC;
	line-height: normal;
	margin: 0 auto;
	padding: 0 0 20px 0;
	background: #FFF url(../imagenes/fondo_cuerpo.jpg) bottom left no-repeat  ;
	position:relative;
	z-index:0;

}

#cuerpo a {	
	text-decoration:none;
	color:#900;
	font-weight:bold;
}

#cuerpo a:hover {	
	color: #000;
}

#cuerpo h1{
	color:#999999;
	font:  normal 19px 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	letter-spacing: 0.2em;
	width: 175px;
	margin: 0px 0px 0px 0px;
	padding: 10px 0px 10px 10px;
/*	border: thin dotted #00FFFF; */
	float:left;
	
	}
	
#cuerpo h2{
	color:#999999;
	font:normal 16px 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	position: relative;
	width: 750px;
	top: 0px;
	margin: 10px 0;
}

#cuerpo h3{
	color:#FFFFFF;
	font:normal  12px 'Roboto', Verdana, Arial, Helvetica, sans-serif;
	background-color: #666666;
	padding: 1px;
	margin-top: 20px 0 0 1px0;
	left: 7px;
	padding-left: 10px;
}

#cuerpo h4{
	color:#FFFFFF;
	font: 11px normal 'Roboto', Verdana, Arial, Helvetica, sans-serif;
/*	position: relative; */
	top: 0px;
	background-color: #666666;
	left: 7px;
	float: none;
	padding: 1px 1px 1px 10px;
	margin: 20px 0px 20px 0px;
}
.der {
text-align: right;
}

#cuerpo  h5{
	font: 11px lighter 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #666666;
	left: 720px;
	position: relative;
	width: 60px;
	top: -10px;
}

#cuerpo .luna{
	font-size: 44px;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	position:absolute;
	left: 516px;
	top: 413px;
}

#cuerpo .luna2{
	font-size: 10px;
	color: #C01135;
	font-family: 'Roboto', "Courier New", Courier, monospace;
	position:absolute;
	height: 40px;
	left: 516px;
	top: 413px;
}

#cuerpo .videoppla
	{
	position:absolute;
	width: 400px;
	height: 336px;
	left: 516px;
	top: 50px;
}


#cuerpo .imagenluna{
	position:absolute;
	width: 400px;
	height: 304px;
	left: 54px;
	top: 65px;
	overflow:hidden;
}


.colcuerpo {
/*	position: relative;
	display:table; */
	top:0px;
	left: 0em;
	margin: 0px;
	padding: 0px;
	width:814px;
/*	border: thin dotted #CC6600; */
	float:right;
}
	
.colcuerpo p,
.colcuerpo li{
	line-height: 140%;
	letter-spacing: 0.1em;
	text-align: justify;
	margin: 0px;
	padding: 5px;
	font-style: normal;
	color: #666666;	/*	border: thin dotted #CC6600; */
/*	font-size: 0.9em; */
}

.colcuerpo li{
	padding: 0px;
	margin:0px;
}

.colcuerpo ol{	list-style-type: decimal;
padding-left:25px;
margin:0;
}

.colcuerpo ul{	list-style-type: circle;
padding-left:25px;
margin:0;
}

.colcuerpo h1 {
	color:#999999;
	font: 19px normal 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	letter-spacing: 0.2em;
	margin-top: 10px 0 0 0;
	top: 0px;
	padding-left: 20px;
}

.colcuerpo .fotobanner {
	position:relative;
/*	text-align:right; */
	top: 10px;
/*	right: 23px; */
	margin-top: 0px;
}

.colcuerpo .texcuerpo {
	height: auto;
	width: auto;
	padding: 0px 30px 10px 20px;
	clear:both;
/*	left: 0px;
	top: 0px; 
	margin: 0px 0px 20px 0px;*/
}

 .colcuerpo .col1 {
	position: relative;
	width: 18%;
	height: auto;
	float: left;
	margin: 0 0 20px 25px;
	border: 1px  solid #CCCCCC;
	margin-top: 0px;
	font: 12px/1.5em normal 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #999999;
	background-color: #FFFFFF;
	text-decoration: none;
	padding: 0 10px 10px 10px;
	top: 10px;
} 

.colcuerpo .col1 img{
	width:130px;
	height:auto;
	position: relative;
}
	
		
.colmenu {
	top: 0px;
	left: 0px;
	width: 150px;
	font-size: 14px;
	background-image: url(../imagenes/fondo_menu_arte.gif);
	text-decoration: none;
/*	height: 250px; */
	background-repeat: repeat;
/*   	border: thin dotted #CC6600;  */
	float:left;
}

.colmenu p{
	font: 10px/120% lighter 'Roboto', Verdana, Arial, Helvetica, sans-serif;
	color: #999999;
	text-align: left;
	padding: 3px;
}

.fotogrande,
.fotogrande-fija {
	font-family: 13px normal 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #666666;
	position:relative;
	background-color: #FFFFFF;
	top: -40px;
	margin-left: 20px;
	text-align: justify;
}

.fotogrande-fija{
	width:338px;
}

.colfoto {
	position:relative;
	float:left;
	height: auto;
	font: 12px normal 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #999999;
	line-height: 1.5em;
	margin: 0 0 0 12px;
	width: 70%;
	text-align: right;
	padding: 0px 0px 20px 0;
	top: 0px;
	
}

.colfoto img{
	border: solid 1px #CCC;
	border-right-width: 2px;
	border-bottom-width: 2px;
	padding: 2px;
	background-color: #FFFFFF;
}
	
.colexpfoto {
	position: relative;
	font: 12px/1.5em normal  'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #999999;
	padding: 5px;
	background-color: #FFFFFF;
	text-decoration: none;
	text-align: right;
	width: 24%;
	float: left;
	border: solid 1px #CCC;
	border-right-width: 2px;
	border-bottom-width: 2px;
}

.colexpfototit {
font-weight:bold;
}

.colexpfoto1 {
	border: 1px  solid #CCCCCC;
}	

.escallon {
	margin-right: 15px;
	margin-left: 15px;
}

	
#colmenu a:hover {
	color: #666666;
	background-color: red;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-color: #CCCCCC;
	border-right-color: #CCCCCC;
	border-left-width: 1px;
	border-left-color: #CCCCCC;
}
	
#colmenu a{
	text-decoration: none;
	color: #666666;
	}

.col2 {
	width: 130px;
/*	height: 220px; */
	float: left;
	font: normal 10px/1.5em 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color:#333333;
	text-decoration: none;
	margin: 0 0 2px 17px;
	background-position: center;
/*	border: 1px solid #999999;   */
	top: auto;
	text-align: left;
}	

.col2interna {
	width: 130px;
	height: 130px;
	font: normal 30px 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	/*color: #999999; */
	background-color: #FFFFFF;
	line-height: 1.5em;
	text-decoration: none;
/*	border: 1px solid #999999; */
	border: none; 
	text-align: center;
	vertical-align: baseline;
	padding-top: 6px;
}	
.col1 a {
	text-decoration:none;
	color: #999999;
}
	
.fotobanner2 {
	text-align:right;
	width: 750px;
	margin-left: 0px;
	position: relative;
	top: -40px;
	left: 220px;
	}		
	
#pata  {
	width:970px;
	font: 11px lighter 'Roboto', "Arial Unicode MS", Arial, Verdana, sans-serif;
	color: #999999;
	left: auto;
	margin: 0 auto;
	padding: 10px 0 20px 0;
	clear:both;
}

.textinternos {
	font: 13px normal 'Roboto', Arial, Helvetica, sans-serif;
	color: #666666;
	margin: 0 60px 0 80px;
}

.tittexinter {
	font: 16px bold 'Roboto', Arial, Helvetica, sans-serif;
	color: #666666;
	margin-left: 40px;
}
.Estilo1 {
font-size: 12px
}

.recuadro{
	width: 85%;
	margin: 20px 5px 10px 40px;
	border:solid 1px #333333;
	background:#CCCCCC;
	padding:5px;
}

.flotarder {
	float:right;
	margin-left: 10px;
	border:solid 1px #666666;
	text-align:center;
	font-size:10px;
	margin:5px 0 5px 20px;
}

.flotarizq {
	float:left;
/*	margin: 30px 20px 10px 20px; */
	margin: 5px 20px 5px 0px;
	border: solid 1px #666;
}


.verde {
	color: #00FF00;
}

.rojo {
	color: #FF0000;
}

.finfloat{
	clear:both;
}

#literatura {
	position: relative;
	/*	background-image: url(../imagenes/banner_fondo.gif); */
/*	top: .6em; */
	width: 600px;
	height: auto;
	margin: 20px auto;;
	background-repeat: no-repeat;
	border: 1px solid #CCCCCC;
	padding: 10px 30px;
	background-color: #CCCCCC;
}

#literatura h3{
	font: bold 16px 'Roboto', Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	letter-spacing:1px;
	padding: 20px 0;
}

.marco{
	width: 150px;
	height:120px;
	float:left;
/*	border:solid 1px #0C3; */
	overflow:hidden;
	font: normal 10px 'Roboto', Arial, Helvetica, sans-serif;
	margin: 0 10px 20px 10px;
	padding: 5px 10px;
	background-color:#FBFBFB;
}

.todas{
	width: 180px;
	height: 200px;
	float:left;
	border:solid 1px red;
	margin: 0 2px 5px 2px;
	background-color:#FF9;
	
}

.exposiciones {
	font: normal normal 400 75%/normal 'Roboto', Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	top:    0px;
	color:  #333333;
	font: 10px/120% lighter 'Roboto', Verdana, Arial, Helvetica, sans-serif;
	color: #999999;
	text-align: left;
	padding: 3px;
}

.exposiciones ul {
	list-style-type: disc;
}

.exposiciones li {
	list-style-type: disc;
	list-style-position: outside;
	margin-left: 15px;
	padding-left: -5px;
}

.exposiciones .ano {
	font-weight: bolder;
	padding-top:10px;
}

.marco2014 {
	width:350px; 
	height:100px; 
	background-color:#F4F4F4; 
	padding:5px; 
	font: normal 10px 'Roboto', Arial, Helvetica, sans-serif; 
	float:left; 
	margin:10px;  
	border:solid 1px #CCC;
	overflow:hidden;
}

.marco2014:hover{
	background-color: #DFDFDF;
	
}

.marco2014 img{
	width:60px; 
	height:auto;
	float:left; 
	margin:5px 5px 2px 0px;
}

.titulo {
	color:#C30; 
	font-weight:bold; 
	font-size:11px;	
}

.idioma {width:auto;}
.idioma p{ text-align:right;}
#cuerpo .idioma a{color:#900;}

.fadebox {
display: block;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.overbox {
display: block;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 50%;
z-index:1002;
overflow: auto;
}