/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
body{margin:0}
.buttons li,label,th{
    font-weight:400
}
.buttons .icon,.buttons li,.content{
    position:relative
}
.input,.swatch,button,html,input,select,textarea{
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif
}
.dropdown .title,.swatch,.three-line.tags,th{
    text-transform:uppercase
}
.buttons li,.tooltip,.tooltipContent{
    text-align:center
}
.faq,.item-info,label{
    clear:both
}
.checkmark:after,.radiobutton:after,.tooltipContent:after{
    content:""
}
.button.loading,.button.off,.tooltip{
    pointer-events:none
}
.buttons,.item-info,.nav ul,.sharePanel ul{
    list-style:none
}
fieldset,hr{
    border:0;
    padding:0
}
.icon,.iconMaxi,.iconMini{
    fill:currentcolor
}
.button-function:focus,.options a,a{
    outline:0
}


/* raleway-regular - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/raleway-v13-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Raleway'), local('Raleway-Regular'),
       url('../fonts/raleway-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/raleway-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/raleway-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/raleway-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/raleway-v13-latin-regular.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* raleway-500 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/raleway-v13-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Raleway Medium'), local('Raleway-Medium'),
       url('../fonts/raleway-v13-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/raleway-v13-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/raleway-v13-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/raleway-v13-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/raleway-v13-latin-500.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* domain-display-regular - latin */
@font-face {
  font-family: 'DomaineDisplay';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/DomaineDisplay-Regular.eot'); /* IE9 Compat Modes */
  src: local('DomaineDisplay-Regular'), local('DomaineDisplay'),
       url('../fonts/DomaineDisplay-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/DomaineDisplay-Regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/DomaineDisplay-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/DomaineDisplay-Regular.svg') format('svg'); /* Legacy iOS */
}

/* domain-display-semibold - latin */
@font-face {
  font-family: 'DomaineDisplay';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/DomaineDisplay-Semibold.eot'); /* IE9 Compat Modes */
  src: local('DomaineDisplay-Semibold'), local('DomaineDisplay Semibold'),
       url('../fonts/DomaineDisplay-Semibold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/DomaineDisplay-Semibold.woff') format('woff'), /* Modern Browsers */
       url('../fonts/DomaineDisplay-Semibold.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/DomaineDisplay-Semibold.svg') format('svg'); /* Legacy iOS */
}

.input,button,html,input,select,textarea{
    font-size:13px;
    letter-spacing:.6px;
    line-height:24px;
    color:#2e2e2e
}
input:-ms-input-placeholder{
    color:#999
}
::-moz-selection{
    background:#b3d4fc;
    text-shadow:none
}
::selection{
    background:#b3d4fc;
    text-shadow:none
}
hr{
    display:block;
    height:1px;
    border-top:1px solid #e5e5e5;
    margin:30px 0 50px
}
.menu li,.nav li{
    display:inline-block
}
label,table .note{
    display:block
}
audio,canvas,img,video{
    vertical-align:middle
}
fieldset{
    margin:0
}
textarea{
    resize:vertical
}
.browsehappy{
    margin:.2em 0;
    background:#ccc;
    color:#000;
    padding:.2em 0
}
.content{
    max-width:1360px;
    margin:auto
}
.top{
    margin-top:66px
}
.right{
    float:right
} 
.r {position:absolute!important;right:0}
.l {position:absolute!important;left:0}
.left{
    float:left
}
.full-width{
    width:100%
}
a{
    color:inherit
}
a:hover{
    text-decoration:underline
}
.input,input,select{
    border:1px solid #e5e5e5;
    font-weight:400;
    padding:12px 20px;
    margin:3px 0 24px;
    width:320px
}
.input{
    padding:14px 20px 13px
}
.input.focus,input:focus,select:focus{
    background:#FFFDFA;
    border-color:#c9c9c9
}
.buttons,td{
    border-top:1px solid #e5e5e5
}
.buttons li a,table{
    border-bottom:1px solid #e5e5e5
}
th{
    font-size:13px;
    letter-spacing:3px;
    margin:0;
    padding:21px 10px 18px;
    line-height:20px
}
td{
    padding:22px 10px 19px
}
.group input{
    margin-bottom:0
}
.group input:last-child{
    margin-bottom:24px
}
.group.small input{
    width:137px
}
.note{
    color:#777
}
.note a{
    text-decoration:none
}
.note a:hover{
    text-decoration:underline
}
.note .sel{
    color:#2e2e2e;
    pointer-events:none
}
.button,.button.primary:hover,.buttons li a,.dropdown,.dropdown:hover,.tooltipContent{
    text-decoration:none
}
.buttons{
    display:inline-block;
    flex-wrap:wrap;
    border-left:1px solid #e5e5e5;
    margin:3px 0 24px;
    padding:0;
    width:100%
}
.buttons li{
    float:left
}
.buttons li a{
    background:#fff;
    padding:11px 0 10px;
    border-right:1px solid #e5e5e5;
    display:block
}
.buttons li a:hover{
    box-shadow:0 -5px 0 -2px #2e2e2e inset
}
.buttons.buttons-colour li a{
    padding:9px 0 8px;
    font-weight:500
}
.buttons .colour-box{
    padding:1px 5px;
    display:inline-block;
    border:1px solid #e5e5e5;
    min-width:16px
}
.buttons.buttons-colour2 li a{
    padding:11px 0 10px 1px;
    font-weight:500;
    background:unset;
    color:unset;
    font-size:14px
}
.buttons.buttons-colour2 .selected,.buttons.buttons-colour2 li a:hover{
    border:3px solid #c2a476;
    padding:8px 0
}
.buttons.buttons-colour2 .selected{
    background:unset!important
}
.buttons .price{
    font-size:11px;
    display:block;
    line-height:15px
}
.buttons .icon{
    margin:0 auto 1px;
    display:table;
    width:unset;
    height:unset
}
.buttons .icon-art{
    border:1px solid #666;
    background:#fff
}
.buttons .icon-frame{
    border:2px solid #666;
    padding:2px;
    background:#fff;
    margin:-2px 0 -3px
}
.buttons .icon-canvas{
    border-right:1px solid #666;
    border-bottom:1px solid #666;
    left:2px;
    position:absolute;
    top:2px
}
.buttons .frame-note{
    display:block;
    font-size:11px;
    letter-spacing:0;
    margin:-2px 0 0
}   
.buttons .unit {
    font-size:10px;
    letter-spacing:0
}
.dropdown{
    border-bottom:1px solid #e5e5e5;
    font-weight:400;
    padding:11px 0;
    margin:0;
    display:block
}
.dropdown .title{
    font-size:12px;
    font-weight:400;
    letter-spacing:3px;
    margin-right:2px
}
.swatch,.swatchlong,.swatchmed{
    letter-spacing:2px
}
.options .off:first-of-type{
    border-top:1px solid #e5e5e5
}
.dropdown:hover{
    background:#fbfbfb;
    padding-left:2px
}
.dropdown:hover .bullet{
    color:#2e2e2e
}
.dropdown .icon{
    height:1.7em
}
.dropoff{
    width:55px
}
.dropbox{
    margin-top:-7px;
    overflow:hidden;
    visibility:hidden;
    max-height:0
}
.swatch,.swatch2,.swatch2-2,.swatch2-3,.swatch2-4,.swatch2-5{
    margin:0 10px
}
.dropbox-on{
    visibility:visible;
    max-height:90px
}
.swatch{
    font-weight:500;
    font-size:17px;
    padding:6px 5px 5px;
    height:29px;
    line-height:29px
}
.swatchlong,.swatchmed,h4{
    font-size:13px
}
.swatch2{
    height:25px;
    background-size:cover
}
.swatch2-2{
    height:12.5px
}
.swatch2-3{
    height:8.3px
}
.swatch2-3:first-of-type{
    height:8.4px
}
.swatch2-4{
    height:6.25px
}
.swatch2-5{
    height:5px
}
.textspace,textArea{
    margin:3px 0 24px
}
.swatchlong{
    line-height:15px
}
.textspace .line-numbers,textArea{
    letter-spacing:.5px;
    line-height:19px;
    font-weight:400
}
textArea{
    width:330px;
    border:1px solid #e5e5e5;
    padding:8px 14px;
    overflow:hidden;
    resize:none
}
textArea:focus{
    background:#FFFDFA;
    border-color:#c9c9c9
}
.textspace textarea{
    margin:0;
    width:calc(100% - 71px)
}
.textspace .line-numbers{
    border:1px solid #e5e5e5;
    border-right:none;
    padding:7px 0;
    float:left;
    width:40px;
    background:#FFFDFA;
    height:230px
}
.three-line.tags,.tooltipContent{
    font-size:11px;
    letter-spacing:2px
}
.textspace .line-numbers span{
    display:block;
    text-align:center
}
.textspace .line-numbers span.error{
    background:#d55;
    color:#fff
}
.ts-errornote{
    color:#d55;
    display:block
}
.selected{
    background:#2e2e2e!important;
    color:#fff
}
.button{
    color:#fff;
    background:#A2988A
}
.button:hover{
    background:#92887A
}
.button.narrow{
    padding:14px 10px 12px 14px
}
.button-cta{
    color:#fff;
    background:#C2A476;
    border:none
}
.button-cta:hover{
    background:#B29466
}
.two-line li{
    width:50%
}
.three-line li{
    width:33.333%
}
.four-line li{
    width:25%
}
.icon-line .icon{
    margin-top:2px
}
.icon-line li a{
    padding-bottom:6px
}
/*.four-line li a{
    max-height:79px
}*/
.six-line li{
    width:16.666%
}
.eight-line li{
    width:45px;
    display:table
}
.buttons.op-text a{
    padding:6px 0 4px
}
.buttons.op-text svg{
    height:34px;
    width:100%
}
.textops input {
    width:215px
}
.textops .buttons {
    width:100px;
    display: inline-flex;
} .textops .buttons li a{
    padding: 13px 0 12px;
} 
.group .textops:not(:last-child) ul  {margin-bottom:0} 
.colour-1,.colour-3{
    width:45px
}
.colour-5{
    width:60px
}
a:hover .tooltip{
    visibility:visible;
    opacity:.98;
    -webkit-transition:opacity .3s ease;
    -moz-transition:opacity .3s ease;
    -o-transition:opacity .3s ease;
    transition:opacity .3s ease;
    -moz-transition-delay:.4s;
    -webkit-transition-delay:.4s;
    -o-transition-delay:.4s;
    transition-delay:.4s
}
.tooltip{
    opacity:0;
    position:absolute;
    visibility:hidden;
    left:50%;
    margin-left:-100px;
    width:200px;
    bottom:120%;
    bottom:-webkit-calc(100% + 7px);
    bottom:-moz-calc(100% + 7px);
    bottom:calc(100% + 7px);
    z-index:100
}
h3,h4:first-of-type{
    margin:0
}
.tooltipContent{
    background:#2e2e2e;
    color:#fff;
    padding:8px 12px 7px;
    display:inline-block;
    height:20px;
    height:auto;
    font-weight:400;
    text-transform:uppercase;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    -webkit-box-shadow:1px 1px 1px rgba(0,0,0,.25);
    -moz-box-shadow:1px 1px 1px rgba(0,0,0,.25);
    box-shadow:1px 1px 1px rgba(0,0,0,.25)
}
h1,h2,h3{
    letter-spacing:1.25px; 
    font-family:DomaineDisplay
}
h1  {
    line-height:30px
}   
.button.primary,.nav .topnav li .button.primary,.nav-example{
    box-shadow:0 1px 3px 0 rgba(41,41,41,.4)
}
.tooltipContent:after{
    bottom:-6px;
    display:block;
    position:absolute;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-top:6px solid #2e2e2e;
    left:47%;
    left:-moz-calc(50% - 6px);
    left:-webkit-calc(50% - 6px);
    left:calc(50% - 6px)
}
.button.primary,.button.secondary{
    display:inline-block;
    text-align:center
}
h1{
    font-size:32px;
    margin:3px 0 8px
}
h2,h3{
    font-size:28px
}
h4{
    font-weight:500;
    letter-spacing:3px;
    text-transform:uppercase;
    margin:30px 0 0
}
.button,h5{
    font-size:13px;
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:3px
}
h5{
    margin:10px 0 12px
}
p{
    line-height:24px;
    margin:10px 0
}
.title h2 {
    font-size: 25px;
    margin: 12px;    
}
.title h5 {
    margin:0 0 -6px;
    font-size:11px;
    letter-spacing:4px 
}
.maxlines a{                  
    display:none;
    font-size:15px;
    text-decoration:none;
    font-weight:500
}
.maxlines a:hover{
    color:#999
}
.maxlines.maxon .maxlines-more{
    display:unset
}
.maxlines.maxon.show-less .maxlines-more{
    display:none
}
.maxlines.maxon.show-less .maxlines-less{
    display:unset
}
.maxlines.maxon .trunc{
    display:none
}

.maxlines.maxon .header::after{
    content:"... ";
    margin-left:-4px
}
.maxlines.maxon.show-less .header::after{
    content:"";
    margin:0
}

.button{
    border:0;
    padding:12px 28px 10px
}
.button.primary{
    background:#2e2e2e;
    color:#fff;
    margin-top:4px;
    border-radius:3px
}
.button.loading{
    background:none!important;
    position:relative;
    overflow:hidden;
    vertical-align: middle;
}
.button.loading:after{
    content:"";
    position: absolute;
    left: -46px;
    top: 0;
    width: calc(100% + 46px);
    left: -46px;
    bottom: 0;
    z-index: -1;
    background: repeating-linear-gradient(
    -55deg,
    #5a5a5a 1px,
    #505050 2px,
    #505050 11px,
    #5a5a5a 12px,
    #5a5a5a 20px
	);
    animation-name: MOVE-BG;
	animation-duration: 1.2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
@keyframes MOVE-BG {
	from {
		transform: translateX(0);
	}
	to { 
		transform: translateX(46px);
	}
}  
.button.off.loading:after{
    content:"";
    position: absolute;
    left: -46px;
    top: 0;
    width:0;
    left: -46px;
    bottom: 0;
    z-index: -1;
    background: #5a5a5a;
    animation:none;
    transition: 0.15s ease-in;
    -webkit-transition: .15s ease-in;
    -moz-transition: .15s ease-in;
    -o-transition: 0.15s ease-in;
}
.button.off.loading{
    background: #5a5a5a!important;
    animation:none;
    transition: 0.15s ease-in;
    -webkit-transition: .15s ease-in;
    -moz-transition: .15s ease-in;
    -o-transition: 0.15s ease-in;
}
.button.off{
    background: #5a5a5a!important;
    animation:none;
    transition: 0.15s ease-in;
    -webkit-transition: .15s ease-in;
    -moz-transition: .15s ease-in;
    -o-transition: 0.15s ease-in;
}
.button.primary:hover{
    background:#3a3a3a
}
.button.action{
    font-size:32px;
    font-weight:200;
    padding:9px 11px 15px;
    line-height:15px;
    vertical-align:top
}
.button.secondary{
    background:#fff;
    color:#2e2e2e;
    margin-top:4px;
    border:1px solid #d5d5d5;
    border-radius:3px
}
.button.secondary:hover{
    color:#2e2e2e;
    border-color:#a5a5a5;
    text-decoration:none
}
.button.paypal{
    background: #f2f2f2;
    border: 1px solid #e5e5e5;
    margin-top: -3px !important;
    display: inline-block;
    padding: 8px 28px 4px;
    box-shadow: none;
}     
.button.paypal:hover{
    background: #f8f8f8;
}
.or {
	text-align: center;
	margin: -2px 0 2px;
	font-size: 14px;
}
.modal{
    display:block;
    position:fixed;
    z-index:1000;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:#fff;
    background-color:rgba(255,255,255,.8)
}
.bullet.on,.product-grid,.sharePanel li,.sharePanel ul{
    display:inline-block
}
.dialog{
    background:#fff;
    border:1px solid #e5e5e5;
    text-align:center;
    position:absolute;
    padding:10px;
    width:242px
}
.progressbar,.progressbar2{
    background-image:url(/assets/ui/progress.svg);
    height:31px
}
.dialog h3{
    text-transform:uppercase;
    font-size:13px;
    letter-spacing:3px;
    font-weight:400;
    margin:10px 0 0;
    padding:0;
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;
}
.progressbar{
    width:243px
}
.progressbar2{
    width:31px;
    margin:auto;
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0
}
.dialog.share {
    width:900px;
    padding:30px;
    text-align:left
}
.dialog .shareImage {
    max-width:300px;
    max-height:280px;
    box-shadow: 4px 3px 6px #bbb;
}
.dialog .shareBox {
    display: inline-block;
    margin-left: 30px;  
    vertical-align: middle;
    width: calc(100% - 335px);
}
.dialog .shareBox .sharePanel ul {
    margin-top:9px;
    padding:0
}
.dialog .shareBox .sharePanel li a {
    border-radius: 3px;
    margin-right: 2px;
    padding: 8px 7px 6px;
    font-size:21px
}
.dialog .shareBox h2 {
    margin:0
}
.dialog .shareBox p {
    margin:15px 0 0
}
.dialog .shareBox input {
    margin:3px 0 0;
    padding:12px;
    width:calc(100% - 25px)
}
.dialog .product-arrow {
    display:block;
    visibility:visible;
    top:10px;
    right:10px;
    font-size:48px
}


@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){
    .progressbar,.progressbar2{
        background-image:url(/assets/ui/progress.gif)
    }
}
@supports (-ms-accelerator:true){
    .progressbar,.progressbar2{
        background-image:url(/assets/ui/progress.gif)
    }
}
.bullet{
    color:#666;
    font-size:32px;
    font-weight:400;
    line-height:15px;
    padding-right:10px;
    vertical-align:-2px
}
.bullet.on{
    transform:rotate(90deg);
    vertical-align:-12px
}
.item-info-box,.notes,.product-grid{
    vertical-align:top
}
.sharePanel ul{
    margin:0;
    padding:0 0 0 10px
}
.sharePanel li{
    font-size:15px;
    margin:0 2px
}
.sharePanel li a{
    background:#8b8b8b;
    border-radius:20px;
    color:#fff;
    margin-right:2px;
    padding:6px 5px 4px
}
.facebook:hover{
    background:#3b5998
}
.twitter:hover{
    background:#00aced
}
.google:hover{
    background:#D84B37
}
.pinterest:hover{
    background:#BD081C
}
.category-header{
    text-align:center;
    padding:30px 0 0
}
.category-header h1{
    margin:3px 0 10px
}
.category-header p{
    width:80%;
    margin:0 auto;
    letter-spacing:1px
}
.product-name,.product-note{
    font-weight:600;
}
.product-list{
    margin:30px 0
}
.product-grid{
    margin:0 2% 40px 0;
    text-align:center;
    width:23.5%;
    position:relative
}    
.product-list a:nth-child(4n) .product-grid{
    margin-right:0
}
.product-image{
    border:1px solid #e5e5e5;
    margin:0 0 10px;
    overflow:hidden;
    position:relative;
    text-align:initial;
    width:100%
}
.product-image img{
    height:calc(100% - 20px);
    margin:10px;
    position:absolute;
    width:calc(100% - 20px);
    max-width:100%;
    max-height:100%;
    object-position:center;
    object-fit:contain
}
.imgholder{position:relative!important}
.product-note{
    color:#666;
    font-size:11px;
    margin-bottom:4px;
    text-align:center;
    display:none
}
.product-name{
    font-family:DomaineDisplay;
    font-size:18px
}
.product-details{
    margin:0px auto 2px;
    width:96%
}
.product-price{
}
.product-arrow{                                
    background:#fff;
    border:0 solid red;
    color:#666;
    font-size:58px;
    font-weight:400;
    opacity:.75;
    padding:8px 10px 21px;
    position:absolute;
    top:27%;
    z-index:3;
    display:none;
    visibility:hidden
}
.item-image:hover .product-arrow,.product-grid:hover .product-arrow{        
    display:block;
    visibility:visible
}
.product-arrow:hover{       
    color:#2e2e2e;
    opacity:.9
}
.product-arrow.right{         
    right:8px
}
.product-arrow.left{      
    left:10px
}
.item-closeup .product-arrow.left,.item-display:nth-child(even) .text,.item-image .product-arrow.left{
    left:0
}
.item-image-area{
    float:left;
    padding-right:3%;
    width:47%;
    margin-bottom:50px;  
    margin-top:20px;
    position:relative
}
.item-image img{
    bottom:0;
    left:0;
    padding:10px;
    position:absolute;
    right:0;
    top:0;
    max-width:94%;
    max-height:94%;    
    border:1px solid #e5e5e5;
    margin:auto;
    background:#fff
}
.item-image .base{
    position:relative;
    opacity:0
}
.item-image-area .item-image img{
    width:calc(100% - 20px);
    height:calc(100% - 20px);
    max-width:100%;
    max-height:100%;
    border:none
}
.item-image-holder{
    width:calc(100% - 114px);
    float:right;
    border:1px solid #e5e5e5;
    padding:10px;
    position:relative;
    overflow:hidden
}
.item-image .product-arrow{
    font-size:52px;
    padding:7px 13px 21px;
    height:20px;
    margin:auto;
    top:0;
    bottom:0
}
.item-image .product-arrow.right{
    right:0
}
.item-thumbs{
    float:left;
    margin:0;
    width:92px
}
.item-thumbs img{
    margin:0 0 8px;
    width:80px;
    height:80px;
    background:#f2f2f2;
    border-bottom:2px solid #FFF
}
.item-thumbs .selected img{
    border-bottom:2px solid #2e2e2e
}
.item-main{
    display:flex
}
.item-title{
    padding:42px 0 20px
}
.item-title hr{
    margin:30px 0
}
.item-single{
    padding:47px 0 30px;
    width:76%;
    margin:0 auto;
    text-align:center
}
.item-single.wide{
    width:unset;
    max-width:1220px
}
.item-single h1{
    margin-bottom:32px
}
.item-single a:hover{
    color:#000
}
.item-single.text{
    text-align:left
}
.item-info,.item-info-area,.item-info-box,.item-info-tab{;
    text-align:left
}
.item-single.text h1{
    text-align:center;
    margin-bottom:32px
}
.item-single.text h4:first-of-type{
    margin:30px 0 0
}
.item-main h1{
    font-size:36px;
    line-height:36px
}
.item-main small{
    color:#2e2e2e;
    display:block;
    font-size:13px;
    font-weight:400;
    margin-top:12px;
    line-height:22px;
    letter-spacing:3px;
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;;
    text-transform:uppercase
}
.item-main li{
    line-height:24px;
    margin:4px 0
}
.item-closeup .product-arrow{
    display:block;
    visibility:visible;
    font-size:80px;
    padding:30px 30px 40px
}
.item-closeup .product-arrow.right{
    right:0
}
.item-closeup .product-arrow.close{
    right:0;
    top:0;
    margin:0;
    font-size:65px
}
.item-info li a,.item-info-tab a{
    text-decoration:none
}
.item-info{
    margin:40px 0 26px;
    padding:0;
    border-bottom:1px solid #e5e5e5
}
.item-info li{
    display:inline-block;
    margin-bottom:5px
}
.item-info li a{
    font-weight:400;
    padding:14px 15px 10px
}
.item-info li a:hover{
    background:#f5f5f5
}
.item-info .selected a{
    border:1px solid #e5e5e5;
    border-bottom-color:#fff!important;
    background:#fff;
    color:#2e2e2e;
    padding:14px 14px 10px
}
.item-info.selected a:hover{
    background:#fff
}
.item-info-tab{
    display:none;
    margin-top:15px;
    border-top:1px solid #e5e5e5
}
.item-info-tab a{
    padding-top:20px;
    display:block
}
.item-example,.item-info-box,.nav-example{
    display:inline-block
}
.item-info-tab.selected{
    background:#fff!important;
    color:#2e2e2e
}
.item-info-tab.selected svg{
    -moz-transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -o-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    transform:rotate(180deg)
}
.item-info-area+hr{
    border-top:none
}
.item-info-tab.selected~hr{
    border-top:1px solid #e5e5e5
}
.item-info-area .controls{
    text-transform:uppercase;
    letter-spacing:3px;
    font-size:11px;
    padding:10px
}
.item-info-area .controls a{
    text-decoration:none
}
.item-info-area .controls a:hover{
    text-decoration:underline
}
.item-example a,.moreinfo,.moreinfo:hover,.nav li a{
    text-decoration:none
}
.item-info-area #delivery tr:first-child{
    border-top:none
}
.item-info-box{
    margin:0 2%
}
.item-info-box ul{
    padding:0 0 0 10px;
    margin:0
}
.item-info-box table{
    margin:20px 0 32px;
    text-align:left
}      
.item-info-box h4{
    margin:10px 0 0;
    font-weight:500;
    letter-spacing:.6px;
    text-transform:none
}      
.item-info-box h4:first-child{
    margin:0
}    
.item-info-box p{
    margin:0
}
.item-info-box .name{
    color:#666
}
.item-info-box img{
    width:100%;
    margin-bottom:18px
}
.item-info-box.one{
    width:76%;
    margin:0 auto
}
.item-info-box.two{
    width:45%
}
.item-info-box.twoA{
    width:56%
}
.item-info-box.twoB{
    width:33%
}
.item-info-box.three{
    width:29%
}
.item-info-box.four{
    margin:18px 1.5% 0;
    width:21.5%
}
.item-display{
    margin-top:15px;
    position:relative
}
.item-display img{
    max-width:612px
}
.item-display .item-info-box{
    position:relative;
    margin:0 2%
}
.item-display .item-info-box.text{
    position:absolute;
    margin:0 2%;
    top:50%;
    -ms-transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%)
}
.item-display:nth-child(even){
    text-align:right
}
.item-display.front{
    margin:0 5% 50px;
    text-align:left
}
.item-display.front.copy{
    margin:0 8% 50px;
    text-align:center
}
.item-display.front.copy h2{
    line-height:32px
}
.item-display.front .text{
    text-align:left;
    margin:0 1% 0 8%
}
.item-display.front img{
    padding:10px;
    border:1px solid #e5e5e5;
    max-width:600px;
    width:45%
}
.item-display.front p{
    margin-top:20px;
    text-align:justify
}
#info-product .faq{
    text-align:center
}
#info-delivery .faq{
    margin:0;
    border:0
}
#info-delivery .faq p{
    margin:0
}
#info-delivery .faq h3{
    letter-spacing:.6px
}
#info-delivery .faq th{
    font-size:11px;
    padding:16px 10px 12px
}
#delivery{
    width:100%;
    text-align:left;
    margin:-6px 0 -20px;
    line-height:24px;
    border:0;
}
.item-example-box {
    display: flex;
    justify-content:center;  
    align-items: center;
    flex-wrap: wrap;
    text-align: center;
    margin-bottom: 45px;
}
.item-example{
    width: 20%;
    margin-top: 20px;  
    display: flex;
    justify-content: space-around;
    height:270px     
}
.item-example a{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: column;
    margin: auto;        
}
.item-example img{
    box-shadow: 4px 3px 10px #ccc; 
    width:100%;                 
    transition: 0.15s ease-in;
    -webkit-transition: .15s ease-in;
    -moz-transition: .15s ease-in;
    -o-transition: 0.15s ease-in;
    max-width:160px
}
.item-example .product-name {
    font-size: 13px;
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;;
    margin-top: 14px;
    font-weight:500;                 
    transition: 0.15s ease-in;
    -webkit-transition: .15s ease-in;
    -moz-transition: .15s ease-in;
    -o-transition: 0.15s ease-in;   
}   
.item-example:hover img{
    box-shadow: 4px 3px 6px #bbb;
    width:98%; 
}    
.item-example:hover .product-name {
    margin-top: 11px;
}   

.nav-example{
    background:#2e2e2e;
    text-align:center;
    color:#fff;
    font-size:13px;
    width:154px;
    border-radius:3px
}
.faq,.form{
    text-align:left
}
.faq{
    margin:0 0 30px;
    padding:0 0 20px;
    border-bottom:1px solid #e5e5e5;
    display:flow-root
}
.faq h3{
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;;
    font-size:13px;
    margin:0;
    font-weight:500
}
.faq p{
    margin:7px 0
}
.form{
    border:1px solid #e5e5e5;
    padding:20px 40px
}
.form h2{
    font-size:17px;
    letter-spacing:4px;
    text-transform:uppercase
}
.form label{
    margin-top:18px
}
.form input,.input,select{
    width:calc(100% - 42px);
    margin:3px 0
}
.form .error .input,.form .error input,.form .error textarea{
    border-bottom:3px solid #d55
}
.checkmark,.form .delivery{
    border:1px solid #e5e5e5
}
.form textarea{
    width:calc(100% - 29px);
    margin:3px 0;
    height:110px
}
.form .errorMessage{
    color:#d55;
    display:none
}
.checkbox,.form .delivery .note,.form .error .errorMessage{
    display:block
}
.form a:hover{
    color:#fff
}
.form .button{
    margin:20px 0 15px
}
.form #billingForm .button{
    margin-top:32px
}
.form h3{
    line-height:36px
}
.nav li ul li{
    line-height:18px
}
.form .progressbar{
    margin:0 auto
}
.form .delivery{
    padding:12px 20px;
    margin-top:3px;
    margin-bottom:18px
}
.form .delivery label{
    margin:0
}
.form .delivery .radiobutton{
    top:8px
}
.form .delivery a:hover{
    color:#000
}
.thankyou{
    font-size:15px;
    letter-spacing:5px;
    margin:-21px 0 30px;
    text-transform:uppercase;
    font-weight:400
}
.checkbox{
    position:relative;
    padding:3px 0 0 35px;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.checkbox input{
    position:absolute;
    opacity:0;
    cursor:pointer
}
.checkmark{
    position:absolute;
    top:0;
    left:0;
    height:25px;
    width:25px;
    background-color:#fff
}
.checkbox:hover input~.checkmark{
    background-color:#F9F6F3
}
.checkmark:after{
    position:absolute;
    display:none
}
.checkbox input:checked~.checkmark:after,.radiobox{
    display:block
}
.checkbox .checkmark:after{
    left:7px;
    top:4px;
    width:5px;
    height:10px;
    border:solid #2e2e2e;
    border-width:0 3px 3px 0;
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg)
}
.radiobox{
    position:relative;
    padding-left:35px;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.radiobox input{
    position:absolute;
    opacity:0
}
label.radiobox{
    margin:10px 0 0
}
.radiobutton{
    position:absolute;
    top:-2px;
    left:0;
    height:27px;
    width:27px;
    background-color:#fff;
    border:1px solid #d5d5d5;
    border-radius:50%
}
.radiobox:hover input~.radiobutton{
    background-color:#F9F6F3;
    border-color:#c5c5c5
}
.radiobox input:checked~.radiobutton{
    background:#2e2e2e;
    border-color:#2e2e2e
}
.radiobutton:after{
    position:absolute;
    display:none
}
.moreinfo{
    position:relative
}
.cart,.radiobox input:checked~.radiobutton:after{
    display:block
}
.radiobox .radiobutton:after{
    top:9px;
    left:9px;
    width:10px;
    height:10px;
    border-radius:50%;
    background:#fff
}
.moreinfo{
    fill:#aaa;
    padding:2px
}
.moreinfo svg{
    fill:#aaa;
    padding:2px
}
.moreinfo:hover svg{
    fill:#888;
}
.moreinfo .tooltip{
    bottom:calc(100% + 9px)
}
.moreinfo .tooltipContent{
    text-transform:none;
    letter-spacing:.6px;
    font-size:15px
}
.moreinfo:hover .tooltip{
    -moz-transition-delay:.1s;
    -webkit-transition-delay:.1s;
    -o-transition-delay:.1s;
    transition-delay:.1s
}
.cart .desc,.cart .details,.cart .thumb,.notes{
    display:inline-block
}
.cart .details{
    border:none;
    padding:0;
    margin:0 0 40px;
    width:calc(100% - 460px);
    position:relative;
}
.notes{
    margin-left:30px
}
.cart table{
    border-bottom:1px solid #e5e5e5;
    width:100%
}
.cart td{
    text-align:center;
    padding:0
}
.cart .desc,.cart .item{
    text-align:left
}
.cart .desc{
    vertical-align:middle;
    width:calc(100% - 220px)
}
.cart .thumb{
    padding:12px;
    width:180px;
    text-align:center
}
.cart .thumb img{
    box-shadow: 4px 3px 6px #bbb;
    max-width:120px;
    max-height:120px
}
.cart .thumb img.sq{
    max-width:106px;
    max-height:106px
}
.cart .product-details{
    margin:4px 0 0;
    width:unset
}
.cart #rowOverlay{
    background-color:rgba(255,255,255,.8);
    display:none
}
.cart input{
    margin:0;
    text-align:center;
    width:30px;
    padding:12px 10px
}
.nav .cart tr{
    width:340px
}
.nav .cart td{
    width:inherit
}
.nav .cart p{
    margin:15px 0;
    text-align:left
}
.nav .topnav li .button.primary,.nav li,.nav li a{
    display:inline-block
}
.rel{
    position:relative!important;
    margin-bottom:32px
}
.sidenote{
    width:380px;
    border:1px solid #e5e5e5;
    padding:20px
}
.sidenote .bold{
    border-top:1px solid #e5e5e5;
    margin-top:20px;
    padding-top:20px;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:0;
    font-weight:500
}
.curr-price-inner,.nav li a{
    font-weight:400;
    text-transform:uppercase
}
.sidenote .button{
    margin-top:15px;
    width:324px
}
.sidenote:first-child{
    margin-bottom:20px
}
.sidenote:last-child{
    margin-bottom:50px
}
.sidenote.secure{
    padding-top:12px;
    border:none;
    text-align:center;
    color:#666
}
.sidenote.secure .trustMark{
    width:70px
}
.curr-price-inner{
    letter-spacing:2px;
    font-size:12px
}
.brand{
    margin:0 auto;
    width:220px
}
.brand svg{
    width:220px;
    height:auto;
    margin:12px 0 -16px;
    fill:#2e2e2e
}
.small .brand{
    width:140px
}
.small .brand svg{
    width:140px;
    height:35px;
    margin:8px 0 -6px
}
.small .co .brand svg{
    height:46px;
    margin:5px 0 -9px
}
.small .co .brand{
   width:unset;
   margin:unset;
    text-align:left
}
.brand-min{
    width:108px;
    position:absolute;
    margin-top:13px;
    opacity:0;
    transition:opacity 150ms
}
.brand-min svg{
    width:110px;
    height:auto
}
.co .secure {
    line-height:52px;
    font-size:14px
}
.co .secure .icon {
    height: 16px;
    vertical-align: -2px;
    width: 16px;
    margin-right: 3px;
}
.nav{
    width:100%;
    z-index:200;
    border-bottom:1px solid #e5e5e5;
    top:0;
    background:#fff;
    text-align:center
}
.small.nav{
    position:fixed
}
.small.nav.co{
    position:relative
}
.nav ul{
    margin:0;
    padding:0
}
.nav li a{
    color:#2e2e2e;
    font-size:11px;
    letter-spacing:3px;
    padding:19px 18px 5px;
    line-height:21px
}
.nav .topnav li a{
    font-size:11px;
    letter-spacing:2px;
    padding:11px 20px 6px;
    border:1px solid #fff;
    border-bottom:0
}
.nav .topnav li:hover a{
    text-decoration:underline
}
.nav .topnav .drop{
    margin-top:2px
}
.nav .topnav .drop:hover a{
    border:1px solid #e5e5e5;
    text-decoration:none
}
.nav .topnav .drop-cart:hover a{
    border:1px solid #2e2e2e;
    text-decoration:none;
    background:#2e2e2e;
    color:#fff;
}
.nav .topnav .drop-cart:hover svg{
    fill:#fff
}
.nav .topnav li .button{
    padding:10px 20px 6px
}
.nav .topnav li .button.primary{
    background:#2e2e2e;
    text-align:center;
    color:#fff;
    font-size:13px;
    width:154px;
    border-radius:3px
}
.nav .topnav li .button.primary:hover{
    background:#3a3a3a;
    text-decoration:none
}
.nav .topnav li .button.secondary{
    background:#fff;
    text-align:center;
    color:#2e2e2e;
    display:inline-block;
    margin-right:12px;
    width:90px;
    border:1px solid #d5d5d5;
    font-size:13px;
    border-radius:3px
}
.nav .topnav li .button.secondary:hover{
    border-color:#a5a5a5
}
.nav .topnav li:hover .cart a{
    border:none;
    background:#fff;
    padding:0;
    color:#2e2e2e;
    margin:0
}
.nav .topnav .drop:hover:after{
    background:#fff;
    border-left:1px solid #e5e5e5;
    display:block;
    height:1px;
    margin-top:-1px;
    position:relative;
    width:99%;
    z-index:100;
    content:" "
}
.ir:before,.startTip:after{
    content:""
}
.nav .topnav .drop:hover ul li a,.nav li:hover ul li a{
    border:none;
    margin:0;
    padding:5px 0
}
.nav .topnav .drop-cart:hover ul li a{
    background:#fff;
    border:none;
    color:#2e2e2e
}
.nav .topnav .drop ul li a:hover,.nav .topnav .drop-cart ul li a:hover{
    text-decoration:underline
}
.nav li ul li a:hover{
    text-decoration:none
}
.nav .topnav.right{
    position:absolute;
    float:unset;
    right:0;
    text-align:left;
    z-index:20
}
.nav .drop-cart{
    position:static;
    margin-top:3px;
    transition:opacity 150ms
}
.nav.small .drop-cart{
    margin-top:0;
}
.nav li ul{
    position:absolute;
    overflow:hidden;
    background:#fff;
    text-align:left;
    list-style:none
}
.nav li ul{
    max-width:140px;
    min-width:100px;
    border:1px solid #e5e5e5;
    padding:10px 12px 10px 30px;
    z-index:5;
    visibility:hidden;
    max-height:0
}
.nav .drop ul{
    margin-top:-1px
}
.nav .drop-cart ul{
    border:1px solid #2e2e2e;
    width:340px;
    max-width:340px;
    right:0;
    padding:20px
}
.nav .drop-cart.off ul{
    display:none
}
.nav .drop-cart .desc{                                                               
    display:table-cell
}
.nav .drop-cart ul h3{
    padding-bottom:14px
}
.nav .drop-cart ul img{
    max-width:70px;
    max-height:70px
}
.nav .drop-cart ul img.sq{
    max-width:62px;
    max-height:62px
}
.nav .drop-cart .thumb{
    padding:18px 12px 18px 2px;
    display:table-cell
}
.nav .drop-cart .product-name{
    text-transform:none;
    letter-spacing:.6px
}
.nav .drop-cart .product-details{
    width:240px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    margin:0
}
.nav .drop-cart .product-price{
    margin:0
}
.nav .drop-cart .bold{
    margin:0;
    padding:20px 0 10px;
    text-transform:uppercase;
    letter-spacing:2px;
    font-weight:500
}
.dropArrow,.dropnav{
    overflow:hidden;
    z-index:200
}
.nav li:hover ul{
    visibility:visible;
    max-height:1200px
}
.nav li ul li{
    width: 100%;
    padding-bottom: 3px;
    padding-top: 2px;
    margin: 0;
    line-height: 30px;
    padding: 0;
}
.nav li ul li:last-child{
    border-bottom:none
}
.nav li ul li a{
    line-height:15px;
    padding:7px 0;
    font-size:13px;
    font-weight:400;
    letter-spacing:.5px
}
.nav li:hover ul li a{
    text-decoration:none;
    background:#fff;
    width:100%
}
.nav .catnav{
    transform:translate3d(0,0,0);
    background:#fff
}
.nav .catnav ul{
    margin:0 auto;
    padding-right:24px;
    position: relative;
}
.nav .catnav li a{
    border-bottom:2px solid #fff
}
.nav .catnav li a:hover{
    border-bottom:2px solid #2e2e2e
}
.dropnav{
    z-index:5;
    visibility:hidden;
    position:fixed;
    border:1px solid #e5e5e5;
    padding:8px 10px 10px;
    background:#fff;
    left:0;  
    width:100% 
}
.nav .dropnav ul {
    position: unset !important;
    margin: 0;
    padding: 10px 1% 10px !important;
    border: none !important;
    max-width: 14.3%;
    display: inline-block;
    vertical-align: top;
}   
.nav .dropnav ul.double {
    max-width: 30.9%;
}
.nav .dropnav ul.double li{
    width: 49%;
}
.nav .dropnav ul.double li.group{
    width: 100%;
}
.nav li:hover .dropnav{
    visibility:visible
}
.nav .dropnav ul li{
    width: 100%;
    padding-bottom: 3px;
    padding-top: 2px;
    margin: 0;
    line-height: 30px;
    padding: 0;         
}
.nav .dropnav ul li a{
    padding: 0;
    text-transform: capitalize; 
    line-height: 24px;       
    -webkit-transition:opacity .2s ease-in;
    -moz-transition:opacity .2s ease-in;
    -o-transition:opacity .2s ease-in;
    transition:opacity .2s ease-in;
}
.nav .dropnav ul li a:hover{
    opacity:.3;
    border:0
}
.nav .dropnav ul li.group{
    text-transform: capitalize;
    letter-spacing: 3px;
    color: #333;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 6px;
    margin-bottom: 7px; 
    text-transform: uppercase;
}         
.nav .dropnav .imagelink{ 
    line-height: unset;
    display: inline-block;
    position: relative;
    margin: 10px 1% 20px 0;
    width: 28.3%;
    padding: 10px;
    border: 1px solid #e5e5e5;
}
.nav .dropnav .imagebox{
    position: absolute;
    max-width: 80%;
    width: 80%;
    bottom: 8px;
    left: 0;
    background: #fff;
    margin: 0 auto;
    right: 0;
    line-height: 26px;
    padding: 20px 0 8px;
    z-index:2
}
.nav .dropnav .imageboxheader{
    display: block;
    font-size: 13px;
    letter-spacing: 4px;
    font-weight: 500;
}
.nav .dropnav .imageboxlink{
}
.nav .dropnav .imagemain{  
    display: inline-block;
    background:#000;
    width: 100%;
}
.nav .dropnav .imagemain img{
    width: 100%;    
    -webkit-transition:opacity .25s ease-in;
    -moz-transition:opacity .25s ease-in;
    -o-transition:opacity .25s ease-in;
    transition:opacity .25s ease-in;
}
.nav .dropnav .imagelink:hover{    
    border: 1px solid #e5e5e5;
}
.nav .dropnav .imagelink:hover .imagemain{
}
.nav .dropnav .imagelink:hover .imagemain img{
    opacity:.85
}
.nav .dropnav .imagelink:hover .imageboxlink{ 
    text-decoration:underline
} 
.nav .dropnav .imagelink.lead:hover .imageboxlink{ 
    text-decoration:none
}
.nav .dropnav .imagelink.lead{ 
    width: 20%;
    padding: 0;
    border: 0;
    text-align:left
}
.nav .dropnav .lead .imageboxlink{  
    font-size:13px;                                                              
    letter-spacing:1px;
    text-transform:capitalize
}
.nav .dropnav .lead .imageboxheader{
    font-size:13px;
    letter-spacing:3px;
}  
.nav .dropnav .lead .imagebox{
    position: relative;
    padding: 10px 0 0;
    bottom:0
}

#search-bar.searchOn { 
    width: calc(100% - 20px);
    visibility:visible
}
.searchForm {
    width:60%;
    max-width:660px;
    margin: 20px auto 16px;
}
.searchForm input{
    border:0;
    border-bottom:1px solid #e5e5e5;
    font-size:30px;
    letter-spacing:1px;
    width: calc(100% - 210px);
    padding:8px 10px;
    margin: 0
} 
.searchForm .button.secondary{
    margin: 0 0 0 20px;
    padding:14px 20px 10px
}
#search-bar ul {
    margin:0 auto 20px;
    padding:0 !important;
    text-align:left;
    max-width:560px;
    display:block
}
#search-bar li a {
    font-size:15px;
    line-height:32px;
    display:block
}
#search-bar li.app {
    line-height:unset;
    margin-top:10px;
    display:block
}
#search-bar li.app a{
    line-height:24px;
    font-size:13px;
    text-transform:none;
    letter-spacing:.6px
}
#search-bar li.app a:hover{
    opacity:unset;
    background:#f5f5f5
}
#search-bar li.app img{
    height:110px
}
#search-bar li.app .details{
    display: inline-block;
    height: 110px;
    vertical-align: top;
    width: calc(100% - 130px);
    margin-left: 20px;
    padding-top: 0px;
}
#search-bar li.app .product-name{
    margin-top:9px
}
#search-bar li.app .product-details{
    margin:1px 0 0
}


.actions,.options .addToBasket,.startTip{
    text-align:center
}

.icon{
    height:1.2em;
    vertical-align:-.2em;
    width:1.2em
}
.iconMaxi{
    height:1.7em;
    vertical-align:-.5em;
    width:1.7em;
    margin-right:.2em
}
.iconMini{
    height:.8em;
    vertical-align:-.15em;
    width:1em;
    margin-left:.1em
}
.iconNav{
    fill:initial;
    height:20px;
    margin:0;
    vertical-align:-4px;
    width:20px
}
.footerEnd{
    border-top:1px solid #EBE7DF;
    clear:both;
    color: #444;     
}
.lead{
    display:inline-block;
    width:23%;
    padding:0 1%;
    margin:20px 0 0;
    vertical-align:top
}
.lead p{
    padding:0;
    margin:0
}

.ace {
    margin: 10px auto 10px!important;
    border: 1px solid rgb(229, 229, 229);
    padding: 10px;                
}
.ace img {
    width: 100%;
    height: 100%; 
    object-fit: cover;
    min-height: 360px; 
    max-height: 500px;
}
.ace-box {
    background:rgba(255, 255, 255, 0.9);
    position:absolute;
    bottom:55px;
    left:0;
    right:0;   
    margin:0 auto;
    padding:22px 30px 30px;
    text-align:center;
    width:386px
}
.ace-box a{
    text-decoration:none
}
.ace-box h1{
    font-size: 30px;
    line-height: 40px;
    margin:0 0 8px;
}
.ace-3,.ace-5 {
    display:inline-block;
    margin:5px 1%;
    vertical-align: top;
    position:relative
}  
.ace-3 a,.ace-5 a{
    text-decoration: none;     
}
.ace-3 a:hover img,.ace-5 a:hover img{     
    opacity:.8
}
.ace-3 img,.ace-5 img{
    border: 1px solid #e5e5e5;
    padding: 10px;
    width: calc(100% - 22px); 
    -webkit-transition: opacity .25s ease-in;
    -moz-transition: opacity .25s ease-in;
    -o-transition: opacity .25s ease-in;
    transition: opacity .25s ease-in;
}   
.ace-3{
    width:31.33%
}    
.ace-3 h3{
    padding-top: 18px;
    font-size:21px
}
.ace-3 p{
    padding:0;
    margin:0
} 
.ace-5-box{
    border: 1px solid #e5e5e5;
    padding: 10px;
}    
.ace-5{
    width:18%;
}    
.ace-5 a:hover h4{    
    text-decoration:underline;  
}  
.ace-5 h4{
    font-size: 13px;
    letter-spacing:3px;
    font-weight:500;
    padding:10px 0
} 
.hero {position:relative}
.hero img {
    min-height: 160px;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    object-fit: cover;
    width: 100%;
}
.hero .hero-box {
    background: rgba(255, 255, 255, 0.9);
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 24px 30px 20px;
    text-align: center;
    width: 600px;
} 
.hero .hero-box h1{
    font-size: 60px;
    line-height: 75px;
    margin: 3px 0 0;
}
.hero .hero-box h2,.hero .hero-box h3{
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;
    text-transform:uppercase;
    font-size: 15px;
    letter-spacing: 5px;
    font-weight:400;
    margin:0 auto
}
.hero .example {
    background:#fff0; display:block; position:absolute;
}
.hero .example.words-bold {
    width:17.5%; height:66.5%; left:4%; top:25%    
}   
.hero .example.favourite-things {
    width:20%; height:74%; left:24%; top:5%  
}   
.hero .example.shapes-in-letters {
    width:24%; height:90%; left:48%; top:2%  
}   
.hero .example.shapes-in-shapes {
    width:21.5%; height:57%; left:74%; top:9.5%   
}     
.hero a:hover .tooltip{
    -webkit-transition:opacity .3s ease;
    -moz-transition:opacity .3s ease;
    -o-transition:opacity .3s ease;
    transition:opacity .3s ease;
    -moz-transition-delay:.1s;
    -webkit-transition-delay:.1s;
    -o-transition-delay:.1s;
    transition-delay:.1s
}
.hero .tooltip{
    bottom:21%; 
    letter-spacing:3px;
    line-height:22px
}      
.hero .tooltipContent{
    padding: 8px 10px 6px;
}      
.hero .tooltipContent:after{
    top:-6px;
    bottom:unset;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-bottom:6px solid #2e2e2e;
    border-top:none;
}

.usp-box {
    margin-top:30px
}
.usp {
    width:25%;
    display:inline-block;
    vertical-align: top;
}
.usp-text {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    line-height: 21px;    
    margin-left: 6px; 
    width:82%
}
.usp-text h4{  
   font-size:11px
}
.usp-text p{  
    margin:0;
    line-height: 18px;
    font-size:13px
}
.usp .icon {
    height: 35px;
    vertical-align: middle;
    width: 35px;
}  
.usp-box2 {
    margin-top:30px ;
    
}     
.usp-box2. usp {         

}
.usp-box2 .usp-text {
    width:97%;
    text-align: center; 
    position:relative;
    margin:0
}
.usp-box2 .usp-text h4{  
    text-transform:capitalize;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .6px;
    font-family: DomaineDisplay;
    font-style: italic;   
    line-height:27px;
    border-top:1px solid #d5d5d5;
    border-bottom:1px solid #d5d5d5;
    padding:6px 0px 3px 10px;
    margin:0 10px 8px -10px
}

.usp-box2 .usp-text .arrowUp{  
    content:"";
    position:absolute;
    border-top:1px solid #d5d5d5;
    width:27px;
    transform: rotate(45deg);
    top:9px
}
.usp-box2 .usp-text .arrowDown{  
    content:"";
    position:absolute;
    border-top:1px solid #d5d5d5;
    width:27px;
    transform: rotate(135deg);
    top:28px
}
.usp-box2 .usp-text .arrowLeft{  
    left:-14px
}
.usp-box2 .usp-text .arrowRight{  
    right:-13px
}

.usp-box2 .usp-text p{  
    /*font-size: 14px;*/
}
.usp-box2 .usp .icon {
    display:none
} 
.arrowbox {
 border-top:1px solid green;
    position:relative;
    margin-top: 100px;
}
.arrowbox:before,
.arrowbox:after {

}
.arrowbox:before {
	 content: '';
    position:absolute;
    left: calc(90% - 20px);
    top: -9px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 10px;
    border-color: transparent transparent transparent black;
    z-index: 10;
}
.arrowbox:after {
   content: '';
    position:absolute;
    right:10%;
    top: -10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 10px;
    border-color: transparent transparent transparent green;
}
.usp-box2:nth-child(1) {
  z-index:4
} 
.usp-box2:nth-child(2) {
  z-index:3
} 
.usp-box2:nth-child(3) {
  z-index:2
} 
.usp-box2:nth-child(4) {
  z-index:1
}  

.big-1 {
    margin:0 0 20px;
    border: 1px solid #e5e5e5;
    padding: 10px;
    position:relative
}    
.big-1 img {
    width:100%;
    height:100%
}   
.big-1 .box {
    position:absolute;
    padding:35px 40px 20px;
    top:40px;
    left:40px;
    background:#ffffffe6;
    width:22%;
}   
.big-1 .box.right {  
    top:unset;
    left:unset;
    bottom:40px;
    right:40px;
    background:#fff;
    width:16%
}      
.big-1 .box h3{
    line-height: 38px;
    border-bottom: 2px solid #2e2e2e;
    padding-bottom: 15px;
    margin-bottom: 16px;
    font-size: 34px;
    width:100%
}    
.big-1 .box p{
    line-height: 30px;
    width:100%
}

.big-2 {
    margin: 50px 0 60px;
    border: 1px solid #e5e5e5;
    padding: 10px;
    display: flex;
}
.big-2 img {
    width:50%;
    height:50%
}     
.frames .flexcopy {
    background: #eee;     
    background-image: linear-gradient(to bottom right, #faf9f5, #f2f0e9);
}     
.canvases .flexcopy {
    background: #eee;     
    background-image: linear-gradient(to bottom right, #faf9f5, #f2f0e9);
}
.paper-and-printing .flexcopy {
    background: #eee;     
    background-image: linear-gradient(to bottom right, #faf9f5, #f2f0e9);
}
.instant-preview .flexcopy {
    background: #eee;     
    background-image: linear-gradient(to bottom right, #faf9f5, #f2f0e9);
}
.sizes .flexcopy {
    background: #eee;     
    background-image: linear-gradient(to bottom right, #faf9f5, #f2f0e9);
}
.guide .sizes{
    margin:10px 0 30px
}
.flexcopy {
    display: flex;
    height: auto;
    width: 50%
}
.flexmiddle {   
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 80px;
}     
.flexmiddle h3{
    line-height: 38px;
    border-bottom: 2px solid #2e2e2e;
    padding-bottom: 23px;
    margin-bottom: 18px;
    font-size: 34px;
    width:100%
}    
.flexmiddle p{
    line-height: 30px;
    width:100%
}

.showcase {          
    display:flex;
    margin:40px 0 0
}       
.showcase img{         
    position: relative;
    height: 660px
}
.showcase .wall {   
    width: 100%;
    background: #ded9df;
    background-image: linear-gradient(to top right,#e5dde7, #ded9df);
    padding: 20px 10px 20px 110px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    height:620px;
    margin:-20px 0 0 -100px;
    overflow:hidden
}
.showcase .item-example {
    width: 29%;
    height: 29%;
    margin: 2%;
    justify-content: space-around;
    align-items: center;                                                                             
}              
.showcase .item-example img{
    max-width: 160px;
    max-height: 180px;
    width: auto;
    height: auto;
    box-shadow: 12px 14px 15px #c5c4c5
}
.showcase .item-example img:hover{
    max-width: 155px;
    max-height: 175px; 
    width: 99%;
    height: 99%;  
    box-shadow: 4px 4px 9px #c5c4c5
}   
.showcase .item-example a{
    display: block;    
}
                   


.footer{
    clear:both;                
    color: #444;     
    background: #f6f6f6;
    padding-bottom:50px
}
.footer .content{
    width: 1080px;
    max-width: 96%;
}
.footer ul {
    display:inline-block;
    list-style: none;
    margin: 36px 0 12px;
    padding: 0;
    width: 24%;
    min-width: 170px;     
    vertical-align: top;
}
.footer li {
    line-height:30px
}
.footer li h5{
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 3px;
    margin: 5px 0;
    color: #2e2e2e;
}   
.footer li a{
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 11px;
}
.footer li a:hover{
     opacity:.7
}
.footer p {
    text-align:center;
    color:#666
}     
.footer ul.newsletter {
    width: 35%;
}  
.footer ul.newsletter p{
    text-align:left;
    color:#444
}     
.footer ul.follow-us {
    width: 17%;
}  
.footer .footer-end {  
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 11px; 
    text-align:center;
    color:#666;
    margin:24px 0 0
    
}    
.footer input{
    width:calc(100% - 157px)
}
.footer .button{
    padding:10px 18px 6px;
    font-size:11px;
    letter-spacing:2px
}  
.footer #icon {
    display: none;
}


.payAmex,.payDelta,.payElectron,.payMaestro,.payMastercard,.payPaypal,.payVisa{
    margin:0 -2px -4px 10px;
    height:22px;
    width:34px;
    display:inline-block;
    background-image:url(../ui/img/spritesheet.jpg)
}
.payVisa{
    background-position:-2px -28px
}
.payMastercard{
    background-position:-2px -54px
}
.payPaypal{
    background-position:-2px -2px
}
.payElectron{
    background-position:-2px -106px
}
.payMaestro{
    background-position:-2px -80px
}
.payAmex{
    background-position:-2px -132px
}
.trustMark{
    width:18%;
    max-width:100px;
    height:45px;
    display:inline-block;
    background-size:contain;
    background-repeat:no-repeat;
    background-position-y:center;
    margin:-5px 10px
}
.secureVisa{
    background-image:url(../ui/img/secureVisa.png)
}
.secureMastercard{
    background-image:url(../ui/img/secureMastercard.png)
}
.securePaypal{
    background-image:url(../ui/img/paypal.svg)
}
.secureVerisign{
    background-image:url(../ui/img/verisign.png)
}
.flagAUS,.flagCAN,.flagEUR,.flagUK,.flagUSA{
    margin:0 10px -4px 0;
    height:18px;
    width:32px;
    display:inline-block;
    background-image:url(../ui/img/spritesheet.jpg)
}
.flagUK{
    background-position:-40px -68px
}
.flagEUR{
    background-position:-40px -46px
}
.flagUSA{
    background-position:-40px -90px
}
.flagCAN{
    background-position:-40px -24px
}
.flagAUS{
    background-position:-40px -2px
}
.footerEnd{
    color:#666;
    padding:23px 0 20px
}
.footerEnd a{
    text-decoration:none
}
.footerEnd a:hover{
    text-decoration:underline
}
.actions{
    position:fixed;
    bottom:0;
    border-top:1px solid #e5e5e5;
    width:100%;
    padding:20px 0;
    background:#fafafa;
    z-index:100;
    top:calc(100% - 89px);
}   
.display{
    width:860px;
    position:relative
}
.display img{
    max-width: 95%;
    max-height: 97%;
    box-shadow: 6px 6px 10px #aaa;
}
.display .shadow{
    position:absolute;
    box-shadow: 6px 6px 10px #aaa;   
    top: 0;  
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto auto;
}
@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){
    .display{
        background-size:contain;
        background-position-x:center;
        background-position-y:center;
        background-repeat:no-repeat
    }
}
@supports (-ms-accelerator:true){
    .display{
        background-size:contain;
        background-position-x:center;
        background-position-y:center;
        background-repeat:no-repeat
    }
}
#canvas{
    position:fixed;   
    display: flex;
    align-items: center;
    justify-content: center;/*center;*/
    flex-direction: column;   
    text-align: center;             
    transition:transform 1s;
    vertical-align:top
}
#canvas svg {width:auto;height:auto}
#canvas .placeholder{
    width:180px;
    height:180px;
    display:block;
    border:3px dashed #e5e5e5;
    margin:30% auto
}     
.options .off .items,.options .on .heading{
    display:none;
    visibility:hidden
}
#dialog{
    width:100%;
    height:100%; 
    margin-top:-20px;
    background-color:rgba(255,255,255,.8);
    position:fixed;
    left:0;
    z-index:1
}
.options{
    float:right;
    position:relative;
    width:362px;
    margin:0;
    padding:40px 0 150px 30px;
    z-index:1;
}
.options h1,.options h3{
    padding:0;
}
.options.hide-s {background:#fff}
.options h1{
    font-size:36px;
    margin:2px 0 16px;
    line-height:36px;
}
.options h3{
    font-size:1em;
    font-weight:400;
    letter-spacing:3px;
    text-transform:uppercase;
    margin:0;
    font-family:Raleway,Helvetica Neue,Helvetica,Arial,sans-serif;
}
.options h3#head-price{
    margin-bottom:20px
}
.options h5{
    font-size:13px;
    font-weight:400;
    letter-spacing:3px;
    text-transform:uppercase;
    margin:24px 0
}
.options h5 a{
    text-decoration:none;
    font-size:18px;
    padding:3px 4px 0 7px;
    border:1px solid #fff
}
.options h5 a:hover{
    color:#2e2e2e;
    border:1px solid #e5e5e5
}
.options .on{
    border-top:3px solid #e5e5e5;
    border-bottom:3px solid #e5e5e5;
    padding:0 0 0 2px;
    margin-top:-1px
}
.options .labels{
    float:left;
    padding:6px 0;
    width:33.333%;
    margin:0 -1px 24px 0
}
.options .labels a{
    display:block;
    font-weight:400;
    letter-spacing:1px;
    padding:6px 5px 6px 6px;
    text-decoration:none;
    margin-right:10px
}
.options .labels a.in {font-weight:500}
.options .labels a:hover{
    background:#fbfbfb!important;
    padding-left:8px
}
.options .labels a:hover .bullet{
    color:#2e2e2e
}
.options .labels .bullet{
    padding:0;
    font-size:24px
}
.options .labels .selected{
    background:#fff!important;
    color:#2e2e2e;
    border:1px solid #e5e5e5;
    padding:5px 4px 5px 7px
}
.options .labels .selected .bullet{
    color:#2e2e2e
}
.options .tags ul{
    width:66.666%;
    margin:3px 0 24px
}
.options .tags li a{
    font-size:11px;
    letter-spacing:2px;
    padding:11px 0 8px;
    text-transform:uppercase
}
.options .control{
    margin-bottom:8px;
    clear:both;
    background:#fff;
    padding:6px 0;
    position:sticky;
    bottom:88px
}
.options .control a{
    font-size:12px;
    font-weight:400;
    letter-spacing:1.5px;
    text-decoration:none;
    text-transform:uppercase;
    border:1px solid #fff;
    padding:7px 6px 6px 7px
}
.options .control .bullet{
    padding:0 3px
}
.options .control a:hover{
    border:1px solid #e5e5e5
}
.options .control a:hover .bullet{
    color:#2e2e2e;
    text-decoration:none
}     
.options  .button.secondary{
    width:100%;
    padding:7px 0 6px;
}
.actions .options{
    padding:0;
    min-height:unset!important
}
.actions .button.primary{
    max-width:216px;
    padding:12px 22px 10px;
    margin-left:6px;
} 
.actions .button.primary:first-child{
    margin-left:0; 
}
.actions .button.primary.action{ 
    width:unset;
    padding:12px 11px 16px;
    margin-top:6px
}
.actions .button.primary#share{ 
    padding:10px 11px 8px 7px
}
.actions .button.primary#share svg{ 
    margin:0 2px
}
.addToBasket .button.secondary{ 
    width:unset
}
.startTip{
    border:1px solid #c2c2c2;
    padding:20px;
    width:460px;
    max-width:80%;
    position:absolute;
    margin:auto;
    left:0;
    right:0;
    bottom:95px;
    background:#ffffffe5;
    background:#ffffff;
}
.startTip:after{
    display:block;
    position:absolute;
    border-left:1px solid #c2c2c2;
    left:50%;
    height:50px;
    bottom:-50px
}
.startTip p{
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:3px;
    margin:0;
    line-height:36px
}
.hidden,.invisible{
    visibility:hidden
}
.ir{
    background-color:transparent
}
.ir:before{
    display:block;
    width:0;
    height:150%
}
.hidden{
    display:none!important
}
.visuallyhidden{
    clip:rect(0 0 0 0);
    height:1px;
    margin:-1px;
    padding:0;
    position:absolute;
    width:1px
}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{
    clip:auto;
    height:auto;
    margin:0;
    overflow:visible;
    position:static;
    width:auto
}
.clearfix:after,.clearfix:before{
    content:" ";
    display:table
}
.show-s,.show-s-i{
    display:none!important
}
@media only screen and (max-width:1380px){
    .content{
        max-width:96%;
        margin:auto;
        position:relative
    }
    .content.top{
        margin:66px auto 0
    }                  
    .hero .hero-box {
        width: 530px;
        padding:17px 20px 13px;
        bottom:30px
    } 
    .hero .hero-box h1{
        font-size: 50px;
        line-height: 60px;
        margin: 3px 0 0;
    }
    .hero .hero-box h2,.hero .hero-box h3{
        font-size: 13px;
    }
    .big-1 .box {
        padding:25px 30px 10px;
        top:22px;
        left:22px;
        width:28%;
    }   
    .big-1.instant-preview .box {
        width:31%;
    }   
    .big-1 .box.right {  
        bottom:22px;
        right:22px;
        padding: 22px 10px 2px 22px;
        width: 20%;
    }        
    .big-1 .box p{
        line-height: 28px;
    }
    .big-2 .flexmiddle {
        padding: 50px 50px 30px;
    }
    .options{
        padding-top:20px
    }
}
.show-s{
    display:none
}
@media only screen and (max-width:1080px){        
    .hide-1{
        display:none!important
    }  
    .nav li a{
        padding:16px 8px 5px;
    }
    .cart table td:nth-child(4),.cart table th:nth-child(4){
        display:none
    }                         
    .hero .hero-box {
        bottom:-42px;
        background:#fff
    } 
    .hero+.content {
        margin-top:50px
    }
    .ace-box {
        max-width:360px;
        width:70%;
        bottom:32px;
        padding:14px 14px 22px
    }
    .ace-box h1{
        font-size:30px;
        line-height:32px
    }            
    .usp-box {
        padding:0 5px
    }           
    .usp-text {
        text-align: center;
        width:100% 
    }
    .usp-text h4{  
       font-size:11px
    }
    .usp-text p{  
        line-height: 21px;
    }
    .usp .icon {
        height: 32px;
        width: 32px;
        display:block;
        margin:0 auto 5px
    } 
    .big-1 .img {
        min-height: 440px;
        overflow: hidden;
    }     
    .big-1 .img img {
        width:initial;
        object-position:-150px 0
    }             
    .big-1.instant-preview .img  {
        min-height:unset
    }            
    .big-1.instant-preview .img img {
        height: 420px;    
        object-position:-40px 0
    }      
    .showcase img{         
        height:unset;
        width:100%
    }
    .showcase .wall {
        width:150%;
        padding:0 10px;
        height:unset;
        margin:0
    }   
    .showcase .item-example {
        height:unset
    }  
    .showcase .item-example:nth-child(n+7) {
        display:none
    } 
    .flexmiddle h3{
        line-height: 30px;
        border-bottom: 2px solid #2e2e2e;
        padding-bottom: 16px;
        margin-bottom: 15px;
        font-size: 26px;
        width:100%
    }            
    .big-2 .flexmiddle p{
        margin:4px 0;
    }  
    .item-single{
        width:90%
    }
    .item-image-holder,.item-thumbs{
        float:none;
        width:calc(100% - 20px);
        margin-bottom:10px
    }
    .item-thumbs a{
        margin:5px
    }
    .product-grid{
        margin:0 2% 40px 0;
        width:32%;
    }    
    .product-list a:nth-child(4n) .product-grid{
        margin:0 2% 40px 0;
    }  
    .product-list a:nth-child(3n) .product-grid{
        margin-right:0
    }   
    .product-list.row a:nth-child(4){
        display:none
    }          
    .item-info-box.one{
        width:90%
    }
    .item-info-box.twoA,.item-info-box.twoB{
        width:96%
    }
    .item-info-box.four{
        width:42%
    }
    .item-info-box table{
        margin:20px auto 32px;
        text-align:left
    }  
    .item-example-box {
        justify-content:flex-start
    } 
    #info-reviews .item-info-box.three {
        width: 96%;
        margin: 0 2% 10px;
    }
    .item-example{
        width:25%
    }
    .cart .details{
        width:calc(100% - 380px)
    }
    .cart .notes{
        margin-left:12px
    }
    .cart td{
        padding:7px 0
    }
    .cart .thumb{
        width:100px
    }
    .cart .thumb img{
        max-width:100px;
        max-height:100px
    }   
    .cart .thumb img.sq{
        max-width:90px;
        max-height:90px
    }       
    .cart .desc{
        width:calc(100% - 130px)
    }
    .cart .sidenote{
        width:320px
    }
    .cart .sidenote .button{
        width:264px
    }
    .sidenote.secure .trustMark{
        width:60px
    }
    .footer .content {
        width:96%
    }
    .footer ul {
        width:23%
    }
} 
@media only screen and (max-width:980px){
     .nav .dropnav {
        overflow-y:scroll;
        max-height:300px
    }
    .nav .dropnav ul {
        max-width: 100%;
        display:block
    }
    .nav .dropnav ul li{
        width: 24%;
    }  
    .nav .dropnav #searchArea ul li{
        width: 100%;
    }  
    .nav .dropnav ul li.group{
        width: 100%;
    }
     .nav .dropnav ul.double {
        max-width: 100%;
    }
    .nav .dropnav ul.double li{
        width: 24%;
    }   
    .nav .dropnav .imagelink{
        display:none;
     }       
    .big-2 .flexmiddle {
        padding: 30px 30px 20px;
    }
    .dialog.share {
        width:680px;
    }
    .dialog .shareImage {
        max-width:180px;
        max-height:240px;
    }
    .dialog .shareBox {
        width: calc(100% - 215px);
    }
    .footer ul {
        width:23%;
        margin: 36px 6% 12px;
        min-width:0;
    }  
    .footer ul.newsletter {
        width:60%;
        margin: 16px 20% 12px;
        text-align:center
    }
}
@media only screen and (max-width:900px){  
    .usp-box2 .usp-text h4{ font-size:16px}                                         
    .ace-5.top-2 {
        width:48%
    }   
    .ace-5 {
        width:31%
    }   
    .big-1 .box {
        padding:20px 25px 5px
    }    
    .big-1 .box h3 {
        padding-bottom: 10px;
        margin-bottom: 15px;
        font-size: 26px;
    }               
    .big-2 {
        display: block;
    }
    .big-2 img {
        width:100%;
        height:100%
    }     
    .flexcopy {
        width: 100%
    }
    .big-2 .flexmiddle :nth-child(3){
        display:none
    }               
    .showcase .item-example img{
        max-width: 105px;
        max-height: 130px;
    }
    .showcase .item-example img:hover{
        max-width: 115px;
        max-height: 135px; 
    } 
    .item-info-box.two{
        width:96%
    }
    .item-info-box.two:first-child{
        margin-bottom:30px
    }
    .item-display .item-info-box.two{
        width:46%
    }
    .item-display.front{
        margin:0 10px 50px;
        text-align:center
    }
    .item-display.front .item-info-box.text{
        position:relative;
        margin:40px auto 0;
        top:initial;
        width:unset;
        max-width:600px;
        -ms-transform:none;
        -webkit-transform:none;
        transform:none
    }
    .item-display.front img{
        width:calc(100% - 22px);
        margin:0 auto
    }
    .item-info-box.three{
        width:42%
    }
    .cart .details{
        width:calc(100% - 340px)
    }
    .cart .thumb img{
        max-width:90px;
        max-height:90px
    }     
    .cart .thumb img.sq{
        max-width:82px;
        max-height:82px
    }
    .cart .sidenote{
        width:280px
    }
    .cart .sidenote .button{
        width:224px
    }
    .sidenote.secure .trustMark{
        width:50px
    }
    .footerEnd{
        text-align:center
    }
    .footerEnd .right{
        display:none
    }
}
@media only screen and (max-width:800px){    
    .nav .catnav{
        text-align:left;    
        width: 100%;      
        padding-bottom:6px;
        margin-top:3px
    }
    .nav .catnav li{
        display:block
    }    
    .nav .catnav li a{
        border-bottom:none;
        padding: 6px 30px
    }
    .nav .catnav li a:hover{
        border-bottom:none;
        text-decoration:underline
    }    
    .nav li:hover .dropnav{
        display:none
    }   
    .nav .dropnav.small-menu{
        display:block!important
    }  
    .nav .dropnav .small-menu-back{
        padding:0 10px;
        width:auto;
        float:right
    }  
    .nav .dropnav{
        width:93%;
        padding-bottom:8px;
        top:0
    }  
    .nav .dropnav.searchOn{
        top:47px
    }  
    .nav .dropnav li{
        display:inline-block
    }
    .nav .dropnav li a:hover{
        text-decoration:none
    }
    .brand-min{display:none}  
    .searchForm {width:unset}                           
    .hero .hero-box {
        bottom: unset;
        position: relative;
        width:unset;
        padding:10px 0
    }                    
    .hero .hero-box h1{
        font-size: 40px;
        line-height: 44px;
    } 
    .hero+.content {
        margin-top:-30px
    }
    .big-1 .img {
        min-height:unset;
        object-position:unset
    }    
    .big-1 .img img {
        width:100%;
        height:100%!important;
        object-position:unset
    }      
    .big-1.instant-preview .img img {
        width:140%;
        object-position:-212px 0
    }   
    .big-1 .box {
        position: relative;
        padding: 15px 10px 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto!important;
    }   
    .big-1 .box.right {  
        float: none;
        bottom: 0;
        left: 0;
        top: 0;
        right: 0;
        padding:12px 10px 12px 22px
    }
    .big-1 .box.right img{  
        width:60%;
        height:60%
    }
    .big-1 .box.right p{  
        width:35%;
        display:inline-block
    }     
    .ace-3 {
        width: 98%;
    }
    .ace-3 img{
        max-width:600px
    }
    .ace-3 .title{
        position: absolute;
        background: #fff;
        bottom: 1px;
        left: 0;
        right: 0;
        width: 50%;
        margin: 0 auto;
        padding: 10px 20px 16px;
    }
    .ace-3 .title h3{
        padding-top:14px
    }
    .ace-3 .title p{
        text-transform: uppercase;
        letter-spacing: 3px;
        font-size: 11px;
    }
    .showcase .wall {
        width:200%
    }   
    .showcase .item-example {
        width:26%
    }  
    .product-grid{
        width:49%;
    }     
    .product-list a:nth-child(3n) .product-grid{
        margin:0 2% 40px 0;
    } 
    .product-list a:nth-child(2n) .product-grid{
        margin-right:0  
    }      
    .product-list.row a:nth-child(4){
        display:unset
    }  
    .item-example{
        width:33%
    }
    .cart h3,.item-display:nth-child(even),.options{
        text-align:center
    }
    .nav{
        position:fixed;
        top:0
    }
    #canvas,.item-display .item-info-box{
        position:relative
    }
    .nav+.content{
        margin-top:66px
    }
    .nav+.category-header{
        margin-top:54px
    }
    .drop-cart{
        margin-top:0!important
    }
    .brand svg{
        width:140px;
        height:36px;
        margin:8px 0 -6px
    }
    .hide-s{
        display:none!important
    }
    .show-s{
        display:block!important
    }
    .show-s-i{
        display:inline-block!important
    }
    #rowOverlay{margin-top:100px}
    .nav .topnav.show-s li:hover a{
        border:1px solid #2e2e2e;
        text-decoration:none;
        background:#2e2e2e;
        color:#fff
    }
    .nav .topnav.show-s li:hover svg{
        fill:#fff
    }
    .cart .details,.cart .notes{
        display:block;
        width:auto
    }
    .lead{
        width:44%;
        padding:0 3%
    }
    .item-info-tab+.item-info-area+hr{
        border-top:1px solid #e5e5e5;
        margin-top:18px
    }
    .item-display .item-info-box.two{
        width:100%;
        margin:0
    }
    .item-display{
        margin-bottom:30px
    }
    .item-display .item-info-box.text{
        position:relative;
        margin:0;
        top:initial;
        -ms-transform:none;
        -webkit-transform:none;
        transform:none
    }
    #cart-area{
        max-width:580px;
        margin:0 auto
    }
    .cart .details{
        vertical-align:top;
        margin:0
    }
    .cart table{
        margin-top:20px
    }
    .cart h3{
        padding:20px 0 10px
    }
    .cart .sidenote{
        width:auto;
        margin-left:0
    }
    .cart .sidenote:first-child{
        border:none;
        padding:14px 0 0
    }
    .cart .button.primary{
        width:100%;
        box-sizing:border-box
    } 
    .tooltipContent:after{
        left:169px
    } 
    .hero .tooltipContent:after{
        left:47%
    }
    .options{
        padding:10px 0 100px 30px;
        width:100%
    }
    .actions .display{
        display:block;
        width:100%!important
    }
    #canvas{
        width:100%!important
    }
    #controls{
        max-width:520px;
        margin:0 auto;
        text-align:left
    }
    #controls input{
        width:calc(100% - 42px)
    }
    #controls .group.small input{
        width:calc(50% - 44px)
    }         
      #controls  .textops input {
          width:calc(100% - 147px)
      }
    .startTip{
        padding:10px;
        background:#ffffff;
        bottom:62px
    }
    .startTip:after{
        height:20px;
        bottom:-20px
    }
    .startTip p{
        font-size:11px;
        line-height:26px
    }   
    .actions{
        background: #f5f5f5f0;
    }     
    .footerEnd{
        margin-bottom:100px
    }
}
@media only screen and (max-width:720px){  
    .nav .dropnav ul li, .nav .dropnav ul.double li{
        width:32%
    }       
    .usp {
        width:50%;
    }    
    .usp:first-child{
        margin-bottom:10px
    }      
    .usp-box2 .usp-text h4{ margin-bottom:4px}
    .showcaseArea {
        position:relative
    }
    .showcaseArea .title{
        position:absolute;
        z-index:1;
        padding:20px 20px 10px;
        width:60%;
        margin:0 auto;
        left:0;
        right:0;
        background:rgba(255, 255, 255, 0.9);
        bottom:40px
    }
    .showcaseArea .title h2{
       line-height:30px;
       margin: 12px 0;
    }   
    .showcase {
        overflow: hidden;
        max-height: 690px;
    } 
    .showcase img{
        transform: scale(1.6);
        object-position: -20px 81px;
    } 
    .showcase .wall {
        display:none
    }   
    .flexcopy {
        width: 100%;
    }
    .item-image-area{
        float:none;
        padding:0;
        width:100%;
        margin:20px 0 0;
        text-align:center
    }
    .item-image-holder{
        margin-bottom:0
    }
    .item-thumbs a{
        margin:6px
    }
    .item-thumbs img{
        display:none
    }
    .item-thumbs a:after{
        background:#d5d5d5;
        display:inline-block;
        height:8px;
        width:8px;
        content:" ";
        border-radius:4px
    }
    .item-thumbs a.selected:after{
        background:#2e2e2e
    }
    .item-thumbs .selected{
        background:#fff!important
    }
    .item-title{
        padding:10px 0 20px
    }
    .item-info{
        display:none
    }
    .item-info-tab{
        display:block;
        margin-bottom:6px
    }      
    .dialog.share {
        width:85%;
    }   
    .footer ul {
        width:38%
    }      
    .footer ul.follow-us {
        width:96%;
        margin:16px 2% 12px;
        text-align:center;
    }      
    .footer .follow-us li{
        display:inline-block;
        padding:0 6px
    }      
    .footer .follow-us li:first-child{
        display:block;
        padding:0
    } 
    .footer ul.newsletter {
        width:80%;
        margin: 16px 10% 12px
    } 
}
@media only screen and (max-width:600px){   
    .big-1.instant-preview .img img {
        width:150%;
    }    
    #delivery tr td,#delivery tr th{
        padding:21px 6px 18px
    }
    .item-example{
        width:50%
    }
    .item-info-box.one{
        width:98%
    }
    .item-info-box.three{
        width:70%
    }
    .item-info-box.four{
        width:100%;
        margin:20px 0 0
    }   
    .dialog.share {
        top:10px!important;
        text-align:center 
    }  
    .dialog .shareBox {
        display:block;
        margin: 30px 0 0;
        width:unset  
    }        
    .dialog .shareImage {
        max-width:240px;
    }
    #delivery tr th{
        font-size:11px;
        letter-spacing:2px
    }
}
@media only screen and (max-width:480px){     
    .nav .topnav li a{
        padding:13px 10px 9px;
    }                               
    .nav .dropnav ul li, .nav .dropnav ul.double li{
        width:49%
    }  
    .searchForm input {
        width:calc(100% - 20px)
    }     
    .searchForm #searchGo {
        display:none
    }
    #search-bar li.app .product-details {
        max-height:22px;
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
    }    
    .hero .hero-box h1 {
        font-size: 32px;
        line-height: 38px;
    } 
    .usp-box2 .usp-text h4{ font-size:16px}   
    .big-1 {
        margin: 0px 0 50px;
        border:none;
        border-bottom: 1px solid #e5e5e5;
        padding: 0 0 30px;
    }       
    .big-1.instant-preview .img img {
        width:160%;
    }     
    .big-1 .box.right img{  
        width:100%;
        height:100%
    }
    .big-1 .box.right p{  
        width:100%
    }
    .ace-box {
        background:#fff;
        width:76%;
        bottom:1px;
    }
    .ace-box h1{
        font-size:23px;
        line-height:30px
    }
    .ace-3 img{
        width:100%;
        border:none;
        padding:0
    }     
    .ace-3 .title{
        bottom:0;
        width: 60%;
        padding: 0 12px 6px;
    } 
    .ace-5 img {
        width:100%;
        padding:0;
        border:0
    }
    .showcaseArea .title{
        width:80%;
        bottom:-10px;
        background:#fff
    }   
    .showcase img {
        transform: scale(1.9);
        object-position: 8px 87px;
    }   
    .lead{
        width:100%;
        padding:0
    }
    .cart .desc,.cart .thumb{
        width:auto;
        margin:0 auto;
        text-align:center
    }
    .cart th{
        display:none
    }
    .cart .thumb{
        display:block;
        height:unset
    }
    .cart .thumb img{
        max-width:120px;
        max-height:120px
    }   
    .cart .thumb img.sq{
        max-width:106px;
        max-height:106px
    }
    .cart .desc{
        display:block
    }
    .cart .curr-price2{
        padding-right:10px
    }
    #delivery{
        width:100%;
        margin-bottom:10px
    }
    #delivery tr th{
        display:none
    }
    #delivery tr td{
        padding:1px 0;
        display:block;
        border:0
    }
    #delivery tr td:nth-child(5){
        padding-bottom:20px
    }
    #delivery tr td:first-child{
        text-transform:uppercase;
        letter-spacing:3px;
        font-size:13px;
        margin:12px 0 4px
    }
    #delivery tr td:nth-child(4)::before{
        content:"Arrives in "
    } 
    #delivery .note{
        display:unset
    }  
    #delivery .note::before{
        content:" "
    }  
    .footer ul {
        width:80%;
        margin:16px 10% 12px;
        text-align:center
    }     
    .footer .follow-us li{
        display:block
    }       
    .footer ul.newsletter {
        width:96%;
        margin: 16px 2% 12px
    }    
    .footer ul.newsletter p{
        text-align:center
    }   
    .footer .payTitle{
        display:block
    } 
    .hide-m{
        display:none!important
    }
}
@media only screen and (max-width:380px){    
    .nav .topnav li a{
        padding:13px 5px 5px;
    }    
    .nav .dropnav ul li, .nav .dropnav ul.double li{
        width:100%
    }    
    .hide-vs{
        display:none!important
    }      
    .usp-box2 .usp-text h4{ font-size:12px}    
    .big-1.instant-preview .img img {
        object-position:-150px 0
    } 
    .ace-3 .title{
        width:80%;
        padding: 0px 8px 6px;
    }  
    .ace-3 .title h3{
        padding-top: 16px;
    }     
    .showcase{
    padding-bottom:120px
    }      
    .showcase img {
        transform: scale(2.1);
        object-position:5px 74px;
    }  
    .item-example-box {justify-content: space-around;} 
    .item-example{
        width:80%;
        margin-bottom:20px;
        border-bottom:1px solid #e5e5e5;
        padding-bottom:20px
    }
    #controls .group.small input{
        width:calc(100% - 42px)
    }          
    .actions {top:unset}
    .actions .button.primary{
        padding:12px 14px 10px
     }                    
    .actions .button.primary.action{
        padding:12px 9px 16px
    }
}
@media print{
    blockquote,img,pre,tr{
        page-break-inside:avoid
    }
    *{
        background:#fff!important;
        color:#000!important;
        box-shadow:none!important;
        text-shadow:none!important
    }
    a,a:visited{
        text-decoration:underline
    }
    a[href]:after{
        content:" (" attr(href) ")"
    }
    abbr[title]:after{
        content:" (" attr(title) ")"
    }
    .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{
        content:""
    }
    blockquote,pre{
        border:1px solid #999
    }
    thead{
        display:table-header-group
    }
    img{
        max-width:100%!important
    }
    @page{
        margin:.5cm
    }
    h2,h3,p{
        orphans:3;
        widows:3
    }
    h2,h3{
        page-break-after:avoid
    }
}
.touch .tooltip,.touch .tooltipContent,.touch .tooltipContent:after,.touch a:hover .tooltip{
    display:none
}