@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');

body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
}
header {
    height: 4.013377926421405vw;
    width: 100%;
}
#header {
    padding: 0.33vw;
    border-bottom:  0.06688963210702341vw solid white;
    background-color: rgba(24, 24, 24, 0.614);
}
.h1-header {
    display: inline;
    color: rgb(249, 249, 249);
    position: relative;
    left: 2.0066889632107023vw;
}
.item-header {
    float: right;
    display: inline;
    position: relative;
    right: 9.364548494983278vw;
    bottom: 1.3377926421404682vw;
}
.item-header>p {
    font-size: 1.672vw;
    font-weight: 700;
    color: white;
    text-shadow: 1px 1px 1px black;
}
#h1-header-id {
    display: inline;
    font-size: 2.5vw;
}
#line-1 {
    width: 100%;
    
}

/* Background Image */

.main {
    background-image: url(imagens/f3.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 33.4vw;
}

/* Caixas */

.section-1 {
    height: 30vw;
}
.section-1>h1 {
    position: relative;
    text-align: center;
    font-size: 2.4vw;
}
.box-endereco {
    display: inline;
    float: left;
    position: relative;
    width: 24vw;
    height: 10vw;
    left: 7vw;
    padding: 1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.225);
}
.box-endereco>h2 {
    position: relative;
    text-align: center;
    font-size: 1.7vw;
    bottom: 1vw;
    color: green;
}
.box-endereco>p {
    position: relative;
    bottom: 1vw;
    text-align: center;
    font-weight: 500;
    font-size: 1.3vw;
}

.box-horario {
    display: inline;
    float: left;
    position: relative;
    width: 24vw;
    height: 10vw;
    left: 10vw;
    padding: 1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.225);
}
.box-horario>h2 {
    position: relative;
    text-align: center;
    font-size: 1.7vw;
    bottom: 1vw;
    color: green;
}
.box-horario>p {
    position: relative;
    bottom: 1vw;
    text-align: center;
    font-weight: 500;
    font-size: 1.3vw;
}
.span-p {
    font-size: 1.3vw;
}
.box-contato {
    display: inline;
    float: right;
    position: relative;
    width: 24vw;
    height: 10vw;
    right: 7vw;
    padding: 1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.225);
}
.box-contato>h2 {
    position: relative;
    text-align: center;
    font-size: 1.7vw;
    bottom: 1vw;
    color: green;
}
.box-contato>p {
    position: relative;
    bottom: 1vw;
    text-align: center;
    font-weight: 500;
    font-size: 1.3vw;
}
.box-contato>p a {
    color: rgb(175, 0, 175);
}
.box-contato>p a:hover {
    color: rgb(255, 0, 255);
    transition: 200ms;
}

/* SECTION 2 */

#section-2 {
    height: 48vw;
}
.display-tittle-sec-2>hr {
    border: 1px solid black;
    margin: 0 auto 16px;
    width: 10vw;
}

/* Depoimentos */

.display-tittle-sec-2 {
    position: relative;
    text-align: center;
    font-size: 1.9vw;
}
#display-img-1 {
    position: relative;
    float: left;
    left: 5vw;
    top: 3vw;
    padding: 0.1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.223);
    border-radius: 0.5vw;
}
#img-1 {
    width: 43vw;
    height: 10vw;
}
#display-img-2 {
    position: relative;
    float: right;
    right: 4vw;
    top: 3vw;
    padding: 0.1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.223);
    border-radius: 0.5vw;
}
#img-2 {
    width: 43vw;
    height: 10vw;
}
#display-img-3 {
    position: relative;
    float: right;
    right: 35vw;
    top: 5vw;
    padding: 0.1vw;
    border: 0.06vw solid rgba(0, 0, 0, 0.223);
    border-radius: 0.5vw;
}
#img-3 {
    width: 37vw;
    height: 12vw;
}

/* SECTION-3 */

#section-3 {
    height: 60vw;
}
.display-tittle-sec-3>hr {
    border: 1px solid black;
    margin: 0 auto 16px;
    width: 12vw;
}

/* Galeria de Fotos */

.display-tittle-sec-3 {
    position: relative;
    text-align: center;
    font-size: 1.9vw;
}
.display-galeria {
    background-color: rgba(128, 128, 128, 0.227);
    margin-top: 6vw;
    margin-bottom: 4vw;
}
.img-galeria {
    width: 24vw;
    height: 17vw;
}
.display-img {
    display: inline;
    padding: 0.8vw;
}

/* Rodape (Footer)*/

footer {
    height: 22vw;
    background-color: #1A1A1A;
    color: white;
}
.display-icones-rede-social img {
    padding: 1vw;
    width: 5vw;
    height: 5vw;
}
.display-text-footer>h2 {
    font-size: 1.7vw;
}
.display-text-footer>p {
    font-size: 1vw;
}
.line-footer {
    border: 1px solid rgb(32, 31, 31);
}
.p-footer {
    font-size: 1vw;
}
.a-footer {
    font-size: 1vw;
    color: white;
}

@media (max-width: 509px) {
    .display-tittle-sec-2>hr {
        border: 1px solid black;
        margin: 0 auto 16px;
        width: 10vw;
        position: relative;
        top: 2vw;
    }
    .display-tittle-sec-3>hr {
        border: 1px solid black;
        margin: 0 auto 16px;
        width: 12vw;
        position: relative;
        top: 2vw;
    }
}
@media (max-width: 454px) {
    .item-header {
        float: right;
        display: inline;
        position: relative;
        right: 9.364548494983278vw;
        top: 0.4vw;
    }
    .item-header>p {
        font-size: 1.672vw;
        font-weight: 700;
        color: white;
        text-shadow: 1px 1px 1px black;
    }
    .display-tittle-sec-2>hr {
        border: 1px solid black;
        margin: 0 auto 16px;
        width: 10vw;
        position: relative;
        top: 3vw;
    }
    .display-tittle-sec-3>hr {
        border: 1px solid black;
        margin: 0 auto 16px;
        width: 12vw;
        position: relative;
        top: 3vw;
    }
}
@media (max-width: 375px) {
    .item-header {
        float: right;
        display: inline;
        position: relative;
        right: 9.364548494983278vw;
        top: 1vw;
    }
    .item-header>p {
        font-size: 1.8vw;
        font-weight: 700;
        color: white;
        text-shadow: 1px 1px 1px black;
    }
}