@import url("font/font.css");
body{ background-image:url(_img/bg_body.png);font-family:Open Sans, sans-serif;}

#wrapper{min-height:660px;padding-top:2%; position:relative;background:url(_img/bg_wrapper.png) repeat-x ;}
p.str{ font-weight:bold;}
p a{ color:#555; text-decoration:none;}
p a:hover{text-decoration:underline;}
p{ text-align:justify;}

/*  Header styles */
h1,h2,h3,h4,h5,h6{color:#666;padding:0 0 9px 0;font-weight:normal;font-family: 'Passion One', sans-serif;letter-spacing: 1px;}
h1{font-size:40px;}
h2{font-size:36px;margin-bottom:5%;}
h3{font-size:32px;} 
h4{font-size:28px;}  
h5{font-size:24px;}
h6{font-size:20px;}


.brd-R{ border-right:solid thin #999;}
.brd-L{ border-left:solid thin #999;}
.brd-LR{ border-right:solid thin #999; border-left:solid thin #999;}
/*  HEADDER  */
#header{background: url(_img/bg_header.png); position:relative; z-index:2; max-height:100px; padding:2% auto;width: 100%;max-width: 1140px; margin:0 auto}
#header2{position:relative;z-index:2;width: 100%;max-width: 1140px;margin:0 auto;}
#header2 .container{padding:0 0 8% 0;position:relative;z-index:3;}

/*  MENU RESPONSIVE  */
#nav-responsive{display:none;}
#nav-responsive{position: relative;margin: 0px;background:#333333;}
#nav-responsive div{overflow: hidden;position: relative;font: 18px/37px 'PT Sans Narrow';color: #fff;text-align:center;text-transform:uppercase;font-weight:bold;}
#nav-responsive select{position: absolute;top: 0px;left: 0px;width: 100%;height: 100%; opacity: 0;filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);	cursor: pointer;}

/*  MENU  */
#nav {padding:12px 0 0 0; z-index:5;}
.sf-menu{min-height:28px;padding:0;margin:0;}
.sf-menu ul{position:absolute;top:-999em;width:185px;left:0;display:none;}
.sf-menu > li{position:relative;float:left;margin:0 28px; font-weight:bold;}
.sf-menu > li > a {text-decoration:none;display:block;font-size:14px;line-height:18px;text-transform:uppercase;color:#4F758B;padding:10px 0 0 0;background:url(_img/menu/nav-active.png) no-repeat center -30px;}
.sf-menu > li.current > a, .sf-menu > li:hover > a, .sf-menu > li.sfHover > a {color:#13294B;text-decoration:none;background: url(_img/menu/nav-active.png) no-repeat center 0;}
.sf-menu li:hover ul,.sf-menu li.sfHover ul{top:35px; left:0;min-height:28px; height:100%}
.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul{top:-999em}
.sf-menu li.current,.sf-menu li:hover,.sf-menu li.sfHover{text-decoration:none;}
.sf-menu li li a{display:block;margin:0;position:relative;text-decoration:none;font-size:12px;line-height:14px;color:#fff;overflow:hidden;padding:8px 5px 8px 15px;text-transform:uppercase;background:url(_img/menu/sub-nav-tail.png);}
.sf-menu li li > a:hover, .sf-menu li li.sfHover > a, .sf-menu li li.current > a{color:#afaa9b;}
.sf-menu li li li a {background: url(_img/bg_header.png);}
.sf-menu li li{float:none;position:relative;margin:0 0 1px 0;}
.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul{left:186px;top:0;}

/*  CONTENIDO  */

#content{ background-image:url(_img/bg_body.png); padding:2% 0; position:relative; z-index:1;}
#index h1{ color:#00245D; line-height:0.75em;}
#index h1 span{ font-size:65%; color:#d3d3d3; text-transform:uppercase;}
#index h3{font-size:28px;margin:3% 0 0 0; padding:0;}
#index p{text-align:justify;}
#index ul{ list-style-position:inside;}
#content p{ margin-top:3%; font-size:90%; padding:0 2%; color:#555;}
#content ul{margin-top:3%; font-size:90%; padding:0 2%; color:#555; list-style:disc; list-style-position:inside;}
#content address p{margin:0;padding:0 5%;font-style: normal;}

/*  PRODUCTOS  */
#prods h1{font-size:26px;text-align:right; line-height:0.25em;color:#bcbcbc;color: white; text-shadow: #959595 1px 0 2px;margin:0 5% 0 0;}
#prods h2{ color:#3B6E8F;font-size:40px; margin:0 0 0 10%;text-transform:uppercase;  text-shadow: -1px -1px white, 1px 1px #a7a7a7}
#prods h3{ clear:both;letter-spacing:0; font-family:Open Sans;color:#13294B; margin:0 0 2% 10%; font-size:100%;font-weight:normal; }
#prods .clear{ height:10px; margin:2% auto;}
#prods img{ display:block; float:left; margin:0 2% 0 0}
#prods p{ width:50%; float:left; font-size:80%;}

#prods fieldset{ width:100%; height:100%;border:thin solid  #4F758B; border-radius: 15px;-moz-border-radius: 15px; margin:0 2% 0 2%;border-radius: 15px; display:block;}
#prods fieldset legend{color:#13294B;margin:0 0 2% 10%; font-weight:bold;}
#prods fieldset img{float:left; display:block;margin:2% 5%;}

/*  SUCURSALES  */
.suc h1{ color:#3B6E8F;font-size:40px; margin:0 0 0 10%;text-transform:uppercase;  text-shadow: -1px -1px white, 1px 1px #a7a7a7}
.suc h2{font-size:26px;text-align:right; line-height:0.25em;color:#bcbcbc;color: white; text-shadow: #959595 1px 0 2px;margin:0 5% 0 0;}
.suc h3{font-size:36px;margin:2% 0 5% 2%;}
.suc h4{font-size:25px;margin:4% 0 0 2%;}

/*  CONTACTO  */
.contact h1{ color:#3B6E8F;font-size:40px; margin:0 0 0 10%;text-transform:uppercase;  text-shadow: -1px -1px white, 1px 1px #a7a7a7}
.contact h2{font-size:26px; margin:0; text-align:left; padding:5% 0 0 20%;}
.contact p a{ font-size:150%; margin:0; padding:0;}
.contact p a:hover{ text-decoration:none;}
#internet{ background-image:url(_img/bg_contacto_form.png); background-position:left top; background-repeat:no-repeat; background-size:auto 100%;min-height:80px;}
#correo{ background-image:url(_img/bg_contacto_correo.png); background-position:left top; background-repeat:no-repeat; background-size:auto 100%; min-height:80px; margin:15% 0 0 0;}
#telefono{ background-image:url(_img/bg_contacto_tel.png); background-position:left top; background-repeat:no-repeat; background-size:auto 100%; min-height:80px;}


/* FORM */
#contact-form {display:block; position:relative;}
#contact-form label {margin:0 0 0 5%;display:block; min-height:34px;position:relative;overflow:hidden; font-size:90%;font-family:'Open Sans', sans-serif;}
#contact-form span {float:left;margin:3% 0 0 0;}
#contact-form input {width:80%;padding:1%;float:left; clear:both;display:block; font-size:80%;font-family:'Open Sans', sans-serif;}
	#contact-form input::-webkit-input-placeholder{}
	#contact-form input:-moz-placeholder {}
	
#contact-form textarea {width:80%;padding:1% !important;float:left; clear:both;display:block;height:100px;overflow:auto;resize:none; font-size:80%;font-family:'Open Sans', sans-serif;}
	#contact-form textarea::-webkit-input-placeholder {}
	#contact-form textarea:-moz-placeholder{}

#contact-form input:focus,#contact-form textarea:focus {color:#000000;background-color: rgba(255, 255, 255, 0.7);}
	
#contact-form .btns {margin:3% 15%;}
#contact-form .btn {clear: none; width:auto;-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;box-shadow:inset 0px 1px 0px 0px #ffffff;background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);background-color:#f9f9f9;-moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px;border:1px solid #dcdcdc;display:inline-block;cursor:pointer;color:#666666;font-size:15px;font-weight:bold;padding:2% 5%; margin:0 5%;text-decoration:none;text-shadow:0px 1px 0px #ffffff;}
#contact-form .btn:hover {background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);background-color:#e9e9e9;-moz-box-shadow: 0 0 5px #ccc;-webkit-box-shadow: 0 0 5px #ccc;box-shadow: 0 0 5px #ccc;border:1px solid #fff;}
#contact-form .btn:active {position:relative;top:1px;}


/*  AVISO DE PRIVACIDAD  */
#av-priv{ background-image:url(_img/bg_aviso_privacidad.png); background-size: 100% auto; background-repeat:no-repeat; min-height:300px;}

/*  FOOTER  */
#footer{border-top:thin solid #ccc;padding:2% 0;background-image:url(_img/bg_body.png);}
#footer h3{ font-size:250%; margin:0 0 2% 2%; line-height:none;}
#footer h4{ font-size:100%; color:#13294B; line-height:normal;}
#footer h5{ font-size:100%; color:#999;}
#footer p{color:#666666; font-size:85%; padding:0.5% 0;}

#footer p a{ color:#666666; text-decoration:none;}
#footer p small{font-size:70%;}
#footer #brd-LR{ padding-left:3%; border-left: thin solid #CCC;border-right: thin solid #CCC;}
#footer #brd-L{border-left: thin solid #CCC;}
@media only screen and (min-width: 769px) and (max-width: 959px) {
	img{max-width:100%;height:auto;width: auto\9; /* ie8 */}
	#header{max-height:125px; padding:2% auto;width:100%;margin:0}
	#header2{max-width: 600px;margin:0;}
	#header2 .container{padding:0 0 20% 0;position:relative;z-index:3;}
	#nav {padding:50px 0 0 0; z-index:5;}
	.sf-menu > li{margin:0 8px;}
	/*  CONTACTO  */
	.contact h2{font-size:26px; margin:0; text-align:left; padding:5% 0 0 30%;}
	/*  FOOTER  */
	#footer p{color:#666666; font-size:70%;}
	#footer #brd-LR{ padding-left:1%; border-left: thin solid #CCC;border-right: thin solid #CCC;}

}

@media only screen and (max-width: 768px) {
	#header{max-height:165px;}
	#nav{display: none;}
	#nav-responsive{display: block;}
	
	/*  PRODUCTOS  */
	#prods p{ width:80%; float:left; font-size:80%;}
	/*  AVISO DE PRIVACIDAD  */
	#av-priv{ background-size:auto 100%;}
	
	/*  CONTACTO  */
	.contact h2{font-size:26px; margin:0; text-align:left; padding:5% 0 0 30%;}
	#contact-form .btns {padding:5% 15%;}

	/*  FOOTER  */
	#footer h4{ font-size:70%;}
	#footer p small{padding:0; line-height:normal;}
	#footer p{color:#666666; font-size:80%; padding:0.5% 0;}

}
@media only screen and (max-width: 480px) {
	#footer #brd-LR{ padding:0 0 2% 3%; border-bottom: thin solid #CCC; border-left: none;border-right:none;}
		/*  PRODUCTOS  */
	
#prods div{ clear:both; margin:5% auto;}
#prods h3,{margin:0 0 2% 10%; font-weight:bold; padding:2% 0;}
#prods img{ display:block; float:left; margin:0 2% 0 0}
#prods p{ width:50%; float:left; font-size:80%;}

	
}