/* Copyright 2015 Prismatec. Todos os direitos reservados. */

/* Sobre nós */


/* Estrutura principal */

#sobre-nos h1
{
    margin: 90px 0 100px 0;
}

/* Estrutura principal - Container da sessão */

#sobre-nos-cont
{
    width: 100%;
    height: 530px;
    margin: 0 0 80px 0;
    overflow: hidden;
}

/* Estrutura principal - Detalhe da folha dobrada */

#sobre-nos-bg-02
{
    background: url(../img/sobre-nos-bg-02.jpg) no-repeat;
    width: 45px;
    height: 45px;
    position: absolute;
    top: 0;
    right: 0;
}

/* Estrutura principal - Container da sessão - Imagem principal */

#sobre-nos-img
{
    background: url(../img/sobre-nos-img.jpg) no-repeat;
    background-size: cover;
    width: 45%;
    height: 100%;
    opacity: 0;
    float: left;
}

/* Estrutura principal - Container da sessão - Informações */

#sobre-nos-info
{
    background-image: url(../img/sobre-nos-bg-01.png);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: left bottom;
    background-color: #305898;
    width: 45%;
    height: 100%;
    opacity: 0;
    float: right;
    position: relative;
}

/* MOBILE

   Módulos para visualização apenas em aparelhos móveis

   Estrutura principal - Container da sessão - Informações */

#m-sobre-nos-info
{
    display: none;
}

/* Banner de informações */

#sobre-nos-banner
{
    width: 450px;
    height: 350px;
    margin: 90px 0 0 55px;
    position: relative;
}
    #sobre-nos-banner h2
    {
        margin: 0 0 38px 0;
        font-size: 30px;
        line-height: 30px;
        color: #0F264B;
    }
    #sobre-nos-banner p
    {
        margin: 0 0 15px 0;
        line-height: 22px;
        color: #FFF;
        text-align: justify;
    }
        #sobre-nos-banner p a
        {
            color: #0F264B;
            font-weight: bold;
        }
            #sobre-nos-banner p a:hover
            {
                text-decoration: underline;
                cursor: pointer;
            }

/* Banner de informações - Navegação */

#sobre-nos-banner-nav
{
    width: 70px;
    height: 40px;
    position: absolute;
    right: 5px;
    bottom: -40px;
    z-index: 999990;
}
#sobre-nos-banner-left-nav, #sobre-nos-banner-right-nav
{
    background-size: auto 100%;
    width: 22px;
    height: 40px;
    opacity: 0.6;
    top: 0;
}
#sobre-nos-banner-left-nav
{
    left: 0px;
}
#sobre-nos-banner-right-nav
{
    right: 0px;
}
    #sobre-nos-banner-left-nav:hover, #sobre-nos-banner-right-nav:hover
    {
        opacity: 0.9;
        cursor: pointer;
    }

/* Trabalhe conosco */

#trabalhe-conosco-cont
{
    width: 360px;
    height: 335px;
    margin: 1030px 0 0 130px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999990;
}
#trabalhe-conosco-cont > div, #t-02-cont > div
{
    width: 100%;
    height: 100%;
    position: relative;
}

#t-01
{
    background: url(../img/t-01.png) no-repeat;
    background-size: 100%;
    background-position: center;
    width: 0;
    height: 0;
    position: absolute;
    top: 80px;
    left: 80px;
    z-index: 2;
}

#t-02-cont
{
    width: 0;
    height: 0;
    position: absolute;
    top: 280px;
    left: 120px;
    z-index: 2;
}
    #t-02-cont:hover #t-02-fx
    {
        display: block;
        cursor: pointer;
    }
#t-02-fx
{
    background: url(../img/t-02-fx.png) no-repeat;
    background-size: 80px;
    background-position: center;
    width: 100%;
    height: 100%;
    position: absolute;
    display: none;
}
#t-02
{
    background: url(../img/t-02.png) no-repeat;
    background-size: 100%;
    background-position: center;
    width: 100%;
    height: 100%;
}

#t-03
{
    background: url(../img/t-03.png) no-repeat;
    background-size: 100%;
    background-position: center;
    width: 0;
    height: 0;
    position: absolute;
    right: 140px;
    bottom: 140px;
    z-index: 1;
}


/* Largura máxima 1690px */

@media screen and (max-width: 1690px) {
    
    /* Trabalhe conosco */

    #trabalhe-conosco-cont
    {
        margin: 1000px 0 0 0;
    }
    
}


/* Largura máxima 1370px */

@media screen and (max-width: 1370px) {
    
    /* Estrutura principal - Container da sessão */

    #sobre-nos-cont
    {
        height: 420px;
        margin: 0 0 60px 0;
    }
    
    /* Banner de informações */

    #sobre-nos-banner
    {
        margin: 55px 0 0 55px;
    }
    
    /* Banner de informações - Navegação */

    #sobre-nos-banner-nav
    {
        width: 60px;
        height: 30px;
        right: 0;
        bottom: 20px;
    }
    #sobre-nos-banner-left-nav, #sobre-nos-banner-right-nav
    {
        width: 16px;
        height: 30px;
    }
    
}


/* Largura máxima 1260px */

@media screen and (max-width: 1260px) {
    
    /* Estrutura principal */

    #sobre-nos h1
    {
        margin: 38px 0 50px 0;
    }
    
    /* Estrutura principal - Container da sessão */

    #sobre-nos-cont
    {
        padding: 0 100px;
    }
    
    /* Estrutura principal - Container da sessão - Imagem principal e Informações */

    #sobre-nos-img, #sobre-nos-info
    {
        width: 50%;
    }
    
    /* Banner de informações */

    #sobre-nos-banner
    {
        width: 380px;
    }
        #sobre-nos-banner h2
        {
            margin: 0 0 15px 0;
            font-size: 18px;
            line-height: 22px;
        }
    
}


/* Largura máxima 1024px */

@media screen and (max-width: 1024px) {
    
    /* Banner de informações */

    #sobre-nos-banner
    {
        width: 280px;
        height: 340px;
        margin: 50px 0 0 48px;
    }
        #sobre-nos-banner p
        {
            font-size: 14px;
            line-height: 19px;
        }
    
}


/* Largura máxima 945px */

@media screen and (max-width: 945px) {
    
    /* Banner de informações */

    #sobre-nos-banner
    {
        width: 250px;
    }
    
}


/* Largura máxima 768px */

@media screen and (max-width: 768px) {
    
    /* Estrutura principal */

    #sobre-nos h1
    {
        margin: 30px 0 30px 0;
        font-size: 16px;
        line-height: 20px;
        font-weight: bold;
    }
    
    /* Estrutura principal - Container da sessão */

    #sobre-nos-cont
    {
        width: 100%;
        height: auto;
        margin: 0 0 30px 0;
        padding: 0;
    }
    
    /* Estrutura principal - Detalhe da folha dobrada */

    #sobre-nos-bg-02
    {
        display: none;
    }

    /* Estrutura principal - Container da sessão - Imagem principal e Informações */

    #sobre-nos-img
    {
        width: 100%;
        height: 300px;
        margin-bottom: 20px;
        opacity: 1;
        float: none;
    }
    
    /* Banner de informações - Navegação */

    #sobre-nos-banner-nav
    {
        display: none;
    }
    
    /* Trabalhe conosco */

    #trabalhe-conosco-cont
    {
        display: none;
    }
    
    /* MOBILE
    
       Módulos para visualização apenas em aparelhos móveis
    
       Estrutura principal - Container da sessão - Informações */
    
    #m-sobre-nos-info
    {
        width: 100%;
        height: auto;
        display: block;
    }
        #m-sobre-nos-info h2
        {
            margin: 0 0 15px 0;
            padding: 20px 0 0 0;
            font-size: 16px;
            line-height: 18px;
            color: #305898;
        }
        #m-sobre-nos-info p
        {
            margin: 0 0 10px 0;
            padding: 0;
            font-size: 14px;
            line-height: 19px;
            text-align: justify;
            color: #4F4F4F;
        }
        #m-sobre-nos-info a
        {
            width: 100%;
            height: auto;
            overflow: hidden;
            display: block;
        }
            #m-sobre-nos-info a h2
            {
                margin: 0 0 15px 0;
                padding: 27px 0 0 0;
                font-size: 16px;
                line-height: 18px;
                color: #305898;
                float: left;
            }
        #m-sobre-nos-info div
        {
            padding-bottom: 6px;
        }
    
    #m-atend
    {
        margin-top: 30px;
    }
    #m-missao, #m-valores
    {
        margin-top: 15px;
    }
    #m-atend, #m-missao, #m-valores
    {
        border-top: 1px solid #eee;
    }
    
    /* Classes */
    
    /* Estrutura principal - Container da sessão - Informações - Botão fchar */
    
    .more-btn
    {
        background-image: url(../img/more-btn.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width: 15px;
        height: 15px;
        margin: 29px 0 0 12px;
        float: left;
    }
    
}


/* Largura máxima 640px */

@media screen and (max-width: 640px) {
    
    /* Estrutura principal - Container da sessão - Imagem principal e Informações */

    #sobre-nos-img
    {
        height: 150px;
    }
    
}