@keyframes fadein { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadein { from { opacity:0; } to { opacity:1; } } /* Firefox */
@-webkit-keyframes fadein { from { opacity:0; } to { opacity:1; } } /* Safari and Chrome */
@-o-keyframes fadein { from { opacity:0; } to { opacity:1; } } /* Opera */

/* common */
body { margin:0px; text-align:center; min-height:100%; animation:fadein 0.5s; -moz-animation:fadein 0.5s; -webkit-animation:fadein 0.5s; -o-animation:fadein 0.5s; }
html, input, select, textarea { font-family:"Source Sans Pro","Tahoma", san-serif; font-size:16px; line-height:1.2; }
h1, h2, h3 { margin:15px 0px; text-align:center; font-size:200%; font-weight:bold; line-height:1; }
h2 { font-size:150%; }
h3 { font-size:135%; }
a, label { text-decoration:underline; color:#515151; outline:none; transition:0.2s; }
a:hover, label:hover { color:#818181; transition:0.2s; }
big { font-size:120%; font-weight:bold; }
input[type="text"], input[type="number"], input[type="password"], select, textarea { line-height:1; padding:2px 0px 2px 4px; text-align:left; border:1px solid #888888; margin:1px 2px; font-size:16px; }
input:focus, textarea:focus { transition:all 0.30s ease-in-out; box-shadow:0px 0px 5px #0033ff; }
input[type=submit], input[type=button], input[type=image] { transition:none; box-shadow:none; outline:none; }
input[type=radio]:focus { transition:none; box-shadow:none; }
#searchbox { padding:0; }
.search-text, .search-submit { display:inline-block; vertical-align:middle; border:none !important; font-size:115%; margin:0 !important; padding:0px 8px; height:30px; line-height:1; box-sizing:border-box; outline:none; min-width:0; }
.search-submit { cursor:pointer; color:#ffffff; font-weight:bold; transition:0.2s; opacity:0.8; color:#ffffff; background-image:url(icon-search.png); background-repeat:no-repeat; background-position:center; width:40px; }
input.search-text:focus { box-shadow:none !important; }
#searchoptions { margin:0px auto 25px auto; }
#searchoptions td { vertical-align:middle; font-size:125%; }
.logo-radio { box-sizing:border-box; margin:0 3px 0 6px; outline:0; padding:0; position:relative; top:4px; vertical-align:top; }
.row { display:table-row; }
.cell { display:table-cell; }
.button { display:inline-block; padding:8px 25px; font-size:120%; font-weight:bold; color:#ffffff; transition:0.2s; text-transform:uppercase; text-decoration:none; border-radius:5px; border:none; margin:10px 0px 0px 0px; cursor:pointer; }
.button:hover { transition:0.1s; opacity:0.4; }
.disabled { background:#ececec !important; color:#bdbdbd; cursor:auto; }
.disabled:hover { transition:none; opacity:1; }

/* layout */
#layout { margin:auto; height:100vh; display:table; z-index:1; width:100%; }
#layout-top { vertical-align:top; }
#wrapper { position:relative; margin:auto; box-sizing:border-box; }
#headsection { z-index:100; top:0px; width:100%; margin:auto; position:relative; }
#header { color:#000000; text-align:left; position:relative; padding:25px 50px; }
#header-store { float:left; }
#header-logo { float:right; margin-top:50px; }
#header-info { background:#f8f8f8; padding:0px 25px; text-align:left; line-height:1; color:#666666; }
#header-info a { display:inline-block; color:#666666; text-decoration:none; position:relative; padding:20px 12px; }
#header-info a:hover { color:#000000; }
#header-info span { font-size:16px; float:right; }
#header-info img { padding:0px 0px 0px 5px; height:15px; }
#header-info .navbar > a::before, #header-info span a::before { content:""; position:absolute; width:100%; height:3px; bottom:0; left:0; visibility:hidden; transform:scaleX(0); transition:all 0.3s ease-in-out 0s; }
#header-info .navbar > a:hover::before, #header-info span a:hover::before { visibility:visible; transform:scaleX(1); }
#header-info .navbar { overflow:hidden; }
#header-info .navbar a { float:left; font-size:16px; color:#666666; text-align:center; text-decoration:none; margin:0; line-height:1; }
#header-info .dropdown { float:left; overflow:hidden; }
#header-info .dropdown .dropbtn { font-size:16px; border:none; outline:none; color:#666666; background-color:inherit; font-family:inherit; margin:0; line-height:1; padding:20px 12px; }
#header-info .dropdown-content { display:none; position:absolute; border-top:1px solid #dddddd; background-color:#f9f9f9; min-width:160px; box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); z-index:1; max-height:500px; padding:15px 0px; overflow:auto; }
#header-info .dropdown-content a { float:none; color:black; padding:5px 15px !important; text-decoration:none; display:block; text-align:left; }
#header-info .dropdown-content a:hover { background-color:#ececec; }
#header-info .dropdown:hover .dropdown-content { display:block; }
#header-info #mobile-menu .dropdown:hover .dropdown-content { right:0px; }
.arrow { border-color:#777777; border-style:solid; border-width:0 2px 2px 0; display:inline-block; padding:3px; margin:3px 0px 0px 5px; vertical-align:top; }
.down { transform:rotate(45deg); -webkit-transform:rotate(45deg); }
#header-info span:first-child { text-align:left; }
#page { padding:10px auto; text-align:left; }
#content { margin:auto; position:relative; min-height:500px; padding:15px 5% 40px 5%; }
#static { max-width:850px; margin:auto; }
.checkout-form { width:350px; display:inline-block; vertical-align:top; margin:10px; }
.checkout-form input { box-sizing:border-box; }
.td1 { text-align:right; width:35%; white-space:nowrap; }
.td2 { text-align:left; width:65%; }
.td2 span { display:inline-block; width:100px; text-align:right; }
.td2 div { padding:0px 0px 5px 0px; font-size:80%; color:#888888; }
.checkout-title { text-align:center; font-weight:bold; text-transform:uppercase; line-height:1; font-size:135%; padding:5px; background:#cccccc; min-width:330px; }
.double { text-align:center; }
.show { display:block; }
.hide { display:none; }
#layout-bottom { margin:0px 0px 50px 0px; padding:0px 0px 45px 0px; color:#888888; line-height:1.4; }
#layout-bottom.addfooter { padding-top:45px; border-top:1px solid #dddddd; }
#layout-bottom span { white-space:nowrap; }
#layout-bottom a { color:#888888; text-decoration:underline; }
#layout-bottom a:hover { color:#000000; }

/* PRODUCT PAGE */
#products { display:table-cell; width:100%; }
#categories { white-space:nowrap; padding:15px 15px 15px 0px; font-size:115%; }
#categories a { display:block; padding:0px 0px 15px 0px; color:#000000; text-decoration:none; }
#featured { text-align:center; }
#featured div { display:inline-block; background:#ffffff; width:auto; vertical-align:top; margin:50px 15px 0px 15px; box-sizing:border-box; position:relative; overflow:hidden; }
#featured a { font-size:90%; text-decoration:none; }
#featured img { display:block; margin:10px auto; width:100%; }
#featured .bestseller, #featured .newitem { display:inline-block; vertical-align:top; font-size:100%; line-height:28px; background:red; color:#ffffff; padding:0px 7px; border-radius:2px; font-weight:bold; transform:rotate(-45deg); text-align:center; position:absolute; top:-20px; left:-50px; width:160px; height:30px; }
#featured .bestseller { background:#2d70ff; }
#featured .newitem { background:#f50000; }
#main-product-layout { display:table; margin:auto; width:100%; border-spacing:30px; }
#prod-left { vertical-align:top; width:40%; }
#prod-right { vertical-align:top; width:60%; }
.listprice { font-size:130%; color:#adadad; padding:10px 0px; }
.listprice span { font-weight:bold; text-decoration:line-through; }
#pricedetail { border-bottom:1px solid #dddddd; padding:10px 0px; }
#price { white-space:nowrap; padding:0 30px 0 0; display:inline-block; vertical-align:middle; font-size:250%; }
#saleprice { font-weight:bold; }
.listprice-thumb { color:#adadad; text-decoration:line-through; }
.price-thumb { font-size:120%; font-weight:bold; }
#setup { margin:0px 0px 10px 0px; font-size:90%; font-weight:bold; text-transform:uppercase; color:#ef9f19; }
#minimum { font-size:150%; line-height:1.4; text-align:left; }
#largeorderminimum { font-weight:bold; line-height:1.4; color:red; padding:0px 0px 15px 0px; }
#production { margin:10px 0; font-size:100%; line-height:1.4; }
#production p { margin:3px 0px; }
#imagedisplay { text-align:center; position:relative; z-index:1; }
#imagedisplay .tile { border:1px solid #dddddd; }
#logoplacement { position:absolute; top:0px; left:0px; width:100%; height:580px; z-index:2; }
#imagethumbs { max-width:640px; margin:10px 0px; text-align:center; }
#imagethumbs img { margin:3px; }
#subtitle { max-width:640px; margin:10px 0px; text-align:center; font-weight:bold; }
.thumb-off { height:75px; padding:2px; background:#ffffff; outline:1px solid #dddddd; }
.thumb-on { height:75px; padding:2px; background:#ffffff; outline:3px solid #dddddd; }
.product-image { display:inline-block; vertical-align:top; margin:0px 5px 15px 0px; height:100px; }
.product-sizes { display:inline-block; vertical-align:top; }
.product-name { padding:0px 0px 4px 0px; }
.product-name a { font-size:90%; }
.sizeandcolor { margin:0px 0px 10px 0px; display:inline-block; }
.sizeandcolor div div div { display:inline-block; height:70px; text-align:center; vertical-align:top; font-size:16px; line-height:14px; }
.sizeandcolor div div div.firstpart { text-align:right; vertical-align:top; height:auto; padding:29px 0px 0px 0px; font-size:16px; }
.sizeandcolor div div div .qty-surcharge { display:block; height:11px; font-size:11px; color:grey; }
.sizeandcolor div div div .qty-size { display:block; height:16px; font-size:16px; text-transform:uppercase; }
.sizeandcolor div div div .qty-input { display:block; width:41px; line-height:1; padding:2px 0px 2px 4px; text-align:left; border:1px solid #888888; margin:1px 2px; height:16px; font-size:16px; }
.sizeandcolor div div div .qty-stock { display:block; padding:0px 0px 7px 0px; height:10px; font-size:11px; }
#sizechart { margin:25px 0 3px 0px; border-collapse:collapse; display:block; max-width:-moz-fit-content; max-width:fit-content; overflow-x:auto; white-space:nowrap; }
#sizechart td { border:1px solid #000000; padding:2px 7px; text-align:center; background:#ffffff; }
#sizechart tr:first-child td { font-weight:bold; }
#sizechart tr td:first-child { text-align:left; }
.td-image { text-align:left; height:30px; }
.td-image img { width:30px; height:30px; vertical-align:middle; }
.subtitle { font-size:135%; margin-bottom:0px; }
.relatedblock { display:block; margin:auto; max-width:910px; }
.related { margin-top:10px; }
.related a { background:#ffffff; padding:10px; max-width:150px; display:inline-block; vertical-align:top; text-align:center; font-size:90%; text-decoration:none; }
.related a img { max-width:100%; }
.related a span { font-size:120%; font-weight:bold; }

.tile { position:relative; width:100%; height:550px; max-width:640px; overflow:hidden; background:#ffffff; }
.photo { position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-size:contain; transition:transform .5s ease-out; }
.txt { position:absolute; z-index:2; right:0; bottom:10%; left:0; font-family:'Roboto Slab', serif; font-size:9px; line-height:12px; text-align:center; cursor:default; }
.x { font-size:32px; line-height:32px; }
.signin-form { max-width:380px; margin:30px auto; border:3px solid #dddddd; padding:0px 40px 20px 40px; text-align:left; }
.signin-form input[type=text], .signin-form input[type=password] { width:100%; box-sizing:border-box; }
.signin-form p { text-align:center; }
.signin-title { font-size:200%; text-align:center; }
.signin-label { text-align:left; display:inline-block; vertical-align:middle; width:95px; }
.signin-input { display:inline-block; vertical-align:middle; width:225px; }
.signin-button { margin:25px 0px; text-align:center; }
.signin-small { color:#888888; font-size:85%; }
.signin-red { text-align:center; color:red; }
@media (max-width:850px) { .signin-label, .signin-input { text-align:center; display:block; width:auto; margin:3px 0px; }
}

/* Modal */
.modal { display:none; position:fixed; z-index:200; padding-top:0px; left:0; top:0; width:100%; height:100%; overflow:hidden; background-color:rgb(0,0,0); background-color:rgba(0,0,0,0.4); }
.modal-content { position:relative; text-align:left; background:#ffffff; margin:auto; width:90%; height:auto; max-width:850px; max-height:850px; box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name:animatetop; -webkit-animation-duration:0.4s; animation-name:animatetop; animation-duration:0.4s; }
.modal-image { float:right; margin:0px 40px 20px 40px; box-shadow:0px 0px 8px #888888; }
.modal-title { font-weight:bold; margin:15px 0px 3px 0px; }
.modal-inset { margin:0px 3px 2px 3px; }
@-webkit-keyframes animatetop {
 from { top:-300px; opacity:0 }
 to { top:0; opacity:1 }
}
@keyframes animatetop {
 from { top:-300px; opacity:0 }
 to { top:0; opacity:1 }
}
.close { color:#888888; font-size:40px; margin:-15px -10px 0px 0px; font-weight:bold; position:absolute; top:20px; right:20px; z-index:300; }
.close:hover, .close:focus { color:#000; text-decoration:none; cursor:pointer; }
.modal-header { padding:2px 16px; background-color:#5cb85c; color:white; }
.modal-body { padding:2px 16px; }
.modal-footer { padding:2px 16px; background-color:#5cb85c; color:white; }
@media (max-width:600px) {
 .modal { padding-top:0px; }
 .modal-content { width:100%; }
 .modal-image { display:none; }
 }

/* mobile styles */

#mobile-menu { display:none; }

@media (max-width:1160px) {
 .sidebar { display:none; }
 #header-info { border-left:none; border-right:none; border-radius:0px; }
}

@media (max-width:1140px) {
 #header-info .navbar > a, #header-info span { display:none; }
 #mobile-menu { display:inline-block; float:right; }
 #productdetail { margin:auto; max-width:650px; }
 #main-product-layout { border-spacing:0; }
 #prod-left, #prod-right { display:block; width:auto; padding:0px 0px 30px 0px; }
 #checkoutbutton { float:none; }
 #shoppingcart { text-align:center; }
 #searchbox { position:relative; display:inline-block; top:auto; left:auto; right:auto; text-align:center; margin:20px auto 0 auto; }
 #header-logo { display:none; }
 #header-store { text-align:center; float:none; }
 #header-store img { height:auto !important; max-width:100%; }
 #header { padding:20px 15px 15px 15px; }
 #headsection { position:relative !important; }
}

@media (max-width:800px) {
 #header-info { padding:0px 7px !important; }
 #header-info .navbar > a { padding:20px 7px !important; }
 #slideshow-section { display:none; }
}

@media (max-width:500px) {
 #pricedetail .cell { display:block; }
 #minimum, #production { padding:0px; }
 .checkout-form { margin:20px 0px; }
 .checkout-form span span { display:none; }
 #sizechart { display:none; }
}