html {
    color:#000;
    font-family: "Neutraface", sans-serif;
    font-size:16px;
    font-weight:400;
    line-height:32px
}
body{margin:0}
.under {overflow:hidden}

@font-face{
    font-family:'Neutraface';
    font-style:normal;
    font-weight:400;
    src:url(/assets/fonts/Neutraface2-Book.woff2) format("woff2"),url(/assets/fonts/Neutraface2-Book.woff) format("woff"),url(/assets/fonts/Neutraface2-Book.ttf) format("truetype")
}
@font-face{
    font-family:'Neutraface';
    font-style:normal;
    font-weight:500;
    src:url(/assets/fonts/Neutraface2-Demi.woff2) format("woff2"),url(/assets/fonts/Neutraface2-Demi.woff) format("woff"),url(/assets/fonts/Neutraface2-Demi.ttf) format("truetype")
}

@font-face{
    font-family:'DomaineDisplay';
    font-style:normal;
    font-weight:400;
    src:url(/assets/fonts/DomaineDisplay-Regular.svg) format("svg"),url(/assets/fonts/DomaineDisplay-Regular.woff) format("woff"),url(/assets/fonts/DomaineDisplay-Regular.ttf) format("truetype")
}


.l {position:absolute!important;left:0}
.r {position:absolute!important;right:0}
.s {position:absolute;bottom:5px}
.c {text-align:center}

h1 {
    font-size:28px;
    margin:6px 0;
    font-weight:500;
    line-height:38px;
    margin:6px 0 2px
}
.page-title h1{margin:16px 10px 2px}
h2 {
    font-weight:400;
    font-size:18px
}
h3 {
    font-weight:500;
    font-size:16px
}
ul,ol {padding:0;margin:0;list-style:none}
a {
    color:#000;
    text-decoration:none
}
a:hover{
    text-decoration:underline
}
input, textarea {
    padding: 0 12px;
    margin: 0;
    font-size: 16px;
    border: 2px solid #444;
    line-height: 44px;
    font-family: "Neutraface", sans-serif;
}
input:focus, .input:focus, select:focus{border-color:#000}
.button-function:focus,.options a,a{
    outline:0
}

.checkmark:after,.radiobutton:after,.tooltipContent:after{
    content:""
}
.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:5px;
    left:0;
    height:22px;
    width:22px;
    background-color:#fff;
    border: 1px solid #d5d5d5;
}
.checkbox:hover input~.checkmark{
    border-color:#808080
}
.checkmark:after{
    position:absolute;
    display:none
}
.checkbox input:checked~.checkmark:after,.radiobox{
   display:block
}
.checkmark:after{
    left:7px;
    top:2px;
    width:6px;
    height:14px;
    border:solid #000;
    border-width:0 2px 2px 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
}
.form label.radiobox{
    margin:0 0 6px;
}
.radiobutton{
    position:absolute;
    top:3px;
    left:0;
    height:22px;
    width:22px;
    background-color:#fff;
    border:1px solid #d5d5d5;
    border-radius:50%
}
.radiobox:hover input~.radiobutton{
    background-color:#F9F6F3;
    border-color:#c5c5c5
}
.radiobox input:checked~.radiobutton{
}
.radiobutton:after{
    position:absolute;
    display:none
}
.radiobox input:checked~.radiobutton:after{
    display:block
}
.radiobox .radiobutton:after{
    top:4px;
    left:4px;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#000
}
.radiobox .note {
    display: block;
    color: #808080;
    line-height: 22px;
}

table {
    width:100%;
    line-height:44px;
    text-align:center;
    border: 1px solid #e5e5e5;
    padding: 10px;
}
th {
    font-weight:400;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 8px;
}
tr:nth-child(2) td {
    padding-top:8px;
    min-width:64px
}
.tholder {
    overflow-x:auto
}
hr {
    border:0;
    border-top: 1px solid #e5e5e5;
    padding-top: 18px;
    margin-top: 22px;
}


.content {
    width:calc(100% - 20px);
    max-width:1580px;
    margin:0 auto;
    position:relative
}














.nav {
    width:100%;
    height:60px;
    text-align:center;
    border-bottom:1px solid #e5e5e5;
    background:#fff;
    z-index: 10;
    position: fixed;
    top:0;
    overflow:hidden
}

.nav .content {
    max-width:1720px
}

.nav .brand {
    width:160px;
    padding: 10px 9px 0;
    margin:0;
    position:absolute
}

.nav ul {
    margin:0 auto
}
.nav ul li {
    display:inline-block;
    position:relative
}

.nav ul a {
    text-transform:uppercase;
    font-weight:500;
    padding:15px 30px 12px;
    display:block
}

.nav .menu ul a {
    text-transform:none;
    font-weight:400;
    padding:15px 10px 12px
}
.nav .menu.r {
    margin-right:15px
}
.menuitem:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	z-index: 27;
	width: 100%;
	height: 2px;
	background-color: #1f1f1f;
	opacity: 0;
	-webkit-transition: all .5s ease;
	-webkit-transition-delay: 0s;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}
.menuitem:hover {
	text-decoration:none
}
.menuitem > a:hover {
	text-decoration:none
}
.menuitem:hover:after {
	opacity:1
}
.menuitem #cartnum {
    color:#000;
    font-size: 13px;
    font-weight: 500;
    line-height: 13px;
    width: 31px;
    position: absolute;
    top: 27px;
    left: 8px;
    text-align:center
}







.dropnav{
    z-index:5;
    visibility:hidden;
    position:fixed;
    border:1px solid #e5e5e5;
    padding:8px 10px 10px;
    background:#fff;
    left:0;
    width:100%;
    line-height:40px
}
.nav .dropnav ul {
    position: unset !important;
    margin: 0;
    padding: 10px 0;
    border: none !important;
    max-width: 160px;
    display: inline-block;
    vertical-align: top;
    text-align:left
}
.nav .dropnav ul.double {
    max-width: 324px;
}
.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%;
    margin: 0;
    padding: 0;
}
.nav .dropnav ul li a{
    padding: 0;
    text-transform: capitalize;
    line-height: 24px;
    font-weight:400;
    display:inline-block
}
.nav .dropnav ul li a:hover{
    border-bottom:2px solid #ff2556;
    text-decoration:none
}
.nav .dropnav ul li.group{
    text-transform: uppercase;
    font-weight:500
}
.nav .dropnav .imagelink{
    line-height: unset;
    display: inline-block;
    position: relative;
    margin: 10px;
    width: 400px;
    padding: 0;
    font-weight: 400;
}
.nav .dropnav .imagebox{
    position: absolute;
    max-width: 86%;
    width: 86%;
    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-weight:500;
    text-transform:uppercase
}
.nav .dropnav .imageboxlink{
    font-weight:400;
    text-transform:capitalize
}
.nav .dropnav .imagemain{
    display: inline-block;
    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{
}
.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: 200px;
    padding: 0;
    border: 0;
    text-align:center
}
.nav .dropnav .lead .imageboxlink{
    text-transform:capitalize
}
.nav .dropnav .lead .imageboxheader{
}
.nav .dropnav .lead .imagebox{
    position: relative;
    padding:0;
    bottom:0;
    line-height:12px
}












.drawer {
    background:#0000;
    z-index: 99;
    position: fixed;
    width: 200%;
    height: 100%;
    text-align: left;
    overflow-y:scroll;
    overflow-x:hidden;
    transform: none;
    visibility:hidden;
    transition:all .15s ease-in;
}
.drawer .menuitem {
    display: block;
    position: relative;
    width: 45%;
    background:#fff;
    border-top: 1px solid #e5e5e5
}
.drawer .menuitem .dropnav{
    border-top: 2px solid #000;
    width:unset
}
.drawer .menuitem .dropnav ul{
    padding-left:40px;
    max-width:200px
}






.carousel {display:inline;margin:0;padding:0}
.carousel .slides {
    display: flex;
    width: 100%;
}
.section .carousel .slides {
    width: calc(100% - 60px);
    margin: 0 30px;
}
.carousel li {flex-grow:0;flex-shrink:0}

.carousel .button{
    height:12px;
    width:12px;
    display:inline-block;
    padding:0;
    margin:4px;
    border:1px solid #222
}
.carousel .button.arrow{
    position: absolute;
    width: 50px;
    background:#fff0;
    height: 100px;
    top: -12px;
    align-items: center;
    border:none;
    display:none
}
.section .carousel .button.arrow{display:flex}
.carousel .button.arrow:hover{
    fill:#40403a;
    color:#40403a;
}
.carousel .button.arrow svg{
    height:2.6em;
    width:2.6em
}
.carousel .button.left{
    left:-8px
}
.carousel .button.right{
    right:-8px
}
.carousel .button.left svg{
    transform: rotate(90deg);
}
.carousel .button.right svg{
    transform: rotate(-90deg);
}
.carousel .tabs{
    right:0;
    left:0;
    text-align:center;
    width:200px;
    margin: -30px auto 4px;
    display:none;
}
.carousel .tabs .button{
    position:relative;
}
.carousel .tabs .button.selected{
    background:#000
}














.o3 {display:none}




.main {margin-top:60px}

.icon{
    height:1.2em;
    vertical-align:-.2em;
    width:1.2em
}
.iconMaxi{
    height:1.7em;
    vertical-align:-.52em;
    width:1.72em;
    margin-right:.2em
}
.iconMini{
    height:.8em;
    vertical-align:-.15em;
    width:1em;
    margin-left:.1em
}




.l.menu.o3 a{padding:23px 12px 7px;}
#nav-icon {
  width: 26px;
  height: 30px;
  position: relative;
  margin: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #000;
  border-radius: 0px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}


#nav-icon span:nth-child(1) {
  top: 0px;
}

#nav-icon span:nth-child(2) {
  top: 8px;
}
#nav-icon span:nth-child(3) {
  top: 8px;
}

#nav-icon span:nth-child(4) {
  top: 16px;
}

#nav-icon.open span:nth-child(1) {
  top: 8px;
  width: 0%;
  left: 50%;
}

#nav-icon.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 8px;
}

#nav-icon.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 8px;
}

#nav-icon.open span:nth-child(4) {
  top: 8px;
  width: 0%;
  left: 50%;
}












.banner {
    background:#f0f0f0;
    line-height:36px;
    text-align:center;
    position: relative;
}
.banner .message {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    -webkit-transition:opacity .4s ease-in;
    -moz-transition:opacity .4s ease-in;
    -o-transition:opacity .4s ease-in;
    transition:opacity .4s ease-in;
    pointer-events:none
}
.banner .message:first-child {
    position: relative;
    opacity:1;
    pointer-events:all
}
.banner .message svg{
    width:16px;
    height:16px;
    vertical-align: sub;
}
.banner .message a{
    text-decoration:underline
}


.breadcrumbs {
    font-size:14px;
    line-height:36px;
    font-weight:500
}
.breadcrumbs li {display:inline-block;color:#333;}
.breadcrumbs li a{
    color:#999;
    font-weight:400
}
.breadcrumbs li:after{
    content:"/";
    padding:10px;
    color:#999;
    font-weight:400
}
.breadcrumbs li:last-child:after{
    content:none
}

.button {
    width:100%;
    line-height: 50px;
    display: block;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 0.5px;
    max-width:580px;
    margin:0 auto
}
.button:hover {
    text-decoration:none
}

.button.cta {
    background:#000;
    color:#fff;
    fill:#fff;
    font-size: 18px;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
.button.cta:hover {
    background:#1f1e1e;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
.button.cta svg{
    vertical-align:middle;
    margin:-2px 0 0 4px;
    height:17px;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.button.loading{
    background:#444!important;
    color:#444!important;
    position:relative;
    pointer-events:none
}

tr.loading:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - 12px);
  left: calc(50% - 12px);
  width: 24px;
  height: 24px;
  margin:0;
  padding:0;
  border-radius: 50%;
  border: 2px solid #bbb;
  border-top-color: #444;
  animation: spinner 1.1s linear infinite;
}
tr.loading {
  opacity:.6;
  position:relative
}
tr.loading td.item{display:block}

.button.loading:before {
  top: calc(50% - 9px);
  left: calc(50% - 9px);
  width: 18px;
  height: 18px;
  border: 2px solid #fff;
  border-top-color: #444;
}



@keyframes spinner {
  to {transform: rotate(360deg);}
}

.button.loading:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - 9px);
  left: calc(50% - 9px);
  width: 18px;
  height: 18px;
  margin:0;
  padding:0;
  border-radius: 50%;
  border: 2px solid #fff;
  border-top-color: #444;
  animation: spinner 1.1s linear infinite;
}



.button.paypal {
    background:#fff;
    color:#000;
    border: 1px solid #e5e5e5;
    line-height: 46px;
    font-weight: 400;
    font-size: 16px;
    text-transform: none;
    letter-spacing: 0;
    margin-top: -3px!important;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.button.paypal:hover {
    background:#ffc439;
    border-color:#ffc439;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.button.paypal svg{
    vertical-align:middle;
    margin:-2px 0 0 6px
}
.button.paypal.loading {
    background:#f4c657!important;
    color:#f4c657!important
}
.button.paypal.loading svg{
    display:none
}
.button.paypal.loading:before {
    border-top-color: #f4c657;
}
.or {
    text-align: center;
    margin-top: -5px;
}



.infoPanel {
    border-bottom:1px solid #e5e5e5;
    padding:10px;
    position:relative
}
.infoPanel:first-child{
    border-top:1px solid #e5e5e5;
    margin-top:26px
}
.infoPanel .droparrow{
    display:block
}
.infoPanel .droparrow:hover{
    text-decoration:none
}
.infoPanel .droparrow svg{
    float:right;
    margin-top:11px;
    transform: rotate(180deg);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    -ms-transition: -ms-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}
.infoPanel.closed .droparrow svg{
    transform: rotate(0deg);
}
.infoPanel .inner{
    max-height:550px;
    overflow:hidden;
    -webkit-transition:max-height .3s ease-in-out;
    -moz-transition:max-height .3s ease-in-out;
    -o-transition:max-height .3s ease-in-out;
    transition:max-height .3s ease-in-out;
}
.infoPanel.closed .inner, .infoPanel.size.closed .inner{
    max-height:0
}
.infoPanel.size .inner{
    max-height:700px;
}
.infoPanel h2{
    margin:0;
}
.infoPanel h2 a{
    padding:10px 0
}
.sharePanel {
    margin:26px 0 0
}
.sharePanel ul{
    display:inline-block;
    margin-left:10px
}
.sharePanel li{
    font-size:15px;
    margin:0 2px;
    display: inline-block;
}

.sharePanel li svg{
    width: 32px;
    height: 32px;
    vertical-align: -17px;
    padding: 0;
}
.sharePanel li a{
    padding: 6px 0 4px 8px;
    margin: 0 0 0 -7px;
	-webkit-transition: fill .5s ease;
	-webkit-transition-delay: 0s;
	-moz-transition: fill .5s ease;
	-o-transition: fill .5s ease;
	transition: fill .5s ease;
}
.facebook:hover{
    color:#3b5998;
    fill:#3b5998
}
.twitter:hover{
    color:#00aced;
    fill:#00aced
}
.instagram:hover{
    color:#d93175;
    fill:#d93175
}
.pinterest:hover{
    color:#BD081C;
    fill:#BD081C
}


.section {
    text-align:center;
    position:relative;
    width:84%;
    margin:0 auto;
    padding:30px 0 50px;
    overflow:hidden
}
.section h1{
    font-family:DomaineDisplay;
    font-size:60px;
    line-height:60px;
    margin:0;
    font-weight:500
}
.section h2{
    font-family:DomaineDisplay;
    font-size:40px;
    line-height:40px;
    margin:0;
    font-weight:500
}
.section h3{
    font-family:DomaineDisplay;
    font-size:32px;
    line-height:32px;
    margin:0 0 28px
}
.section .button {
    background: #000;
    color: #fff;
    width: auto;
    display: inline-block;
    padding: 0 20px;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
.section .button:hover {
    background:#1f1e1e;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
.section img.one{
    width:100%;
    object-fit: cover;
}
.section img.two{
    width:50%;
    object-fit: cover;
}
.section .pair{
   font-size:0
}
.section.lead {
    width:100%
}
.section.lead img.one{
    height: 540px;
}
.section.hero {
    padding:0
}
.section.tabs{
    padding:10px 0 20px
}
.section.tabs li{
    display:inline-block;
    font-weight:500
}
.section.about{
    padding:30px 0 0
}
.section.about h3{
    margin:0
}
.section.about p{
    text-align:left;
    font-size:18px;
    margin:15px 0 0
}
.section.about a{
    text-decoration:underline
}

.categories {
    padding:0;
}
.categories li {
    width:18%;
    padding:0 1%;
    display:inline-block
}
.categories img {
    width: 100%;
    object-fit: cover;
}
.section .cta {
    border-bottom: 1px solid #222;
    display: inline-block;
    line-height:26px;
    margin:0 9px
}
.section a:hover .cta {
    border-bottom: 2px solid #ff2556;
}
.section a:hover img{
}
.section .cta:hover {
    border-bottom: 2px solid #ff2556;
    text-decoration:none
}
.section .cta2 .cta {
    border:1px solid;
    padding:6px 24px;
	-webkit-transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;
	-o-transition: background-color .5s ease;
	transition: background-color .5s ease;
}
.section .cta2 .cta:hover {
    background:#fff6;
	-webkit-transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;
	-o-transition: background-color .5s ease;
	transition: background-color .5s ease;
}

.textbox{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, calc(-50% - 18px))
}
.textbox.primary{
    top: 74px;
    left: 60px;
    width:400px;
    transform:none;
    text-align:left
}
.textbox.second{
    left: 75%;
}
.textbox.eighty.box{
    left: 81%;
    width:calc(27% - 32px)
}
.textbox.box{
    background:#fff;
    padding:36px 32px 30px;
    width:calc(37% - 32px)
}
.textbox.light{
    color:#fff;
}
.textbox.light .cta{
    color:#fff;
    border-color:#fff;
    margin-top:24px
}
.textbox.light .cta:first-of-type{
    margin-top:0
}

.textcard {
    display: inline-block;
    margin: 0 15px;
    vertical-align:top
}
.textcard.two {
    width:39%
}
.textcard.three {
    width:calc(33.3% - 30px)
}
.textcard h3{
    font-size:28px;
    line-height:28px;
    margin:14px 0
}

.textbox.giftfinder .filter {
    width:calc(100% - 32px);
    border-top:0;
    border-bottom:1px solid #e5e5e5;
    margin:0
}
.textbox.giftfinder .filter:first-of-type {
    border-top:1px solid #e5e5e5
}
.textbox.giftfinder .label {
    display:block;
    line-height:50px
}
.textbox.giftfinder .label:hover {
    text-decoration:none
}

.textbox.giftfinder .drop {
    width:100%!important;
    top:50px
}

.textbox.giftfinder h4 {
    font-size: 24px;
    font-weight: 500;
    margin: 0 0 24px;
    font-family: DomaineDisplay;
}
.textbox.giftfinder .cta {
    margin-top:20px
}
.textbox.giftfinder .options h3{
    margin: 16px 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}






.options .modal {
    visibility:hidden;
    position: fixed;
    top: 0;
    background: #fff;
    width: 400px;
    z-index: 900;
    height:100%;
    right: 0;
    padding:20px;
    width: 44%;
    max-width:600px;
    transition:all .15s ease-in;
    transform: translateX(100%)
}
.options .modal.open {
    visibility:visible;
    transition:all .15s ease-in;
    transform: translateX(0%)
}
.overlay {
    position:fixed;
     top:0px;
     left:0px;
     width:100%;
     height:100%;
     background:rgba(0,0,0,0.5);
}







.header {
    text-align:center;
    margin:0 0 28px
}
.header h1{
    font-family:DomaineDisplay;
    font-size:44px;
    line-height:44px;
    margin:0;
    letter-spacing:2px
}
.header .infoPanel {
    border:0;
    padding:0
}
.header .infoPanel:first-child{
    border:0;
    margin:0
}
.header .infoPanel .droparrow svg{
    float:none;
}
.header .infoPanel p{
    width:70%;
    margin:8px auto 0
}
.header .options {margin-top:20px}

.filters {
    /*background:#eee;
    padding: 10px 0;*/
    margin-bottom: 30px;
    border-top:1px solid #e5e5e5;
    border-bottom:1px solid #e5e5e5;
}
.filters a {
    padding: 4px 9px 1px;
    display: inline-block;
}
.filters a:hover {
    text-decoration:none;
}
.filters .off {
    color:#bbb;
    pointer-events:none
}
.filters #clearFilters:hover {text-decoration:underline}
.filters #closeFilters:hover {text-decoration:underline}
.filters #closeFilters{display:none}
.filters .off a{
    color:#ccc;
}
.filter {
    display:inline-block;
    padding:0;
    margin:9px 5px;
    border:1px solid #fff;
    position:relative;
    -webkit-transition: border-color .3s ease-in-out;
    -ms-transition: border-color .3s ease-in-out;
    transition: border-color .3s ease-in-out;
}
.filter:hover {
    border-color:#f2f2f2
}
.filter.on .label {
    font-weight:500
}
.filter .label svg {
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    -ms-transition: -ms-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}
.filter.open .label svg {
    transform: rotate(180deg)
}
.filter.open {
    border:1px solid #e5e5e5;
}
.filter.open:after {
    content:"";
    display:block;
    background:#fff;
    width:100%;
    height:3px;
    position: absolute;
    left: 0;
    bottom: -1px;
    z-index: 3;
}
.filter .drop {
    border:1px solid #e5e5e5;
    background:#fff;
    z-index:2;
    position:absolute;
    left:-1px;
    top:37px;
    width:220px;
    padding:5px 0 6px;
    text-align:left;
    display:none
}
.filter.open .drop {
    display:block
}
.filter .drop a{
    padding: 0 20px;
    display:block;
    -webkit-transition: background-color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
.filter .drop a:hover{
    text-decoration:none;
    background:#eee
}
.filter .drop .selected{
    font-weight:500;
    position:relative
}
.filter .drop .dropclear {margin-top:10px}
.filter .drop .dropclear:hover{
    background:none;
    text-decoration:underline
}

.filter.sel .drop li.selected a:before{
    background:#000;
    border-color:#000;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.filter.sel .drop li.selected a:after{
    content: "";
    background-color: transparent;
    position: absolute;
    left: 27px;
    top: 8px;
    width: 5px;
    border-bottom: 2px solid #fff;
    height: 12px;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.filter.sel .drop li a:before{
    content:"";
    height:19px;
    width:19px;
    display:inline-block;
    background:#fff;
    margin: 0 10px 0 0;
    vertical-align: text-top;
    border: 1px solid #eee;
}

.filter.size .drop {
    width:220px;
    padding: 9px 10px 8px;
}
.filter.size li {
    display:inline-block;
    width:calc(33.33% - 10px);
    max-width:80px;
    margin:3px;
    text-align:center;
    border: 2px solid #fff;
    -webkit-transition: border-color .3s ease-in-out;
    -ms-transition: border-color .3s ease-in-out;
    transition: border-color .3s ease-in-out;
}
.filter.size li a{
    padding: 5px 0;
}
.filter.size .selected{
    border-color:#000;
}
.filter.size .dropclear {padding-left:10px}

.filter.col .drop{
    width:226px
}
.filter.col ul{
    padding:6px 5px 0
}
.filter.col li{
    display:inline-block;
    border: 2px solid #fff;
    margin:0 5px;
    border-radius:30px;
    -webkit-transition: border-color .3s ease-in-out;
    -ms-transition: border-color .3s ease-in-out;
    transition: border-color .3s ease-in-out;
}
.filter.col li.off {display:none}
.filter.col li a{
    margin: 2px;
    padding:0;
    width:36px;
    height:36px;
    border-radius:30px;
}
.filter.col li:hover{
    border-color:#eee
}
.filter.col .selected{
    border-color:#000;
    border-radius:30px;
}
.filter.col .selected:hover{
    border-color:#000;
}

.filter.custom .drop{
    width:max-content;
    padding:9px 20px;
}
.filter.custom .options h3 {
    width:70px;
}
.filter.custom .dropclear {padding-left:0}
#filterbutton {display:none}
.col-black{background:#000!important}
.col-blue{background:#0038CC!important}
.col-brown{background:#704214!important}
.col-gold{background-image: url("/assets/patterns/pat32.jpg")!important}
.col-green{background:#00aa00!important}
.col-grey{background:#aaaaaa!important}
.col-light-blue{background:#89CFFF!important}
.col-light-pink{background:#FFCBDB!important}
.col-natural{background:#FFEED0!important}
.col-navy{background:#191970!important}
.col-orange{background:#FF5800!important}
.col-pink{background:#E40078!important}
.col-purple{background:#800080!important}
.col-red{background:#ee0000!important}
.col-silver{background-image: url("/assets/patterns/pat33.jpg")!important}
.col-white{background:#FFF!important;border:1px solid #ddd;margin:1px!important}
.col-yellow{background:#FEDF00!important}
.col-rose-gold{background-image: url("/assets/patterns/pat93.jpg")!important}
.col-gold-glitter{background-image: url("/assets/patterns/pat78.jpg")!important}
.col-silver-glitter{background-image: url("/assets/patterns/pat79.jpg")!important}
.col-red-glitter{background-image: url("/assets/patterns/pat80.jpg")!important}
.col-blue-glitter{background-image: url("/assets/patterns/pat81.jpg")!important}
.col-black-glitter{background-image: url("/assets/patterns/pat82.jpg")!important}
.col-green-glitter{background-image: url("/assets/patterns/pat83.jpg")!important}
.col-rose-glitter{background-image: url("/assets/patterns/pat84.jpg")!important}
.col-fuchsia-glitter{background-image: url("/assets/patterns/pat85.jpg")!important}
.col-purple-glitter{background-image: url("/assets/patterns/pat86.jpg")!important}
.col-bronze-glitter{background-image: url("/assets/patterns/pat87.jpg")!important}
.col-capri-glitter{background-image: url("/assets/patterns/pat88.jpg")!important}

.canvas{
    position:absolute;
    font-size:12px;
    visibility:hidden;
    bottom:10px
}
.canvas.ready{
    visibility:visible;
    bottom:5px
}

.product-grid {
    display:inline-block;
    width:calc(25% - 30px);
    margin:0 15px 40px;
    text-align:center;
    vertical-align:top
}
.product-grid a{
    display:block
}
.product-grid a:hover{
    text-decoration:none
}
.product-grid img{
    width:100%;
    object-fit: cover;
}
.product-grid picture{
    position:relative
}
.product-grid h3{
    font-weight:400;
    margin:6px 0 0;
    font-size:16px;
    letter-spacing:.5px;
    line-height:24px
}
.product-grid .note {
    background:#fff;
    display: block;
    font-size: 14px;
    letter-spacing: .25px;
    padding: 0 6px;
    line-height:26px
}
.product-grid .note svg{
    width: 16px;
    height: 16px;
    margin-right: 2px;
    vertical-align: -2px;
}
.product-grid .note.organic {
    background:#080;
    color:#fff
}
.hidden {
    display:none!important;
    visibility:hidden!important
}


.product {
    max-width:1360px;
    margin:0 auto;
    overflow:hidden;
    position:relative
}
.product .images {
    display:inline-block;
    width:56%;
    margin-right:2%;
    line-height:0
}
.product .images .image {
    width:calc(50% - 15px);
    margin:30px 0 0;
    overflow:hidden;
    background:#e5e5e5;
    padding:0;
    display: inline-block;
}
.product .images img {
    width:100%;
    cursor: zoom-in;
    object-fit: cover;
}
.product .images .zoom2 img {
    cursor: zoom-out;
}
 .product .images .image:first-child {
    width:100%;
    max-height:1000px;
    margin:0
}
.product .images picture:first-child img {
    width:100%;
    height:unset;
    margin:0
}
.product .images .image:nth-child(2n) {
    margin-right:30px
}
.product .item {
    display:inline-block;
    vertical-align:top;
    width:42%;
}
.product .price {
    margin:0 0 10px 0
}

.product .features li:before {
    margin-right: 10px;
    font-size:10px;
    content:"\2022"
}

.product .button.cta {
    margin:10px 0 40px
}
.product-note {
    font-size: 15px;
    color: #777;
    margin: -8px 0 0;
}

.product-banner {
    background:#f0f0f0;
    margin: 0 0 15px;
    position: sticky;
    top: 61px;
    z-index: 9;
}
.product-banner .content {
    max-width: 1360px;
    padding: 15px;
    width: calc(100% - 30px);
}
.product-banner .product-added {
    width: 52%;
    display: inline-block;
    vertical-align: top;
    line-height: 0;
}
.product-banner .thumb {
    display: inline-block;
    margin-right:40px;
    position:relative
}
.product-banner .thumb img{
    width:102px
}
.product-banner .product-details {
    display: inline-block;
    vertical-align: top;
    line-height: 32px;
    width: calc(100% - 220px);
}
.product-banner p {
    margin: 0
}
.product-banner .added-title {
    text-transform: uppercase;
    color:#0a0;
    font-weight: 500;
    font-size: 23px;
    margin-top:2px
}
.product-banner .product-title {
    font-weight: 500;
}
.product-banner .product-desc span {
    margin-right:8px;
    display:inline-block
}
.product-banner .next-step {
    width: 48%;
    display: inline-block;
    margin-top: 20px;
}


.options {
    width:100%;
    line-height:30px;
    position:relative
}
.options h3 {
    width:70px;
    display:inline-block
}
.options ul {
    display:inline-table;
    width: calc(100% - 70px);
    max-width:calc(100% - 70px)
}
.options.widelabel h3 {
    width:90px;
}
.options.widelabel ul {
    max-width:calc(100% - 90px)
}
.options ul.error {
    border-bottom: 2px solid #e30;
}
.options ul.error li{
    margin-bottom:0
}
.errmsg {
    color:#e30;
    margin-left:70px
}
.options a {
    display:block;
    text-align:center;
    line-height:44px;
   border:2px solid #fff;
   padding:0 14px;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.options a:hover {
    background:#eeeeee;
    /*border-color:#c2c0c1;*/
    text-decoration:none
}
.options li {
    display:inline-block;
    margin: 0 10px 10px 0;
}
.options li a.selected{
    /*background:#000;
    color:#fff;
    fill:#fff;*/
    /*border:3px solid #000;*/
    border-color:#000;
    font-weight:500;
    pointer-events:none
}
.options li.header {
    display: block;
    font-size: 18px;
    width:100%!important
}
.options .size2 li {
    width:calc(50% - 5px)
}
.options .size2 li:nth-child(2n) {margin-right:0}
.options .size3 li {
    width:calc(33.333% - 6.666px)
}
.options .size3 li:nth-child(3n) {margin-right:0}
.options .size4 li {
    width:calc(25% - 7.5px)
}
.options .size4 li:nth-child(4n) {margin-right:0}
.options .size5 li {
    width:calc(20% - 8px)
}
.options .size5 li:nth-child(5n) {margin-right:0}
.options .size6 li {
    width:calc(16.666% - 8.333px);min-width:70px
}
.options .size6 li:nth-child(6n) {margin-right:0}
.options .size6 li a{
    padding:0
}
.options .size8 li {
    width:calc(12.5% - 8.75px)
}
.options .size8 li a{
    padding:0px
}
.options .size8 li:nth-child(8n) {margin-right:0}
.options .sizeM li {
    width:25%;min-width:70px;margin:10px 0
}
.options .sizeM li:nth-child(6n) {margin-right:0}
.options .sizeM li a{
    padding:0
}

.options .colour a {
    padding:2px;
    border-radius: 30px
}
.options .colour a:hover {
    border-color:#eee;
    background:#fff
}
.options .colour li {
    vertical-align:middle
}
.options .colour .swatch {
    display:block;
    width:36px;
    height:36px;
    position:relative;
    overflow:hidden;
    border-radius: 30px
}
.options .colour .swatch-half {
    width: 40px;
    height: 18px;
    position: absolute;
    left: 0;
    top: 19px;
    transform: rotate(-10deg);
}
/*.options .colour .swatch:after{
    content: url("/assets/patterns/test.png");
    width: 40px;
    height: 40px;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    opacity: .2;
    overflow: hidden;
    border-radius: 30px;
}*/
.options .colour .swatch svg{
    width:24px;
    height:24px;
    vertical-align:-3px
}
.options input {
    width: calc(100% - 122px);
    display: inline-table
}
.options.let1{max-width: 170px}
.options.let3{max-width: 190px}
.options.let8{max-width: 240px}
.options.let12{max-width: 280px}
.options.let18{max-width: 360px}
.options.let24{max-width: 440px}
.options .drop {
    border: 2px solid #444;
    display: inline-table;
    text-align: left;
    padding:0 10px
}
.options .drop .iconMini{
    width: 1em;
    float: right;
    margin:5px 0 0 12px;
}
.options svg {
    height:36px;
    width:36px;
    vertical-align: -12px;
}
.options.fonts svg {
    height:40px;
    width:40px;
    vertical-align: -14px;
}
.options .note {
    font-size:14px;
    color:#808080;
    position:absolute;
    top:17px;
    right:36px;
    background:#fff;
    padding-left: 4px;
}

.product-grid .options li{
    margin:6px 4px 0 0
}
.product-grid .options .colour a{
    padding:1px;
    border-width:1px
}
.product-grid .options .colour a.selected{
    border-color:#333;
    pointer-events:unset
}
.product-grid .options .colour .swatch{
    width:24px;
    height:24px
}
.product-grid .options .colour .swatch svg{
    width:16px;
    height:16px;
    vertical-align:6px
}
.product-grid .options .colour .swatch:after{
    width:24px;
    height:24px
}





.cart .desc,.details,.cart .thumb,.notes{
    display:inline-block
}
.details{
    border:none;
    padding:0;
    margin:0 0 40px;
    width:calc(100% - 460px);
    position:relative;
}
.cart table{
    width:100%;
    border:0;
    padding:0
}
.cart th {padding:0 10px}
.cart th:first-child {text-align:left}
.cart td{
    text-align:center;
    padding:8px 0 0;
    line-height:32px;
    border-bottom: 1px solid #e5e5e5;
}
.cart .desc,.cart .item{
    text-align:left;
    padding-left:10px
}
.cart .desc{
    vertical-align:top;
    width:calc(100% - 160px);
    margin:10px 0 0 20px
}
.cart .desc span {
    margin-right:8px;
}
.cart .thumb{
    padding:2px 10px;
    text-align:center;
    position:relative;
    padding:0;
    line-height:0
}
.cart .thumb img{
    width:102px
}
.cart .product-name {
    font-weight:500
}
.cart .product-details{
    width:unset
}
.cart .note{
    font-size:14px;
    color:#808080;
}
.cart .note a{
    color:#808080;
}
.cart #rowOverlay{
    background-color:rgba(255,255,255,.8);
    display:none
}
.cart input{
    margin:0;
    text-align:center;
    width:30px;
    padding:0px 10px
}



.notes{
    margin-left:30px;
    vertical-align:top;
    display:inline-block;
    position:sticky;
    top:80px
}
.sidenote{
    width:380px;
    border:1px solid #e5e5e5;
    padding:20px
}
.sidenote h3 {
    margin:0;
    text-transform: uppercase;
    font-weight:500
}
.sidenote p {position:relative}
.sidenote .bold{
    border-top:1px solid #e5e5e5;
    margin-top:20px;
    padding-top:20px;
    margin-bottom:0;
    font-weight:500
}
.curr-price-inner,.nav li a{
    font-weight:500;
    text-transform:uppercase
}
.sidenote .button{
    margin-top:15px;
}
.sidenote:last-child{
    margin-bottom:50px
}
.sidenote.secure{
    padding-top:12px;
    border:none;
    text-align:center;
    color:#666
}
.sidenote.secure .trustMark{
    width:70px
}
.sidenote .freedelivery {
    font-size:14px;
    line-height:0;
    text-align:right;
    color:#0a0;
}
.curr-price-inner{
    letter-spacing:2px;
    font-size:12px
}


.form {
    padding:12px 40px 18px;
    border:1px solid #e5e5e5;
}
.form label {
    display:block;
    margin:16px 0 2px
}
.form input, .form textarea {
    width: calc(100% - 28px);
}
.form textarea {
    line-height:32px;
    padding:8px 12px;
    height:160px
}
.form .errmsg {
    color:#e30;
    margin:0;
    display:none
}
.form .error input, .form .error .input, .form .error textarea{
    border-color:#e30;
}
.form .error .errmsg{
    display:block
}
.form .button.cta {
    margin:30px 0 20px
}


.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)
}








.usps {
    margin-top:80px;
    text-align:center
}
.usps .content {
    max-width:1200px
}
.usp {
    width:24%;
    display:inline-block;
    line-height:24px;
    vertical-align:top
}
.usp p{
    margin:0
}
.usp .lead {font-weight:500}
.usp svg {
    width:40px
}


.content.info {
    max-width:1360px;
    width:94%
}
.info h2 {
    font-weight:500;
    font-size:18px;
}
.info p a {text-decoration:underline}
.info p a:hover {color:#444}
.info .infoPanel h3 {margin:5px 0}
.info .infoPanel.closed h3 {font-weight:400}
.info .infoPanel:first-child{
    border-top:none;
    margin-top:0
}
.info .infoPanel:first-child h3{
    margin-top:0
}

.box2 {
    display:inline-block;
    margin: 0 2%;
    width: 45%;
    vertical-align:top
}
.box2 .infoPanel h3 {margin:15px 0 -5px}

.footer{
    clear:both;
    background: #f0f0f0;
    margin-top:40px;
    text-align:center
}
.footer .content{
    max-width: 1360px;
    width:calc(100% - 40px)
}
.footer ul {
    display:inline-block;
    list-style: none;
    margin: 36px 0 12px;
    padding: 0;
    width: 22%;
    vertical-align: top;
}
.footer li {
    line-height:40px
}
.footer li h5{
    margin: 5px 0;
    font-size: 16px;
    font-weight: 500;
}
.footer li a{
    text-decoration: none;
}
.footer li a:hover{
     text-decoration:underline
}
.footer p {
    text-align:center;
    color:#444
}
.footer ul.newsletter {
    width: 34%;
    float:right
}
.footer ul.newsletter form {
    width: 90%;
    position:relative;
    margin:0 auto;
    text-align:left
}
.footer ul.newsletter .button {
    width: unset;
    line-height: 44px;
    padding: 2px 16px 2px;
}.footer ul.newsletter .button .icon {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.footer ul.newsletter p{
    margin:0
}
.footer input{
    width:calc(100% - 80px)
}
.footer .inner h5{
    margin:35px 0 5px
}
.footer .connect h5{
    margin:31px 0 0
}
.footer .connect{
   fill:#444;
}
.footer .connect a{
  -webkit-transition: .3s ease-in-out;
  -moz-transition: .3s ease-in-out;
  -o-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.footer .connect .icon{
   height:1.6em;width:1.6em;margin:0 6px
}
.footer .secure {font-weight:500;padding:10px 0}
.footer .secure .icon{
    height: 60px;
    vertical-align: 0;
    width: 60px;
    margin: 0 10px
}


.co.nav .brand{
    margin:0 auto;
    position:relative
}
.co.content {width:calc(100% - 40px);max-width:1160px}
.co.main {margin-top:90px}
.co input {border:1px solid #d5d5d5}
.co input:focus{border-color:#808080}
.co select{
    font-size: 16px;
    line-height: 44px;
    font-family: "Neutraface", sans-serif;
    padding: 11px 12px;
    margin: 0;
    border:1px solid #d5d5d5;
    width:100%;
    background: #fff
}
.co .selop {
    font-size: 14px;
    font-family: "Neutraface", sans-serif;
}
.co h3 .note {
    text-transform: none;
    font-weight: 400;
    right: 30px;
    font-size: 14px
}
.co h3 .note a{
    color: #808080
}
.co .cart .thumb img {width:72px}
.co .cart .desc {width:unset;margin:0}
.co .cart .product-name {
    font-size:14px
}
.co .cart .product-details{
    font-size:14px;
    color: #808080;
    line-height: 24px
}
.co .notes table {
    margin-top: 10px;
    padding:0;
    border:0;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5
}
.co .cart td{
    padding:10px 0 10px 6px;
    line-height:24px;
}
.co .sidenote {overflow-y: auto;max-height: calc(100% - 110px);}
.co .sidenote .note.l{display:none}
.co .sidenote .thin{
    display:none;
    position:relative
}
.co .sidenote .thin .thumb{
    position: relative;
    width: 60px;
    line-height:0;
    display:inline-block
}
.co .sidenote .thin .thumb img{
    width: 60px
}
.co .sidenote .thin .info{
    display: inline-block;
    padding-left: 20px;
    font-size: 24px;
    font-weight: 500;
    padding-top: 14px;
    line-height: 24px;
}
.co .sidenote .thin .info .note {
    display:block
}
.co .sidenote .thin .info .note a{
    font-size:16px;
    color:#808080;
    font-weight:400
}
.co .sidenote .thin .total {
    display: inline-block;
    text-align: right;
    font-size: 24px;
    line-height: 77px;
    font-weight: 500;
    margin-right: 10px;
}
.co .notes td:last-child {
   text-align:right
}
.co .step {
    border: 2px solid #222;
    border-radius: 36px;
    font-size: 18px;
    vertical-align: 3px;
    margin-right: 20px;
    width: 30px;
    display: inline-block;
    text-align: center;
    height: 30px;
    line-height: 30px;
}
.co .form {border:none;padding:0}
.co .edit {
    font-size:14px;
    border:1px solid #e5e5e5;
    padding:0 16px;
    line-height:32px;
    top:3px;
    color:#808080;
    display:none
}
.co .edit:hover{
    text-decoration:none;
    color:#444
}
.co .secTitle{
    position:relative
}
.co .secTitle h2{
    display: inline-block;
    width:200px;
    font-size: 28px;
    margin: 0;
    font-weight: 500;
    line-height: 38px;
}
.co .secReview {
    display: inline-grid;
    font-size:15px;
    width: calc(100% - 250px);
    display:none
}
.co .secReview p{
    margin:0
}
.co .success {cursor:pointer}
.co .success .edit {display:block}
.co .success .secReview {display:inline-grid}
.co .success .step{color:#fff}
.co .success .step:after{
    content:"";
    position:absolute;
    left:13px;
    top:9px;
    width:6px;
    height:16px;
    border:solid #000;
    border-width:0 2px 2px 0;
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg)
}
.co .sec {
    max-width: 560px;
    padding-left: 54px;
    max-height:950px;
    overflow:hidden;
    -webkit-transition:max-height .3s ease-in-out;
    -moz-transition:max-height .3s ease-in-out;
    -o-transition:max-height .3s ease-in-out;
    transition:max-height .3s ease-in-out;
}
.co .sec.closed {
    max-height:0;
    -webkit-transition:max-height .3s ease-in-out;
    -moz-transition:max-height .3s ease-in-out;
    -o-transition:max-height .3s ease-in-out;
    transition:max-height .3s ease-in-out
}
.co .sec .two {
    width:calc(50% - 10px);
    display: inline-block;
    vertical-align: top;
}
.co .sec .two.first{
    margin-right:20px
}
.co .button.cta {
	display: inline-block;
	width: auto;
	padding: 0 24px;
	font-size: 16px;
	background: #000;
	line-height: 44px;
}
.co .button.cta:hover {
	background: #222
}
.co .payicons {position: absolute;right: 0;top: -7px;}
.co .payicons svg {height:47px;width:56px}
.co .paymethod{
    border: 1px solid #e5e5e5;
    border-top:none;
    padding:10px;
    background:#f5f5f5
}
.co .paymethod.selected{
    background:#fff
}
.co .paymethod:first-of-type{
    border: 1px solid #e5e5e5;
    margin-top:10px
}
.form .paymethod label.radiobox {margin:0;font-weight:500}
.co .paymethod .trustMark {
    height:22px;
    margin:-5px 0
}
.co .paymethodinner {
    overflow:hidden;
    max-height:0;
    -webkit-transition:max-height .3s ease-in-out;
    -moz-transition:max-height .3s ease-in-out;
    -o-transition:max-height .3s ease-in-out;
    transition:max-height .3s ease-in-out
}
.co .selected .paymethodinner {
    margin: 0 auto 16px;
    width: calc(100% - 22px);
    max-height:500px;
    -webkit-transition:max-height .3s ease-in-out;
    -moz-transition:max-height .3s ease-in-out;
    -o-transition:max-height .3s ease-in-out;
    transition:max-height .3s ease-in-out
}
.co .inputa {width: 100%;}
.co .inputb {
    width: calc(50% - 10px);
    display: inline-block;
    vertical-align: top
}
.co .inputb.first{margin-right:20px}
.co .input {
    border:1px solid #d5d5d5;
    padding: 13px 12px 12px;
    margin: 0;
}
.co.footer{
    border-top:1px solid #e5e5e5;
    background:#fff;
    padding-top:20px
}

.co.rev .notes {width:400px;margin-left:50px}
.co.rev .sidenote {width:calc(100% - 42px);margin-bottom:24px;vertical-align:top}
.co.rev .sidenote.two{width:calc(50% - 54px);display:inline-block}
.co.rev .sidenote.two:last-child{margin-left:24px}
.co.rev .sidenote p{margin:0}
.co.rev table {
    border:none;
    border-top: 1px solid #e5e5e5;
    margin:10px 0;
    padding:0
}
.co.rev p.bold {margin-top:10px}
.co.rev .button.cta {
	width: 100%;
	padding: 0;
	line-height: 50px;
	font-size:18px
}
.co.rev .notes.thin{display:none}



.moreinfo{
    vertical-align:top;
    position:relative
}
.moreinfo svg {
    height:20px;
    width:20px;
    fill:#808080;
    vertical-align:text-top
}
.moreinfo:hover{
}
.moreinfo .tooltip{
    bottom:calc(100% + 9px)
}
.moreinfo:hover .tooltip{
    opacity:1
}


a:hover .tooltip{
    visibility:visible;
    -webkit-transition:opacity .3s ease;
    -moz-transition:opacity .3s ease;
    -o-transition:opacity .3s ease;
    transition:opacity .3s ease;
}
.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;
    font-size:14px
}
.tooltip p {margin:2px 0}
.tooltipContent{
    font-size:14px;
    background:#fff;
    padding:8px 16px 6px;
    display:inline-block;
    height:auto;
    border:1px solid #e5e5e5;
    -webkit-box-shadow:0px 0px 4px rgba(0,0,0,.25);
    -moz-box-shadow:0px 0px 4px rgba(0,0,0,.25);
    box-shadow:0px 0px 4px rgba(0,0,0,.25);
    line-height: 26px;
}





.gallery.content {
    width:calc(100% - 20px);
    max-width:1180px;
    margin:0 auto 10px
}
.gallery.content.main {
    margin:72px auto 10px
}
.gallery {
    position:relative;
    box-sizing: border-box;
}
.gallery h1 {
    margin: 30px 0 20px;
    text-align: center;
}
.gallery p{
    text-align: center;
    max-width: 680px;
    margin: 0 auto 20px;
    color:#666
}
.gallery .gallery ul {
    position: relative;
    padding: 5px;
    margin: 0;
    list-style: none;
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-auto-flow: dense;
}
.gallery .gallery li {
    position: relative;
    display: block;
    margin: 0;
    background: #ccc;
    font-size:14px;
    opacity: 1;
    width: 100%;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    transition: opacity .4s cubic-bezier(.39,.575,.565,1),visibility 20ms linear,-webkit-transform .45s cubic-bezier(.215,.61,.355,1);
}
.gallery li.out{
    opacity:0;
    -webkit-transform: translate3d(0,20px,0);
    transform: translate3d(0,20px,0);
    height:0
}
.gallery .gallery li:nth-child(6n+3), .gallery li:nth-child(6n+4){
    grid-column: span 2;
    grid-row: span 2;
}
.gallery.home .gallery li:nth-child(3), .gallery.home .gallery li:nth-child(6), .gallery.home .gallery li:nth-child(8){
    background: #d9d9d9;
}
.gallery.home .gallery ul {
    grid-column-gap: 0;
    grid-row-gap: 0;
}
.gallery.home .gallery li:nth-child(6n+3), .gallery.home li:nth-child(6n+4), .gallery.insta .gallery li:nth-child(6n+3), .gallery.insta li:nth-child(6n+4), .gallery.item .gallery li:nth-child(6n+3), .gallery.item li:nth-child(6n+4){
    grid-column: span 1;
    grid-row: span 1;
}
.gallery .gallery li img {
    width: 100%;
    height: 100%;
    vertical-align: middle;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute
}
.gallery .gallery li:after {
    content: '';
    display: block;
    padding-bottom: 100%;
}
.gallery .gallery li.cta:after {
    display: none;
}
.gallery .gallery li.cta{
    color: #fff;
    background:repeating-linear-gradient(135deg, #c81466, #c81466 18px, #c51364 18px, #c51364 36px);
    padding:30px;
    width:calc(100% - 60px);
    text-align:left
}
.gallery .gallery li.cta p.title{
    font-size:21px
}
.gallery .gallery li.cta p{
    text-align:left;
    font-size:15px;
    line-height:30px
}
.gallery .gallery li.cta a{
    position:absolute;
    bottom:30px;
    font-weight:500;
    border:1px solid #fff;
    border-radius:3px;
    padding:6px 12px;
    text-decoration:none;
    background:#fff0;
    -webkit-transition: background .3s ease;
    -moz-transition: background .3s ease;
    -o-transition: background .3s ease;
    transition: background .3s ease;
}
.gallery .gallery li.cta a:hover{
    background:#fff4;
    color:#fff;
    -webkit-transition: background .3s ease;
    -moz-transition: background .3s ease;
    -o-transition: background .3s ease;
    transition: background .3s ease;
}
.gallery li .info {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    cursor: pointer;
    z-index: 3;
    opacity: 0;
    background: rgba(0,0,0,.6);
    transition: opacity ease .2s;
    border:none
}
.gallery li .info:hover {
    opacity: 1;
}
.gallery li .name {
    position: absolute;
    top: 50%;
    left: 10px;
    right: 10px;
    z-index: 2;
    display: inline-block;
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0 auto;
}
.gallery .buttons {
    text-align:center
}
.gallery .button.button-cta {
    padding:0 16px;
    margin:0 auto 20px
}
.gallery.insta #click {margin:14px auto 10px}
.gallery.insta #tap {display:none}

.gallery.insta li .info, .gallery.item li .info {transition: opacity ease .4s;background: rgba(255,255,255,.6)}
.gallery.insta li .name, .gallery.item li .name {display:none}

.gallery.item.content {margin:50px auto 0}
.gallery.item .gallery ul {
    grid-template-columns: repeat(5,1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
}
.gallery.item li.loading .info {
    background: rgba(255,255,255,.8);
    background-image:url(../assets/ui/loader.gif);
    opacity:1;
    background-position: center;
    background-repeat: no-repeat;
}








@media only screen and (max-width: 1600px) {
    .breadcrumbs {margin:0 6px}
    .filter.sort .drop{
        left:unset;
        right:-1px;
        width:174px
    }
    .product-grid {
        width: calc(25% - 30px);
        margin: 0 15px 40px;
    }
    .product-grid:nth-child(4n) {
        margin: 0 15px 40px 15px;
    }
    .product .images {width:calc(56% - 15px);margin-left:15px}
    .product .item {width:calc(42% - 15px)}
}

@media only screen and (max-width: 1200px) {
    .nav .brand { width:150px;}
    .nav .dropnav .imagelink {display:none}
    .header h1{
        font-size:38px;
        line-height:40px;
    }
    .header .infoPanel p{
        width:80%
    }
    .filters {
        margin-bottom: 2.4vw;
    }
    .product-grid {
        width: 30.93%;
        margin: 0 1.2% 40px!important;
    }
    .cart .desc {margin-top:0}

    .carousel .slides ul {
        display: flex;
        width: 100%;
    }
    .categories li {
        width:23%;
    }
}

@media only screen and (max-width: 1040px) {
    .product .images {width:calc(50% - 10px);margin-left:10px;margin-right:20px}
    .product .item {width:calc(50% - 30px)}
    .product .images .image {
        width:100%;
        margin-top:20px;
    }
}
@media only screen and (max-width: 900px) {
    .n3{display:none}
    .o3{display:block}
    .page-title h1{margin:8px 0;text-align:center;font-size:23px}
    .nav .brand { margin:0 auto;left:0;right:0}
    #navmain {visibility:hidden;transform: translateX(-50%)     }
    #navmain.drawer {
        visibility:visible;
        top: 60px;
        background:#000a;
        transform: translateX(0%);
    }
    .nav .menuitem:hover .dropnav{
        position:relative;
    }
    .nav .dropnav ul.double {max-width:400px}
    .menuitem:after {content: none}
    #filterbutton {display:inline-block;background:#dcdcdc}
    .filtergroup {display:none}
    .filters {border:none}
    .filters a{display:block}
    .filters .filter {
        border:none;
        width:48.5%;
        margin: 6px 0%;
        text-align:center;
        background:#eaeaea
    }
    .filters.filter.open{border:none}
    .filter.open::after{display:none}
    .filters.full {
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background:#fff;
        z-index:99;
    }
    .filters.full .filter{
        width: 45%;
        margin: 3vw 3% 2px;
    }
    .filters.full .filtergroup .filter{
        width: 94%;
        margin: 0 3%;
        background:#fff;
        border-bottom:1px solid #e5e5e5;
        padding:3px 0 4px
    }
    .filters.full .filtergroup .filter .label{
        padding:8px 9px 5px;
        text-align:left
    }
    .filters.full .filtergroup .filter .label svg {
        position:absolute;
        right:4px;
        top:20px
    }
    .filters.full .filtergroup .drop{
        width: 94%;
        position:relative;
        top:0;
        right:0;
        left:0;
        padding-top:0;
        border:none
    }
    .filter.sel .drop li.selected a:after{
        left: 27px
    }
    .filters .filter.sort .drop {
        margin-top:6px;
        left: -53%;
        right: 0;
        width: 100%;
        border:0;
        text-align:center
    }
    .filters .filter.sort .drop a{
        padding:6px 0
    }
    .product-banner .thumb {
        margin-right:30px
    }
    .product-banner .product-details {
        width: calc(100% - 154px);
    }
    .filters #clearFilters{margin:12px 0 0 23px}
    .filters #closeFilters{display:block;margin-top: 12px;position: absolute;right: 23px;}
    .details {width:100%}
    #cart-area, .notes {
        width: calc(100% - 20px);
        text-align: center;
        margin: 0 auto
    }
    .notes{
        position:relative;
        top:unset
    }
    .sidenote {
    	width: calc(100% - 40px);
    	text-align:left
    }
    .co .sidenote {
    	width: calc(100% - 64px);
        position: fixed;
        background: #fff;
        bottom: 0;
        margin-bottom: 20px;
        z-index: 9;
        box-shadow: 0px 0px 3px #808080;
        padding:12px;
        border-radius:3px
    }
    .box2 {
        margin: 0;
        width: 100%;
    }
    .section{width:calc(100% - 60px);margin:0 30px}
    .section:first-of-type{overflow:unset}
    .section.lead{margin:0}
    .section.lead img.one {height:unset;min-height:400px}
    .section h1 {font-size: 44px;line-height:44px}
    .section h2 {margin: 0 0 20px;font-size: 28px}
    .section .cta {
        font-size:18px
    }
    .textcard.two {
        width:45%
    }
    .textbox.primary {
        background: #fff;
        padding: 30px;
        text-align: center;
        width: 70%;
        margin: -90px auto 0;
        left: 0;
        top: 0;
        position: relative;
    }
    .categories li {
        width:30.33%;
        padding:0 1.5%
    }
    .textbox.eighty.box.giftfinder {
        position: relative;
        left: 0;
        top: 0;
        transform: none;
        width: 70%;
        margin: 20px auto -20px;
        border: 4px solid #e5e5e5;
        max-width: 420px;
        display:none
    }
    .co .sidenote .wide{
        overflow:hidden;
        max-height:0;
        -webkit-transition:max-height .3s ease-in-out;
        -moz-transition:max-height .3s ease-in-out;
        -o-transition:max-height .3s ease-in-out;
        transition:max-height .3s ease-in-out
    }
    .co .sidenote .thin{display:flex}
    .co .sidenote.show .wide{max-height:800px}
    .co .sidenote.show .thin{display:none}
    .co .sidenote.show h3{text-align:center}
    .co .sidenote.show .note{width:100px}
    .co .sidenote.show .note a{padding:0 15px}
    .co .sidenote.show .note.l{left:0;text-align:left;display:block}
    .co .sidenote.show .note.r{right:0;text-align:right;display:block}
    .co .sidenote .note.r{display:none}
    .co .sec {max-width: calc(100% - 100px)}
    .co.rev .sidenote {
        padding:20px;
        position:relative;
        box-shadow:none
    }
    .co.rev .notes.thin{display:block}
    .co.rev .notes:last-child div{margin:10px;text-align:left;line-height:50px}
    .co.rev .notes:last-child .cta{width:auto; padding:0 50px}
    .co.rev .notes {width:100%; margin:0 auto 30px;}
    .footer ul {width:33.3%;margin-top:12px}
    .footer ul.newsletter {width:100%;float:none;margin-top:32px}
    .gallery.insta #tap {display:block;margin:14px auto 10px}
    .gallery.insta #click {display:none}
    .gallery .gallery ul  {grid-template-columns: repeat(2,1fr);}

}

@media only screen and (max-width: 760px) {
    .header h1 {
        font-size:34px;
    }
    .header .infoPanel p{
        width:94%
    }
    .product-grid {
        width: 47%;
        margin: 0 1.5% 40px!important;
    }
    .product .images {width:calc(100% - 60px);margin:0 10px 0 30px;display:flex}
    .product .item {width:80%;margin:0 10%}
    .product .images .image {margin:0 10px 0 0;flex-shrink:0;flex-grow:0}
    .product .images .image:first-child{margin:0 10px 0 0}
    .product .images .image:nth-child(2n){margin:0 10px 0 0}
    .carousel .tabs{display:block}
    .carousel .button.arrow{display:flex}

    .product-banner .product-added {width:100%}
    .product-banner .product-details {width:100%}
    .product-banner .product-title {display:none}
    .product-banner .product-desc {display:none}
    .product-banner .thumb {display:none}
    .product-banner .next-step {
        width: unset;
        display: block;
        margin-top: 10px;
    }
    .product-banner .next-step .button{line-height:22px}
    .product-banner .next-step .button.cta{float:right; font-size:16px;padding:14px 0}
    .product-banner .next-step .button.continue{background:#fff;border:2px solid #000;padding:12px 0;margin:0}
    .product-banner .next-step .button{width:calc(50% - 10px)}

    .options .modal {      width: 66%;  }
    .usp {
        width:40%
    }
    .usp:first-child {
        margin: 0 0 40px
    }
    .section h1 {font-size: 36px;line-height:36px}
    .section img.two {
        width:100%;
    }
    .textcard.two {
        width:100%;
        padding-bottom:50px;
        margin:0
    }
    .section.about{
        padding:0
    }
    .section.about .textcard.two{
        padding:0;
        width:85%
    }
    .textcard.three {
        width:80%;
        margin-bottom:60px
    }
    .textcard.three h3{
        margin:6px 0 4px
    }
    .textbox.box {width: calc(57% - 32px)}
    .textbox.second {
        left:50%;
        top: calc(75% - 18px);
    }
    .co .sec {max-width: 560px}
}


@media only screen and (max-width: 700px) {
    .categories li {
        width:47%;
    }

    .gallery .gallery ul {
        grid-template-columns: repeat(2,1fr);
    }

    .gallery .gallery li:nth-child(6n+3), .gallery li:nth-child(6n+4){
        grid-column: span 1;
        grid-row: span 1;
    }
    .gallery .gallery li:nth-child(3n){
        grid-column: span 2;
        grid-row: span 2;
    }
    .gallery.home .gallery li:nth-child(3n), .gallery.insta .gallery li:nth-child(3n), .gallery.item .gallery li:nth-child(3n){
        grid-column: span 1;
        grid-row: span 1;
    }
    .gallery.home .gallery li:nth-child(8){
        display:none
    }
    .gallery .gallery li:first-child{
        grid-column: span 2;
    }
    .gallery.insta .gallery li:first-child, .gallery.item .gallery li:first-child{
        grid-column: span 1;
    }
}


@media only screen and (max-width: 520px) {
    .nav .dropnav ul.double li {width:100%}

    .header {margin-top:8px}
    .options .sizeM li {margin:5px 0}
    .textcard.three {
        width:90%
    }
    .cart th {padding:0 4px;}
    .cart .thumb img {
        width: 124px;
    }
    .cart .desc {width:97%;margin:0;padding:0}
    .notes {
        width: 100%;
    }
    .sidenote {
    	border:none;
    	border-top:1px solid #e5e5e5;
    	padding:0;
    	width:100%
    }
    .textbox.box {width: calc(80% - 32px)}
    .co .sec {
        padding-left: 0;
    }
    .co .success .secReview {
        padding-left: 54px;
        width: auto;
        display:block
    }
    .co .button.cta {
        width:100%;
        padding:1px 0
    }
    .footer ul{
        width:100%;
        margin-bottom:2px
    }
    .footer form {width:100%;text-align:left}
    .footer input {width:81%}
    .footer .connect h5 {margin: 44px 0 0; }
    .footer .secure {margin-top:32px}
}

@media only screen and (max-height: 760px) {
    .options .sizeM li {margin:5px 0;min-width:unset}
}
@media only screen and (max-height: 520px) {
    .options .sizeM li {width:16.66%}
    .options .sizeM svg {width:30px;height:30px;vertical-align: -10px;}
}
@media only screen and (max-height: 560px) {
    .options .sizeM li {margin:1px 0}
}

@media only screen and (max-width: 400px) {
    .nav .brand { width:130px;padding-top:14px}
    .nav .menu ul a {padding:16px 5px 12px}
    .nav .menu.r {margin-right:8px}
    .menuitem #cartnum {width:33px;left:2px}
    .usp {
        width:94%;
        margin: 0 0 40px
    }
    .usp:last-child {
        margin:0
    }
    .textbox h2 {font-size:21px;margin:0}
    .textbox p {margin:10px 0}
    .options .sizeM svg {width:24px;height:24px;vertical-align: -8px;}
    .options .sizeM li {margin:1px 0;min-width:unset}
}