/****************************************/
/**************** Helpers ***************/
/****************************************/

.bg-dark-purple{
    background-color: #32325d;
}
@media(min-width:990px){
.mobile{
    display: none;
    }}
@media(max-width:990px){
.desktop{
    display: none;
    }}
.btn.bl-gradient-btn {
    background: #00c6ff;
    font-weight: 500;
    background: -webkit-linear-gradient(to right, #0072ff, #00c6ff);
    background: linear-gradient(to right, #0072ff, #00c6ff);
    color: #fff!important;
    border: 0;
    box-shadow: 0 0 0 1px rgb(50 50 93 / 10%), 0 2px 5px 0 rgb(50 50 93 / 8%), 0 1px 1.5px 0 rgb(0 0 0 / 7%), 0 1px 2px 0 rgb(0 0 0 / 8%);
}

/****************************************/
/***** Video ******/
/****************************************/

.videobg{
    margin-top: 60px;
    height: 
}
@media(min-width:768px){
.videobg{
    margin-top: 90px;
    height: 60vh;
}}
@media(min-width:1024px){
.videobg{
    margin-top: 90px;
    height: 75vh;
}}

.videobg button {
  font-family: 'Hind Guntur', sans-serif;
  font-size: 15px;
  line-height: 1;
  color: #fff;
  letter-spacing: 0.025em;
  background: #379aff;
  padding: 15px;
  cursor: pointer;
  border: 0;
  border-radius: 6px;
  min-width: 120px;
  overflow: hidden;
    font-weight: 600;
  position: absolute;
  
  left: 50%;
  transform: translate(-50%, -50%);
}

@media(min-width:768px){
.videobg button{
   top: 150%;
}}
@media(min-width:1024px){
.videobg button{
   top: 180%;
}}

.videobg button span {
  display: block;
  position: relative;
  z-index: 10;
}




.videobg canvas {
  width: 260px;
  height: 260px;
  background: transparent;
  position: absolute;
  top: 180%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.videobg .pos-vertical-center{
    top: 37%;
}


/****************************************/
/***** Para quien es Be Madbox ******/
/****************************************/
.landing-sec-1 .left-side{
    padding-left: 0;
    padding-right: 0;
}
.landing-sec-1 h3, .landing-sec-2 h3, .app-features h3, .wod-features h3{
    letter-spacing: -0.01em;
    font-size: 3.14285714em;
    line-height: 1.31818182em;
    margin-bottom: 0.59090909090909em;
    }
@media(min-width:768px){
.landing-sec-1 .left-side{
	padding-left: 50px;
    padding-right: 50px;
    }}
@media(min-width:992px){
.landing-sec-1 .left-side{
	padding-left: 80px;
    padding-right: 80px;
    }}

.link-standard-green{
    color: #008169;
    font-size: 1.3em;
    margin-top: 20px;
    margin-bottom: 60px;
    display: block;
    font-weight: 400;
    cursor: pointer;
}
.link-standard-green:hover{
   font-weight: 600;
    color: #008169;
    text-decoration: none;
}
.link-standard-blue{
    color: #2784f4;
    font-size: 1.3em;
    margin-top: 60px;
    margin-bottom: 20px;
    display: inline-block;
    font-weight: 400;
    cursor: pointer;
}
.standard-blue-border{
    border: 1px solid #2784f4;
    padding-right: 25px;
    border-radius: 5px;
}
.standard-blue-border:hover{
    font-weight: 400!important;
    color: #2784f4;
    background: #fff;
    text-decoration: none;
}

.link-standard-blue:hover{
   font-weight: 600;
    color: #2784f4;
    text-decoration: none;
}
.link-standard-red{
    color: #e73132;
    font-size: 1.3em;
    margin-top: 0;
    display: block;
    font-weight: 400;
    cursor: pointer;
}
.link-standard-red:hover{
    font-weight: 600;
    color: #e73132;
    text-decoration: none;
}
.link-standard-blue i, .link-standard-green i{
    margin-left: 10px;
    font-weight: 800;
}
.link-standard-red i{
    margin-left: 10px;
    font-weight: 400;
}
.for-who-img{
    height: 33px;
    margin: 0;
}
@media(min-width:768px){
.for-who-img{
	float: left;
    }}
.for-who-item{
    display: block;
    margin: 4px 50px 0px;
}

.for-who-text{
    display: inline-block;
    font-size: 1.19em;
    padding-bottom: 13px;
}




.testimonial-cards-wrapper {
    min-height: 350px;
    padding-right: 0px;
}

@media(min-width:768px){
.testimonial-cards-wrapper {
    padding-right: 60px;
    }}
.testimonial-cards-container {
    position: relative;
}

.testimonial-card-item {
    
    padding: 20px;
    border-radius: 7px;
    box-shadow: 0 0 10px 1px rgba(222,222,222,.8)!important; 
    transform: scale(1);
    left: 0;
    width: 100%;
    z-index: 0;
}
.testimonial-card-item {
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    
}
.testimonial-card-content, .testimonial-card-item {
    -webkit-transition: all .5s cubic-bezier(.645,.045,.355,1);
    transition: all .5s cubic-bezier(.645,.045,.355,1);
}
.testimonial-card-quote {
    font-size: 90%;
    padding: 0 15px;
    color: #4a4a4a;
    line-height: 1.6;
    max-width: 80%;
    height: 0;
    opacity: 0;
    margin-bottom: 0;
    transition: all .2s ease;
    overflow: hidden;
    display: none;
}
.testimonial-card-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.testimonial-card-author-img {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    margin-right: 15px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.testimonial-card-author-info {
    flex: 0 1 100%;
    line-height: 1.6;
}
.testimonial-card-author-logo {
    flex: 0 0 100px;
    margin-left: 20px;
}
.testimonial-card-item:nth-child(2) {
    padding: 30px;
    transform: translateY(100px) scale(1.1);
    z-index: 1;
    box-shadow: 0 0 20px 2px #dedede;
}

.testimonial-card-item:nth-child(3) {
    transform: translateY(220px);
}
.text-moved-cards{
    font-weight: 700;
}
.text-moved-cards-smaller{
    font-size: 11px;
}
/****************************************/
/***** Principales caracteristicas ******/
/****************************************/
.striped{
	position: relative;
	height: auto;
}
.inclined-bg-grey {
	position: absolute;
  top: 80px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #f6f9fc;
  transform: skewY(-8deg);
}
@media(min-width:768px){
    .inclined-bg-grey {
       top: 150px;; 
    }}
.features1{
	padding-top: 140px;
	margin-bottom: 60px;
	padding-bottom: 0;
}

@media(min-width:768px){
.features1{
	margin-bottom: 200px;
    }}

@media(min-width:768px){
    .features1 {
       padding-top: 250px;; 
    }}
.stripe-model-1 .st1 {

    background: #fcd669;
    top: -59px;
    left: 0px;
    right: calc(50% + 125px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
    .stripe-model-1 .st1 {
       right: calc(50% + 385px); 
    }}

.stripe-model-1 .st2 {
	background: #6772e5;
	top: -18px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}
.stripe-model-1 .st3 {

    background: transparent;
    border: 2px solid #e6ebf1;
    top: -118px;
    left: 0px;
    right: calc(50% + 140px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
    .stripe-model-1 .st3 {
       right: calc(50% + 300px); 
    }}
.stripe-model-1 .st4 {
	background: #6772e5;
	bottom: 0px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}

.stripe-model-1 .st5 {
    display: none;
}
@media(min-width:768px){
.stripe-model-1 .st5 {

    background: transparent;
    border: 2px solid #e6ebf1;
    bottom: 60px;
    right: 0px;
    left: calc(50% + 420px);
    position: absolute;
    height: 60px;
    }}

.stripe-model-1 .st6 {
    background: transparent;
    border: 2px solid #e6ebf1;
    bottom: -60px;
    right: 0px;
    position: absolute;
    height: 60px;
    left: calc(50% + 160px);
}

@media(min-width:768px){
.stripe-model-1 .st6 {
    left: calc(50% + 240px);
    
    }}

.stripe-model-1 .st7 {

    background: #fcd669;
    bottom: -210px;
    left: 0px;
    right: calc(50% + 605px);
    position: absolute;
    height: 60px;
}
.stripe-model-1 .st8 {

    background: transparent;
    border: 2px solid #fcd669;
    bottom: -250px;
    left: 0px;
    right: calc(50% + 435px);
    position: absolute;
    height: 60px;
}

.features-tabs{
	display: none;
	margin-top: 10px;
	color: #6b7c93;
}
.features-tabs-list.active .features-tabs{
	display: block;
}
.features-tabs-list.active{
	border-radius: 5px;
	box-shadow: 0 0 10px 0 rgba(0,0,0,.1);
	background-color: #fff;
}
.features-tabs-title{
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
}
.features-tabs-list.active .features-tabs-title{
	font-weight: 700;
}

/********* botón caract ************/
 
 .btn-draw {
	 position: relative;
	 display: inline-block;
	 color: #2784f4;
	 border-bottom: 2px solid #2784f4;
	 cursor: pointer;
	 overflow: hidden;
	 transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
 .btn-draw:after {
	 content: '';
	 position: absolute;
	 right: 0;
	 bottom: 0;
	 height: 100%;
	 width: 2px;
	 background: #2784f4;
	 transform: translateY(100%);
	 transition: transform 0.2s ease-in-out;
	 transition-delay: 0.6s;
}
 .btn-draw > span {
	 position: relative;
	 display: block;
	 padding: 0.5em;
	 color: inherit;
}
 .btn-draw > span:before, .btn-draw > span:after {
	 content: '';
	 position: absolute;
	 left: 0;
	 top: 0;
	 background: #2784f4;
	 transition: transform 0.2s ease-in-out;
}
 .btn-draw > span:before {
	 height: 2px;
	 width: 100%;
	 transform: translateX(100%);
	 transition-delay: 0.4s;
}
 .btn-draw > span:after {
	 height: 100%;
	 width: 2px;
	 transform: translateY(-100%);
	 transition-delay: 0.2s;
}
 .btn-draw:hover:after, .btn-draw:hover > span:before, .btn-draw:hover > span:after {
	 transform: translate(0, 0);
}
 .btn-draw:hover:after {
	 transition-delay: 0s;
}
 .btn-draw:hover > span:before {
	 transition-delay: 0.2s;
}
 .btn-draw:hover > span:after {
	 transition-delay: 0.4s;
}
 .btn-draw:hover {
	 color: #e4e4e2;
	 background-color: #2784f4;
	 transition-delay: 0.6s;
}

/****************************************/
/************** Testimonials ************/
/****************************************/
.testimonials h3{
    padding: 0 20px;
    font-size: 3.14285714em;
    line-height: 1.31818182em;
    letter-spacing: -0.01em;
}
.testimonials{
    padding-top: 90px!important;
    padding-bottom: 150px!important;
}
.testimonials h3{
    margin-bottom: 30px;
    }
@media(min-width: 768px){
.testimonials h3{
    margin-bottom: 100px;
    }}
.testimonials1 img{
	position: absolute;
}
.testimonials1 .logo-customer{
    height: 30px;
    margin-left: 10px;
    margin-top: 10px;
}
    @media(min-width: 768px){
    .testimonials1 .logo-customer{
        height: 100px;
    }}
.testimonials1 .in-image{
	height: 350px;
	position: absolute;
	width: 100%;
    background: -moz-linear-gradient(-45deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%,rgba(0,0,0,0.5) 40%,rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    }
.testimonials1 .in-image h2{
	color: #fff;
	font-weight: 500;
	width: 50%;
	padding-left: 100px;
	padding-top: 100px;
	font-size: 43px;
	margin-bottom: 0;
	line-height: 45px;
	text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.9em black;
}
.testimonials1 .in-image p{
	color: #fff;
	font-weight: 400;
	width: 100%;
	padding-left: 23px;
	padding-top: 50px;
	font-size: 12px;
	line-height: 19px;
	text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.9em black;
}

@media(min-width:768px){
  .testimonials1 .in-image p{
	width: 90%;
	padding-top: 120px;
    padding-left: 80px;
    line-height: 31px;
    font-size: 22px;
}}
@media(min-width:1024px){
  .testimonials1 .in-image p{
	width: 50%;
	padding-top: 170px;
}}


.testimonials .col-sm-2{
    width: 14.2857143%;
    padding: 40px 25px 30px;
}
.testimonials .col-sm-2 img{
    height: 35px;
}

/****************************************/
/******* Testimonials  slider ***********/
/****************************************/
.testimonials1 .flickity-viewport{
	height: 90px !important;
	border-radius: 10px;
	box-shadow: 0 0 10px 0 rgba(0,0,0,.3);
    margin: 0 10px;
}
@media(min-width: 375px){
.testimonials1 .flickity-viewport{
	height: 105px !important;
    }}
@media(min-width: 414px){
.testimonials1 .flickity-viewport{
	height: 115px !important;
    }}
@media(min-width:768px){
.testimonials1 .flickity-viewport{
	height: 217px !important;
    }}
@media(min-width:1024px){
.testimonials1 .flickity-viewport{
	height: 280px !important;
    margin: 0;
    }}
@media(min-width:1200px){
.testimonials1 .flickity-viewport{
	height: 340px !important;
    }}

.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus { outline: none; }

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: 100%;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */

.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
          tap-highlight-color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- previous/next buttons ---- */

.flickity-prev-next-button {
  position: absolute;
  top: 50%;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: white;
  background: hsla(0, 0%, 100%, 0.75);
  cursor: pointer;
  /* vertically center */
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.flickity-prev-next-button:hover { background: white; }

.flickity-prev-next-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #09F;
}

.flickity-prev-next-button:active {
  opacity: 0.6;
}

.flickity-prev-next-button.previous { left: 10px; }
.flickity-prev-next-button.next { right: 10px; }
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px;
}

.flickity-prev-next-button:disabled {
  opacity: 0.3;
  cursor: auto;
}

.flickity-prev-next-button svg {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%;
}

.flickity-prev-next-button .arrow {
  fill: #333;
}

/* ---- page dots ---- */

.flickity-page-dots {
  position: absolute;
  width: 100%;
  bottom: -25px;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}

.flickity-rtl .flickity-page-dots { direction: rtl; }

.flickity-page-dots .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  background: #333;
  border-radius: 50%;
  opacity: 0.25;
  cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
  opacity: 1;
}

/****************************************/
/***** WOD TV HOME ******/
/****************************************/
.stripe-model-4 .st1 {
    background: #32325d;
    top: 296px;
    right: 0px;
    left: calc(50% + 125px);
    position: absolute;
    height: 50px;
}
@media(min-width:768px){
    .stripe-model-4 .st1 {
    top: 126px;
    left: calc(50% + 325px);
    height: 50px;
}}
@media(min-width:996px){
    .stripe-model-4 .st1 {
    top: 150px;
    left: calc(50% + 505px);
    height: 60px;
}}
.stripe-model-4 .st2 {

    background: #fff;
    border: 2px solid #87bbfd;
    top: 325px;
    right: 0px;
    left: calc(50% + 110px);
    position: absolute;
    height: 50px;
}
@media(min-width:768px){
    .stripe-model-4 .st2 {
    top: 165px;
    left: calc(50% + 340px);
    height: 50px;
    }}
@media(min-width:996px){
    .stripe-model-4 .st2 {
    top: 126px;
    left: calc(50% + 450px);
    height: 60px;
    }}
.stripe-model-4 .st3 {
    display: none;
    background: #6772e5;
    top: 110px;
    left: 0px;
    right: calc(50% + 410px);
    position: absolute;
    height: 60px;
}
.stripe-model-4 .st4 {
    background: #fff;
    border: 2px solid #87bbfd;
    top: 525px;
    left: 0px;
    right: calc(50% + 130px);
    position: absolute;
    height: 50px;
    z-index: 10;

}
@media(min-width:768px){
    .stripe-model-4 .st4 {
    top: 370px;
    right: 120px;
    left: calc(50% + 210px);
    height: 50px;
}}
@media(min-width:996px){
    .stripe-model-4 .st4 {
    top: 434px;
    right: 280px;
    left: calc(50% + 230px);
    height: 60px;
}}

.stripe-model-4 .st5 {
    display: none;
    background: #fff;
    top: 381px;
    right: 355px;
    left: calc(50% + 65px);
    position: absolute;
    height: 60px;
}
.stripe-model-4 .st6 {
    background: #e6ebf1;
    top: 368px;
    right: 405px;
    left: calc(50% + 65px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
    .stripe-model-4 .st6 {
    top: 348px;
    right: 185px;
    left: calc(50% + 85px);
    height: 50px;
}}
@media(min-width:996px){
    .stripe-model-4 .st6 {
    background: #e6ebf1;
    top: 368px;
    right: 405px;
    left: calc(50% + 65px);
    position: absolute;
    height: 60px;
}}

.stripe-model-4 .st7 {
	background: #e6ebf1;
	top: 590px;
	right: 0px;
	left: calc(50% + 505px);
	position: absolute;
    height: 60px;
}
.stripe-model-4 .st8 {

    background: #e6ebf1;;
    top: 1400px;
    left: 0px;
    right: calc(50% + 555px);
    position: absolute;
    height: 60px;
}
.stripe-model-4 .st9 {

    background: transparent;
    border: 2px solid #e6ebf1;
    top: 1430px;
    left: 0px;
    right: calc(50% + 605px);
    position: absolute;
    height: 60px;
}

.wod-features img{
    height: auto;
    
}
@media (min-width: 768px){
.wod-features img{
    
    position: absolute;
    right: -135px;
    margin-top: 190px;
    }}
@media (min-width: 996px){
.wod-features img{
    position: absolute;
    right: -135px;
    margin-top: 150px;
    }}

.wod-features h1{
    text-align: center;
}
@media (min-width: 768px){
.wod-features h1 {
    text-align: left;
    padding-left: 20px;
    }}

/****************************************/
/********** WOD TV SLIDER ***************/
/****************************************/

.notifications-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 40px auto 0;
}

.notifications {
    position: relative;
    height: 256px;
    /* -webkit-transform-origin: left center; */
    /* transform-origin: left center; */
    margin-bottom: 15px;
}
@media (min-width: 880px){
.notifications {
    /* -webkit-transform: scale(1.3) translateY(-40px); */
    /* transform: scale(1.3) translateY(-40px); */
    margin-bottom: 15px;
    }}
.notification {
    position: absolute;
    left: 0;
    right: 0;
    background-color: #6772e5!important;
    border-radius: 8px;
    -webkit-box-shadow: 0 15px 35px rgba(50,50,93,.1), 0 5px 15px rgba(0,0,0,.07);
    box-shadow: 0 15px 35px rgba(50,50,93,.1), 0 5px 15px rgba(0,0,0,.07);
    padding: 0.85em 1.1em;
    -webkit-transition: all .5s cubic-bezier(.645,.045,.355,1);
    transition: all .5s cubic-bezier(.645,.045,.355,1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    align-items: center;
    justify-content: flex-start;
    min-height: 73px;
    overflow: hidden;
    z-index: 10;
    font-size: 15px;
    line-height: normal;
    opacity: 1!important;
}
@media (min-width: 880px)
.notification {
    font-size: 17px;
}
.notification-indicator-wrapper {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin: 0 1em 0 0;
    overflow: hidden;
    position: relative;
    box-shadow: 0px 0px 5px 2px #eee;
    display: flex;
    align-items: center;
    justify-content: center;
}
.notification-indicator {
    display: block;
    -webkit-transition: all .5s cubic-bezier(.645,.045,.355,1);
    transition: all .5s cubic-bezier(.645,.045,.355,1);
    transform: scale(0.64);
    color: #04d674;
}
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.notification-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
}

.notification-supcaption {
    font-size: 60%;
}
.notification-message, .notification-caption {
    position: relative;
    display: inline-block;
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    -webkit-transition: all .5s cubic-bezier(.645,.045,.355,1);
    transition: all .5s cubic-bezier(.645,.045,.355,1);
    white-space: nowrap;
}

.notification-caption {
    color: #fff;
    font-size: 76%;
    margin: .2em 0 0;
}
.wod-features .notification .notification-close-cross {
   
    opacity: 0;
}

/*  PART ANTIGA DEL WOD TV


.wod-tv{
	padding-top: 190px;
	margin-bottom: 0px;
	padding-bottom: 0;
    height: 600px;
}
@media(min-width:768px){
.wod-tv{
	margin-bottom: 0px;
    }}

.wod-tv .coachboard-text{
    padding-top: 20px;
    position: relative;
    text-align: center;
}

    @media(min-width:1024px){
        .wod-tv .coachboard-text{
        padding-top: 20px;
        padding-left: 57%;
        text-align: left;
        }}

.wod-tv h5, .wod-tv p, .wod-tv h1, .wod-tv h2, .wod-tv h3, .wod-tv h4{
    color: #fff;
}
.wod-tv h1{
    font-weight: 400;
    margin-bottom: 0;
}
.wod-tv h5{
    display: inline-block;
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 600;
}
.wod-tv p{
    margin-top: 7px
}
    @media(min-width:768px){
       .wod-tv p{
        padding-left: 40px;
        margin-top: 0;
    }}

.wod-tv .text-block{
    margin-bottom: 20px;
}
.wod-tv .check-list{
    height: 20px;
    margin-bottom: 0;
    margin-right: 15px;
}

.bg-img{
    background-image: url(../img/wod-tv.jpg);
    background-size: cover;
    height: 750px;
    width: 100%;
    transform: skewY(7deg);
    top: -70px
}


*/


/****************************************/
/***** Principales caracteristicas ******/
/****************************************/

.inclined-bg-dark-blue {
	position: absolute;
  top: 0px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #161b22;
  transform: skewY(-8deg);
}
.webs{
	padding-top: 90px!important;
	margin-bottom: 60px;
	padding-bottom: 0;
}
.webs h4{

}

@media(min-width:768px){
.webs{
	margin-bottom: 60px;
    }}
.webs img{
    width: 100%;
    position: absolute;
    right: -130px;
    bottom: -50px;
}
@media(min-width:768px){
    .webs img{
    width: 63%;
}}


.webs .switchable__text{
    margin-top: 20px;
    padding: 0 30px;
    margin-bottom: 200px
}
@media(min-width:768px){
    .webs .switchable__text{
    margin-top: 80px;
    padding: 0 70px;
    margin-bottom: 100px;
}}

.webs h3, .webs h4{
    color: #fff;
}

/****************************************/
/********** BOXBOARD TABLET *************/
/****************************************/

.boxboard-tablet{
    margin-top: 0px;
}

.boxboard-tablet .b-icon{
    height: 30px;
    margin-bottom: 10px;
    margin-top: 0;
}
.boxboard-tablet p.subtitle-boxboard{
    font-size: 22px;
    line-height: 40px;
}
.boxboard-tablet p{
    font-size: 15px;
}


/****************************************/
/************** Testimonials ************/
/***************************************

.slider .flickity-viewport{
	height: 350px !important;
	border-radius: 10px;
	box-shadow: 0 0 10px 0 rgba(0,0,0,.3);
}

.testimonials1 img{
	position: absolute;
}
testimonials1 .logo-customer{
    height: 100px;
}
.testimonials1 .in-image{
	height: 350px;
	position: absolute;
	width: 100%;
    background: -moz-linear-gradient(-45deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); 
background: -webkit-linear-gradient(-45deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); 
background: linear-gradient(135deg, rgba(0,0,0,0.94) 0%,rgba(0,0,0,0.88) 26%,rgba(0,0,0,0.5) 40%,rgba(0,0,0,0.12) 70%,rgba(0,0,0,0) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0000000', endColorstr='#00000000',GradientType=1 );
}
.testimonials1 .in-image h2{
	color: #fff;
	font-weight: 500;
	width: 50%;
	padding-left: 100px;
	padding-top: 100px;
	font-size: 43px;
	margin-bottom: 0;
	line-height: 45px;
	text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.9em black;
}
.testimonials1 .in-image p{
	color: #fff;
	font-weight: 400;
	width: 50%;
	padding-left: 100px;
	padding-top: 30px;
	font-size: 22px;
	line-height: 31px;
	text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.9em black;
}


/****************************************/
/************** App features ************/
/****************************************/
.app-features{
    padding-top: 80px!important;
}
.app-features h4{
    font-size: 1.78571429em;
    line-height: 1.5em;
    margin-bottom: 1.04em;
}
.app-features img{
	height: 250px;
}
@media(min-width:768px){
    .app-features img{
	height: 320px;
    }}
@media(min-width:1024px){
    .app-features img{
	height: 400px;
    }}
.app-features img.tablet-landing{
	height: 190px;
    margin-bottom: 20px;
}
@media(min-width:768px){
    .app-features img.tablet-landing{
	height: 240px;
    margin-top: 120px
    }}
@media(min-width:1024px){
    .app-features img.tablet-landing{
	height: 310px;
    margin-top: 70px;
    }}
.app-features .switchable__text{
    text-align: center;
}
@media(min-width:768px){
    .app-features .switchable__text{
    text-align: left;
}}

.boxboard-tablet{
    padding: 80px 50px!important;
}

/************** BOTÓ 3D App features ************/
.app-features a {
	 position: relative;
	 display: inline-block;
	 padding: 1.2em 2em;
	 text-decoration: none;
	 text-align: center;
	 cursor: pointer;
	 user-select: none;
	 color: white;
}
 .app-features a::before {
	 content: '';
	 position: absolute;
	 top: 0;
	 left: 0;
	 bottom: 0;
	 right: 0;
	 background: linear-gradient(135deg, #6e8efb, #a777e3);
	 border-radius: 4px;
	 transition: box-shadow 0.5s ease, transform 0.2s ease;
	 will-change: transform;
	 box-shadow: 0 2px 5px rgba(0, 0, 0, .2);
	 transform: translateY(var(--ty, 0)) rotateX(var(--rx, 0)) rotateY(var(--ry, 0)) translateZ(var(--tz, -12px));
}
 .app-features a:hover::before {
	 box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
}
 .app-features a::after {
	 position: relative;
	 display: inline-block;
	 content: attr(data-title);
	 transition: transform 0.2s ease;
	 font-weight: bold;
	 letter-spacing: 0.01em;
	 will-change: transform;
	 transform: translateY(var(--ty, 0)) rotateX(var(--rx, 0)) rotateY(var(--ry, 0));
}






















.inclined-bg {
	position: absolute;
  top: 150px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: skewY(-8deg);
}
.stripe-model-3 .st1 {

	background: #32325d;
	top: -250px;
	right: 0px;
	left: calc(50% + 155px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-3 .st1 {
	left: calc(50% + 635px);
    }}

.stripe-model-3 .st2 {
	background: #e6ebf1;
	top: -266px;
	right: 0px;
	left: calc(50% + 125px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-3 .st2 {
	top: -186px;
	left: calc(50% + 455px);
    }}

.stripe-model-3 .st3 {

   background: transparent;
    border: 2px solid #e6ebf1;
    top: -240px;
    left: 0px;
    right: calc(50% + 115px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
.stripe-model-3 .st3 {
display: none;
    }}


/****************************************/
/***** CTA ******/
/****************************************/
.bottom-cta-email {
  display: none;
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 150px;
  color: #fff;
  background: #4776e6; /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #4776e6, #8e54e9); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #4776e6, #8e54e9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  z-index: 999;
}
.bottom-cta-email h2, .bottom-cta-email h4{
    color: #fff;
    
}
.bottom-cta-email h2{
    font-size: 1.6em;
    margin-top: 15px;
    font-weight: 600;
}
.bottom-cta-email h4{
    font-size: 1.2em;
    font-weight: 400;
}




/****************************************/
/***** Precios ******/
/****************************************/

.stripe-model-2 .st1 {

    background: #e6ebf1;
    top: -59px;
    left: 0px;
    right: calc(50% + 385px);
    position: absolute;
    height: 60px;
}

.stripe-model-2 .st2 {
	background: #e6ebf1;
	top: -18px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}
.stripe-model-2 .st3 {

    background: transparent;
    border: 2px solid #e6ebf1;
    top: -118px;
    left: 0px;
    right: calc(50% + 300px);
    position: absolute;
    height: 60px;
}
.stripe-model-2 .st4 {
	background: #32325d;;
	bottom: 0px;
	right: 0px;
	left: calc(50% + 505px);
	position: absolute;
    height: 60px;
}
.stripe-model-2 .st5 {

    background: transparent;
    border: 2px solid #6772e5;
    bottom: 60px;
    left: 0px;
    right: calc(50% + 230px);
    position: absolute;
    height: 60px;
}
.stripe-model-2 .st6 {

    background: transparent;
    border: 2px solid #87bbfd;
    bottom: -60px;
    left: 0px;
    right: calc(50% + 550px);
    position: absolute;
    height: 60px;
}
.stripe-model-2 .st7 {

    background: #e6ebf1;;
    bottom: 0px;
    left: 0px;
    right: calc(50% + 395px);
    position: absolute;
    height: 60px;
}

.boxed-in-box{
    margin: 1.85714286em -1.85714286em;
    padding: 1.85714286em;
    }
.tick-price{
    margin-right: 10px;
    top: -3px;
    position: relative;
}
.price-list-func p{
    margin-bottom: .8em;
}

.promo-by-units{
    background: #f2f0f0;
    padding: 8px;
    border-radius: 5px;
    border: 1px solid #cecece;
}
.price-calculator-container{
    background: rgba(49,63,140,1);
    background: -moz-linear-gradient(left, rgba(49,63,140,1) 0%, rgba(35,42,88,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(49,63,140,1)), color-stop(100%, rgba(35,42,88,1)));
    background: -webkit-linear-gradient(left, rgba(49,63,140,1) 0%, rgba(35,42,88,1) 100%);
    background: -o-linear-gradient(left, rgba(49,63,140,1) 0%, rgba(35,42,88,1) 100%);
    background: -ms-linear-gradient(left, rgba(49,63,140,1) 0%, rgba(35,42,88,1) 100%);
    background: linear-gradient(to right, rgba(49,63,140,1) 0%, rgba(35,42,88,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#313f8c', endColorstr='#232a58', GradientType=1 );
    border-radius: 6px;
}

.slider-range {
  -webkit-appearance: none;
  width: 100%;
  height: 5px;
  border-radius: 0!important;
  background: #5268ef !important;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
    border: none!important;
    padding: 0!important;
    opacity: 1;
    
}

.slider-range:hover {
  opacity: 1;
}

.slider-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 10px;
  height: 10px;
  border-radius: 0;
  background: #6f83fc;
  cursor: pointer;
    border: none;
}

.slider-range::-moz-range-thumb {
  width: 10px;
  height: 10px;
  border-radius: 0;
  background: #6f83fc;
  cursor: pointer;
    border: none;
}
.discount {
  position: absolute;
  padding: 8px;
  color: rgb(254, 254, 254);
  background-color: rgb(255, 202, 0);
  width: 100%;
  transform: rotate(35deg) translate(40px, -20px);
  top: 20px;
  right: -100px;
  text-align: center;
    font-weight: 700;
}
.pricing h5{
    color: #5268ef !important;
}
.pricing__dollar{
    color: #5268ef !important;
}
.pricing__dollar.h1{
    font-weight: 600;
}
.old-price{
    color: red;
    font-size: 18px;
    bottom: 30px;
    position: relative;
    padding: 0 3px;
    text-decoration: line-through;
    
}
.old-price-through{
    color: red;
    text-decoration: line-through;
    font-size: 17px;
}
.pricing.boxed.boxed--lg{
    padding: 4.5em;
    box-shadow: 0px 0px 30px 0px rgba(16,86,229,.2);
}
.save-money{
    background-color: #4dc036;
    color: #fff;
    border-radius: 20px;
    padding: 0 10px;
    font-size: 0.9em;
    display: inline-block;
    margin-bottom: 10px;
}
/*
.pricing .h1{
    margin-top: 0.42033898305085em;
}
*/
.pricing .limit-price{
    margin-bottom: 1.57142857em!important;
}
.result-calculate-price{
    display: inline-block;
    font-weight: 600;
    color: #242c5d;
    margin: 2px 4px 17px;
}
.result-calculate-price p{
    padding: 10px 0;
    font-weight: 400;
}
.limit-price{
    padding: 4px;
    margin-bottom: 0;
}
.range-slider-price{
    padding: 30px 0;
}
/***********************************************************************************/
/********************************* Log IN ******************************************/
/***********************************************************************************/
.container-login{
    border-radius: 7px;
	background-color: rgb(255,255,255, .8);
    padding: 30px 30px;
}

@media (min-width: 768px){ 
    .container-login{
	padding: 30px 70px;
}}

.container-login h2, .container-login p, .container-login span, .container-login a {
	color: rgb(0,0,0, .75)!important;
}
.container-login p{
	
}
.container-login p {
	font-size: 16px;
}
.container-login .logo {
	height: 75px;
}
.img-login{
    background-image: url("/bundles/public/img/price.jpg?1.6");
    background-color: rgba(0, 0, 0, 0);
    background-position: initial;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: auto auto;
    background-origin: padding-box;
    background-clip: border-box;
    opacity: 1;
}
.img-login-booking{
    background-image: url("/bundles/public/img/bookings.jpg?1.6");
    background-color: rgba(0, 0, 0, 0);
    background-position: initial;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: auto auto;
    background-origin: padding-box;
    background-clip: border-box;
    opacity: 1;
}
.booking-login{
    padding: 0;
    border-radius: 7px;
    margin-top: 20px!important;
    background-color: #6772e5;
    color: #fff;
    border: none;
}
.booking-login .btn{
    border: none;
}
.error-login{
    margin: 3px 0;
    color: red;
}


/***********************************************************************************/
/***************************** Caracteristicas *************************************/
/***********************************************************************************/

.full-characteristics-admin h3{
    margin-bottom: 50px;
    font-size: 3.14285714em;
    line-height: 1.31818182em;
    font-weight: 400;
    color: #4a4a4a;
}

.caract-title{
    margin-bottom: 0;
}
@media(min-width:768px){
    .caract-title{
    margin-bottom: 60px;
}}

.caract-title p{
    padding: 0 15px;
}
    @media(min-width:768px){
        .caract-title p{
        padding: 0 140px;
    }}
    @media(min-width:1024px){
        .caract-title p{
        padding: 0 250px;
    }}
.caract-subtitle img{
    width: 55px;
}
.caract-subtitle h2{
    color: #333;
    text-transform: uppercase;
}
.first-block-caract{
    padding-bottom: 40px !important;
}

.second-block-caract{
    margin-top: 50px !important;
    margin-bottom: 40px;
}
@media(min-width:768px){
    .second-block-caract{
    margin-top: 50px !important;
    padding-bottom: 2.4em;
    margin-bottom: 0px;
}}
.second-block-caract img{
    height: 80px;
}


.first-block-caract .tabs li:not(.active) {
    opacity: 1;
}
.first-block-caract, .second-block-caract, .third-block-caract{
    overflow: hidden;
}

.first-block-caract section:last-child, .second-block-caract section:last-child{
    padding-bottom: 0px;
}

@media(min-width:768px){
    .firts-block-caract section, .second-block-caract section{
    padding-bottom: 7.42857143em;
}}


/***************************** Caracteristicas Bloque 3 *************************************/


.third-block-caract{
    padding-top: 70px !important;
    padding-bottom: 0!important;
}
@media(min-width:768px){
    .third-block-caract{
    padding-top: 80px !important;
}}
.third-block-caract h5{
    color: #32325d;
}

/***************************** Caracteristicas Bloque 4 *************************************/
.four-block-caract{
    padding-top: 170px !important;
    padding-bottom: 0!important;
}
@media(min-width:768px){
    .four-block-caract{
    padding-top: 280px !important;
}}
.justify-content-between {
  justify-content: space-between !important; }
.four-block-caract .row{
    display: flex;
    flex-wrap: wrap;
}
.especial-parraf1{
    margin-bottom: 0.2em;
    text-align: left;
    color: #4a90e2;
}
.four-block-caract .short{
    margin-top: 0em;
}

/***************************** Caracteristicas Bloque 5 *************************************/
.fiveth-block-caract{
    background-color: #f6f9fc;
    padding-top: 100px!important;
}


.process__item__img__right{
    display: block;
    position: relative;
    right: 0px;
    text-align: center;
}
    @media(min-width:768px){
        .process__item__img__right{
            display: flex;
            position: absolute;
            right: -220px;
        }}

/***************************** Caracteristicas Bloque 6 *************************************/
.sixth-block-caract{
    background-color: #f6f9fc;
    padding-top: 30px!important;
}
.sixth-block-caract .feature-6 img{
    height: 50px;
}
.sixth-block-caract .feature-6 h5{
    display: inline-block;
    color: #eea826;
}

    
.process__item__img__left{
    display: block;
    position: relative;
    left: 0px;
    text-align: center;
}
    @media(min-width:768px){
        .process__item__img__left{
            display: flex;
            position: absolute;
            left: -220px;
        }}

.process__item__img__right img, .process__item__img__left img{
    width: 345px;
    height: 100%;
    margin-top: 20px;
}
@media(min-width:768px){
    .process__item__img__right img, .process__item__img__left img{
    width: 608px;
    height: 100%;
    margin-top: 150px;
}}
@media(min-width:1024px){
    .process__item__img__right img, .process__item__img__left img{
    width: 708px;
    height: 100%;
    margin-top: 150px;
}}
@media(min-width:1150px){
    .process__item__img__right img, .process__item__img__left img{
    width: 808px;
    height: 100%;
}}




/****************************************/
/************* Stripes block 2 **********/
/****************************************/
.stripe-model-5 .st1 {

    background: #e6ebf1;
    top: -59px;
    left: 0px;
    right: calc(50% + 385px);
    position: absolute;
    height: 60px;
}

.stripe-model-5 .st2 {
	background: #fcd669;
	top: -18px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}

.stripe-model-5 .st3 {

    background: transparent;
    border: 2px solid #ffbc41;
    top: 160px;
    left: 0px;
    right: calc(50% + 160px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-5 .st3 {
    right: calc(50% + 560px);
    }}

.stripe-model-5 .st4 {
	background: #ffbc41;
	top: 50px;
	right: 0px;
	left: calc(50% + 505px);
	position: absolute;
    height: 60px;
}


.stripe-model-5 .st5 {
    background: transparent;
    border: 2px solid #ffe088;
	top: 90px;
	right: 0px;
	left: calc(50% + 405px);
	position: absolute;
    height: 60px;
    }
.stripe-model-5 .st6 {
   background: #fcd669;
    top: 120px;
    left: 0px;
    right: calc(50% + 170px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-5 .st6 {
    right: calc(50% + 605px);
    }}
/****************************************/
/************* Stripes block 3 **********/
/****************************************/
.stripe-model-6 .st1 {

    background: #008169;
    top: 91px;
    left: 0px;
    right: calc(50% + 385px);
    position: absolute;
    height: 60px;
}

.stripe-model-6 .st2 {
	background: #d6facf;
	top: 299px;
	right: 0px;
	left: calc(50% + 425px);
	position: absolute;
    height: 60px;
}

.stripe-model-6 .st3 {

    background: transparent;
    border: 2px solid #74e4a2;
    top: 310px;
    left: 0px;
    right: calc(50% + 120px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-6 .st3 {
    right: calc(50% + 560px);
    }}

.stripe-model-6 .st4 {
	background: #74e4a2;
	top: 130px;
	right: 0px;
	left: calc(50% + 165px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-6 .st4 {
	top: 200px;
	left: calc(50% + 505px);
    }}

.stripe-model-6 .st5 {
    background: transparent;
    border: 2px solid #008169;
	top: 90px;
	right: 0px;
	left: calc(50% + 125px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-6 .st5 {
	top: 240px;
	left: calc(50% + 325px);
    }}

.stripe-model-6 .st6 {
    background: #e6ebf1;;
    top: 270px;
    left: 0px;
    right: calc(50% + 145px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-6 .st6 {
    right: calc(50% + 605px);
    }}



/***********************************************************************************/
/*********************************** Prices ****************************************/
/***********************************************************************************/
.price-cards{
    padding-bottom: 40px;
    padding-top: 50px;
}
.caract-pricing{
    background-color: transparent!important;
    overflow: inherit;
}
.caract-pricing h3{
    padding-bottom: 15px;
}
.pricing.caract-pricing:hover{
    box-shadow: none;
}
.caract-pricing a{
    color: inherit;
    font-weight: 400;
    margin-bottom: 0.46428571em;
}
.caract-pricing a:hover{
    text-decoration: none;
    color: #4a90e2;
    font-weight: 600;
}
.caract-pricing a li{
    margin-bottom: 0.46428571em;
}
.caract-pricing a img{
    width: 15px;
    position: relative;
    bottom: 6px;
    margin-left: 7px;
}

.limit-price:hover{
    font-weight: 600;
}
.icon-booking-1{

    margin-left: 10px;
    top: -3px;
    position: relative;
}
.contact-modul1 h4{
    padding: 14px 0;
}
.img-expert{
    position: absolute;
    bottom: 0px;
    z-index: -22;
}
.iva_text{
    right: 15px;
    bottom: 60px;
    position: absolute;
    font-size: 11px;
}
/****************************************/
/************* Stripes prices **********/
/****************************************/
.stripe-model-7 .st1 {
	background: #008169;
	top: 0px;
	right: 0px;
	left: calc(50% + 505px);
	position: absolute;
    height: 60px;
}
.stripe-model-7 .st2 {

    background: transparent;
    border: 2px solid #87bbfd;
    top: 0px;
    left: 0px;
    right: calc(50% + 480px);
    position: absolute;
    height: 60px;
}
.stripe-model-7 .st3 {
    background: #6772e5;
    top: 120px;
    left: 0px;
    right: calc(50% + 410px);
    position: absolute;
    height: 60px;
}
.stripe-model-7 .st4 {

    background: #87bbfd;
    top: 120px;
    left: 0px;
    right: calc(50% + 590px);
    position: absolute;
    height: 60px;
}
.stripe-model-7 .st5 {

    background: #e6ebf1;;
    top: 60px;
    left: 0px;
    right: calc(50% + 565px);
    position: absolute;
    height: 60px;
}
.stripe-model-7 .st6 {
    background: #74e4a2;
	top: 60px;
	right: 0px;
	left: calc(50% + 435px);
	position: absolute;
    height: 60px;
}
.stripe-model-7 .st7 {
	background: #d6facf;
	top: 120px;
	right: 0px;
	left: calc(50% + 435px);
	position: absolute;
    height: 60px;
}
.stripe-model-7 .st8 {

    background: #e6ebf1;;
    top: 1400px;
    left: 0px;
    right: calc(50% + 555px);
    position: absolute;
    height: 60px;
}
.stripe-model-7 .st9 {

    background: transparent;
    border: 2px solid #e6ebf1;
    top: 1430px;
    left: 0px;
    right: calc(50% + 605px);
    position: absolute;
    height: 60px;
}
.stripe-model-8 .st1 {
	background: #5c5c88;
	top: -60px;
	right: 0px;
	left: calc(50% + 505px);
	position: absolute;
    height: 60px;
}
.stripe-model-8 .st2 {

    background: transparent;
    border: 2px solid #c4c4db;
    top: -170px;
    left: 0px;
    right: calc(50% + 480px);
    position: absolute;
    height: 60px;
}
.stripe-model-8 .st3 {
    background: #a7a7bb;
    top: -130px;
    left: 0px;
    right: calc(50% + 420px);
    position: absolute;
    height: 60px;
    opacity: .6;
}
/****************************************/
/************ Frequently asked **********/
/****************************************/

.f-asked {
    padding: 0 100px;
}

/****************************************/
/************ Beneficios **********/
/****************************************/

.benefits h2{
    margin-bottom: 50px;
}

.benefits h5{
    text-transform: uppercase;
}
.benefits span{
    padding: 0 10px;
}
svg {
  width: 100%;
    -webkit-filter: drop-shadow(0px 17px 9px rgba(0,0,0,0.1));      
    filter: drop-shadow(0px 17px 9px rgba(0,0,0,0.1));
}
.benefits .boxed{
    background-color: #fafafa;
}
@media(min-width:768px){
.benefits .boxed{
    height: 267px;
    }}
.benefits img{
    height: 45px;
    float: left;
    margin: 0;
    margin-bottom: 5px;
}
.benefits h4{
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.4em;
    margin-top: 10px;
}

.stripe-model-9 .st1 {

    background: #008169;
    top: -150px;
    left: 0px;
    right: calc(50% + 385px);
    position: absolute;
    height: 60px;
}

.stripe-model-9 .st2 {
	background: #d6facf;
	top: 870px;
	right: 0px;
	left: calc(50% + 425px);
	position: absolute;
    height: 60px;
}

.stripe-model-9 .st3 {

    background: transparent;
    border: 2px solid #74e4a2;
    top: 310px;
    left: 0px;
    right: calc(50% + 120px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-9 .st3 {
    right: calc(50% + 560px);
    }}

.stripe-model-9 .st4 {
	background: #74e4a2;
	top: 780px;
	right: 0px;
	left: calc(50% + 165px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-9 .st4 {
	top: 780px;
	left: calc(50% + 505px);
    }}

.stripe-model-9 .st5 {
    background: transparent;
    border: 2px solid #008169;
	top: 840px;
	right: 0px;
	left: calc(50% + 125px);
	position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-9 .st5 {
	top: 840px;
	left: calc(50% + 325px);
    }}

.stripe-model-9 .st6 {
    background: #e6ebf1;;
    top: -90px;
    left: 0px;
    right: calc(50% + 145px);
    position: absolute;
    height: 60px;
    }

@media(min-width:768px){
.stripe-model-9 .st6 {
    right: calc(50% + 605px);
    }}





/****************************************/
/************ How Start STEPS **********/
/****************************************/


@media (min-width: 1200px){
.how-start-steps .container {
    width: 1000px;
        }}

section.step1{
    padding-top: 40px;
    }
@media (min-width: 768px){
section.step1{
    padding-top: 80px;
    }}
@media (min-width: 992px){
section.step1{
    padding-top: 130px;
    }}
.how-start-steps h2{
    color: #616771;
    opacity: .2;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 25px;
}
.how-start-steps h4{
    text-transform: uppercase;
    font-weight: 600;
    opacity: .9;
    font-size: 1.7em;
}
.how-start-steps p{
    font-size: 1.1em;
}
.step2 h2{
    margin-top: 30px
}
.how-start-steps img{
    width: 80%;
}
@media (min-width: 768px){
.how-start-steps img {
    width: 100%;
        }}

@media (min-width: 768px){
.how-start-steps.step2 img{
    width: 85%;
    padding-left: 50px;
    margin-top: 60px;
    }}
@media (min-width: 992px){
.how-start-steps.step2 img{
    margin-top: 0;
    }}
@media (min-width: 768px){
.step3 img{
    margin-top: 0px;
    }}
@media (min-width: 992px){
.step3 img{
    margin-top: -50px;
    }}
.contact-modul1 .secondary{
    background-color: rgb(167,167,187, 0.6);
    border: none;
}
.contact-modul1 .destacado{
    background-color: rgb(167,167,187, 0.8);
    margin: 0 30px;
    border: none;
}
.contact-modul1 .secondary:hover{
    background-color: rgb(167,167,187, 0.4);
}
.contact-modul1 .destacado:hover{
    background-color: rgb(167,167,187, 0.4);
}
.how-start-steps .text-block{
    text-align: center;
}
@media (min-width: 768px){
.how-start-steps .text-block{
    text-align: center;
    }}

/****************************************/
/************** footer ******************/
/****************************************/

.legal-text p{
    font-size: 11px;
    line-height: 21px;
}
.icons-media img{
    height: 25px;
}
footer .container {

    padding-top: 35px;
    padding-bottom: 25px;

}
.social-media .btn{
    padding-bottom: 0;
    padding-top: 0; 
}
.social-media .btn .btn__text{
    color: rgb(102,102,102);
}
@media(max-width:767px){
    .social-media .btn{
        margin-bottom: 0;
}}
footer {
  color: #b8b8bc;
  background-color: #eff2f7;
  line-height: 30px;
  font-size: 15px;
  border-top: 2px solid rgba(207, 215, 223, 0.5); }

  footer ul {
    padding-left: 0;
    list-style: none; }
  footer a {
    color: inherit;
    text-decoration: none;
    transition: color .1s; }
  footer .title {
    color: #8d8b8f;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .025em;
    margin: 0 0 5px; }
  footer .social-media {
    margin-top: 20px; }
    footer .social-media a {
      margin-right: 5px; }
  footer .icon {
    display: inline-block;
    width: 45px; }
    @media (min-width: 992px) {
      footer .icon {
        width: 40px; } }
    @media (min-width: 1200px) {
      footer .icon {
        width: 55px; } }

/*Cookie Consent Begin*/
#cookieConsent {
    margin: 0 86px 0 10px;
    background-color: rgba(246,249,252,.9);
    box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
    border-radius: 4px;
    min-height: 26px;
    font-size: 14px;
    color: #424770;
    line-height: 26px;
    padding: 8px 0 8px 30px;
    font-family: "Trebuchet MS",Helvetica,sans-serif;
    position: fixed;
    bottom: 13px;
    left: 0;
    right: 0;
    display: none;
    z-index: 9999;
}

@media(min-width:768px){
   #cookieConsent {
    margin: 0 90px;
}}
@media(min-width:1024px){
   #cookieConsent {
    margin: 0 200px;
}}
@media(min-width:1210px){
   #cookieConsent {
    margin: 0 310px;
}}
#cookieConsent a {
    color: #4B8EE7;
    text-decoration: none;
}
#closeCookieConsent {
    float: right;
    display: inline-block;
    cursor: pointer;
    height: 25px;
    width: 25px;
    margin: -2px 19px 0 40px;
    font-weight: bold;
    font-size: 30px;
}
#closeCookieConsent:hover {
    font-size: 32px;
}
#cookieConsent a.cookieConsentOK {
    background-color: #F1D600;
    color: #000;
    display: inline-block;
    border-radius: 5px;
    padding: 0 20px;
    cursor: pointer;
    float: right;
    margin: 0 60px 0 10px;
}
#cookieConsent a.cookieConsentOK:hover {
    background-color: #E0C91F;
}
/*Cookie Consent End*/

/****************************************/
/************** Academy *****************/
/****************************************/

.main_part{
    border-bottom: 1px solid #eeeeee;
    border-top: 1px solid #eeeeee;
    background-color: #fbfbfd;
    padding: 90px 0 40px;
}

.main_title{
    margin: 0 0 40px;
    text-align: center;
}
.main_title h1{
    color: #444444;
    font-weight: 300;
    font-size: 25px;
}

        @media(min-width:768px){
            .main_title h1{
                font-size: 32px;
            }}

.items_academy{
    margin:15px auto 15px;
}
.icon_academy{
    width: 50px;
    margin-bottom: 15px;
}
        @media(min-width:768px){
            .icon_academy{
                width: 60px;}
            .icon_academy:hover{
                width: 62px;
            }}

.circle_item_academy{
    height: 170px;
    width: 170px;
    margin: 0px auto;
    padding: 10px;
    padding-top:20px;
}
.circle_item_academy:hover{
    box-shadow: 0 15px 35px rgba(50,50,93,.1),0 5px 15px rgba(0,0,0,.07);
    border-radius: 50%;
}



.items_academy h3{
    color: #444444;
    font-weight: 400;
    font-size: 15px;
}
        @media(min-width:768px){
            .items_academy h3{
                font-size: 20px;
            }}
.smllimg{
    display: none;
}
            @media(min-width:768px){
                    .smllimg{
                        display: inherit;
                        width: 30px;
                        float: left;
                        position: absolute;
                        top: 82px;
                        left: 41px;
                        }}

.answer{
    margin: 40px 0px;
    padding: 25px 45px 25px 45px;
    position: relative;
}
            @media(min-width:768px){
            .answer{
                margin: 20px 0px;
                padding: 25px 45px 25px 107px;
            }}

.answer h2{
    font-size: 17px;
}
            @media(min-width:768px){
                .answer h2{
                    font-size: 22px;
                }}
.answer p{
    font-size: 14px;
    margin-bottom: 3px;
}
                @media(min-width:768px){
                    .answer p{
                        font-size: 15px;
                    }}

.answer a{
    font-size: 14px;
    color: #0facf3;
}
                    @media(min-width:768px){
                            .answer a{
                                font-size: 15px;
                        }}
.answer a:hover{
    color: #32325d;
    text-decoration: none;
}
.end_academy{
    width: 100%;
    padding-bottom: 20px;
}
        @media(min-width:768px){
            .end_academy{
                width: 50%;
            }}
.mainlogo{
    display: block;
    width: 350px;
    margin: 0 auto;
}

.link_to_home{
    text-align: center;
    display: block;
    margin-bottom: 35px;
}

.updates_buton{
    border: 2px solid #1888d6;
    border-radius: 6px;
    padding: 8px 0;
    color: #1888d6!important;
    margin: 0 60px;
    background-color: rgba(246,249,252,.9);
}
.updates_buton:hover{
    font-weight: 600;
}
.items_academy a:hover{
    text-decoration: none;
}
.items_academy a h3:hover{
    color: #1888d6;
}


/**************************** FI ACADEMY ***************************************/


/****************************************/
/************** Contacto ****************/
/****************************************/
.contact[type="text"]{
  background: #fafbfc;
  color: #8da2b5;
  border: 1px solid #dde5ed;
  font-size: 16px;
  padding: 16px 15px 14px;
  margin: 0;
  outline: none;
  height: 52px;
  box-shadow: none;
}

.contact[type="email"]{
  background: #fafbfc;
  color: #8da2b5;
  border: 1px solid #dde5ed;
  font-size: 16px;
  padding: 16px 15px 14px;
  margin: 0;
  outline: none;
  height: 52px;
  box-shadow: none;
}
.contact {
  border-top: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
  background-color: #fbfbfd;
  padding: 50px 0; }
  .contact-container {
    max-width: 768px;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto; }
  .contact-title {
    color: #7a7a7a;
    margin-bottom: 50px;
    margin-top: 0; }
  .contact .form-group {
    margin-bottom: 30px; }
  .contact .submit {
    color: #FFF;
    background: #7795f8;
    float: right; }
  .contact-textarea.form-control {
    height: 120px;
    max-width: 100%; }

.zsiq_theme1.zsiq_floatmain{
    height: 60px!important;
}

/****************************************/
/***** Taula preus comparativa **********/
/****************************************/
@media(min-width:768px){
.most-pop{
    margin-top: -20px;
    z-index: 10;
    }}
.pricing-3 .pricing__head.cract-box{
    height: 290px;
    border: none!important;
    background: transparent;
}
li.header-block{
    background-color: #6772e5!important;
    color: #fff;
    font-weight: 700;
    
}
.pricing__head.bg--primary {
    background: #848de9;
}
.pricing-3 .pricing__head {
    border: 1px solid #ececec!important;
}
.pricing-3, .pricing-section-2 .pricing{
    border: none!important;
}
.pricing-3 ul li{
    border: 1px solid #ececec;
    border-top: none;
    min-height: 52px;
}
.pricing-3 button{
    height: inherit;
}
.pricing-3.most-popular ul li{
    border: 1px solid rgba(132,141,233,1);
    border-top: none;
    min-height: 52px;
}
.b-right-no li{
    border-right: none!important;
}
@media(min-width:768px){
.most-popular .pricing__head{
    overflow: visible;
}}

.most-popular-img{
    visibility: hidden;
    height: 65px;
    position: absolute;
    top: -55px;
    left: 83px;
}
@media(min-width:768px){
.most-popular-img{
    visibility: visible;
    height: 65px;
    position: absolute;
    top: -55px;
    left: 83px;
    }}
.most-popular li{
    background: rgba(132,141,233,0.7);
    color: #fff;
}
.btn.purple-btn {
    background: #85c525;
    padding: 7px 13px;
    font-size: 13px;
    border: none;
    box-shadow: 0 0 0 1px rgba(50,50,93,.1), 0 2px 5px 0 rgba(50,50,93,.08), 0 1px 1.5px 0 rgba(0,0,0,.07), 0 1px 2px 0 rgba(0,0,0,.08);
}
.btn.purple-btn span {
    color: #fff!important;
}

.btn.wh-btn {
    background: #FFFFFF;
    color: #525f7f!important;
    border: 0;
    padding: 7px 13px;
    box-shadow: 0 0 0 1px rgba(50,50,93,.1), 0 2px 5px 0 rgba(50,50,93,.08), 0 1px 1.5px 0 rgba(0,0,0,.07), 0 1px 2px 0 rgba(0,0,0,.08);
    font-size: 13px;
}
.btn.wh-btn:hover {
    background: #f8fbfd;
    color: #525f7f;
}
.demo-link{
    border: none;
    color: #6772e5;
    border-bottom: 1px solid #6772e5;
}
.pricing-free span.h1{
    min-width: 55px;
}
.inside-borders-tb{
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    padding: 20px 0;
}
.switch-software.features-promo-app-part4 {
    margin: 0 0 90px 0;
    padding-bottom: 0px
    
}
@media(min-width:768px){
.switch-software.features-promo-app-part4{
        padding-bottom: 0em;
    }}
.switch-software.features-promo-app-part4 .main-title {
    margin-bottom: 50px;
}
.switch-software h3{
    font-size: 2.5em;
    margin-bottom: .6em;
}
.img-switch-soft{
    height: auto;
    padding-top: 50px;
}
.icon-common-features{
    height: 100px;
    margin-bottom: 10px;
}
.demo-link-cta{
    border: none;
    color: #fff;
    border-bottom: 1px solid #fff;
    height: 1.5em;
}

/****************************************/
/************** Sign Up *****************/
/****************************************/

.sign-up-form .form-group{
    padding-top: 0px;
    margin-bottom: 5px;
}
.sign-up-form .form-group label {
    position: relative;
    top: 0px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    transition: all .5s;
}
.sign-up-form .form-group.active label {
    font-size: 15px;
    top: 30px;
}
.sign-up-form .checkbox input{
    height: 20px;
    width: 20px;
    margin-right: 10px;
    left: 23px;
}
.sign-up-form .checkbox{
    float: left;
    margin-right: 3px;
    margin-top: 0px;
}
.sign-up-form .checkbox label{
    text-indent: 15px;
}
.signup-back.background-image-holder img{
    max-width: none!important;
    height: 100%;
}
@media (max-width: 767px){
section.img-cta {
    padding: 1.57142857em 0;
    }}

.checkbox input:checked {
    border-color: #4a90e2;
    background: #4a90e2;
}
.checkbox input:checked:after {
    content: 'L';
    transform: rotateY(180deg) rotateZ(-45deg);
    color: #fff;
    position: absolute;
    width: 100%;
    left: -3px;
    top: -2px;
    font-weight: 700;
}


/****************************************/
/************* APP PROMO ****************/
/****************************************/


/****************************************/
/************ Promo app Part 1 *****************/
/****************************************/

.videobg-promo-app video {
    object-fit: contain;
    height: 100%;
    min-width: 100%;
    position: absolute;
    top: 0;
    z-index: 0 !important;
    left: 0;
}

.videobg-promo-app {
    background: #fff;
    margin-top: 60px
}
@media(min-width:768px){
.videobg-promo-app{
    margin-top: 90px;
    
}}
.videobg-promo-app iframe{
    height: 200px;
    
}
/*
@media(min-width:1024px){
.videobg.video-app-promo{
    margin-top: 90px;
    height: 55vh;
}}
*/
.videobg-promo-app h1{
    color: #32325d !important;
    font-weight: 400;
}
.videobg-promo-app h3{
    color: #424770 !important;
    width: 65%;
    margin: auto;
}
.videobg-promo-app a{
    margin-top: 25px;
    margin-bottom: 40px;
    background: #32325d;
    color: #fff;
    font-weight: 400;
    border: none;
}

/****************************************/
/************ Promo app Part 2 *****************/
/****************************************/



.app-promo-part1 p{
    font-size: 19px;
}
.app-promo-part1 img{
    height: 70px;
}

.stripe-model-10 .st1 {

    background: #fcd669;
    top: -59px;
    left: 0px;
    right: calc(50% + 125px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
    .stripe-model-10 .st1 {
       right: calc(50% + 385px); 
    }}

.stripe-model-10 .st2 {
	background: #6772e5;
	top: -18px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}
.stripe-model-10 .st3 {

    background: transparent;
    border: 2px solid #e6ebf1;
    top: -118px;
    left: 0px;
    right: calc(50% + 140px);
    position: absolute;
    height: 60px;
}
@media(min-width:768px){
    .stripe-model-10 .st3 {
       right: calc(50% + 300px); 
    }}
.stripe-model-10 .st4 {
	background: #f6f9fc;
	bottom: 0px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}

.stripe-model-10 .st5 {
    
}
@media(min-width:768px){
.stripe-model-10 .st5 {

    background: #32325d;
    top: -440px;
    right: 0px;
    left: calc(50% + 460px);
    position: absolute;
    height: 60px;
    }}

.stripe-model-10 .st6 {
    background: #f6f9fc;
    bottom: -60px;
    right: 0px;
    position: absolute;
    height: 60px;
    left: calc(50% + 160px);
}

@media(min-width:768px){
.stripe-model-10 .st6 {
    left: calc(50% + 240px);
    
    }}

.stripe-model-10 .st7 {

    background: transparent;
    bottom: 150px;
    left: 0px;
    right: calc(50% + 605px);
    position: absolute;
    height: 60px;
}
.stripe-model-10 .st8 {

    background: transparent;
    border: transparent;
    bottom: 180px;
    left: 0px;
    right: calc(50% + 505px);
    position: absolute;
    height: 60px;
}
.stripe-model-10 .st9 {
    
}
@media(min-width:768px){
.stripe-model-10 .st9 {

    background: #f5be58;
    top: -380px;
    right: 0px;
    left: calc(50% + 540px);
    position: absolute;
    height: 60px;
    }}
.stripe-model-10 .st10 {
	background: transparent;
    border: 2px solid #e6ebf1;
	top: 42px;
	right: 110px;
    left: calc(50% + 240px);
	position: absolute;
    height: 60px;
}
.stripe-model-10 .st11 {
	background: #e6ebf1;
	top: 102px;
	right: 0px;
	left: calc(50% + 410px);
	position: absolute;
    height: 60px;
}

/****************************************/
/************ Promo app Part 2 *****************/
/****************************************/
.app-promo-part2{
    padding-top: 170px;
    padding-bottom: 0;
}
@media(min-width:768px){
.app-promo-part2{
    padding-top: 220px;
    }}

@media(min-width:768px){
    .app-promo-part2 .inclined-bg-grey {
       top: 50px;
    }}

.app-promo-part2 .container h3{
    font-weight: 600;
    font-size: 19px;
    line-height: 32px;
    color: #32325d;
}

.app-promo-part2 .container p{
    font-weight: 400;
    font-size: 17px;
    line-height: 28px;
    color: #525f7f;
    margin-bottom: 30px;
}
@media(min-width:768px){
    .app-promo-part2 .container p {
       margin-bottom: 0px;  
    }}
.benefit-icon {
    min-height: 48px;
    margin: 0 0 16px;
    display: grid;
    align-items: end;
}
.benefit-icon svg{
    width: 48px;
    height: 48px;
}
.app-promo-part2 .container{
    padding-bottom: 70px;
}
.app-promo-part2 .customer-items{
    padding-right: 20px;
    padding-left: 20px;
    }

@media(min-width:768px){
.app-promo-part2 .customer-items{
    padding-right: 70px;
    padding-left: 70px;
    }}
.app-promo-part2 img{
    filter:brightness(1);
}
container.strait-container{
    padding-left: 50px;
    padding-right: 50px;
}
.container.strait-container {
    padding-left: 50px;
    padding-right: 50px;
}

@media(min-width:768px){
    .strait-3-cols{
    padding-right: 35px!important;
    padding-left: 35px!important;
    }}




/*
.app-promo-part2 h1{
    color: #fff;
    text-shadow: 0px 1px 6px #000;
    font-weight: 500;
    font-size: 1.8em;
}
@media(min-width:767px){
.app-promo-part2 h1{
    color: #252525;
    text-shadow: 0px 1px 6px #fff;
    font-size: 2.35em;
}}
.app-promo-part2 p.lead{
    color: #fff;
    text-shadow: 0px 1px 6px #000;
    font-size: 1.15em;
}
@media(min-width:767px){
.app-promo-part2 p.lead{
    color: #252525;
    text-shadow: 0px 1px 6px #fff;
    font-size: 1.36em;
}}
@media(min-width:767px){
.app-promo-part2 [data-overlay="2"]:before{
    opacity: 0;
}}
*/


/****************************************/
/************ Promo app Part 3 *****************/
/****************************************/


.img-promo-app-part3 img{
    width: 100%;
    position: relative;
}
.img-promo-app-part3 .background-img-standard{
    position: absolute;
    width: 100%;
}
.img-promo-app-part3 .head-baner h1, .img-promo-app-part3 .head-baner h, .img-promo-app-part3 .head-baner p{
    text-shadow: 0 0 4px rgba(0,0,0,.25);
}
.img-promo-app-part3 h4{
    font-weight: 600;
    background-color: #6772e5!important;
    border-radius: 5px;
    text-align: center;
    padding: 6px;
}
.img-promo-app-part3 p{
    
}
[data-overlay-purple-yellow]:before {
  position: absolute;
  content: '';
    background-image: -webkit-radial-gradient(closest-corner,rgba(16,47,70,0) 60%,rgba(16,47,70,.26)),-webkit-linear-gradient(105deg,#fcd669,#6772e5 90%);
 
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
[data-overlay-purple-yellow="1"]:before {
  opacity: 0.1;
}
[data-overlay-purple-yellow="2"]:before {
  opacity: 0.2;
}
[data-overlay-purple-yellow="3"]:before {
  opacity: 0.3;
}
[data-overlay-purple-yellow="4"]:before {
  opacity: 0.4;
}
[data-overlay-purple-yellow="5"]:before {
  opacity: 0.5;
}
[data-overlay-purple-yellow="6"]:before {
  opacity: 0.6;
}
/****************************************/
/************ Promo app Part 4 *****************/
/****************************************/


.features-promo-app-part4{
    margin-top: 100px;
    padding-bottom: 0px
}
@media(min-width:768px){
.features-promo-app-part4{
        padding-bottom: 7.42857143em;
    }}

.features-promo-app-part4 .main-title{
    text-align: center;
    margin-bottom: 100px;
}
.features-promo-app-part4 h1, .features-promo-app-part4 h3{
    color: #32325d!important;
    font-weight: 400;
}
.features-promo-app-part4 h4{
    color: #6772e5!important;
    font-weight: 600;
} 

.features-promo-app-part4 p{
    color: #525f7f!important;
}
.features-promo-app-part4 .process-3 li .process__number span {
    font-size: 1em;
    font-weight: bold;
    color: #4a90e2;
    position: relative;
    top: 0px;
    }
@media(min-width:768px){
.features-promo-app-part4 .process-3 li .process__number span {
    top: -2px;
    }}
.features-promo-app-part4 .process-3 li .process__number {
    float: left;
    width: 15%;
    width: 1.714286em;
    height: 1.71428571em;
    border-radius: 50%;
    border: none;
    background: #fff;
    text-align: center;
    box-shadow: 0 2px 5px -1px rgba(50,50,93,.25), 0 1px 3px -1px rgba(0,0,0,.3);
    margin-left: 15px;
}
.features-promo-app-part4 .process-3 li:not(:last-child) {
    margin-bottom: 2.21428571em;
}

.features-promo-app-part4 iframe{
    height: 570px;
    position: relative;
    top: -80px;
}

/****************************************/
/************ Promo app Part 5 *****************/
/****************************************/

.contact-promo-app-part5 .switchable__text{
    text-align: center;
}
@media(min-width:768px){
.contact-promo-app-part5 .switchable__text{
    text-align: left;
    }}
.contact-promo-app-part5 h2{
    font-weight: 300;
    color: #6772e5;
}

.contact-promo-app-part5 p{
    font-weight: 400;
    font-size: 30px;
    line-height: 45px;
    color: #32325d
}

.strait-3-cols{
    padding-right: 35px!important;
    padding-left: 35px!important;
}

.contact-promo-app-part5 a.principal{
    color: #fff;
    background: #6772e5;
    box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
    border: none;
    font-weight: 700;
    margin-top: 50px;
    margin-bottom: 15px;
    float: none;
}
@media(min-width:768px){
.contact-promo-app-part5 a.principal{
    float: right;
    }}

.contact-promo-app-part5 a.principal:hover{
    background-color: #7795f8;
}
.contact-promo-app-part5 button.secundari{
    color: #6772e5;
    background: #fff;
    box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
    border: none;
    margin-left: 0;
    font-weight: 700;
    float: none;
        padding-right: 2.78571429em;
    padding-left: 2.78571429em;
    }

@media(min-width:768px){
.contact-promo-app-part5 button.secundari{
    float: right;
    }}
.contact-promo-app-part5 button.secundari:hover{
       color: #7795f8;
}
.contact-promo-app-part5 .buttons-col{
    text-align: center;
}
@media(min-width:768px){
.contact-promo-app-part5 .buttons-col{
    text-align: inherit;
    }}




/****************************************/
/************* BOX WEB PROMO ****************/
/****************************************/
.inclined-bg-trans {
	position: absolute;
  top: 80px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transapernt;
  transform: skewY(-8deg);
}
@media(min-width:768px){
    .inclined-bg-trans {
       top: 150px;; 
    }}
.stripe-model-11 .st2 {

    background: linear-gradient(90deg,rgba(224,226,241,0) 60%,#e0e2f1);
    top: 136px;
    left: 0px;
    right: calc(50% + -681px);
    position: absolute;
    height: 60px;
    opacity: .2;
}

.stripe-model-11 .st3 {

    background: linear-gradient(90deg,rgba(224,226,241,0) 3%,#e0e2f1);
    top: 470px;
    left: 0px;
    right: calc(50% + 288px);
    position: absolute;
    height: 140px;
    opacity: 0.1;
}

.stripe-model-11 .st7 {
	background: #6772e5;
	bottom: 0px;
	right: 0px;
	left: calc(50% + 115px);
	position: absolute;
    height: 60px;
}

/****************************************/
/************ BOX WEB PROMO Part 2 *******/
/****************************************/

.inclined-bg-trans {
	position: absolute;
  top: 0px;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transapernt;
  transform: skewY(-8deg);
}
.stripe-model-11 .st4 {
	background: #fcd669;
	top: -150px;
	right: 0px;
	left: calc(50% + 175px);
	position: absolute;
    height: 60px;
}
.stripe-model-11 .st5 {
	background: #32325d;
	top: -150px;
	right: 0px;
	left: calc(50% + 490px);
	position: absolute;
    height: 60px;
}
.stripe-model-11 .st6 {
	background: #8feffb;
	top: -90px;
	right: 60px;
	left: calc(50% + 365px);
	position: absolute;
    height: 60px;
}
.box-web-part2{
    margin-top: 150px;
}
.box-web-part2 .container h3{
    font-weight: 600;
    font-size: 19px;
    line-height: 32px;
    color: #32325d;
}

.box-web-part2 .container p{
    font-weight: 400;
    font-size: 17px;
    line-height: 28px;
    color: #525f7f;
    margin-bottom: 30px;
}
@media(min-width:768px){
    .box-web-part2 .container p {
       margin-bottom: 0px;  
    }}

/****************************************/
/************ BOX WEB PROMO Part 3 *******/
/****************************************/
.stripe-model-1.box-web-part3 .st7-3{
    background: linear-gradient(90deg,rgba(224,226,241,0) 1%,#e0e2f1);
    bottom: 0px;
    left: 0px;
    right: calc(50% + 272px);
    position: absolute;
    height: 160px;
    opacity: .1;
}
.stripe-model-1.box-web-part3 .st8-3{
    background: linear-gradient(90deg,rgba(224,226,241,0) 6%,#e0e2f1);
    top: 0px;
    left: 0px;
    right: calc(50% + 272px);
    position: absolute;
    height: 70px;
    opacity: .1;
}
.stripe-model-1.box-web-part3 .st9-3{
    background: #6772e5;
    bottom: 60px;
    right: 0px;
    left: calc(50% + 375px);
    position: absolute;
    height: 60px;
    opacity: .3;
}

.box-web-part3{
    margin-top: 80px;
    padding-top: 120px!important;
}
.box-web-part3 .inclined-bg-blue-gradient{
    top: 0;
}

.box-web-part3 h1{
    margin-bottom: 60px;
    color: #87bbfd;
}


.box-web-part3 .tabs li:not(.active) {
    opacity: 1;
    color: #87bbfd;
}
.box-web-part3 li:hover {
    cursor: pointer;
    color: #fff!important;
}
.box-web-part3 .tabs--vertical{
    padding-bottom: 100px;
}
.inclined-bg-blue-gradient {
	position: absolute;
    top: 80px;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: -webkit-radial-gradient(closest-corner,rgba(16,47,70,0) 60%,rgba(16,47,70,.26)),-webkit-linear-gradient(105deg,#555abf,#32325d 90%);
    background-color: #f6f9fc;
    transform: skewY(-8deg);
}
@media(min-width:768px){
    .inclined-bg-blue-gradient {
       top: 150px;; 
    }}
/****************************************/
/************ BOX WEB PROMO Part 4 *******/
/****************************************/

.box-web-part4{
    margin-top: 100px;
    padding-bottom: 0px
}
@media(min-width:768px){
.box-web-part4{
        padding-bottom: 7.42857143em;
    }}

.box-web-part4 .main-title{
    text-align: center;
    margin-bottom: 100px;
}
.box-web-part4 h1, .box-web-part4 h3{
    color: #32325d!important;
    font-weight: 400;
}
.box-web-part4 img{
    height: 390px;
}

.rotate-to-left{
    --sfml-skewright: perspective(1000px) scale(1) rotateX(2deg) rotateY(-13deg);
    transform: var(--sfml-skewright);
}
.rotate-to-right{
    --sfml-skewleft: perspective(1000px) scale(1) rotateX(2deg) rotateY(13deg) rotateZ(0deg);
    transform: var(--sfml-skewleft);
}


/****************************************/
/************ BOX WEB PROMO Part 5 *******/
/****************************************/


.box-web-part5 .switchable__text{
    text-align: center;
}
@media(min-width:768px){
.box-web-part5 .switchable__text{
    text-align: left;
    }}
.box-web-part5 h2{
    font-weight: 400;
    color: #e39f48;
}

.box-web-part5 a.secundari{
    color: #fff;
    background: #32325d;
    box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
    border: none;
    margin-left: 0;
    font-weight: 700;
    float: none;
    padding-right: 2.78571429em;
    padding-left: 2.78571429em;
    margin-top: 60px;
    }

@media(min-width:768px){
.box-web-part5 a.secundari{
    float: left;
    }}
.box-web-part5 a.secundari:hover{
       color: #7795f8;
}
.box-web-part5 .buttons-col{
    text-align: center;
}
@media(min-width:768px){
.box-web-part5 .buttons-col{
    text-align: inherit;
    }}












.app-promo-part3{
    padding-top: 80px!important;
}


.app-promo-part3 video{
    height: 180px;
}
@media(min-width:500px){
.app-promo-part3 video{
    height: 230px;
}}
@media(min-width:500px){
.app-promo-part3 video{
    height: 400px;
}}
@media(min-width:1024px){
.app-promo-part3 video{
    height: 500px;
}}
.app-promo-part3 h3{
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
}

.app-promo-part3 .app-points{
    margin-top: 70px;
    display: inline-block;
    width: 100%;
}

.app-points img{
    height: 150px;
}

.app-promo-part3 a span{
    text-transform: uppercase;
}

/**************************** FI ACADEMY ***************************************/

/****************************  ACADEMY UNIT ***************************************/

.contenedor_documents{
    margin:60px auto;
    width: 90%;
}

.documents{
    margin-top: 30px;
   padding-bottom: 10px;
    border-bottom: 1px solid #eeeeee; 
}

.documents a{
    font-weight: 500;
    font-size:15px;
}
.documents a:hover{
    cursor: hand;
    cursor: pointer;
}

.documents p{
    font-size: 14px;
    font-weight: 400;
}

.contenedor_info{
    margin:100px auto 60px;
    width: 90%;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 15px 35px rgba(50,50,93,.1),0 5px 15px rgba(0,0,0,.07);
    padding: 80px 70px;
}

.info{
       
}
/**************************** FI ACADEMY UNIT ***************************************/

/****************************  CUSTOMERS ***************************************/

.customers-background{
    width: 100%;
    top: 0px;
}
.img-background-customers{
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -2;
}

.customers-background h2{
    font-size: 21px;
    font-weight: 500;
    text-shadow: 2px 2px 19px #3c3c3c;
    color: #fff;
}
                    @media(min-width:768px){
                            .customers-background h2{
                                font-size: 31px;
                                
                        }}
                            @media(min-width:1024px){
                                    .customers-background h2{
                                        font-size: 40px;
                                        
                                }}



.primary-title-cust{
    display: none;
}
                @media(min-width:768px){
                            .primary-title-cust{
                                margin-top: 10%;
                                display: inherit;
                        }}


.secondary-title-cust{
    display: none;
}
                @media(min-width:768px){
                            .secondary-title-cust{
                                display: inherit;     
                        }}
.world{
    width: 100%;
    margin-top: 30px;
}
.video-globe{
    width: 70%;
}
.world h2{
    position: relative;
    top: -45px;
    color: #6772e5;
    font-size: 15px;
}
        @media(min-width:500px){
                .world h2{
                    top: -45x;
                    font-size: 20px
                        }}
                 @media(min-width:768px){
                        .world h2{
                            top: -81px;
                            font-size: 30px
                                }}

.start-card{
    background-color: #fafbfc;
    border-radius: 10px;
}



.wrapper{
    text-align: center;
    position: relative;
    width: 100%;
}

.scroll{
    overflow-x: scroll;
        overflow-y: hidden;
        height: 100px;
    white-space:nowrap
}

.carousel-item .customer-card{
    width: 250px;
    display: inline;
    margin-bottom: 10px;
}
        @media (min-width:992px){
                .carousel-item .customer-card{
                width: 310px;
                display: inline;
                margin-bottom: 50px;
                float: left;
            }}
        

.customers_carousel{
    margin-top: 40px;
}

    @media (min-width:768px){
                .customers_carousel{
                margin-top: 62px
            }}
        @media (min-width:992px){
                .customers_carousel{
                margin-top: 100px
            }}

.container-carousel-customers{
    padding-left: 30px;
    padding-right: 30px;
}

        @media (min-width:400px){
                .container-carousel-customers{
                padding-left: 110px;
                padding-right: 110px;
            }}
            @media (min-width:500px){
                .container-carousel-customers{
                padding-left: 110px;
                padding-right: 110px;
                }}
                @media (min-width:600px){
                    .container-carousel-customers{
                    padding-left: 110px;
                    padding-right: 110px;
                    }}

.title-customers-said{
    text-align: center;
    margin-top: 86px;
}
        @media (min-width:400px){
                .title-customers-said{
                margin-top: 104px;
            }}
            @media (min-width:500px){
                .title-customers-said{
                margin-top: 146px;
            }}
                @media (min-width:600px){
                .title-customers-said{
                margin-top: 193px;
            }}
                    @media (min-width:768px){
                            .title-customers-said{
                            margin-top: 100px;
                        }}
                        @media (min-width:992px){
                            .title-customers-said{
                            margin-top: 160px;
                        }}
                            @media (min-width:1200px){
                            .title-customers-said{
                            margin-top: 210px;
                        }}


.title-customers-said h2{
    color: #6772e5;
    font-size: 23px
}

            @media (min-width:650px){
                .title-customers-said h2{
                font-size: 30px;
            }}

.customers_carousel .carousel-indicators{
    display: none;
}

.customer-text-opinion{
    clear: both;
}
        @media (min-width:768px){
                .customer-text-opinion{
                clear: none;
            }}

.start-card-customer{
    margin: 10px auto 55px;
    background: #f7f9fa;
    border: 1px solid #e8eaeb;
    border-radius: 5px;
    text-align: center;
    color: #6f7c82;
    padding: 23px 20px;
    width: 578px;
}

.start-card-customer a{
    font-size: 14px;
    box-sizing: border-box;
    border: none;
    padding: 9px 12px 8px;
    line-height: 1;
    white-space: nowrap;
    margin: 5px 8px;
    border-radius: 5px;
    background-color: #399fea;
    background: -webkit-linear-gradient(top,#52b6ef,#399fea);
    background: linear-gradient(180deg,#52b6ef,#399fea);
    box-shadow: inset 0 0 0 1px rgba(20,123,198,.3),inset 0 -1px 0 #147bc6,0 1px 0 hsla(202,8%,80%,.3);
    color: #fff;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 0 -1px 0 #147bc6;
}


/****************************************/
/**************** drpdown horario ***************/
/****************************************/

:root .schedule-selection .schedule-dropdown::before {
    left: 205px;
}
:root .schedule-selection .schedule-dropdown::before {
    top: -11px;
    left: 5px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
:root .schedule-selection .schedule-dropdown::before {
    bottom: 374px;
    left: 184px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
:root .schedule-dropdown::before {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 115px;
    width: 20px;
    height: 20px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 20px 0 3px 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
        border-top-width: 1px;
        border-left-width: 1px;
    border-top-width: 0;
    border-left-width: 0;
    z-index: -1;
}
:root .schedule-dropdown {
    left: -250%;
    width: 400px;
}
:root .schedule-dropdown {
    padding: 25px 15px;
    margin-bottom: 5px;
}
.dropdown .schedule-dropdown {
    top: 48px;
    bottom: inherit;
}
.tit-class{
    font-weight: 500;
    margin-bottom: 10px;
}
.sub-class{
    font-weight: 700;
}
.options-dropdown-schedule{
    margin-top: 30px;
}
.option-d-sche-tit{
    font-size: 20px;
    margin-bottom: 15px;
}
.btn.button-login-sche {
    background: #FFFFFF;
    color: #525f7f!important;
    border: 0;
    padding: 7px 13px;
    box-shadow: 0 0 0 1px rgba(50,50,93,.1), 0 2px 5px 0 rgba(50,50,93,.08), 0 1px 1.5px 0 rgba(0,0,0,.07), 0 1px 2px 0 rgba(0,0,0,.08);
    font-size: 13px;
}
.btn.button-login-sche:hover {
    background: #f8fbfd;
    color: #525f7f;
}
.btn.button-signup-sche {
    background: #4a90e2;
    border-color: #4a90e2;
    color: #fff!important;
    border: 0;
    padding: 7px 13px;
    box-shadow: 0 0 0 1px rgba(50,50,93,.1), 0 2px 5px 0 rgba(50,50,93,.08), 0 1px 1.5px 0 rgba(0,0,0,.07), 0 1px 2px 0 rgba(0,0,0,.08);
    font-size: 13px;
}
.btn.button-signup-sche:hover {
    background: #609de6;
    color: #fff;
}
.link-how-red{
    color: #e73132;
    font-size: 13px;
    margin-top: 15px;
    display: block;
    font-weight: 400;
    cursor: pointer;
}
.link-how-red:hover{
    font-weight: 600;
    color: #e73132;
    text-decoration: none;
}
.link-how-red i{
    margin-left: 10px;
    font-weight: 400;
    font-size: 20px;
}