/* fonts */
@font-face {
  font-family: 'brandon_grotesqueblack';
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/brandon_blk-webfont.eot");
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/brandon_blk-webfont.eot?#iefix") format("embedded-opentype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/brandon_blk-webfont.woff") format("woff"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/brandon_blk-webfont.ttf") format("truetype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/brandon_blk-webfont.svg#brandon_grotesqueblack") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'open_sans';
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Regular-webfont.eot");
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Regular-webfont.woff") format("woff"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Regular-webfont.ttf") format("truetype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Regular-webfont.svg#open_sansregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'open_sans';
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Bold-webfont.eot");
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Bold-webfont.woff") format("woff"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Bold-webfont.ttf") format("truetype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/OpenSans-Bold-webfont.svg#open_sansbold") format("svg");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'oswald';
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/oswald-regular-webfont.eot");
  src: url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/oswald-regular-webfont.eot?#iefix") format("embedded-opentype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/oswald-regular-webfont.woff") format("woff"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/oswald-regular-webfont.ttf") format("truetype"), url("//cors-cdp.s3.amazonaws.com/fonts/zendesk_hc/oswald-regular-webfont.svg#oswaldbook") format("svg");
  font-weight: normal;
  font-style: normal;
}

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }
body { margin: 0; padding: 0; background: #fff; color: #000; font-family: open_sans; -webkit-font-smoothing: antialiased; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }
a { text-decoration: none; }
img { max-width: 100%; height: auto; border: 0; display: block; }
p, h1 { margin: 0; }

.clearfix:after { content: ""; display: table; clear: both; }
.tagline { font-family: brandon_grotesqueblack; font-size: 18px; line-height: normal; color: #000; text-transform: uppercase; text-align: center; color: #2d2d4b; }

/* logo */
svg.logo { display: block; }
svg.logo .colorA { fill: #2e2e4c; }
svg.logo .colorB { fill: #0e6aa9; }
svg.logo .colorC { fill: #2a9bd6; }
svg.logo .colorD { fill: #27c4f3; }

/* error */
.cdp_widget_error { background: #eff4f5; text-align: center; font-size: 14px; padding: 20px; }
.cdp_widget_error svg.logo { width:104px; height: 105px; margin: 0 auto 20px; }

/* widget */
.cdp_widget { background: #eff4f5; border: 1px solid #dde5e7; padding: 20px; position: relative; overflow: hidden; }
.cdp_widget figure { float: left; width: 150px; margin: 0 25px 0 0; }
.cdp_widget .content { overflow: hidden; }
.cdp_widget h1 { font-family: brandon_grotesqueblack; font-size: 18px; line-height: 22px; font-weight: normal; text-transform: uppercase; margin: 2px 0 0;}
.cdp_widget h1 a { color: #2d2d4b; -webkit-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; }
.cdp_widget h1 a:hover { color: #0e6aa9; }
.cdp_widget .description { font-size: 14px; line-height: 18px; color: #7f888f; margin: 10px 0 0; display: none; }
.cdp_widget .authors { font-size: 12px; color: #2d2d4b; margin: 5px 0 0; display: none; }
.cdp_widget .wrap { margin-top: 20px; }
.cdp_widget .prices { float: left; height: 32px; line-height: 27px; background: #dde6e6; border-radius: 16px 0 0 16px; padding: 0 10px 0 15px; font-family: oswald; color: #0e6aa9; font-size: 16px; }
.cdp_widget .price sup { font-size: 65%; text-decoration: underline; vertical-align: super; margin-left: 1px; display: inline-block; -webkit-transform: translate(0, 1px); }
.cdp_widget .price.old { font-size: 12px; color: #7f888f; margin-right: 5px; position: relative; display: none; }
.cdp_widget .price.old:after { content: ''; display: block; height: 1px; width: 120%; background: #7f888f; position: absolute; left: -3px; top: 8px; -webkit-transform: rotate(165deg); transform: rotate(165deg); }
.cdp_widget .mores { overflow: hidden; float: left; height: 32px; margin: 0; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.cdp_widget .more { float: left; height: 32px; background: #2e2e4c; color: #fff; padding: 0 10px; margin: 0 11px 0 0; position: relative; font-family: brandon_grotesqueblack; text-transform: uppercase; font-size: 14px; line-height: 33px; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.cdp_widget .more:after { content: ''; position: absolute; right: -11px; top: -1px; display: block; width: 0; height: 0; border-style: solid; border-width: 17px 0 17px 12px; border-color: transparent transparent transparent #2e2e4c; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.cdp_widget .more svg { display: inline-block; width: 23px; height: 17px; margin: 0 5px 0 0; position: relative; top: 3px; }
.cdp_widget .more svg .path { fill: #fff; }
.cdp_widget .mores:hover { margin-right: -10px; }
.cdp_widget .mores:hover .more { background: #0e6aa9; padding: 0 15px; }
.cdp_widget .mores:hover .more:after { border-color: transparent transparent transparent #0e6aa9; }
.cdp_widget .out_of_stock { display: none; }
.cdp_widget .ribbon { display: none; height: 21px; font-family: brandon_grotesqueblack; font-size: 12px; line-height: 21px; font-weight: normal; text-transform: uppercase; color: #fff; position: absolute; left: 100%; top: 0; overflow: hidden; 
  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
  -webkit-transform-origin: 0 100%; transform-origin: 0 100%;
  -webkit-transform: rotate(90deg) translate(-31px, 21px); transform: rotate(90deg) translate(-31px, 21px);
}
.cdp_widget .ribbon span { display: none; padding: 0 10px 0 20px; background: #4b6699; margin-right: 11px; }
.cdp_widget .ribbon:after { content: ''; position: absolute; right: 0; top: -1px; display: block; width: 0; height: 0; border-style: solid; border-width: 23px 0 0 12px; border-color: transparent transparent transparent #4b6699; }
.cdp_widget:hover .ribbon { 
  -webkit-transform: rotate(90deg) translate(-21px, 21px); transform: rotate(90deg) translate(-21px, 21px);
}
.cdp_widget[data-type="book"] .ribbon span { background: #35a379; }
.cdp_widget[data-type="book"] .ribbon:after { border-color: transparent transparent transparent #35a379; }
.cdp_widget[data-type="movie"] .ribbon span { background: #6d3681; }
.cdp_widget[data-type="movie"] .ribbon:after { border-color: transparent transparent transparent #6d3681; }
.cdp_widget[data-type="music"] .ribbon span { background: #fb7532; }
.cdp_widget[data-type="music"] .ribbon:after { border-color: transparent transparent transparent #fb7532; }
.cdp_widget[data-type="hardware"] .ribbon span { background: #e5412b; }
.cdp_widget[data-type="hardware"] .ribbon:after { border-color: transparent transparent transparent #e5412b; }
.cdp_widget[data-type="hobby"] .ribbon span { background: #d26087; }
.cdp_widget[data-type="hobby"] .ribbon:after { border-color: transparent transparent transparent #d26087; }

.cdp_widget[data-has-authors="true"] .authors { display: block; }
.cdp_widget[data-has-description="true"] .description { display: block; }
.cdp_widget[data-has-promotion-price="true"] .price.old { display: inline; }
.cdp_widget[data-in-stock="false"] .more { display: none; }
.cdp_widget[data-in-stock="false"] .out_of_stock { display: inline; }
.cdp_widget[data-preorder="true"] .ribbon, .cdp_widget[data-promotion="true"] .ribbon, .cdp_widget[data-new="true"] .ribbon, .cdp_widget[data-sale="true"] .ribbon { display: block; }
.cdp_widget[data-new="true"]:not([data-preorder="true"]):not([data-promotion="true"]):not([data-sale="true"]) .ribbon .new { display: block; }
.cdp_widget[data-preorder="true"]:not([data-promotion="true"]):not([data-sale="true"]) .ribbon .preorder { display: block; }
.cdp_widget[data-promotion="true"]:not([data-sale="true"]) .ribbon .promotion { display: block; }
.cdp_widget[data-sale="true"] .ribbon .sale { display: block; }

.cdp_widget[data-layout="vsmall"] { padding: 15px; }
.cdp_widget[data-layout="vsmall"] header { margin-top: 5px; overflow: hidden; }
.cdp_widget[data-layout="vsmall"] h1 { margin: 0; display: inline; }
.cdp_widget[data-layout="vsmall"][data-has-authors="true"] .authors { margin: 0; display: inline; }
.cdp_widget[data-layout="vsmall"][data-has-authors="true"] h1:after { content: ','; }
.cdp_widget[data-layout="vsmall"] .wrap { margin: 0; float: right; }

@media (max-width: 479px) {
  .cdp_widget { text-align: center; }
  .cdp_widget .wrap { display: inline-block; }
  .cdp_widget figure { float: none; margin: 0 auto 20px; }
}

@media (max-width: 480px) {
  .cdp_widget[data-layout="vsmall"] { text-align: center; }
  .cdp_widget[data-layout="vsmall"] header { margin: 0; }
  .cdp_widget[data-layout="vsmall"] .wrap { display: inline-block; float: none; margin-top: 15px; }
}

@media (max-width: 319px) {
  .cdp_widget[data-layout="normal"] .content { overflow: visible; }
  .cdp_widget[data-layout="normal"] figure { margin-bottom: 15px; }
  .cdp_widget[data-layout="normal"] h1 { font-size: 14px; line-height: 16px; }
  .cdp_widget[data-layout="normal"] .description { font-size: 12px; line-height: 15px; }
  .cdp_widget[data-layout="normal"] .wrap { margin: 15px -20px; }
  .cdp_widget[data-layout="normal"] .more { font-size: 12px; }
}