/* ---------------------------------------------------------------------------------------------------- */
/* MODELO DE ORGANIZAÇÃO DO CSS */

/* selector { */

/* 0 SASS INHERITANCE*/
/* @extend, @mixin, e.g. clearfix */

/* 1 GENERATED CONTENT */
/* content */

/* 2 POSITION AND LAYOUT */
/* positiony, z-index, top, bottom, left, right, Flexbox properties, float, clear */

/* 3 DISPLAY AND VISIBILITY */
/* display, opacity, transform */

/* 4 CLIPPING */
/* overflow, clip  */

/* 5 ANIMATION */
/* animation, transition */

/* 6 BOX MODEL (FROM OUTSIDE IN) */
/* margin, box-shadow, border, border-radius, box-sizing, width, height, padding */

/* 7 BACKGROUND */
/* background, cursor */

/* 8 TYPOGRAPHY */
/* font-size, line-height, font-family, font-weight, font-style, text-align, text-transform, word-spacing, color */

/* 9 PSEUDO-CLASSES & PSEUDO-ELEMENTS (NESTED RULES) */
/* :hover, :focus, :active, :before, :after, :first-child, :last-child */

/* } */
/* ---------------------------------------------------------------------------------------------------- */

/* ================================================== */
/*                        GERAL                       */
/* ================================================== */
body {
    /* 8 TYPOGRAPHY */
    font-family: sans-serif;
}

h1 {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 40px 0 0;
    
    /* 8 TYPOGRAPHY */
    color: #3c184e;
    text-align: center;
    font-weight: 800;
    font-size: 60px;
}

h2 {
    /* 8 TYPOGRAPHY */
    text-align: center;
}

a {
    /* 8 TYPOGRAPHY */
    text-align: center;
    text-decoration: none;
    color: white;
}

.negrito {
    /* 8 TYPOGRAPHY */
    font-weight: 700;
    font-style: italic;
}

/* ================================================== */
/*               SEÇÃO 1 - CAPA (BANNER)              */
/* ================================================== */
.capa {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 1024px;
    margin: 0 auto;
}

.imagem-logo {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 30px;
    margin-right: 5px;
}

.logo {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    max-width: 250px;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
}

.empresa {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 0 5px 0;
    
    /* 8 TYPOGRAPHY */
    font-size: 35px;
}

.mote {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0;

    /* 8 TYPOGRAPHY */
    font-size: 14px;
    font-weight: lighter;
    text-align: center;
}

.container-titulo {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    border: 0px solid #3c184e;
    box-shadow:  0 8px 32px #1f26875e;
    border-radius: 10px;
    margin: 70px auto 0 auto;
    padding: 40px;
    max-width: 1024px;

    /* 7 BACKGROUND */
    background-color: #ffffffc4;
 }

 .titulo {
    /* 8 TYPOGRAPHY */
    font-weight: 800;
    color: #3c184e;
    text-align: center;
 }

.fale {
    /* 2 POSITION AND LAYOUT */
    align-items: center;
    
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 auto 0 auto;
    border-radius: 10px;
    width: 200px;
    height: 20px;
    padding: 10px 25px;

    /* 7 BACKGROUND */
    background-color: #3c184e;

    /* 8 TYPOGRAPHY */
    text-align: center;
    text-decoration: none;
    color: white;
    font-size: 20px;

    .logowhatsapp {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 20px;
    }
}

/* ================================================== */
/*                 SEÇÃO 2 - SERVIÇOS                 */
/* ================================================== */
.servicos {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 1024px;
    margin: 0 auto;

    /* 7 BACKGROUND */
    background-color: #ffffff;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
}

.imgservicos {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    border: 0px solid black;
    padding: 10px;
    box-shadow: 3px 6px 10px 6px #0000005c;
    max-width: 800px;
    margin: 0 auto;
    border-radius: 5px;

    /* 7 BACKGROUND */
    background-color: #ffffff;

    /* 8 TYPOGRAPHY */
    text-align: center;
}   


/* ================================================== */
/*          SEÇÃO 3 E 5 - REDES SOCIAIS COMUM         */
/* ================================================== */
.redes1, .redes2 {
    /* 2 POSITION AND LAYOUT */
    align-items: center;

    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    padding: 80px 80px;
    margin: 90px auto;
    width: 800px;

    /* 7 BACKGROUND */
    background-color: #3c184e;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    text-align: center;
}

.redes1 p, .redes2 p {
    /* 8 TYPOGRAPHY */
    color: white;
    font-size: 40px;
    font-weight:lighter;
}

.redes1 img, .redes2 img {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 50px;
    height: 50px;
    margin: 0 20px;
}



/* ================================================== */
/*                   SEÇÃO 4 - MARCAS                 */
/* ================================================== */
.marcas {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 1024px;
    margin: 0 auto;
    padding: 20px 80px;

    /* 7 BACKGROUND */
    background-color: #ffffff;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    text-align: center;
}

.marcas h3 {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin:0 0 45px 0;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    font-size: 36px;
}

.marcas-1, .marcas-2, .marcas-3 {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 auto;
    width: 800px;
}

.marcas img {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 148px;
    height: 148px;
    margin: 0 15px;

    /* 7 BACKGROUND */
    background-color: #ffffff;

    /* 8 TYPOGRAPHY */
    text-align: center;
}

/* ================================================== */
/*                  SEÇÃO 6 - MAPA                    */
/* ================================================== */
.mapa {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 auto;
    padding: 120px 80px;

    /* 7 BACKGROUND */
    background-color: #ffffff;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    text-align: center;  
}

.mapa h3 {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 0 45px 0;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    font-size: 36px;
}

.mapa p {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    margin: 0 0 45px 0;

    /* 8 TYPOGRAPHY */
    color: #3c184e;
    font-size: 20px;
}

.mapa iframe {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    width: 800px;
    height: 450px;
}

/* ================================================== */
/*               SEÇÃO 7 - COPYRIGHT                  */
/* ================================================== */
.rodape {
    /* 6 BOX MODEL (FROM OUTSIDE IN) */
    height: 18px;
    padding: 10px;

    /* 7 BACKGROUND */
    background-color: #3c184e;

    /* 8 TYPOGRAPHY */
    color: white;
    text-align: center;
    font-size: 12px;