.pc {
	display: block;
}

.mobile {
	display: none;
}

.grande {
    display: none;
}

@media (max-width: 750px) {
	.pc {
		display: none !important;
	}

    .grande {
        display: none !important;
    }

	.mobile {
		display: block !important;
	}
    
    .espaco {
        height: 30px;
        position: relative;
        top: 0;
        right: 0;
        left: 0;
        display: none;
    }

    .headermob {
        padding: 10px 0;
        position: relative;
        z-index: 9;
        top: 0;
        right: 0;
        left: 0;
        background: transparent;
    }

    .headermob a.logo {
        width: fit-content;
        margin: 0;
        display: block;
    }

    .headermob a.logo img.fora {
        width: 180px;
    }

    .headermob .col-4 {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .headermob .collapse {
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .iconmob {
        width: fit-content;
        margin: 0;
        background: #fff;
        padding: 2px 5px;
        border-radius: 5px;
        border: 1px solid #397CC6;
        z-index: 99999999 !important;
        position: fixed;
        top: 20px;
        right: 15px;
    }

    .bar1, .bar2, .bar3 {
       width: 40px;
       height: 5px;
       background-color: #397CC6;
       border-radius: 10px;
       margin: 6px 0;
       transition: 0.4s;
    }

    .sidenav {
        display: none;
        height: 100%;
        width: 0;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        background-color: #2d2e89c2;
        backdrop-filter: blur(30px);
        -webkit-backdrop-filter: blur(30px);
        overflow-x: hidden;
        padding-top: 110px;
        transition: 0.5s;
        z-index: 9999 !important;
    }

    .sidenav .closebtn {
        position: absolute;
        top: -70px;
        right: 60px;
        font-size: 46px;
        margin-left: 50px;
        color: black;
        text-decoration: none;
    }

    .headermob .submenumob a.logo {
        display: block;
        margin: auto;
    }

    .headermob .sidenav ul.redes {
        list-style: none;
        padding: 0;
        justify-content: space-evenly;
    }

    .headermob .mais a.fone {
       text-align: end;
       display: block;
       color: #38642f;
    }

    .headermob .sidenav ul.links {
        list-style: none;
        padding: 10px;
    }
 
    .headermob .sidenav ul li a {
        color: #fff;
        margin: 25px 0;
        display: block;
        font-weight: bold;
        font-size: 20px;
        text-align: center;
        letter-spacing: 1px;
    }

    .headermob .sidenav #sub a {
        color: #fff;
        margin: 25px 0;
        display: block;
        font-weight: bold;
        font-size: 20px;
        text-align: center;
        letter-spacing: 1px;
    }
    .headermob a.bot {
        background: #f5853e;
        color: #fff;
        padding: 20px;
        text-decoration: none;
        text-align: center;
        border-radius: 51px;
        transition: .5s;
        margin: auto;
        display: block;
        width: fit-content;
        font-size: 18px;
    }
    
    .change .bar1 {
        -webkit-transform: rotate(-45deg) translate(-9px, 6px);
        transform: rotate(-45deg) translate(-9px, 6px);
    }

    .change .bar2 {
        opacity: 0;
    }

    .change .bar3 {
        -webkit-transform: rotate(45deg) translate(-8px, -8px);
        transform: rotate(45deg) translate(-8px, -8px);
    }

    .infobanner {
        min-height: 780px !important;
        align-items: flex-end !important;
        padding: 40px 20px !important;
        background-color: #2d2e89;
        text-align: center;
    }

    .infobanner .afasta {
        transform: translate(0rem, 0px) !important;
    }

    .infobanner.banner1 {
        background-image: url(../img/banner-home-mobile.webp) !important;
        background-size: cover;
        background-repeat: no-repeat; 
    }

    .infobanner h1 {
        font-size: 32px !important;
    }
    .infobanner h1 b {
        border-bottom: none !important;
        font-weight: 700;
    }
    .infobanner a {
        margin: 10px auto !important;
    }

    .bemvindo {
        padding: 4rem 0;
        text-align: center;
        background-image: url("../img/banner-welcome.webp");
        background-repeat: no-repeat;
        background-size: 100% 55%;
        background-position: bottom;
        position: relative;
    }

    .bemvindo img.fundo {
        position: absolute;
        z-index: -1;
        right: 0;
        top: 0;
        max-width: 380px;
    }
    
    .bemvindo section.timeline-carousel {
        overflow: visible;
    }

    .bemvindo .timeline-carousel .slick-list {
        overflow: visible;
    }

    .bemvindo .timeline-carousel__item-inner {
        padding: 0 20px;
        position: relative;
        cursor: grab;
    }

    .bemvindo img {
        margin-bottom: 20px;
        width: 100%;
    }

    .bemvindo h4 {
        color: #397CC6;
        margin: 0;
    }

    .bemvindo h2 {
        color: #397CC6;
        font-weight: 700;
        margin-bottom: 30px;
        font-size: 36px;
    }

    .bemvindo h3 {
        color: #fff;
        font-size: 26px;
        font-weight: 700;
    }

    .bemvindo p {
        color: #fff;
        padding: 0 10px;
    }

    .bemvindo a {
        display: block;
        width: fit-content;
        padding: 10px 20px;
        border-radius: 30px;
        background: #78B52E;
        margin: 10px auto;
        color: #fff;
        transition: .2s;
        text-decoration: none;
    }

    .bemvindo a:hover {
        text-decoration: none;
        color: #fff;
        transform: scale(1.05);
    }

    .bemvindo .slick-dots {
        display: flex;
        list-style: none;
        gap: 10px;
        margin: auto;
        padding: 0;
        justify-content: center;
    }
    .bemvindo .slick-dots button {
        background: #fff;
        border: none;
        width: 15px;
        height: 15px;
        border-radius: 40px;
        color: transparent;
    }

    .escolha {
        padding: 25rem 1rem 4rem !important;
        background-size: 100% !important;
        background-position: top !important;
        text-align: center;
    }

    .escolha h2 {
        font-size: 36px;
        margin-bottom: 30px !important;
    }

    .escolha p {
        padding: 0 2rem;
    }

    .escolha .row {
        gap: 2rem;
    }

    .escolha .botoes {
        gap: 1rem !important;
        flex-direction: column;
    }

    .escolha a {
        width: 75% !important;
        padding: 10px 10px !important;
        margin: auto;
    }

    .custon {
        text-align: center;
        background-image: none !important;
    }

    .custon h2 {
        margin-bottom: 30px !important;
    }

    .custon span {
        margin-bottom: 20px !important;
        font-size: 18px;
    }
    .custon a {
        margin: 10px auto !important;
    }
    .depoimentos {
        text-align: center;
        padding: 4rem 0;
        min-height: 900px !important;
        display: flex;
        background: url('../img/banner-depoimentos-mob.webp') !important;
        background-repeat: no-repeat;
        background-size: cover;
        align-items: flex-end;
        margin: -0px 0 0 !important;
    }

    .depoimentos img.aspas {
        width: 70px;
    }

    .depoimentos .cada {
        display: flex;
        gap: 1rem;
        align-items: center;
        flex-direction: column;
    }
    .depoimentos .carousel-inner {
        width: 100% !important;
    }
    .depoimentos h2 {
        border-bottom: none !important;
    }
    .depoimentos .carousel-control-next, .depoimentos .carousel-control-prev {
        width: 10% !important;
        height: 55% !important;
    }
    .rodape .superior {
        justify-content: space-between;
        padding: 0 !important;
        gap: 0px !important;
        border-bottom: none !important;
        flex-direction: column;
        align-items: initial !important;
    }

    .rodape .superior a.logo {
        display: block;
        width: fit-content;
        margin: 0 0 30px;
    }

    .rodape .superior h4 {
        padding: 20px 0 0;
        border-top: 1px solid #fff;
        font-size: 32px;
    }

    .rodape .inferior{
        gap: 1rem;
        display: flex;
        flex-direction: column-reverse;
    }

    .aboutus {
        padding: 15rem 15px 4rem !important;
        background-size: 100% !important;
        background-position: top right !important;
    }

    .residencial {
        padding: 26rem 15px 4rem !important;
        background-size: 100% !important;
    }
    .tipo {
        padding: 4rem 0 0 !important;
    }
    .tipo .grade .caixa {
        width: 100% !important;
        padding: 2rem !important;
    }
    .comercial {
        padding: 28rem 15px 4rem !important;
        background-size: 100% !important;
    }
    .comercial2 {
        padding: 28rem 15px 4rem !important;
        background-image: url('../img/photo-commercial.webp');
        background-repeat: no-repeat;
        background-position: top !important;
        background-size: 100% !important;
    }
    .comercial2 {
        padding: 28rem 15px 4rem !important;
        background-position: top !important;
        background-size: 100% !important;
    }
    .comercial2 h2 {
        margin-bottom: 50px !IMPORTANT;
        text-align: initial !important;
    }
    .mapa .row{
        flex-direction: column-reverse;
    }
    .contato .infos {
        flex-direction: column;
    }
    .contato .infos .cada {
        flex-direction: column;
        text-align: center;
    }
    .contato .infos .cada a {
        font-size: 18px !important;
    }
    #request .caixa {
        padding: 1.5rem !important;
    }
    #request .modal-dialog {
        max-width: 95% !important;
        margin: 1.75rem auto;
    }
    #request .caixa .topo {
        flex-direction: column;
        gap: 30px !important;
    }
    #request .caixa .topo img.logo {
        border-right: none !important;
    }
    .control .cada img {
        width: 30px !important;
        margin-bottom: 5px;
    }
    .control a {
        width: 75px !important;
    }
    .rodape .inferior nav {
        justify-content: space-between;
        flex-direction: column;
        align-content: space-around;
    }
}


@media (min-width: 1600px) and (max-width: 1730px) {
    .infobanner {
        min-height: 440px !important;
    }
}


@media (min-width: 1731px) {
    .infobanner {
        min-height: 660px !important;
    }
    .depoimentos {
        padding: 9rem 0 !important;
        min-height: 860px !important;
        margin: -285px 0 0 !important;
    }
    .custon {
        padding: 6rem 15px 14rem !important;
    }
    .tipo {
        margin: 0 0 160px;
    }
} 

@media (max-width: 1200px) and (min-width:  750px) {
    .header .menu {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .header .menu nav a {
        font-size: 14px !important;
    }
    .infobanner {
        min-height: 540px !important;
    }
    .infobanner h1 {
        font-size: 32px !important;
    }
    .planosindex h1 {
        font-size: 32px !important;
    }
    .sobre h1 {
        font-size: 32px !important;
    }
    .sobre p {
        font-size: 14px !important;
    }
    .quem h1 {
        font-size: 32px !important;
    }
    .quem p {
        font-size: 14px !important;
    }
    .bannerinvestidor h1 {
        font-size: 30px !important;
    }
    .perguntas .tab button {
        padding: 10px 15px !important;
        font-size: 12px !important;
        width: 170px !important;
    }
    .perguntas .tab {
        flex-wrap: wrap;
    }
    .formcontato {
        background-size: 35% 100% !important;
        background-attachment: fixed;
    }
    
}