/* MAIN NAV BAR */
#menu_container {
    font-size: 12px;
    position: relative;
    z-index: 1000;
    clear: both;
    width: 100%;
    height: 50px;
    margin: 0 auto;
    padding: 0;
}

#menu_container #menu {
    list-style: none;
    z-index: 1100;
    min-width: 948px;
    width: 100%;
    max-width: 1440px;
    float: left;
    padding: 0px;
    margin: 0 auto 0 auto;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    position:relative;
}


#menu_container #menu ul {
    padding: 0;
    margin: 0;
}

#menu_container #menu > li {
    float: left;
    min-height: 36px;
    box-sizing: border-box;
}

#menu_container #menu > li > div {
    background: white;
    padding: 20px 0px 10px 0px;
    position: absolute;
    top: 50px;
    left: auto;
    z-index: 1200;
    display: none;
}

/*Convert to Javascript*/
/*#menu_container #menu > li:hover > div {
    display: block;
}*/

#menu_container #menu > li > .fullwidth {
    width: 100%;
    left: 0;
}

#menu_container #menu > li > .align_right {
    right: 0;
}

#menu_container #menu > li:hover > a {
    color: #333 !important;
    background-color: #fff;
}

#menu_container #menu li a {
	vertical-align: middle;
	font-size: 14.5px;
	/*color: #fff;*/
	line-height: 110%;
	outline: 0;
	text-decoration: none;
	display: block;
	text-transform: capitalize;
	display: grid;
    place-content: center;
    height: 100%;
}

#menu_container #menu li a.drop {
    text-align: center;
    padding: 10px 25px 1px 25px;
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    font-family: gibson_regular, sans-serif !important;
    font-weight: 400 !important;
}


#menu_container #menu li a.double-height {
    padding: 4px 12px 1px 12px;
}

#menu_container #menu li.right a.drop {
    text-align: center;
}

#menu_container #menu li.finalmenuli:hover {
    background: #666;
}


.final {
    float: right;
    color: #666 !important;
}

.finalmenuli {
    float: right !important;
}

.clearancemenu {
    color: #ff7166 !important;
    font-family: gibson_semibold, sans-serif !important;
    font-weight: 400 !important;
}

.clearancemenu a.final {
    color: #9a2424 !important;
    text-transform: uppercase !important;
}

.xmasmenu a.final {
    color: #a89972 !important;
    text-transform: uppercase !important;
}

.heading.xmasheading {
    border-bottom: 1px solid #a89972 !important;
}

#menu_container #menu li div.dropcontent li.xmasheading a {
    color: #a89972 !important;
}



#menu_container #menu li#garden:hover {
    background-color: #359b02;
    background-image: none;
}

#menu_container #menu li#garden a, #menu_container #menu li#garden a:hover {
    color: #fff;
}

#menu_container #menu li li {
    background-image: none;
    min-height: 15px;
    float: left;
    width: 100%;
}

/*#menu_container #menu li:hover .dropcontent {
    left: auto
}*/

/*#menu_container #menu li .align_right {
    right: 0px
}*/

/*#menu li:hover .align_right {
    left: auto;
    right: 0px
}*/

.border-right {
    border-right: 1px dotted #CCCCCC;
}

/*#menu_container #menu li div.fullwidth {
    z-index: 1200;
    position: absolute;
    width: 100%;
    min-width: 948px;
    padding: 20px 0px 10px 0px;
    left: -9999em;
    top: 50px;*/
    /*border-top: 5px solid #072939;*/
    /*background: white;
}*/


/*#menu_container #menu li:hover .fullwidth {
    display: block;
    left: 0px
}*/



#menu .col_2 a, #menu .col_3 a {
    color: #666;
    display: block !important;
    padding: 5px 5px 5px 0px !important;
}

#menu .col_2 li a, #menu .col_3 li a { /*border-bottom: 1px solid #EDEDED !important;*/
    font-size: 12px;
}

#menu .col_2 li a:hover, #menu .col_3 li a:hover {
    background: #EDEDED !important;
}


#menu .col_2 li.heading a, #menu .col_3 li.heading a {
    font-size: 16px !important;
}

#menu .drop1column {
    width: 80px
}

#menu .drop2columns {
    width: 160px
}

#menu .drop3columns {
    width: 240px;
}

#menu .drop4columns {
    width: 320px
}

#menu .drop5columns {
    width: 400px
}

#menu .drop6columns {
    width: 480px
}

#menu .drop7columns {
    width: 560px
}

#menu .drop8columns {
    width: 640px
}

#menu .drop9columns {
    width: 720px;
}

#menu .drop10columns {
    width: 800px
}

#menu .drop11columns {
    width: 880px
}

#menu .drop12columns {
    width: 960px
}

#menu .col_1, #menu .col_2,
#menu .col_3, #menu .col_4,
#menu .col_5, #menu .col_6,
#menu .col_7, #menu .col_8,
#menu .col_9, #menu .col_10,
#menu .col_11, #menu .col_12 {
    display: inline;
    float: left;
    position: relative;
    margin-left: 15px;
    padding-right: 14px;
    height: 100%;
}

#menu .col_1 {
    width: 50px
}

#menu .col_2 {
    min-width: 200px;
    width: 17%;
}

#menu .col_3 {
    width: 210px;
}

#menu .col_4 {
    width: 290px
}

#menu .col_5 {
    width: 370px
}

#menu .col_6 {
    width: 450px
}

#menu .col_7 {
    width: 530px
}

#menu .col_8 {
    width: 610px
}

#menu .col_9 {
    width: 690px
}

#menu .col_10 {
    width: 770px
}

#menu .col_11 {
    width: 850px
}

#menu .col_12 {
    width: 930px
}

/***** ADDED 15/12/2011 BY PETER TO ACCOMMODATE DOUBLE-WIDTH HEADERS *****/

div.doublewidth {
    width: 450px !important;
}

h4.doubleheader {
    margin: 0 0 5px 0 !important;
    border-bottom: 1px solid #EAEAEA;
}

    h4.doubleheader a {
        color: #000 !important;
        text-transform: uppercase;
        font-size: 12px;
        background: #EDEDED !important;
    }

div.doublewidth ul {
    width: 210px;
    float: left;
}

    div.doublewidth ul.left {
        margin-right: 30px !important;
    }

/*************************************************************************/

.clear, .hr {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0
}

#menu p, #menu h1, #menu h2, #menu h3, #menu h4, #menu h5, #menu h6 {
    padding: 0;
    margin: 0;
    color: #FFF;
}

#menu_container #menu p {
    font-size: 12px;
    line-height: 21px;
    margin-bottom: 18px
}

#menu h1, #menu h2 {
    background: url("img/menu_separator.jpg") bottom repeat-x;
    padding-bottom: 5px
}

#menu h1, #menu h2, {
    margin-bottom: 18px
}

#menu h4, #menu h5, #menu h6 {
    margin-bottom: 12px
}

#menu h1 {
    font-size: 36px;
    line-height: 36px
}

#menu h2 {
    font-size: 30px;
    line-height: 42px
}

#menu h3 {
    font-size: 24px;
    line-height: 26px
}

#menu h4 {
    font-size: 21px;
    line-height: 24px
}

#menu h5 {
    font-size: 18px;
    line-height: 28px
}

#menu h6 {
    font-size: 14px;
    line-height: 16px;
    text-transform: uppercase
}

#menu_container #menu li div.dropcontent li a,
#menu_container #menu li div.fullwidth li a {
    vertical-align: top;
    font-size: 14px;
    font-family: gibson_regular, sans-serif !important;
    font-weight: 400 !important;    
    display: inline;
    padding: 0;
    color: #000;
    white-space: nowrap;
    margin: 3px 0px;
}

#menu_container #menu li div.dropcontent li.heading a, #menu_container #menu li div.fullwidth li.heading a {
    margin: 0px;
    font-size: 100% !important;
    padding: 0 !important;
    color: #072939;
    line-height: 100%;
}

    #menu_container #menu li div.dropcontent li.heading a:hover, #menu_container #menu li div.fullwidth li.heading a:hover {
        background: white !important;
    }

    #menu_container #menu li div.fullwidth li.heading a:hover {
        color: #2b2b2b;
    }

#menu_container #menu li .dropcontent a:hover,
#menu li .fullwidth a:hover {
    padding: 0;
    color: #000;
}

.dropcap {
    display: block;
    float: left;
    font-size: 42px;
    line-height: 36px;
    margin: 2px 8px 0 0
}


li.heading {
    color: #072939;
    font-size: 130% !important;
    border-bottom: 1px solid #072939;
    float: left;
    width: 100%;
    margin-top: 3px;
    padding-bottom: 5px;
    font-family: gibson_semibold, sans-serif !important;
    font-weight: 400 !important;
}

li strong {
    font-family: gibson_semibold, sans-serif !important;
    font-weight: 400 !important;
}



#menu_container #menu li div.dropcontent li strong a, #menu_container #menu li div.fullwidth li strong a {
    color: #666;
}

.new-in span {
    color: #379b03 !important;
}

.heading.new-in {
    color: #379b03 !important;
    border-bottom: 1px solid #379b03 !important;
}



.pink span {
    color: #ca3d67 !important;
}

.heading.pink {
    color: #ca3d67 !important;
    border-bottom: 1px solid #ca3d67 !important;
}


/* controls the fade on menu hover */

.overlay {
    position: fixed;
    display: none;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #939598;
    opacity: .7;
    z-index: 998;
    height: 100%;
    overflow: hidden;
}



/*#menu_container:hover + div.overlay {
    display: block;
}*/



.xmas-guests {
    color: #a79a71 !important;
    border-bottom: 1px solid #a79a71 !important;
}

    .xmas-guests a {
        color: #a79a71 !important;
    }



/* --------------------- Nav font size media queries ------------------- */


@media screen and (min-width: 500px) {

    #menu_container #menu li a {
        font-size: 100%;
    }

        #menu_container #menu li a.drop {
            padding: 17px 18px 20px 18px;
        }
}

@media screen and (min-width: 1000px) {

    #menu_container #menu li a {
        font-size: 14.5px;
    }
}

@media screen and (min-width: 1000px) {

    #menu_container #menu li a.drop {
        padding: 17px 20px 18px 20px;
    }
}


/* --------------------- END ------------------- */


@media screen\0 {

    /*#menu_container #menu > li {
        width: 7%;
    }*/
    #menu_container #menu li.wide-nav {
        flex-basis: 13%;
        -webkit-flex-basis: 13%;
        width: 11%;
    }
}


/* iPad Mini */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) {

    #menu_container #menu > li {
        width: 9%;
    }

        #menu_container #menu > li.xmasmenu {
            width: 13%;
        }

    #menu_container #menu li.wide-nav {
        flex-basis: 13%;
        -webkit-flex-basis: 13%;
        width: 12%;
    }
}