@media(max-width:770px) {
    body {
        width: 98.1%;
    }

    /*CODIGO RESPONSAVEL PELO HEADER*/

    header {
        height: 60px;
        width: 100%;
    }

    .menu-icon {
        display: block;
        cursor: pointer;
        z-index: 10;
    }

    nav ul {
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: left;
        flex-direction: column;
        transform: translateX(100%);
        transition: transform 0.6s ease-in;
        z-index: 100;
        background-color: #ffffff;
    }

    nav ul.open {
        transform: translateX(0);
    }

    nav ul li {
        margin: 1px 0;

    }

    nav ul li a {
        position: relative;
        top: -225px;
        font-size: 1.1rem;


    }

    /*CODIGO LOGIN MOBILE*/
    .login-margin {
        margin-left: 0px;

    }

    #back-color-button button {
        position: relative;
        top: -210px;
        margin-left: 8px;
    }

    /*CODIGO BOTAO CLOSE*/

    .close-button img {
        position: relative;
        top: -130px;
        height: 40px;
        width: 40px;
        display: block;
        margin-left: 265px;
        display: block;
    }

    span#logo-site img {
        position: relative;
        top: 5px;
        left: -32%;
        height: 30px;


    }

    /*CODIGO SLIDE MOBILE*/

    .slide-principal {
        position: relative;
        top: -5px;
        width: 95%;
    }

    .slide-principal h1 {
        font-size: 22px;
    }

    .slide-principal p {
        font-size: 14px;
    }

    .info-baixo-slide .div-cmr {
        position: relative;
        top: 0px;
        font-size: 12px;
    }

    /*CODIGO 3 COLUNAS ABAIXO DO SLIDE*/

    .ano-geos-parc {
        position: relative;
        top: 30px;
        margin-left: 70px;
    }

    .ano-geos-parc .ano {
        position: relative;
        top: 50px;
        height: 60px;
        width: 100px;
        margin-left: -50px;
    }

    .ano-geos-parc .ano h1 {
        font-size: 15px;
        position: relative;
        top: -35px;
        margin-left: -25px;
    }

    .ano-geos-parc .ano p {
        font-size: 15px;
        position: relative;
        top: -125px;
        margin-left: -25px;
    }

    .hr-mobile-anos {

        position: relative;
        top: -20px;

    }

    .ano-geos-parc .geos {
        position: relative;
        top: 50px;
        height: 60px;
        width: 70px;
        margin-left: 10px;
    }

    .ano-geos-parc .geos h1 {
        font-size: 15px;
        position: relative;
        top: -35px;
        margin-left: -25px;
    }

    .ano-geos-parc .geos p {
        font-size: 15px;
        position: relative;
        top: -125px;
        margin-left: -25px;
    }

    .hr-mobile-geos {
        position: relative;
        top: -20px;
        margin-left: -15px;
    }

    .ano-geos-parc .parceiros {
        position: relative;
        top: 50px;
        height: 60px;
        width: 100px;
        margin-left: 10px;
    }

    .ano-geos-parc .parceiros h1 {
        font-size: 15px;
        position: relative;
        top: -35px;
        margin-left: -25px;
    }

    .ano-geos-parc .parceiros p {
        font-size: 15px;
        position: relative;
        top: -125px;
        margin-left: -25px;
    }

    .hr-mobile-parceiros {
        position: relative;
        top: -20px;
        margin-left: -15px;
    }


    /*CODIGO QUEM TRABALHA CONOSCO*/
    .quem-trabalha-com-nosco h1 {
        color: #3c393a;
        font-size: 32px;
        text-align: center;
        position: relative;
        top: 150px;
        margin-left: -1%;

    }

    .quem-trab-com-nosco-1 {
        width: 100%;
        margin-left: -10px;
    }

    .quem-trab-com-nosco-1 p {
        width: 90%;
        margin-left: 20px;
    }

    .quem-trabalha-com-nosco {
        position: relative;
        top: -90px;
        width: 99%;
    }

    .quem-trab-geral {
        display: block;
        position: relative;
        top: -100px;

    }

    .quem-trab-com-nosco-2 {
        margin-left: -10px;
        width: 100%;
    }

    .quem-trab-com-nosco-2 p {
        width: 90%;
        margin-left: 20px;
    }

    .quem-trab-com-nosco-3 {
        width: 100%;
        margin-left: -10px;
    }

    .quem-trab-com-nosco-3 p {
        width: 90%;
        margin-left: 20px;
    }

    .quem-trab-com-nosco-2 .p-bold2 {
        position: relative;
        top: 40px;
        font-size: 16px;
        font-family: rubik-bold;
        color: black;
    }


    /*CODIGO FORMATO DE ANUNCIOS*/

    .formatos-anuncios {
        position: relative;
        top: -140px;
        width: 95%;

    }

    .formatos-anuncios h1 {
        width: 100%;
        margin-left: 10px;
    }

    .popunder {
        position: relative;
        top: 150px;
        font-weight: bold;
        margin-left: 8px;
    }


    .popunder-p1 {
        position: relative;
        top: -20px;
        text-align: center;
    }

    .formatos-anuncios img {
        position: relative;
        top: 280px;

        height: 250px;
        margin-left: -5px;

    }

    p .form-an-mobi {
        position: relative;
        top: 150px;
        width: 95%;
        margin-left: 8px;
        font-size: 16px;
        display: block;

    }

    .form-an-info-mobi {
        margin-left: 8px;
        position: relative;
        top: 150px;
    }

    .form-an-mobi {
        position: relative;
        top: 200px;
    }

    .formatos-anuncios p {
        color: #3c393a;
        font-size: 14px;
        position: relative;
        top: 310px;
        margin-left: 0px;
    }

    .menu-form-flex {
        margin-left: 0px;
    }

    /*CODIGO PORQUE ESCOLHER-NOS*/
    .porque-mob {
        position: relative;
        top: -10px;
        margin-left: -8px;
    }

    .div-por-que-nos {
        display: block;
        position: relative;
        top: 50px;
        margin-left: 0px;

    }

    .div-por-que-nos-2 {
        display: block;
        position: relative;
        top: 50px;
        margin-left: 0px;
    }

    .div-por-que-nos .plataforma-de-autoaten {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .div-por-que-nos .seguranca {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .div-por-que-nos .aten-parceiro {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .div-por-que-nos-2 .formatos {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .div-por-que-nos-2 .pagamentos {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .div-por-que-nos-2 .atin-adblock {
        border-radius: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    /*CODIGO RESPONSAVEL PELO JUNTE-SE AO PUBLISHER ADS MOBILE*/

    .junt {
        position: relative;
        top: -80px;
    }

    .junt img {
        display: none;
    }

    .junt .img-mob img {
        display: block;
    }

    .junt .campanha button {
        position: relative;
        top: 330px;
        margin-left: -20px;
        height: 40px;
        width: 220px;
        border-radius: 10px;
        border: none;
        background: white;
        color: #bb12d1;
        font-weight: bold;
    }

    .junt .junt-p-mob p {
        position: relative;
        top: 300px;
        margin-left: 2px;
        width: 97%;
    }

    .junt h1 {
        position: relative;
        top: 305px;
        margin-left: 2px;
    }

    .junt .campanha button {
        position: relative;
        top: 300px;
        margin-left: 10px;
        width: 180px;
    }

    .junt .monetize button {
        position: relative;
        top: 260px;
        margin-left: 200px;
        height: 40px;
        width: 150px;
    }

    /*CSS RODAPE E SUB*/

    footer {
        position: relative;
        top: 10px;

        height: 1800px;
    }

    footer .display-none {
        display: none;
    }

    footer .sub-rodape {
        margin-left: 5%;
        margin-right: 5%;
        position: relative;
        top: 20px;

    }

    footer .sub-rodape a {
        text-decoration: none;
        color: black;
    }

    footer .sub-rodape hr {
        position: relative;
        top: -180px;
        width: 100%;
        margin-left: -5px;
    }
}