﻿

/* Disable the resize grabber */
textarea { resize: none; }

input.form-control[type=text]{ min-width: 40px;}

/* Custom validation styles */
.validation-summary-valid { display: none; }
.error, .field-validation-error { font-weight: normal; color: #ff0000; font-size: 0.833em; }

/* Set font weight normal for checkbox labels */
label.checkbox { font-weight: normal; padding-left: 20px; }

/* When we have two block buttons in the same space, remove the 5px default margin. This is for there are two buttons and only one might be displayed at once */
.btn-block + .btn-block { margin-top: 0; }

/* Enlarge the dropdown menu area in the header */

/* Allow all our menu items on the navbar along with the search input */
.nav > li > a { padding-left: 8px; padding-right: 8px; }

/* Pad the notification elements a little */
.notification { padding: 15px; }

/* Enable an active status in the second & third level items in a stacked navbar (category listing) */
.nav-stacked > li > ul > li.active { font-weight: bold; }
.nav-stacked > li > ul > li > ul li { font-weight: normal; }
.nav-stacked > li > ul > li > ul li.active { font-weight: bold; }

/* Lessen the padding in the lhs category nav (otherwise we potentially run out of space) */
.nav-stacked > li > ul { padding-left: 2em; }
.nav-stacked > li > ul > li > ul { padding-left: 1em; }

/* Gobal image style to get around issues with image tags being set in the database. Images should use the img-responsive class to ensure 100% width of the container */
img { vertical-align: middle; border: 0; max-width: 100%; }

/* Product listing - old Newmarket styles */
/* Sale item */
.sale { background: url("/images/flag-sale.png") no-repeat; display: block; height: 46px; position: absolute; right: 5px; top: 0; width: 46px; z-index: 99;}

/* Quicklook */
.quicklook { position: absolute; top: 60%; width: 100%; left: 0; }
.quicklook a { width: 134px; height: 36px; text-indent: -9999px; background: url(/images/icons/btn-quicklook.png) 0 -40px no-repeat; margin: 0 auto; display: none; }
article.productData .quicklook { width: 30%;}
article:hover .quicklook a { display: block; }

/* Was price for products on sale */
.was { color: #666666; padding-right: 5px; text-decoration: line-through; font-size: 11px; }

/* Product rating stars */
.rating { background: url(/Modules/Custom/Images/svgs/rating-stars.svg) no-repeat 0 0; width: 115px; padding-bottom: 5px; height: 20px; }
.r_1 { background-position: 0  0; }
.r_2 { background-position: 0 -20px; }
.r_3 { background-position: 0 -40px; }
.r_4 { background-position: 0 -60px; }
.r_5 { background-position: 0 -80px; }
.no-touch  .storefinderPhoneNumber { pointer-events: none; } 

/* Quicklook */
.whereInStock { text-decoration: none; color: #000; display: block; background: url('/images/sprite-sheet.png') 0 -120px no-repeat; text-indent: 33px; height: 35px; line-height: 35px; }
.sendToFriend { background: url('/images/sprite-sheet.png') 0 -161px no-repeat; text-indent: 40px; text-decoration: none; color: #000; display: block; height: 35px; line-height: 35px; }
.sendToFriend:hover, .whereInStock:hover { text-decoration: none; color: #000; }

/* Allow the thumbnails to scroll rather than be pushed down to the next line */
.thumbnails .list-inline { overflow-x: auto; white-space: nowrap; }
.thumbnails .list-inline li { width: 25%; padding-left: 0; padding-right: 0; }
.thumbnails .list-unstyled li { padding-left: 0; padding-right: 0; margin-bottom:1em;}

/* Set the cursor over the thumbnails & make it obvious you can click */
.thumbnails img { cursor: pointer; }

/* Additional multiselect styles to allow full width in some cases (eg product detail) */
/*.multiselect-fullwidth .btn-group, .multiselect-fullwidth .dropdown-menu { width: 100%; }*/
.multiselect-fullwidth .multiselect { text-align: left; }
.multiselect-fullwidth .multiselect b.caret { position: absolute; top: 14px; right: 8px; }

/* Need a little bit of padding on product detail div */
/*.productDetail { padding-right: 25px; }*/

.productDetail .layBuyLogo, .productContentWrapper .layBuyLogo {
    display: inline-block;
    background-image: url(/Modules/Custom/Images/laybuy-option.png);
    width: 20px;
    height: 16px;
    background-size: cover;
    position: relative;
    top: 3px;
    margin-left: 4px;
    margin-right: 4px;
}


.productDetail .afterPayLogo {display: inline-block;background-image: url(/Modules/Custom/Images/afterpay-option.png);width: 78px;height: 16px;background-size: cover;position: relative;top: 3px;margin-left: 4px;}
.productDetail .afterPayMessage{ background-color: #f5f5f5; padding: 2px 11px 4px; margin: 4px 0 10px; font-size: 90%; }
.productDetail .flexipayLogo  { display: inline-block; background-image: url(/Modules/Custom/Images/flexi-pay-option.png); width: 16px; height: 16px; background-size: cover; position: relative; top: 3px; margin-left: 4px; }

/* Side cart */
/*#SideCart h5 { padding: 0; margin: 0 0 2px; }*/
#SideCart .dropdown-menu { min-width: 447px;  z-index:1001; }
/*#SideCart .count { margin-right: 10px; width: 30px; height: 36px; background: url(/images/sprite-sheet.png) 0px -55px no-repeat; display: inline-block; color: #FFFFFF; font-size: 12px; line-height: 48px; font-weight: bold; text-align: center; }*/
#SideCart .remove { background: url("/images/icons/cross.png") no-repeat; display: block; height: 18px; width: 20px; cursor: pointer; }
body.ShoppingCart .mobileCartSummary { display: none;}

/* Shopping cart */
.expander .plusToggle.left { float: left; }
.expander .plusToggle { float: right; width: 9px; height: 13px; margin-top: 3px; margin-right: 0; position: absolute; top: 0; right: 0; }
.expander.collapsed .close-bar:nth-child(2) { -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.expander .close-bar:nth-child(2) { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg);  -webkit-transform: rotate(0deg); transform: rotate(0deg); }
.expander .close-bar { height: 1px; margin: 4px 0 0; width: 9px; display: block; background-color: #000; position: absolute; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); opacity: 1; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; -webkit-transition: all .2s ease-in; transition: all .2s ease-in; }

/* Carousel images should scale correctly */
.carousel img { margin: 0 auto; }

/* Product detail */
.productDetail { position: relative; }
.productImageZoom { position: absolute; width: 95%; height: 100%; z-index: -1; }

#ProductDetail article img { margin: 0 auto 1em auto; }

.productDetail .swatch{cursor:pointer; float:left;margin-right:10px;margin-top:10px; width:27px;height:27px;line-height:24px; border:1px solid #000;text-align:center;font-size:0.81em;}
.productDetail .swatch.oos { border: 1px solid #A0A0A0;}
.productDetail .swatch.selected{border:2px solid #a0a0a0;}

.stockMessage{font-weight:bold;}

/* Required for image zoom  to work in modal*/
/*.zoomContainer.zoom-quicklook{ z-index: 1060;}
.zoom-quicklook .zoomWindow{ z-index: 1060;}*/

/* Checkout steps */
/*.checkoutSteps > div > div { opacity: 0.5; }
.checkoutSteps > div > div.active  { font-weight: bold; opacity: 1; }*/

/* Rate Shopping Experience */
.iframeForm td{ padding-right:13px;}
.iframeForm input[type="radio"], .iframeForm input[type="checkbox"]{position:relative; top:2px;}
.iframeForm label{margin-left:5px;}
.rateArrow{background:url("/images/filter-arrow.png")no-repeat 3px -10px; width:18px; height:15px; display:inline-block; position:relative; top:2px;}
.rbs{margin-bottom:1em;}
/* Vertical border in checkout */
.verticalRightBorder { border-right: 1px solid #eee; }

/* Invoice */
.invoice .well { padding: 5px 15px; }
.invoice .dl-horizontal dt { text-align: left; }

/* Footer icons */
footer .fa { font-size: 35px; }

/* Search box */
#Search a { cursor: pointer; }
#Search a:hover { color: initial; }
#Search .dropdown-menu { padding: 10px; }
#Search .highlight { font-weight: bold; }

/* Search */
.acomplete { z-index: 99;height: auto; float:right; width:380px; background-color:#fff; position:absolute; right:0;  -moz-box-shadow: 0 10px 12px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 10px 12px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 12px rgba(0, 0, 0, 0.1);}
.acomplete .border{margin-left:-1px; border-left:1px solid #ccc; }
.acomplete .suggest {padding-top:1em; padding-bottom:1em;  border:1px solid #eee; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;}
.acomplete .ac-products { list-style: none;  padding-left:15px;}
.acomplete .searchList {border-right:1px solid #ccc;}
.acomplete .ac-product { line-height: 1em; margin-bottom: 1.5em;}
.acomplete .ac-img { width: 30px; margin: 0 auto; }
.acomplete .ac-img img { width: 100%; }
.acomplete .ac-pages { padding-left: 15px; list-style: none;  }
.acomplete .category { text-transform: uppercase; font-size: 10px; }
.acomplete .ac-page { line-height: 13px; margin-bottom: 1em; margin-right:1em;}


/* Search Results */
#SearchResults article { margin-bottom: 15px; }

/* Storefinder */
.googleMap { height: 280px; width: 100%; }

/* Lookbook */
#lookbookCarousel .carousel-inner .col-md-6 { padding: 0; }
#lookbookCarousel .lookbookItem { position: relative; }
#lookbookCarousel .hotspot { position: absolute; display: block; }
#lookbookCarousel .hotspot { z-index: 50; }
#lookbookCarousel .hotspot { background: url("/images/hotspot.png") no-repeat scroll 50% 50% transparent; }
#lookbookCarousel .lookBookItem img { position: absolute; display: block; }

#lookbookCarouselMobile .carousel-inner .col-md-6 { padding: 0; }
#lookbookCarouselMobile .lookbookItem { position: relative; }
#lookbookCarouselMobile .hotspot { position: absolute; display: block; }
#lookbookCarouselMobile .hotspot { z-index: 50; }
#lookbookCarouselMobile .hotspot { background: url("/images/hotspot.png") no-repeat scroll 50% 50% transparent; }

/* Make quantity field smaller */
#Quantity { width: 50px; text-align:center; }

/* Bootbox style overrides for notifications */
.bootbox .modal-dialog { margin: 0 auto; width: auto; }
.modal-notification { border: none; box-shadow: none; background: transparent; }
.modal-notification.fade.in { top: 30%; }
.modal-notification .modal-dialog { width: auto; }

/* Swatch colours */
.form-group .black{ background-color: #000;}
.form-group .mandarin{ background-color: #ff3300;}
/*.js-swatchDisabled{ background-color: #ccc;}*/

.cursor-pointer{ cursor: pointer;}

/* Tooltips */
.tooltip-inner  {padding: .8em 1.4em; text-align: left !important;max-width: 360px;font-weight: normal; }

/* Turn off the spinner for type=number input fields */
input[type='number'] { -moz-appearance: textfield; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; }

/* For correct OSX Chrome font rendering */
body, input, a, button {-webkit-font-smoothing: antialiased; } 

/* Responsive Video - wrap Youtube embed code iframe in this div */
.responsiveVideo { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.responsiveVideo iframe, .responsiveVideo object, .responsiveVideo embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Fix Bootstrap checkbox sitting outside of container */
.radio, .checkbox {padding-left:20px;} 
.checkbox label, .radio label  {padding-left:0;}
.checkbox input[type="checkbox"]{margin-top:2px;}

/* Change from pixel values to ems */
.form-control, .dropdown-menu {font-size:1em;}

/* Display:block helper class */
.block {display:block;}

/* Style non-radio buttons as per Bootstrap styling */
.radioButtonList td {padding-left:20px;}
.radioButtonList input[type="radio"] { margin-left: -20px; margin-top:1px; position: absolute; }
.radioButtonList label {font-weight:normal;}

/* label text left aligned when using "form-horizontal" rather than right aligned */
.form-horizontal .control-label {text-align:left;}

/* A smaller quantity field */
.form-control.quantity {width:52px; text-align:center;}

/* Panel title link clickable region */
.panel-title > a {display:block;}

/* Removed dotted outline from links */
a, a:focus, .btn:focus {outline:0;} 

/* Remove default top margin from headings so headings line up */
h1,h2,h3,h4,h5 {margin-top:0;}

/* Add space above logo */
.logo {margin-top:26px;}

/* Margin added to cart button */
/*.js-addToCart{margin-right:10px;}*/
/*.wishList .js-addToCart {margin-right:0;}*/

/* Move checkout to a new line */
/*.js-addedToCart {clear:left;}*/

/* Edit addresses button alignment */
#btnEditAddress, #btnDeleteAddress {float:left; margin-right:10px;}

/* Product List & Wish List image bottom spacing */
/*.js-productContent article img, #CategoryListing article img, .wishList article img { margin-bottom: 20px; }*/

/* Wish List buttons */
/*.wishList .buttons {margin-bottom:2em; margin-top:2em;}
.wishList .js-filterWishlist { margin-right: 3px;}*/

/* Wish List Email to a friend image spacing */
.wishListEmail img {margin-bottom:1em;}

/* Quick look button styling */
.imageContainer {position:relative;}
.quicklook { position:absolute; top:50%; left:0; width:100%;}
.quicklook a{ display:none;text-indent:0; min-width: 130px; height: 23px; line-height:23px; margin:0 auto; text-align:center; font-weight:normal;opacity:1; background: rgba(0, 0, 0, .5); color:#fff;}
.quicklook a:hover {color:#fff;}
article:hover .quicklook a { display: block; }



/* Filter bottom spacing */
.filters {margin-bottom:1em;}

/* Modal header remove bottom line */
.modal-header {border:none;}

/* Mobile menu navigation */
.navbar.navbar-fixed-top.slide-active { position: relative; } /* Fixes non-scroll  */
.navbar-fixed-top, .navbar-fixed-bottom {position:static;} /* Overwrites fixed positioning */

/* Footer expand/collapse toggle */
.plusMinus, .filter .open .plusMinus { float: right;width: 13px;height: 13px;background:url('/images/plus-minus.png') no-repeat 0 -25px;}
.collapsed .plusMinus, .filter .plusMinus { float: right;width: 13px;height: 13px;background:url('/images/plus-minus.png') no-repeat 0 0;}

/* Use a smaller default body text size */
body {font-size: 12px;}

/* Make button font-size the same as declared on body */
.btn {font-size:12px;}

/* Hide horizontal rule for Saved Items in My Details */
.tab-pane .inner > hr { display: none;}

/* Credit Card preview */
.js-cc-num { }
.js-cc-num.visa { background-position-y: -37px;}
.js-cc-num.masterCard, .js-cc-num.mastercard {background-position-y: -90px;}
.js-cc-num.amex, .js-cc-num.AMEX {background-position-y: -140px;}



@media (max-width: 767px) {

    /* Mobile Menu background colour */
    body.rateShopping{background:#fff;}
    body.iframeForm{background:#fff;}
    #page-content {background:#fff;}

    /* */
    #slidemenu > .navbar-nav {padding-top:2em;}
    #slidemenu > .navbar-nav > li > a {text-indent:0; float:left;  padding:0 5%; height:26px; line-height:26px; width:90%;box-shadow:none;background:none;}
    #slidemenu .customer {margin:1em 0;}
    #slidemenu .customer ul { list-style: none outside none; padding: 0 5%; }

    /* Center main product display image */
    .js-productImage img {margin:0 auto;}

    /* Image thumbs display in a horizontal line for mobile */
    .thumbnails li { float: left; width: 25%; }

    /* Add space beneath thumbnail list on mobile */
    .thumbnails.js-thumbnails { margin:0; overflow: hidden; }

    /* Related products clear left after every 2 products */
    .relatedProducts article:nth-child(2n+1) {clear:left;}

    /* Transaction History table styling for mobile */
    .transactionHistory {border:none;}
    .transactionHistory th {display:none;}
    .table.transactionHistory td {display:block; border:none; width:100%; padding:0 0 6px 0;}
    .table.transactionHistory td:first-child {padding-top:1em;}
    .table.transactionHistory td:last-child {padding-bottom:1em; border-bottom:1px solid #ececec;}

    /* Product List clear row every two products */
    .js-productContent article:nth-child(2n+1), #CategoryListing article:nth-child(2n+1) { clear: left; }
    .js-productContent article:last-child hr { border-color: #fff; }

    .modal-header > button.close { font-size: 50px; }

    /* Survey form iframe height */
    #js-mobile-survay iframe { height: 560px; }

    /* Make special prices fit within cart row */
    .ShoppingCart .was { display: block;padding-right: 0;}
    
}

@media (min-width: 768px) and (max-width: 991px) {

    /* Wish List clear left every 3 products*/
    .wishList .row > div:nth-child(3n+1) { clear: left; }

    /* Product List clear left every 2 products */
    .js-productContent article:nth-child(2n+1), #CategoryListing article:nth-child(2n+1) { clear: left; }


}

@media (min-width: 768px) {

    /* Product detail main image appears to the right of thumbs in ipad up */
    .mainImage { float: right; }

    /* Reviews clear left after every 3 cols */
    .reviews .review:nth-child(3n+1) {clear:left;}

    div.js-reviewStars { cursor: pointer;}

    /* Send to friend image clear every 3 cols */
    .wishListEmail .product:nth-child(3n+1) { clear: left; }

    /* Navigation */    
    #slide-nav {left: 0;z-index:11;width: 100%; position:absolute;} /* appear in front of logo */

    /* Mega Menu is positioned absolutely from the top of the screen */
    #slide-nav #slidemenu {top: 50px; left:0 !important; z-index:2; position:relative;} /* !important used because of mobile menu */

    /* Set header height */
    header {height:105px;}

    /* Place items in header above mega menu z-index of 11 */
    header .top {position:relative; z-index: 12;}

    /* Reduces visibile height of slide menu */
    #slide-nav.navbar {height:0;min-height:0;}

    /* Enables items in header to appear over the top of the slide menu */
    .container {position:relative;}

    /* Remove styling from mega menu */
    #slidemenu .caret {display:none;}
    #slidemenu a.dropdown-menu {box-shadow:none;min-width:0;}

    .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev { margin-left: 15px; }
    .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next { margin-right: 40px;}

}


/* ---- Rate Shopping Experience ---- */
@media all {
    
    /* Rate shopping experience */
    #RateExperience .head, #RateExperience .shopping, #RateExperience .checkout { margin: 0;}

}
@media all and (max-width:599px) {
    
    /* Rate Shopping Experience */
    #RateExperience table { width: 100%;}
    #RateExperience table td { display: block;width: 100%;}

}
@media all and (min-width:600px) {
    
    /* Rate Shopping Experience */
    #RateExperience .rate, #RateExperience table  { float: left; line-height: 24px; }
    #RateExperience .least { margin-right: 10px; }

}

/* Max 6 custom link icon for content editor toolbar */
.reToolbar.Default .InsertMaxLink{ background-image: url(/App_Themes/MAX2/icons16/0082-doc_add.gif); }


