﻿/* ==== Google font ==== */
@import url('https://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700|Open+Sans:300,400,600,700');

/* === prettify === */
@import url('../js/google-code-prettify/prettify.css');
/* === fontawesome === */
@import url('font-awesome.css');
/* === custom icon === */
@import url('custom-fonts.css');
/* ==== overwrite bootstrap standard ==== */
@import url('overwrite.css');
@import url('animate.css');

* {
    padding: 0;
    margin: 0;
    border: 0;
    box-sizing: 0;
}

body {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.6em;
    color: #000000;
}

.col-black {
    color: #000000;
}

.container-lgpd {
    display: grid;
    grid-template-columns: 70% 30%;
}

.box-one, .box-two {
    height: auto;
    margin: 5% 5% 5% 5%;
    text-align: center;
}

.box-one {
    
}

.box-two {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: 70px 70px 70px;
    grid-row-gap: 2em;
    margin-top: 20%;
    justify-content: center;
}

.texto {
    text-align: justify;
}

.footer-lgpd {
    width: 100%;
    height: 18vh;
    background-color: #1d5381;
    display: flex;
    justify-content: flex-end;
}

.img-logo {
    width: 348px;
    height: 123px;
    margin-top: 1%;
    margin-right: 15%;
}

.img-lgpd {
    width: 700px;
    align-items: center;
}

.balloon-one, .balloon-two, .balloon-three {
    background-color: #869ae1;
    width: 200px;
    border-radius: 10px;
    text-align: center;
    align-items: center;
    transition: all 0.5s;
    cursor: pointer;
}

.balloon-one:hover, .balloon-two:hover:hover, .balloon-three:hover {
    -webkit-transform: scale(1.5);
    transform: scale(1.1);
}

.footer-info-senac {
    font-family: Verdana;
    color: #1d5381;
    font-size: 14px;
    display: flex;
    justify-content: space-around;
}

.info {
    padding-top: 5%;
    color: #ffffff;
}

/*CONTATO LGPD*/

.container-lgpd-contato {
    margin: 0 20% 0 20%;
}

.title-contato {
    display: grid;
    grid-template-columns: 20% 70%;
    justify-content: space-between;
    padding-top: 2%;
}

.linha-title-lgpd {
    color: #869ae1;
    background-color: #869ae1;
    height: 3px;
    margin-top: 7%;
}

/*.footer-fixo {
    position: absolute;
    bottom: 0;
    width: 100%;
}*/

.body-contato {
    display: grid;
    grid-template-columns: 400px 400px;
    grid-column-gap: 3em;
    padding: 5% 0 10% 0;
    justify-content: space-between;
}

.btn-lgpd {
    background-color: #869ae1;
    width: 100%;

}


/*Media Query*/

@media (max-width: 799px){
    .container-lgpd {
        display: grid;
        grid-template-columns: 100%;
    }

    .img-lgpd {
        width: 300px;
        height: auto;
    }

    .box-two {
        margin-top: 10%;
    }

    .iframe-lgpd {
        width: 300px;
        height: auto;
    }

    .title-contato {
        display: grid;
        grid-template-columns: 10% 40%;
    }
    
    .body-contato {
        grid-template-columns: 100%;
    }

    .container-lgpd-contato {
        margin: 0 10% 0 10%;
    }

    .linha-title-lgpd {
        margin-top: 15%;
    }

    .img-logo {
        width: 400px;
    }
}

@media (min-width: 2599px) {
    .img-logo {
        width: 900px;
    }

    .img-lgpd {
        width: 1500px;
    }

    .img-logo-senacrn {
        width: 100%;
        height: auto;
    }

    body, .footer-info-senac, .btn, h2, label,
    #txtFinalidadeContato, #txtNomeCompleto, #txtEmail, #txtMensagem {
        font-size: 4.7rem;
    }

    .balloon-one, .balloon-two, .balloon-three {
        width: 600px;
        height: auto;
    }

    .box-two {
        grid-template-rows: 200px 200px 200px;
    }

    .balloon-one, .balloon-two, .balloon-three {
        border-radius: 20px;
    }

    .iframe-lgpd {
        width: 70%;
        height: 700px;
    }

    .body-contato {
        padding-top: 10%;
        grid-template-columns: 750px 750px;
        justify-content: space-between;
    }

    #txtFinalidadeContato, #txtNomeCompleto, #txtEmail, txtMensagem {
        height: 110px;
    }
}

