@charset "utf-8";
/* CSS Document */

    
    /* Buttons NEW */
    .btn-orange {
        border-radius: 4px;
        font-family: 'Roboto', sans-serif;
        font-weight: 700;
        padding: .85rem 3rem;
        text-decoration: none;
    }
    
    /* Hero NEW */
    .hero-image {
        background:none;
    }

    /* Marketing Colors Specific NEW */
    .marketing {
        color: #252525!important;
       
    }
    .marketing-bkd {
        background-color: #252525;
    }
    .top-facts-marketing {
        border-top: 10px solid #252525;
    }
    .card-marketing {
        border-left: 10px solid #252525;
    }
    .card-marketing .btn:not(.collapsed) span.toggle-icon:before {
        background: #252525;
    }

    /* Marketing Hero NEW */
    .hero-marketing-ecommerce {
        background-color: #0f2039 !important;
        height: auto;
    }
    .hero-marketing-ecommerce .full-bg-img-child {
        background-position: top center;
        background-repeat: no-repeat;
        height: 645px;
    }
    h1.hero-title {
        color: #fff;
        margin-left: 0;
        text-shadow: 1px 2px 1px #000; 
        margin-top: 200px;
    }
    h2.hero-text-subtitle {
        font-size: 1.375rem;
        font-weight: 400;
    }

    /* Section Intro NEW */
    
    h2.intro-text {
        color: #0f2039 !important;
        font-size: 1.75rem;
        font-weight: 500;
        margin-bottom:30px!important;
    }
    
    /* Top Facts NEW */
    #top-facts {
        background-color: #f7f8fb;
    }
    .top-facts-container {
        margin-top: 0px;
        padding-top: 60px;
        width: 100%;
    }
    .top-facts {
        background: #fff;
        border-radius: 4px;
        box-shadow: 0 5px 20px rgba(0,0,0,.15);
        -moz-box-shadow: 0 5px 20px rgba(0,0,0,.15);
        -webkit-box-shadow: 0 5px 20px rgba(0,0,0,.15);
        min-height: 185px;
        padding-left: 10px;
        padding-right: 10px;
        text-align: center;
    }
    .top-facts-title {
        color: #21334d;
        font-size: 1.125rem;
        margin-top: 20px;
    }
    .top-facts-hr {
        content: "";
        display: block;
        height: 2px;
        margin: 15px auto;
        width: 28px;
        z-index: -1;
    }
    .top-facts-description {
        color: #243a5a;
        font-size: .875rem;
        font-weight: 400;
        padding-bottom: 30px;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }
    
    /* Section 1 - About NEW */
    #about-nextu {
        background-color: #f7f8fb;
        padding-bottom: 60px;
        padding-top: 60px;
    }
    .about-container {
        background: #fff;
        border-radius: 4px;
        box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -moz-box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -webkit-box-shadow: 0 10px 20px rgba(0,0,0,.15);
    }
    .about-girl-desktop {
        margin-top: 20px;
        width: 425px;
    }
    .about-girl-mobile {
        margin-bottom: 40px;
        margin-top: 20px;
    }
    .about-description {
        color: #0f2039;
        font-size: 1.25rem;
        font-weight: 500;
    }
    .about-list {
        margin-top: 0px;
    }
    .about-list li.media {
       /* margin-bottom: 20px;*/
    }
    .about-list-description {
        color: #0f2039;
        font-size: 1.125rem;
        font-weight: 500;
    }
    .about-check {
        color: #252525!important;
        height: auto;
        margin-right: 20px;
        width: 20px !important;
    }
    ul.about-skills-list {
        margin-top: 20px;
        font-size: 1.125rem;
        font-weight: 700;
    }
    li.skills {
        margin-bottom: 10px;
    }
    
    .skills .fa-circle {
        color: #252525!important;
        font-size: 12px;
        margin-right: 5px;
        border: 1px solid #252525;
        border-radius: 50px;
    }
    
    /* Section 2 - Impact Banner NEW */
    
    #impact {
        background-color: #21334d;
        padding-bottom: 0;
        padding-top: 20px;
    }
    h2.impact-title {
        color: #fff;
        font-size: 2.625rem;
        font-weight: 300;
        margin-bottom: 30px;
    }
    .impact-arrow {
        margin-bottom: 40px;
    }
    
    /* Section 3 - How it Works NEW */
    #how-it-works {
        box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -moz-box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -webkit-box-shadow: 0 10px 20px rgba(0,0,0,.15);
        padding-bottom: 60px;
        padding-top: 60px;
    }
    .how-works-text {
        color: #0f2039;
        font-size: 1.375rem;
        font-weight: 500;
        line-height: 1.6;
        margin-top: 30px;
    }
    h3.what-title {
        color: #0f2039;
        font-size: 1.5rem;
        font-weight: 700;
        margin-top: 40px;
        margin-bottom: 20px;
    }
    ul.what-list {
        color: #0f2039;
    }
    .what-list-description {
        font-size: 1.125rem;
        font-weight: 600;
    }
    .what-icons {
        width: 36px !important;
        color: #fff;
        background: #252525!important;
        height: 36px;
        padding: 5px;
        border-radius: 5px;
        margin-right: 15px;
    }
    .what-list li.media {
        margin-bottom: 5px;
    }
    
    /* Section 4 - Study Modules NEW */
    #study {
        background-color: #f7f8fb;
        box-shadow: inset 0 20px 30px -20px rgba(0,0,0,0.15), inset 0 -20px 30px -15px rgba(0,0,0,0.15);
        -moz-box-shadow: inset 0 20px 30px -20px rgba(0,0,0,0.15), inset 0 -20px 30px -15px rgba(0,0,0,0.15);
        -webkit-box-shadow: inset 0 20px 30px -20px rgba(0,0,0,0.15), inset 0 -20px 30px -15px rgba(0,0,0,0.15);
        padding-bottom: 60px;
        padding-top: 60px;
    }
    .study-text {
        color: #0f2039;
        font-size: 1.375rem;
        font-weight: 500;
    }
    
    /* Section 5 - Accordion NEW Uses Card Classes */
    #course-accordion {
        margin-top: 40px;
        width: 100%;
    }
    .card {
        background-color: #fff;
        font-weight: 700;
        margin-bottom: 15px;
    }
    .card-header {
        background-color: #fff;
        border-radius: 4px;
        border-bottom: none;
    }
    .card-header .btn {
        display: block;
        margin: 0;
        padding: 0;
        text-align: left;
        text-decoration: none;
        text-transform: none;
        width: 100%;
    }
    .card-header .btn small {
        display: block;
        font-size: 0.90rem;
        font-weight: 600;
    }
    .card-header .btn span.module-name {
        display: block;
        color: #21334d;
        font-size: 1rem;
        font-weight: 700;
        text-align: left;
        
        
    }
    .card-header .btn span.toggle-icon {
        float: right;
    }
    .card-header .btn.collapsed span.toggle-icon:before {
        border-radius: 0;
        content: '+';
        display: block;
        font-size: 1.75rem;
        font-weight: 700;
        position: absolute;
        right: 5px;
        top: 0px;
    }
    .card-header .btn:not(.collapsed) span.toggle-icon:before {
        display: block;
        content: ' ';
        height: 3px;
        position: absolute;
        right: 5px;
        top: 20px;
        width: 15px;
    }
    .card-body {
        color: #21334d;
        font-weight: 600;
        padding-left: 1.25rem;
    }
    .card-body p {
        padding: 0 5px;
    }
    .card-body ul {
        padding-left: 25px;
    }
    .card-body ul li {
        margin-bottom: 0;
        list-style: disc;
        font-size: 0.85rem;
    }
    
    /* Section 6 - Tutors NEW uses Carousel Classes */
    #tutor-carousel {
        padding-bottom: 60px;
        padding-top: 60px;
    }
    .tutor-subtitle {
        color: #0f2039;
        font-size: 1.375rem;
        font-weight: 500;
    }
    #carousel-prof {
        margin-top: 20px;
    }
    .tutor-text {
        color: #0f2039;
        font-size: 1.125rem;
        font-weight: 00;
        line-height: 1.75;
    }
    .tutor-name {
        color: #0f2039;
        font-size: 1.25rem;
        font-weight: bold;
        margin-bottom: 5px;
    }
    .tutor-title {
        color: #0f2039;
        font-size: .875rem;
        font-weight: 600;
    }
    #carousel-prof .carousel-item {
        min-height: 275px;
    }
    #carousel-prof .carousel-control-next svg,
    #carousel-prof .carousel-control-prev svg {
        font-size: 5rem;
    }
    #carousel-prof .carousel-control-next svg:hover,
    #carousel-prof .carousel-control-prev svg:hover {
        color: #21334d !important;
    }
    #carousel-prof .carousel-control-prev {
        left: 0;
        width: 7%;
    }
    #carousel-prof .carousel-control-next {
        right: 0;
        width: 7%;
    }
    #carousel-prof ol.carousel-indicators {
        border-top: 0;
        position: relative;
    }
    #carousel-prof ol.carousel-indicators .active,
    #carousel-prof ol.carousel-indicators li.active {
        background-color: #252525;
        height: 20px !important;
        max-width: 20px !important;
        margin-right: 15px;
        width: 20px !important;
    }
    #carousel-prof .carousel-indicators li {
        background-color: #ececec;
        height: 20px !important;
        max-width: 20px !important;
        margin-right: 15px;
        width: 20px !important;
    }
    
    /* Section 7 - Why NextU NEW */
    #why-nextu {
        background-color: #d8e4def6;
        padding-top: 60px;
    }
    .why-list {
        margin-top: 20px;
    }
    .why-list li.media {
        margin-bottom: 10px;
    }
    .why-list-description {
        color: #fff;
        font-size: 1.25rem;
        font-weight: 600;
    }
    .why-icon {
        height: auto;
        margin-right: 40px;
        width: 50px;
    }
    .why-list .empty-icon {
        display: block;
        width: 90px;
    }
    
    /* Section 8 - Bottom Banner NEW */
    #bottom-banner {
        background-color: #21334d;
        padding-bottom: 60px;
        padding-top: 60px;
    }
    #bottom-banner .intro-text {
        margin-bottom: 40px;
    }
    .bottom-banner-subtitle {
        color: #0f2039;
        font-size: 1.375rem;
        font-weight: 500;
    }
    .bottom-banner-container {
        background: #fff;
        border-radius: 4px;
        box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -moz-box-shadow: 0 10px 20px rgba(0,0,0,.15);
        -webkit-box-shadow: 0 10px 20px rgba(0,0,0,.15);
        margin: 0 auto;
        padding: 50px 40px;
        width: 95%;
    }
	#precio h4 {
    margin-top: 0px;
    background: transparent;
    right: 110px;
    color: #fff;
    font-size: 30px;
}
#precio {
    margin-top: -20px;
}
.svg-inline--fa {
    display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -.125em;
}


    
    /* Responsive max-width 768px */
        @media (max-width: 768px) {
            /* Global */
            .list-container {
                width: auto;
            }
            
            /* Hero */

            /* Marketing Hero NEW */
            .hero-marketing-ecommerce .full-bg-img-child {
                background: url(../img/marketing-ecommerce-hero-mobile-2018.jpg) center top no-repeat;
                background-size: contain;
            }
            .hero-child h1.hero-title {
                font-size: 1.5rem;
                margin-top: 250px !important;
            }
            
            .hero-marketing-ecommerce span.font-weight-bold {
                color: #ff8c00;
            }
            h2.hero-text-subtitle {
                color: #fff !important;
                font-size: 1rem;
                text-shadow: 1px 2px 1px #000;
            }
            
            /* Section 6 - Tutors NEW uses Carousel Classes */
            #carousel-prof .carousel-item {
                margin-left: auto;
                margin-right: auto;
                min-height: 430px;
            }
            #carousel-prof .carousel-control-next svg, 
            #carousel-prof .carousel-control-prev svg {
                font-size: 4rem;
            }
            #carousel-prof .carousel-control-next,
            #carousel-prof .carousel-control-prev {
                margin-top: -70%;
                width: 10%;
            }
            #carousel-prof .carousel-control-next {
                right: 10px;
            }
            #carousel-prof .carousel-control-prev {
                left: 10px;
            }
            
            /* Section 7 - Why NextU NEW */
            .why-list .empty-icon {
                display: none;
            }
            .why-list-btn {
                text-align: center;
            }
            
    }
    
    /* Responsive min-width 769px and max-width 991px */
        @media (min-width: 769px) and (max-width: 991px) {
            /* Global */
            .list-container {
                margin-left: auto;
                margin-right: auto;
                width: 320px;
            }

            /* Hero */ 
            .hero-child h1.hero-title {
                margin-top: 350px !important;
            }
            .hero-marketing-ecommerce {
                height: auto;
            }
            
            /* Section 6 - Tutors NEW uses Carousel Classes */
            #carousel-prof .carousel-item {
                min-height: 340px;
            }
            
            /* Section 7 - Why NextU NEW */
            .why-nextu-student {
                width: 480px;
            }
            .why-list.list-container {
                width: 370px;
            }
            .why-list .empty-icon {
                width: 50px;
            }
    }
    
    /* Responsive max-width 991px */
        @media (max-width: 991px) {
            /* Global NEW */
            .m-neg-margin-x-container {
                margin-left: -15px;
                margin-right: -15px;
            }
            .m-zero-padding-x-container {
                padding-left: 0;
                padding-right: 0;
            }

            /* Hero */    
            .hero-marketing-ecommerce .full-bg-img-child {
                height: auto;
            }
            .hero-child #leadformContainer {
                margin-top: 20px;
                margin-bottom: 40px;
            }

             /* Section Intro NEW */
            h2.intro-text {
                font-size: 1.5rem;
                text-align: center;
            }
    
            .hero-child h1.hero-title {
                text-align: center;
            }
            h2.hero-text-subtitle {
                text-align: center;
            } 
    
            .top-facts-title,
            .about-list-description,
            .what-list-description,
            .tutor-text {
                font-size: 1rem;
            }
    
            .about-description,
            .how-works-text,
            .study-text,
            .tutor-name {
                font-size: 1.125rem;
                text-align: center;
            }
    
            h3.what-title,
            .tutor-subtitle,
            .bottom-banner-subtitle {
                font-size: 1.25rem;
            }
    
            .school-img {
                margin-left: auto;
                margin-right: auto;
                text-align: center;
            }
    
            /* Top Facts */
    
            .top-facts-container {
                width: 100%;
                margin-left: auto;
                margin-right: auto;
            }
    
            /* Section 1 - About */
            #about-nextu {
                padding-top: 50px;
            }
            .about-container {
                padding-bottom: 40px;
                padding-top: 40px;
            }
            .about-check {
                height: auto;
                width: 36px !important;
            } 
            ul.about-skills-list {
                font-size: .925rem;
            }
    
            /* Section 2 - Impact Banner */
            h2.impact-title {
                font-size: 2rem;
                text-align: center;
            }
            #impact .school-img {
                width: 225px;
            }
    
            /* Section 3 - How It Works */ 
            .what-icons {
                width: 32px !important;
                height: 32px !important;
            }
    
            /* Section 4 - Study Modules */
            .card-header {
                padding:.75rem 1rem;
            }
            .card-body {
                padding-left: 1rem;
            }
    
            /* Section 5 - Tutors */
            #carousel-prof ol.carousel-indicators {
                margin-top: 20px;
            }
            .tutor-text {
                line-height: 1.5;
                text-align: center;
            }
    
            /* Section 8 - Why NextU */
    
            .why-icon {
                height: auto;
                margin-right: 20px;
                width: 40px !important;
            }
            .why-list-description {
                font-size: 1rem;
            }
    
            /* Section 9 - Bottom Banner */
            #bottom-banner .intro-text {
                margin-bottom: 20px;
            }
    
        }
    
     /* Responsive min-width 991px */
        @media (min-width: 991px) {
            
            /* Global */
            
            /* Hero */
            .hero-child #leadformContainer {
                margin-top: 60px;
            }
            .hero-marketing-ecommerce {
                height: 645px;
            }  
            .hero-text-container {
                margin-top: 320px;
            } 
    
            /* Top Facts */
            .top-facts-container {
                margin-top: -75px;
                padding-top: 0;
            }
        }   
    @media (min-width: 0px) and (max-width: 360px) {   
            
        .card-header .btn small {
            display: block;
            font-size: 0.85rem;
            font-weight: 600;
          /*  border: 1px solid;*/
            padding: 10px;
            width: 100%;
            word-wrap: break-word;
        }
            }
    
    
    
    
    
    /* Responsive min-width 992px and max-width 1200px */
        @media (min-width: 992px) and (max-width: 1200px) {   
            
            /* Section 1 - About NEW */
            .about-girl-desktop {
                width: 400px;
            }

            /* Section 2 - Impact Banner */
            .impact-arrow {
                margin-bottom: 30px;
            }
            h2.impact-title {
                font-size: 2.25rem;
            }

             /* Section Intro NEW */
            h2.intro-text {
                font-size: 1.5rem;
            }
            .about-list-description,
            ul.about-skills-list,
            .what-list-description {
                font-size: 1rem;
            }
            .about-description,
            .how-works-text,
            .study-text,
            .tutor-name,
            .why-list-description {
                font-size: 1.125rem;
            }
    
            h3.what-title,
            .tutor-subtitle,
            .bottom-banner-subtitle {
                font-size: 1.25rem;
            }

            /* Section 7 - Why NextU NEW */
            .why-icon {
                margin-right: 20px;
                width: 40px;
            }
            .why-list .empty-icon {
                width: 60px;
            }
            .why-list-description {
                font-size: 1.125rem;
            }

            /* Section 9 - Bottom Banner */
            #bottom-banner .intro-text {
                margin-bottom: 20px;
            }
            
        }
    /* Responsive min-width 1200px NEW, this should be included in BS4 Core */
    @media (min-width: 1200px) { 
        .d-xl-block {
            display: block !important;
        }
    }
    .btn{

        outline:none;

    }