﻿/*
CONTENTS
------------------------------------------------ 

    1.0 GLOBAL STYLES
    2.0 HEADER
        2.1 TOP BAR
        2.2 MEGA NAV
        2.3 MIDDLE BAR
        2.4 SUB NAV
    3.0 FOOTER
    4.0 HOME PAGE
    5.0 FAMILY LANDING
    6.0 PRODUCT DETAIL
    7.0 CATEGORY LANDING
    8.0 LOCATE A DEALER
    9.0 PRODUCT COMPARE
    10.0 SHOPPING CART
    11.0 MY ACCOUNT
    12.0 SEARCH RESULTS
    13.0 SUPPORT
    14.0 ARCHITECTS & BUILDERS
    15.0 PRODUCT SELECTOR
    16.0 GDO
    17.0 SITE ALERT

*/


@media (min-width:992px) {

    /* 1.0 GLOBAL STYLES
------------------------------------------------ */
    .interior-hero h2 {
        font-size: 44px;
        line-height: 44px;
    }

    /* form notes */
    .form-notes {
        font-size: 14px;
        height: 14px;
        line-height: 14px;
        margin-top: -7px;
        position: absolute;
        right: -160px;
        top: 50%;
        width: 150px;
    }

    .product-carousel .col-sm-6 {
        margin: 0;
    }

    .centered-text-image.height-215 {
        height: 170px;
    }

        .centered-text-image.height-215 img {
            max-height: 170px;
        }

        .centered-text-image.height-215 > div > span {
            font-size: 30px;
            line-height: 32px;
        }

    /* 2.0 HEADER
------------------------------------------------ */
    header {
        position: fixed;
        width: 100%;
        z-index: 1030;
    }

    .alert-open #body
    {
        padding-top:154px;
    }

    /* move body down to accomodate fixed header */
    #body {
        padding-top:  114px;
    }

        /* move body down to accomodate fixed header */
        #body.has-subnav {
            padding-top: 151px;
        }

        #body.has-subnav search{
            padding-top: 151px;
        }

    .top-nav {
        height: 50px;
    }

    .mid-nav {
        height: 64px;
    }

    .sub-nav {
        height: 37px;
    }


    /* 2.1 HEADER: TOP BAR
------------------------------------------------ */
    .top-nav {
        background: #000;
    }

        .top-nav .navbar-nav > li > a {
            color: #fff;
            font-size: 13px;
        }

            .top-nav .navbar-nav > li > a:hover,
            .top-nav .navbar-nav > li.dropdown:hover > a,
            .top-nav .navbar-nav > li.dropdown:hover > a.active {
                background: #5c5c5c;
                outline: none;
            }

        .top-nav .navbar-nav > li.dropdown.open > .dropdown-menu {
            display: none;
        }

        .top-nav .navbar-nav > li.dropdown.open:hover > .dropdown-menu,
        .top-nav .navbar-nav > li.dropdown:hover ul.dropdown-menu,
        .top-nav .navbar-nav > li.dropdown:hover .dropdown-menu {
            display: block;
        }

        .top-nav .navbar-nav > li > .dropdown-menu {
            background: #252525;
            border-top: 12px solid #5c5c5c;
            padding: 15px 24px;
        }

        .top-nav .navbar-nav .dropdown-menu > li > a {
            color: #fff;
            display: inline-block;
            font-size: 14px;
            padding: 10px;
            clear: both;
        }

            .top-nav .navbar-nav .dropdown-menu > li > a:hover,
            .top-nav .navbar-nav .dropdown-menu > li > a:focus {
                background: #98002d;
            }


    /* pair of links */
    header li.pair.left a,
    header li.pair.right a {
        margin: 12px 0;
        padding: 3px 6px;
    }

        header li.pair.left a:after {
            content: "|";
            position: absolute;
            right: -3px;
        }

    header li.pair.right a {
        margin-left: 3px;
    }

    header li.pair.right {
        margin-right: 72px;
    }

    /* about liftmaster */
    .about-lm {
        margin-right: 10px;
    }

    .top-nav .navbar-nav > li.about-lm > .dropdown-menu {
        padding-right: 65px;
    }

    /* locate a dealer */
    .top-nav .navbar-nav > li.dealer-btn a {
        background: #5C5C5C;
        font-family: 'Helvetica Neue 75';
        padding-left: 10px;
        padding-right: 10px;
        text-transform: uppercase;
        /*transition: background 0.25s ease;
        -webkit-transition: background 0.25s ease;*/
    }

        .top-nav .navbar-nav > li.dealer-btn a:hover,
        .top-nav .navbar-nav > li.dealer-btn a:focus {
            background: #313131;
        }



    /* 2.2 HEADER: MEGA NAV
------------------------------------------------ */
    .top-nav .navbar-nav > li.mega-nav {
        position: static;
    }

        /* positioning */
        .top-nav .navbar-nav > li.mega-nav > .dropdown-menu {
            margin-left: 240px;
            padding: 15px 0 0;
            width: 71%;
        }

    .top-nav .mega-nav > .dropdown-menu > .row {
        margin-left: 0;
        margin-right: 0;
        padding: 0 20px 15px 20px;
    }

    .top-nav .navbar-nav > li.mega-nav > a {
        font-family: 'Helvetica Neue 75';
        margin-right: 5px;
        text-transform: uppercase;
    }

        /* active item */
        .top-nav .navbar-nav > li.mega-nav > a.active {
            background: #98002D;
        }

            .top-nav .navbar-nav > li.mega-nav > a.active:hover {
                background: #5c5c5c;
            }

    .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column section > a {
        color: #949292;
        display: block;
        font-family: 'Helvetica Neue 75';
        font-size: 12px;
        margin: 5px;
        text-transform: uppercase;
        transition: color 0.25s ease;
        -webkit-transition: color 0.25s ease;
    }

        .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column section > a:hover,
        .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column section > a:focus {
            color: #98002d;
        }

    .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column > section {
        margin-top: 20px;
    }

        .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column > section:first-child {
            margin-top: 0;
        }

    .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column ul li {
        margin: 2px 0;
    }

        .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column ul li a {
            color: #fff;
            display: inline-block;
            font-size: 14px;
            padding: 5px 5px;
            transition: background 0.25s ease;
            -webkit-transition: background 0.25s ease;
        }

            .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column ul li a:hover,
            .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column ul li a:focus {
                background: #98002d;
            }

    .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column a:hover,
    .top-nav .navbar-nav > li.mega-nav .dropdown-menu .mega-nav-column a:focus {
        text-decoration: none;
    }

    /* bottom link */
    .mega-nav .bottom-link {
        background: #000;
        color: #fff;
        display: block;
        font-family: 'Helvetica Neue 35';
        font-size: 20px;
        margin-top: 15px;
        padding: 10px 35px;
        text-align: right;
        transition: all 0.25s ease;
        -webkit-transition: all 0.25s ease;
    }

        .mega-nav .bottom-link:hover,
        .mega-nav .bottom-link:focus {
            background: #525252;
        }

        .mega-nav .bottom-link .glyphicon {
            color: #98002d;
            display: inline-block;
            font-size: 14px;
            margin-left: 15px;
        }

        .mega-nav .bottom-link:hover .glyphicon,
        .mega-nav .bottom-link:focus .glyphicon {
            color: #000;
        }



    /* 2.3 HEADER: MIDDLE BAR
------------------------------------------------ */
    .mid-nav {
        background: #98002d;
        padding: 15px 0;
    }

        /* search box */
        .mid-nav .search {
            position: relative;
        }

            .mid-nav .search .glyphicon {
                color: #aaa;
                position: absolute;
                right: 25px;
                top: 10px;
                -webkit-transition: color ease .25s;
                transition: color ease .25s;
            }

            .mid-nav .search.focused .glyphicon {
                color: #98002d;
            }

            .mid-nav .search input {
                border: 1px solid transparent;
                height: 34px;
                padding: 3px 10px;
                width: 100%;
                -webkit-transition: border ease .25s;
                transition: border ease .25s;
            }

                .mid-nav .search input:focus {
                    border-color: #7e7e7e;
                }


    /* pair of links */
    .header-links {
        height: 34px;
        text-align: right;
    }

        .header-links > ul {
            display: inline-block;
            margin-bottom: 0;
        }

        .header-links li {
            color: #fff;
            display: inline-block;
            position: relative;
        }

            .header-links li a {
                color: #fff;
            }

                .header-links li a:hover,
                .header-links li a:focus {
                    background: #79232e;
                }

    header .header-links li.pair.right {
        margin-right: 0;
    }

        header .header-links li.pair.right a {
            margin-left: 0;
        }

    /* my account dropdown */
    header .header-links li.pair.left .dropdown-menu {
        background: #252525;
        border-top: 12px solid #79232e;
        padding: 15px;
        text-align: left;
    }

    .header-links .dropdown-menu li {
        display: block;
    }

    header .header-links li.pair.left .dropdown-menu li a {
        color: #fff;
        display: inline-block;
        margin: 0;
        padding: 8px;
        text-align: left;
    }

        header .header-links li.pair.left .dropdown-menu li a:after {
            content: "";
            left: 0;
            position: relative;
        }

    header .header-links li.pair.left .dropdown.open .dropdown-menu {
        display: none;
    }

    header .header-links li.pair.left .dropdown.open:hover .dropdown-menu,
    header .header-links li.pair.left .dropdown:hover .dropdown-menu {
        display: block;
    }

    header .header-links li.pair.left .dropdown:hover > a {
        background: #79232e;
    }

    /* cart icon */
    .cart-icon {
        display: inline-block;
    }

        .cart-icon a {
            color: #fff;
            display: block;
            margin-left: 5px;
            margin-top: 7px;
            text-transform: uppercase;
            /*-webkit-transition: color ease .15s;
            transition: color ease .15s;*/
        }

        .cart-icon .fa {
            font-size: 22px;
            margin-right: 6px;
            vertical-align: bottom;
        }

        .cart-icon:hover > a,
        .cart-icon:focus > a {
            color: #000;
        }

            .cart-icon:hover > a .number,
            .cart-icon:focus > a .number {
                background: #fff;
            }

        .cart-icon:hover {
        }

            .cart-icon:hover > .cart-preview {
                display: block;
            }

        .cart-icon .number {
            right: 0;
            top: 0;
        }

    /* cart preview */
    .cart-preview {
        display: none;
        margin: 0 !important;
        overflow: hidden;
        padding-top: 20px;
        position: absolute;
        right: 0;
        text-align: left;
        top: 29px;
        width: 350px;
    }

        .cart-preview a {
            text-transform: none;
        }

        .cart-preview > * {
            background-color: #fff;
        }

        .cart-preview > ul {
            border-color: #d1d1d1;
            border-style: solid;
            border-width: 0;
            border-left-width: 1px;
            border-right-width: 1px;
            margin: 0;
        }

            .cart-preview > ul > li {
                color: #000;
                padding: 15px;
                padding-bottom: 0;
            }

                .cart-preview > ul > li a {
                    color: #98002d;
                    margin: 0;
                }

                    .cart-preview > ul > li a:hover {
                        background-color: transparent;
                        color: #79232e;
                    }

        .cart-preview > p {
            border-color: #d1d1d1;
            border-style: solid;
            border-width: 0;
            border-left-width: 1px;
            border-right-width: 1px;
            margin: 0;
            padding: 15px;
        }

        /* bottom link */
        .cart-preview .bottom-link {
            background: #000;
            color: #fff !important;
            display: block;
            font-family: 'Helvetica Neue 35';
            font-size: 20px;
            margin: 0;
            padding: 10px 35px;
            text-align: right;
            text-transform: initial;
            -webkit-transition: all 0.25s ease;
            -moz-transition: all 0.25s ease;
            -ms-transition: all 0.25s ease;
            -o-transition: all 0.25s ease;
            transition: all 0.25s ease;
        }

            .cart-preview .bottom-link .glyphicon {
                color: #98002d;
                display: inline-block;
                font-size: 14px;
                margin-left: 15px;
            }

            .cart-preview .bottom-link:hover,
            .cart-preview .bottom-link:focus {
                background: #525252;
            }

                .cart-preview .bottom-link:hover .glyphicon,
                .cart-preview .bottom-link:focus .glyphicon {
                    color: #000;
                }


    /* 2.4 HEADER: SUB NAVIGATION
------------------------------------------------ */
    .sub-nav {
        background: rgb(222,222,222); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(222,222,222,1) 0%, rgba(247,247,247,1) 40%, rgba(248,248,248,1) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(222,222,222,1)), color-stop(40%,rgba(247,247,247,1)), color-stop(100%,rgba(248,248,248,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(222,222,222,1) 0%,rgba(247,247,247,1) 40%,rgba(248,248,248,1) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(222,222,222,1) 0%,rgba(247,247,247,1) 40%,rgba(248,248,248,1) 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, rgba(222,222,222,1) 0%,rgba(247,247,247,1) 40%,rgba(248,248,248,1) 100%); /* IE10+ */
        background: linear-gradient(to bottom, rgba(222,222,222,1) 0%,rgba(247,247,247,1) 40%,rgba(248,248,248,1) 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#f8f8f8',GradientType=0 ); /* IE6-9 */
        padding: 10px 0 0;
    }

        .sub-nav .nav-wrapper {
            height: 27px;
            text-align: justify;
        }

            .sub-nav .nav-wrapper * {
                display: inline;
            }

            .sub-nav .nav-wrapper ul {
                margin: 0;
            }

            .sub-nav .nav-wrapper li {
                display: inline-block;
            }

                .sub-nav .nav-wrapper li a {
                    border-bottom: 3px solid transparent;
                    color: #2d2d2d;
                    padding-bottom: 8px;
                    transition: border 0.25s ease;
                }

                    .sub-nav .nav-wrapper li a:hover,
                    .sub-nav .nav-wrapper li a:focus,
                    .sub-nav .nav-wrapper li.active a {
                        border-bottom: 3px solid #98002d;
                    }

            .sub-nav .nav-wrapper span {
                display: inline-block;
                position: relative;
                width: 100%;
                height: 0;
            }

    /* products side by side */
    .product-blocks .display-block .text {
        margin-top: 25px;
    }


    /* BREADCRUMB */
    /*.breadcrumb {
        top: 187px;
    }*/


    /* 3.0 FOOTER
------------------------------------------------ */
    /* share buttons */
    .share > .row > div {
        text-align: left;
    }

    footer .social-links {
        margin-top: 0;
    }

    .share a {
        text-align: left;
    }


    /* 4.0 HOME PAGE
------------------------------------------------ */
    .home-carousel h2 {
        margin: 50px 0 0;
    }

    .dealers-architects h2 {
        font-size: 38px;
        line-height: 38px;
    }

    /* indicators with text */


    .home-carousel .carousel-indicators li {
        border: none;
        border-left: 2px solid #fff;
        border-right: 2px solid #fff;
        border-radius: 0;
        background-color: rgba(37, 37, 37, 0.7);
        color: #fff;
        cursor: pointer;
        display: inline-block;
        height: 40px;
        line-height: 40px;
        margin: 0;
        overflow: hidden;
        text-indent: 0;
        width: 25%;
        transition: background ease .25s;
        -webkit-transition: background ease .25s;
    }

        .home-carousel .carousel-indicators li:first-child {
            border-left: 0;
        }

        .home-carousel .carousel-indicators li:last-child {
            border-right: 0;
        }

        .home-carousel .carousel-indicators li.active,
        .home-carousel .carousel-indicators li.active:hover,
        .home-carousel .carousel-indicators li.active:focus {
            background: #98002d;
            color: #98002d;
        }

        .home-carousel .carousel-indicators li .caption {
            display: block;
        }

        .home-carousel .carousel-indicators li.active .caption {
            display: none;
        }


        .home-carousel .carousel-indicators li:hover,
        .home-carousel .carousel-indicators li:focus {
            background-color: #000;
        }

        .home-carousel .carousel-indicators li .caption {
            font-family: 'Helvetica Neue 45';
            height: 100%;
            width: 100%;
        }



    /* 5.0 FAMILY LANDING
------------------------------------------------ */
    .product-info-bottom {
        padding: 0 50px 50px 50px;
    }

    .product-grid .product-info-top {
        padding: 50px 50px 0;
    }

    .product-info-top .number {
        font-size: 40px;
    }

    .product-info-top .row.icons {
        height: auto;
    }

        .product-info-top .row.icons > div {
            margin-bottom: 0;
        }


    /* PRODUCT GRID: two by two (family landing)*/
    .product-grid .product-info-top .overlay {
        background: #f4f4f4;
        background: rgba(244,244,244,0.98);
        color: #313131;
        height: 100%;
        left: 0;
        padding: 15% 5%;
        position: absolute;
        top: 0;
        width: 100%;
    }

    .product-grid .product-info-top:hover .overlay {
        display: block;
    }

        .product-grid .product-info-top:hover .overlay p {
            margin-bottom: 20px;
        }


    /* sprite, product icons */
    .family-landing .product-icons .group {
        margin-bottom: 0;
    }

    .family-landing .product-icons .sprite {
        margin-bottom: 10px;
        margin-right: 5px;
    }

    .family-landing .product-icons .group {
        display: inline-block;
    }




    /* 6.0 PRODUCT DETAIL
------------------------------------------------ */
    .product-detail-rotator .item {
        height: 210px;
    }

    .product-detail-right .social-links li a {
        height: 35px;
        width: 35px;
    }

    .product-rotator .product-info .wishlist-btn {
        margin-top: 0;
    }

    .customer-reviews .ratings {
        margin-bottom: 15px;
    }

    .customer-reviews .rating .stars {
        display: inline-block;
        margin-bottom: 0;
        margin-right: 10px;
    }

    .customer-reviews .ratings .rating-num {
        font-size: 25px;
        line-height: 25px;
    }

    .stars.large .fa {
        font-size: 25px;
    }

    div#pnlMain:target
    {
        padding-top: 100px;
    }


    /* 7.0 LOCATE A DEALER
------------------------------------------------ */
    /* address/distance */
    .page-locate-dealer .address .col-md-8 {
        margin-bottom: 0;
        padding-right: 5px;
    }

    .page-locate-dealer .address .col-md-4 {
        padding-left: 5px;
    }

    .legend > div {
        margin-top: 0;
    }

    .dealer-detail .col-sm-6 section > .row > .col-md-6:first-child {
        margin-bottom: 0;
    }



    /* 8.0 CATEGORY LANDING
------------------------------------------------ */
    .product-blocks.cat-landing .overlay {
        background: #252525;
        background: rgba(37,37,37,0.9);
        color: #fff;
        font-family: 'Helvetica Neue 45';
        font-size: 26px;
        height: 100%;
        left: 0;
        line-height: 36px;
        position: absolute;
        top: 0;
        width: 100%;
    }

        .product-blocks.cat-landing .overlay div {
            height: 100%;
            position: relative;
            width: 100%;
        }

        .product-blocks.cat-landing .overlay > div > span {
            font-size: 20px;
            line-height: 22px;
            padding: 0 100px 0 60px;
            text-align: left;
        }

    .product-blocks.cat-landing a:hover .overlay {
        display: block;
    }



    /* 9.0 PRODUCT COMPARE
------------------------------------------------ */

    .product-compare .left-col .row > div,
    .product-compare .right-col .row.table-row,
    .product-compare .right-col .row.table-row > div,
    .product-compare .right-col .row.wishlist,
    .product-compare .right-col .row.wishlist > div {
        height: 70px;
    }

        .product-compare .left-col .row > div > div p {
            font-size: 14px;
        }

    .product-compare .right-col .wishlist-btn {
        text-align: left;
    }

    .product-compare .product-info.row,
    .product-compare .product-info.row > div {
        overflow: hidden;
    }

    .product-compare .left-col .row > div > div p {
        font-size: 14px;
    }

    .product-compare .right-col > div > .row.table-row > div > p {
        font-size: 14px;
        line-height: 18px;
    }

    /* 10.0 SHOPPING CART
------------------------------------------------ */
    /* shopping cart header */
    .shopping-cart-header .header-links {
        /*line-height: 40px;*/ line-height: 16px; /* TODO: check with Liz on this */
    }

        .shopping-cart-header .header-links ul:first-child { /* TODO: check with Liz on this */
            margin-top: 10px;
        }

    .shopping-cart-header #body {
        padding-top: 60px;
    }
    .alert-open.shopping-cart-header #body {
        padding-top: 104px !important;
    }
    .shopping-cart .sidebar {
        margin-top: 0;
    }

        .shopping-cart .sidebar .product-carousel .carousel-inner .col-xs-12 {
            border-top: 1px solid #E8E7E7;
        }

    .shopping-cart .order-review .sidebar {
        margin-top: 10px;
    }


    /* 11.0 MY ACCOUNT
------------------------------------------------ */
    /* vertically aligning*/
    .my-account .my-wishlist-preview .row a {
        height: 120px;
    }

        .my-account .my-wishlist-preview .row a .col-sm-9 {
            height: 80px;
        }

    /* change password, kentico markup */
    .account-settings .ChangePasswordTable {
        width: 75%;
    }


    /* 12.0 SEARCH RESULTS
------------------------------------------------ */
    .search-results h2 {
        margin: 10px 0 30px;
    }

    .search-results .list-header .pagination {
        margin-top: 0;
    }

    .predictive-search-dropdown {
        height: 276px;
        left: 14px;
        overflow-y: scroll;
        -ms-overflow-y: scroll;
        position: absolute;
        top: 35px;
    }

        .predictive-search-dropdown .item {
        }

            .predictive-search-dropdown .item .title {
            }

            .predictive-search-dropdown .item .item-container {
            }

                .predictive-search-dropdown .item .item-container:hover,
                .predictive-search-dropdown .item .item-container:focus {
                }

    /* 13.0 SUPPORT
------------------------------------------------ */
    .support-videos .video-padding {
        height: 350px;
    }

    .customer-support .faqs .col-md-5 {
        padding-left: 2px;
    }

    .customer-support .contact-us .icon,
    .customer-support .virtual-agent .icon {
        /*height: auto;
        float: left;
        margin-right: 15px;
        width: 50px;*/
    }

    /* parts diagram stacking */
    .parts-diagram > .row > div.col-md-3 {
        margin-top: 0;
    }

    /* 14.0 ARCHITECTS & BUILDERS
------------------------------------------------ */

    /* grid */
    .arch-builder-grid .grid-body > .row > div > div {
        height: 195px;
    }

    .grid-body > .row > div.centered {
        height: 197px;
    }

    .arch-builder-grid .header > div > div span {
        font-size: 18px;
    }

    /* contact page */
    .shopping-cart.arch-builder-contact .shipping-billing .header {
        height: 95px;
    }

    /* 15.0 PRODUCT SELECTOR
------------------------------------------------ */

    .prod-select-results .prod-select-header .compare-items a {
        margin-left: 15px;
    }

    /* 16.0 GDO
------------------------------------------------ */

    .gdo-boxes .col-md-6 {
        height: 325px;
    }

    .gdo-boxes .col-md-6 {
        margin-bottom: 0;
    }

    /* 17.0 SITE ALERT
------------------------------------------------ */
    .alert-notification {
        max-width: 1400px;
    }
}
/* end media query */
