@import "internas.css";
#fotos {
    padding-left: 20px;
    margin-top: -40px;
    float: right
}

#pagina p {
    font-size: 15px;
    color: #2d2d2d;
    line-height: 22px
}

#pagina p#marca {
    background: url(../imagens/sua-marca.jpg) right top no-repeat;
    width: 370px;
    padding: 0 130px 50px 0
}

#pagina p#marketing {
    background: url(../imagens/marketing.jpg) left center no-repeat;
    width: 370px;
    padding: 50px 0 50px 150px
}

#pagina p#verde {
    background: url(../imagens/qualidade.jpg) 20px center no-repeat #bad2bd;
    margin: 30px 0 30px 0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 20px 15px 20px 145px
}

#pagina p#ultimo {
    background: url(../imagens/empresa.jpg) right center no-repeat;
    padding: 10px 150px 10px 10px
}

#itens ul {
    /*float: left;*/
    margin: 0 -15px;
}

#itens ul li {
    margin: 0 15px 30px 15px;
    text-transform: uppercase;
    font-family: swis721_btroman;
    font-size: 12px;
    color: #4573b6;
    display: inline-block;
    font-weight: 700;
    float: left;
    text-align: center;
    color: #3d3d3d;
    border: 1px solid #d6d3d3;
}

@media all and (min-width:992px) {
    #itens ul li {
        width: calc(25% - 30px)
    }
    #itens ul li:nth-child(4n+1) {
        clear: both
    }
}

@media all and (max-width:991px) {
    #itens ul li {
        width: calc(50% - 30px)
    }
    #itens ul li:nth-child(2n+1) {
        clear: both
    }
}

#itens ul li img {
    display: inline-block;
    max-width: 100%;
    margin: 10px 0;
    max-height: 315px;
}

#itens ul li a {
    text-transform: uppercase;
    font-family: swis721_btroman;
    font-size: 12px;
    color: #4573b6;
    font-weight: 700
}

#itens ul li h2 {
    margin-bottom: 10px;
    color: #3d3d3d;
    font-family: swis721_btroman;
    font-size: 12px;
    font-weight: 700
}

#itens ul li h3 {
    color: #246e46;
    font-family: Swis721BTBold;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0
}

@media all and (max-width:900px) {
    #pagina {
        padding: 30px 5px 0 5px
    }
    #pagina p#marca {
        width: 100%;
        padding: 0 160px 70px 0
    }
    #fotos {
        margin: auto;
        text-align: center;
        float: none;
        max-width: 400px;
        padding-left: 0
    }
}

@media all and (max-width:500px) {
    #pagina p#marca {
        background: url(../imagens/sua-marca.jpg) center top no-repeat;
        background-size: 200px 125px;
        width: 100%;
        padding: 140px 0 15px 0
    }
    #pagina p#marketing {
        background: url(../imagens/marketing.jpg) top center no-repeat;
        background-size: 200px 125px;
        width: 100%;
        padding: 150px 10px 10px 10px
    }
    #pagina p#verde {
        background: 0 0;
        background-color: #bad2bd;
        padding: 15px;
        margin: 0
    }
    #pagina p#ultimo {
        background: url(../imagens/empresa.jpg) top center no-repeat;
        background-size: 125px 125px;
        padding: 150px 15px 10px 15px
    }
}

@media all and (max-width:595px) {
    #itens ul {
        max-width: 450px;
        margin: auto;
        width: 100%;
        float: none
    }
    #itens ul li {
        float: none;
        width: 100%;
        margin: 0 auto 25px auto!important
    }
}