/*
@author: Guillermo Holguín
*/


html{
background-image:url('../pict/fondo_ok.jpg');
background-color:white;
background-size:auto 110vmax;
background-attachment:fixed;
background-position:center top;
background-repeat:no-repeat;
font-family:"Hind";
}

body{
margin:0.5em auto;
width:95vw;
min-height:95vh;
margin-bottom:2.5em;
}

a{
text-decoration:none;
	font-size:0.8em;
}

a:hover{
text-decoration:underline;
}

#bannerPpal{
width:95vw;
margin:0 auto;
margin-bottom:-0.6em;
text-align:center;
}

#bannerPpal img{
border-radius:3em 3em 0px 0px;
-moz-border-radius: 3em 3em 0px 0px;
-webkit-border-radius : 3em 3em 0px 0px;
behavior:url('border-radius.htc');

}

#imgCab{
width:95vw;
margin:0 auto;
text-decoration:none;
cursor:default;
}

#pagina{
position:relative;
top:0px;
*top:0px;
width:95vw;
margin:0 auto;
background-image:url('../pict/blanco_tte.png');
background-attachment:fixed;
background-position:center center;
background-repeat:repeat;
border-radius:0px 0px 1.5em 1.5em;
-moz-border-radius: 0px 0px 1.5em 1.5em;
-webkit-border-radius : 0px 0px 1.5em 1.5em;
behavior:url('border-radius.htc');
}

#links{
font-size:1.1em;
margin:0 auto;
padding-top:0.2em;
margin-bottom:0.5em;
background-color:#770f00;
text-align:center;
-moz-box-shadow: rgba(0,0,0,0.2) 0px 0.5em 0.5em 0px;
-webkit-box-shadow: rgba(0,0,0,0.2) 0px 0.5em 0.5em 0px;
-khtml-box-shadow: rgba(0,0,0,0.2) 0px 0.5em 0.5em 0px;
box-shadow: rgba(0,0,0,0.2) 0px 0.5em 0.5em 0px;
}

#objLink, #objLink ul {
    list-style: none;
}

#objLink {
    margin:0px auto;
}

#objLink > li {
    float: left;
}

#objLink li a {
	display: block;
    padding: 0.2em 1em;
    text-decoration: none;
}

#objLink ul {
    position: absolute;
    display: none;
	padding-left:0px;
}

#objLink ul li a {
    width: auto;
	text-align:left;
}

#objLink li:hover ul {
    display: block;
}

#objLink {
}
#objLink > li > a {
	color:white;
	font-family:"HindB";
	border-top:0.1em solid #770f00;
	text-decoration:none;
}

#objLink > li:hover > a {
    background: #bb4040;
	color:black;
}
 
#objLink ul {
    background: #770f00;
	font-family:"HindB";
}
#objLink ul li a {
    color: #000;
}

#objLink ul{
    background: #bb4040;
	color:black;
	z-index:1000;
}

#objLink ul li a {
	border:0.1em double #bb4040;
	color: black;
	z-index:1000;
}

#objLink ul li:hover a {
    background: #770f00;
	color:white;
	z-index:1000;
}

#objLink li ul{
	border-top:0.1em dotted #770f00;
	z-index:1000;
}

#objLink li:hover ul.noJS {
	height:auto;
    display: block;
}

#content{
width:100%;
*width:100%;
padding:0px;
*padding:0px;
margin:0em auto;
height:75vh;
}

#seccion1{
float:left;
position:relative;
width:13%;
border-right:0.3em solid #770f00;
height:100%;
text-align:center;
background-image:url('../pict/enara.png');
background-position:center bottom;
background-repeat:no-repeat;
background-size:100% auto;
}

#seccion2{
float:right;
width:85%;
margin:0em auto;
height:100%;
}

#seccion2 iframe{
z-index:0;
}

.pastilla{
min-width:90%;
margin-bottom:0.6em;
}

.pastilla a{
background-color:#bb4040;
text-align:center;
margin:0.3em;
display:block;
border:0.2em groove #770f00;
padding:0.1em;
border-radius:0.5em;
-moz-border-radius:0.5em;
-webkit-border-radius:0.5em;
box-shadow: 0 0 0.1em 0.1em #550f00;
font-family:"HindB";
color:black;
font-size:0.9em;
text-decoration:none;
}

.pastilla a:hover{
background-color:#770f00;
color:white;
border-color:#bb4040;
box-shadow: 0 0 0.1em 0.1em white;
}

#comu2019 a{
background-color:#770f00;
color:white;
border-color:#bb4040;
box-shadow: 0 0 0.1em 0.1em white;
}

#comu2019 a:hover{
background-color:#bb4040;
color:black;
border-color:#770f00;
box-shadow: 0 0 0.1em 0.1em #770f00;
}

#pie{
background-color:#770f00;
color:white;
width:100%;
margin:0.6em auto;
text-align:center;
padding-top:0.2em;
padding-bottom:0.2em;
font-size:0.7em;
font-family:"Hind";
border-radius:0px 0px 3em 3em;
-moz-border-radius: 0px 0px 3em 3em;
-webkit-border-radius : 0px 0px 3em 3em;
behavior:url('border-radius.htc');

-moz-box-shadow: rgba(0,0,0,0.2) 0px -0.5em 0.5em 0px;
-webkit-box-shadow: rgba(0,0,0,0.2) 0px -0.5em 0.5em 0px;
-khtml-box-shadow: rgba(0,0,0,0.2) 0px -0.5em 0.5em 0px;
box-shadow: rgba(0,0,0,0.2) 0px -0.5em 0.5em 0px;
}

#pie a{
color:white;
text-decoration:none;
font-size:1em;
}

.redonda{
border-radius:2em;
-moz-border-radius:2em;
-webkit-border-radius:2em;
behavior:url('border-radius.htc');
}

.sombra{
-moz-box-shadow: rgba(0,0,0,0.2) 0px 0.2em 0.1em;
-webkit-box-shadow: rgba(0,0,0,0.2) 0px 0.2em 0.1em;
-khtml-box-shadow: rgba(0,0,0,0.2) 0px 0.2em 0.1em;
box-shadow: rgba(0,0,0,0.2) 0.1em 0.2em 1em;
}

#pizarra{
position:relative;
top:0em;
left:0em;
border:0px solid white;
width:99%;
height:99%;
}

.preferente a{
background-color:#068C42;
color:white;
}

.preferente a:hover{
color:white;
background-color:#00A94B;
}

h3{
color:blue;
}

@font-face{
	font-family:"Hind";
	src: url(Hind-Regular.eot);
	font-weight:normal;
	font-style:normal;
} 

@font-face{
	font-family:"Hind";
	src: url(Hind-Regular.ttf) format("truetype");
	font-weight:normal;
	font-style:normal;
}

@font-face{
	font-family:"HindB";
	src: url(Hind-SemiBold.eot);
	font-weight:normal;
	font-style:normal;
} 

@font-face{
	font-family:"HindB";
	src: url(Hind-SemiBold.ttf) format("truetype");
	font-weight:normal;
	font-style:normal;
}

@media screen and (max-width: 1024px) {
	html {
		font-size: 95%;
	}
	#seccion1{
		width:18%;
		background-size:80% auto;
	}
	#seccion2{
		width:80%;
	}
	#objLink li a {
		padding: 0.2em 0.8em;
	}
	.pastilla a, #links{
		font-size:80%;
	}
	#added{
		padding:0.2em;
		padding-left:0.5em;
	}

}

@media screen and (max-width: 768px) {
	html {
		font-size: 90%;
	}
	#objLink li a {
		padding: 0.2em 0.6em;
	}
	#seccion1{
		background-size:70% auto;
	}
}

@media screen and (max-width: 600px) {
	html {
		font-size: 85%;
	}
	#objLink li a {
		padding: 0.2em 0.4em;
	}
	#links{
		font-size:75%;
	}
	.pastilla a{
		font-size:70%;
	}
	#seccion1{
		background-size:60% auto;
	}
}

@media screen and (max-width: 480px) {
	html {
		font-size: 80%;
	}
	body,#bannerPpal,#imgCab,#pagina{
		width:99vw;
	}
	#seccion1{
		width:23%;
		background-size:50% auto;
	}
	#seccion2{
		width:75%;
	}
	#objLink li a {
		padding: 0.1em 0.2em;
	}
	#links{
		font-size:70%;
	}
	.pastilla a{
		font-size:60%;
	}
}

@media screen and (max-width: 320px) {
	html {
		font-size: 75%;
	}

	#objLink li a {
		padding: 0.1em 0.1em;
	}
	#links{
		font-size:60%;
	}
	.pastilla a{
		font-size:50%;
	}
	#seccion1{
		background-size:40% auto;
	}
}