﻿@font-face {
    font-family: 'SansumiDemiBoldRegular';
    src: url('../fonts/sansumi-demibold-webfont.eot');
    src: url('../fonts/sansumi-demibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sansumi-demibold-webfont.woff') format('woff'),
         url('../fonts/sansumi-demibold-webfont.ttf') format('truetype'),
         url('../fonts/sansumi-demibold-webfont.svg#SansumiDemiBoldRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'SansumiRegular';
    src: url('../fonts/sansumi-regular-webfont.eot');
    src: url('../fonts/sansumi-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sansumi-regular-webfont.woff') format('woff'),
         url('../fonts/sansumi-regular-webfont.ttf') format('truetype'),
         url('../fonts/sansumi-regular-webfont.svg#SansumiRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'SansumiUltraLightRegular';
    src: url('../fonts/sansumi-ultralight-webfont.eot');
    src: url('../fonts/sansumi-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sansumi-ultralight-webfont.woff') format('woff'),
         url('../fonts/sansumi-ultralight-webfont.ttf') format('truetype'),
         url('../fonts/sansumi-ultralight-webfont.svg#SansumiUltraLightRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
/* CSS Document */


/*      Reset      */

html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img,
dl, dt, dd, ol, ul, li,
fieldset, form, label{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

:focus {
	outline: 0;
}

button, input[type=reset], input[type=button], input[type=submit] {
	line-height:normal !important;
}




/*  General  */

body {
	font-family: Arial, Helvetica, sans-serif;
}

.center {
	margin: 0 auto;
	width: 710px;
	position: relative;
}

a {
	text-decoration: none;
}



/*  ########################### HEADER  ########################### */

#header {
	width: 100%;
	height: 175px;
	background: url(img/header-bg.jpg) center top;
	overflow: hidden;
}

#header .user {
	position: absolute;
	right: 300px;
	top: 10px;
}

#header .user p,
#header .user p a {
	color: #FFFFFF;
	font-size: 12px;
}

#header h1.logo a {
	background: url(img/header-logo.png) no-repeat;
	width: 201px;
	height: 95px;
	text-indent: -9999em;
	overflow: hidden;
	margin: 30px auto 0 auto;
	display: block;
}

#header a.facebook {
	position: absolute;
	text-indent: -9999em;
	overflow: hidden;
	top: 99px;
	right: 299px;
	width: 31px;
	height: 31px;
	background: url(img/header-facebook-icon.png) no-repeat;
}

#main-menu {
	float: left;
	width: 710px;
	margin: 12px 0 0 0;
}

#main-menu li {
	float: left;
	width: 140px;
	padding: 0 2px 0 0;
	background: url(img/header-menu-sep.png) right center no-repeat;
}

#main-menu li.last {
	background: none;
}

#main-menu a {
	display: block;
	width: 140px;
	height: 33px;
	text-align: center;
	color: #FFF;
	text-shadow: -1px 1px 1px #555;
	font-family: "Trebuchet MS";
	font-size: 12px;
	line-height: 33px;
}

#main-menu a:hover,
#main-menu a.active {
	background: url(img/header-menu-link-bg.png) repeat-x;
}

#header form,
.profesional #file_search {
	float: right;
	width: 141px;
	margin: 15px 0 0 0;
}

#header form input,
.profesional #file_search input {
	float: left;
	width: 114px;
	height: 26px;
	padding: 0 0 0 3px;
	background: url(img/header-form-input.png) no-repeat;
	border: none;
	font-size: 12px;
	line-height: 26px;
}

#header form button,
.profesional #file_search button {
	float: left;
	border: none;
	width: 26px;
	height: 26px;
	background: url(img/header-form-button.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	cursor: pointer;
}

/*  ########################### CONTENT  ########################### */

#content {
	width: 100%;
	background: none;
	overflow: hidden;
	/*padding: 0 0 101px 0;*/
}

.center {
	width: 710px;
	height: 677px;
	padding: 0 300px;
	overflow: hidden;
}

#content.reciclado .center {
	background: url(img/reciclado.jpg) left top no-repeat;
}


#content.embajador .center {
	background: url(img/embajador-bg.jpg) left top no-repeat;
}

#content.sociales .center {
	background: url(img/sociales-bg.jpg) left top no-repeat;
}

#content.company .center {
	background: url(img/company-center-bg.jpg) left top no-repeat;
}

#content.style1 .center {
	background: url(img/product-bg1.jpg) left top no-repeat;
}

#content.style2 .center {
	background: url(img/product-bg2.jpg) left top no-repeat;
}

#content.style3 .center {
	background: url(img/product-bg3.jpg) left top no-repeat;
}

#content.style4 .center {
	background: url(img/product-bg4.jpg) left bottom no-repeat;
}

#content.contact .center {
	background: url(img/contact-bg.jpg) left top no-repeat;
}

#content.distribucion .center {
	background: url(img/mapa-bg.jpg) left top no-repeat;
}

#content.diagnosis .center {
	background: url(img/diagnosis-bg.jpg) left top no-repeat;
}

#content.calidad .center {
	background: url(img/calidad-bg.jpg) left top no-repeat;
}

#content.galaxiaq .center {
	background: url(img/galaxiaq-bg.jpg) left top no-repeat;
}

#content.chopp .center {
	background: url(img/chopp-bg.jpg) left top no-repeat;
}


#content.consumo .center {
	background: url(img/consumo-bg.jpg) left top no-repeat;
}

#content.empresa .center {
	background: url(img/empresa-bg.jpg) left top no-repeat;
}

#content.faq .center {
	background: url(img/faq-bg.jpg) left top no-repeat;
}

#content.search .center {
	background: url(img/faq-bg.jpg) left top no-repeat;
}

#content.home {
	background: url(img/content-home-bg.jpg) center bottom no-repeat;
	padding: 0;
}

#slider {
	width: 709px;
	position: relative;
	margin: 14px 0 0 0;
}

.boxes {
	width: 709px;
	height: 285px;
	padding: 18px 0 0 0;
	background: url(img/home-boxes-bg.png) repeat-x;
}

.boxes .section {
	float: left;
	display: inline;
	width: 165px;
	margin: 0 16px 0 0;
	padding: 0 0 54px 0;
	font-family: "Trebuchet MS";
	background: url(img/boxes-box-bg.png) 0 104px repeat-x;
}

.boxes .section.last {
	margin: 0;
}

.boxes .box {
	float: left;
	display: inline;
	width: 90px;
	height: 102px;
	padding: 0 0 0 75px;
	position: relative;
}

.boxes .box a.block {
	position: absolute;
	top: 0;
	left: 0;
	width: 152px;
	height: 102px;
	background: url(img/blank.png);
	display: block;
	text-indent: -9999em;
	overflow: hidden;
	z-index: 9;
}

.boxes .box1 {
	background: url(img/boxes-box-bg1.jpg) no-repeat;
}

.boxes .box1.hover {
	background: url(img/boxes-box-bg1.jpg) 0 -102px no-repeat;
}

.boxes .box2 {
	background: url(img/boxes-box-bg2.jpg) no-repeat;
}

.boxes .box2.hover {
	background: url(img/boxes-box-bg2.jpg) 0 -102px no-repeat;
}

.boxes .box3 {
	background: url(img/boxes-box-bg3.jpg) no-repeat;
}

.boxes .box3.hover {
	background: url(img/boxes-box-bg3.jpg) 0 -102px no-repeat;
}

.boxes .box4 {
	background: url(img/boxes-box-bg4.jpg) no-repeat;
}

.boxes .box4.hover {
	background: url(img/boxes-box-bg4.jpg) 0 -102px no-repeat;
}





.boxes .box p {
	color: #58595b;
    font-size: 12px;
    height: 44px;
    overflow: hidden;
    padding: 23px 0 10px;
}

.boxes .box a {
	background: url(img/boxes-box-link-bg.png) 0 1px no-repeat;
	padding: 0 0 0 13px;
	color: #FFF;
	font-size: 11px;
	font-family: "Trebuchet MS";
}


/*  Empresa  */

#left-col {
	float: left;
	width: 349px;
	padding: 40px 0 0 140px;
	position: relative;
}

#left-col h2 {
	font-weight: normal;
	color: #45a6b0;
	font-size: 22px;
	line-height: 25px;
	font-family: "Trebuchet MS";
}

#left-col p {
	color: #58595b;
	font-size: 11px;
	line-height: 16px;
	margin: 10px 0 15px 0;
}

#left-col p img {
	margin: 15px 0 0 0;
}

#sidebar.boxes {
	float: right;
	width: 165px;
	height: auto;
	padding: 40px 0 0 0;
	background: none;
}

#sidebar.boxes .section {
	padding: 0 0 32px 0;
}

.background {
	position: absolute;
	top: 0;
	left: -275px;
}



/*  Productos  */

#left-col.product {
	float: left;
	width: 460px;
	padding: 40px 0 0 78px;
}

#line-menu,
#line-menu2 {
	float: left;
	width: 217px;
}

#line-menu li,
#line-menu2 li {
	width: 217px;
	height: 58px;
	display: block;
	margin: 0 0 12px 0;
	background: url(img/products-line-menu-bg.png) repeat-x;
}


#line-menu li a,
#line-menu2 li a {
	display: block;
	width: 145px;
	height: 46px;
	padding: 12px 37px 0 35px;
	background: url(img/products-line-menu-arrow.png) 14px 19px no-repeat;
	font-size: 12px;
	line-height: 17px;
	color: #FFFFFF;
	text-shadow: -1px 1px 1px #555;
}

#line-menu li.hover,
#line-menu2 li.hover,
#line-menu li.active,
#line-menu2 li.active {
	background: url(img/products-cat-menu-hover.png) repeat-x;
}

#line-menu li a.short,
#line-menu2 li a.short {
	height: 38px;
	padding: 20px 37px 0 35px;
}

.category-menu {
	float: left;
	width: 207px;
	display: inline;
	margin: 0 0 0 14px;
}

.category-menu .section,
#section6.section {
	display: none;
}

.category-menu li {
	padding: 0 0 2px 0;
}

.category-menu a,
.category-menu h3 {
	display: block;
	width: 200px;
	height: 26px;
	padding: 0 0 0 7px;
	background: url(img/products-cat-menu-bg.png) repeat-x;
	color: #FFF;
	font-size: 12px;
	line-height: 26px;
	font-weight: normal;
}

.category-menu h3 a {
	display: block;
	width: 200px;
	height: 26px;
	padding: 0 0 0 0;
	background: none;
	color: #FFF;
	font-size: 12px;
	line-height: 26px;
	font-weight: normal;
}

.category-menu h3 {
	background: url(img/products-cat-menu-bg2.png) repeat-x;
	margin: 0 0 3px 0;
	cursor: pointer;
}

.category-menu #section5 h3 {
	background: url(img/products-cat-menu-bg.png) repeat-x;
}

.category-menu a {
	width: 199px;
	padding: 0 0 0 8px;
}

/* .category-menu #accordion a {
	width: 189px;
	padding: 0 0 0 18px;
} */

.category-menu #accordion h3 a {
	width: 190px;
	padding: 0;
}

.products {
	float: left;
	width: 100%;
}

.products .box {
	float: left;
	width: 103px;
	height: 142px;
	position: relative;
	padding: 12px 0 0 0;
}

.products .box a.block {
	position: absolute;
	top: 12px;
	left: 0;
	width: 96px;
	height: 153px;
	background: url(img/blank.png);
}

.products .box .image {
	width: 90px;
	height: 90px;
	overflow: hidden;
	text-align: center;
}

#left-col .products .box p {
	font-size: 10px;
	color: #58595b;
	line-height: 12px;
	padding: 0 10px 0 0;
}

#left-col .products .box p.active {
	color: #3b8e9e;
}

#left-col .description {
	position: relative;
	width: 300px;
	margin: 0 0 0 135px;
}

#left-col .description h2 {
	font-size: 16px;
	letter-spacing: -1px;
	text-transform: uppercase;
}

#left-col .description p {
	line-height: 14px;
}

#left-col .description p span {
	font-weight: bold;
}

#left-col .description .image {
	position: absolute;
	top: -30px;
	left: -400px;
	width: 400px;
	z-index: 9;
	text-align: center;
	overflow: hidden;
}

#left-col .description a.button,
#left-col.text a.button-back {
	display: block;
	width: 62px;
	height: 26px;
	padding: 0 0 0 28px;
	font-size: 11px;
	font-weight: bold;
	background: url(img/product-description-button-bg.png) no-repeat;
	color: #FFF;
	line-height: 26px;
	margin: 30px 0 0 0;
}

#left-col .description a.button:hover,
#left-col.text a.button-back:hover {
	background: url(img/product-description-button-bg.png) no-repeat;
}

.form {
	float: left;
	width: 100%;
	padding: 10px 0 0 0;
}

.form label {
	float: left;
	clear: both;
	margin: 9px 0 0 0;
	padding: 0 11px 0 0;
	width: 106px;
	text-align: right;
	font-size: 11px;
	color: #59595c;
}

.form input,
.form textarea {
	float: left;
	width: 210px;
	height: 23px;
	margin: 5px 0 0 0;
	padding: 0 5px;
	line-height: 23px;
	font-size: 12px;
	color: #59595c;
	background: url(img/contact-images.png) no-repeat;
	border: none;
	font-family: Arial, Helvetica, sans-serif;
}

.form textarea {
	width: 209px;
	height: 145px;
	padding: 7px 5px 0 5px;
	background: url(img/contact-images.png) 0 -48px no-repeat;
	overflow: auto;
	line-height: 13px;
}

.form input.size1 {
	width: 34px;
	text-align: center;
	margin: 5px 6px 0 0;
	background: url(img/contact-images.png) 0 -25px no-repeat;
}

.form input.size2 {
	width: 52px;
	text-align: center;
	background: url(img/contact-images.png) -100px -25px no-repeat;
}

#left-col .form p {
	margin: 0;
}

#left-col .form p.format {
	float: left;
	padding: 8px 0 0 4px;
}

#left-col .form p.large {
	clear: both;
	width: 218px;
	padding: 10px 0 0 116px;
	line-height: 14px;
}

#left-col .form p.small {
	clear: both;
    font-size: 10px;
	line-height: 13px;
    padding: 5px 0 0 114px;
}

.form .radio input {
	width: 12px;
	height: 12px;
	background: none;
}

.form .radio {
	float: left;
	width: 50px;
	margin: 5px 0 0 0;
}

.form .radio.first {
	margin: 5px 0 0 114px;
}

.form .radio label {
	width: 26px;
	clear: none;
	margin: 5px 0 0 0;
	text-align: left;
	padding: 0 0 0 5px;
}

.form button {
	background: #939598 url(img/button-arrow-next.png) 81px 9px no-repeat;
	width: 97px;
	height: 26px;
	float: right;
	border: none;
	font-size: 11px;
	line-height: 26px;
	color: #FFF;
	margin: 50px 0 0 0;
	cursor: pointer;
}

.form button:hover {
	background: #148e96 url(img/button-arrow-next.png) 81px 9px no-repeat;
}


/* Profesional Form */


#login-pro-form.form {
}

.form2 label {
	color: #FFF;
}

.form2 button {
	background: url(img/profesional-form-button.png) no-repeat;
	width: 75px;
	height: 23px;
	line-height: 23px;
	color: #FFF;
	margin: 4px 0 0 0;
}

.form2 button:hover {
	background: url(img/profesional-form-button.png) 0 -23px no-repeat;
}

.form2 p.forgot {
	clear: both;
	font-size: 11px;
	color: #81cee2;
	font-weight: bold;
	padding: 5px 0 0 27px;
}

.form2 p.forgot a {
	color: #81cee2;
}

.form2 p.heading {
	font-weight: bold;
	font-size: 11px;
	color: #FFF;
	padding: 0 0 2px 116px;
	text-align: left;
	width: 210px;
	float: left;
}

.form2 p.normal {
	font-weight: normal;
	padding: 13px 0 2px 116px;
}

.form2 {
	padding: 23px 0 0 0;
}

.form2 label {
	padding: 0 9px 0 0;
	width: 106px;
}

.form2 .login {
	width: 100%;
	clear: both;
	padding: 10px 0 0 0;
}

.form2 .login input {
	float: left;
}

.form2 .login input {
	width: 139px;
	background: url(img/contact-images.png) 0 -136px no-repeat;
}

.form2 p.small {
	float: left;
	clear: both;
	font-size: 10px;
	color: #FFFFFF;
	text-align: left;
	width: 139px;
	padding: 2px 0 4px 116px;
}

#register-pro-form button {
	clear: both;
}

.contact #msgbox {
	bottom: -43px;
    left: 218px;
}

#forgot_password_form {
	display: none;
}

#forgot_password_form #msgbox5 {
	left: 99px;
	top: 145px;
}

#msgbox6 {
	left: 65px;
	top: 165px;
}



/*  Diagnostico  */

#left-col p.heading {
	font-weight: bold;
	margin: 10px 0 0 116px;
}

.diagnosis #left-col p.heading {
	margin: 10px 0 0 0;
	text-transform: uppercase;
}

#left-col p.bold {
	font-weight: bold;
	margin: 20px 0 0 0;
}

#diagnosis_form.form {
	padding: 0;
}

.form input.radio2 {
	width: 12px;
	height: 12px;
	clear: both;
	margin: 14px 0 0 0;
	background: none;
}

.form button.diagnosis {
	margin: 6px 13px 0;
}

#left-col .form button.submit2 {
	margin: 11px 13px 0;
}

#left-col .form p.left {
	margin: 0;
    padding: 6px 0 0 120px;
    width: 95px;
	float: left;
}

#diagnosis_form.form label.right {
	float: left;
	clear: none;
	margin: 12px 0 0 0;
	padding: 0 11px 0 8px;
	width: 300px;
	text-align: left;
	font-size: 11px;
	color: #59595c;
}

#diagnosis_form a.button {
	background: #939598 url(img/button-arrow-back.png) 6px 9px no-repeat;
	width: 97px;
	height: 26px;
	float: right;
	border: none;
	font-size: 11px;
	line-height: 26px;
	color: #FFF;
	margin: 50px 10px 0 0;
	cursor: pointer;
	text-align: center;
}

#diagnosis_form a.button:hover {
	background: #148e96 url(img/button-arrow-back.png) 6px 9px no-repeat;
}

#diagnosis_form a.button.next {
	background: #939598 url(img/button-arrow-next.png) 81px 10px no-repeat;
}

#diagnosis_form a.button.next:hover {
	background: #148e96 url(img/button-arrow-next.png) 81px 10px no-repeat;
}

#left-col .form .results p.small {
    padding: 15px 0 0 0;
	width: 238px;
}

#left-col .form .results p.bold {
    padding: 5px 0 10px 0;
}

#left-col .results a.link {
	background: #7fb9c4;
	color: #FFF;
	font-size: 11px;
	width: 205px;
	height: 25px;
	line-height: 25px;
	display: block;
	padding: 0 0 0 10px;
	margin: 10px 0 0 0;
}

#left-col p.heading2 {
	padding: 114px 0 0 0;
}

.diagnosis #left-col .bottom-buttons {
	float: left;
	margin: 209px 0 0 0;
}

.diagnosis #left-col .bottom-buttons a {
	float: left;
	margin: 0 15px 0 0;
	width: 133px;
	height: 26px;
	line-height: 26px;
	display: block;
	color: #FFFFFF;
	font-size: 11px;
	text-align: center;
	background: #939598;
}

.diagnosis #left-col .bottom-buttons a:hover {
	background: #148e96;
}

.step {
	display: none;
}

#step1 {
	display: block;
}

#step4 .products,
#step5 .products {
	width: 207px;
	height: 470px !important;
	overflow: hidden !important;
}

.diagnosis #left-col #step4 .bottom-buttons,
.diagnosis #left-col #step5 .bottom-buttons {
	margin: 0px;
}




/*  FAQ  */

#left-col.text {
	width: 380px;
}

#left-col .scroll-pane {
}

#left-col .scroll-pane h5 {
	color: #59595c;
	font-size: 11px;
	text-transform: uppercase;
	margin: 12px 0 0 0;
}

#left-col .scroll-pane p {
	margin: 0;
}

#left-col .file {
	background: #7FB9C4;
	width: 335px;
	height: 27px;
	display: block;
	font-size: 12px;
	color: #FFFFFF;
	text-transform: uppercase;
	line-height: 27px;
	padding: 0 0 0 8px;
	margin: 0 0 10px 0;
	position: relative;
}

#left-col .file a.block {
	position: absolute;
	width: 343px;
	height: 27px;
	top: 0;
	left: 0;
	z-index: 9;
	display: block;
	text-indent: -9999em;
	overflow: hidden;
}

#left-col .file-links {
	margin: 35px 0 0 0;
}

#left-col .file:hover {
	background: #5ca6b4;
}

#left-col .file span.left {
	float: left;
}

#left-col .file span.right {
	background: url(img/pdf-img.png) right center no-repeat;
	float: right;
	margin: 0 7px 0 0;
	padding: 0 23px 0 0;
	text-transform: capitalize;
	font-size: 11px;
}












/* Easy Slider */

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:709px;
		height:368px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:270px;
		top:170px;
		z-index:1000;
		text-indent: -9999em;
		overflow: hidden;
		}	
	#nextBtn, #slider1next{ 
		left: 1021px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:17px;
		height:32px;
		background: url(img/slide-prev-button.png) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background: url(img/slide-next-button.png) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		height: 28px;
		padding: 0;
		position: absolute;
		right: 303px;
		text-align: right;
		top: 22px;
		z-index: 9;
		}
	ol#controls li{
		margin:0 12px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		}
	ol#controls li a{
		float:left;
		height:10px;
		width: 10px;
		background: url(img/slide-controls-img.png) 0 -10px;
		text-indent: -9999em;
		overflow: hidden;
		}
	ol#controls li.current a{
		background: url(img/slide-controls-img.png) 0 0;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */

#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:9000;
  display:none;
  background: #000;
  margin: 175px 0 0 0;
}
  
.window {
  position:absolute;
  left:0;
  top:0;
  display:none;
  z-index:9999;
  padding:20px;
  width: 335px;
}

#dialog {
  padding:10px;
  text-align: center;
}



/*    Search    */

.search ul {
	padding: 15px 0 0 0;
}

.search li {
	line-height: 19px;
}

.search li a {
	color: #45A6B0;
	font-size: 12px;
}



/*  Scroll  */

.holder {
	float: left;
}

.scroll-pane {
	width: 380px;
	height: 450px;
	overflow: auto;
	float: left;
}

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding: 0 0 7px 0;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: url(img/scroll-track-bg.png) center repeat-y;
}
.jScrollPaneDrag {
	position: absolute;
	background: #549ba3;
	cursor: pointer;
	overflow: hidden;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-box-shadow: 2px;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
.jScrollArrowUp,
.jScrollArrowDown {
	background: url(img/scroll-arrow-up.png) no-repeat;
	width: 11px;
	height: 7px;
	text-indent: -9999em;
	overflow: hidden;
	position: absolute;
	right: 0;
}

.jScrollArrowDown {
	background: url(img/scroll-arrow-down.png) no-repeat;
}


/*  Profesional  */

#dialog #msgbox {
	bottom: -20px;
	left: 60px;
}

#msgbox .login {
	bottom: auto;
	top: 60px;
	left: 60px;
}

#msgbox2 {
	left: 85px;
    top: 142px;
}

.diagnosis #msgbox {
	bottom: -36px;
    left: 190px;
	z-index: 10000;
}

.diagnosis #msgbox3 {
	left: 195px;
    top: 183px;
}

.profesional #file_search {
	float: left;
	margin: 12px 0 18px;
}

.profesional #file_search input {
	color: #58595b;
	font-size: 11px;
	padding: 0 0 0 5px;
}

.profesional ul.results {
	padding: 15px 0 0 0;
}

.profesional #line-menu2 {
	clear: both;
	width: 198px;
}

.profesional #line-menu2 li {
	width: 198px;
}

.profesional .category-menu {
	width: 178px;
	margin: 0 0 0 4px;
}

.profesional .category-menu a {
	width: 170px;
}

.profesional .category-menu li {
	width: 178px;
}

#accordeon4 {
	clear: both;
	float: left;
}

#accordeon4 ul {
	padding: 0 0 0 0;
}

#accordeon4 ul {
	margin: 0 0 15px 0;
}

#accordeon4 p {
	margin: 0;
}

#accordeon4 h3 {
	width: 217px;
	height: 58px;
	display: block;
	margin: 0 0 12px 0;
	background: url(img/products-line-menu-bg.png) repeat-x;
	font-weight: normal;
}

#accordeon4 h3 a {
	display: block;
	width: 145px;
	height: 46px;
	padding: 12px 37px 0 35px;
	font-family: 'SansumiDemiBoldRegular';
	background: url(img/products-line-menu-arrow.png) 14px 19px no-repeat;
	font-size: 12px;
	line-height: 17px;
	color: #FFFFFF;
	text-shadow: -1px 1px 1px #555;
}

#accordeon4 h3 a.short {
	height: 38px;
	padding: 20px 37px 0 35px;
}

#accordeon4 .ui-state-active,
#accordeon4 .ui-state-hover {
	background: url(img/products-cat-menu-hover.png) repeat-x;
}

#modify_password_form {
	display: none;
}

#modify_password_form input {
	width: 210px;
	background: url(img/contact-images.png) no-repeat;
}




/*   ADMIN   */

body.admin {
	background: #84888B;
}

.admin #container,
.admin .login-bg {
	width: 100%;
	overflow: hidden;
	min-height: 400px;
	background: #FFF url(img/admin-sidebar-bg.png) repeat-y;
}

.admin .login-bg {
	background: #FFF;
}

.admin #header p.msge {
	color: #FFFFFF;
    float: right;
    font-size: 12px;
    margin: 15px 0 0;
    position: absolute;
    right: 0;
    top: 137px;
}

.admin #footer {
	height: 100px;
	padding: 10px 0 0 0;
}

.admin #footer h2.logo a {
	margin: 17px auto 0 auto;
}

.admin .login_form {
	width: 300px;
	margin: 150px auto;
	font-size: 12px;
}

.admin .login_form label {
	float: left;
	width: 70px;
	padding: 0 10px 0 0;
	text-align: right;
	margin: 10px 0 0 0;
}

.admin .login_form input {
	float: left;
	width: 150px;
	height: 17px;
	line-height: 17px;
	margin: 10px 0 0 0;
}

.admin .login_form button {
	float: left;
	border: none;
	padding: 3px 10px;
	background: #84888B;
	text-align: center;
	color: #FFFFFF;
	margin: 10px 0 0 139px;
	clear: both;
	cursor: pointer;
}

.admin #msgbox {
	clear: both;
    float: left;
    margin: 15px 0 0 111px;
}

.admin .categories #msgbox {
	clear: both;
    float: left;
    margin: -39px 0 0 66px;
}

.admin .categories #msgbox.addfile {
    margin: 10px 0 0 66px;
}

.admin #login_form #msgbox {
    margin: 15px 0 0 7px;
}

.admin .categories #add_banner #msgbox {
	margin: 15px 0 0 111px;
}

.admin .categories #add_product #msgbox,
.admin .categories #edit_product #msgbox {
	clear: both;
    float: left;
    margin: 15px 0 0 66px;
}

.messagebox {
	position: absolute;
	width: 222px;
	margin: 10px 0 0 6px;
	border: 1px solid #c93;
	background: #ffc;
	padding: 3px;
	font-size: 11px;
	text-align: center;
}

.messageboxok {
	position: absolute;
	width: 222px;
	margin: 10px 0 0 6px;
	border: 1px solid #349534;
	background: #C9FFCA;
	padding: 3px;
	color: #008000;
	font-size: 11px;
	text-align: center;
	
}

.messageboxerror {
	position: absolute;
	width: 222px;
	margin: 10px 0 0 6px;
	border: 1px solid #CC0000;
	background: #F7CBCA;
	padding: 3px;
	color: #CC0000;
	font-size: 11px;
	text-align: center;
}

.admin #sidebar {
	float: left;
	width: 200px;
}

.admin #sidebar ul {
	padding: 20px 10px;
}

.admin #sidebar ul li {
	line-height: 23px;
	font-size: 12px;
}

.admin #sidebar ul li a {
	color: #FFFFFF;
}

.admin #sidebar ul li a:hover {
	text-decoration: underline;
}

.admin #content {
	float: left;
	width: 1000px;
	padding: 20px;
	font-size: 12px;
}

.admin #content h2 {
	color: #45A6B0;
    font-family: 'SansumiDemiBoldRegular';
    font-size: 22px;
    font-weight: normal;
    line-height: 25px;
}

.admin #content ul.links {
	float: left;
	clear: both;
	margin: 20px 0 0 0;
}

.admin #content ul.links li {
	line-height: 20px;
}

.admin #content ul.links a {
	color: #45A6B0;
}

.admin #content ul.links a:hover {
	text-decoration: underline;
}

.admin form.add_category {
	padding: 30px 0 0 0;
}

.admin form {
	padding: 0 0 50px 0;
}

.admin form select,
.admin form input,
.admin form textarea,
.mceEditor {
	font-size: 12px;
	width: 227px;
	float: left;
	height: 17px;
	line-height: 17px;
	margin: 10px 0 0 0;
}

.admin form textarea {
	height: 200px;
}

.admin form input.file {
	height: 23px;
}

.admin form select {
	cursor: pointer;
}

.admin form input.check,
.admin form input.radio {
	width: 12px;
	float: left;
	height: 12px;
	margin: 22px 0 0 87px;
	clear: both;
}

.admin form input.radio {
	margin: 12px 0 0 87px;
}

.admin form label {
	font-size: 12px;
	width: 100px;
	float: left;
	padding: 0 10px 0 0;
	clear: both;
	margin: 13px 0 0 0;
	text-align: right;
}

.admin form input.style1 {
	margin: 10px 0 0 10px;
}

.admin form label.check,
.admin form label.radio {
	font-size: 12px;
	width: auto;
	float: left;
	padding: 0 0 0 10px;
	clear: none;
	margin: 21px 0 0 0;
	text-align: left;
}

.admin form label.radio {
	margin: 13px 0 0 0;
}

.admin form button {
	background: #939598 url(img/button-arrow-next.png) 81px 9px no-repeat;
	width: 97px;
	height: 26px;
	float: left;
	clear: both;
	border: none;
	font-size: 11px;
	line-height: 26px;
	color: #FFF;
	margin: 10px 0 0 247px;
	cursor: pointer;
}

.admin form button:hover {
	background: #148e96 url(img/button-arrow-next.png) 81px 9px no-repeat;
}

.admin .list {
	padding: 20px 0 0 0;
}

.admin .list .line {
	float: left;
	width: 100%;
	clear: both;
	padding: 0 0 10px 0;
}

.admin .list .category_content,
.admin .list .deploy_categories {
	float: left;
	width: 100%;
	clear: both;
	padding: 0 0 10px 0;
}

.admin .list .deploy_categories {
	display: none;
}

.admin .list .deploy_categories p {
	float: left;
	width: 190px;
}

.admin .list .deploy_categories a.edit,
.admin .list .deploy_categories a.delete {
	float: left;
	width: 16px;
	height: 16px;
	background: url(img/edit-button.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	margin: 0 0 0 3px;
}

.admin .list .deploy_categories a.delete {
	background: url(img/delete-button.gif) no-repeat;
}

.admin .list .category_content a.title {
	display: block;
	color: #45A6B0;
    font-family: 'SansumiDemiBoldRegular';
    font-size: 16px;
    line-height: 29px;
	text-transform: uppercase;
}

.admin .list .line.subtitle h3 {
	color: #003333;
	font-weight: normal;
	font-size: 15px;
	padding: 0 0 10px 0;
}

.admin .list .line a.title {
	display: block;
	color: #45A6B0;
    font-family: 'SansumiDemiBoldRegular';
    font-size: 16px;
    line-height: 29px;
	text-transform: uppercase;
}

.admin a.button {
	background: #999999;
	color: #FFFFFF;
	font-size: 12px;
	text-align: center;
	padding: 3px 8px;
	display: block;
	float: left;
	margin: 0 0 20px 0;
}

.admin a.button:hover {
	background: #148e96;
}

.admin #deploy_subtitle {
	float: left;
	clear: both;
	display: none;
}


.admin .categories .line.subtitle {
	font-size: 20px;
	font-weight: bold;
	padding: 10px 0 0 0;
}

.admin .categories .line {
	font-size: 12px;
	line-height: 17px;
	padding: 0;
}


/* Products */

.admin .list p {
	float: left;
	width: 150px;
}

.admin .list a.edit,
.admin .list a.delete {
	float: left;
	width: 16px;
	height: 16px;
	background: url(img/edit-button.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	margin: 0 0 0 3px;
}

.admin .list a.delete {
	background: url(img/delete-button.gif) no-repeat;
}

.admin h4 {
	clear: both;
	float: left;
	margin: 20px 0 0 0;
	font-size: 17px;
	color: #45A6B0;
	font-weight: normal;
}

.admin h6 {
	font-weight: bold;
	clear: both;
	float: left;
	margin: 13px 0 0 0;
	font-size: 15px;
}

.admin h6.subtitle {
	font-size: 13px;
}

.admin h6.subtitle,
.admin form .checkboxes label.radio.subtitle {
	padding: 0 0 0 15px;
}

.admin h6.subtitle2 {
	padding: 0 0 0 0;
}


.admin form .checkboxes label.radio {
	margin: 6px 0 0 0;
	clear: both;
	width: 150px;
	padding: 0;
}

.admin form .checkboxes input.check {
	margin: 6px 0 0 10px;
	clear: none;
}

.admin .list p {
	float: left;
	width: 190px;
}

.admin .list .line.heading p {
	font-weight: bold;
}

.admin .list p.col1 {
	width: 220px;
}

.admin .list p.col2 {
	width: 130px;
}

.admin .list p.col3 {
	width: 130px;
}

.admin .list p.col4 {
	width: 100px;
}

.admin .list p.col5 {
	width: 100px;
}

.admin .list p.col6 {
	width: 105px;
}







/*  Tiny MCE*/

.mceEditor {
	height: 235px;
}



/*  END  ADMIN   */




/*  ########################### FOOTER  ########################### */


#footer {
	clear: both;
	width: 100%;
	height: 300px;
	padding: 25px 0 0 0;
	background: #84888b;
}

#footer .center {
	height: auto;
}

#footer .box {
	width: 100%;
	height: 50px;
	background: #9d9fa1;
}

#footer .box a.linkFB {
	background: url(img/facebook.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	float: left;
	display: inline;
	margin: 9px 0 0 17px;
}

#footer .box a.linkWSP {
	background: url(img/whatsapp.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	float: left;
	display: inline;
	margin: 9px 0 0 17px;
}


#footer .menu {
	float: left;
	padding: 0 0 0 170px;
	line-height: 39px;
}

#footer .menu li {
	float: left;
	font-size: 10px;
	color: #d0d1d3;
}

#footer .menu li a {
	float: left;
	display: inline;
	margin: 0 7px;
	color: #d0d1d3;
	text-transform: uppercase;
	font-size: 10px;
}

#footer .col {
	float: left;
	display: inline;
	width: 190px;
}

#footer h2.logo a {
	display: block;
	width: 93px;
	height: 52px;
	background: url(img/footer-logo.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	margin: 30px 0 0 0;
}

#footer .col p {
	font-size: 10px;
	color: #FFF;
	line-height: 12px;
	padding: 5px 0 4px 0;
}

#footer .col p span {
	font-weight: bold;
	color: #FFF;
}

#footer .col0 p {
	padding: 24px 0 4px 0;
}

#footer .col p a {
	color: #FFF;
}

#footer .col2 {
	margin: 20px 0 0 0;
}

#footer .col3 {
	width: 167px;
	margin: 20px 0 0 0;
}

#footer .col4 {
	width: 116px;
	margin: 20px 0 0 38px;
}

/*  ########################### BOTON FLOTANTE ########################### */


.container {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
}

.btn-ayuda {
position: fixed;
bottom: 30px;
right: 30px;
border: 50px;
text-align:center;
z-index:100;
  }
