/* 
    Document   : sah-style
    Created on : 24/08/2010, 11:48:05 PM
    Author     : iyars-ruven
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
body {
    background:#6CA943 url(../img/background.png);
    background-repeat:repeat-x;
    font-family:Geneva,Arial,Helvetica,sans-serif;
    font-size: 12px;
	color:#030;
}
.container {
    text-align:center;
}
.center {
    background:url(../img/backgroundWater.png);
    background-repeat: no-repeat;
    margin-left:auto;
    margin-right:auto;
    width:950px;
    height:500px;
}
#homebar {
    width: 100%;
    height: 26px;
    text-align: right;
    background-color: #dcdcdc;
}
.divider {
    height: 90px;
    background-image: url(../img/cumpleCerca.png)
}
#head {
    height: 110px;
    width: 100%;
    background: url(../img/head-bg2.png);
    background-position: bottom;
    background-repeat: no-repeat
}
.clima-content {
    width: 225px;
    height: 110px;
    float: right;
}
/* inicia estilo del componente del clima */
#weather {
    width: 225px;
    height: 98px;
}
#current {
	width: 240px;
	height: 120px;
	text-align: right;
	color: #FFFFFF;
	font-weight: bold;
}
#current #temp {
	font-size: 24px;
	font-style: normal;
	padding-top: 45px;
	padding-right: 50px;
}
#current #fore {
	padding-right: 50px;
	font-size: 11px;
}
#current #city {
	padding-right: 50px;
}
/* termina estilo del componente del clima */
.clima-space {
    height: 12px;
    width: 225px;
}
.space {
    height: 100px;
    width: 725px;
}
.menu-container {
    height:50px;
    width:725px;
     background-image:url(../img/menu-bg.png);
     margin-top: -40px;
}

.principal-content {
    height: 450px;
    width: 950px;
    background-color: #6CA943;
    margin-top: 0px;
}
.content-section {
    height: 460px;
    width: 765px;
    float: left;
}
.sidebar {
    display: inline;
    width: 155px;
    float: right;
}
.side-menu {
    width:auto;
    float:left;
	padding-top:4px;
}
.caja-menu{
    margin: 0 auto;
    position: relative;
    width: 150px;
    height: 41px;
}
#cultura {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/cultura.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#cultura:hover {
    background: url(../img/sidemenu/cultura.png) no-repeat ;
    background-position: bottom;
}
#encuestas {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/encuestas.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#encuestas:hover {
    background: url(../img/sidemenu/encuestas.png) no-repeat ;
    background-position: bottom;
}
#galerias {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/galerias.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#galerias:hover {
    background: url(../img/sidemenu/galerias.png) no-repeat ;
    background-position: bottom;
}
#informacion {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/informacion.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#informacion:hover {
    background: url(../img/sidemenu/informacion.png) no-repeat ;
    background-position: bottom;
}
#quejas {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/quejas.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#quejas:hover {
    background: url(../img/sidemenu/quejas.png) no-repeat ;
    background-position: bottom;
}
#sitios {
    display: block;
    width: 100%;
    height: 97%;
    background: url(../img/sidemenu/sitios.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#sitios:hover {
    background: url(../img/sidemenu/sitios.png) no-repeat ;
    background-position: bottom;
}
#zonas {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/sidemenu/reporta.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#zonas:hover {
    background: url(../img/sidemenu/reporta.png) no-repeat ;
    background-position: bottom;
}
.side-siac {
    height:80px;
    width:auto;
    float:left;
}
.caja-siac{
    margin: 0 auto;
    position: relative;
    width: 150px;
    height: 80px;
}
#button-siac {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/siac.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#button-siac:hover {
    background: url(../img/siac.png) no-repeat ;
    background-position: bottom;
}
.footer {
    margin-top: 20px;
    height: 80px;
    width: 950px;
    background: url(../img/footer-bg.png);
    font-size: 11px;
    color: white;
}
.social {
    height: 80px;
    width: 150px;
    background: url(../img/social-bg.png);
    margin-top: 10px;
   display: inline-block;
}
.caja-social {
    margin: 0 auto;
    position: relative;
    width: 70px;
    height: 32px;
}
#face {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/social/face.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
a#face:hover {
    background: url(../img/social/face.png) no-repeat ;
    background-position: top;
}
#flickr {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/social/flickr.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
a#flickr:hover {
    background: url(../img/social/flickr.png) no-repeat ;
    background-position: top;
}
#tweet {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/social/tweet.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
a#tweet:hover {
    background: url(../img/social/tweet.png) no-repeat ;
    background-position: top;
}
#youtube {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/social/yt.png) no-repeat ;
    background-position: bottom;
    outline:none;
}
a#youtube:hover {
    background: url(../img/social/yt.png) no-repeat ;
    background-position: top;
}
.huix-logo {
    height: 50px;
    width: 950px;
    text-align: left;
}
.cuentaatras {
    height: 130px;
    width: 795px;
    background: url(../img/counter-bg03.png);
    background-repeat: no-repeat; 
}
.digitos {
    height: 114px;
    width: 660px;
    margin-left: 240px;
}
.divider-digitos {
    height: 15px;
    width: 100%;
}
.caja-pmenu{
    margin: 0 auto;
    position: relative;
    width: 115px;
    height: 50px;
}
#quienes {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/quienes.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#quienes:hover {
    background: url(../img/menu/quienes.png) no-repeat ;
    background-position: bottom;
}
#atencion {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/atencion.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#atencion:hover {
    background: url(../img/menu/atencion.png) no-repeat ;
    background-position: bottom;
}
#pago {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/pago.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#pago:hover {
    background: url(../img/menu/pago.png) no-repeat ;
    background-position: bottom;
}
#directorio {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/directorio.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#directorio:hover {
    background: url(../img/menu/directorio.png) no-repeat ;
    background-position: bottom;
}
#transparencia {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/transparencia.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#transparencia:hover {
    background: url(../img/menu/transparencia.png) no-repeat ;
    background-position: bottom;
}
#mensaje {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/menu/mensaje.png) no-repeat ;
    background-position:  top;
    outline:none;
}
a#mensaje:hover {
    background: url(../img/menu/mensaje.png) no-repeat ;
    background-position: bottom;
}
#articles{
	background-color:#85AE50;
	height:460px;
	overflow:auto;
	text-align:left;
	padding-left:20px;
	padding-right: 20px;
}
h2{
	font-size:20px;
	font-weight:bold;
	color:#030;
}

.bgTitle {
    width: 100%;
    height: 35px;
    background-image: url(../images/ultimasMod/bgTitle.png);
}
#articles2{
	background-color:#85AE50;
	height:410px;
        width: 95%;
	overflow:auto;
	text-align:left;
	padding-left:20px;
	padding-right: 20px;
}

.mapBg {
    width: 427px;
    height: 267px;
    background-image: url(../images/ultimasMod/mapBg.png);
}
.mapDisplay {
    width: 400px;
    height: 250px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 8px;
}