.page-content {  }

.layout-container { margin: 0; padding: 0; }

main { position: relative; width: 100%; height: 100%; }
main section#wrapper { position: relative; height: 100%; min-height: 100%;
    background: transparent; }

.dialog-off-canvas-main-canvas, .layout-container { height: 100%; }

section.first-content {  }
body.product section.first-content {  }
body.user section.first-content { padding: 150px 15px; }

section .right-column,
section.product_right { position: relative; float: right; width: 50%; text-align: left; }
section .left-column,
section.product_left { position: relative; float: left; width: 50%; text-align: left; }

section .right-column h1,
section.product_right h1 { text-align: left; }

section.second-content { border-bottom: 1px solid #efefef; clear: both;
    background-color: transparent; background-image: url('../../images/tiles-grey.jpg'); background-repeat: repeat; background-position: top center; background-size: 300px; } 
section.second-content .wrapper { padding-top: 120px;
    background-color: transparent; background-image: url('../../images/tile-blanks.png'); background-repeat: repeat-x; background-position: top center; background-size: 1800px; }

section#fixed-right { position: fixed; bottom: 0; right: 0; z-index: 14; }

body.product section.second-content { background-image: none; border-bottom: none; }

/** Headers - Fixed and Sliding **/

#main-header { position: absolute; top: 0; left: 0; width: 100%; }
#header-holder { position: relative; }

#menu-trigger-head { display: none; position: absolute; top: 0; left: 0; height: 60px; width: 0; padding: 0 0 0 60px; overflow: hidden; cursor: pointer; pointer-events: all;
    background-color: transparent; background-image: url('../../images/menu-white.png'); background-size: 20px; background-repeat: no-repeat; background-position: center center; }

#mini-inbali { display: none; height: 60px; width: 60px; margin: 0 auto; }
#mini-inbali a#inbali-button { display: block; height: 100%; width: 100%; cursor: pointer; pointer-events: all;
    background-image: url('../../images/hut.svg'); background-size: 22px; background-repeat: no-repeat; background-position: center center; }
body.search #mini-inbali { display: block; }

.region-header-extra { position: absolute; height: 30px; top: 15px; right: 60px; }

.region-header-extra nav ul { text-align: right; height: 30px; }
.region-header-extra nav ul li { display: inline-block; }
.region-header-extra nav ul li.custom { padding-left: 5px; border-left: 1px solid rgba(255, 255, 255, 0.5); }
.region-header-extra nav ul li.inspired {  }
.region-header-extra nav ul li a { display: block; color: #ffffff; letter-spacing: 3px; text-decoration: none; font-family: 'OSBold', sans-serif; text-transform: uppercase; font-size: 10px; line-height: 30px; padding: 0; margin: 0 20px; height: 30px; }
.region-header-extra nav ul li a:hover { border-bottom: 1px solid rgba(255, 255, 255, 0.5); }

.region-header-top  { position: relative; }

nav#block-inbali-useraccountmenu { position: absolute; top: 0; right: 0; }
nav#block-inbali-useraccountmenu h2 { display: none; }
nav#block-inbali-useraccountmenu ul { margin: 0; overflow: visible; }
nav#block-inbali-useraccountmenu ul li {  }
nav#block-inbali-useraccountmenu ul li a { display: block; position: absolute; top: 0; right: 0; height: 60px; width: 0; padding: 0 0 0 60px; overflow: hidden; cursor: pointer;
    background-color: transparent; background-image: url('../../images/user-white.png'); background-size: 24px; background-repeat: no-repeat; background-position: center center; }

/** Sidebar slideout menus and layout **/

#sidebar { display: block; position: fixed; left: -330px; top: 0; height: 100%; width: 320px; overflow-x: hidden; z-index: 16;
    background-color: #ffffff; background-image: url('../../images/menu-mandala.png'); background-repeat: no-repeat; background-position: bottom left; background-size: 100%;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.12),0px 6px 8px 0px rgba(0,0,0,0.1); }

#logo-holder { display: block; position: relative; height: auto; width: 30px; margin: 0 auto; opacity: 0.8; padding: 20px 0; }

#menu-close { display: block; position: absolute; top: 0; right: 0; height: 60px; padding: 0 0 0 60px; width: 0; cursor: pointer; overflow: hidden;
    background-color: transparent; background-image: url('../../images/cross-dark.png'); background-size: 20px; background-repeat: no-repeat; background-position: center center;
    transition: transform 0.5s ease; }
#menu-close:hover { transform: rotate(180deg); }

#block-inbali-mainnavigation-3 {  }

#block-inbali-mainnavigation-3 li { background-color: transparent; }
#block-inbali-mainnavigation-3 li a { display: block; padding: 28px 20px 28px 100px; color: #283d38; font-family: 'OSBold', sans-serif; text-transform: uppercase; letter-spacing: 2px; font-size: 10px; border-bottom: 1px solid #efefef;
    background-color: rgba(255, 255, 255, 0.6); background-repeat: no-repeat;  }
#block-inbali-mainnavigation-3 li.Tables a { background-image: url('../../icons/icon-tableout.png'); background-size: 62px; background-position: left 16px center; }
#block-inbali-mainnavigation-3 li.Seating a { background-image: url('../../icons/icon-chair.png'); background-size: 68px; background-position: left 14px center; }
#block-inbali-mainnavigation-3 li.Storage a { background-image: url('../../icons/icon-cabinet.png'); background-size: 64px; background-position: left 14px center; }
#block-inbali-mainnavigation-3 li.Bedroom a { background-image: url('../../icons/icon-beds.png'); background-size: 64px; background-position: left 16px center; }
#block-inbali-mainnavigation-3 li.Homeware a { background-image: url('../../icons/icon-lampshades.png'); background-size: 64px; background-position: left 14px center; }
#block-inbali-mainnavigation-3 li.Outdoor a { background-image: url('../../icons/icon-sunbed.png'); background-size: 62px; background-position: left 18px center; }

/** Product Category Pages **/

#block-category-desc .views-row { width: 100%; max-width: 640px; margin: 0 auto; text-align: center; padding: 0 15px; }
#block-category-desc .views-row .field-content { display: block; font-family: 'Valentine', 'Egyptian-Light', sans-serif; padding: 60px 0; font-size: 25px; line-height: 36px; letter-spacing: 0; text-align: center;
    background-image: url('../../images/floral.svg'); background-size: 45px; background-repeat: no-repeat; background-position: top center; }

/** Product Page Specific Layout **/

body.product #block-inbali-page-title { display: none; }
body.product .content-position {
    background-image: url('../../images/mandala-bg1.png'); background-repeat: no-repeat; background-position: right top; background-size: auto; }

section.product_head { position: absolute; }

section.product_right { margin-top: 120px; z-index: 2; }
section.product_right .wrapper { margin: 25px; padding: 40px; max-width: 540px; border: 1px dotted #efefef;
    background-color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1); }

.product_right .flag-love-product { position: absolute; top: 63px; left: -3px; }
.product_right .flag-love-product a { display: block; width: 54px; height: 0; padding-top: 50px; border-radius: 28px; border: 2px solid #efefef; overflow: hidden;
    background-color: #ffffff; background-image: url('../../images/fave.png'); background-position: top center; background-repeat: no-repeat; background-size: 100%; }
.product_right .flag-love-product a:hover { background-position: bottom center; }
.product_right .flag-love-product.action-unflag a { background-position: bottom center; }
.product_right .flag-love-product.action-unflag a:hover { background-position: top center; } 

.product_right .product-title { display: block; margin-bottom: 5px; font-family: 'SSThin', sans-serif; font-size: 32px; letter-spacing: 3px; text-transform: uppercase; }
.product_right .product-subtitle { display: block; margin-bottom: 5px; font-family: 'SSLight', sans-serif; font-size: 10px; text-transform: uppercase; }
.product_right .product-price { display: block; font-family: 'OSBold', sans-serif; letter-spacing: 3px; font-size: 14px; margin-bottom: 20px; }
.product_right .product-body { display: block; font-size: 14px; line-height: 25px; margin-bottom: 20px; }

.product_right .product-dimensions {  }
.product_right .product-assembly {  }

.product_right .product-materials {  }
.product_right .product-materials div { display: inline-block; }
.product_right .product-materials div a { display: inline-block; margin: 0 5px 5px 0; font-family: 'OSBold', sans-serif; text-transform: uppercase; font-size: 10px; color: #ffffff; letter-spacing: 2px; padding: 7px 10px; border-radius: 15px;
    background-color: rgba(82, 192, 167, 0.7); }
.product_right .product-materials div a:hover { background-color: rgba(82, 192, 167, 1); }

section.product_left { margin-top: 210px; }

.commerce-order-item-add-to-cart-form { margin: 0 auto 30px auto; border-bottom: 1px solid #efefef; padding: 0 0 30px 0px; }
.commerce-order-item-add-to-cart-form .field--name-quantity { position: relative; }
.commerce-order-item-add-to-cart-form .field--name-quantity input { text-align: center; font-size: 28px; }
.commerce-order-item-add-to-cart-form .form-actions { margin-top: 30px; }
.commerce-order-item-add-to-cart-form .form-actions span.button,
.commerce-order-item-add-to-cart-form .form-actions span.button input { width: 100%; line-height: 31px; }

/** User Pages **/

body.user.fullbg .first-content .wrapper { max-width: 500px; padding: 25px; margin: 0 auto;
    background: #ffffff;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    box-shadow: 0px 0px 2px 0px rgb(0 0 0 / 12%), 2px 2px 8px 0px rgb(0 0 0 / 40%); }
body.user.fullbg .first-content .wrapper h1 { font-size: 36px; color: #283d38; padding: 10px 0 15px; margin-bottom: 20px; }

#block-inbali-local-tasks ul { margin-bottom: 15px; }
#block-inbali-local-tasks ul li { display: block; float: left; width: 50%; }
#block-inbali-local-tasks ul li.reset { clear: both; float: none; text-align: center; width: 100%; padding: 15px 0 0; }

#block-inbali-local-tasks ul li a { display: block; text-align: center; padding: 15px 5px; margin: 0 5px 15px 5px; letter-spacing: 2px; font-family: 'OSBold', sans-serif; text-transform: uppercase; font-size: 10px; border: 2px solid #4eac97; color: #ffffff;
    background-color: #52c0a7; }
#block-inbali-local-tasks ul li a:hover { background-color: #4eac97; }
#block-inbali-local-tasks ul li a.is-active { position: relative; color: #52c0a7; border: 2px solid #52c0a7; pointer-events: none;
    background-color: #ffffff; }
#block-inbali-local-tasks ul li a.is-active span.visually-hidden { bottom: -12px; left: 0; right: 0; margin: 0 auto; width: 18px; height: 0; padding-top: 10px; overflow: hidden; clip: unset;
    background-image: url('../../images/pointer.svg'); background-size: 18px; background-repeat: no-repeat; background-position: top center; }

#block-inbali-local-tasks ul li.reset a { display: inline-block; border: none; color: #52c0a7; padding: 0; border-bottom: 1px dotted transparent;
    background: transparent; }
#block-inbali-local-tasks ul li.reset a:hover { border-bottom: 1px solid #52c0a7; }

@media only screen and (max-width: 670px) {
    #menu-trigger-head { display: block; }
    
    .region-header-extra { right: 0; width: 100%; }
    .region-header-extra nav ul { text-align: center; }
}

@media screen and (min-width: 38em) {
  .page-content {  }
}
