/* Color-Management */

/* Main Color */

:root {
  --main-color: #bc1c24;
  --second-color: #000000;
  --third-color: #333333;
  --main-background-color: #f8f8f8;
  --content-wrapper-color: #f8f8f8;
  --main-accent-color: #d0d0d0;
  --main-font-color: #000000;
  --second-font-color: #ffffff;
  --card-wrapper-color: #ffffff;
}

/* Header-Color-Management */

:root {
  --topbar-background-color: var(--main-color);
  --topbar-icon-color: #ffffff;
  --header-background-color: #ffffff;
  --bottombar-background-color: var(--second-color);
  --product-card-label-border-color: var(--main-color);
}

/* Footer Colormanagement */

:root {
  --footer-tb-background-color: var(--second-color);
  --footer-background-color: var(--third-color);
  --footer-font-color: var(--second-font-color);
}

/* General */

body {
  background: var(--main-background-color);
  font-family: 'Roboto';
  color: var(--main-font-color);
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Top Bar */

#header {
  background: var(--header-background-color);
}

.header-top-bar {
  background: var(--topbar-background-color);
  color: var(--topbar-icon-color);
}

.header-top-bar-box-text {
  color: var(--main-font-color);
}

.header-top-bar-box-icon {
  color: var(--second-font-color);
  padding-right: 10px;
}

.header-img-logo {
  width: 600px;
  margin-top: .3rem;
}

.header-bottom-bar {
  background: var(--bottombar-background-color);
  height: .4rem;
}

/* Main Conent */

#frame-column-left {
  padding-right: 20px;
}

#frame-colum-right {
  padding-left: 20px;
}

.content-wrapper {
  background: var(--content-wrapper-color);
}

/* css-slider */

.slider-thumbnails label img {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 3px;
  object-fit: scale-down;
}

.slider-thumbnails label:before {
  content: "";
  display: block;
  padding-top: 100%;
}

.slider-thumbnails label {
  width: 24.1%;
  position: relative;
  max-width: 100%;
  border: 1px solid;
  border-color: var(--slider-border-color);
  overflow: hidden;
  display: inline-block;
  margin-bottom: 0;
  margin-left: 1px;
  margin-right: 1px;
  cursor: pointer;
}

.slider-top img {
  position: absolute;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  object-fit: scale-down;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 0;
}

.slider-top > figure {
  padding: 0;
  overflow: hidden;
  display: block;
  position: absolute;
  margin-bottom: 14px;
  margin-left: auto;
  margin-right: auto;
}

.slider-top input:not(:checked) + figure {
  opacity: 0.1;
}

.slider-top input:checked + figure:before {
  content: "";
  display: block;
  padding-top: 100%;
}

.slider-top input:checked + figure {
  width: 100%;
  display: block;
  position: relative;
  vertical-align: middle;
}

.slider-top input {
  display: none;
}

.slider-top {
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  float: left;
}

.css-slider {
  display: block;
  width: 100%;
}

.card-wrapper {
  background: var(--card-wrapper-color);
  padding: 8px;
}

/* Product Card */

/* TAB-Slider */

.product-card-tabs {
  max-width: 100%;
  float: none;
  padding: 0px;
  list-style: none;
}

.product-card-tabs:after {
  content: '';
  display: table;
  clear: both;
}

.product-card-tabs i {
  padding: 5px;
  margin-right: 10px;
}

.product-card-tabs input[type="radio"] {
  display: none;
}

.product-card-tabs label {
  display: block;
  width: 50%;
  color: var(--main-font-color);
  font-size: 16px;
  font-weight: 300;
  text-decoration: none;
  text-align: center;
  line-height: 2.2em;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background: linear-gradient(to top, #F2F2F2 0, #FAFAFA 10px, #FAFAFA 100%);
  margin-bottom: .2rem;
  border-top-left-radius: 9px;
  border-top-right-radius: 8px;
}

.product-card-tabs label:hover {
  color: var(--main-font-color);
  font-weight: 500;
  background: #f4f4f4;
}

.product-card-tabs label i {
  padding: 5px;
  margin-right: 0;
  color: var(--main-color);
}

.product-card-tabs span:hover {
  border-bottom: 1px solid;
  border-color: var(--product-card-label-border-color);
}

.product-card-tab-content {
  width: 100%;
  padding: 20px 15px 15px;
  box-sizing: border-box;
  background-color: #ffffff;
  border-right: 1px solid rgba(0,0,0,0.06);
  border-left: 1px solid rgba(0,0,0,0.06);
  border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(to bottom, rgba(0,0,0,0.06), rgba(0, 0, 0, 0)) 1 100%;
}

.product-card-tab-content h3 {
  color: var(--main-font-color);
  font-weight: 300;
}

.product-card-heading {
  border-bottom-style: solid;
  border-bottom-color: var(--main-color);
}

#product-card-tab-1:checked + label, #product-card-tab-2:checked + label, #product-card-tab-3:checked + label, #product-card-tab-4:checked + label, #product-card-tab-5 {
  background: #FFF;
  color: var(--main-font-color);
  border-top: 1px solid rgba(0,0,0,0.06);
  border-right: 1px solid rgba(0,0,0,0.06);
  border-left: 1px solid rgba(0,0,0,0.06);
}

.product-card-description-info ul {
  padding-left: 20px;
}

.product-card-description-info h6 {
  margin-bottom: 2px;
  font-weight: bold;
}

.product-card-description-info p {
  /*margin-bottom: 10px;*/
}

#product-card-tab-1:checked ~ #product-card-tab-1-content {
  display: block;
}

#product-card-tab-1:checked ~ #product-card-tab-2-content, #product-card-tab-1:checked ~ #product-card-tab-3-content, #product-card-tab-1:checked ~ #product-card-tab-4-content, #product-card-tab-1:checked ~ #product-card-tab-5-content {
  display: none;
}

#product-card-tab-2:checked ~ #product-card-tab-2-content {
  display: block;
}

#product-card-tab-2:checked ~ #product-card-tab-1-content, #product-card-tab-2:checked ~ #product-card-tab-3-content, #product-card-tab-2:checked ~ #product-card-tab-4-content, #product-card-tab-2:checked ~ #product-card-tab-5-content {
  display: none;
}

#product-card-tab-3:checked ~ #product-card-tab-3-content {
  display: block;
}

#product-card-tab-3:checked ~ #product-card-tab-1-content, #product-card-tab-3:checked ~ #product-card-tab-2-content, #product-card-tab-3:checked ~ #product-card-tab-4-content, #product-card-tab-3:checked ~ #product-card-tab-5-content {
  display: none;
}

#product-card-tab-4:checked ~ #product-card-tab-4-content {
  display: block;
}

#product-card-tab-4:checked ~ #product-card-tab-1-content, #product-card-tab-4:checked ~ #product-card-tab-2-content, #product-card-tab-4:checked ~ #product-card-tab-3-content, #product-card-tab-4:checked ~ #product-card-tab-5-content {
  display: none;
}

#product-card-tab-5:checked ~ #product-card-tab-5-content {
  display: block;
}

#product-card-tab-5:checked ~ #product-card-tab-1-content, #product-card-tab-5:checked ~ #product-card-tab-2-content, #product-card-tab-5:checked ~ #product-card-tab-3-content, #product-card-tab-5:checked ~ #product-card-tab-4-content {
  display: none;
}

/* Payment Card */

.payment-card {
  margin-top: 10px;
}

.payment-card-heading {
  border-bottom-style: solid;
  border-bottom-color: var(--main-color);
}

.col-payment-card {
  margin: 1px;
  padding: 4px;
  background: var(--third-color);
}

.col-payment-card-2 {
  margin: 1px;
  padding: 4px;
  background: #fff;
  border: solid 3px;
  border-color: var(--third-color);
}

.payment-card-text {
  color: var(--second-font-color);
  font-size: .7rem;
}

/* Shipping Card */

.shipping-card-heading {
  border-bottom-style: solid;
  border-bottom-color: var(--main-color);
}

.col-shipping-card-1 {
  margin: 1px;
  padding: 4px;
  background: #FECC00;
}

.col-shipping-card {
  margin: 1px;
  padding: 4px;
  background: var(--third-color);
}

/* Info-Card */

.info-card-title-heading {
  font-size: 28px;
  border-bottom-style: solid;
  border-bottom-color: var(--main-color);
}

/* Footer */

.info-card-content ul {
  padding-left: 5px;
}

.footer-main-bar {
  background: var(--footer-background-color);
  color: var(--footer-font-color);
}

.footer-main-bar h3 {
  padding: 4px 0 4px 12px;
  border-bottom-style: solid;
  border-bottom-color: var(--main-color);
  font-size: 18px;
}

.footer-top-bar {
  background: var(--footer-tb-background-color);
}

#footer-call-to-action {
  color: var(--main-color);
  text-align: center;
}

.footer-box-left {
  list-style-type: none;
  padding-left: 12px;
  line-height: 2.5;
}

.footer-logo {
  padding-top: 10px;
  max-width: 100px;
}

.footer-bottom-bar {
  background-color: var(--card-wrapper-color);
  color: var(--main-color);
  text-align: center;
}

.footer-link {
  color: var(--second-font-color);
}

.footer-link:hover {
  color: var(--main-color);
  text-decoration: none;
  cursor: pointer;
}

.emd-logo {
  max-width: 10%;
  height: auto;
  padding-bottom: 15px;
  padding-top: 3px;
}

/* ------ media----- */

@media screen and (max-width:414px) {
  .slider-top input:checked + figure {
    width: 100% !important;
  }
}

@media screen and (max-width:414px) {
  .product-card-tabs label {
    font-size: 15px;
  }
}

@media screen and (min-width:414px) {
  .product-card-tabs label {
    font-size: 20px;
  }
}

@media (max-width: 486px) {
  .product-card-tabs label {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .product-card-tabs label {
    width: 100%;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 0px;
  }
}

@media (max-width: 767px) {
  #product-card-tabs-tab-1-radio:checked + label, #product-card-tabs-tab-2-radio:checked + label, #product-card-tabs-tab-3-radio:checked + label, #product-card-tabs-tab-4-radio:checked + label, #product-card-tabs-tab-5-radio:checked + label {
    background: rgba(0,0,0,0.03);
    color: var(--main-font-color);
    border-top: 1px solid rgba(0,0,0,0.06);
    border-right: 1px solid rgba(0,0,0,0.06);
    border-left: 1px solid rgba(0,0,0,0.06);
    border-radius: 0px;
  }
}

@media screen and (min-width:992px) {
  .product-card-tabs label {
    font-size: 15px;
    float: left;
  }
}

@media screen and (max-width:991px) {
  .product-card-tabs label {
    width: 100%;
    background: #fff;
    border-right: 1px solid rgba(0,0,0,0.06);
    border-left: 1px solid rgba(0,0,0,0.06);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    border-radius: 0px;
  }
}