/**
* Index custom styles
*/

.wrapper {
	overflow: hidden;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
	background-color: inherit;
}

header.header-wrapper .banner-meta h1.home-main-title {
	padding: 0 10%;
	margin-bottom: 15px;
    line-height: 1.3;
}

header.header-wrapper .banner-meta p.lead.home-main-subtitle {
    font-weight: 400;
    font-size: 18px;
	padding: 0 10%;
}

header.header-wrapper .banner-meta {
	margin-bottom: 165px;
}
header.header-wrapper .banner-meta > p > a {
	margin-bottom: 15px;
}

.banner-image #img_video {
	max-width: 740px;
}

.service-items {
	text-align: center;
    padding-left: 15px;
    padding-right: 15px;
}

.row-section-process img {
	max-height: 75px;
}

.row-section-process h4 > span {
	color: #12be91!important;
}

#img_video {
	cursor: pointer;
}

.condiciones-item {
	margin-top: 15px;
}

.condiciones-item h4 {
	color: #72808e;
	margin-bottom: 10px;
}

.condiciones-item .fa-circle {
    color: #12be91;
    font-size: 10px;
    vertical-align: middle;
    margin-right: 10px;
}

.condiciones-item.super-title p {
	height: 48px;
	line-height: 1.3em;
}


/**
* Colores institucionales
*/

::selection {
  background: #12be91; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: #12be91; /* Gecko Browsers */
}


.type-green {
	color: #12be91;
}

.bg-green {
	background-color: #12be91;
}

.type-blue {
	color: #1A415B;
}

.bg-blue {
	background-color: #1A415B;
}



/**
* FAQ Icons
*/

.faq-category-item {
	opacity: 0.7;
	margin-top: 20px;
}

.faq-category-item:hover {
	opacity: 1;
}

.faq-category-item {
	text-align: center;
}

.faq-category-item img {
	max-height: 100px;
	margin: auto;
}


/**
* Product images
*/

.img-ss {
	border-radius: 5px;
	max-width: none;
	margin-bottom: -15px;
}



/**
* Paneles custom
*/


.panel-group-container {
	margin-top: 40px;
}

.custom-panel {
	border: 1px solid #ccc;
	margin-bottom: 5px;
}

.custom-panel .panel-header {
	background-color: #f5f5f5;
	padding: 10px 15px;
	cursor: pointer;
	position: relative;
}

.custom-panel .panel-header i {
	position: absolute;
    right: 16px;
    top: 12px;
}

.custom-panel .panel-header i.fa-chevron-up,
.custom-panel .panel-header.open i.fa-chevron-down {
	display: none;
}

.custom-panel .panel-header.open i.fa-chevron-up {
	display: block;
}

.custom-panel .panel-body {
	font-size: 13px;
	display: none;
}



/**
* General
*/

.box-shadow-sm {
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
}

.box-shadow-md {
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}


.blog-post-image-container {
	overflow: hidden;
    border-right: 5px solid #12be91;
}

.blog-post {
	border: none;
	border-radius: 5px;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
}

.blog-post:hover {
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.blog-post p {
	margin-top: 15px;
	margin-bottom: 15px;
}

.transition-all {
  -webkit-transition: all .3s linear;
  -o-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -ms-transition: all .3s linear;
  -kthtml-transition: all .3s linear;
  transition: all .3s linear;
}

.p-subfeature {
    max-width: 500px;
    margin: auto;
    text-align: center;
}

.card {
  background: #FFF none repeat scroll 0% 0%; 
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); 
  margin-bottom: 30px;
}

.box-shadow-sm {
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); 
}
.box-shadow-md {
   box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

section.contact .form-control.contact-input {
	background-color: transparent;
	border: transparent!important;
	border-bottom: 2px solid #1A415B!important;
}

section.contact .form-control.contact-input:focus {
	border-color: #12be91!important;
}


#btn_enviar_contacto {
	background-color: transparent;
	color: #1A415B;
	margin-top: 60px;
}

#btn_enviar_contacto:hover {
	color: #12be91;
}

.producto-cta {
	text-align:center;
	margin-bottom: 27px;
}

.btn-outline-primary {
	background-color: transparent;
	border-color: #12be91;
	color: #12be91;
}

section.contact .form-control.contact-input.form-error {
border-color: #ed5565!important;

}

section.demo-request .form-control.form-error {
border: 2px solid #ed5565!important;

}



/**
* Demo bar custom
*/


.demo-bar-min section.demo-request {
	padding: 40px 0;
}

.demo-bar-success-container {
	/*display: none;*/
	height: 0px;
	background-color: #12be91;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
}

.demo-bar-success-container > h5 {
	display: none;
    color: white;
    position: absolute;
    height: 20px;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}



/**
* Section styles
*/

.about-features .iconbox-center {
	padding: 0 10%;
}

.row-section-administracion-solicitudes img {
	border-radius: 15px;
	margin-bottom: -40px;
}

.row-section-administracion-planificacion img {
	max-width: 850px;
}


/* Testimonials */

#section_testimonial {
	padding: 30px 0 60px 0;
}
.testimonial-container {
	padding-right: 10px;
}
.testimonial-container .testimonial-item {
	display: inline-block;
	max-width: 600px;
    margin-top: 30px;
	text-align: justify;
	padding: 45px 35px 80px 120px;
	border-radius: 10px;
	position: relative;
	margin-left: 15px;
}
.testimonial-container .testimonial-item.testimonial-light {
	background-color: #eeeeee;
	color: #1A415B;	
}
.testimonial-container .testimonial-item.testimonial-dark {
	background-color: #1A415B;
	color: white;	
}
.filter-dark {
	filter: invert(99%) sepia(3%) saturate(669%) hue-rotate(239deg) brightness(117%) contrast(100%);
}
.filter-light {
	filter: invert(21%) sepia(11%) saturate(2876%) hue-rotate(161deg) brightness(95%) contrast(92%);
}
.testimonial-container .testimonial-item > img {
	position: absolute;
	left: 35px;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 50px;
	max-height: 50px;
}
.testimonial-container .testimonial-item .testimonial-signature {
    font-size: 12px;
    text-align: right;
    position: absolute;
    right: 25px;
    bottom: 15px;
}
.testimonial-container .testimonial-item .testimonial-signature > div > span {
	font-weight: 600;
}
.testimonial-container .testimonial-item .testimonial-signature > div {
	display: inline-block;
}
.testimonial-container .testimonial-item .testimonial-signature > img {
	max-height: 30px;
    vertical-align: top;
    margin-right: 15px;
}


/**

* Responsive custom styles

*/





/**
* LANDING: Call Center
*/

/**
* Title
*/

header.header-wrapper.header-call-center .banner-content {
	padding-bottom: 0;
}

header.header-wrapper.header-call-center .banner-meta {
	margin-bottom: 50px;
}


/**
* Features
*/

.features-pitch {
	padding: 0 15%;
}
.features-pitch p {
	font-size: 17px;
    padding: 0 10%;
    margin-top: 15px;
    margin-bottom: 30px;
	/*color: #1A415B;*/
}

.about-features.call-center-features {
	padding-bottom: 75px;
}

.about-features.call-center-features .features-title {
	text-align: center;
	margin-bottom: 50px;
}

.about-features.call-center-features .features-title h2 {
	color: #1A415B;
}

.about-features.call-center-features .features-body {
	text-align: center;
}
.about-features.call-center-features .features-item {
	margin-bottom: 30px;
	padding: 0 25px;
}
.about-features.call-center-features .features-item img {
	max-height: 75px;
	margin-bottom: 15px;
}
.about-features.call-center-features .features-item h5 {
	font-weight: 700;
	margin-bottom: 10px;
	color: #1A415B;
} 


/**
* Roles 2
*/

.section-roles-right[active="rrhh"]        div[rol="gerencia"], 
.section-roles-right[active="rrhh"]        div[rol="operaciones"], 
.section-roles-right[active="gerencia"]    div[rol="rrhh"], 
.section-roles-right[active="gerencia"]    div[rol="operaciones"], 
.section-roles-right[active="operaciones"] div[rol="rrhh"], 
.section-roles-right[active="operaciones"] div[rol="gerencia"], 
.section-roles-right[active="agente"]     div[rol="supervisor"], 
.section-roles-right[active="agente"]     div[rol="staff"], 
.section-roles-right[active="supervisor"] div[rol="agente"], 
.section-roles-right[active="supervisor"] div[rol="staff"], 
.section-roles-right[active="staff"]      div[rol="agente"], 
.section-roles-right[active="staff"]      div[rol="supervisor"] 
{
	display: none;
}


.section-roles-left {
	border-right: 1px solid #eee;
	padding-right: 0;
}

.section-roles-right {
	position: relative;
	height: 450px;
	padding: 40px 55px;
}
.section-roles-right [rol] {
    /*background-color: rgba(52, 73, 94,0.2);*/
    background-color: rgba(255, 255, 255,0.7);
    padding: 15px;
}
.section-roles-right button {
	margin-top: 15px;
	margin-bottom: 15px;
}
.section-roles-right h3 {
	margin-bottom: 15px;
}
.section-roles-right p {
	color: #1A415B;
}
.section-roles-right img {
	position: absolute;
	bottom: 0;
    right: 65px;
    max-height: 400px;
}

.section-roles-right {
    background-repeat: no-repeat;
    background-position: 90% 100%;
}
.section-roles-right[active="agente"] {
	background-image: url("../images/landings/callcenter/agente-operador-callcenter.png");
    background-size: 265px;
}
.section-roles-right[active="supervisor"] {
	background-image: url("../images/landings/callcenter/lider-supervisor-callcenter.png");
}
.section-roles-right[active="staff"] {
	background-image: url("../images/landings/callcenter/staff-planning-callcenter.png");
    background-size: 250px;
}

.roles-item-2 {
	text-align: center;
	height: 150px;
	background-color: white;
	border-bottom: 1px solid #ccc;
	position: relative;
}
.roles-item-2.active {
	margin-right: -1px;
	background-color: #f9f9f9;
	color: #12be91;
}
.roles-item-2:not(.active) {
	cursor: pointer;
}
.roles-item-2 > div {
	position: absolute;
	top: 0;
	bottom: 10px;
	left: 0;
	right: 0;
	margin: auto;
	height: 90px;
}
.roles-item-2 img {
	max-height: 80px;
	margin-bottom: 10px;
}

.roles-item-2 h5 {	
	color: #1A415B;
	font-weight: 700;	
    height: 40px;
}


.arrow_box {
	position: relative;
	background: #f9f9f9;
	border-right: 4px solid #12be91;
}
.arrow_box:after, .arrow_box:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after {
	border-color: rgba(0, 0, 0, 0);
	border-left-color: #f9f9f9;
	border-width: 30px;
	margin-top: -30px;
}
.arrow_box:before {
	border-color: rgba(18, 190, 145, 0);
	border-left-color: #12be91;
	border-width: 36px;
	margin-top: -36px;
}


@media only screen and (max-width: 767px) {

	.section-roles-right {
	    padding: 10px 30px;
	}
	.section-roles-right h3 {
		font-size: 19px;
	}
	.section-roles-right .btn {
		padding: 9px;
		font-size: 12px;
	}

}





/**
* Benefits
*/

section.section-benefits {
	padding-top: 80px;
}

section.section-benefits .benefits-item {
	text-align: center;
	padding: 0 5%;
	/*margin-bottom: 20px;*/
    min-height: 162px;
}
section.section-benefits .benefits-item img {
	margin-bottom: 10px;
	max-height: 75px;
}
section.section-benefits .benefits-bg-img {
	padding: 0 10%;
	text-align: center;
    border-bottom: 1px solid #eee;
}
section.section-benefits .benefits-bg-img img {
	max-height: 290px;
	margin: auto;
}


@media only screen and (max-width: 767px) {

	section.section-benefits .benefits-item {
		padding: 0 10%;
	}

}





/**
* Contact
*/


#contact_form.contact-form-common {
	padding: 50px 0px 0 0px;
	border-bottom: 1px solid #eee;
	overflow: hidden;
}
#contact_form.contact-form-common .conv-container {
	margin-top: 20px;
}

#contact_form.contact-form-common .perk-item {
	text-align: left;
	margin: 10px 0;
}
#contact_form.contact-form-common .perk-item > img {
	margin-top: 20px;
}
#contact_form.contact-form-common .perk-item > h4 {
	display: inline-block;
    max-width: 300px;
    margin-left: 15px;
    vertical-align: middle;	
}

@media only screen and (max-width: 991px) {	
	#contact_form.contact-form-common .perk-item {
		text-align: center;
	}
	#contact_form.contact-form-common .perk-item > h4 {
		display: block;		
	}
}

/*section.call-center-contact .form-container {
	padding-left: 40px;
	padding-right: 40px;
}

section.call-center-contact form {

	margin: auto;
	max-width: 525px;
	background-color: white;
	padding: 20px 30px;

	border-top-right-radius: 10px;
	border-top-left-radius: 10px;

}

section.call-center-contact form .form-group {
	margin-bottom: 25px;
}
section.call-center-contact form .form-control {
    background-color: transparent;
    box-shadow: none !important;
    border: transparent!important;
    border-bottom: 1px solid #ccc !important;
    border-radius: 0;
}
section.call-center-contact form .form-control:focus {
	border-bottom: 2px solid #12be91 !important;
}

section.call-center-contact form .btn {
	margin-top: 40px;
	margin-bottom: 10px;
}

section.call-center-contact .demo-bar-success-container {
	margin-left: -25px;
	position: relative;
}

section.call-center-contact .form-control.form-error {
    border-color: #ed5565!important;
}

.call-center-contact-title {
	margin-bottom: 35px;
}
.call-center-contact-title p {
	margin-top: 10px;
}*/

/**
* Contact FAQ
*/

section.contact-faq {
	border-bottom: 1px solid #eee;
}

.faq-item {
	margin-bottom: 15px;
    padding: 5px 35px;
}

.faq-item h4 {
	margin-bottom: 10px;
	font-size: 20px;
}
.faq-item p {
	/*padding: 0px 50px;*/
}

.contact-form-padding {
	padding: 90px 10% 120px 10%;
}
.perk-item {
	text-align: center;
    padding: 0 40px;
}
.perk-item > img {
	max-height: 80px;
}
.perk-item > h4 {
	color: white;
	/*font-weight: 600;*/
	margin-top: 15px;
	font-size: 20px;
}



/*-----------------------

01. RESPONSIVE STYLE

-----------------------*/

@media only screen and (max-width: 1500px) {



}

@media only screen and (max-width: 1199px) {



}

@media only screen and (max-width: 991px) {


	.banner-image #img_video {
		max-width: 100%;
	}

	.features-pitch {
		padding: 0;
	}

	.row-section-process > div {
		text-align: center;
	}
	.footer-section {
		padding-top: 20px;
	}


	.row-section-ausentismo-planilla img {
	    max-width: 725px;
	    margin-top: 25px;
	}


	.img-100-xs {
		width: 100%;
	}
	.img-142-xs {
		width: 142%;
	}

}

@media only screen and (max-width: 767px) {

	header.header-wrapper .banner-meta h1.home-main-title {
	    padding: 0 5%;
	    font-size: 33px;
	}

	.iconbox-center h4 {
		font-size: .8em;
	}

	.index-main-features .features-content {
		text-align: center;
	}

	.index-main-features .features-content .icon-holder {
		width: 100%;
	}

}

@media only screen and (max-width: 570px) {



}