@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700,800&display=swap');

.min-w-300 {
    min-width: 300px;
}

.pl-img {
    padding-left: 50px;
    padding-right: 50px;
}

.font-family-montserrat{
    font-family: 'Montserrat', sans-serif;
}

.active{
    font-weight: bold;
}

.bg-gray-home{
    background-color: #F2F2F2;
}

.bg-white-home{
    background-color: #FFFFFF;
}

.black-font-home{
    color: #323232;
}

.w-auto{
    width: auto !important;
}
.accordion a.collapsed::before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
.accordion a::before {
    content: "\e648";
    display: inline-block;
    font-family: themify;
    font-size: 45px;
    font-weight: bold;
    margin-right: 0;
    margin-left: 0;
    -webkit-transition: .2s linear;
    transition: .2s linear;
}

/* HOME FONTS */
.white-title-home{
    font-size: 20px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;
}

.black-title-light-home{
    font-size: 35px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.09;
    letter-spacing: normal;
    color: #323232;
}

.black-subtitle-light-home{
    font-size: 42px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    color: #323232;
}

.black-title-big-home{
    font-size: 56px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: -2px;
    color: #323232;
}
.black-subtitle-home{
    font-size: 20px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.39;
    letter-spacing: 0.51px;
    text-align: center;
    color: #323232;
}
.black-paragraph-home{
    font-size: 18px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.53;
    letter-spacing: normal;
    color: #323232;
}

.black-md-paragraph-home{
    font-size: 18px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.43;
    letter-spacing: normal;
    color: #323232;
}

.black-xs-paragraph-home{
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #323232;
}
.btn-cyan-text{
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.22;
    letter-spacing: normal;
    text-align: center;
    color: #45caba;
}

.btn-white {
    padding: 14px 30px;
    border-radius: 30px;
    width:10em;
}

.cyan-subtitle-home{
    color: #45caba;
    font-weight: 800;
}

.ml-menu {
    margin-left: 10px;
}

.extrabold-home{
    font-weight: bold !important;
}

.big-icon-white-home{
    color:#FFFFFF;
    font-size: 70px;
}

.big-icon-cyan-home{
    color:#45caba;
    font-size: 70px;
}

.color-cyan-home{
    color:#45caba !important;
}

.color-white-home{
    color:#ffffff !important;
}

.testimonials-title-home{
    font-size: 30px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.17;
    letter-spacing: normal;
    text-align: center;
    color: #323232;
}

.testimonials-paragraph-home{
    font-size: 16px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: center;
    color: #323232;
}
.testimonials-circle-image-home{
    width: auto;
    height: 152px;
    border-radius: 50%;
}
.transition{
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition:all 0.5s ease-in-out;
    -o-transition:all 0.5s ease-in-out;
    transition:all 0.5s ease-in-out;
}

/* END HOME FONTS */

/* LIST ICONS CLASSES */
.icon-list-home{
    display: block;
    float: left;
}
.paragraph-list-home{
    overflow: hidden;
}

/* GRAYSCALE IMAGES CLASS */
.img-grayscale-home{
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

/* CUSTOM CAROUSEL BUTTONS CLASSES */
.button-carousel-home{
    width:8% !important;
    font-weight: bold !important;
}
.arrow-carousel-home{
    font-size: 20px !important;
}
.swiper-button-next::before, .swiper-button-prev::before{
    font-size: 20px;
}

/* FOOTER TEXT */
.footer-text{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.11;
    letter-spacing: normal;
    text-align: center;
    color: #323232;
}

.gradienteIcon {
    background: -webkit-linear-gradient(180deg, #45CABA, #ACCE52);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.fixedContainer {
    background-color:#ddd;
    position: fixed;
    padding: 2em;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* HEADER LOGO */
.header-logo{
    height: 40px;
}
.min-w-15pc{
    min-width: 15%;
}
/* END HEADER LOGO */

.gradient-overlay {
    z-index: 10 !important;
}

.phone-wrapper-home{
    max-width: 100%;
    position: sticky;
    top: 100px;
    width: 100%;
    height: 1px;
    min-height: 0px;
    z-index: 10;
    pointer-events: none;
    margin-left: auto;
    margin-right: auto;
}
.phone-wrapper-container-home{
    display: flex;
    height: calc(105vh - 100px);
    min-height: calc(105vh - 100px);
    max-width: 1320px;
    margin: auto;
}
.phone-wrapper-item-home{
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    flex: 1 1 0%;
}
.phone-wrapper-mobile-frame-and-content-home::after{
    background-image: url(/images/home/iphone-x-frame.png);
    position: absolute;
    left: -2.5px;
    top: 0px;
    width: calc(100% + 5px);
    height: 100%;
    z-index: 5;
    background-size: contain;
    content: "";
    background-position: center center;
    background-repeat: no-repeat;
}
.phone-wrapper-video-container-home{
    height: 100%;
    position: relative;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    background-color: rgb(255, 255, 255);
    z-index: 4;
    width: 100%;
}
.phone-wrapper-video-in-frame-home{
    width:inherit !important;
}
/*Responsive para resolucionaes mas anchas de 1366p pero más pequeñas que 1080p */
@media (max-width: 1919px) and (min-width: 1367px)  {
    .d-xxl-inline{
        display: none;
    }
}


/*Responsive personalizados para los divs de HOME*/
@media (max-width : 768px) {
    .bg-gray-home-xs{
        background-color: #F2F2F2;
    }
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .arrow-carousel-home{
        font-size: 2.5em !important;
    }
    .swiper-button-next::before, .swiper-button-prev::before{
        font-size: 2.5em !important;
    }
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
    /* HEADER CSS */
    .topbar .menu-item>.menu-link{
        border-top-color: transparent !important;
        border-bottom-style: solid;
        border-bottom-color: transparent !important;
    }
    .topbar .menu-item.active>.menu-link{
        border-top-color: transparent !important;
        border-bottom-style: solid;
        border-bottom-color: #33cabb !important;
        font-weight: bold;
    }
    .topbar .menu-item:hover>.menu-link{
        border-top-color: transparent !important;
        border-bottom-style: solid;
        border-bottom-color: #33cabb !important;
    }
    .header-text{
        font-size: 17px !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
        color: #323232;
    }
    .h-md-inherit{
        height: inherit !important;
    }
    /* END HEADER CSS */
    .footer-text{
        font-family: 'Montserrat', sans-serif;
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: normal;
        text-align: right;
        color: #323232;
    }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    /* HEADER LOGO */
    .header-logo{
        height: 50px;
    }
    /* END HEADER LOGO */
    .h-md-100{
        height: 100px;
    }
    .icons-prezo{
        width: auto;
        height: 12em;
    }
    .phone-wrapper-mobile-frame-and-content-home{
        position: relative;
        z-index: 5;
        top: 0px;
        box-sizing: border-box;
        height: auto;
        width: 28.25vh;
        max-width: 28em;
        /*max-height: 810px;*/
        padding: 6.1% 5.3%;
    }
    .white-title-home{
        font-size: 25px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }

    .black-title-light-home{
        font-size: 35px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.09;
        letter-spacing: normal;
        color: #323232;
    }

    .black-subtitle-light-home{
        font-size: 40px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        color: #323232;
    }

    .black-title-big-home{
        font-size: 60px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -2px;
        color: #323232;
    }
    .black-subtitle-home{
        font-size: 20px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.39;
        letter-spacing: 0.51px;
        text-align: center;
        color: #323232;
    }
    .black-paragraph-home{
        font-size: 20px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.53;
        letter-spacing: normal;
        color: #323232;
    }

    .black-md-paragraph-home{
        font-size: 20px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: normal;
        color: #323232;
    }

    .black-xs-paragraph-home{
        font-size: 15px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        color: #323232;
    }
    .btn-cyan-text{
        font-size: 15px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        text-align: center;
        color: #45caba;
    }
    .btn-white {
        padding: 10px 30px;
        border-radius: 30px;
        width:170px;
    }
    .testimonials-title-home{
        font-size: 30px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.17;
        letter-spacing: normal;
        text-align: center;
        color: #323232;
    }

    .testimonials-paragraph-home{
        font-size: 16px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.33;
        letter-spacing: normal;
        text-align: center;
        color: #323232;
    }

    .mt-md-8{
        margin-top:8% !important;
    }
    .mt-md-10{
        margin-top:10% !important;
    }
    .py-md-8{
        padding-top:8% !important;
        padding-bottom:8% !important;
    }
    .pr-md-7{
        padding-right: 7% !important;
    }
    .my-md-8{
        padding-top:8% !important;
        padding-bottom:8% !important;
    }
    .py-md-5{
        padding-top:5% !important;
        padding-bottom:5% !important;
    }
    .px-md-5percent{
        padding-left:5% !important;
        padding-right:5% !important;
    }
    .px-md-8{
        padding-left:8% !important;
        padding-right:8% !important;
    }
    .px-md-10{
        padding-left:10% !important;
        padding-right:10% !important;
    }
    .px-md-11{
        padding-left:11% !important;
        padding-right:11% !important;
    }
    .pl-lg-9{
        padding-left: 9%;
    }
    .pl-lg-25{
        padding-left: 25%;
    }
    .pr-lg-7{
        padding-right: 3%;
    }
    .pr-lg-9{
        padding-right: 9%;
    }
    .pr-lg-15{
        padding-right: 15%;
    }
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .px-lg-8{
        padding-left:8% !important;
        padding-right:8% !important;
    }
    .title-features{
        height: 100px;
    }
    .text-features{
        height:120px;
    }

    .white-title-home{
        font-size: 30px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }

    .black-title-light-home{
        font-size: 42px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.09;
        letter-spacing: normal;
        color: #323232;
    }

    .black-subtitle-light-home{
        font-size: 40px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        color: #323232;
    }

    .black-title-big-home{
        font-size: 70px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -2px;
        color: #323232;
    }
    .black-subtitle-home{
        font-size: 26px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.39;
        letter-spacing: 0.51px;
        text-align: center;
        color: #323232;
    }
    .black-paragraph-home{
        font-size: 22px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.53;
        letter-spacing: normal;
        color: #323232;
    }

    .black-md-paragraph-home{
        font-size: 20px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: normal;
        color: #323232;
    }

    .black-xs-paragraph-home{
        font-size: 15px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        color: #323232;
    }
    .btn-cyan-text{
        font-size: 15px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        text-align: center;
        color: #45caba;
    }

    /* CAROUSEL FEATURES*/
    /* show 3 items */
    .carouselPrograms .carousel-inner .active,
    .carouselPrograms .carousel-inner .active + .carousel-item,
    .carouselPrograms .carousel-inner .active + .carousel-item + .carousel-item {
        display: block;
    }

    .carouselPrograms .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
    .carouselPrograms .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
    .carouselPrograms .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
        transition: none;
    }

    .carouselPrograms .carousel-inner .carousel-item-next,
    .carouselPrograms .carousel-inner .carousel-item-prev {
        position: relative;
        transform: translate3d(0, 0, 0);
    }

    .carouselPrograms .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item {
        position: absolute;
        top: 0;
        right: -33.333%;
        z-index: -1;
        display: block;
        visibility: visible;
    }

    /* left or forward direction */
    .carouselPrograms .active.carousel-item-left + .carousel-item-next.carousel-item-left,
    .carouselPrograms .carousel-item-next.carousel-item-left + .carousel-item,
    .carouselPrograms .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
    .carouselPrograms .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    /* farthest right hidden item must be abso position for animations */
    .carouselPrograms .carousel-inner .carousel-item-prev.carousel-item-right {
        position: absolute;
        top: 0;
        left: 0%;
        z-index: -1;
        display: block;
        visibility: visible;
    }

    /* right or prev direction */
    .carouselPrograms .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
    .carouselPrograms .carousel-item-prev.carousel-item-right + .carousel-item,
    .carouselPrograms .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
    .carouselPrograms .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(100%, 0, 0);
        visibility: visible;
        display: block;
    }
    /*END CAROUSEL TESTIMONIALS*/

    .phone-wrapper-mobile-frame-and-content-home{
        position: relative;
        z-index: 5;
        top: 0px;
        box-sizing: border-box;
        height: auto;
        width: 36.25vh;
        max-width: 28em;
        /*max-height: 810px;*/
        padding: 6.1% 5.3%;
    }
}
/* XXL devices (1080 desktop monitor, 1370px and up) */
@media (min-width: 1450px) {
    .pr-lg-7{
        padding-right: 9%;
    }
    .d-xxl-inline{
        display: inline !important;
    }
    .icons-prezo{
        width: auto;
        height: 15em;
    }
    .title-features{
        height: 16.3vh;
    }
    .text-features{
        height:210px;
    }
    .white-title-home{
        font-size: 40px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        color: #ffffff;
    }

    .black-title-light-home{
        font-size: 50px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.09;
        letter-spacing: normal;
        color: #323232;
    }

    .black-subtitle-light-home{
        font-size: 50px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        color: #323232;
    }

    .black-title-big-home{
        font-size: 90px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: -2px;
        color: #323232;
    }
    .black-subtitle-home{
        font-size: 30px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.39;
        letter-spacing: 0.51px;
        text-align: center;
        color: #323232;
    }
    .black-paragraph-home{
        font-size: 28px;
        font-weight: 400;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.53;
        letter-spacing: normal;
        color: #323232;
    }

    .black-md-paragraph-home{
        font-size: 23px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.43;
        letter-spacing: normal;
        color: #323232;
    }

    .black-xs-paragraph-home{
        font-size: 20px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        color: #323232;
    }
    .btn-cyan-text{
        font-size: 22px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        text-align: center;
        color: #45caba;
    }
    .testimonials-title-home{
        font-size: 35px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.17;
        letter-spacing: normal;
        text-align: center;
        color: #323232;
    }

    .testimonials-paragraph-home{
        font-size: 22px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.33;
        letter-spacing: normal;
        text-align: center;
        color: #323232;
    }

    .carousel-control-prev-icon {
        margin-left: -3.5rem;
    }

    .carousel-control-next-icon {
        margin-right: -3.5rem;
    }

}