﻿.titulos-app {
    text-align: left;
    font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
    font-size: 48px;
}

.pos-area-1 {
    margin-top: 14%;
}

.img-apple {
    width: 18%;
}

.img-google-play {
    width: 20%;
}

.textos-app {
    font-size: 27px;
    text-align: left;
    margin-top: 4%;
    font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
}

.borda-titulos-esq {
    border: 4px solid #FFB92E;
    width: 103%;
    margin-top: 3%;
    margin-left: -5%;
}

.borda-titulos-dir {
    border: 4px solid #FFB92E;
    width: 103%;
    margin-top: 3%;
    margin-right: -5%;
}

.pos-imagens-loja {
    margin-left: -33%;
}

.imagem-app-1 {
    width: 94%;
    margin-right: -16%;
    margin-top: 6%;
}

.imagem-app-2 {
    width: 74%;
    margin-top: -16%;
    margin-left: -13%;
}

.imagem-app-3 {
    width: 80%;
    margin-top: -5%;
    margin-left: 8%;
}

.imagem-app-4 {
    width: 43%;
    margin-top: -8%;
}

.primeira-parte-app {
    background-image: url('../../assets/images_2021/App-SlabWare/Imagem 2-01.png');
    height: 630px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 14%;
}

.segunda-parte-app {
    background-image: url('../../assets/images_2021/App-SlabWare/Imagem 5-01.png');
    height: 630px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 3%;
}

.terceira-parte-app {
    background-image: url('../../assets/images_2021/App-SlabWare/Imagem 2-01.png');
    height: 630px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 11%;
}

.quarta-parte-app {
    background-image: url('../../assets/images_2021/App-SlabWare/Imagem 5-01.png');
    height: 630px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 8%;
}

.pos-read-more {
    text-align: left;
    margin-top: 5%;
}

.read-more {
    padding: 10px 35px;
    border-radius: 5px;
    font-weight: bold;
    color: white;
    border: 1px solid #000;
    font-size: 16px;
    background-color: #595555;
}

    .read-more:hover {
        background-color: #fce700;
    }


@media (min-width: 2000px) {

    .imagem-app-3 {
        width: 80%;
        margin-top: -17%;
        margin-left: 8%;
    }

    .imagem-app-4 {
        width: 43%;
        margin-top: -19%;
    }

    .primeira-parte-app {
        background-image: url('../../assets/images_2021/App-SlabWare/Imagem 2-01.png');
        height: 769px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 18%;
    }

    .segunda-parte-app {
        background-image: url('../../assets/images_2021/App-SlabWare/Imagem 5-01.png');
        height: 771px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
    }

    .terceira-parte-app {
        background-image: url('../../assets/images_2021/App-SlabWare/Imagem 2-01.png');
        height: 775px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 14%;
    }

    .quarta-parte-app {
        background-image: url('../../assets/images_2021/App-SlabWare/Imagem 5-01.png');
        height: 775px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 14%;
    }
}

@media (max-width: 1600px) {
    .imagem-app-2 {
        width: 79%;
        margin-top: -6%;
        margin-left: -13%;
    }

    .imagem-app-4 {
        width: 43%;
        margin-top: -2%;
    }

    .imagem-app-3 {
        width: 80%;
        margin-top: 0%;
        margin-left: 8%;
    }

    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 11%;
    }

    .segunda-parte-app {
        height: 530px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 11%;
    }

    .quarta-parte-app {
        height: 530px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 13%;
    }

    .imagem-app-1 {
        width: 100%;
        margin-right: -8%;
    }

    .pos-imagens-loja {
        margin-left: -44%;
    }
}

@media (max-width: 1444px) {
    .imagem-app-1 {
        width: 100%;
        margin-right: -8%;
        margin-top: 10%; 
    }

    .imagem-app-2 {
        width: 79%;
        margin-top: -4%;
        margin-left: -13%;
    }

    .segunda-parte-app {
        height: 480px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 13%;
    }

    .quarta-parte-app {
        height: 480px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 20%;
    }

    .imagem-app-3 {
        width: 86%;
        margin-top: 2%;
        margin-left: 8%;
    }

    .imagem-app-4 {
        width: 52%;
        margin-top: -6%;
    }
}

@media (max-width: 1368px) {
    .quarta-parte-app {
        height: 450px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 26%;
    }

    .segunda-parte-app {
        height: 447px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 16%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 14%;
    }

    .imagem-app-4 {
        width: 56%;
        margin-top: -6%;
    }

}

@media (max-width: 1283px) {
    .titulos-app {
        text-align: left;
        font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
        font-size: 40px;
    }

    .textos-app {
        font-size: 25px;
        text-align: left;
        margin-top: 4%;
        font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
    }

    .imagem-app-4 {
        width: 50%;
        margin-top: 0%;
    }

    .imagem-app-3 {
        width: 85%;
        margin-top: 4%;
        margin-left: 6%;
    }

    .imagem-app-2 {
        width: 80%;
        margin-top: -5%;
        margin-left: -12%;
    }

    .quarta-parte-app {
        height: 427px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 26%;
    }

    .segunda-parte-app {
        height: 427px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 16%;
    }
}

@media (max-width: 1199px) {
    .quarta-parte-app {
        height: 401px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 26%;
    }

    .imagem-app-4 {
        width: 55%;
        margin-top: -1%;
    }

    .imagem-app-3 {
        width: 100%;
        margin-top: 4%;
        margin-left: 3%;
    }

    .segunda-parte-app {
        height: 388px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 21%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 15%;
    }

    .imagem-app-2 {
        width: 86%;
        margin-top: -6%;
        margin-left: -6%;
    }

    .imagem-app-1 {
        width: 103%;
        margin-right: -7%;
        margin-top: 13%;
    }
}

@media (max-width: 1111px) {
    .quarta-parte-app {
        height: 361px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 34%;
    }

    .imagem-app-4 {
        width: 60%;
        margin-top: 2%;
    }

    .imagem-app-3 {
        width: 100%;
        margin-top: 5%;
        margin-left: 1%;
    }

    .segunda-parte-app {
        height: 361px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 23%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
    }

    .imagem-app-2 {
        width: 90%;
        margin-top: -2%;
        margin-left: -6%;
    }

    .imagem-app-1 {
        width: 105%;
        margin-right: 9%;
        margin-top: 20%;
    }
}

@media (max-width: 1024px) {
    .imagem-app-2 {
        width: 90%;
        margin-top: 5%;
        margin-left: -6%;
    }

    .imagem-app-3 {
        width: 100%;
        margin-top: 12%;
        margin-left: -3%;
    }

    .segunda-parte-app {
        height: 342px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 32%;
    }

    .quarta-parte-app {
        height: 342px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 42%;
    }

    .imagem-app-4 {
        width: 60%;
        margin-top: 17%;
    }
}

@media (max-width: 991px) {
    .imagem-app-1 {
        width: 90%;
        margin-right: 0%;
        margin-top: 7%;
    }

    .pos-imagens-loja {
        margin-left: 0%;
        text-align: center;
        margin-top: 2%;
    }

    .img-google-play {
        width: 25%;
        margin-right: 0%;
    }

    .img-apple {
        width: 22%;
    }

    .pos-area-1 {
        margin-top: 8%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 32%;
    }

    .imagem-app-2 {
        width: 66%;
        margin-top: 57%;
        margin-left: 0%;
        margin-bottom: 7%;
    }

    .quarta-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 175%;
        margin-top: 87%;
    }

    .imagem-app-3 {
        width: 70%;
        margin-top: 110%;
        margin-left: -3%;
        margin-bottom: 6%;
    }

    .imagem-app-4 {
        width: 33%;
        margin-top: 80%;
        margin-bottom: 5%;
    }

}

@media (max-width: 768px) {
    .imagem-app-3 {
        width: 81%;
        margin-top: 128%;
        margin-left: -3%;
        margin-bottom: 11%;
    }

    .imagem-app-4 {
        width: 41%;
        margin-top: 123%;
        margin-bottom: 7%;
    }

    .quarta-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 244%;
        margin-top: 87%;
    }

    .imagem-app-2 {
        width: 71%;
        margin-top: 58%;
        margin-left: 0%;
        margin-bottom: 10%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 44%;
    }

    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
    }
}

@media (max-width: 767px) {
    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 12%;
        margin-top: 13%;
    }
}

@media (max-width: 544px) {
    .img-apple {
        width: 34%;
    }

    .img-google-play {
        width: 38%;
        margin-right: 0%;
    }

    .titulos-app {
        text-align: left;
        font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
        font-size: 31px;
    }

    .textos-app {
        font-size: 21px;
        text-align: left;
        margin-top: 4%;
        font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
    }

    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: -1%;
        margin-top: 13%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 39%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: -0%;
    }
}

@media (max-width: 480px) {
    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 4%;
        margin-top: 21%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 52%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 0%;
    }

    .quarta-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 260%;
        margin-top: 87%;
    }
}

@media (max-width: 418px) {
    .pos-read-more {
        text-align: left;
        margin-top: 7%;
        margin-bottom: 6%;
    }

    .primeira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 6%;
        margin-top: 21%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 58%;
    }

    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 6%;
    }

    .quarta-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 285%;
        margin-top: 87%;
    }
}

@media (max-width: 375px) {
    .terceira-parte-app {
        height: 630px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 23%;
    }

    .imagem-app-4 {
        width: 55%;
        margin-top: 123%;
        margin-bottom: 7%;
    }

    .imagem-app-3 {
        width: 89%;
        margin-top: 128%;
        margin-left: -12%;
        margin-bottom: 11%;
    }

    .imagem-app-2 {
        width: 76%;
        margin-top: 65%;
        margin-left: -4%;
        margin-bottom: 10%;
    }

    .segunda-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 69%;
    }

    .quarta-parte-app {
        height: 320px;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 325%;
        margin-top: 87%;
    }
}