/*  -------------------------------------------------------------
    -------------------------------------------------------------
    PAGE SPECIFIC OVERRIDES - clearpixel.com.au
    -------------------------------------------------------------
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */

    @media only screen and (max-width: 1200px) {

        /* Header */

        #header {
            padding-top: 20px;
            border-bottom: none;
            background-image: none;
        }

        #header-i {
            padding-bottom: 0;
            height: auto;
        }

        #header a.logo_desktop:link,
        #header a.logo_desktop:visited {
            display: none;
        }

        #header a.logo_mobile:link,
        #header a.logo_mobile:visited {
            display: block;
        }

        #header a.btn_mobile:link,
        #header a.btn_mobile:visited {
            display: block;
        }

        #header a.btn_mobile.active:link,
        #header a.btn_mobile.active:visited {
            background: #10181f;
        }

        #header .search_bar {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 300;
            display: none;
            padding-right: 0;
            width: 100%;
            -webkit-box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
            -moz-box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
            box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
        }

        #header .search_bar .textbox {
            padding: 0 70px 0 20px;
            height: 60px;
            font: 16px Arial, Helvetica, Sans-serif;
            -webkit-border-bottom-right-radius: 0;
            -webkit-border-bottom-left-radius: 0;
            -moz-border-radius-bottomright: 0;
            -moz-border-radius-bottomleft: 0;
            border-bottom-right-radius: 0;
            border-bottom-left-radius: 0;
        }

        #header .search_bar .btn {
            left: auto;
            right: 0;
            width: 75px;
            height: 60px;
            -webkit-border-bottom-left-radius: 0;
            -moz-border-radius-bottomleft: 0;
            border-bottom-left-radius: 0;
        }




        /* Menu Main */

        #menu_main {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 300;
            display: none;
            padding: 0;
            width: 100%;
            background: #10181f;
            -webkit-box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
            -moz-box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
            box-shadow: 0px 10px 40px 0px rgba(0,0,0,0.75);
        }

        #menu_main li {
            position: static;
            float: none;
            width: 100%;
        }

        #menu_main li a:link,
        #menu_main li a:visited {
            float: left;
            padding: 14px 20px;
            width: 100%;
            height: auto;
            line-height: 1.25em;
            color: #fff;
            border-top: 1px #4c4c4c solid;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        #menu_main li.hasChilds a:link span,
        #menu_main li.hasChilds a:visited span {
            padding-right: 0;
            background: none;
        }

        #menu_main li.hasChilds ul {
            display: none;
        }

        #menu_main li.active a:link,
        #menu_main li.active a:visited {
            color: #f37131;
        }

        #menu_main li a:hover,
        #menu_main li.hasChilds:hover,
        #menu_main li.hasChilds:hover a:link,
        #menu_main li.hasChilds:hover a:visited {
            color: #fff;
            background: none;
        }

        #menu_main li.hasChilds.active:hover a:link,
        #menu_main li.hasChilds.active:hover a:visited {
            color: #f37131;
            background: none;
        }




        /* Main */

        #main .home_banner .hero_banner {
            min-height: 450px;
        }

        #main .home_banner .hero_banner h1 {
            padding-top: 120px;
            font-size: 4em;
        }

        #main .home_banner .hero_banner h1 a:link,
        #main .home_banner .hero_banner h1 a:visited,
        #main .home_banner .hero_banner h1 a:hover {
            background: rgba(0, 0, 0, 0.2);
        }

        #main .home_banner .btns a.btn.blue:hover,
        #main .home_banner .btns a.btn.black:hover,
        #main .home_banner .btns a.btn.red:hover {
            background: rgba(255, 255, 255, 0.2);
        }
    }




    @media only screen and (max-width: 900px) {

        /* Locations - Browse */

        #content #locations_browse .location {
            width: 50%;
        }

        #locations_browse #gmap_map,
        #location_full #gmap_map {
            height: 200px !important;
        }

    }




    @media only screen and (max-width: 850px) {

        /* Home Banner */

        #main .home_banner .hero_banner h1 {
            padding-top: 90px;
        }




        /* Brands Categories */

        #content #brand_categories a.category:link,
        #content #brand_categories a.category:visited {
            width: 47%;
        }

        #content #brand_categories a.category:link .title .title-iii,
        #content #brand_categories a.category:visited .title .title-iii {
            font-size: 1.2em;
        }

        #content #brand_categories a.category:hover .title .title-iii {
            background: #f37131;
        }




        /* Footer */

        #footer p,
        #footer .links p {
            float: none;
            padding: 10px 0 10px 0;
            text-align: center;
        }

        #footer p br {
            display: none;
        }

        #footer .links {
            float: none;
            width: auto;
        }

        #footer .links a.logo_cp:link,
        #footer .links a.logo_cp:visited {
            float: none;
            margin: 5px auto 10px auto;
        }

    }




    @media only screen and (max-width: 650px) {

        /* Home Brands */

        #content .home_brands a.brand:link,
        #content .home_brands a.brand:visited {
            margin: 20px 4%;
            width: 40%;
            height: auto;
        }

        #content .home_brands a.brand:link img,
        #content .home_brands a.brand:visited img,
        #content .home_brands a.brand:hover img {
            width: 100%;
        }

        #content .home_brands a.brand:link .helper,
        #content .home_brands a.brand:visited .helper {
            display: none;
        }




        /* Brands Browse */

        #content #brands_browse a.brand:link,
        #content #brands_browse a.brand:visited {
            margin: 20px 4%;
            width: 40%;
            height: auto;
        }

        #content #brands_browse a.brand:link img,
        #content #brands_browse a.brand:visited img,
        #content #brands_browse a.brand:hover img {
            width: 100%;
        }

        #content #brands_browse a.brand:link .helper,
        #content #brands_browse a.brand:visited .helper {
            display: none;
        }




        /* Search Page */

        #main #content #search #searchForm #searchQuery {
            width: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        #main #content #search #searchForm #searchButton {
            display: none;
        }

    }




    @media only screen and (max-width: 600px) {

        /* Home Banner */

        #main .hero_banner .text h1.mobile_heading {
            display: block;
            text-align: center;
        }

        #main .hero_banner .btns a.btn:link,
        #main .hero_banner .btns a.btn:visited,
        #main .hero_banner .btns a.btn.first:link,
        #main .hero_banner .btns a.btn.first:visited,
        #main .hero_banner .btns a.btn.last:link,
        #main .hero_banner .btns a.btn.last:visited {
            margin: 10px 0 0 0;
            float: none;
            width: 100%;
            height: 46px;
            line-height: 46px;
        }

        #main .hero_banner .btns a.btn.blue:hover,
        #main .hero_banner .btns a.btn.black:hover,
        #main .hero_banner .btns a.btn.red:hover {
            border-color: transparent;
        }

        #main .hero_banner .btns a.btn.blue:hover {
            background: #00519b;
        }

        #main .hero_banner .btns a.btn.black:hover {
            background: #000;
        }

        #main .hero_banner .btns a.btn.red:hover {
            background: #db181f;
        }




        /* Columns */

        #content .columns .column,
        #content .columns .column.last,
        #content .columns.side_right .column,
        #content .columns.side_right .column.last,
        #content .columns.half_width .column,
        #content .columns.half_width .column.last,
        #content .columns.three .column,
        #content .columns.three .column.first,
        #content .columns.three .column.last {
            float: none;
            margin: 0 0 20px 0;
            width: 100%;
        }

        #content .columns .column.last,
        #content .columns.side_right .column.last,
        #content .columns.half_width .column.last,
        #content .columns.three .column.last {
            margin-bottom: 0;
        }

    }




    @media only screen and (max-width: 550px) {

        /* Header */

        #header a.logo_mobile:link,
        #header a.logo_mobile:visited {
            width: 200px;
        }

        #header a.btn_mobile:link,
        #header a.btn_mobile:visited {
            height: 40px;
            font-size: 1.5em;
            line-height: 40px;
        }

        #header a.btn_mobile.search:link span,
        #header a.btn_mobile.search:visited span {
            width: 14px;
            height: 14px;
        }

        #header a.btn_mobile.menu:link span,
        #header a.btn_mobile.menu:visited span {
            width: 18px;
            height: 12px;
        }




        /* Locations - Browse */

        #content #locations_browse .location {
            float: none;
            margin: 0 auto;
            width: auto;
            max-width: 270px;
        }




        /* Summarise Subs */

        #summariseSub .item,
        #summariseSub .item.odd {
            clear: none;
            float: none;
            width: 100%;
        }




        /* Home Banner */

        #main .home_banner .hero_banner h1 {
            padding-top: 60px;
            font-size: 3em;
        }

        #main .home_banner .hero_banner h1 a:link,
        #main .home_banner .hero_banner h1 a:visited,
        #main .home_banner .hero_banner h1 a:hover {
            padding-left: 20px;
            padding-right: 20px;
        }

        #main .home_banner .btns {
            display: block;
            padding: 0;
            min-height: 0;
            max-height: none;
        }

        #main .home_banner .btns a.btn:link, 
        #main .home_banner .btns a.btn:visited {
            float: none;
            display: block;
            margin: 0;
            width: 100%;
            height: 60px;
            line-height: 60px;
            border: none;
            border-bottom: 2px solid #fff;
            background-color: transparent;
        }

        #main .home_banner .btns a.btn.first:link,
        #main .home_banner .btns a.btn.first:visited {
            margin-top: 9px;
        }

    }




    @media only screen and (max-width: 500px) {

        /* Main */

        #main .home_banner .hero_banner h1 {
            font-size: 3em;
        }




        /* Main Divs */

        #main-i {
            min-height: 0;
            background-size: contain;
        }

    }




    @media only screen and (max-width: 450px) {

        /* Brands Categories */

        #content #brand_categories a.category:link,
        #content #brand_categories a.category:visited {
            margin: 20px 0 0 0;
            width: 100%;
        }

    }




    @media only screen and (max-width: 350px) {

        /* Footer */

        #footer .links p span {
            display: none;
        }

        #footer .links p a:link,
        #footer .links p a:visited {
            text-decoration: underline;
            color: #f37131;
            border-right: none;
        }

    }