/*---------------------------------------------------------------------------------------
layout.css Este archivo contiene los estilos css que determinan el diseño de nuestro Sitio
-------------------------------------------------------------------------------------- */
*{
	margin:0 auto;
	padding:0;
	list-style:none;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:120%;
}

#escritorio-tablet{
	margin:auto;
	width:90%;
	height:100vh;
}

header{
	position:relative;
	margin:auto;
	width:100%;
	height:20%;
	background-color:white;
}

#cabezote{
	position:relative;
	margin:auto;
	width:100%;
	height:20%;
	background-color:white;
}

section{
	position:relative;
	top:0px;
	margin:auto;
	width:100%;
	height:auto;
}

#search{
	position:absolute;
	top:0;
	right:0;
	background:#900;
	color:white;
	padding:10px;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
}

#logo{
	position:absolute;
	padding:1px;
}


/*menu*/

nav{
	position:absolute;
	top:20px;
	width:100%;
	z-index:3;
}

ul.menu{
	position:absolute;
	width:100%;
	height:5%;
	top:100px;
	display:inline-block;
	float:left;
	text-align:center;
	font-style:normal;
	font-size:14px;
	z-index:3;
}

ul.menu li{
	display:inline-block;
	text-align:center;
	cursor:pointer;
	background:#ccc;
	float:left;
}

ul.menu li a{
	padding:10px;
	widht:100%;
	display:block;
	color:white;
	text-decoration:none;
	background:black;
}

ul.menu li a:hover{
	background:#900;
	font-size:16px;
}

ul.menu li ul{
	position:absolute;
	display:none;
	text-align:center;
}

ul.menu li:hover ul{
display:block;
}

/*termina menu*/

section{
	position:relative;
	width:100%;
	height:auto;
}

/*slider*/
#slide{
	position:absolute;
	top:50px;
	width:50%;
	height:440px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	}

/*termina slider*/


#actividades{
	position:absolute;
	top:50px;
	left:51%;
	padding:5px;
	width:21.8%;
	height:430px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	}

#actividades li{
	margin:5px;
	texto-align:left;
	list-style:none;
}

#actividades li a{
	margin:10px;
	font-size:12px;
	texto-align:left;
	text-decoration:none;
	color:#000;
}

#actividades li a:hover{
	margin:5px;
	font-size:12px;
	texto-align:left;
	color: #900;
	font-style:oblique;
	font-weight:bold;
	background:#F5F5F5;	

}


#media{
	position:absolute;
	width:25%;
	height:200px;
	top:50px;
	right:0;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	overflow:hidden;
}

#registro{
	position:absolute;
	width:23%;
	height:120px;
	right:0;
	top:590px;
	padding:10px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
}


#destacadas{
	position:absolute;
	width:23%;
	height:280px;
	right:0;
	top:270px;
	padding:10px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	font-weight:bold;
	color:#900;
}

#destacadas li{
	margin:5px;
	texto-align:left;
	list-style:none;
}

#destacadas li a{
	margin:10px;
	font-size:12px;
	texto-align:left;
	text-decoration:none;
	color:#000;
}

#destacadas li a:hover{
	margin:5px;
	font-size:12px;
	texto-align:left;
	color: #900;
	font-style:oblique;
	font-weight:bold;
	background:#F5F5F5;	

}

#enlaces{
	position:absolute;
	width:23%;
	height:auto;
	right:0;
	top:755px;
	padding:10px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
}

#enlaces li{
	margin:5px;
	font-size:12px;
	texto-align:left;
	list-style:none;	
}

#enlaces li a{
	margin:10px;
	font-size:12px;
	texto-align:left;
	text-decoration:none;
	color:#000;
}

#enlaces li a:hover{
	margin:10px;
	font-size:12px;
	texto-align:left;
	color: #900;
	font-style:oblique;
	font-weight:bold;

}

#publicaciones{
	position:absolute;
	width:72%;
	height:auto;
	top:510px;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	padding:10px;
}

#publicaciones2{
	position:relative;
	top:50px;
	width:72%;
	height:auto;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	padding:10px;
}

#PublicacionesLibros{
	position:relative;
	top:50px;
	width:72%;
	height:auto;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	padding:10px;
}

#contacto{
	position:relative;
	top:50px;
	width:72%;
	height:auto;
	background:white;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	padding:10px;
}


h4{	
	margin:10px;
	texto-align:left;
	color:black;
}

h5{	
	margin:10px;
	texto-align:center;
	color:#900;
}


h1, h2, h3, h6{
	background:#C0C0C0;
	color:#900;
	}



#copyleft{
	position:absolute;
	width:23%;
	height:80px;
	right:0;
	top:1380px;
	padding:10px;
	texto-align:center;
	background-color:#900;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
}


a{
	font-weight:bold;
	}

#scrollUp{
	width:30px;
	height:20px;
	padding:5px 10px;
	color:white;
	background:#900;
	bottom:5px;
	right:0px;
	text-align:center;
	-webkit-box-shadow: 4px 4px 10px #666;
	-moz-box-shadow: 4px 4px 10px #666;
	box-shadow: 4px 4px 10px #666;
	}





	
/*--------------------------------------------------------------------------------------------------
 Clase .clearfix: Esta clase hacer que los elementos no flotantes que contienen elementos flotantes,
 adapten su altura en base a los elementos flotantes que contienen.
 --------------------------------------------------------------------------------------------------*/
	
.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
* html > body .clearfix {
    display: block;
    width: 100%;
}
* html .clearfix {
    height: 1%;
}