/************
RESET
*************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';}
:focus {outline: 0;}
table {border-collapse: collapse;border-spacing: 0;}
/*****************
TYPOGRAPHY
******************/
html { height: 100%; width: 100%; margin: 0; padding: 0; left: 0; top: 0; font-size: 100%; }
body{font-family:Arial, Helvetica, sans-serif; font-size:16px; line-height:1.5; color:#403E40; cursor:default;}
p{margin:0 0 10px;}
li{margin:0 0 10px; padding:0;}
h1, h2, h3, h4, h5, h6 {margin:0 0 1em;}
h1{font-size:20px; text-transform:uppercase;}
h2{font-size:18px; line-height:1.2;}
h3{font-size:15px; line-height:1.2;}
h4{}
h5{}
h6{}
a{color:#A9A487; text-decoration:none;}
a:hover{color:#898467;}
/* ::selection {background:#5cb7e0; color:#ffffff;} */
/* ::-moz-selection {background:#5cb7e0; color:#ffffff;} */
/**************
HELPERS
***************/
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-center{text-align:center;}
.left{float:left;}
.right{float:right;}
.clear{clear:both;}
.overflow{overflow:hidden;}
.wide{width:100%;}
.uppercase { text-transform:uppercase; }
.mobile-only-d-block { display:none; }
/**************
INPUTS
***************/
input, textarea, button{font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:1; color:#484848;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color:#989898;}
input::-moz-placeholder, textarea::-moz-placeholder {color:#989898; opacity:1;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:#989898;}
input::input-placeholder, textarea::input-placeholder {color:#989898;}
input[type=date]::-webkit-inner-spin-button {-webkit-appearance:none; display:none;}
input[type=date]::-webkit-calendar-picker-indicator {-webkit-appearance:none; display:none;}
input[type=date]::-webkit-clear-button{display:block; -webkit-appearance:none;}
.textbox { background:#ffffff; height:34px; padding:0 10px; outline:none; border:1px solid #B5CFBF; border-radius:0; box-shadow:none; -webkit-appearance:none; appearance:normal; }
.textbox:focus { border-color:#403E40; }
textarea.textbox { }
.textbox:focus { }
.textbox.error { border-color:#d13a02; }
/***************
BUTTONS
****************/
button { -webkit-appearance:none; appearance:normal;}
.button { }
.button:hover { }
.button:active { }
.download-button { display:block; width:41px; height:36px; line-height:36px; overflow:hidden; font-size:26px; text-align:center; background:#96AF9F; color:#fff; border-radius:6px 0 0 0; }
.download-button:hover { background:#403E40; color:#fff; }
.order-button { display:block; width:41px; height:36px; line-height:36px; overflow:hidden; font-size:26px; text-align:center; background:#96AF9F; color:#fff; border-radius:0 6px 0 0; }
.order-button:hover { background:#403E40; color:#fff; }
.x-button { cursor:pointer; font-size:22px; color:#96AF9F; }
.x-button:hover { color:#403E40; }
.send-button { height:42px; border:none; margin:0; padding:0 14px; outline:none; cursor:pointer; line-height:38px; overflow:hidden; font-size:20px; font-weight:bold; text-transform:uppercase; text-align:center; background:#96AF9F; color:#fff; border-radius:0 6px 0 0; }
.send-button:hover { background:#403E40; color:#fff; }
/************
STYLE
*************/
html{background:#ffffff; height:100%; }
body{background:#ffffff; height:100%; min-width:320px;}
#wrapper{min-height:100%; height:auto !important; height:100%; position:relative;}
.layout{max-width:1100px; margin:0 auto;padding:0 15px;}
.buf-info { margin:1.2em 0; clear:left; }
.buf-info p { margin:0.2em 0; }
.buf-info a { text-decoration: underline; }
/* HEADER */
#header {overflow:hidden; background:#F0F5F2;}
#header > .top { padding-top:35px; padding-bottom:35px; }
#site-logo { display:inline-block; cursor:pointer; }
#site-logo img { height:104px; width:auto; }
/* heared-nav-wrap */
.header-nav-wrap { float:right; font-size:20px; padding-top:55px; }
.header-nav-info { text-align:right; font-size:13px; font-weight:bold; padding-top:1em; }
.header-nav { margin:0; white-space:nowrap; }
.header-nav > li { display:inline-block; list-style:none; margin:0 0 0 3em; }
.header-nav > li > a { color:#484848; }
.header-nav > li > a:hover { color:#96AF9F; }
/* site-search */
.site-search { position:relative; }
.site-search .search-field { position:absolute; top:-10px; right:-15px; width:0; opacity:0; height:auto; padding:0.8em 5em 0.8em 0.8em; cursor: default; background: #fff; border:1px solid #B5CFBF; border-radius:0; font-size: 18px; color:#484848; box-shadow:none;
transition: all 0.2s ease-out;
}
.site-search.open .search-field { width:250px; opacity:1; cursor:text; }
.site-search .search-button { position:relative; cursor:pointer; background:none; border:none; outline: none; box-shadow:none; margin:0; padding:0; font-size:20px; -webkit-appearance:none; -moz-appearance:none; appearance: none; }
.site-search .search-button:hover { color:#96AF9F; }
.orange-line { background:url(/files/img/orange-line.png) repeat-x; height:107px; }
/* cart */
.cart-button { display:block; cursor:pointer; position:relative; }
.cart-button .total-amount { display:inline-block; min-width:13px; padding:0 5px; background:#484848; border-radius: 18px; vertical-align:text-bottom;
color:#ffffff; font-size:12px; line-height:22px; font-style:normal; text-align:center; font-weight:bold;
}
.cart-button:hover .total-amount { background:#96AF9F; }
.cart-button .total-amount.hide { display: none; }
.cart-button .total-amount.highlight { background:#96AF9F; }
/* cart-notification */
.cart-notification { position:fixed; top:0; left:0; width:100%; z-index:9999; display:none; }
.cart-notification .layout { position:relative; }
.cart-notification-button { display:block; position:absolute; top:10px; right:15px; min-width:30px; height:40px; background:#96AF9F; padding:0 10px; border-radius:99px;
color:#fff; line-height:40px; text-align:center; font-weight:bold; font-size:16px; }
.cart-notification-button:hover { background:#403E40; color:#fff; }
/* moblie-nav */
.header-nav > .mobile-nav-wrap { display:none; }
.mobile-nav-toggle { display:block; padding:8px 10px 8px 10px; margin-right:-10px; width:18px; text-align:center; color:#484848 !important; }
.mobile-nav-toggle .close { display:none; }
.mobile-nav-toggle.opened .open { display:none; }
.mobile-nav-toggle.opened .close { display:block; }
.mobile-nav-menu { display:none; position:absolute; top:100%; right:0; width:100%; max-width:640px; background:#F0F5F2; z-index:9998; white-space:normal; box-shadow:0 2px 2px rgba(0,0,0,0.2); }
.mobile-nav-toggle.opened + .mobile-nav-menu { display:block; }
.mobile-nav-menu .menu { margin:20px 0 0 0; }
.mobile-nav-menu .menu:first-child { margin:0; }
.mobile-nav-menu .menu li { margin:0; }
.mobile-nav-menu .menu li { margin:0; position:relative; }
.mobile-nav-menu .menu li a { display:block; padding: 10px 40px 10px 15px; }
.mobile-nav-menu .submenu { background:rgba(0,0,0,0.04); padding:10px 0; }
.mobile-nav-menu .submenu li { font-size:0.94em; padding:0; }
.mobile-nav-menu .submenu li > a { padding-left: 30px; }
.mobile-nav-menu .submenu li li > a { padding-left: 45px; }
.mobile-nav-menu .submenu li li li > a { padding-left: 60px; }
.mobile-nav-menu .expand-bnt { cursor:pointer; position:absolute; top:0; right:5px; padding:5px 10px; font-size:20px; }
.mobile-nav-menu .expand-bnt:hover { color:#898467; }
/* MAIN */
#main { padding:30px 0;}
#main.faded { opacity:0.3; pointer-events:none; }
#main-content { padding:6px 0 30px 30px; overflow:hidden; }
/* breadcrumb */
.breadcrumb { font-size:15px; color:#ddd; padding:0; margin:0 0 1.2em 0; font-weight:bold; }
/* category item */
.category-items { padding:0 0 20px 0; margin:0 -2%; width:auto; }
.category-item { position:relative; box-sizing: border-box; border:1px solid #CBDDD2; }
.category-item:nth-child(3n+1) { clear:left; }
.category-item a { display:block; color:#403E40;}
.category-item a > img { display:block; transition:opacity 100ms linear; margin-bottom:50px; width:100%; height:auto; }
.category-item-title { display:block; position:absolute; bottom:0; left:0; width:100%; min-height:40px; line-height:40px; background:#CBDDD2; text-align:center; padding:5px 0;}
.category-item-title i { display:inline-block; padding:0 10px; line-height:1.2; vertical-align:middle; font-style:normal; font-weight:bold; font-size:16px; text-transform:uppercase; }
.category-item:hover { border-color:#accfc7;; }
.category-item:hover a > img { opacity:0.7; }
/* publication item */
.publication-items { margin:0 -2%; width:auto; }
.publication-item { position:relative; }
.publication-item:nth-child(3n+1) { clear:left; }
.publication-image-link { cursor:pointer; display:block; box-sizing: border-box; border:1px solid #CBDDD2; }
.publication-image-link img { display:block; width:100%; height:auto; transition:opacity 100ms linear; }
.publication-image-link:hover { border-color:#accfc7; }
.publication-image-link:hover img { opacity:0.7; }
.publication-item .text-wrap { padding:10px 0 0; }
.publication-title { margin:0 0 5px 0; }
.publication-title a { color:#484848; }
.publication-title a:hover { color:#96AF9F; }
.publication-subtitle { font-size:0.9em; line-height:1; margin:0; }
.buttons-wrap { padding:10px 0 0; overflow:hidden; }
.publication-item .download-button { }
.publication-item .order-button { display:inline-block; margin-left:4px; vertical-align:middle; }
.publication-item .in-stock { clear:right; font-size:12px; color:#989898; padding:12px 0 0 0; }
.publication-item .right + .in-stock{ padding:5px 0 0 0; }
/* single publication */
.publication { margin:0 -2%; }
.publication-image { width:100%; border:1px solid #CBDDD2; box-sizing:border-box; }
.publication-content { overflow:hidden; padding:0; }
.publication .order-button { display:inline-block; margin-left:4px; vertical-align:middle; }
.publication .in-stock { clear:right; font-size:12px; color:#989898; padding:12px 0 0 0; }
.publication .right + .in-stock{ padding:5px 0 0 0; }
/* change-amount spinner */
.change-amount-wrap { }
.change-amount-wrap .ui-spinner { border-radius:0; border:none; text-align:center; white-space:nowrap; font-size:0.94em; width:114px; }
.change-amount.ui-spinner-input { width:34px; padding:0; height:34px; margin:0; text-align:center; border:1px solid #96AF9F; border-radius:0; }
.change-amount-wrap .ui-spinner-button { position:static; height:34px; width:34px; border:1px solid #96AF9F !important; border-radius:0 !important; background:#96AF9F; }
.change-amount-wrap .ui-spinner-button:hover { border-color:#403E40 !important; background:#403E40; }
.change-amount-wrap .ui-spinner-up { float:right; }
.change-amount-wrap .ui-spinner-down { float:left; }
.change-amount-wrap .ui-button-text { padding:0 !important; text-align:center !important; line-height:34px !important; font-weight:normal; font-size:22px; font-weight:bold; font-family:sans-serif; color:#fff; }
/* cart-table */
.cart-table { width:550px; margin-bottom:30px; }
.cart-table td { vertical-align:middle; padding:5px; }
.cart-table td:first-child { padding-left:0; }
.cart-table td.remove-col { width:36px; text-align:center; }
.cart-table td.remove-col .x-button { margin:0 auto; }
.cart-table td.spinner-col { width:114px; }
.cart-table tr + tr.no-items { display:none; }
.cart-instock-error{ color:#d13a02; font-size:12px; }
/* order-form */
#order-form { width:497px; }
#order-form .frow { margin-bottom:15px; }
#order-form .frow label { display:inline-block; width:100px; padding-right:10px;}
#order-form .frow .textbox { width:360px; }
#order-form .frow .textbox.of-zip { width:80px; }
#order-form .frow .textbox.of-city { width:189px; }
.form-error-msg { display:inline-block; width:300px; margin-right:20px; color:#d13a02; vertical-align:middle; line-height:1.2; }
/* SIDEBAR */
#sidebar { float:left; width:235px; padding-right:25px; padding-bottom:20px; border-right:2px solid #F0F5F2; }
#sidebar > .menu { border-top:2px solid #F0F5F2; padding:15px 0; }
#sidebar > .menu:first-child { border:none; padding-top:0; }
#sidebar > .menu:first-child > li:first-child { margin-top:10px; }
.menu li a.sidemenu-link-btn { display: block; padding:15px; margin-top:2em; color:#fff; background:#403E40; font-weight:bold; }
.menu li a.sidemenu-link-btn:hover { color:#fff; background:#302E30; }
/* menu */
.menu { font-size:16px; }
.menu a { color:#484848; }
.menu a:hover { color:#898467; }
.menu li { margin:15px 0; line-height:1.2; }
.menu li.current > a { color:#898467; font-weight:bold;}
.menu li.active > a { color:#484848; font-weight:bold;}
.menu > li > a { font-size:17px;}
.menu > li { margin:20px 0; }
.submenu { display:none; }
.submenu li { padding: 0 0 0 10px; }
.menu li.expand > .submenu { display:block; }
/* SITEMAP */
.sitemap { margin:0 -2%; }
.sitemap a { color:#484848; }
.sitemap a:hover { color:#898467; }
.sitemap .category-wrap { margin:0 0 30px; }
.sitemap .category-wrap h1 { font-size:17px; border-bottom:1px solid #989898; line-height:1.2; padding-bottom:8px; margin-bottom:8px; }
.sitemap li.category > a { font-weight:bold; }
.sitemap .pub-list { padding: 0 0 0 20px; }
.sitemap .pub-list li { margin:0;}
/* SEARCH */
.search-result-title { border-bottom:1px solid #b5b5b5; padding-bottom:10px; margin-bottom:25px; font-size:18px; }
.publications-search-result { }
.publications-search-result li { margin-bottom:25px; }
.publications-search-result h2 { margin:0 0 2px; font-size:18px; }
.publications-search-result h2 a { color:#484848; }
.publications-search-result h2 a:hover { color:#898467; }
.publications-search-result { line-height:1; }
.publications-search-result li + .no-results { display:none; }
.pagination a, .pagination span { margin:0 15px 0 0; color:#484848; font-weight:normal; }
.pagination .page-current { font-weight:bold; }
@media only screen and (max-width: 1018px) {
#sidebar { width: 180px; padding-right: 20px; }
#sidebar .menu { font-size: 14px; }
#sidebar .menu > li > a { font-size: 15px; }
#main-content { padding-left:20px; }
}
@media only screen and (max-width: 959px) {
.desktop-only { display:none; }
.mobile-only-d-block { display:block; }
#header { overflow:visible; }
#header > .top { padding-top:15px; padding-bottom:15px; position:relative; }
#site-logo img { height: 40px; }
.header-nav-wrap { padding-top:0; }
.header-nav-info { display:none; }
.header-nav > li { margin:0; }
.site-search { position:static; }
.site-search .search-button { padding:13px 10px; }
.site-search .search-field { font-size:15px; top:100%; right:0; padding-right: 2.8em; border-width:2px; box-sizing:border-box; z-index:9990; }
.site-search.open .search-field { width:100%; z-index:9999; }
.cart-button { padding:8px 10px; }
.header-nav > .mobile-nav-wrap { display:inline-block; }
#sidebar { display: none; }
#main { padding:20px 0; }
#main-content { padding:5px 0 20px 0; }
.breadcrumb { margin-bottom:1em; }
.cart-table, .cart-table tbody, .cart-table tr, .cart-table td { display:block; width:auto; }
.cart-table tr { overflow:hidden; position:relative; padding:10px 0; border-top:1px solid #F0F5F2; }
.cart-table tr:first-child { border-top:none; }
.cart-table td { padding:0; }
.cart-table td.spinner-col { float:left; margin-top:10px; }
.cart-table td.remove-col { float:right; padding:13px 0 0 0; }
#order-form { width:auto; }
#order-form .frow label { display:block; width:auto; padding:0 !important; }
#order-form .frow .textbox, #order-form .frow .textbox.of-zip, #order-form .frow .textbox.of-city { width:100%; box-sizing:border-box; }
#order-form .frow .frow-col { display:table-cell; width:70%; }
#order-form .frow .frow-col:first-child { width:30%; padding-right:20px; }
.form-error-msg { display:block; width:auto; padding:0; margin:0 0 1em 0; text-align:right; }
}
@media only screen and (max-width: 719px) {
#main.faded { display:none; }
#main .category-item { margin-top:0.5em; margin-bottom:0.5em; height:200px; overflow:hidden; }
#main .category-item a > img { margin-top:-50px; }
/*.publication-image-link { height: 250px; overflow: hidden; }
.publication-image-link img { margin-top:-75px; }*/
}