.fa.green
  { color: #2ecc71
  ; margin-right: 5px
  }

.videoWrapperContainer
  { width: 70%
  ; margin: 0 auto
  }

.videoWrapper
  { position: relative
  ; padding-bottom: 56.25%
  ; padding-top: 25px
  ; height: 0
  }

.videoWrapper object,
.videoWrapper embed
  { position: absolute
  ; margin: 20px auto 0 auto
  ; top: 0
  ; left: 0
  ; width: 100%
  ; height: 100%
  }

#wrapper
  { margin: 1.5rem auto
  ; padding: 1rem
  ; max-width: 1390px
  ; font-family: 'Lato', sans-serif
  ; background-color: #F4F4F4
  ; box-shadow: 0 0 7px rgba( 0, 0, 0, 0.3 )
  }

img
  { box-shadow: 0 1px 5px rgba( 0, 0, 1, 0.42)
              , inset 0 0 38px 2px rgba( 0, 0, 1, 0.1)
  }

.clearer
  { clear: both }

.header
  { padding-bottom: 25px
  ; background-image:url('./discount/werkzeug_und_zubehoer_2.jpg')
  ; margin: -1rem
  ; margin-bottom:15px
  ; position: relative
  }

.header a,
.header a:visited
  { color: white
  ; text-decoration: none
  }

.logoContainer img
  { max-width: 280px
  ; max-height: 180px
  ; box-shadow: none
  ; background-color: white
  ; margin-top:20px
  }

.navigationContainer
  { margin-top: 45px
  ; height: 50px
  ; width: 100.2%
  ; margin-left: -0.1%
  ; background-color: #FDB13E
  }

.navigationContainer ul
  { margin: 0
  ; padding: 0 0 0 10px
  ; line-height: 50px
  }

.navigationContainer ul li
  { display: inline-block
  ; color: white
  ; text-transform: uppercase
  ; font-weight: 400
  ; font-size: 16px
  }

.navigationContainer ul li a
  { display: inline-block
  ; padding: 0 20px
  }

.gallery .control-operator:target ~ .controls .control-button
  { color: #ccc
  ; color: rgba(255, 255, 255, 0.4)
  }

.gallery .control-button:first-of-type,
.gallery .control-operator:nth-of-type(1):target ~ .controls .control-button:nth-of-type(1),
.gallery .control-operator:nth-of-type(2):target ~ .controls .control-button:nth-of-type(2),
.gallery .control-operator:nth-of-type(3):target ~ .controls .control-button:nth-of-type(3),
.gallery .control-operator:nth-of-type(4):target ~ .controls .control-button:nth-of-type(4),
.gallery .control-operator:nth-of-type(5):target ~ .controls .control-button:nth-of-type(5),
.gallery .control-operator:nth-of-type(6):target ~ .controls .control-button:nth-of-type(6),
.gallery .control-operator:nth-of-type(7):target ~ .controls .control-button:nth-of-type(7),
.gallery .control-operator:nth-of-type(8):target ~ .controls .control-button:nth-of-type(8),
  { color: white
  ; color: rgba(255, 255, 255, 0.8)
  }

.gallery .item
  { position: absolute
  ; top: 0
  ; left: 0
  ; width: 100%
  ; pointer-events: none
  ; opacity: 0
  ; -webkit-transition: opacity .5s
  ; -o-transition: opacity .5s
  ; transition: opacity .5s
  }

.gallery .control-operator
  { display: none }

.gallery .control-operator:target ~ .item
  { pointer-events: none
  ; opacity: 0
  ; -webkit-animation: none
  ; -o-animation: none
  ; animation: none
  }

.gallery .control-operator:target ~ .controls .control-button
  { -webkit-animation: none
  ; -o-animation: none
  ; animation: none
  }

@-webkit-keyframes controlAnimation-2
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  14.3%, 50% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  64.3%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-o-keyframes controlAnimation-2
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  14.3%, 50% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  64.3%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@keyframes controlAnimation-2
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  14.3%, 50% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  64.3%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-webkit-keyframes galleryAnimation-2
  {
  0% { opacity: 0 }
  14.3%, 50% { opacity: 1 }
  64.3%, 100% { opacity: 0 }
  }

@-o-keyframes galleryAnimation-2
  {
  0% { opacity: 0 }
  14.3%, 50% { opacity: 1 }
  64.3%, 100% { opacity: 0 }
  }

@keyframes galleryAnimation-2
  {
  0% { opacity: 0 }
  14.3%, 50% { opacity: 1 }
  64.3%, 100% { opacity: 0 }
  }

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2)
  { pointer-events: auto; opacity: 1 }
.items-2.autoplay .control-button
  { -webkit-animation: controlAnimation-2 14s infinite
  ; -o-animation: controlAnimation-2 14s infinite
  ; animation: controlAnimation-2 14s infinite
  }

.items-2.autoplay .item
  { -webkit-animation: galleryAnimation-2 14s infinite
  ; -o-animation: galleryAnimation-2 14s infinite
  ; animation: galleryAnimation-2 14s infinite
  }

.items-2 .control-button:nth-of-type(1),
.items-2 .item:nth-of-type(1)
  { -webkit-animation-delay: -2s
  ; -o-animation-delay: -2s
  ; animation-delay: -2s
  }

.items-2 .control-button:nth-of-type(2),
.items-2 .item:nth-of-type(2)
  { -webkit-animation-delay: 5s
  ; -o-animation-delay: 5s
  ; animation-delay: 5s
  }

@-webkit-keyframes controlAnimation-3
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  9.5%, 33.3% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  42.9%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-o-keyframes controlAnimation-3
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  9.5%, 33.3% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  42.9%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@keyframes controlAnimation-3
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  9.5%, 33.3% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  42.9%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-webkit-keyframes galleryAnimation-3
  {
  0% { opacity: 0 }
  9.5%, 33.3% { opacity: 1 }
  42.9%, 100% { opacity: 0 }
  }

@-o-keyframes galleryAnimation-3
  {
  0% { opacity: 0 }
  9.5%, 33.3% { opacity: 1 }
  42.9%, 100% { opacity: 0 }
  }

@keyframes galleryAnimation-3
  {
  0% { opacity: 0 }
  9.5%, 33.3% { opacity: 1 }
  42.9%, 100% { opacity: 0 }
  }

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3)
  { pointer-events: auto; opacity: 1 }
.items-3.autoplay .control-button
  { -webkit-animation: controlAnimation-3 21s infinite
  ; -o-animation: controlAnimation-3 21s infinite
  ; animation: controlAnimation-3 21s infinite
  }

.items-3.autoplay .item
  { -webkit-animation: galleryAnimation-3 21s infinite
  ; -o-animation: galleryAnimation-3 21s infinite
  ; animation: galleryAnimation-3 21s infinite
  }

.items-3 .control-button:nth-of-type(1),
.items-3 .item:nth-of-type(1)
  { -webkit-animation-delay: -2s
  ; -o-animation-delay: -2s
  ; animation-delay: -2s
  }

.items-3 .control-button:nth-of-type(2),
.items-3 .item:nth-of-type(2)
  { -webkit-animation-delay: 5s
  ; -o-animation-delay: 5s
  ; animation-delay: 5s
  }

.items-3 .control-button:nth-of-type(3),
.items-3 .item:nth-of-type(3)
  { -webkit-animation-delay: 12s
  ; -o-animation-delay: 12s
  ; animation-delay: 12s
  }

@-webkit-keyframes controlAnimation-4
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  7.1%, 25% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  32.1%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-o-keyframes controlAnimation-4
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  7.1%, 25% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  32.1%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@keyframes controlAnimation-4
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  7.1%, 25% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  32.1%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-webkit-keyframes galleryAnimation-4
  {
  0% { opacity: 0 }
  7.1%, 25% { opacity: 1 }
  32.1%, 100% { opacity: 0 }
  }

@-o-keyframes galleryAnimation-4
  {
  0% { opacity: 0 }
  7.1%, 25% { opacity: 1 }
  32.1%, 100% { opacity: 0 }
  }

@keyframes galleryAnimation-4
  {
  0% { opacity: 0 }
  7.1%, 25% { opacity: 1 }
  32.1%, 100% { opacity: 0 }
  }

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(4):target ~ .item:nth-of-type(4)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(5):target ~ .item:nth-of-type(5)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(6):target ~ .item:nth-of-type(6)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(7):target ~ .item:nth-of-type(7)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(8):target ~ .item:nth-of-type(8)
  { pointer-events: auto; opacity: 1 }
.items-4.autoplay .control-button
  { -webkit-animation: controlAnimation-4 28s infinite
  ; -o-animation: controlAnimation-4 28s infinite
  ; animation: controlAnimation-4 28s infinite
  }

.items-4.autoplay .item
  { -webkit-animation: galleryAnimation-4 28s infinite
  ; -o-animation: galleryAnimation-4 28s infinite
  ; animation: galleryAnimation-4 28s infinite
  }

.items-4 .control-button:nth-of-type(1),
.items-4 .item:nth-of-type(1)
  { -webkit-animation-delay: -2s
  ; -o-animation-delay: -2s
  ; animation-delay: -2s
  }

.items-4 .control-button:nth-of-type(2),
.items-4 .item:nth-of-type(2)
  { -webkit-animation-delay: 5s
  ; -o-animation-delay: 5s
  ; animation-delay: 5s
  }

.items-4 .control-button:nth-of-type(3),
.items-4 .item:nth-of-type(3)
  { -webkit-animation-delay: 12s
  ; -o-animation-delay: 12s
  ; animation-delay: 12s
  }

.items-4 .control-button:nth-of-type(4),
.items-4 .item:nth-of-type(4)
  { -webkit-animation-delay: 19s
  ; -o-animation-delay: 19s
  ; animation-delay: 19s
  }

.items-4 .control-button:nth-of-type(5),
.items-4 .item:nth-of-type(5)
  { -webkit-animation-delay: 19s
  ; -o-animation-delay: 19s
  ; animation-delay: 19s
  }

@-webkit-keyframes controlAnimation-5
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  5.7%, 20% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  25.7%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-o-keyframes controlAnimation-5
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  5.7%, 20% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  25.7%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@keyframes controlAnimation-5
  {
  0% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  5.7%, 20% {
    ; color: white
    ; color: rgba(255, 255, 255, 0.8)
    }
  25.7%, 100% {
    ; color: #ccc
    ; color: rgba(255, 255, 255, 0.4)
    }
  }

@-webkit-keyframes galleryAnimation-5
  {
  0% { opacity: 0 }
  5.7%, 20% { opacity: 1 }
  25.7%, 100% { opacity: 0 }
  }

@-o-keyframes galleryAnimation-5
  {
  0% { opacity: 0 }
  5.7%, 20% { opacity: 1 }
  25.7%, 100% { opacity: 0 }
  }

@keyframes galleryAnimation-5
  {
  0% { opacity: 0 }
  5.7%, 20% { opacity: 1 }
  25.7%, 100% { opacity: 0 }
  }

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(4):target ~ .item:nth-of-type(4)
  { pointer-events: auto; opacity: 1 }
.gallery .control-operator:nth-of-type(5):target ~ .item:nth-of-type(5)
  { pointer-events: auto; opacity: 1 }
.items-5.autoplay .control-button
  { -webkit-animation: controlAnimation-5 35s infinite
  ; -o-animation: controlAnimation-5 35s infinite
  ; animation: controlAnimation-5 35s infinite
  }

.items-5.autoplay .item
  { -webkit-animation: galleryAnimation-5 35s infinite
  ; -o-animation: galleryAnimation-5 35s infinite
  ; animation: galleryAnimation-5 35s infinite
  }

.items-5 .control-button:nth-of-type(1),
.items-5 .item:nth-of-type(1)
  { -webkit-animation-delay: -2s
  ; -o-animation-delay: -2s
  ; animation-delay: -2s
  }

.items-5 .control-button:nth-of-type(2),
.items-5 .item:nth-of-type(2)
  { -webkit-animation-delay: 5s
  ; -o-animation-delay: 5s
  ; animation-delay: 5s
  }

.items-5 .control-button:nth-of-type(3),
.items-5 .item:nth-of-type(3)
  { -webkit-animation-delay: 12s
  ; -o-animation-delay: 12s
  ; animation-delay: 12s
  }

.items-5 .control-button:nth-of-type(4),
.items-5 .item:nth-of-type(4)
  { -webkit-animation-delay: 19s
  ; -o-animation-delay: 19s
  ; animation-delay: 19s
  }

.items-5 .control-button:nth-of-type(5),
.items-5 .item:nth-of-type(5)
  { -webkit-animation-delay: 26s
  ; -o-animation-delay: 26s
  ; animation-delay: 26s
  }

.gallery .control-button
  { color: #ccc
  ; color: rgba(255, 255, 255, 0.4)
  }

.gallery .control-button:hover
  { color: white
  ; color: rgba(255, 255, 255, 0.8)
  }

.gallery
  { position: relative
  }

.gallery .item
  { overflow: hidden
  ; text-align: center
  }

.gallery .controls
  { width: 100%
  }

.gallery .control-button
  { display: inline-block
  ; margin: 0 .02em
  ; font-size: 3em
  ; text-align: center
  ; text-decoration: none
  ; -webkit-transition: color .1s
  ; -o-transition: color .1s
  ; transition: color .1s
  }

.gallery .item:first-of-type
  { position: relative
  ; pointer-events: auto
  ; opacity: 1
  }

.gallery
  { width: 43%
  ; margin-right: 2%
  ; float: left
  }

.bigPic
  { position: relative
  ; width: 100%
  ; min-height: 560px
  ; margin: 0
  }

.bigPic img
  { position: absolute
  ; top: 0
  ; left: 0
  ; margin: 0.5rem
  ; max-width: 549px
  ; max-height: 549px
  ; z-index: 10
  }

.galleryNav
  { text-align: left
  ; padding: 1.2rem 8px
  }

.galleryThumb
  { position: relative
  ; display: inline-block
  ; width: 123px
  ; height: 123px
  ; margin-right: 16px
  ; margin-bottom: 16px
  }

.galleryThumb:hover,
.galleryThumb:visited,
.galleryThumb:link{
  ; text-decoration: none
  }

.galleryThumb:nth-child(1),
.galleryThumb:nth-child(5)
  { margin-left: 0
  }

.galleryThumb:nth-child(4n)
  { margin-right: 0
  }

.galleryThumb:last-child
  { margin-right: 0
  }

.galleryThumb:hover
  { opacity: 0.7
  ; cursor: pointer
  ; transition: all 0.2s
  }

.galleryThumb img
  { position: absolute
  ; top: 0
  ; left: 0
  ; width: 100%
  ; height: 100%
  }

.midColumn
  { float: left
  ; max-width: 400px
  }

.midColumn h1
  { color: #333
  ; font-weight: 400
  ; font-size: 26px
  ; margin-bottom: 0
  }

.underline
  { margin: 15px 0
  ; width: 20px
  ; height: 3px
  ; background-color: #333
  }

.shortdescription
  { float: left
  }

.shortdescription p,
.shortdescription ul,
.shortdescription li
  { color: #666
  ; font-size: 14px
  ; line-height: 1.5
  ; margin: 0
  }

#variationContainer
  { margin: 20px 0 0 0
  ; padding-bottom: 45px
  ; padding-left: 0px
  ; width: 345px
  ; font-family: 'montserrat', sans-serif
  }

#variationContainer h5
  { margin-top: 25px
  ; margin-bottom: 10px
  ; font-weight: 400
  ; font-size: 14px
  }

.varList1
  { margin: 0
  ; padding: 0
  ; list-style: none
  }

.varList1 li
  { display: inline-block
  ; margin-right: 5px
  ; margin-bottom: 5px
  ; padding: 5px 10px
  ; border: 1px solid #333
  ; color: #333
  ; font-size: 12px
  }

.varList1 li:hover
  { background-color: #000
  ; color: white
  ; cursor: default
  }

.varList2
  { margin: 0
  ; padding: 0
  ; list-style: none
  }

.varList2 li
  { display: inline-block
  ; margin-right: 5px
  ; margin-bottom: 5px
  ; padding: 5px 10px
  ; border: 1px solid #333
  ; color: #333
  ; font-size: 12px
  }

.varList2 li:hover
  { background-color: #000
  ; color: white
  ; cursor: default
  }

.priceTagBox
  { padding: 25px 5px 0 40px
  ; width: 380px
  ; height: 115px
  ; border-radius: 5px
  ; background-color: #22313F
  ; position: relative
  ; background-image:url('./discount/background.jpg')
  }

.priceTagBox h2
  { display: inline-block
  ; margin: 0
  ; padding: 0
  ; color: #FDB13E
  ; font-weight: 400
  }

.priceTagBox h3
  { margin: 0 0 0 2px
  ; padding: 0
  ; color: white
  ; font-weight: 400
  ; font-size: 14px
  ; position: absolute
  }

.priceTagBox h4
  { margin: 20px 0 0 2px
  ; padding-top: 0.5rem
  ; color: white
  ; font-weight: 400
  ; font-size: 14px
  }
.priceTagBox h4 i
  { margin-left: -18px
  ; margin-right: 7px
  ; color: #FDB13E
  }

.ActionButton
  { display: inline-block
  ; float: right
  ; margin-top: 2px
  ; margin-right: 20px
  ; width: 185px
  ; height: 35px
  ; border-radius: 3px
  ; background-color: #FDB13E
  ; text-decoration: none
  ; cursor: pointer
  ; transition: all 0.1s
  }

.ActionButton + .ActionButton
  { margin-top: 1rem }

.ActionButton.green
   { background-color: #2ecc71 }

.ActionButton p
  { font-size: 14px
  ; position: relative
  ; margin: 0
  ; line-height: 35px
  ; color: white
  ; text-transform: uppercase
  ; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4)
  ; font-size: 14px
  ; left: -4px
  }
.ActionButton:hover p
, .ActionButton:active p
, .ActionButton:focus p
  { text-decoration: underline }

.ActionButton i
  { position: relative
  ; top: 8px
  ; left: -30px
  ; float: left
  ; color: #ffffff
  ; font-size: 22px
  }

.ActionButton .innerbox
  { height: 35px }

.innerbox
  { float: left
  ; width: 40px
  ; height: 37px
  ; border-radius: 3px 0px 0px 3px
  ; background-color: white
  ; opacity: 0.2
  }

.uiButton
  { display: block
  ; float: left
  ; margin: 10px 10px 0 0
  ; width: 195px
  ; height: 37px
  ; border-radius: 3px
  ; background-color: #2C3E50
  ; box-shadow: 0px 3px 0px #22313F
  ; text-decoration: none
  ; cursor: pointer
  ; transition: all 0.1s
  }

.uiButton:hover
  { background-color: #FDB13E
  ; box-shadow: 0px 3px 0px #FDB13E
  ; transition: all 0.1s
  }

.uiButton a,
.uiButton a:hover,
.uiButton a:visited
  { text-decoration: none
  }

.uiButton i
  { position: relative
  ; top: 8px
  ; left: -30px
  ; float: left
  ; color: #ffffff
  ; font-size: 22px
  }

.uiButton p
  { position: relative
  ; margin: 0
  ; line-height: 40px
  ; color: white
  ; text-transform: uppercase
  ; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4)
  ; font-size: 14px
  }

.ActionButton i
  { position: relative
  ; top: 5px
  ; left: -32px
  ; font-size: 24px
  }

.rightColumn
  { float: right
  ; padding-left: 20px
  ; width: 215px
  ; border-left: 1px solid #ebebeb
  }

.rightColumn ul
  { padding-left: 0
  }

.rightColumn .circle
  { float: left
  ; margin-right: 10px
  ; width: 40px
  ; height: 40px
  ; border-radius: 100%
  ; background-color: #FDB13E
  ; text-align: center
  }

.rightColumn .circle i
  { color: #ffffff
  ; font-size: 18px
  ; line-height: 40px
  }

.brandContainer
  { margin: 25px 0 20px 0
  ; padding-bottom: 20px
  ; border-bottom: 1px solid #ebebeb
  ; text-align: center
  }

.brandContainer img
  { max-width: 150px
  ; max-height: 74px
  }

.brandContainer span
  { margin-top: 12px
  ; font-size: 14px
  }

.trustViewDescription
  { clear: both
  ; margin-bottom: 15px
  ; font-size: 14px

  ; height: 40px
  ; overflow: hidden
  }

.trustViewDescription a
  { color: #FDB13E
  ; text-decoration: none
  ; transition: all 0.1s
  }

.trustViewDescription p
  { margin: 0
  ; padding: 0
  ; line-height: 20px
  }

.tabBar
  { padding-bottom: 80px
  ; margin-top: 30px
  }

#tab2,
#tab3,
#tab4,
#tab5,
#tab6
  { display: none
  }

.tabBar input[type=radio]
  { visibility: hidden
  ; margin: 0
  ; padding: 0
  ; height: 0
  ; width: 0
  ; position: absolute
  }

.tablinks
  { display: inline-block
  ; margin-left: -4px
  ; margin-right: 1%
  ; padding-top: 0
  ; width: 19%
  ; height: 45px
  ; line-height: 45px
  ; background-color: #EFF0EB
  ; color: #666666
  ; text-align: center
  ; font-size: 18px
  ; transition: all 0.1s
  ; margin-bottom: 10px
  }

.tabBar label:last-of-type
  { margin-right: 0
  }

.tablinks:hover
  { background-color: #FDB13E
  ; color: white
  ; text-decoration: none
  ; cursor: pointer
  ; transition: all 0.1s
  }

#tab1-btn:checked + .tablinks,
#tab2-btn:checked + .tablinks,
#tab3-btn:checked + .tablinks,
#tab4-btn:checked + .tablinks,
#tab5-btn:checked + .tablinks,
#tab6-btn:checked + .tablinks
  { background-color: #FDB13E
  ; color: white
  ; text-decoration: none
  ; cursor: pointer
  ; transition: all 0.1s
  }

#tab1-btn:checked ~ #tab1
  { display: block
  }

#tab1-btn:checked ~ #tab2,
#tab1-btn:checked ~ #tab3,
#tab1-btn:checked ~ #tab4,
#tab1-btn:checked ~ #tab5,
#tab1-btn:checked ~ #tab6
  { display: none
  }

#tab2-btn:checked ~ #tab2
  { display: block
  }

#tab2-btn:checked ~ #tab1,
#tab2-btn:checked ~ #tab3,
#tab2-btn:checked ~ #tab4,
#tab2-btn:checked ~ #tab5,
#tab2-btn:checked ~ #tab6
  { display: none
  }

#tab3-btn:checked ~ #tab3
  { display: block
  }

#tab3-btn:checked ~ #tab1,
#tab3-btn:checked ~ #tab2,
#tab3-btn:checked ~ #tab4,
#tab3-btn:checked ~ #tab5,
#tab3-btn:checked ~ #tab6
  { display: none
  }

#tab4-btn:checked ~ #tab4
  { display: block
  }

#tab4-btn:checked ~ #tab1,
#tab4-btn:checked ~ #tab2,
#tab4-btn:checked ~ #tab3,
#tab4-btn:checked ~ #tab5,
#tab4-btn:checked ~ #tab6
  { display: none
  }

#tab5-btn:checked ~ #tab5
  { display: block
  }

#tab5-btn:checked ~ #tab1,
#tab5-btn:checked ~ #tab2,
#tab5-btn:checked ~ #tab3,
#tab5-btn:checked ~ #tab4,
#tab5-btn:checked ~ #tab6
  { display: none
  }

#tab6-btn:checked ~ #tab6
  { display: block
  }

#tab6-btn:checked ~ #tab1,
#tab6-btn:checked ~ #tab2,
#tab6-btn:checked ~ #tab3,
#tab6-btn:checked ~ #tab4,
#tab6-btn:checked ~ #tab5
  { display: none
  }

.tabContent
  { clear: both
  ; color: #222
  ; text-align: left
  ; overflow: auto
  ; font-size: 16px
  ; line-height: 1.5
  ; padding: 1rem
  }

.tabContent img
  { max-width: 100% }

.tabContent p
  { margin: 0
  ; padding: 0
  }

.tabContent a,
.tabContent a:visited
  { color: #FDB13E
  ; text-decoration: none
  }

.tabContent a:hover
  { text-decoration: underline
  ; font-weight: 700
  }

.tabContent h1,
.tabBar h1,
.tabContent h2,
.tabBar h2
  { font-weight: 300
  ; font-size: 28px
  ; transition: all 0.1s
  }

.tabContent h1:hover,
.tabBar h1:hover,
.tabContent h2:hover,
.tabBar h2:hover
  { color: #FDB13E
  ; cursor: default
  ; transition: all 0.1s
  }

.tabContent ul,
.tabContent ol
  { display: block
  ; text-align: left
  ; margin: 0
  ; position: relative
  ; line-height: 1.5
  }

.tabContentFeaturesList
  { margin: 0 auto !important
  ; padding: 0 0 0 20px
  ; max-width: 350px
  ; list-style: none
  ; text-align: left
  }

.tabContentFeaturesList li
  { margin-bottom: 10px
  }

.tabContentFeaturesList i
  { margin-right: 8px
  }

.descriptionFeatures
  { margin: 50px 0 70px 0
  ; padding: 30px 0 60px 0
  ; background-color: #f0f0f0
  ; text-align: center
  ; font-size: 18px
  }

.descriptionFeatures h2
  { font-size: 40px
  }

.contentImgLeft
  { float: left
  ; margin-top: 0
  ; margin-right: 25px
  ; margin-bottom: 15px
  ; margin-left: 0px
  ; max-width: 45%
  ; height: auto
  }

.contentImgRight
  { float: right
  ; margin-top: 0
  ; margin-right: 0px
  ; margin-bottom: 15px
  ; margin-left: 25px
  ; max-width: 45%
  ; height: auto
  }

.contentImgInline
  { display: inline-block
  ; vertical-align: top
  ; margin: 0 0 15px 15px
  }

.whyChooseUs
  { margin: 30px 0 0 0
  ; padding: 30px 0
  ; width: 100%
  ; background-color: #FDB13E
  }

.whyChooseUsBlockContainer
  { margin: 0 auto
  ; text-align: center
  }

.whyChooseUsBlock
  { display: inline-block
  ; margin: 35px 2% 40px 2%
  ; padding: 0 1%
  ; min-height: 335px
  ; width: 16%
  ; border-radius: 5px
  ; background-color: white
  ; vertical-align: top
  ; text-align: center
  ; transition: all 0.2s
  }

.whyChooseUsBlock:hover
  { color: #FDB13E
  ; cursor: default
  ; transition: all 0.2s
  }

.whyChooseUs .circle
  { position: relative
  ; top: -38px
  ; display: block
  ; margin: 0 auto
  ; width: 76px
  ; height: 76px
  ; border-radius: 500px
  ; background-color: #FDB13E
  }

.whyChooseUs .circle i
  { margin-top: 20px
  ; color: #ffffff
  ; font-size: 36px
  }

.whyChooseUs h2
  { color: white
  ; text-align: center
  ; font-weight: 400
  ; font-size: 36px
  ; font-family: 'Roboto Slab', serif
  }

.whyChooseUsBlock h3
  { margin-top: 0px
  ; text-align: center
  ; font-weight: 400
  ; font-size: 20px
  ; font-family: 'Roboto Slab', serif
  }

.whyChooseUsBlock p
  { margin-top: 25px
  ; color: #666666
  ; font-size: 16px
  ; font-family: 'Open Sans', sans-serif
  }

.crossSellerContainer
  { clear: both
  ; margin: 2rem 0 0.5rem 0
  ; text-align: center
  }

#csc2
  { margin-bottom: 80px }

.crossSellerContainerHeading
  { padding: 0
  ; text-align: left
  ; border-bottom: 3px solid #333
  }

.crossSellerContainer h2
  { position: relative
  ; top: 3px
  ; display: inline-block
  ; margin: 0
  ; padding: 0 0 8px 0
  ; border-bottom: 3px solid #FDB13E
  ; color: #333
  ; text-transform: uppercase
  ; font-weight: 400
  ; font-size: 24px
  }

.crossSellerContainer > a
  { display: inline-block
  ; overflow: hidden
  ; margin-top: 2rem
  ; margin-right: 2%
  ; color: black
  ; padding: 0
  ; width: 16%
  ; height: 310px
  ; vertical-align: top
  ; transition: all 0.2s
  ; text-decoration: none
  ; box-shadow: 0 1px 5px rgba( 0, 0, 1, 0.42)
  ; background: white
  }

.crossSellerContainer > a:hover
  { color: #FDB13E
  ; transition: all 0.1s
  }

.crossSellerContainer > a:hover img
  { opacity: 0.7 }

.crossSellerContainer > a:last-child
  { margin-right: 0 }

.crossSellerContainer > a .product-template-image
  { position: relative
  ; width: 100%
  ; height: 231px
  }

.crossSellerContainer > a.action h1
  { color: #2ecc71 }
.crossSellerContainer > a.action del
  { margin: 0 }

.product-template-image ActionPercent
  { position: absolute
  ; color: white
  ; font-size: 1.2rem
  ; line-height: 3.5rem
  ; right: 0.5rem
  ; top: 0.5rem
  ; margin: 0.25rem
  ; width: 3.5rem
  ; height: 3.5rem
  ; display: block
  ; border-radius: 50%
  ; opacity: 0.9
  ; background: #2ecc71
  ; box-shadow: inset 0 -1px 1px rgba( 0, 0, 0, 0.4)
  }


.crossSellerContainer > a img
  { max-width: 163px
  ; max-height: 163px
  ; margin: 1.5rem 0 2.5rem 0
  ; transition: all 0.5s
  ; box-shadow: none
  }

.crossSellerContainer > a h1
  { color: #FDB13E
  ; margin: 0
  ; padding: 0
  }
.crossSellerContainer > a h5
  { display: none }

.crossSellerContainer > a h4
  { margin: 0
  ; font-size: 1rem
  ; position: absolute
  ; display: block
  ; width: 80%
  ; left: 10%
  ; text-align: center
  ; bottom: 0.5rem
  ; text-shadow: 1.5pt 0 1.5pt white
               , 0 -1.5pt 1.5pt white
               , -1.5pt 0 1.5pt white
               , 0 1.5pt 1.5pt white
  }

.crossSellerContainer > a span
  { margin-bottom: 1rem
  ; display: block
  }

@media only screen and (max-width: 1215px)
  {
  .gallery
    { width: 40% }
  }

@media only screen and (max-width: 1135px)
  {
  .rightColumn
    { padding-left: 10px
    ; width: 160px
    }
  }

@media only screen and (max-width: 1024px)
  {
  .logoContainer
    { display: block
    ; margin: 0 auto
    ; width: 100%
    ; text-align: center
    }
  .navigationContainer
    { display: block
    ; margin: 25px auto 0 auto
    ; padding: 0
    ; width: 100%
    ; height: auto
    }
  .navigationContainer ul
    { padding: 0
    }
  .navigationContainer ul li
    { display: block
    ; margin: 0 auto
    ; padding: 0
    ; height: auto
    ; border-bottom: 1px solid #ddd
    ; color: #FDB13E
    ; text-align: center
    }
  .galleryAndShortdescriptionContainer
    { float: none
    ; margin: 0 auto
    ; width: 100%
    }
  .gallery
    { display: block
    ; float: none
    ; margin: 0 auto
    ; width: 70%
    }
  .bigPic
    { height: 530px
    }
  .bigPic img
    { max-height: 530px
    }
  .midColumn
    { float: none
    ; margin: 0 auto
    ; width: 100%
    }
  .midColumn h1
    { text-align: center
    }
  .midColumn h2
    { margin: 0 auto 0 auto
    ; text-align: center
    }
  .underline
    { margin: 15px auto 15px auto
    }
  .shortdescription
    { margin: 0 auto
    ; width: 410px
    ; float: none
    }
  .shortdescription p
    { text-align: center
    }
  #variationContainer
    { width: auto
    ; text-align: center
    }
  .priceTagBox
    { margin: 0 auto
    ; padding: 20px 0 0 30px
    ; max-width: 380px
    }
  .ActionButton
    { margin-left: 20px
    ; min-width: 40%
    }
  .ActionButton p,
  .uiButton p
    { left: -15px
    }
  .buttonContainer
    { margin: 0 auto
    ; text-align: center
    }
  .uiButton
    { display: inline-block
    ; float: none
    }
  #questionBtn
    { margin: 10px 0 0 0
    ; width: 202px
    }
  #watchlistBtn
    { margin: 10px 0 0 0
    ; width: 202px
    }
  .rightColumn
    { float: none
    ; clear: both
    ; margin: 40px auto 0 auto
    ; padding-top: 20px
    ; max-width: 100%
    ; border: none
    ; border-top: 1px solid #ddd
    ; border-bottom: 1px solid #ddd
    ; text-align: center
    ; width: auto
    }
  .brandContainer
    { display: none
    }
  .trustViewDescription
    { display: inline-block
    ; clear: both
    ; margin-right: 20px
    ; width: auto
    ; width: 40%
    ; vertical-align: top
    ; text-align: left
    }
  .trustViewDescription p
    { margin: 0
    ; vertical-align: top
    }
  .tabBar
    { margin: 40px auto 0 auto
    ; max-width: 100%
    ; text-align: left
    }
  .whyChooseUs
    { padding-right: 30px
    ; max-width: 100%
    }
  .whyChooseUsBlock
    { width: 30%
    }
  .crossSellerContainer
    { margin: 0 auto
    ; padding-top: 60px
    ; padding-right: 30px
    ; width: 90%
    }
  .crossSellerContainer
    { width: 100%
    }
  .crossSellerContainer > a
    { width: 21%
    }
  }

@media only screen and (max-width: 830px)
  {
  .videoWrapperContainer
    { width: 90%
    }
  .bigPic
    { width: auto
    ; height: 290px
    }
  .bigPic img
    { max-width: 95%
    ; max-height: 300px
    ; width: auto
    ; vertical-align: middle
    }
  .bigPic
    { display: inline-block
    ; width: 100%
    ; vertical-align: middle
    ; text-align: center
    }
  .contentImgLeft,
  .contentImgRight
    { float: none
    ; clear: both
    ; margin: 0 auto
    ; max-width: 100%
    ; width: auto
    ; text-align: center
    }
  .contentImgLeft img,
  .contentImgRight img
    { margin-bottom: 10px
    }
  #footerContainer
    { height: 700px
    }
  #footerColumn1,
  #footerColumn2,
  #footerColumn3
    { float: none
    ; margin-bottom: 50px
    ; margin-left: 50px
    }
  }

@media only screen and (max-width: 660px)
  {
  #wrapper
    { padding: 20px 20px 0 20px
    }
  .tablinks
    { margin-bottom: 10px
    }
  .tabBar label
    { width: 47%
    ; margin-right: 1%
    ; margin-left: 1%
    }

  .whyChooseUs
    { padding: 30px 0
    ; width: 100%
    }
  .whyChooseUsBlock
    { width: 90%
    }
  .crossSellerContainer
    { width: 100%
    ; padding-right: 0px
    ; text-align: center
    }
  .crossSellerContainer > a
    { display: block
    ; margin: 0 auto
    ; padding-top: 50px
    ; width: 80%
    ; text-align: center
    }
  .crossSellerContainer > a:last-child
    { margin-right: auto
    }
  #footerContainer
    { height: 700px
    }
  #footerColumn1,
  #footerColumn2,
  #footerColumn3
    { display: block
    ; float: none
    ; clear: both
    ; margin: 0 auto
    ; margin-bottom: 40px
    ; padding: 0
    ; width: 55%
    ; text-align: left
    }
  }

@media only screen and (max-width: 480px)
  {
  .logoContainer
    { display: block
    ; margin: 0 auto
    ; width: 100%
    ; text-align: center
    }
  .gallery
    { display: block
    ; float: none
    ; margin: 0 auto
    ; width: 100%
    }
  .bigPic
    { height: 230px
    }
  .bigPic img
    { max-width: 95%
    ; max-height: 230px
    ; width: auto
    ; vertical-align: middle
    }
  .midColumn
    { display: block
    ; margin: 0 auto
    ; width: 100%
    }
  .midColumn h2
    { margin: 0 auto
    ; text-align: center
    }
  .shortdescription
    { clear: both
    ; padding-left: 0px
    ; width: 100%
    }
  .priceTagBox
    { padding: 20px 0 0 0
    ; width: 250px
    ; height: 180px
    }
  .priceTagBox h2
    { margin: 0 auto
    ; display: block
    }
  .priceTagBox h3
    { margin: 0 auto
    }
  .priceTagBox h4
    { margin: 0 auto
    ; text-align: center
    }
  .ActionButton
    { margin-top: 40px
    ; margin-right: 26px
    ; margin-bottom: 20px
    ; width: 200px
    ; text-align: center
    }
  .uiButton
    { display: block
    }
  .buttonContainer
    { text-align: center
    }
  #watchlistBtn
    { display: inline-block
    ; width: 250px
    }
  #questionBtn
    { display: inline-block
    ; margin-right: 0
    ; margin-top: 10px
    ; width: 250px
    }
  #questionBtn p
    { font-size: 13px
    }
  .trustViewDescription
    { display: block
    ; margin: 0 auto 15px auto
    ; width: 90%
    ; height: auto
    }
  .whyChooseUsBlock
    { display: block
    ; margin: 60px auto 0 auto
    ; padding: 0 1%
    ; min-height: 300px
    ; width: 80%
    ; background-color: white
      }
  .tabBar
    { display: block
    }
  .tablinks li
    { height: 40px
    ; line-height: 40px
    }
  }

@media only screen and (max-width: 350px)
  {
  .bigPic img
    { max-height: 200px }
  }

.animated
  { animation-duration: 1s
  ; animation-fill-mode: both
  }

@keyframes fadeInRight
  {
  0% {
    ; opacity: 0
    ; transform: translateX(10px)
    }
  100% {
    ; opacity: 1
    ; transform: translateX(0)
    }
  }

.fadeInRight
  { animation-name: fadeInRight }


.tabContent .ActionButton
  { width: auto
  ; display: inline-block
  ; color: white !important
  ; line-height: 1.5rem
  ; height: auto
  ; background: #FDB13E
  ; padding: 0
  ; margin-bottom: 1rem
  ; padding-right: 0.25rem
  ; float: none
  ; font-weight: normal !important
  ; letter-spacing: 0.05rem
  }

.tabContent .ActionButton p
  { padding: 0.15rem 0.5rem
  ; display: block
  ; float: left
  ; white-space: pre-wrap
  ; margin: 0
  }

.tabContent .ActionButton i
  { left: auto
  ; top: auto
  ; padding: 0.5rem
  ; margin-right: 0.5rem
  ; display: block
  ; float: left
  ; height: 100%
  ; background: rgba(255,255,255,0.2)
  }

.footerContainer
  { display: none }

.priceTagBox.action
  { padding-top: 1.35rem
  ; padding-bottom: 4rem
  ; padding-right: 2rem
  }
.priceTagBox.action h2
  { color: #2ecc71 }

del
  { text-decoration: none
  ; position: relative
  ; color: #FDB13E
  ; font-size: 24px
  ; margin: 0
  }

del:before
  { content: ''
  ; -webkit-transform: rotate(-10deg)
  ; transform: rotate(-10deg)
  ; width: 120%
  ; height: 0.2em
  ; position: absolute
  ; top: 0.5em
  ; left: 0
  ; display: block
  ; margin-left: -0.25em
  ; background: #2ecc71
  ; opacity: 0.8
  ; z-index: 10
  }

del:after
  { content: ''
  ; display: block
  ; clear: both
  }


section
  { width: 100%
  ; display: inline-block
  ; position: relative
  ; margin-left: 10px
  ; margin-top: 10px
  }

section img
  { min-width: 300px
  ; min-height: 300px
  ; max-width: 650px
  ; display: inline-block
  ; float: left
  }

section ul
  { display: inline-block
  ; float: left
  ; margin-left: 1.5rem
  ; max-width: 35%
  }
section ul h2
  { margin: 1rem 0 }
section li
  { display: block !important
  ; max-width: 500px
  ; padding: 5px 0
  ; border-top: 1px solid #eee
  ; float: none
  ; line-height: 1.35em !important
  }
section li:first-of-type
  { border-top: none }
section li:last-of-type
  { border-bottom: none }

section li i
  { margin-right: 0.5rem }

section arrows
  { position: absolute
  ; top: 0
  ; right: 0
  ; margin: 0.5rem
  ; text-align: right
  }
arrows a
  { display: inline-block
  ; font-size: 2rem
  ; margin-left: 0.5em
  ; color: #FDB13E
  }
arrows a#placeholder i:before
  { visibility: hidden !important }

section:not(:target)
  { display: none }
section#overview
  { display: inline-block }
section:target ~ section#overview
  { display: none }

article
  { display: inline-block
  ; width: 100%
  ; clear: both
  ; float: none
  ; padding-top: 1rem
  }

article table
  { text-align: center
  ; padding-top: 2rem
  ; animation-name: pop
  ; animation-duration: 5s
  ; animation-fill-mode: both
  }
article th
  { border-bottom: 0.15rem solid lightgray
  ; border-right: 0.15rem solid lightgray
  ; padding: 0.25rem 0.35rem
  ; border-spacing: 0.25rem
  }
article tbody tr:hover
  { background: #FDB13E }
article td
  { border-bottom: 1px solid lightgray
  ; border-right: 1px solid lightgray
  ; border-spacing: 0.25rem
  }
article tr:last-of-type td
  { border-bottom: none }
article td a
  { text-decoration: none
  ; color: black
  ; display: block
  ; padding: 0.25rem 0.35rem
  ; word-wrap: break-word
  }
article td:last-of-type
, article th:last-of-type
  { border-right: none }

article > a
  { float: left
  ; transition: all 0.5s
  ; display: inline-block
  ; border: 0.2rem solid #FDB13E
  ; width: 7.25rem
  ; height: 7.25rem
  ; position: relative
  ; margin: 0 0 10px 10px
  }

article > a > img
  { width: 100%
  ; height: 100%
  ; display: inline-block
  }

article > a:hover
, article > a:focus
, article > a:active
  { opacity: 0.6 }

article > a > span
  { position: absolute
  ; width: calc( 100% - 0.4rem )
  ; bottom: 0
  ; left: 0
  ; padding: 0.1rem 0.2rem
  ; text-shadow: 0 0 0.2rem white
  ; background: rgba(255,255,255,0.5)
  ; color: black
  ; word-wrap: break-word
  ; font-size: 12px
  }

sup
  { font-size: 0.65rem }

.combi .rightColumn
  { list-style: none
  ; width: 45%
  ; position: absolute
  ; right: 0
  ; border: 0
  }

.combi .rightColumn li
  { display: block
  ; width: 50%
  ; height: 3rem
  ; padding-top: 0.5rem
  ; float: right
  ; color: white
  }

.combi .rightColumn i
  { border-radius: 1.5rem
  ; text-align: center
  ; padding: 0.5rem
  ; margin-right: 0.5rem
  ; background: #FDB13E
  ; display: inline-block
  ;
  }

.combi .tabBar
  { padding-top: 3rem }

.combi .ActionButton span
  { line-height: 2.5rem
  ; padding: 0 0.5rem
  }

.combi section li i.fa-angle-right
  { margin-left: 0.65rem }

.combi section li i.fa-certificate
  { margin-left: 0.15rem }

svg
  { margin: 0 0.25rem }
