/*************************************************************************
*************************************************************************
    PL-BANNER
*************************************************************************
*************************************************************************/


.moduletable-banner{
    z-index: 1000;
}

#pl-banner{
    display:block;
    position:absolute;
    top:0;
    z-index: 1000;
    padding:0;
    width:100%;
    /*height:586px;*/
    height:439px;
    margin:0;    
}

#pl-banner div.bnr{
    
    width:100%;
    height:100%;
    position:relative;
    margin:0;
    padding:0;
    background-position: top center;
    background-repeat: no-repeat;
    background-size:contain;
    z-index: 1000;

}



#pl-banner div.bnr.bnr1{
    background-color: #444444;
    background-image: url("/images/banners/bnr1.png")/*, url("../images/banner/bnr1.png")*/;
}
#pl-banner div.bnr.bnr2{
    background-color: #444444;
    background-image: url("/images/banners/bnr2.png")/*, url("../images/banner/bnr2.png")*/;
}
#pl-banner div.bnr.bnr3{
    background-color: #444444;
    background-image: url("/images/banners/bnr3.png")/*,/* url("../images/banner/bnr3.png")*/;
}
#pl-banner div.bnr.bnr4{
    background-color: #444444;
    background-image: url("/images/banners/bnr4.png")/*, /*url("../images/banner/bnr4.png")*/;
}





#pl-banner div.nav-button{
    width:120px;
    height:80px;
    display:block;
    position:relative;
    top: 50%;
    background-repeat: no-repeat;
    background-size: 40%;
    cursor: pointer;
    z-index: 2000;
    /*border:solid 1px white;*/
}



#pl-banner div.title{
    float:left;
    position:relative;
    display:block;
    width:99%;
    top:50%;
    /*left:30%;*/
    float:left;
    z-index: 1000;
    min-width:200px;
    height:80px;
}

#pl-banner div.bullet-container{
    float:left;
    position:absolute;
    display:block;
    z-index: 1000;
    max-width:20px !important;
   
    /*border:solid 1px white;*/
    
}


#pl-banner div.menu-button{
    /*border:solid 1px white;*/
    float:left;
    width:220px;
    height:60px;
    display:block;
    position:relative;
    top: 2%;
    left:1%;
    background-position: left center;
    background-image: url("../images/banner/menu.png");
    background-repeat: no-repeat;
    background-size: 60%;
    cursor: pointer;
    z-index: 2000;
    color:white;
    text-align: right;
    font-size:200%;
    line-height: 200%;

}

#pl-banner div.bullet{
    /*position:static;*/
    margin:auto;
    display:block;
    /*left:0;*/
    margin-top:8px;
    max-width:14px !important;
    max-height: 14px !important;
    border:solid 2px white;
    float:left;
    z-index: 1000;
    border-radius: 18px;
    cursor:pointer;
}
#pl-banner div.bullet.active{
    background-color: white !important;
}



#pl-banner div.logo{
    float:left;
    max-width:250px !important;
    /*max-height:203px !important;*/
    display:block;
    position:absolute;
    top: 8%;
    left:44%;
    background-position: center center;
    background-image: url("../images/logo-branco.png");
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 5000;
}
#pl-banner div.titulo{
    /*border:solid 1px white;*/
    text-align: center;
    float:left;
  
    display:block;
    position:absolute;
    top: 52%;
    left:11%;
    width:80%;
    z-index: 5000;

}
#pl-banner div.seta{
     /*border:solid 1px white;*/
    float:left;
    max-width:90px;
    max-height:90px;
    min-width:30px;
    min-height:30px;
    
    display:block;
    position:absolute;
    top: 80%;
    left:47%;
    background-position: center center;
    background-image: url("../images/banner/seta.png");
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 5000;
    width:10%;
    height: 10%;
    cursor:pointer;
}






/********************************************************************************/
/********************************************************************************/
/* Custom, iPhone Retina */ 
/********************************************************************************/
/********************************************************************************/
@media only screen and (min-width : 80px) {
    #pl-banner div.nav-button{
        width:30px;
        height:30px;
        background-size: 40%;
        top:80%;
    }
    
    #pl-banner div.nav-button,
    #pl-banner div.bullet-container,
    #pl-banner div.title{
        display:none;
    }
    #pl-banner div.menu-button{
        background-size: 60%;
        width:60px;
        height:60px;
        font-size:60%;
        line-height: 660%;

    }

 
}

/********************************************************************************/
/* Extra Small Devices, Phones */ 
/********************************************************************************/
@media only screen and (min-width : 480px) {

    #pl-banner div.nav-button{
        width:40px;
        height:40px;
        background-size: 40%;
        top:60%;
    }
    
    
    
    #pl-banner div.nav-button,
    #pl-banner div.title{
        display:block;
    }
    #pl-banner div.menu-button{
        background-size: 44%;
        width:80px;
        height:60px;
        font-size:100%;
        line-height: 400%;

    }

    
  
}

/********************************************************************************/
/* Medium Devices, Desktops */
/********************************************************************************/
@media only screen and (min-width : 992px) {
    #pl-banner div.nav-button{
        width:80px;
        height:60px;
        background-size: 40%;
        top:50%;
    }
    
    #pl-banner div.nav-button,
    #pl-banner div.title{
        display:block;
    }
    #pl-banner div.menu-button{
        background-size: 50%;
        width:140px;
        height:60px;
        font-size:140%;
        line-height: 280%;

    }

}

/********************************************************************************/
/* Large Devices, Wide Screens */
/********************************************************************************/
@media only screen and (min-width : 1200px) {

    #pl-banner div.nav-button{
        width:110px;
        height:70px;
        background-size: 40%;
        top:50%;
    }
    
    #pl-banner div.nav-button,
    #pl-banner div.title{
        display:block;
    }
    #pl-banner div.menu-button{
        background-size: 50%;
        width:200px;
        height:60px;
        font-size:200%;
        line-height: 200%;

    }

    
}

/********************************************************************************/
/* EXTRA Large Devices, Wide Screens */
/********************************************************************************/
@media only screen and (min-width : 1600px) {
    
    #pl-banner div.nav-button{
        width:120px;
        height:80px;
        background-size: 40%;
        top:50%;
    }
    
    #pl-banner div.nav-button,
    #pl-banner div.title{
        display:block;
    }
    #pl-banner div.menu-button{
        background-size: 50%;
        width:220px;
        height:60px;
        font-size:240%;
        line-height: 180%;

    }

    

  
}

   
    
    


