/*====================*/
/*=== Reset Styles ===*/
/*====================*/
@import url('http://fonts.googleapis.com/css?family=Metrophobic');
@import url('http://fonts.googleapis.com/css?family=Ubuntu:500italic');
@import url('http://fonts.googleapis.com/css?family=Play');

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a[href], input[type='submit'], input[type='image'], label[for], select, button, .pointer {
    cursor: pointer;
}

/*===================*/
/*=== Main Styles ===*/
/*===================*/

body {
	font-family: 'Metrophobic', Arial, sans-serif; 
	font-weight:400;
	font-size:14px;
	line-height:20px;
	color:#707173;
	background:#eee url('../images/body_bg.jpg') repeat-x;
}

a, a:visited {
	color:#707173; 
	font-weight:bold;
	text-decoration:underline;						
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
a:hover {
	color:#005189;
	text-decoration:none;
}

h1, h2, h3, h4, h5, h6 {
	color:#005189; 	
	font-family: 'Play', Arial, sans-serif; 
	font-weight:400; 
	text-shadow:1px 1px 1px #fff;
}
h1 {
	font-size:1.6em;
	line-height:1.4em;
	margin-bottom:30px; 
}
h2 {
	font-size:1.5em;
	line-height:1.2em;
	margin-bottom:10px;
}
h3 {
	font-size:1.2em;
	line-height:1.0em;
}
h4 {
	font-size:1.1em;
	line-height:1.0em;
}
h5 {
	font-size:1.1em;
	line-height:0.9em;
}
h6 {
	font-size:1em;
	line-height:1em;
}

p {
	font-size:14px; 
	text-shadow: 1px 1px 1px #fff;
	margin-bottom:10px; 
	text-align: justify;
}
ol {
	list-style:decimal;
	padding-left:30px;
	margin-bottom:10px;
}

b, strong {
	font-weight:bold;
}
i, em {
	font-style:italic;
}
u {
	text-decoration:underline;
}
code {
	font-family:Courier,"Courier New",Monaco,Tahoma;
	background:#eee;
	color:#000;
	padding:0px 2px;
}
pre {
	background:#eee;
	padding:10px 20px;
	margin:20px;
}
blockquote {
	margin-top:30px;
}
abbr{
  border-bottom: 1px dotted #96d26d;
  color:#000;
  cursor: help;
}
.hide{
  display:none;
}
.clear{
  clear:both;
}
div {border:0px dotted red;}

img.right{
	float:right; padding:10px 20px;
} 
img.left{
	float:left; padding:10px 20px;
} 
a[href], input[type='submit'], input[type='image'], label[for], select, button, .pointer {
    cursor: pointer;
}
sub{
	font-size:70%;
}
/*========================*/
/*=== Structure Styles ===*/
/*========================*/
#wrapper {
	position:relative;
	background:#eee url('../images/wrapper_bg.png') repeat-x;
}
	#header {
		width:100%;
		height:150px;
	}
		#header-in {
			width:960px;
			margin:0 auto;
			position:relative;
			height:100px;
		}
			#logo{
				width:350px; height:100px;
				background: url('../images/logo.png') no-repeat;
				position:absolute; top:0px; left:0;
			}
			#navicons{
				width:150px; height:30px;
				position:absolute; top:20px; right:0;
				text-align: right;
			}
				#navicons img{	
					-webkit-transition: all 0.3s ease-in-out;
					-moz-transition: all 0.3s ease-in-out;
					-o-transition: all 0.3s ease-in-out;
					-ms-transition: all 0.3s ease-in-out;
					transition: all 0.3s ease-in-out;
				}
				#navicons img:hover{
					opacity:0.4;
					filter:alpha(opacity=40); /* For IE8 and earlier */
				}
				#navicons ul{
					margin:0; padding:0;
				}
				#navicons ul li{
					display:block; float:left; margin-left:20px;
				}
			
		#nav-in {
			width:960px;
			margin:0 auto; height:50px;
		 	position: relative;
		}
			#nav{
				margin:0 auto;
				height:50px; width:960px; 
				background:url('../images/nav_bg.png') no-repeat;  
			}
				#nav ul{
					list-style: none; 
				}
					#nav ul li{
						float:left; 
						display:block;
						position: relative; 
						background:url('../images/nav_li_bg.png') no-repeat right;  
						margin: 0 0 0 0px; padding:0;
						line-height:50px; 
					}
					#nav ul li:first-child a{
						background:url('../images/nav_li_bg.png') no-repeat left; 
						padding:0 30px;
					}
					#nav a{
						color:#eee; text-decoration: none; padding:0 29px; /** CAMBIA ESPACIOS ENTRE ENLACES */
						text-shadow:1px 1px 1px #002c59; 
						line-height: 50px; 
						display: block;
					}
					#nav a:hover, #nav a.active, li.active{
						color:#84aace;
					}

		

	#page{
		margin:0 auto; width:976px;
	}
		a.mas{
			color:#3589ba; 
			float:right; 
			text-decoration:none; 
			background: url('../images/flechita.png') no-repeat right;
			padding:0 30px 0 0;
		}
		a.mas:hover{
			color:#005189;
		}
		
	
		#page #index{
 			width:100%; height:100%; 
 			position:relative;
		}
			#page #index #topbox{
				 width:960px; height:270px;
				 margin:0 8px;
			}			
				#slider {	
					width:960px; height:270px;
				}
					#slider li{
						position:relative;
					}
					#slider li.type1{
						background:url('../images/banners/banner1.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type1 h1{
							color:#0f8c97;
						}
					#slider li.type2{
						background:url('../images/banners/banner2.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type2 h1{
							color:#7579c9;
						}
					#slider li.type3{
						background:url('../images/banners/banner3.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type3 h1{
							color:#c9c275;
						}
					#slider li.type4{
						background:url('../images/banners/banner4.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type4 h1{
							color:#6d9850;
						}
					#slider li.type5{
						background:url('../images/banners/banner5.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type5 h1{
							color:#c9a275;
						}
					#slider li.type6{
						background:url('../images/banners/banner6.jpg'); 
						width:960px; height:270px;
					}
						#slider li.type6 h1{
							color:#66a6d6;
						}
				
						#slider li h1{
							text-shadow:1px 1px 1px #012c59; 
							font-family: 'Ubuntu', Arial, sans-serif; 
							font-weight: 500; 
							font-style: italic;
							position: absolute; top:50px; left:20px; 
							font-size: 44px; line-height:44px;
						}
						#slider li p{
							text-shadow:1px 1px 1px #012c59; 
							color:#fff; 
							font-family: 'Ubuntu', Arial, sans-serif;
							font-weight: 500; font-style: italic;
							position: absolute; top:120px; left:22px; 
							font-size:20px; line-height:26px;
						}
					



			/** Estilos para plantilla index  **/			
			#page #index #contentwrapper{
				width:976px;background: url('../images/page_bg.png') no-repeat top center;
				padding:25px 0 0 0;
			}
				#page #index #contentwrapper #content{
					width:960px; margin:0 8px;
					background: #fff url('../images/page_bg.png') no-repeat top center; 
					overflow:auto;
				}
					#page #index #contentwrapper #content #sidebar{
						width:320px;
						min-height:200px;
						float:left; 
						margin:0 30px;
					}
						#page #index #contentwrapper #content #sidebar .post {
							
						}
						#page #index #contentwrapper #content #sidebar .post p.fecha{
							color:#3589ba; margin:0;
						}
						#page #index #contentwrapper #content #sidebar .post h3{
							color:#707173; font-size:15px; margin:0;
						}
						#page #index #contentwrapper #content #sidebar .post p{
							
						}
					#page #index #contentwrapper #content #column{
						width:880px; /*** deja en 510px si van a activar la columna Sidebar, 920px si no ***/
						float:left;
						margin:0 28px 0 40px;
					}

						#page #index #contentwrapper #content #column ul {
							list-style:square; margin:0 0 0 20px;
						}
					#page #index #contentwrapper #content #column2{
						width:550px; /*** deja en 510px si van a activar la columna Sidebar, 920px si no ***/
						float:right;
						padding-right:30px;
						padding-bottom:30px;
					}

						#page #index #contentwrapper #content #column2 p {
							font-size:14px;
						}


							
							
			/** Estilos para plantilla standard  **/
			#page #standard #contentwrapper{
				width:976px;
				background: url('../images/page_bg.png') no-repeat top center;
				padding:25px 0 0 0; margin-top:30px;
			}
				#page #standard #contentwrapper #content{
					width:960px; margin:0 8px; 
					background: #fff url('../images/page_bg.png') no-repeat top center; 
					overflow:auto;
				}
					#page #standard #contentwrapper #content #sidebar{
						width:320px;
						min-height:200px;
						float:left;
						margin:0 30px;
					}
						#page #standard #contentwrapper #content #sidebar .post {

						}
						#page #standard #contentwrapper #content #sidebar .post p.fecha{
							color:#3589ba;
							margin:0;
						}
						#page #standard #contentwrapper #content #sidebar .post h3{
							color:#707173;
							font-size:15px;
							margin:0;
						}
						#page #standard #contentwrapper #content #sidebar .post p{

						}
					#page #standard #contentwrapper #content #column{
						width:880px; /*** deja en 530px si van a activar la columna Sidebar, 920px si no ***/
						float:left;
						margin:0 28px 0 40px;
					}
						#page #standard #contentwrapper #content #column ul {
							list-style:square; margin:0 0 0 20px;
						}
						#page #standard #contentwrapper #content #column > div.txtframe {
							overflow:auto;
						}
						#page #standard #contentwrapper #content #column img {
							margin:5px 25px 10px 0px; float:left;
						}
					
					
			/** Estilos para area social de todas las plantillas **/
					#page #contentwrapper #content #social{
						background:url('../images/dottedline.png') no-repeat center 20px;
						width:960px; min-height:300px; clear:both; padding:30px 0 0 0; margin-top:20px;
					}
						#page #contentwrapper #content #social-bg{
							width:850px; padding:20px; 
							margin:0 auto 30px auto; 
							overflow:auto;
							background:#f6f6f6;
						}
							#page #contentwrapper #content #social-bg #social-col1{
								background:url('../images/social_blog_bg.png');
								float:left;
								width:250px; height:300px;
								margin-right:25px;
							}
								#page #contentwrapper #content #social-bg #social-col1 h3{
									color:#707173;
									padding:0 15px;
									font-size:18px;
									line-height: 50px;
									font-family: 'Michroma', Arial, sans-serif;
									text-shadow:none;
								}
								#page #contentwrapper #content #social-bg #social-col1 div#posts{
									padding:10px 20px;
								}
									#page #contentwrapper #content #social-bg #social-col1 div#posts ul{

									}
										#page #contentwrapper #content #social-bg #social-col1 div#posts ul li{
											margin-bottom:5px;
										}
							#page #contentwrapper #content #social-bg #social-col2{
								background:url('../images/social_fb_bg.png');
								float:left;
								width:300px;
								height:300px;
                                margin-left:75px;
								margin-right:125px; overflow:hidden;
							}
							#page #contentwrapper #content #social-bg #social-col3{
								background:url('../images/social_blog_bg.png');
								float:left;
								width:250px;
								height:300px; overflow:hidden;
							}
							.twtr-widget p{
								font-size:12px !important;
							}
							.twtr-hd a img{
								display:none !important;
							}


			/** Estilos para contact standard  **/
			#page #contactenos #contentwrapper{
				width:976px;
				background: url('../images/page_bg.png') no-repeat top center;
				padding:25px 0 0 0; margin-top:30px;
			}
				#page #contactenos #contentwrapper #content{
					width:960px; margin:0 8px;
					background: #fff url('../images/page_bg.png') no-repeat top center;
					overflow:auto;
				}
					#page #contactenos #contentwrapper #content #sidebar{
						width:320px;
						min-height:200px;
						float:left;
						margin:0 30px;
					}

					#page #contactenos #contentwrapper #content #column{
						width:500px; /*** deja en 510px si van a activar la columna Sidebar, 920px si no ***/
						float:left; 
						margin:0 28px 0 40px;
					}
						#page #contactenos #contentwrapper #content #column ul {
							list-style:square; margin:0 0 0 20px;
						}
						#page #contactenos #contentwrapper #content #column > div.txtframe {
							overflow:auto;
						}
						#page #contactenos #contentwrapper #content #column img {
							margin:5px 25px 10px 0; float:left;
						}
					#contact-form{
						
					}
						#contact-form input{
							font-family:'Ubuntu', Arial, sans-serif; font-size:14px; margin-bottom:5px; padding:5px; color:gray; border:1px solid #ccc;
						}
						#contact-form textarea{
							font-family:'Ubuntu', Arial, sans-serif; font-size:14px; padding:5px; color:gray; border:1px solid #ccc;
						}
						#contact-form input#nombre{
							width:100%; height:20px;
						}
						#contact-form input#empresa{
							width:100%; height:20px;
						}	
						#contact-form input#cargo{
							width:100%; height:20px;
						}	
						#contact-form input#correo{
							width:100%; height:20px;
						}		
						#contact-form input#telefono{
							width:100%; height:20px;
						}
						#contact-form textarea#consulta{
							width:100%; height:60px;
						}
				
						#contact-form #send{
							width:100px; height:40px; text-transform:uppercase; font-size:12px; display:block; padding:0 10px 2px 5px; float:right;
							background:url('../images/flechita.png') no-repeat right; margin-top:5px; border:none;
						}
						#contact-form #send:hover{
							background:url('../images/flechita.png') no-repeat right; padding-right:10px; color:#000;
						}

						.error{
							color:#f00;
						}

			#footer{
				background:url('../images/page_bottom_bg.png') no-repeat;
				width:100%; height:120px;
			}
				#footer #copyright{
					width:320px; height:70px;
					margin:12px 0 0 28px;
					float:left;
				}
				#footer #social-icons{
					width:320px; height:70px;
					margin:12px 28px 0 0;
					float:right;
				}
					#footer #social-icons span{
						float:right;
						margin-top:5px;
						text-transform:uppercase;
					}
					#footer #social-icons img{
						float:right;
						margin-left:10px;
					}
			#footer-nav{
				width:100%;
				overflow:auto;
				margin-bottom:30px;
			}
				#footer-nav ul{
					list-style: none;
					width:580px;
					margin:0 auto;
				}
					#footer-nav ul li{
						float:left;
						display:block;
						margin: 0 0 0 0px;
						padding:0;
					}
					#footer-nav a{
						text-decoration: none;
						padding:0 10px;
						font-size:12px;
						font-weight:400;
						text-shadow:1px 1px 1px #fff;
					}






/*
    AnythingSlider v1.4

    By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/
*/

/******* SET DEFAULT DIMENSIONS HERE ********/
div.anythingSlider {
	width: 960px;
	height: 270px;
	margin: 0 auto;
}

/****** SET COLORS HERE *******/
/* Default State */
div.anythingSlider .thumbNav a.cur, div.anythingSlider .thumbNav a {
	background: #777;
}

/* Active State */
div.anythingSlider.activeSlider .thumbNav a.cur{
	background: url('../images/icon_slider2.png') no-repeat;
}

div.anythingSlider.activeSlider .thumbNav a {

}
div.anythingSlider.activeSlider .anythingWindow {
	border-color: #7C9127;
}

/**** DO NOT CHANGE BELOW THIS LINE ****/
/* anythingSlider viewport window */
div.anythingSlider .anythingWindow {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100%;
}
/* wrapper: 45px right & left padding for the arrows, 28px @ bottom for naviagation */
div.anythingSlider {
	position: relative;
}
/* anythingSlider base UL */
ul.anythingBase {
	background: transparent;
	list-style: none;
	position: absolute;
	top: 0; left: 0;
	margin: 0;
}
ul.anythingBase li.panel {
	background: transparent;
	display: block;
	float: left;
	padding: 0;
	margin: 0;
}



/* Navigation Links */
div.anythingSlider .anythingControls { position:absolute; bottom:10px; right:0; }
div.anythingSlider .thumbNav { margin: 0; }
div.anythingSlider .thumbNav li { display: inline; }
div.anythingSlider .thumbNav a {
	color: black;
	font: 11px/18px Georgia, Serif;
	display: inline-block;
	text-decoration: none;
	padding: 2px 8px;
	height: 18px;
	margin: 0 5px 0 0;
	text-align: center;
	outline: 0;
	background: url('../images/icon_slider1.png') no-repeat;
}
div.anythingSlider .thumbNav a:hover { background: url('../images/icon_slider2.png') no-repeat; }

/* slider autoplay right-to-left, reverse order of nav links to look better */
div.anythingSlider.rtl .thumbNav a { float: right; } /* reverse order of nav links */
div.anythingSlider.rtl .thumbNav { float: left; }    /* move nav link group to left */
/* div.anythingSlider.rtl .start-stop { float: right; } */ /* move start/stop button - in case you want to switch sides */