Problema con vista en smartphones

[el_cesar]

Hola, tengo estos estilos

Código CSS:

#bannershow
{
    
    width:100%;
    display:block;
    height:650px;
    position:relative;
    background-color:transparent;
    
}
@media only screen and (max-width : 320px) {
    #bannershow
{
    
    width:100%;
    display:block;
    height:150px;
    position:relative;
    background-color:transparent;
    z-index:200;
    
}
#bannershow > span
{
    padding-top: 200px;
    display:none;
    width:100%;
    height:100%;
    position:absolute;
    left:0; right:0; top:0; bottom:0;
}
#bannershow > span > img
{
    padding-top:150px;
    width:100%;
    height:auto;
    position:relative;
    left:0; right:0; top:0; bottom:0;
}
#yepview{
    margin-top: 170px;
    float:left;
    position: relative;
}
}
 
#bannershow > span
{
    display:none;
    width:100%;
    height:100%;
    position:absolute;
    left:0; right:0; top:0; bottom:0;
}
 
#bannershow > span > img
{
    padding-top: 50px;
    width:100%;
    height:auto;
    position:relative;
    left:0; right:0; top:0; bottom:0;
}
 

esta es la url www.crmbusiness.biz/andres

el problema es que cuando la abro desde smartphones el slider sale detras del menú y no he podido acomodarlo con el padding.

sin embargo, si lo veo como responsive desde el pc se ve bien.

Alguna idea?

[DragonX]

Código CSS:

.logo a img{
    width: 80%;
}
.navbar-toggle{
    position: absolute;
    top: 10px;
    right: 10px;
    margin: 0;
}
#bannershow {
    width: 100%;
    display: block;
    height: auto;
    position: relative;
    background-color: transparent;
}
 

hace esa modificacion en tu codigo y listo!
slds.-