.ffffff,.fff,.FFFFFF,.FFF{border: 2px solid #ddd !important;}
.back-in-stock-button{background-color: #c29866; color: #ffffff;}
.cd-main-content .content-wrapper { padding: 45px 5% 3em; }
.cd-main-content .content-wrapper h1 { text-align: center; padding: 3em 0; font-size: 2rem; }
.cd-main-content::before { /* never visible - used to check MQ in jQuery */
display: none; content: 'mobile'; }
@media only screen and (min-width: 768px) {
.cd-main-content .content-wrapper { margin-left: 110px; padding-top: 55px; }
.cd-main-content .content-wrapper h1 { padding: 4em 0; font-size: 3.2rem; font-weight: 300; }
.cd-main-content::before { content: 'tablet'; }
}
@media only screen and (min-width: 1170px) {
.cd-main-content .content-wrapper { margin-left: 200px; }
.cd-main-content::before { content: 'desktop'; }
}
/* -------------------------------- 

Header

-------------------------------- */
.cd-main-header { position: absolute; z-index: 2; top:10px; left:30px; height: 45px; width:40px;  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.cd-main-header::after { clear: both; content: ""; display: table; }
@media only screen and (min-width: 768px) {
.cd-main-header { position: fixed; height: 55px; }
}
.cd-logo { float: left; display: block; margin: 11px 0 0 5%; }
.cd-logo img { display: block; }
@media only screen and (min-width: 768px) {
.cd-logo { margin: 16px 0 0 36px; }
}
.cd-nav-trigger { /* navigation trigger - visible on mobile devices only */
float: left;  display: block; width: 40px; height: 44px; margin-left: 0%; /* hide text */
overflow: hidden; white-space: nowrap; color: transparent; }
.cd-nav-trigger span, .cd-nav-trigger span::before, .cd-nav-trigger span::after { /* hamburger icon in CSS */
position: absolute; display: inline-block; height: 3px; width: 40px; background: #ffffff; }
.cd-nav-trigger span { /* line in the center */
position: absolute; top: 50%; right: 0px; margin-top: 0px; -webkit-transition: background 0.2s; -moz-transition: background 0.2s; transition: background 0.2s; }
.cd-nav-trigger span::before, .cd-nav-trigger span::after { /* other 2 lines */
content: ''; right: 0; /* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-transition: -webkit-transform 0.2s; -moz-transition: -moz-transform 0.2s; transition: transform 0.2s; }
.cd-nav-trigger span::before { /* menu icon top line */
top: -10px; }
.cd-nav-trigger span::after { /* menu icon bottom line */
top: 10px; }
.cd-nav-trigger.nav-is-visible span { /* hide line in the center */
background: rgba(255, 255, 255, 0); }
.cd-nav-trigger.nav-is-visible span::before, .cd-nav-trigger.nav-is-visible span::after { /* keep visible other 2 lines */
background: white; }
.cd-nav-trigger.nav-is-visible span::before { -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg); -moz-transform: translateX(4px) translateY(-3px) rotate(45deg); -ms-transform: translateX(4px) translateY(-3px) rotate(45deg); -o-transform: translateX(4px) translateY(-3px) rotate(45deg); transform: translateX(5px) translateY(-5px) rotate(45deg); }
.cd-nav-trigger.nav-is-visible span::after { -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg); -moz-transform: translateX(4px) translateY(2px) rotate(-45deg); -ms-transform: translateX(4px) translateY(2px) rotate(-45deg); -o-transform: translateX(4px) translateY(2px) rotate(-45deg); transform: translateX(5px) translateY(3px) rotate(-45deg); }
@media only screen and (min-width: 768px) {
.cd-nav-trigger { display: none; }
}
.cd-search { position: relative; margin: 1.2em 5% 0.6em; }
.cd-search.is-hidden { opacity: 0; }
.cd-search::before { /* lens icon */
content: ''; position: absolute; left: 8px; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); height: 16px; width: 16px;  }
.cd-search input { padding-left: 32px; width: 100%; height: 36px; border: none; border-radius: .25em; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; }
.cd-search input:focus { outline: none; }
@media only screen and (min-width: 768px) {
.cd-search { float: left; display: inline-block; width: 250px; height: 100%; margin: 0 0 0 2.5em; }
.cd-search.is-hidden { /* reset style */
opacity: 1; }
.cd-search::before { background-position: 0 -16px; left: 1em; }
.cd-search form, .cd-search input { height: 100%; width: 100%; }
.cd-search input { border: none; padding-left: 2.6em; border-radius: 0; background-color: #3e454c; border-left: 1px solid #51575d; color: #ffffff; }
 .cd-search input::-webkit-input-placeholder {
 color: #777c81;
}
 .cd-search input::-moz-placeholder {
 color: #777c81;
}
 .cd-search input:-moz-placeholder {
 color: #777c81;
}
 .cd-search input:-ms-input-placeholder {
 color: #777c81;
}
}
/* -------------------------------- 

Top Navigation

-------------------------------- */
.cd-nav { /* top nav - not visible on mobile devices */
display: none; }
@media only screen and (min-width: 768px) {
.cd-nav { display: block; float: right; height: 100%; }
}
.cd-top-nav > li > a::before { /* reset style */
display: none; }
.cd-top-nav > li a { padding: 1em 5% !important; }
.cd-top-nav img { /* avatar image */
position: absolute; left: 1.8em; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); height: 20px; width: 20px; border-radius: 50%; display: none; }
@media only screen and (min-width: 768px) {
.cd-top-nav { height: 100%; }
.cd-top-nav a { display: block; font-size: 1.4rem; color: #ffffff; }
.cd-top-nav > li { display: inline-block; margin-right: 1em; height: 100%; }
.cd-top-nav > li:last-of-type { margin-right: 0; }
.cd-top-nav > li a { padding: 1em .6em !important; }
.cd-top-nav img { display: block; }
}
@media only screen and (min-width: 1170px) {
.cd-top-nav li:not(.has-children) a:hover { color: #1784c7; }
}
/* -------------------------------- 

Sidebar

-------------------------------- */
.cd-side-nav { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; padding: 40px 0 0; background-color: #2c3136; visibility: hidden; opacity: 0; max-height: 100vh; overflow: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s; -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s; transition: opacity 0.2s 0s, visibility 0s 0.2s; }
.cd-side-nav.nav-is-visible { opacity: 1; visibility: visible; overflow: visible; -webkit-overflow-scrolling: touch; -webkit-transition: opacity 0.2s 0s, visibility 0s 0s; -moz-transition: opacity 0.2s 0s, visibility 0s 0s; transition: opacity 0.2s 0s, visibility 0s 0s; max-height: none; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); }
.cd-side-nav > ul { padding: 0.6em 0; }
.cd-side-nav > ul:last-of-type { padding-bottom: 0; }
/* .cd-side-nav .cd-label */
.cd-side-nav a {  padding: 0em 30px; line-height:40px; }
.cd-side-nav .cd-label { text-transform: uppercase; font-weight:normal;  color: #fff; font-size: 22px; letter-spacing: .1em; }
.cd-side-nav a { position: relative; color: #ffffff; font-size: 17px; line-height:24px; }
.cd-side-nav ul.cd-top-nav > li:last-of-type > a { border-bottom: none; }
.cd-side-nav > ul > li > a { padding-left: calc(5% + 24px);  }
.cd-side-nav > ul > li > a::before { /* icon before item name */
position: absolute; content: ''; left: 5%; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); height: 16px; width: 16px;}
.cd-side-nav > ul > li.overview > a::before { background-position: -64px 0; }
.cd-side-nav > ul > li.notifications > a::before { background-position: -80px 0; }
.cd-side-nav > ul > li.comments > a::before { background-position: -48px 0; }
.cd-side-nav > ul > li.bookmarks > a::before { background-position: -32px 0; }
.cd-side-nav > ul > li.images > a::before { background-position: 0 0; }
.cd-side-nav > ul > li.users > a::before { background-position: -16px 0; }
.cd-side-nav .count { /* notification badge */
position: absolute; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: calc(5% + 16px + 0.4em); padding: 0.2em 0.4em; background-color: #ff7e66; border-radius: .25em; color: #ffffff; font-weight: bold; font-size: 1.2rem; text-align: center; }
.cd-side-nav .action-btn a { display: block; margin: 0 5%; padding: 1em 0; background-color: #1784c7; border-radius: .25em; border: none; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2); text-align: center; color: #ffffff; font-weight: bold; }
.cd-side-nav .action-btn a::before { display: none; }
@media only screen and (min-width: 768px) {
.cd-side-nav { position: relative; float: left; top: auto; width: 110px; min-height: 100vh; padding-top: 55px; /* reset style */
visibility: visible; opacity: 1; overflow: visible; max-height: none; }
.cd-side-nav.nav-is-visible { box-shadow: none; }
.cd-side-nav.is-fixed { position: fixed; }
.cd-side-nav > ul { /* reset style */
padding: 0; }
.cd-side-nav .cd-label { /* remove labels on minified version of the sidebar */
display: none; }
.cd-side-nav a { font-size: 1.2rem; text-align: center; }
.cd-side-nav > ul > li > a { padding: calc(2.2em + 24px) 0 2.4em; }
.cd-side-nav > ul > li > a::before { left: 50%; right: auto; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); top: 2.4em; }
.cd-side-nav .active > a { /* current page */
box-shadow: inset 3px 0 0 #1784c7; background-color: #33383e; }
.cd-side-nav .action-btn a { margin: 1em 10% 0; }
.cd-side-nav .count { height: 8px; width: 8px; border-radius: 50%; box-shadow: 0 0 6px rgba(0, 0, 0, 0.2); padding: 0; top: 2em; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); left: calc(50% + 5px); right: auto; color: transparent; }
}
@media only screen and (min-width: 1170px) {
.cd-side-nav { width: 200px; }
.cd-side-nav > ul { padding: 0.6em 0; }
.cd-side-nav > ul > li:not(.action-btn):hover > a { background-color: #33383e; }
.cd-side-nav > ul > li > a { padding: 1em 1em 1em 42px; text-align: left; border-bottom: none; }
.cd-side-nav > ul > li > a::before { top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 18px; }
.cd-side-nav .cd-label { display: block; padding: 1em 18px; }
.cd-side-nav .action-btn { text-align: left; }
.cd-side-nav .action-btn a { margin: 0 18px; }
.no-touch .cd-side-nav .action-btn a:hover { background-color: #1a93de; }
.cd-side-nav .count { /* reset style */
color: #ffffff; height: auto; width: auto; border-radius: .25em; padding: .2em .4em; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 18px; left: auto; box-shadow: none; }
}
.has-children ul { position: relative; width: 100%; padding-left:8%; display: none; padding-bottom:10px; }
.has-children ul a{  color:#999; font-size:15px;}
.has-children > a::after { /* arrow icon */
position: absolute; content: ''; height: 16px; width: 16px; right: 5%; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.has-children.selected > ul { display: block; }
.has-children.selected > a::after { -webkit-transform: translateY(-50%) rotate(180deg); -moz-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -o-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); }
@media only screen and (min-width: 768px) {
.has-children { position: relative; }
.has-children ul { position: absolute; top: 0; left: 100%; width: 160px; padding: 0; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); }
.has-children ul a { text-align: left; border: none; padding: 1em; }
.no-touch .has-children ul a:hover { color: #1784c7; }
.has-children > a::after { display: none; }
.cd-side-nav .has-children.selected > a { /* focus state -> show sub pages */
background-color: #33383e; }
.cd-top-nav .has-children { position: relative; background-color: #2c3136; }
.cd-top-nav .has-children > a { height: 100%; padding: 0 calc(1.8em + 22px) 0 calc(1.8em + 26px) !important; line-height: 55px; }
.cd-top-nav .has-children > a::after { display: block; right: 1.8em; }
.cd-top-nav .has-children ul { background-color: #1c1f22; width: 200px; top: 100%; right: 0; left: auto; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2); }
.cd-top-nav .has-children ul a { padding-left: 18px !important; }
}
@media only screen and (min-width: 1170px) {
.has-children > ul { width: 100%; z-index: 1; }
.has-children ul a { padding-left: 18px; }
.has-children.active > ul { /* if the item is active, make the subnavigation visible */
position: relative; display: block; /* reset style */
left: 0; box-shadow: none; }
.no-touch .cd-side-nav .has-children:hover > ul, .cd-side-nav .has-children.hover > ul { /* show subnavigation on hover */
display: block; opacity: 1; visibility: visible; }
}