* {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    
    body {
        font-family: 'Montserrat', sans-serif !important;
        font-size: 13px;
        overflow-x: hidden;
    }
    /* BOTAO PADRAO */
    
    .button {
        display: inline-block;
        background-color: #006837;
        color: #ffffff;
        text-transform: uppercase;
        text-decoration: none;
        font-size: 12px;
        font-weight: bold;
        padding: 10px 30px;
        margin-top: 30px;
        border-radius: 20px;
    }
    
    .button--light {
        background-color: #ffffff;
        color: #006837;
    }
    
    .button--light:hover {
        background-color: #006837;
        color: #ffffff;
    }
    
    .button--dark {
        background-color: #808080;
        color: #006837;
    }
    
    .button--dark:hover {
        background-color: #ffffff;
        color: #006837;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION NO GERAL */
    
    .default {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    
    .default .section-title {
        font-size: 28px;
    }
    
    .default .section-desc {
        font-size: 12px;
        color: #cccccc;
        margin-top: 10px;
        margin-bottom: 40px;
    }
    
    .default .section-title,
    .default .section-desc {
        font-weight: bold;
        text-align: center;
        text-transform: uppercase;
    }
    
    .default .section-body {
        max-width: 1140px;
        margin: auto;
    }
    
    .default.light {
        background-color: #f7f7f7;
    }
    
    .default.light .section-title,
    .default.light .section-body {
        color: #333333;
    }
    
    .default.dark {
        background-color: #808080;
    }
    
    .default.dark .section-title,
    .default.dark .section-body {
        color: #ffffff;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS DE ESTRUTURA PARA TOPBAR E HEADER */
    
    .default-header {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    
    .default-header .header-body {
        max-width: 1140px;
        margin: auto;
    }
    
    .topbar {
        height: 50px;
        background-color: #006837;
        color: #ffffff;
    }
    
    .section-topbar {
        height: 50px;
        display: flex;
        align-items: center;
    }
    
    .section-topbar--left {
        flex: 1;
        display: flex;
    }
    
    .section-topbar--right a {
        color: #ffffff;
        text-decoration: none;
        margin-left: 12px;
    }
    
    .section-topbar--right a:hover {
        color: #9999;
    }
    
    .section-topbar--left,
    .section-topbar--right {
        font-size: 13px;
        font-weight: 600;
    }
    
    .section-topbar--mail {
        margin-left: 10px;
    }
    
    header {
        height: 100px;
        background-color: #fff;
        border-bottom: 1px solid #eee;
    }
    
    .section-header {
        height: 100px;
        display: flex;
        align-items: center;
    }
    
    .section-header--logo {
        margin-left: 10px;
    }
    
    .section-header--logo img {
        width: 150px;
    }
    
    .section-header--menu {
        flex: 1;
        display: flex;
        justify-content: flex-end;
    }
    
    .menu-opener {
        display: none;
    }
    
    .section-header--menu ul,
    .section-header--menu li {
        list-style: none;
    }
    
    .section-header--menu a {
        display: inline-flex;
        margin-left: 10px;
        text-decoration: none;
        text-transform: uppercase;
        font-weight: 600;
        font-size: 14px;
        color: #808080;
    }
    
    .section-header--menu a.active {
        font-weight: bold;
    }
    
    .section-header--menu a:hover {
        color: #9999;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA O BANNER
        >>>O BANNER VAI PEGAR A TELA INTEIRA DO MONITOR
        MENOS A ALTURA CALCULADA PARA O TOPBAR (50PX)
        E O HEADER (100PX)*/
    
    .banner {
        height: calc(100vh - 150px);
        background-color: #333333;
        background-image: url("../../media/home-capa.jpg");
        background-size: cover;
        background-position: bottom;
        overflow: hidden;
    }
    
    .banner .sliders {
        /*width: 1000vw;*/
        height: 100%;
        padding: 0px;
    }
    
    .banner .slide {
        width: 100vw;
        height: 100%;
        display: inline-block;
        background-color: rgba(0, 0, 0, 0.8);
        padding: 0px;
    }
    
    .banner .slidearea {
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: center;
        align-items: center;
        color: #ffffff;
    }
    
    .banner h1 {
        text-transform: uppercase;
        font-weight: bold;
        font-size: 50px;
        text-align: center;
        transition: all 1s;
    }
    
    .banner h1 span {
        color: #006837;
    }
    
    .banner h2 {
        text-transform: uppercase;
        margin-top: 20px;
        text-align: center;
    }
    
    .banner .sliders-pointers {
        width: 100vw;
        height: 20px;
        position: absolute;
        margin-top: -50px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .banner .pointer {
        width: 12px;
        height: 12px;
        border: 2px solid #006837;
        border-radius: 8px;
        margin-left: 5px;
        margin-right: 5px;
        cursor: pointer;
    }
    
    .banner .pointer.active {
        background-color: #006837;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION SOBRE A FPL
        >>>A SECTION SOBRE A FPL VAI TER TRES COLUNAS IGUAIS*/
    
    .section-servicos {
        display: flex;
    }
    
    .section-servico {
        height: 100%;
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding: 15px 50px;
        margin-right: 20px;
    }
    
    .section-servico:last-child {
        margin-right: 0px;
    }
    
    .section-servico--icon {
        margin-bottom: 20px;
    }
    
    .section-servico--title {
        text-transform: uppercase;
        font-size: 17px;
        font-weight: 400;
        margin-bottom: 15px;
    }
    
    .section-servico--desc {
        font-size: 14px;
        font-weight: 300;
        text-align: center;
        color: #999;
        line-height: 23px;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION SUSTENTABILIDADE
        >>>...*/
    
    .bg-sustentabilidade {
        background-image: url(../../media/sustentabilidade.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        padding: 0px;
    }
    
    .section-sustentabilidade-area {
        background-color: rgba(0, 0, 0, 0.6);
        padding: 50px 0px;
        height: 100%;
    }
    
    .section-sustentabilidade {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: rgba(255, 255, 255, 0.7);
        border-radius: 10px;
        padding: 35px 30px 20px 30px;
    }
    
    .section-sustentabilidade--imagem {
        flex: 1;
    }
    
    .section-sustentabilidade--imagem img {
        width: 300px;
    }
    
    .section-sustentabilidade--texto {
        color: #333333;
        font-size: 17px;
        font-weight: 600;
        line-height: 45px;
        padding-left: 50px;
        padding-right: 50px;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION FOTOS
        >>>NESTA SECTION SERAO MOSTRADAS 4 IMAGENS
        DOS PRINCIPAIS PRODUTOS DA EMPRESA*/
    
    .section-fotos-area {
        display: flex;
    }
    
    .section-foto-item {
        flex: 1;
        width: 25%;
    }
    
    .section-foto-item img {
        width: 100%
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION SOLUÇÕES
        >>>SECTION COMUM COM TÍTULO, DESCRIÇÃO, TEXTO E UM BOTÃO*/
    
    .section-solucoes {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .section-solucoes p {
        font-size: 17px;
        font-weight: 500;
        line-height: 30px;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION ESPECIALISTA
        >>>SECTION COMUM COM IMAGEM EM BACKGROUND
        FRASE DE EFEITO E UM BOTÃO*/
    
    .bg-especialista {
        background-image: url(../../media/home-especialista-em-caldeiraria.jpg);
        background-size: cover;
        background-position: bottom;
        background-repeat: no-repeat;
        padding: 0px;
    }
    
    .section-especialista-area {
        background-color: rgba(0, 0, 0, 0.6);
        padding: 50px 0px;
        min-height: 500px;
        display: flex;
    }
    
    .section-especialista {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .section-especialista--desc {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .section-especialista--desc h1 {
        font-size: 35px;
        font-weight: 600;
    }
    
    .section-especialista--desc h2 {
        font-size: 25px;
        font-weight: 600;
        margin-top: 20px;
    }
    
    .section-especialista--contactForm {
        max-width: 500px;
        text-align: center;
        margin: auto;
        background-color: #f7f7f7;
        padding: 30px;
        border-radius: 10px;
    }
    
    .section-contactForm--split {
        display: flex;
        flex-direction: column;
    }
    
    .section-especialista--contactForm input[type="text"],
    .section-especialista--contactForm textarea {
        color: #333333;
        display: block;
        width: 340px;
        height: 40px;
        border: 0;
        border-bottom: 1px solid #cccccc;
        background: transparent;
        outline: 0;
        margin-top: 10px;
    }
    
    .section-especialista--contactForm textarea {
        height: 100px;
        resize: none;
    }
    
    .captcha {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row-reverse;
    }
    
    .captcha input[type="text"] {
        margin-right: 20px;
        width: 80px;
        text-align: center;
        vertical-align: middle;
        font-size: 30px;
        color: #dddddd;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    }
    
    .captcha ::placeholder {
        font-size: 16px;
        color: #cccccc;
        vertical-align: middle;
    }
    /* CSS DE ESTRUTURA PADRAO PARA SESSION ESPECIFICA
    ---CSS PARA A SECTION FOOTER
        >>>SECTION COM 4 COLUNAS*/
    
    footer {
        display: flex;
        flex-direction: column;
        color: #999;
    }
    
    .footer-area {
        background-color: #262626;
    }
    
    .footer-area--item {
        display: flex;
        justify-content: center;
        align-items: flex-start;
    }
    
    .footer-item {
        flex: 1;
        padding: 0 20px;
    }
    
    .footer-item--title {
        font-size: 17px;
        font-weight: 600;
        color: #ffffff;
        margin-bottom: 20px;
    }
    
    .footer-item--content {
        font-size: 16px;
        line-height: 25px;
    }
    
    .footer-item--content ul,
    .footer-item--content li {
        list-style: none;
    }
    
    .footer-item--content li {
        border-bottom: 1px solid #999999;
        padding: 10px 0;
    }
    
    .footer-item--content a {
        text-decoration: none;
        color: #999999;
    }
    
    .footer-item--content a:hover {
        color: #ffffff;
    }
    
    .footer-social {
        display: flex;
    }
    
    .footer-social--item {
        margin-right: 20px;
    }
    
    .footer--bottombar {
        font-size: 14px;
        background-color: #222222;
        padding-top: 20px;
        padding-bottom: 20px;
    }
    
    .footer--bottombar .italic {
        font-style: oblique;
    }
    /* CSS DE RESPONSIVIDADE
    ---TABLTES*/
    
    @media (min-width: 800px) and (max-width: 1140px) {
        .section-topbar--phone {
            margin-left: 30px;
        }
        .section-topbar--right {
            margin-right: 30px;
        }
        .section-header--logo img {
            margin-left: 20px;
        }
        .section-header--menu {
            margin-right: 30px;
        }
        .section-servicos {
            flex-wrap: wrap;
        }
        .section-servico {
            min-width: 50%;
            margin-bottom: 30px;
        }
        .section-sustentabilidade {
            margin: 0 30px;
        }
        .section-sustentabilidade--texto {
            line-height: 30px;
        }
        .section-fotos-area {
            flex-wrap: wrap;
        }
        .section-foto-item {
            min-width: 50%;
        }
        .section-solucoes p {
            margin-left: 30px;
            margin-right: 30px;
        }
        .section-especialista {
            flex-wrap: wrap;
            padding: 0 30px;
        }
        .section-especialista--desc {
            min-width: 100%;
            margin-bottom: 30px;
        }
        .section-especialista--contactForm {
            min-width: 70%;
        }
        .section-especialista--contactForm input[type="text"],
        .section-especialista--contactForm textarea {
            min-width: 100%;
        }
        .footer-area--item {
            flex-wrap: wrap;
        }
        .footer-item {
            min-width: 50%;
            margin-left: 30px;
            margin-right: 30px;
        }
        .footer-bottombar--area {
            margin-left: 30px;
        }
    }
    /* CSS DE RESPONSIVIDADE
    ---SMARTPHONES E TABLETS*/
    
    @media (min-width: 450px) and (max-width: 800px) {
        .section-topbar {
            justify-content: center;
        }
        .section-topbar--left {
            flex: none;
        }
        .section-topbar--right {
            display: none;
        }
        .section-header--logo img {
            margin-left: 20px;
        }
        /*.section-header--menu {
            display: none;
        }*/
        #menu {
            display: none;
        }
        .menu-opener {
            display: block;
            width: 45px;
            margin-right: 30px;
        }
        .menu-top {
            display: flex;
            position: absolute;
            z-index: 99;
            background-color: rgba(0, 0, 0, 0.9);
            width: 70vw;
            height: calc(100vh - 150px);
            top: 150px;
            right: 0;
        }
        .menu-top ul {
            display: flex;
            flex-direction: column;
        }
        .menu-top a {
            font-weight: bold;
            height: 60px;
            font-size: 17px;
            margin-left: 30px;
            border: 0;
        }
        .menu-top a:first-child {
            margin-top: 35px;
        }
        .banner h1 {
            font-size: 40px;
        }
        .section-servicos {
            flex-wrap: wrap;
        }
        .section-servico {
            min-width: 50%;
            margin-bottom: 30px;
        }
        .section-sustentabilidade {
            margin: 0 30px;
            flex-direction: column;
        }
        .section-sustentabilidade--imagem img {
            width: 200px;
        }
        .section-sustentabilidade--texto {
            font-size: 15px;
            line-height: 30px;
            text-align: justify;
            padding-left: 15px;
            padding-right: 15px;
            padding-bottom: 20px;
        }
        .section-fotos-area {
            flex-wrap: wrap;
        }
        .section-fotos-area {
            flex-wrap: wrap;
        }
        .section-foto-item {
            min-width: 75%;
        }
        .section-solucoes p {
            margin-left: 30px;
            margin-right: 30px;
        }
        .section-especialista {
            flex-wrap: wrap;
            padding: 0 30px;
        }
        .section-especialista--desc {
            min-width: 100%;
            margin-bottom: 30px;
        }
        .section-especialista--contactForm {
            min-width: 70%;
        }
        .section-especialista--contactForm input[type="text"],
        .section-especialista--contactForm textarea {
            min-width: 100%;
        }
        .footer-area--item {
            flex-wrap: wrap;
        }
        .footer-item {
            min-width: 50%;
            margin-left: 30px;
            margin-right: 30px;
        }
        .footer-bottombar--area {
            margin-left: 30px;
        }
    }
    /* CSS DE RESPONSIVIDADE
    ---SMARTPHONES*/
    
    @media (max-width: 450px) {
        .section-topbar {
            justify-content: center;
        }
        .section-topbar--left {
            flex: none;
        }
        .section-topbar--right {
            display: none;
        }
        .section-header--logo img {
            margin-left: 20px;
        }
        /*.section-header--menu {
            display: none;
        }*/
        #menu {
            display: none;
        }
        .menu-opener {
            display: block;
            width: 45px;
            margin-right: 30px;
        }
        .menu-top {
            display: flex;
            position: absolute;
            z-index: 99;
            background-color: rgba(0, 0, 0, 0.9);
            width: 70vw;
            height: calc(100vh - 150px);
            top: 150px;
            right: 0;
        }
        .menu-top ul {
            display: flex;
            flex-direction: column;
        }
        .menu-top a {
            font-weight: bold;
            height: 60px;
            font-size: 17px;
            margin-left: 30px;
            border: 0;
        }
        .menu-top a:first-child {
            margin-top: 35px;
        }
        .banner h1 {
            font-size: 35px;
        }
        .section-servicos {
            flex-wrap: wrap;
        }
        .section-servico {
            min-width: 50%;
            margin-bottom: 30px;
        }
        .section-sustentabilidade {
            margin: 0 30px;
            flex-direction: column;
        }
        .section-sustentabilidade--imagem img {
            width: 200px;
        }
        .section-sustentabilidade--texto {
            font-size: 15px;
            line-height: 30px;
            text-align: justify;
            padding-left: 15px;
            padding-right: 15px;
            padding-bottom: 20px;
        }
        .section-fotos-area {
            flex-wrap: wrap;
        }
        .section-fotos-area {
            flex-wrap: wrap;
        }
        .section-foto-item {
            min-width: 75%;
        }
        .section-solucoes p {
            margin-left: 30px;
            margin-right: 30px;
        }
        .section-especialista {
            flex-wrap: wrap;
        }
        .section-especialista--desc {
            min-width: 100%;
            margin-bottom: 30px;
            padding-left: 20px;
            padding-right: 20px;
        }
        .section-especialista--desc h1 {
            font-size: 25px;
        }
        .section-especialista--desc h2 {
            font-size: 20px;
        }
        .section-especialista--contactForm {
            max-width: 100vw;
        }
        .section-contactForm--split {
            flex-direction: column;
        }
        .section-especialista--contactForm input[type="text"],
        .section-especialista--contactForm textarea {
            width: 250px;
        }
        .footer-area--item {
            flex-wrap: wrap;
        }
        .footer-item {
            min-width: 50%;
            margin-left: 30px;
            margin-right: 30px;
        }
        .footer-bottombar--area {
            margin-left: 30px;
        }
    }
    
    @media (max-width: 350px) {
        .banner h2 {
            font-size: 15px;
        }
        .section-servico--title {
            font-size: inherit;
        }
        .section-especialista--desc {
            min-width: 100%;
            margin-bottom: 30px;
            padding-left: 20px;
            padding-right: 20px;
        }
        .section-especialista--desc h1 {
            font-size: 20px;
        }
        .section-especialista--desc h2 {
            font-size: 15px;
        }
        .section-especialista--contactForm {
            max-width: 100vw;
        }
        .section-contactForm--split {
            flex-direction: column;
        }
        .section-especialista--contactForm input[type="text"],
        .section-especialista--contactForm textarea {
            width: 200px;
        }
        .footer-bottombar--area {
            margin-left: 30px;
        }
    }