:root{
	--sidebar:290px;
}
html,body{height: 100%}

body {
	margin: 0;
	font-family: Roboto,sans-serif;
	font-weight: 300;
	line-height: 1.571429;
	color:  var(--text);
	text-align: left;
	background-color: #fff;
	background-color: var(--body_bcolor);
	font-size: .875rem;

	
}

.alert-secondary {
	color: #fff;
	background-color: rgba(255,255,255,0.2);
	border-color: transparent;
}

h1,h2,h3,h4,h5,h6 {margin-bottom: .5715rem;font-weight: 400;line-height: 1.2;color: var(--text2);}

.alert-success h3, .alert-danger h3{color: inherit;}

.wbs-login.offset-md-3.col-md-6 {margin-left: 0;max-width: 100%;}

/* Header */
.wbs-tpl-phone-menu-button {border: 0;color: #fff;background: transparent;margin-right: 15px;display: none}
.wbsa-header {background: var(--header_bcolor);color: var(--header_text);box-shadow: 0 0px 30px rgba(0,0,0,.10) !important; padding: 0}
.wbsa-logo {background: var(--brand_bcolor);padding: 14px 20px;width: var(--sidebar);padding: 0;text-align: center;padding: 10px 0;}
.wbsa-logo img {height: 50px;}


@media (max-width: 767.98px) {
.wbsa-header.navbar {height: 50px;display: flex;align-content: center;}	
.wbsa-logo {padding: 10px 20px;position: fixed;top: 0;width: 100%;text-align: center}
.wbs-tpl-phone-menu-button {display: block;width: 50px;}
.wbsa-logo img {height: 40px;margin: 0;}
}

.wbsa-header-right {padding: 0 20px;}
 
/* Avatar */
.wbs-avatar-wrapper {width: 50px;height: 50px;margin: 0;border: 0;}
.wbs-avatar-wrapper img {width: 100%;border-radius: 50%;}
.modal-backdrop {position: unset;} /* para poner el avatar en la barra de nav que es styky */
@media (max-width: 767.98px) {
.wbsa-logo {padding: 10px 20px;position: fixed;top: 0;width: 100%;text-align: center}
.wbs-tpl-phone-menu-button {display: block;width: 50px;}
.wbsa-logo img {height: 40px;margin: 0;}
.wbs-avatar-wrapper {width: 40px;height: 40px;}
.wbsa-logo {position: relative;flex: 1;}
}


/* Login */
html{height: 100%}
.wbsa-login-page #wbs-root {overflow: visible;}
.wbsa-login-page .wbsa-header {display: none;}
.wbsa-login-page .wbsa-sidebar {display: none;}
.wbsa-login-page .wbsa-footer {display: none;}
.wbsa-login-page { height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover;}
.wbsa-login-page .wbsa-content {padding: 0;margin: 0;width: 100%;text-align: center;height: 100vh;display: flex;justify-content: center;align-items: center;}
.wbs-brand {margin-bottom: 20px}
.wbsa-login-page .wbs-panel {background-color: rgba(255,255,255,0.7);width: 400px;border-radius: 22px;color: #000;}
.brand-img {width: 400px;}
.wbsa-login-page .wbs-panel-content {padding: 2rem 1rem 1rem;}
.wbsa-login-page .wbs-register-group-wrapper {overflow:visible;}
.wbsa-login-page .wbsa-content {background-image: none;}
.wbs-panel-content h3 {color: #000;}
.wbsa-login-page .wbsa-content-wrapper{margin-left: 0}
.wbs-login-links-forgot a {color: #333;}
@media (max-width: 767px) {
.wbsa-login-page .wbs-panel {width: auto;}
.wbs-brand {width: 195px;margin: 10px auto 0;}	
.wbsa-login-page .wbsa-content {background-image: none;align-items: start;}	
.wbsa-login-page .wbsa-content-wrapper {padding-top: 10px}
.wbsa-login-page .wbsa-content-wrapper {padding-top: 10px}
.wbs-cf-login {display: flex;flex-direction: column-reverse;}
.wbsa-login-page {position: fixed;top: 0;bottom: 0;left: 0;margin: 0;right: 0;}
#jform_email,#jform_username, #jform_token,#jform_password1,#jform_password2{width: 100%;}
.wbsa-login-page .wbs-panel {width: 90%;margin: 5% auto;}
.wbs-cf-login .wbs-panel {margin: 0;width: auto;}	
.wbs-panel-content h3 {font-size: 18px;}
}

/* Content */
.wbsa-content-wrapper {margin-left: var(--sidebar);display: flex;flex-direction: column;width: 100%; min-height: 90vh;}

.wbsa-content{padding: 30px; width: 100%; flex: 1}
.page-header h2{font-size: 26px}
.wbs-info-wrapper {background-color: transparent !important;border: 0 !important;margin-bottom: 0 !important;padding: 0 !important;}




/* Sidebar */
.wbsa-sidebar {background: var(--menu_bcolor);position:fixed;top:8px;bottom:0;left:0;z-index:100;padding:60px 0 0;
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1); width: var(--sidebar);}

@media (max-width: 767.98px) {
.wbsa-sidebar {position: fixed;transition: left 0.3s;height: 100%;overflow-y: scroll;top:30px;left: -400px;z-index: 200;box-shadow: 0 0 30px rgba(0,0,0,0.3) inset; padding-top: 30px;width: 100%}
.wbsa-sidebar.is-active {left: 0;}
.wbsa-content-wrapper {margin-left: 0;}
}

#wbs-root {width: 100%;}


/* scroll bar */
.ss-wrapper { overflow: hidden; width: 100%; height: 100%; position: relative; z-index: 1; float: left;}
.ss-content { height: 100%; width: calc(100% + 18px); padding: 0 0 0 0; position: relative; overflow-x: auto; overflow-y: scroll; box-sizing: border-box;}
.ss-content.rtl { width: calc(100% + 18px); right: auto;}
.ss-scroll { position: relative; background: rgba(0, 0, 0, 0.1); width: 9px; border-radius: 4px; top: 0; z-index: 2;cursor: pointer; opacity: 0; transition: opacity 0.25s linear;}
.ss-hidden {display: none;}
.ss-container:hover .ss-scroll,.ss-container:active .ss-scroll {opacity: 1;}
.ss-grabbed { -o-user-select: none; -ms-user-select: none; -moz-user-select: none; -webkit-user-select: none; user-select: none;}




/* sidebar menu */
.wbsa-side-menu-title {color: var(--menu_text);font-size: 15px;text-transform: uppercase;padding: 0 24px;margin-top: 20px;font-weight: 300;}
.wbsa-side-menu li a {display: block;padding: 10px 12px;color: var(--menu_text); position: relative}
.wbsa-side-menu li a:hover{text-decoration: none; background-color: rgba(255,255,255,.05)}
.wbsa-side-menu .active a{background-color: rgba(255,255,255,.02)}
.wbsa-side-menu li a i {width: 32px; text-align: center;margin-right: 5px}
.wbsa-side-menu li {list-style: none;}
.wbsa-side-menu  > .deeper > a::before {content: "";position:absolute;right: 15px;border-top: 7px solid transparent;
border-bottom: 7px solid transparent;border-left: 7px solid rgba(255,255,255,0.6);top: 15px;transition-duration:0.3s;}
.wbsa-side-menu   > .deeper > ul{margin:0; transition:0.6s; max-height:0;overflow:hidden;padding: 0}
.wbsa-side-menu   > .deeper.open > ul, .wbsa-side-menu > .deeper.active > ul {max-height:500px;}
.wbsa-side-menu   > .deeper.active> a::before, .wbsa-side-menu > .deeper.open> a::before {transform:rotate(90deg);}
.wbsa-side-menu > .deeper > ul > li > a {	padding: 5px 0 5px 18px;font-size: 95%;color: rgba(255,255,255,0.7);padding-left: 46px;}
.wbsa-side-menu .current a {color: #fff !important;background: rgba(255,255,255,.05)}
@media (max-width: 767.98px) {
.wbsa-side-menu > .deeper > ul > li > a {padding: 10px 0 10px 18px;}
.wbsa-side-menu li a {width: 95%;}	
}






  
  /*
   * Navbar
   */
  
  .navbar-brand {box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25); }
  .navbar .navbar-toggler {top: .25rem;right: 1rem;}
  .navbar .form-control {padding: .75rem 1rem;border-width: 0;border-radius: 0;}

  .form-control-dark {color: #fff;background-color: rgba(255, 255, 255, .1);border-color: rgba(255, 255, 255, .1);}
  .form-control-dark:focus {border-color: transparent;box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);}



 /*Footer*/
.wbsa-footer {
	background: var(--footer_bcolor);
	padding: 7px 20px;
	bottom: 0;
	width: 100%;
	left: var(--sidebar);
	position: fixed;
	z-index: 100;
	color: #fefefe;
}@media (max-width: 767.98px) {
.wbsa-footer {left: 0;padding: 7px 20px;text-align: center;}
}




/* Para este cliente */


/*
.wbsa-content {
	background-image: url("../../../images/backgrounds/fondo2.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	min-height: 100vh; 
	background-position-x:  right;
	background-position-y:  -38px;
	
	background-attachment: fixed;
}
*/

/* pasar al estilo del groupjoom*/
.wbs-wmedia-list{display:flex;flex-wrap: wrap}
.wbs-wmedia-item {flex: 0 0 33%;padding: 10px 30px;margin-bottom: 20px;}
.wbs-wmedia-item .media-heading {font-size: 20px;}
@media (max-width: 767.98px) {
.wbs-wmedia-item {flex: 0 0 100%;padding: 10px 0px;text-align: center;}
.wbs-wmedia-item .media-heading {font-size: 18px;}	
}
.wbs-wmedia-item-whatsapp {
	float: left;
}

.wbs-wmedia-item-whatsapp i {cursor: pointer;font-size: 30px;background: #25d366;border-radius: 50%;line-height: 26px;color:#fff}
span.wbs-wmedia-item-whatsapp {margin-left: 10px;}

.wbs-wmedia-item-telegram i {cursor: pointer;font-size: 30px;background: #fff;border-radius: 50%;line-height: 26px;color:#32afed}
span.wbs-wmedia-item-telegram {margin-left: 10px;}
.cm-backoffice-title {
	background: #103449;
	text-align: center;
	font-size: 18px;
	padding: 8px 0;
	font-weight: bold;
	margin-bottom: 5px;
}
a{color:var(--color)}
a:hover, a:focus {color: var(--color3);}
.wbs-cart-keep-buying-wrapper {
	display: none;
}