﻿/*  POLAR DESIGN*/
/*  Autores : HUMBERTO */
/* Comienzo: 11 de FEBRERO 2016 */


*{
	padding:0;
	margin:0;
}
a{ outline: none;}
azul{
	color: #2E9AFE;
}
rojo{
	color: #DF0101;
}
gris{
	color: #424242;
}
verde{
	color: #C8FE2E;
}

.clr{ clear:both;height:10px; }
.clr1{ clear:both;height:1px; }
.indent-left{ padding-left:40px; }
p{
	font-family:Verdana, Arial, sans-serif;
	font-size:12px;
	line-height:16px;
	text-align: justify;
	color: #333333;
}
h2{ font-family: Arial, sans-serif; font-size: 22px; }
h3{ font-family: Arial, sans-serif; font-size: 18px; }
h4{ font-family: Arial, Helvetica, sans-serif; font-size:15px; }
body{ background-color:#ffffff/*#636363*/; background-image: url('../img/ui/bgbody.png');  background-repeat: no-repeat; background-position: center; }
#topimage{  width:100%; height:200px; padding:0px; margin:0px; margin-bottom:10px; }
#topnoimage{  width:100%; height:45px; padding:0px; margin:0px; margin-bottom:10px; }

/*-------------------------------------------*\
    MASTERCONT --- contenedor maestro
\*-------------------------------------------*/

#mastercont { width:960px; background-color:#fff; margin:0 auto; padding:10px 0px; min-height: 1000px; }

/*------------------------------------*\
    HEADER 
\*------------------------------------*/

#header{ width:940px; background-color:#FFFFFF; height:100px; padding: 10px; background-image: url('../img/ui/mundo.jpg'); background-position:right -5px; background-repeat: no-repeat;  }
#header #logo{ width:300px; height:70px; float:left; }
#header #frase{ width:450px; float:right; padding:20px 0 20px 0; text-align:right; }
#frase span{ font-family:Arial, sans-serif;	text-align:right; font-size:28px; margin-right:0px; background-color:#DF0101; color:#fff }
#header #navegacion{ float:right; padding:40px 0px 0px 0px; }


/*------------------------------------*\
    NAV
\*------------------------------------*/
#nav{ list-style:none; font-weight:bold;  margin-bottom:5px; float:left; width:100%; font-family:Arial, sans-serif;  font-size:12px;    /* Bring the nav above everything else--uncomment if needed.  position:relative;   z-index:5;   */ }
#nav li{ float:left; margin-right:10px; position:relative; }
#nav li a{display:block; padding:10px; color:#fff;  background:#aaa; text-decoration:none; }
#nav li a:hover{ color:#fff; background:#424242; /*border-bottom:5px solid #333;*/  text-decoration:none; }

/*--- DROPDOWN ---*/
#nav li ul{ background:#aaa; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    /*background:rgba(0,0,0,0);  But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
    list-style:none; position:absolute; left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
    z-index: 99; padding-top:0px; border-top:#aaa 0px solid; 
}
#nav li ul li{  padding:7px 10px;  float:none; /* padding-top:1px; Introducing a padding between the li and the a give the illusion spaced items */ }
#nav li ul li a{ white-space:nowrap; color:#eee; /* Stop text wrapping and creating multi-line dropdown items */ }
#nav li:hover ul{ /* Display the dropdown on hover */ left:0; /* Bring back on-screen when needed */}
#nav li:hover ul li a{ background:#aaa; text-decoration:none; /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */}
#nav li:hover ul li a{ text-decoration:none; margin:0; padding:0;  border-bottom:1px solid #aaa;/* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */}
#nav li:hover ul li a:hover{ background:#424242; border-bottom:1px solid #aaa;  /* Here we define the most explicit hover states--what happens when you hover each individual link. */ }

/*-------------------------------------------*\
    BANNER CENTRAL 
\*-------------------------------------------*/

#bannercentral { width:auto; height:310px; }


		
/*------------------------------------*\
   ACCESOS DIRECTOS DEL HOME
\*------------------------------------*/
#accesos{ width:940px; padding:5px 10px; position:relative; top:10px; }
#accesos ul{ list-style: none; margin:0 auto; width:800px; }
#accesos ul li{ float:left; width:255px; }

/*------------------------------------*\
    NOTICIAS HOME
\*------------------------------------*/

#noticias{ width: 550px; padding:0 10px 0 50px; position:relative; float:left; }
#noticias ul{ list-style-image: url('../img/ui/bullets.png'); margin:0 auto; width:550px; }
#noticias ul li{ padding-bottom: 20px; width:500px; }
#noticias h4{ color:#333333; font-size:14px; font-family:Arial, sans-serif; }
#noticias a{ color:#888; text-decoration:none; font-size:11px; font-family:"Trebuchet MS", Arial, sans-serif; }
#noticias a:hover{ color:#333333; }
#noticias img{ /*margin-left:50px;*/ margin-bottom:20px; }


#btnServiHome{
    padding-top:20px;
    padding-right:50px;
    float:right;
    width:300px;
}

/*------------------------------------*\
    FOOTER
\*------------------------------------*/

#footer{ width: 940px; height: 50px; border-top:1px dashed #CCCCCC; padding-top:20px; }
#footerl{ width:300px; float:left; }
#footerr{ width:200px; float:right; }
#footerr img{ float: right; }
#footerc{ float:left; font-family: "Century Gothic"; font-size:20px; }
#footerc ul { list-style: none; margin:0 auto; }
#footerc ul li { float:left; margin-right: 10px; }
#footerc ul li a{ font-family: "Trebuchet MS", Arial, sans-serif; font-size:10px; color:#333333; }

/*------------------------------------*\
    QUIENES SOMOS
\*------------------------------------*/

#maincont{ width:100%; position:relative; margin-top:30px; }
#leftside{ float:left; width:230px; padding:0 10px; /*    height: 100px;*/ }
#leftside img { margin-bottom:20px;}
#rightside{ float:left; width:580px; padding:0 20px 10px 10px; }
#rightside2{ float:left; width:680px; padding:0 20px 10px 10px; }
#rightside3{ float:left; width:580px; background-image:url('../img/ui/bg-div-valores.png'); background-position: 10px  top; background-repeat: repeat-y; }

#rightside ul{ list-style: none; padding-left:20px; font-family: "Verdana", Arial, Helvetica, sans-serif; font-size:14px; margin-top:10px;}
#rightside ul li {
	margin-bottom:16px;
	color: #666666;
}

/*------------------------------------*\
    NUESTRAS AREAS
\*------------------------------------*/

#columna1{ width:300px;float:left;margin-right:20px; }
.area{width:auto;
    height:auto;
    padding:10px;
    margin-bottom:50px;
    margin-top:30px;
    /*border:1px solid #333;*/
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background-color: #7ba2d1;
    background: rgb(190, 234, 255);
background: -moz-linear-gradient(0deg, rgb(190, 234, 255) 30%, rgb(144, 195, 255) 70%);
background: -webkit-linear-gradient(0deg, rgb(190, 234, 255) 30%, rgb(144, 195, 255) 70%);
background: -o-linear-gradient(0deg, rgb(190, 234, 255) 30%, rgb(144, 195, 255) 70%);
background: -ms-linear-gradient(0deg, rgb(190, 234, 255) 30%, rgb(144, 195, 255) 70%);
background: linear-gradient(0deg, rgb(190, 234, 255) 30%, rgb(144, 195, 255) 70%);


}
.tit-area{position:relative;top:-40px;background-image:url('../img/ui/titulos-area.png');background-position: left center; width: 230px;height:60px;}
.tit-area h3{font-family: Arial, Helvetica, sans-serif; padding-left:60px; padding-top:20px; width:160px; text-transform: uppercase; font-size:15px; }
.cont-area{font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 12px; }
.cont-area ul{ list-style-image: url('../img/ui/bullets.png'); margin:0 auto; padding-left:20px; margin-top:-20px; }
.cont-area ul li{ margin-bottom:10px; }

/*------------------------------------*\
    NUESTROS VALORES
\*------------------------------------*/

/*#valores{background-image:url('../img/ui/bg-div-valores.png'); background-position: 10px  top; background-repeat: repeat-y; height:auto; }*/
#valores{height:auto; }
.item-valores{ width:650px; background-image:url('../img/ui/bg-div-valores.png'); background-position: 10px  top; background-repeat: repeat-y; }
#valores h3{  background-image:url('../img/ui/bullets-valores.png'); background-position: left  top; background-repeat: no-repeat; height:54px; padding-left:15px; padding-top:18px; color:#FFF; font-size:15px; float:left; width:165px; }
#valores p{ float:right; width:440px; }

/*------------------------------------*\
    NEWSLETTER
\*------------------------------------*/

#newsletter{ width: 500px; margin-top:40px; }
#newsletter ul{ list-style: none; }
.item-newsletter{ width:320px; height:70px; background-image:url(../img/ui/fondo-item-newsletter.jpg); background-repeat:no-repeat; background-position: top left; padding-left:100px; padding-top:15px; }
.fechaNewsletter{ font-family: Arial, Helvetica, sans-serif; font-size:12px; margin-bottom:30px; }
a.btnNewsletter{ font-family: Arial, Helvetica, sans-serif; font-size:12px; padding:2px 7px; background-color:#FCFCFC; color:#7BA2D1; text-decoration:none; }
a:hover.btnNewsletter { color:#FFFFFF; background-color:#7BA2D1; }

/*------------------------------------*\
    NOTICIAS
\*------------------------------------*/

#listaNoticias{width:615px; background-color:#fff;}
#listaNoticias ul {
	list-style: none;
	color: #000000;
}
.noticia{height: 100px; background-color:#eee; padding:5px 10px;}
.noticia img{  padding-left:5px;}
.fechaNoticia{font-size:10px;color:#7BA2D1;  }
.noticia h4{ width:450px;float:left; margin-right: 30px; padding-bottom: 10px; color:#555555; }
.noticia p{ width: 450px;float:left; margin-right: 40px; }
.noticia a{color:#666666;}
.noticia a:hover{color:#000000;}
.desNoti{width:450px; float:left; padding-bottom:20px; }
.desNoti a{font-family: Arial, Helvetica, sans-serif; color:#2B6FB6; font-size:13px; text-decoration:none;}
.desNoti a:hover{text-decoration:underline; color:#008000; font-size:13px;}
.desImg{width: 180px; margin-left: 20px; margin-top: 50px; border:1px solid #999999; /*float:right;*/}


/*------------------------------------*\
    NOTICIAS
\*------------------------------------*/

#cuadro2do{margin-top:20px; width:550px; border:1px solid #666666; background-color: #ebebdf; padding:20px; -webkit-border-radius: 15px;-moz-border-radius: 15px; border-radius: 15px; }
#cuadro2do ul{list-style: none;}
.subtituloNarajo{color:#F33; font-weight:bold;}
#cuadro2do p{ margin-bottom:20px;}
#btnVolver{ margin-left:650px; margin-top: 20px; }

/*------------------------------------*\
    NUESTROS  CLIENTES
\*------------------------------------*/

.area-cliente{ text-align: center; margin-bottom:20px; }

/*------------------------------------*\
    CONTACTO
\*------------------------------------*/

#info_contacto{height:155px;padding:40px;width:385px; background-image: url('../img/ui/bg_contacto.jpg'); background-repeat:no-repeat;}
#info_contacto{font-family:Arial, Helvetica, sans-serif;}
#formulario{ font-family:Arial, Helvetica, sans-serif;  display:none; width:385px; background-color:#fff;  }
.campotexto{ padding:5px; width:250px; border: 1px solid #ccc; }
.campoareatexto{ padding:5px; width:250px; border: 1px solid #ccc; }
.btnenviar{border: 0; padding:5px 10px; background-color: #A2CE58; color:#FFFFFF; }
.btnborrar{ border: 0; padding:5px 10px; background-color: #aaa; color:#FFFFFF;}

#info_trabaje{height:155px;padding:40px;width:385px; background-image: url('../img/ui/bg_trabaje.jpg'); background-repeat:no-repeat;}
#info_trabaje{font-family:Arial, Helvetica, sans-serif;}

/*------------------------------------*\
    GALERIA
\*------------------------------------*/

#galeria { margin-left:180px; height: 300px;width:420px; }
#galeria ul { list-style: none; }
#galeria ul li {float:left; margin:5px;}
#video iframe { z-index: -99; }
