.body-container { max-width: 1180px; }
.body-inner-container { position: relative; padding: 0 20px; color: #343434; }

/* PAGE NAV */
.page-nav { width:100%; clear: both; float: left; }
.breadcrumb { padding: 18px 0 0 0; float: left; width: 70%; }
.breadcrumb a { float: left; }
.breadcrumb img { float: left; padding: 0 8px; }
.breadcrumb svg { float: left; height: 14px; width: 24px;
    -ms-transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    transform:rotate(180deg);
}
.windows.firefox .breadcrumb svg { margin-top: 3px; }
.breadcrumb svg polygon { fill: #cbcbcb; }
#prev_next { float: right; padding: 10px 0 0 0; }

/* COLUMNS */
.column { float: left; padding: 20px 0 0 0; }
.column#three { width: 23.33333%; padding: 20px 0 0 2%; }
.column#one { width: 44.33333%; min-width: 440px; }
.column#two { width: 27%; min-width: 250px; padding: 10px 0 20px 15px; }

/* COLUMN 1 - MAIN IMAGE */
.main-image { float: right; width: 75%; position: relative; border: 1px solid #d6d6d6; width: auto; text-align: center; border-radius: 5px; }
.main-image img { border-radius: 5px; width: 420px; }
.thumbnails { position: relative; max-width: 80px; width: 25%; float: left; }
.thumbnails a { border-radius: 5px; border: 1px solid #d6d6d6; margin: 0 0 9px 0; }
.thumbnails a img { border-radius: 5px; display: block; }
.main-image-message { display: none; z-index: 2; position: absolute; opacity: 0.8; background: white; padding: 0.5em 0; text-align: center; top: 150px; width: 100%; }
.main-image-message.active { display:block; }
.main-image-message strong { opacity: 1; }
.MagicZoomPlusHint { display: none !important; }
.MagicThumb-buttons a {
    background-image: url("../../images/png/small-close-button.png"); background-image: url("../../images/svg/small-close-button.svg"), none !important; background-repeat: no-repeat; background-position: left top; background-size: 26px 26px; width: 26px; height: 26px; }
.MagicThumb-buttons a:hover { background-image: url("../../images/png/small-close-button-hover.png"); background-image: url("../../images/svg/small-close-button-hover.svg"), none !important; }
.MagicThumb-swap{ position: relative; overflow: hidden; }
.MagicThumb-swap.Selector.current-image:after { content:""; top: 70%; left: 15px; display: block; width: 40px; height: 53px; position: absolute; background-image: url("../../images/png/selected-image.png"); background-image: url("../../images/svg/selected-image.svg"), none; background-repeat: no-repeat; background-position: 0 0; background-size: 40px 53px; }
.left-container.half { padding-right: 0; width: 100%; }
.MagicZoomBigImageCont { left: 434px !important; }
.magicZoomPlus { width: 100% !important; }

/* COLUMN 2 */
.body-inner-container h1 { clear: both; margin-right: 0; padding-right: 0; letter-spacing: -2px; font: 2.5em "AvenirNextLTW01-Regular", "Helvetica Neue", Helvetica, Arial, sans-serif; }
.body-inner-container h2 { margin-right: 0; padding-right: 0;  color: #343434; border-bottom: 0 none; padding-bottom: 0; font-size: 1em; }
.column#two .timer { display: none; }
.body-inner-container form label.size { margin: 0 0 10px 0; padding-right: 0; }
.price { font-size: 0.7em; }
.price span { font-size: 2em; margin-right: 10px; }
.price span.rrp-price { font-size: 1.4em; color: #a1a0a1; text-decoration: line-through; }
.price span.discount-percent { font-size: 1.4em; }
.product-ref { font-size: 0.8em; margin-bottom: 20px; clear: both; }
.option-container {float: left; width: 50%; }
fieldset.size { width: 100%; float: left; }
.body-inner-container .quantity { clear: both; }
fieldset.quantity.disabled { opacity: 0.3; }
.body-inner-container form  .quantity label { margin: 0 0 9px; }
.body-inner-container .quantity-selector { z-index: 1; clear: both; visibility: visible; display: block; width: 100%; padding: 0 0 25px 0; }
.quantity-selector input::selection, fieldset.quantity::selection, .quantity-selector .secondary-button::selection {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#notify-user-back-in-stock { float: left; margin: 10px 0; }
.column#two #notify-user-back-in-stock .primary-button { margin-top: 10px; }
.loyalty-copy, .time-warning { clear: both; float: left; width: 100%; }
.loyalty-copy { padding: 25px 0 0; margin: 0; }
.delivery-estimate { padding: 10px 0 0 0; }
.loyalty-copy span, .dispatch-date { font-family: "Proxima Nova Bold","Helvetica Neue",Arial,Helvetica,sans-serif; }
.product-detail-countdown, .loyalty-copy span, .delivery-estimate span, .main-image-message span, .dispatch-date { color: #1aa98d; }

/* COLUMN 3 */
.timer { font-size: 0.8em; text-align: left; padding: 20px 0 0 0; float: right; width: 160px; }
.shares { margin: 0 0 20px 0; }

/* DETAILS - SIDEBAR PRODUCT ATTRIBUTE CLASSES */
#details > p > span.attr_type_short, #details > p > span.attr_type_long, #details > p > span.attr_type_long_standalone, #details > p > span.attr_type_special { clear: left; float: left; margin-bottom: 20px; }
#details > p > span.attr_type_short br, #details > p > span.attr_type_long br, #details > p > span.attr_type_long_standalone br, #details > p > span.attr_type_special br { display: none; }
#details > p > span.attr_type_short { margin-bottom: 0; }
#details > p > span.attr_type_short.last { margin-bottom: 20px; }

/* YOU MAY LIKE */
.you-may-like { width: 100%; float: left; }
.you-may-like h3 { border-bottom: 0 none; text-align: center; float: left; padding: 30px 0 20px; width: 100%; font-size: 1.5em; }
.product-wrap { width: 20%; float: left; }
.product-wrap, .product-wrap:nth-of-type(3n+1) { padding: 0 6px 15px 6px; }
.product-inner-wrap { border-radius: 5px; position: relative; width: 100%; background: #ffffff; float: left; border: 1px solid #d6d6d6; padding: 15px; }
.product-inner-wrap > a { overflow: hidden; height: 100%; color: #343434; width: 100%; float: left; }
.product-wrap img { border-radius: 5px; width: 100%; max-width: 320px; float: none; display: block; margin: 0 auto; height: auto; }
.product-wrap * { float: left; }
.product-wrap h2 { text-align: left; font-family: 'Proxima Nova Bold ', 'Helvetica Neue', Arial, Helvetica, sans-serif; margin: 10px 0 6px !important; float: left; width: 100%; font-size: 1em; text-transform: uppercase; color: #343434;  border: 0 none; padding: 0; }
.product-wrap p { float: left; width: 100%; font-size: 0.85em; }
.product-wrap p.description { height: 17px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-bottom: 5px; }
.new-price { color: #1aa98d; font-size: 1.5em; }
.percent-off { display: none; }


/* POPUPS */
.popup_window_email, #window_sizeguide { display: none; z-index: 11; background: #ffffff; border-radius: 5px; float: left;  box-shadow: 0 1px 5px rgba(0,0,0,.5); position: fixed; padding: 15px; left: 0; right: 0; margin: 0 auto; max-width: 965px; top: 25%; }
#window_sizeguide { max-width: 1150px; max-height: 500px; overflow-y: scroll; z-index: 1000; top: 25%; }
.popup_window_email a { float: right; }
.popup_window_email h2 { float: left; width: 100%; margin: 2px 0 15px; color: #343434; }
.popup_window_email input.left, .popup_window_email div.title.left { clear: left; text-transform: none; text-decoration: none; font-family: "Proxima Nova Regular","Helvetica Neue",Arial,Helvetica,sans-serif; float: left; width: 35%; }
.popup_window_email input.right, .popup_window_email div.title.right { text-transform: none; text-decoration: none; font-family: "Proxima Nova Regular","Helvetica Neue",Arial,Helvetica,sans-serif; float: right; width: 61%; }
.popup_window_email a.primary-button { width: auto; }
.popup_window_email label { display: none; }

/* MAGIC ZOOM */
.main-image {height: 502px; }
.main-image img { max-width: 420px; max-height: 502px; display: block; }
.MagicZoomBigImageCont div img { max-width: 900px; max-height: 1080px; }

@media screen and (max-width: 1200px) {
    .MagicZoomBigImageCont { width: 100% !important; }
}
@media screen and (max-width: 1180px) {
    .thumbnails { width: auto; max-width: 100%; margin: 10px 0 0 0; float: left; }
    .thumbnails a { float: left; margin: 0 10px 0 0; }
    .main-image { float: left; }
    .column#one { width: 37.33333%; }
}
@media screen and (max-width: 1035px) {
    .column#three { float: none; clear: both; width: 100%; padding-left: 0; }
    .column#three p { max-width: none; }
}
@media screen and (max-width: 750px) {
    .column#one { width: 100%; padding: 20px 0 0; }
    .column#two { width: 100%; }
    .thumbnails, .main-image { width: 100%; max-width: 100%; }
    .thumbnails { margin: 0; }
    .thumbnails a { margin: 10px 10px 0 0; }
}
@media screen and (max-width: 744px) {
    .column#two { padding: 0; }
    .timer { display: none; }
    .column#two .timer { display: block; float: left; }
    .you-may-like { display: none; }
    .column#one { min-width: 0; }
    .share-buttons-container { padding-bottom: 70px;}
}
@media screen and (max-width: 650px) {
    .quantity-selector {
        max-width: 100%;
    }
    .quantity-selector input {
        max-width: 33.33%;
    }
}
    @media screen and (max-width: 600px) {
    .quantity-selector .secondary-button { width: 29.8% !important; }
    .main-image img { width: auto; }
    .option-container { width: 100%; }
}
@media screen and (max-width: 568px) {
    header a#logo { display: none; }
    .column#two h1 { font-size: 2.4em; }
    .price span { float: left; margin-right: 10px; }
    .price span.rrp-price { padding-top: 6px; }
    .price span.discount-percent { clear: both; margin-bottom: 8px; }
    .main-image img { width: 100%; }
    .MagicZoomBigImageCont  { left: 0 !important;}

    .main-image { height:auto!important; }
    .breadcrumb { width: 100%; }
    .breadcrumb a {float:none; display:block; padding:0 0 5px 0;}
    .breadcrumb a[href="/"] {display:none;}
    .breadcrumb svg {width: 15px;}
    #prev_next {width:100%;}
    .secondary-button.previous {margin-right: 33px !important;}
}
/* IPAD ONLY */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)  {
    .MagicZoomBigImageCont  { left: 0 !important; width: 420px !important;}
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
    .MagicThumb-expanded { width: 700px !important ; }
    div.MagicThumb-expanded { left:25px!important;  }
}
