/*@font-face {
	font-family: 'Rockwell Light';
	src: url('../fonts/rockwell_light.eot');
	src: local('☺'), url('../fonts/rockwell_light.woff') format('woff'), url('../fonts/rockwell_light.ttf') format('truetype'), url('../fonts/rockwell_light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
	font-smooth: always;
}*/
@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,700);
*:not(ul){margin:0; padding:0;}
html{height:100%;
font-smooth:always;
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}


.xblk{background:url(../img/close.cross.png) #000 no-repeat 50% 50%; background-size:200%}
.xwht{background:url(../img/close.cross.blk.png) #000 no-repeat 50% 50%;}
body {font-family: 'Roboto', serif; color:#000; font-size:1em ;background-color:#fff;padding:0; font-weight:300; overflow-y:scroll}
img{border:0;}
a{text-decoration:none;}
strong{font-weight:500}
p{font-size:1em; font-weight:500; line-height:1.5em;}
 li{font-size:1em; font-weight:500;}

/*teatro*/

#tea{position:fixed; top:0; left:0; right:0; bottom:0; z-index:1000; background-color:rgba(0,0,0,0.85); display:none}
#tea #teacnt{margin:50px auto; width:500px; }
#teaclose{width:30px; height:30px; border-radius:30px; border:2px solid #fff; position:absolute; cursor:pointer}
#teaclose:hover{background-color:#b00;}
#tea #teacnt img{max-width:1000px; max-height:500px; border:1px solid #ddd}


/* animaciones por opacidad;*/
.noview{display:none !important}
.nofloat{clear:both;}

.a05{-webkit-transition: all 0.5s ease; transition: all 0.5s ease;}
.a02{-webkit-transition: all 0.2s ease; transition: all 0.2s ease;}



/*Header*/
#header{
	width:100%;
	text-align:center;
}

#csn{width:100%}/*sitio del fondo*/
#hbck{
	margin: 0 auto;
	width:100%;
	background-color:#bbb;
	background-position:0% 50%;
	background-size: 100% auto;
	animation: fadein 6s ease;
	height:20vh	
}

#blocktop{
	width:100%;
	margin:0 auto;
	background:rgba(255,255,255,0.95);
	box-sizing:border-box;
	border-bottom:1px solid rgba(175,41,28,0.2);
	fadein 1s;

}

#telefonomobile{float:left}
#telefonomobile a{font-size:1em; display:inline-block ; width:5em; height:2em; text-align:center; box-sizing:border-box; border:1px solid #ddd; line-height:1.8em; margin-left:1em; color:#fff; background:#666}

#language{display:none}
#language a{font-size:1em; display:inline-block ; width:2em; height:2em; text-align:center; box-sizing:border-box; border:1px solid #ddd; line-height:1.8em; margin-left:1em; color:#ddd; background:#fff}
#language a.active{border:1px solid #bbb; line-height:1.8em; margin-left:1em; color:#222}

#logo{width:100%%; margin:0.6em; text-align:center !important;}
#logo h1{display:none}
#logo img{width:80%;margin:0 auto}


#contents{width:90%; margin:0 auto 8em auto; padding:0.6em;  background:rgba(255,255,255,0.8);}

#contents h2{
    font-size: 1.82em;
    padding-top: 0em;
    margin-bottom: 0.5em;
    text-align: center;
    font-weight: 200;

}

#contents h3{
    font-size: 1.3em;
    padding-top: 1.1em;
    margin-bottom: 1em;
    text-align: left;
    font-weight: 300;

}



#contents p, #contents li{
    font-size: 0.8em;
    font-weight: 300;
	line-height:1.6em;
	text-align:justify;
	font-size:1em

}



#footer{width:100%; background:#eee; color:#666; font-size:0.8em;padding:0.6em 0; box-shadow:0 0 8px rgba(0,0,0,0.6)}

#footer .cnt{width:96%;  margin:0 auto; position:relative; display:table}
#footer .cnt > div {width:100%; background:#f4f4f4}
#footer .cnt > div > div{
	border:1px solid #ddd;
	margin:0.5%; padding:4em 2% 2% 2%;
	background-color:#fdfdfd;
	background-repeat:no-repeat;
	background-size:15% auto;
	text-align:center;
	background-position: 50% 10%;

}

#footer .location{background-image:url("../img/contents/google-map-marker.png");}
#footer .legalarea{background-image:url("../img/contents/legal-marker.png")}
#footer .aedaf{background-image:url("../img/contents/asca-marker.png")}

#footer a{color:#000}

/*Menues en web*/
.menutop{font-weight:600;margin-top:5%; width:100%;}
.menutop > ul{padding:0; width:100%; margin: 0 auto; clear:both;}
.menutop > ul > li{list-style:none;}
.menutop a {color:#666; text-decoration:none; font-size:0.8em; font-weight:300 !important; text-transform:uppercase; display:block; text-align:center; margin: 0 0.6em; line-height:1em;  border-bottom: 1px solid #eee; padding:0.9em 0}
.menutop > ul >li a:hover{color: #000;border-bottom: 1px solid #af291c;}
.menutop > ul >li:hover ul{display:block}
.menutop ul ul{background:rgba(255,255,255,0.95); margin:0;padding:0;}
.menutop ul ul li{list-style:none;clear:both; margin:0; padding:0;}
.menutop ul ul a{display:block; text-align:center !important;}

.menubottom ul{width:100%; margin: 0 ; padding:0}
.menubottom ul li{list-style:none; text-align:center; padding:0px}
.menubottom a {color:#666 !important; text-decoration:none;}
.menubottom a:hover{color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.2)}

.menuserv h3{font-size:1em; color:#bbb; text-align:right !important}
.menuserv ul{width:100%; margin: 0 ; padding:0; }
.menuserv ul li{list-style:none; text-align:left; font-size:0.8em !important}
.menuserv a {color:#666 !important; text-decoration:none; display:block; padding:0 0.2em 0 0.5em }
.menuserv a:hover{color:#000; background:#eee}




/*espacial para contacto*/

#contacto { width:100%;}
#contacto >div{ padding:2%; }



/*espacial para servicios*/

#services {width:100%;}
#services >div{padding:1%; vertical-align:top;}
#services >div:first-child{width:100%;}
#services >div:last-child{display:none}



/*especial para noticias*/

#newslist > div{ width:96%; margin:2%; box-sizing:border-box; border: 0px solid #fff}
#newslist > div img{ width:100%}
#newslist p.date{font-size:0.8em !important; text-align:right; margin:5px 0 !important; color:#888; line-height:1em !important}
#newslist  h3{text-align:left; font-size:16px; line-height:16px; font-weight:300; margin-bottom:5px; color:#000; height:32px; overflow:hidden !important;}
#newslist .resume{font-size:12px; height:88px; overflow:hidden !important;}
#newslist .downlink{display:block; width:100%; text-align:right; font-size:12px; color:#000;}
#newslist .downlink::before{content:' '; min-width:12px; height:12px; width: 12px; border: 1px solid #000; border-radius:15px; margin-right:5px; display:inline-block; overflow:hidden;background:url(../img/close.cross.blk.png) #fff no-repeat 50% 50%; background-size:150% 150%; vertical-align:-2px}
#newslist .downlink:hover::before{background:url("../img/close.cross.png") #000 no-repeat 50% 50%; background-size:150% 150%}
#newslist .downlink:hover{text-shadow:0px 0px 2px rgba(0,0,0,0.5)}

#news {width:100%;}
#news >div{padding:1%; vertical-align:top;}
#news >div:first-child{width:98%;}
#news >div:last-child{display:none}


.news{ padding-bottom:30px;}
.news h3{text-align:left; font-weight:300; font-size:2em !important; margin-bottom:0em !important; font-weight:200 !important; line-height:1em }
.news .fulltext{ margin:20px auto;}
.news p.date{font-size:0.8em; text-align:right !important; margin:0.3em 0 !important; color:#888; height:1.2em;}
.news p{font-size:1em !important; color:#888; line-height:1em !important; margin: 0 0 1.5em 0 !important}
.news .bigimage{ margin-bottom:1em;}
.news .bigimage img{width:100%;}

.news .downlink{display:block; width:100%; text-align:right; font-size:15px; color:#000;}
.news .downlink::before{content:' '; height:15px; width: 15px; border: 1px solid #000; border-radius:15px; margin-right:5px; display:inline-block; overflow:hidden;background:url(../img/close.cross.blk.png) #fff no-repeat 50% 50%; background-size:150% 150%; vertical-align:-4px}
.news .downlink:hover::before{background:url(../img/close.cross.png) #000 no-repeat 50% 50%; background-size:150% 150%}
.news .downlink:hover{text-shadow:0px 0px 2px rgba(0,0,0,0.5)}
.news .fulltext p{font-size:14px; line-height:16px;}
.news .fulltext li{font-size:14px; line-height:16px; margin-left:25px; margin-bottom:5px}



#staff > div{ width:96%; margin:2%; box-sizing:border-box; border: 0px solid #fff}
#staff > div img{ width:80%}
#staff  h3{text-align:left; font-size:1.2em; line-height:1em; font-weight:300; margin-bottom:0em; color:#000; height:2em; overflow:hidden !important;}
#staff .resume p{font-size:1em; height:6em; overflow:hidden !important; line-height:1em}
#staff .downlink{display:block; width:100%; text-align:right; font-size:12px; color:#000;}
#staff .downlink::before{content:' '; min-width:12px; height:12px; width: 12px; border: 1px solid #000; border-radius:15px; margin-right:5px; display:inline-block; overflow:hidden;background:url(../img/close.cross.blk.png) #fff no-repeat 50% 50%; background-size:150% 150%; vertical-align:-2px}
#staff .downlink:hover::before{background:url(../img/close.cross.png) #000 no-repeat 50% 50%; background-size:150% 150%}
#staff .downlink:hover{text-shadow:0px 0px 2px rgba(0,0,0,0.5)}

::-webkit-scrollbar {
    width: 16px;

}
::-webkit-scrollbar-track-piece{max-height:20px; border-left:1px #f00}
::-webkit-scrollbar-track {
    background-color: #eee;
    border-left: 1px  #d1d1d1;
	
}
::-webkit-scrollbar-thumb {
    background-color: #ccc;
	width:24px
}
::-webkit-scrollbar-thumb:hover {
    background-color: #fff;
}


/*Codes específicos*/



.contact #contents h3{font-size:1.2em; text-align:left; margin-bottom:1em}
.contact #contents p{line-height:1.2em}













/*Animacione a la entrada*/

/*Fade*/
@keyframes fadein {
    from {opacity:0;}
    to {opacity:1;}
}
@-moz-keyframes fadein {
    from {opacity:0;}
    to {opacity:1;}
}
@-webkit-keyframes fadein {
    from {opacity:0;}
    to {opacity:1;}
}
@-o-keyframes fadein {
    from {opacity:0;}
    to {opacity:1;}
}

/*Background-Position*/
@keyframes bpos {
    from {background-position:0% 40%}
    to {background-position:0% 50%}
}
@-moz-keyframes fadein {
	from {background-position:top top}
    to {background-position:top center}
}
@-webkit-keyframes fadein {
	from {background-position:top top}
    to {background-position:top center}
}
@-o-keyframes fadein {
    from {background-position:top top}
    to {background-position:top center}
}