* {
    padding: 0;
    margin: 0;
    font-family: 'Open Sans', sans-serif;
}

:root {
    --blue: #0060A7;
    --blue-black: #052C4C;
    --blue-hover: #007DD9;
    --white: #fff;
    --orange: #FE6A01;
    --orange-hover: #ff8228;
    --shadow: #333333;
    --grey-black: #7c7c7c;
    --grey-back: #f5f5f5;
    --grey: #7e7e7e;
    --grey-letter: #686565;
    --test-color: #d1d1d1;
    --grey-place: #b3b3b3;
    --grey-card: #F6F5F5;
}


/*Barra de Contato*/

.nav_info {
    background-color: var(--blue);
    width: 100%;
    box-shadow: 0 .5rem 2rem var(--shadow);
    position: fixed;
    z-index: 5;
}

.logo img,
.logo_footer img {
    width: 12rem;
}

.nav_itens {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 15rem;
}

.contato {
    color: var(--white);
    text-align: center;
}

.contato a {
    color: var(--white);
    text-decoration: none;
}

.contato p {
    text-transform: uppercase;
    font-size: .8rem;
}

.contato h1 {
    font-size: 2.5rem;
    font-weight: bold;
}

.contato h1:hover {
    text-decoration: underline;
}

.cliente button {
    background-color: var(--white);
    border: 1px solid var(--white);
    border-radius: 20px;
    color: var(--orange);
    padding: 1rem;
    font-size: .9rem;
    text-transform: uppercase;
    font-weight: bold;
}

.cliente button:hover {
    background-color: var(--orange);
    border: 1px solid var(--orange);
    color: var(--white);
    cursor: pointer;
}


/*Banner Principal*/

.banner_principal,
.footer_info {
    background-color: var(--grey-back);
}

.banner_principal img {
    width: 100%;
    padding-top: 5.5rem;
}


/*Conteudo*/

main {
    padding: 2rem 5rem;
    background-color: var(--grey-back);
}


/*Formulário*/

.formulario {
    padding-bottom: 2rem;
    text-align: center;
}

.form_itens h1 {
    font-size: 2rem;
    color: var(--blue);
    font-weight: 800;
}

.form_itens h2 {
    font-size: 1.5rem;
    font-weight: normal;
    color: var(--grey);
    padding-bottom: 1.5rem;
}

.form {
    display: flex;
    align-items: center;
    justify-content: center;
}

.box_form {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: .5rem;
}

.box_form label {
    margin-left: -11rem;
    padding-bottom: .2rem;
    font-size: .8rem;
}

.box_form label span {
    font-weight: bold;
    text-transform: uppercase;
}

#cidade {
    width: 25rem;
    height: 3rem;
    padding-left: 1rem;
    border-radius: .2rem;
    border: 1px solid var(--test-color);
    font-size: 1rem;
}

.box_form input::placeholder {
    color: var(--grey-place);
}

.form button {
    margin-top: 1.25rem;
    width: 5.5rem;
    height: 3rem;
    background-color: var(--orange);
    border: 1px solid var(--orange);
    border-radius: .5rem;
}

.form button:hover {
    cursor: pointer;
    background-color: var(--orange-hover);
    border: 1px solid var(--orange-hover);
}

.form .bi-search {
    color: var(--white);
    font-size: 1rem;
}


/*Cards*/

.cards {
    margin: 0 3rem 0 3rem;
}

.carousel-cards {
    display: flex;
    align-items: center;
    justify-content: center;
}

.card {
    width: 22rem;
    background-color: var(--white);
    /*padding: 1rem;*/
    margin: .5rem;
    box-shadow: 0 7px 15px rgb(211, 211, 211);
    border-radius: .5rem;
}

.header_card {
    background-color: var(--blue);
    padding: 1.5rem 1rem;
    text-align: center;
    border-radius: .5rem .5rem 0 0;
}

.header_card h3 {
    color: var(--white);
    text-transform: uppercase;
    font-size: 1.8rem;
}

.section_column {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.section_column1 {
    text-align: left;
}

.align_3 {
    text-align: right;
}

.section_card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.item_section h4 {
    color: var(--blue);
    font-weight: normal;
    font-size: .95rem;
}

.item_section h5 {
    color: var(--blue);
    text-transform: uppercase;
    font-size: .95rem;
}

.item_linha1 {
    margin-left: 1.5rem;
}

.item_linha2 {
    margin-left: 10.4rem;
}

.item_linha3 {
    margin-left: 5.8rem;
}

.item_linha3Card {
    margin-left: 5.2rem;
}

.item_linha3Card3 {
    margin-left: 4.6rem;
}

.divisor {
    border-bottom: 2px solid var(--grey-card);
    width: 100%;
    margin: .5rem 1rem;
}

.section_card {
    padding: 1rem;
}

.section_card_price,
.footer_card,
.card_extra,
.card_extra_rodape {
    background-color: var(--grey-card);
}

.section_card_price {
    text-align: center;
}

.item_cardPrice h4 {
    font-weight: normal;
    padding: 2rem 0 0 0;
    margin-bottom: -0.5rem;
    font-size: 1.2rem;
    color: var(--grey);
}

.item_cardPrice h4 span {
    text-decoration: line-through;
    font-weight: normal;
}

.price {
    display: flex;
    align-items: center;
    justify-content: center;
}

.price h2 {
    font-size: 4rem;
    color: var(--blue);
}

.price h3,
.price h6 {
    color: var(--blue);
}

.price h6 {
    font-size: 1.5rem;
    margin-top: -1.5rem;
}

.price h3 {
    margin-top: 1.9rem;
    font-size: 1.5rem;
}

.price p {
    color: var(--grey);
    margin-top: 1.9rem;
    margin-left: -3rem;
    font-size: 1.3rem;
}

.card_extra {
    padding: 1rem;
    font-size: .8rem;
    color: var(--grey);
}

.card_extra span {
    font-weight: bold;
    color: var(--grey-black);
}

.section_card {
    padding: 2rem 1rem;
}

.footer_card,
.compre_agora {
    display: flex;
    align-items: center;
    justify-content: center;
}

.compre_agora {
    font-size: 1.6rem;
    background-color: var(--orange);
    border: 1px solid var(--organge);
    color: var(--white);
    padding: 1.5rem 3.5rem;
    /*margin: 1rem 1rem;*/
    text-transform: uppercase;
    border-radius: .5rem;
    font-weight: 700;
}

.compre_agora:hover {
    background-color: var(--orange-hover);
    cursor: pointer;
}

.footer_card a {
    text-decoration: none;
}

.card_extra_rodape {
    padding: 1rem;
    font-size: .7rem;
    border-radius: .5rem;
    text-align: center;
    color: var(--grey);
}


/*Carrousel*/

.slick-slide {
    margin: 0 1.1rem 0 -0.1rem;
}

.slick-next:before,
.slick-prev:before {
    font-size: 30px!important;
    color: var(--blue)!important;
    opacity: .85!important;
}

.slick-dots li.slick-active button:before {
    color: var(--blue)!important;
}

.slick-dots li button:before {
    font-size: 10px!important;
    margin-top: 1rem!important;
}

.slick-prev {
    left: -40px!important;
}

.slick-next {
    right: -30px!important;
}


/*Banners de Informação*/

.banners {
    padding: 5rem 0 2rem 0;
}

.banners_infos {
    display: flex;
    /*flex-wrap: wrap;*/
    align-items: center;
    justify-content: center;
}

.banner_info img {
    width: 22rem;
    height: 22rem;
    border-radius: .5rem;
}

.banner_info {
    margin: 0 .5rem 0 .5rem;
}

.info_banners {
    position: absolute;
    width: 19rem;
    padding: 2rem 0 0 3rem;
}

.info_banners h2,
.info_banners p {
    color: var(--white);
}

.info_banners h2 {
    font-size: 1.7rem;
    width: 15rem;
}

.info_banners p {
    font-size: .9rem;
    width: 15rem;
}

.info_satelite {
    padding-top: 11rem;
}

.info_instalacao {
    padding-top: 10rem;
}

.info_wifi {
    padding-top: 7.5rem;
}


/*Informações e Vídeo*/

.video iframe {
    border-radius: .5rem;
}

.whats_video {
    display: flex;
    align-items: initial;
    justify-content: center;
    margin: 5rem 0 5rem 0;
}

.info_whatsapp h2 {
    font-size: 1.8rem;
    width: 27rem;
    text-transform: uppercase;
    color: var(--blue);
    font-weight: 800;
}

.info_whatsapp p {
    font-size: 1.2rem;
    width: 24rem;
    /*text-align: justify;*/
    padding-top: 2rem;
    color: var(--grey-letter);
}


/*Rodapé*/

.footer_info {
    background-color: var(--blue-black);
    width: 100%;
    height: 8rem;
}

.footer_itens {
    padding: 1.5rem 15rem;
    display: flex;
    align-items: inherit;
    justify-content: space-between;
}

.footer_itens {
    color: var(--white);
}

.info_sobre h3,
.info_atendimento h3,
.info_compre h3 {
    text-transform: uppercase;
}

.info_sobre a,
.info_atendimento a,
.info_compre a {
    text-decoration: none;
    color: var(--white);
}

.info_sobre a:hover,
.info_atendimento a:hover,
.info_compre a:hover {
    text-decoration: underline;
}

.info_sobre p,
.info_atendimento p {
    font-size: 1rem;
    padding-top: .2rem;
}

.phone_compre {
    font-size: 1.75rem;
    font-weight: 700;
}


/*Desktop*/

@media(min-width:1100px) and (max-width:1350px) {
    .nav_itens,
    .footer_itens {
        padding: 1rem 5rem;
    }
}

@media(min-width:1350px) and (max-width:1500px) {
    .nav_itens,
    .footer_itens {
        padding: 1rem 10rem;
    }
}

@media(min-width:1500px) and (max-width:1600px) {
    .cards {
        margin: 0 8rem 0 8rem;
    }
}

@media(min-width:1680px) {
    .cards {
        margin: 0 15rem 0 15rem;
    }
}


/*Tablet*/

@media(min-width:768px) and (max-width:1100px) {
    .nav_itens,
    .footer_itens {
        padding: 1rem 2rem;
    }
    .banner_info img {
        width: 14rem;
        height: 14rem;
        border-radius: .5rem;
    }

    .whats_video {
        flex-direction: column;
        align-items: center;
    }
    .info_whatsapp h2 {
        width: 45rem;
        font-size: 1.8rem;
        margin-left: 3.5rem;
    }
    .info_whatsapp p {
        padding-bottom: 1rem;
        width: 40rem;
        margin-left: 3.5rem;
        font-size: .95rem;
    }

    .bi-arrow-right {
        display: none;
    }
    /*
    .info_banners {
        padding: 1.5rem 0 0 2rem;
    }*/

    .info_banners h2 {
        font-size: 1.6rem;
        margin-left: .5rem;
    }

    .info_banners p {
        width: 13rem;
        margin: -1.5rem 0 0 .5rem;
    }
    .info_satelite {
        padding-top: 7.5rem;
    }
    .info_instalacao {
        padding-top: 6.5rem;
    }
    .info_wifi {
        padding-top: 4rem;
    }


    .cards {
        margin: 1rem;
    }
    .section_column {
        justify-content: space-between;
    }
    .item_section h4 {
        font-size: .52rem;
    }
    .item_section h5 {
        font-size: .58rem;
    }
    .section_card {
        padding: .5rem;
    }
    .compre_agora {
        font-size: .65rem;
    }
    .card_extra {
        font-size: .65rem;
    }
    .card_extra_rodape {
        font-size: .6rem;
    }
    .info_banners img {
        width: 100%;
    }
    .info_whatsapp h2 {
        width: 100%;
        font-size: 1.5rem;
        margin-top: -3rem;
    }
    .info_whatsapp p {
        width: 100%;
        font-size: 1.1rem;
    }

    .info_banners {
        width: 0;
        padding: 0;
    }

    main {
        padding: 3rem;
    }

    .contato h1 {
        font-size: 1.7rem;
    }

    .info_compre,
    .info_atendimento,
    .phone_compre {
        font-size: 1rem;
    }

    .info_compre h3,
    .phone_compre h3,
    .info_atendimento h3,
    .info_sobre h3 {
        font-size: .8rem;
    }

    .info_sobre p {
        font-size: .7rem;
    }

    .logo_footer img {
        width: 8rem;
    }
}

@media (min-width:767px) {
    .banner_mobile {
        display: none;
    }
}


/*Mobile*/

@media (max-width: 767px) {
    .nav_info {
        width: 100%;
    }
    .nav_itens {
        padding: 1rem;
    }
    .nav_itens .logo img {
        margin-right: .5rem;
    }
    .logo img,
    .logo_footer img {
        width: 8rem;
    }
    .banner_principal {
        display: none;
    }
    .banner_mobile img {
        margin-top: 4.5rem;
        width: 100%;
    }
    .contato h1 {
        font-size: 1.3rem;
    }
    .cliente {
        display: none;
    }
    main {
        padding: 1rem 2rem;
    }
    .form_itens h1 {
        font-size: 1.7rem;
        margin-bottom: .5rem;
    }
    .form_itens h2 {
        font-size: 1.1rem;
    }
    .form {
        flex-direction: column;
        width: 100%;
    }
    .box_form label {
        margin-left: -0.1rem;
    }
    .form button {
        width: 80%;
    }
    #cidade {
        width: 100%;
    }
    .cards {
        margin: 1rem;
    }
    .section_column {
        justify-content: space-between;
    }
    .item_section h4 {
        font-size: .68rem;
    }
    .item_section h5 {
        font-size: .72rem;
    }
    .compre_agora {
        font-size: 1rem;
    }
    .card_extra {
        font-size: .65rem;
    }
    .card_extra_rodape {
        font-size: .6rem;
    }
    .info_banners img {
        width: 100%;
    }
    .info_whatsapp h2 {
        width: 100%;
        font-size: 1.5rem;
        margin-top: -3rem;
    }
    .info_whatsapp p {
        width: 100%;
        font-size: 1.1rem;
    }
    .bi-arrow-right {
        display: none;
    }
    .video iframe {
        width: 100%;
        margin-top: 2rem;
        margin-bottom: -3rem;
    }
    .banners_infos,
    .whats_video {
        flex-direction: column;
    }
    .footer_itens {
        flex-direction: column;
        text-align: center;
        padding: 1.5rem 2rem;
    }
    .footer_info {
        height: 100%;
    }
    .logo_footer,
    .info_sobre,
    .info_atendimento {
        margin-bottom: 2rem;
    }
    .info_sobre a {
        text-decoration: underline;
    }
}