@import (reference) "bootstrap.less";  
@import (reference) "Onestop.Common.Variables.less";
@import (reference) "Onestop.Common.Mixins.less";

//homepage styling
.detail-home-page {
    .os-body-wrapper {
        background-color: #f7f7f7;
    }

    .os-page-container {
        padding-top: 50px;
    }

    .zone-breadcrumb {
        display: none;
    }

    .hp-sidebar-container {
        display: block;
        padding: 20px;
        background-color: #fff;

        &:hover {
            text-decoration: none;

            .overlay-on-hover:after {
                opacity: 1;
            }
        }

        .caption {
            display: block;
            margin: 7px 0;
            position: relative;
            background: url(/Themes/PEBA/Content/Images/title-section.gif) repeat-x 0 50%;
            text-align: center;

            .layout-element-text {
                display: inline-block;
                text-align: center;
                color: #19203b;
                font-size: .917em;
                line-height: 1em;
                background: #fff;
                padding: 0 1em;
                margin: 0;
            }
        }

        .title {
            display: block;
            min-height: 44px;
            font-size: 20px;
            color: @peba-blue;
            line-height: 1em;
            text-transform: uppercase;
            text-align: center;
        }

        .overlay-on-hover {
            position: relative;
        }

        .overlay-on-hover:after {
            content: "> View the Collection";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
            opacity: 0;
            background: rgba(0,45,95,0.7);
            color: #fff;
            -webkit-transition: all .5s ease-in-out;
            transition: all .5s ease-in-out;
            padding-top: 50%;
            text-align: center;
        }
    }

    .hp-center-container {
        display: block;
        padding: 20px 40px;
        background-color: #fff;
        margin-bottom: 20px;

        &:hover {
            text-decoration: none;
        }

        .title {
            font-size: 30px;
            color: @peba-blue;
            line-height: 1em;
            display: block;
            text-transform: uppercase;
            text-align: center;
            margin-bottom: 20px;
        }
    }

    .hp-center-container-small {
        .text-overlay {
            padding: 20px 15% 0;
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            font-size: 1.833em;
            color: @peba-blue;
            line-height: 1em;
            text-transform: uppercase;
        }
    }

    .hp-seo {
        display: none;
    }
}

.os-quickshop-item {
    .os-product-price {
        .sale {
            color: red;
        }
    }
}

.os-quickshop-modal {
    .os-product-actions {
        margin-bottom: 0;

        .os-cta-add-wishlist {
            display: none;
        }
    }
}


@media (max-width: @screen-lg) {
}

@media (max-width: @screen-md) {
}

@media (max-width: @screen-sm) {
    .zone-navigation-right {
        padding-top: 10px;
    }
}

@media (max-width: 320px) {
    a {
        display: block;
        line-height: 8px;
        font-size: 10px;
    }
}
.os-navbar-global{
    .os-menu {
        li {
            &:hover {
                > .dropdown,
                > .dropdown-menu {
                    display: block
                }
            }
        }
    }
}
.os-mobile-aside {
    .os-menu {
        li {
            &.active {
                > .dropdown,
                > .dropdown-menu {
                    display: block;
                }
            }
        }
    }

    .os-mini-cart {
        .os-panel-body {
            max-height: 350px;
        }
    }
}

.menu-main-menu {
    .first {
        ul.dropdown-menu{
            li.dropdown {
                ul.dropdown-menu {
                    margin-top: -10px;
                    margin-left: 0;
                }
            }

            li.active.dropdown {
                a {
                    background-color: transparent;
                    color: black;
                }
                a:hover {
                    background-color: #f5f5f5;
                }
            }
        }
    }
}

/*.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background-color: transparent;
}*/

@media (max-width: @screen-lg) {
}

@media (max-width: @screen-md) {
}

@media (max-width: @screen-sm) {
}

@media (max-width: @screen-xs) {
}

@media (max-width: 320px) {
}