*{box-sizing:border-box}
a{text-decoration:none}
body{background:#fff;font-family:'Roboto',sans-serif}
img{max-width:100%;max-height:100%;width:auto}
h1{font-size:3em;font-weight:900}
.thumbsOut{max-width:985px;margin:30px auto;overflow:hidden}
.thumbsOut .item{width:28%;padding-bottom:28%;background-position:50%;background-size:contain;background-repeat:no-repeat;margin:2.666666666%;float:left;transition:all .4s ease;cursor:pointer}
.thumbsOut .item:hover{transition:all .4s ease;transform:scale(1.1)}
#loadOverlay{position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(/images/load.gif);background-repeat:no-repeat;background-color:rgba(255,255,255,.9);background-position:50%;display:none;z-index:100000}
#nav{width:100%;position:relative;padding:25px 0 50px 25px;text-align:center}
#nav img{width:160px;height:auto}
#nav ul{width:100%;border:1px solid #ddd;border-width:1px 0;margin:15px auto}
#nav ul,#nav li{padding:0;list-style-type:none}
#nav li{display:inline;margin:0;padding:0}
#nav li a,#nav li a:hover{transition:all .6s ease-out}
#nav li a{color:#222;text-transform:uppercase;letter-spacing:.1em;display:inline-block;padding:10px 20px}
#nav li a:hover{background:#f9f9f9}
#zoomOut{cursor:move;cursor:zoom-in}
#zoomOut:active{cursor:zoom-in}
#imageDetails h1{font-size:4rem;font-weight:900}
#sizeSelect td,#sizeSelect th{text-align:center;border:none;font-weight:900;text-transform:uppercase;background:#f2f2f2}
#sizeSelect tr{display:none}
#sizeSelect tr.active{display:block}
#sizeSelect .note{font-size:.9em;text-align:center}
h1.fp{font-size:1.8em;letter-spacing:.02em;line-height:1.5em}
.container h1:first-child{margin-top:0}
.headline{font-weight:900}
.serif{font-family:'Roboto Slab','Roboto',sans-serif}
.cent{text-align:center}
#fpTop .highlight{color:#222;text-shadow:none}
.highlight{background:#FFD858;padding:.2em .2em 0;text-shadow:1px 0 0 rgba(255,255,255,.6);font-weight:700}
.sizeButtons a{width:32%;margin-right:1%;box-sizing:border-box;padding:20px;background:#888;text-decoration:none;color:#FFF;font-weight:900;font-size:1.2em;display:inline-block;border-radius:4px;text-align:center;margin-bottom:10px;float:left;position:relative;transition:background .3s ease}
.sizeButtons a:hover{background:#AAA;transition:background .3s ease}
.sizeButtons span{font-size:.5em;position:absolute;top:0;right:0;background:#222;padding:.2em .4em;border-radius:0 0 0 4px}
.sizeButtons a.active{background:#313d48}
.floatOut{overflow:hidden}
.bumpTop{margin-top:25px}
body .button.button-primary{background-color:#555;border-color:#777;transition:all .3s ease}
body .button.button-primary:hover{background-color:#222;border-color:#444;transition:all .3s ease}
#sizeSelect table{width:100%}
#sizeSelect .size{width:20%}
#sizeSelect .price{width:10%}
#sizeSelect .dimensions{width:70%}
#sizeSelect th:last-child,#sizeSelect td:last-child,#sizeSelect th:first-child,#sizeSelect td:first-child{padding:12px 15px}
#addToCart.inCart{background:#87c771}
#buyNow,#addToCart{transition:all .3s ease;display:block;width:100%;text-align:center;margin:10px 0;border-radius:4px;padding:20px 10px;color:#FFF;background:#f64c72;font-weight:900;text-transform:uppercase;letter-spacing:.1em;position:relative;overflow:hidden}
#buyButtons a i{position:absolute;font-size:4.5em;top:0;opacity:.4}
#buyNow i{left:0}
#addToCart i{right:0}
#buyNow:hover,#addToCart:hover{transition:all .3s ease;box-shadow:0 10px 10px -10px rgba(0,0,0,0.85);transform:translateY(-2px)}
#fpTop{background:#1EAEDB;padding:50px 0 20px;color:#f7f7f7}
#fpTop img{opacity:.9}
#fpTopTear,#fpBotTear{background:transparent url(/images/tear-edge.png) repeat-x;min-height:40px;width:100%;position:relative}
#fpTopTear{top:10px;margin-top:-50px}
#fpBotTear{top:-10px;margin-bottom:-50px}
.hidden{display:none}
.rightAlign{text-align:right}
#cartCount{background:#f64c72;color:#FFF;font-size:12px;position:relative;margin:0 3px 0 0;border-radius:50%;padding:2px;display:inline-block;width:20px;height:20px;opacity:0;top:-2px;line-height:16px}
#footer{margin:80px 0;text-transform:uppercase;color:#888;letter-spacing:.1em;font-size:.8em}
#footer ul,#footer li{padding:0;list-style-type:none}
#footer li{display:inline;margin:0;padding:0}
#footer a{color:#AAA;padding:5px 1em;transition:all .3s ease}
#footer a:hover{color:#222;transition:all .3s ease}
#footer img{opacity:.5;transition:all .3s ease;width:120px;height:auto;margin-bottom:-1em}
#footer img:hover{opacity:1;transition:all .3s ease}
.error,.success{text-align:center;padding:1em;width:100%;box-sizing:border-box;border-radius:4px}
.error{border:1px solid #C00;background:#FEE;color:#900}
.success{border:1px solid #390;background:#F4FCED}
@keyframes waiting {
0%{transform:rotate(0deg)}
50%{transform:rotate(9deg)}
100%{transform:rotate(0deg)}
}
.waiting{animation:waiting 6s ease infinite}
.inpText{width:100%;padding:5px}
textarea.inpText{min-height:200px}
#noFill{display:none}
@media(max-width:750px) {
.thumbsOut .item{width:44%;padding-bottom:44%}
}
@media(max-width:550px) {
.thumbsOut .item.horizontal{display:block;float:none;margin:25px auto;width:70%;padding-bottom:25%}
.thumbsOut .item.vertical{display:block;float:none;margin:25px auto;width:70%;padding-bottom:50%}
}
.bounce-top{-webkit-animation:bounce-top .9s both;animation:bounce-top .9s both}
@-webkit-keyframes bounce-top {
0%{-webkit-transform:translateY(-45px);transform:translateY(-45px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}
24%{opacity:1}
40%{-webkit-transform:translateY(-24px);transform:translateY(-24px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
65%{-webkit-transform:translateY(-12px);transform:translateY(-12px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
82%{-webkit-transform:translateY(-6px);transform:translateY(-6px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
93%{-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
25%,55%,75%,87%{-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
100%{-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}
}
@keyframes bounce-top {
0%{-webkit-transform:translateY(-45px);transform:translateY(-45px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}
24%{opacity:1}
40%{-webkit-transform:translateY(-24px);transform:translateY(-24px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
65%{-webkit-transform:translateY(-12px);transform:translateY(-12px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
82%{-webkit-transform:translateY(-6px);transform:translateY(-6px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
93%{-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
25%,55%,75%,87%{-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
100%{-webkit-transform:translateY(0px);transform:translateY(0px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}
}
@media(max-width:550px) {
#nav li a{padding:10px;font-size:1.2rem}
}