:root{
    --primary: #00005a;
    --secondary: #0b99d0;
}

body{
    font-family: 'Montserrat', sans-serif;
    background-color: #00005a;
    color: #fff;
}

.hero{
    height: 100vh;
    background-image: url("../assets/promo/3x17/promo.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
}

.heroDone{
    padding: 200px 200px 40px 200px;
    background-image: url("../assets/promo/3x17/edit/asset1.png");
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
}

.cat{
    padding: 0 200px 50px 200px;
    background-image: url("../assets/promo/3x17/edit/asset1.png");
    background-attachment: fixed; 
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
}

.cat .col-sm-6{
    text-align: center;
    font-weight: 600;
    padding: 50px;
    background-color: #0b99d0;
}
.cat .col-sm-6 h6{
    font-weight: 400;
    color: #fff;
    opacity: 1;
}

/*ABOUT*/
.about{
    padding: 100px 200px 100px 200px;
    background-image: /* linear-gradient(to top, var(--secondary), var(--primary)),*/  url("../assets/promo/3x17/edit/asset1.png");
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
}

/*COURSES*/
.courses{
    padding: 100px 200px 100px 200px;
    background-image: url("../assets/promo/3x17/edit/asset1.png");
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    
}

/*PROGRAMMING*/
.programacao{
    padding: 100px 150px 100px 150px;
    background-image: url("../assets/promo/3x17/edit/asset1.png");
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    
}

/*17DEMAIO*/
.maio{
    padding: 100px 200px 100px 200px;
    background-image: linear-gradient(to top, #0c0d5a93, var(--primary)), url("../assets/promo/3x17/internet.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
}

/*17DEMAIO*/
.signup{
    padding: 100px 200px 100px 200px;
    background-image: url("../assets/promo/3x17/edit/asset2.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
}

/*FOOTER*/
.footer{
    padding: 100px 200px 100px 200px;
    background-image: url("../assets/promo/3x17/edit/asset2.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    background-attachment: fixed;
}


/*MOBILE*/
@media (max-width: 576px) {
    .heroDone{
        padding: 100px 0 20px 0;
    }
    .cat{
        padding: 0px 0 50px 0;
    }

    .about{
        padding: 100px 0 100px 0;
    }

    .courses{
        padding: 100px 0 100px 0;
        text-align: center;
    }

    .programacao{
        padding: 100px 0 100px 0;
        text-align: center;
    }
    .programacao .col-sm{
        padding-bottom: 20px;
        text-align: center;
    }

    .maio{
        padding: 100px 0 100px 0;
    }

    .signup{
        padding: 100px 0 100px 0;
    }

    .footer{
        padding: 100px 50px 100px 50px;
    }

}

@media (max-width: 768px) {
     
    .heroDone{
        padding: 100px 0 100px 0;
    }

    .about{
        padding: 100px 0 100px 0;
    }

    .courses{
        padding: 100px 0 100px 0;
        text-align: center;
    }

    .maio{
        padding: 100px 0 100px 0;
    }

    .signup{
        padding: 100px 0 100px 0;
    }

    .footer{
        padding: 100px 50px 100px 50px;
    }

}
@media (max-width: 1199.98px) {
    .heroDone{
        padding: 100px 0 100px 0;
    }

    .about{
        padding: 100px 0 100px 0;
    }

    .courses{
        padding: 100px 0 100px 0;
        text-align: center;
    }

    .maio{
        padding: 100px 0 100px 0;
    }

    .signup{
        padding: 100px 0 100px 0;
    }

    .footer{
        padding: 100px 50px 100px 50px;
    }
}