@import "default";

html{
    margin:0;
    padding:0;
}

.bannerfull{
    position: fixed;
    top:0;
    width:100%;
    height:30px;
    background:#0F0;
}

body{    
    margin:0 auto;
}

p{
    color:#777;
    margin-bottom: 20px;
    .font;
    font-size:14px;
    line-height:1.5;
    strong{
        font-weight:700;
    }
}

header#topo{
    position: relative;
    height:120px;
    border-top:5px solid @blue;
    max-width:1000px;
    display:block;
    z-index:99;
    margin:auto;
    div.container_16{
        height:120px;
        display:block;
        position:relative;
    }
}

#logo{
    position: absolute;
    z-index: 2;
    top:40px;
    left:0;
}

#menu{    
    background: url(../img/bg-menu.png);
    .gradient(#002766,#0f589d);
    .border-radius(0 999px 999px 0);
    position: absolute;
    padding-left: 40px;
    width: 720px;
    height: 50px;
    position: absolute;
    top: 50px;
    left: 200px;    
    a{
        color:#FFF;
        .font;
        font-size:13px;
        text-decoration:none;
    }    
    ul{        
        margin:0;
        padding:0;        
        li{        
            display:inline;
            position:relative;
            float:left;
            background:url(../img/dv-menu.png) no-repeat right center;
            padding-right:5px;            
            &:last-child{
                background:none;
            }            
            a{
                float:left;
                padding:18px 30px 19px 30px;
            }            
            &:hover>a{
                .rgba(#FFF,.1);
            }            
            ul{
                display:none;
                position:absolute;
                top:50px;
                left:0;
                .rgba(@blue,.9);
                z-index:999;
                width:200px;
                margin:0;
                padding:10px 0;
                li{
                    display:block;
                    background:none;
                    width:100%;
                    a{
                        display:block;
                        margin:0;
                        padding:15px 0 15px 20px;
                        .box-sizing;
                        width:100%;
                        background:url(../img/menu-seta-amarela.png) no-repeat 10px center;
                    }
                }
            }            
            &:hover ul{
                display:block;
            }
        }
    }
}

#content{
    margin-top:30px;
}

#rodape{    
    position:relative;
    .admx{
        position:absolute;
        left:80px;
        bottom:60px;
    }    
    .marcas{
        text-align:center;
        margin-top:90px;
        margin-bottom:30px;
        padding-bottom:50px;
        background:url(../img/sombra/grid-16.png) no-repeat center bottom;
        a{
            margin:0 16px;
        }
    }
    .rodape{        
        height:150px;
        .logo{
            position:relative;
            margin-left:70px;
            top:10px;
        }
        div.address{
            &>div{
                margin:5px 0;
                overflow:hidden;
            }
            width:630px;
            float:right;
            .font;
            font-size:12px;
            color:#777;
            address{
                display:inline;
            }
            .city{
                float:left;
                width:200px;
                text-align:right;
                margin-right:10px;
                font-size:15px;
            }
            .phone,address{
                float:left;
            }
            .phone{
                font-size:15px;
                font-weight:bold;
                small{
                    font-size:12px;
                }
            }
            address{
                font-size:11px;
                margin-left:10px;
            }
        }        
    }
}

.products_categories{
    display:block;
    position:relative;
    h1{
        .open(18px,@mid-blue,700);
        display:block;
        position:relative;
    }
}

ul#categories{    
    text-transform:uppercase;
    margin-top:30px;
    display:block;
    position:relative;    
    li.first{
        display:block;
        position:relative;
        margin-bottom:20px;
        a{
            .open(13px,@mid-blue,700);
            text-decoration:none;
            padding:6px 0;
            display:block;
            position:relative;
            text-indent:15px;
            background:url(../img/seta-fechado.png) no-repeat left center;
        }
        ul.open{
            display:block;
            position:relative;
            li.second{
                display:block;
                position:relative;
                a{
                    .open(12px,#3C3C3B,500);
                    display:block;
                    position:relative;
                    padding:6px 0;
                    text-indent:15px;
                    background:none;
                }
            }
        }
    }     
}

h1.title{    
    color:@blue;
    .font;
    font-weight:700;
    font-size:18px;
    background:url(../img/sombra/grid-16.png) no-repeat center bottom;
    padding-bottom:20px; 
}
h1.title,h4.title{
    &.grid_4{ background:url(../img/sombra/grid-4.png) no-repeat center bottom }
    &.grid_5{ background:url(../img/sombra/grid-5.png) no-repeat center bottom }
    &.grid_6{ background:url(../img/sombra/grid-6.png) no-repeat center bottom }
    &.grid_7{ background:url(../img/sombra/grid-7.png) no-repeat center bottom }
    &.grid_8{ background:url(../img/sombra/grid-8.png) no-repeat center bottom }
    &.grid_9{ background:url(../img/sombra/grid-9.png) no-repeat center bottom }
    &.grid_10{ background:url(../img/sombra/grid-10.png) no-repeat center bottom }
    &.grid_11{ background:url(../img/sombra/grid-11.png) no-repeat center bottom }
    &.grid_12{ background:url(../img/sombra/grid-12.png) no-repeat center bottom }
    &.grid_13{ background:url(../img/sombra/grid-13.png) no-repeat center bottom }
    &.grid_14{ background:url(../img/sombra/grid-14.png) no-repeat center bottom }
    &.grid_15{ background:url(../img/sombra/grid-15.png) no-repeat center bottom }
    &.grid_16{ background:url(../img/sombra/grid-16.png) no-repeat center bottom }
}

nav.paginator{
    display:block;
    clear:both;
    text-align:center;
    margin:40px 0 10px 0;
    span{
        margin:0 10px;
        .font;
        color:#999;
        &.current{
            color:#FFF;
            font-size:15px;
            background:@blue;
            padding:5px 10px;
            .border-radius;
        }
    }
    a{
        color:@blue;
    }
}