@charset "UTF-8";

body{ font:62.5% Arial, Helvetica, sans-serif; margin:0px;  color:#313131;}


.wrapper{ position:relative; width:893px; /*background:#FF6600;*/ margin-left:auto; margin-right:auto;}
.wrapperGallery{ position:relative; width:951px; /*background:#FF6600;*/ margin-left:auto; margin-right:auto;}


/* @group AUXILIARIES */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
.clearfix {display: block;}
.left{float: left}
.right{float: right}
.center { margin:0 auto;}
.txtLeft{text-align: left}
.txtRight{text-align: right}
.txtCenter{text-align: center}
.absolute {position: absolute}
.hide {display: none}
.show {display: block}
.inline{display: inline}
.clean{ clear: both}
:active, :focus{ outline:none;}
.italic{ font-style:italic}

/* @group ELEMENTS */

/* paragraph */
strong { font-weight:bold;}
p {font-size:1.2em; line-height:1.4em; }
h2 {font-size:1.8em; font-weight:bold; letter-spacing:-0.02em;}
h3 {font-size:1.1em;}
h4 {font-size:1em; line-height:1.4em; }
.noBorderR{ border-right:none;}

/* link */
a {color:#343434; text-decoration:none;}		

#header{ height:77px; /*background:#0066CC;*/ margin-bottom:1px; padding-top:27px; display:block;  }
#header #cajaLogo{ width:162px; height:51px;}
#header h1 a{ display:none;}

#menu{ height:25px; margin-top:0px; }
#menu ul li{ float:left;font-size:1.8em; display:block; color:#000;; padding:6px 15px 6px 15px; margin-top:10px;}
#menu ul li.last{ float:left;font-size:1.8em; display:block; color:#000;; padding:6px 0px 6px 15px; margin-top:10px;}
#menu ul li a{color:#000; font-weight:bold; margin-bottom:10px;}
#menu ul li.active a, #menu ul li a:hover{font-weight:bold;  color:#37CEF7; padding-bottom:7px; border-bottom:5px solid #37CEF7;}

/*_____________gallery_____________*/

#feature{background:url(../images/bg-gallery.jpg) repeat-x; overflow:hidden; position:relative; height:283px; margin-bottom:16px;}
#feature #mainFeatureContent{ position: relative; height:283px; width:951px; margin:0 auto; z-index:888;}
#feature #mainFeatureContent #overlayLeft {   float: left; }
#feature #mainFeatureContent #overlayRight {  float: right; }
#feature #mainFeatureContent #overlayLeft, #gallery #mainFeatureContent #overlayRight {width: 0px; height: 283px; display: block; overflow: hidden; }
#feature #mainFeatureContent #prevNext{}
#feature #mainFeatureContent #prevNext a#previous { background: url(../images/arrowLeft.png) 0 0 no-repeat; position: relative; width: 19px; height: 32px; display: block; overflow: hidden; top:135px; float:left;  z-index:9999; margin-right:10px; text-decoration:none; border:none;}
#feature #mainFeatureContent #prevNext a#next { background: url(../images/arrowRight.png) 0 -32px no-repeat; position:relative; width: 19px; height: 32px; display: block; overflow: hidden; top:135px; float:right;  z-index:9999; margin-left:10px; text-decoration:none; border:none;}
#feature #mainFeatureContent #prevNext a:hover#previous { background: url(../images/arrowLeft.png) 0 -32px no-repeat; }
#feature #mainFeatureContent #prevNext a:hover#next { background: url(../images/arrowRight.png) 0 0 no-repeat; }
#feature #mainFeatureContent .featuredImage { display:block; float:right; overflow:hidden; height:281px; width:415px; margin:0 auto; z-index:777;}
#controller{ display:none;}
#feature #mainFeatureContent #slides .mainFeatureDetails{ width: 420px; float: left; margin-top: 35px; color: #FFF; z-index:888;}
#feature #mainFeatureContent #slides .mainFeatureDetails h3 { font-size: 4.5em; }
#feature #mainFeatureContent #slides .mainFeatureDetails p.textintro { font-size: 1.4em; margin-bottom: 15px;}
#feature #mainFeatureContent #slides .mainFeatureDetails a {color: #FFF; font-style:italic; font-weight:bold; font-size:1.1em; border-bottom:1px dotted #FFF; padding-bottom:1px; line-height:1.6em;}
#feature #mainFeatureContent #slides .mainFeatureDetails a:hover{color: #37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px; line-height:1.6em;}


/*_____________contenido_____________*/

#content{ font-size:1.2em; padding-bottom:30px; border-bottom:1px solid #E6E6E6; height:250px;}
#content ul li{ width:291px; height:251px; border-right: 1px solid #E6E6E6; padding-right:10px; display:inline; float:left;}
#content ul li h2{ font-size:2.9em; margin-bottom:7px;}
#content ul li p{margin-bottom:66px;}
#content ul li h3 { display:none;}
#content ul li h3:hover{ display:none;}

/*#content ul li h3 { background:url(../images/link_arrow_right.jpg) no-repeat 0 0px; padding-left:13px; height:7px; width:200px;}
#content ul li h3:hover{ background:url(../images/link_arrow_right.jpg) no-repeat 0 -7px; padding-left:13px; height:7px; width:200px;}
#content ul li h3 a{ color:#343434; font-style:italic; border-bottom:1px dotted #343434; padding-bottom:1px; line-height:1.1em;    }
#content ul li h3 a:hover{  color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;  line-height:1.1em; }
#content ul li.servicios h3 a{ color:#343434; font-style:italic; border-bottom:1px dotted #343434; padding-bottom:1px; line-height:1.1em; margin-top:59px;}
#content ul li.servicios h3 a:hover{  color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;  line-height:1.1em; margin-top:59px; }
#content ul li.loultimo h3 a{ color:#343434; font-style:italic; border-bottom:1px dotted #343434; padding-bottom:1px; line-height:1.1em; }
#content ul li.loultimo h3 a:hover{  color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;  line-height:1.1em;}*/

#content ul li.servicios{ width:271px; border-right: 1px solid #E6E6E6; padding-right:10px; padding-left:10px; display:inline; float:left;}
#content ul li.servicios h2{ font-size:2em; margin-bottom:16px;}
#content ul li.servicios p{ margin:15px 0 26px 0;}
#content ul li.loultimo{ width:279px; padding-left:14px; display:inline; float:left; border:none; padding-right: 0;}
#content ul li.loultimo h2{ font-size:2em; margin-bottom:16px;}
#content ul li.loultimo p{ margin:15px 0 26px 0;}
#content ul li.loultimo a.imgbox, #contentdown ul li a.imgbox, #content ul li.loultimo a.imgbox:visited { width:277px; height:170px; display: block; margin-bottom:19px; overflow: hidden; position: relative; border: 1px solid #E6E6E6;}
#content ul li.loultimo a.imgbox:hover{}
#content ul li.loultimo a span.bor{ width: 269px; height: 162px; position: absolute; top: 0; left: 0;}
#content ul li.loultimo a img.thumbnail, #contentdown ul li a img.thumbnail { padding: 4px;} 

#contentdown{ font-size:1.2em;  padding-top:20px;}
#contentdown h2{ font-size:2em; margin-bottom:16px;}
#contentdown ul { display:block}
#contentdown ul li{ margin-right:28px; width:279px; height:205px; display: block; overflow: hidden; position: relative; border-bottom:1px solid #E6E6E6; float: left; }
#contentdown ul li:hover{}
#contentdown ul li a span.bor{ width: 269px; height: 162px; position: absolute; top: 0; left: 0;}
#contentdown ul li.noMargin { /*width:291px; height:251px; */margin-right:0px; }

/*_____________proyectos_____________*/

#gallerySmall{background:url(../images/bg-gallery.jpg) repeat-x; height:15px; }
#contProyects {}
#contProyects .header {height: 55px; margin-top: 30px; border-bottom: 1px solid #E6E6E6;}
#contProyects .header h2 { font-size: 3.5em;}
#contProyects .header ul {margin-top: 10px; font-size: 1.1em; font-style: italic; height:35px; }
#contProyects .header ul li {line-height: 22px;}
#contProyects .header ul li.siguiente { width:46px;}
#contProyects .header ul li.volver { width:165px}
#contProyects .header ul li h4 a{font-size: 1.4em; font-weight:bold; margin: 0 5px; border-bottom:1px dotted #343434; padding-bottom:1px; line-height:1.6em;}
#contProyects .header ul li a.back {  background: url(../images/link_arrow_left.jpg) 0 -25px no-repeat; border-right: 1px solid #E6E6E6; padding: 0 10px 0 15px; }
#contProyects .header ul li a.back:hover {background: url(../images/link_arrow_left.jpg) 0 -4px no-repeat; color: #B3B3B3; text-decoration: underline;}
#contProyects .header ul li a.ant {margin-left: 5px; background: url(../images/link_arrow_left.jpg) 0 -25px no-repeat; padding: 0 10px 0 15px;}
#contProyects .header ul li a.ant:hover {background: url(../images/link_arrow_left.jpg) 0 -4px no-repeat; color: #B3B3B3; text-decoration: underline;}
#contProyects .header ul li a.sig { margin-left: 5px; line-height: 22px; background: url(../images/link_arrow_rightBN.jpg) 22px -1px no-repeat; padding: 0 15px 0 0px;}
#contProyects .header ul li a.sig:hover {background: url(../images/link_arrow_rightBN.jpg) 22px -22px no-repeat; color: #B3B3B3; text-decoration: underline;}

#contProyects div#todos div, div#grafico div, div#web div {height: 247px; margin: 25px 25px 0 0; width: 279px; border-bottom:1px solid #E6E6E6; }
#contProyects div#todos div.last,  div#grafico div.last,  div#web div.last { margin-right: 0;} 
#contProyects div#todos div a.imgbox, div#grafico div a.imgbox, div#web div a.imgbox {width:277px; height:170px; display: block; overflow: hidden; position: relative; border: 1px solid #E6E6E6; }
#contProyects div#todos div a.imgbox:hover, div#grafico div a.imgbox:hover, div#web div a.imgbox:hover{}
#contProyects div#todos div a img.thumbnail, div#grafico div a img.thumbnail, div#web div a img.thumbnail {padding: 4px;}
#contProyects div#todos span a, div#grafico span a, div#web span a{ font-size: 1.4em; font-weight: bold;  margin:12px 0 6px 5px; border-bottom:1px dotted #343434; padding-bottom:1px; }
#contProyects div#todos div span a:hover, div#grafico div span a:hover, div#web div span a:hover, #contProyects .header ul li h4 a:hover{ color: #37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;}
#contProyects div#todos div span.bor,  div#grafico div span.bor,  div#web div span.bor{ width: 269px; height: 162px; position: absolute; top: 0; left: 0;}

#contProyects div#todos div p.subtitle, div#grafico div p.subtitle, div#web div p.subtitle {color: #666; font-style: italic; font-weight: normal;  margin: 0 0 0 5px; width:264px;}


/*_____________proyecto ESPECIFICO_____________*/

#contProyects .text { width: 280px; margin: 30px 0 0 0;}
#contProyects .text p {margin-bottom: 10px;}
#contProyects .text p.verSite {background: url(../images/view.jpg) 0 0 no-repeat; width:21px; height: 18px;}
#contProyects .text p a{ margin-left: 27px;  }
#contProyects .text p a:hover{color:#37CEF7;  text-decoration: underline; }
#contProyects .imgListfirst { border:1px solid #EDEDED; height: 386px; width: 586px; margin: 30px 0 0 25px;}
#contProyects .imgList { border:1px solid #EDEDED; height: 386px; width: 591px; margin: 15px 0 0 20px;}
#contProyects .imgList img, #contProyects .imgListfirst img { position:relative; top:2px; left:2px;}

#descarga {border-bottom:1px solid #E6E6E6; border-top:1px solid #E6E6E6; height: 33px; margin-top: 25px;}
#descarga p{ margin-top: 9px; }
#descarga p a.up { background:url(../images/arrowUP.jpg) 32px 3px no-repeat; height:9px; width:8px; padding-right:11px;}
#descarga a {border-bottom:1px dotted #343434; padding-bottom:1px;}
#descarga a:hover {color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;}

/*_____________formulario_____________*/ 

#contProyects .contactLeft, #contProyects .contactLeft #form{ width:587px;  }
#contProyects .contactLeft .headerCont{ margin:25px 0 15px 0;}
#contProyects .contactLeft h2{ font-size:1.8em;}
#contProyects .contactLeft #form{ background-color:#F5F5F5; height: 363px; float:left; padding-top: 20px; }
#contProyects .contactLeft #form label{ float:left; text-align:right; width:135px; font-size:1.2em; margin:9px 0 23px 30px; clear: left;}
#contProyects .contactLeft #form .formBox{ float:left; width:356px; height:21px; margin: 0 15px 15px 7px; padding:3px; border:1px solid #888;}
#contProyects .contactLeft #form textarea{ float:left; width:356px; height:177px; margin: 0 15px 0px 7px; padding:3px;  border:1px solid #888;}
#contProyects .contactLeft #form input.boton {margin-left: 170px; margin-top:15px; color: #FFF; font-size: 1.4em; background-color:#37cff8; height: 42px; width:131px; border:1px solid #FFF; text-align:center; }
#contProyects .contactLeft #form input, #contProyects .contactLeft #form textarea, #contProyects .contactLeft #form select{font-size:1.4em; color:#37CEF7;}
#contProyects .contactLeft #form input.boton:hover {background:#3ce5ff}
#contProyects .contactLeft #form p.textForm { margin: -35px 0px 0 312px; font-size: 1em; color: #808080; text-align:left; width:185px;}

#contProyects .contactRight { width:283px;  }
#contProyects .contactRight .headerCont{ margin:25px 0 15px 0;}
#contProyects .contactRight .maps {background-color:#F5F5F5; height: 368px; width:268px; float:right; padding: 15px 0 0 15px;}
#contProyects .contactRight .maps p {margin: 6px 0;}
#contProyects .contactRight .maps .imgMap {margin: 15px 0;}
#contProyects .contactRight .maps p a { border-bottom:1px dotted #343434; padding-bottom:1px;}
#contProyects .contactRight .maps p a:hover {color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;}

/*_____________footer_____________*/

#footer{ font-size:1.2em; margin-top:20px; height:262px; background:url(../images/bgFooter.jpg) 0px 0px repeat-x;}
#footer_box{ padding-top:20px;}
#footer_box ul li{ color:#FFF; width:258px; float:left; display:inline; margin-right:40px;}
#footer_box ul li h4{ margin-bottom:10px;}
#footer_box ul li p{ line-height:1.9em;}
#footer_box ul li p.last{ margin-bottom:9px;}
#footer_box ul li p.direccion{ line-height:1.6em; color:#B3B3B3;}
#footer_box ul li span{ color:#B3B3B3;}
#footer_box ul li.siguenos { width:140px; background:url(../images/iconos_siguenos.png) no-repeat 0px 29px;}
#footer_box ul li.siguenos p{ padding-left:19px;}
#footer_box ul li.siguenos a, #footer_box ul li p.last a, #footer_box ul li p a{ color:#FFF; border-bottom:1px dotted #FFF; padding-bottom:1px; }
#footer_box ul li.siguenos a:hover, #footer_box ul li p.last a:hover, #footer_box ul li p a:hover{ color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;}
#footer_box ul li.blog{ margin-right:0px; width:415px;}
/*#footer_box ul li.blog h2 a{ color:#FFF; font-weight:normal; border-bottom:1px dotted #FFF; padding-bottom:1px;}
#footer_box ul li.blog h2 a:hover{ color:#37CEF7; border-bottom:1px dotted #37CEF7; padding-bottom:1px;}
#footer_box ul li.blog p{ font-size:1em; margin-top:9px; line-height:1.5em; }
#footer_box ul li.blog p.fecha{ font-size:0.9em; margin-top:13px; color: #CCC;}*/

#footer .footer_down { }
#footer .footer_down p.creditos{ font-size:0.9em; font-size:0.9em; margin-top:29px; color:#FFF;}
#footer .footer_down p.valid { background:url(../images/w3c.png) 0px no-repeat; font-size:0.9em; margin-top:29px; color:#FFF; padding-left:29px;}
#footer .footer_down p.valid a{ color:#FFF; text-decoration:underline;}
#footer .footer_down p.valid  a:hover{ color:#37CEF7; text-decoration:underline;}


/*_____________LECTOR RSS_____________*/

#footer_box ul li.blog .cnnclass{width: 415px; margin-bottom: 1em; filter:progid:DXImageTransform.Microsoft.alpha(opacity=80); /*Specify fade effect in IE. Remove if desired.*/ -moz-opacity: 0.8; /*Specify fade effect in Firefox. Remove if desired.*/ float:left; }
#footer_box ul li.blog .cnnclass a{text-decoration: none; border-bottom:1px dotted #FFF; padding-bottom:1px; }
#footer_box ul li.blog .bbcclass{width: 400px; padding: 6px;  border: 1px solid #004A00; }
#footer_box ul li.blog .rsstitle a{ /*shared class for all title elements in an RSS feed*/ font-weight: bold; font-size:16px; color:#FFF; font-family:Arial, Helvetica, sans-serif; }
#footer_box ul li.blog .rsstitle a:hover { color:#37CEF7; border-bottom:1px dotted #37CEF7; }
#footer_box ul li.blog .rssdate{ /*shared class for all date elements in an RSS feed*/ color: #CCC; font-size:9px;font-family:Arial, Helvetica, sans-serif; margin-top:9px; }
#footer_box ul li.blog .rssdescription{ /*shared class for all description elements in an RSS feed*/ font-size:12px; line-height:1.2em; margin-top:5px; color:#FFF; font-family:Arial, Helvetica, sans-serif;}
