HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/SBogers10/deensekroon.komma-mediadesign.nl/wwwroot/css/pages/_productShow.sass
/* Sections
 ========================================================================== */


.product-page-image-container,
.product-page-specs-container
  +respond-to-width($bp_sm)
    html:not(.ie) &
      width: 40%
  +respond-to-width($bp_mobile)
    html:not(.ie) &
      width: 100%

.product-page-main-container,
.product-page-relevant-products-container
  +respond-to-width($bp_sm)
    html:not(.ie) &
      width: 60%
  +respond-to-width($bp_mobile)
    html:not(.ie) &
      width: 100%
    & > div
      padding-left: 0

// Reset fonts
.product-page-image-section,
.product-page-main-section,
.product-page-specs-section,
.product-page-relevant-products-section
  font-size: 15px
  line-height: 1.4
  margin-bottom: 50px

.product-page-image-section
  position: relative

  img
    width: 100%


.product-page-main-section
  padding-left: 50px

.product-page-relevant-products-section
  padding-left: 50px


/* Content
 ========================================================================== */

// Image
.product-page-image-section

  img
    width: 100%

.product-page-image-holder
  position: relative

#activate-hover
  position: absolute
  top: 0
  left: 0
  z-index: 10
  width: 100%
  height: 100%
  cursor: pointer
  background: url(../images/structure/spacer.gif)

.product-smallthumb-row
  position: relative
  margin: 0 0 8px 0
  width: 100%
  height: 72px

.product-smallthumb-holder
  position: relative
  float: left
  margin: 0 8px 0 0
  width: 72px
  height: 72px

.product-smallthumb-image
  overflow: hidden
  width: 72px
  height: 80px
  cursor: pointer

.product-page-view-collection
  position: relative
  top: 40px


// Brand
.product-page-brand
  display: block
  margin-bottom: 10px
  color: #9c9c9b

  font-weight: 400
  font-size: 18px
  font-style: italic
  font-variant: normal

  text-decoration: none

  &:hover
    color: #0080C9

// Title
.product-page-title
  display: block
  margin: 0 0 0.5em 0
  color: #565656

  font-size: 28px
  font-weight: 300
  letter-spacing: 0
  line-height: 26px
  text-transform: none

// Price
.product-page-oldprice
  display: block
  color: #ababab
  font-size: 18px
  text-decoration: line-through

.product-page-currentprice
  display: block
  margin-bottom: 30px
  color: #565656
  font-size: 28px
  line-height: 24px

// Stock
.product-page-instock
  color: #19B94F
  font-size: 14px

.product-page-notinstock
  color: #ea004e
  font-size: 14px

// Size
.customSelect
  margin-bottom: 10px

// Order
/* order btn */
.order-button-holder
  position: absolute
  top: 0
  right: 0
  z-index: 50
  width: 152px
  text-align: right

.button-add-to-cart
  position: relative
  margin-bottom: 8px
  width: 152px
  height: 32px
  cursor: pointer

  input
    position: absolute
    top: 0
    left: 0
    z-index: 10
    padding: 0
    width: 144px
    height: 32px
    border: none
    background: #999
    opacity: 0
    filter: alpha(opacity = 0)
    cursor: pointer

  .text 
    position: absolute
    z-index: 8
    top: 4px
    left: 8px
    font-weight: 600
    font-size: 17px
    color: #fff

  .off 
    position: absolute
    z-index: 2
    width: 152px
    height: 32px
    background: url(../images/structure/deensekroon_sprite.png) 0 -328px

  .over 
    position: absolute
    z-index: 5
    width: 152px
    height: 32px
    filter: alpha(opacity = 0)
    opacity: 0
    background: url(../images/structure/deensekroon_sprite.png) 0 -360px

  .icon-arrow 
    position: absolute
    z-index: 9
    top: 12px
    right: 8px
    height: 14px
    background: url(../images/structure/deensekroon_sprite.png) -132px -32px

// Description
.product-page-description
  display: block
  position: relative
  margin-top: 45px
  margin-bottom: 40px
  font-size: 15px
  line-height: 1.2

// Specifications
.specs-holder
  font-size: 14px
  line-height: 1.2
  color: #aaa

.specs-title
  display: block
  color: #565656
  font-weight: 700
  font-size: 15px
  border-bottom: 1px solid #eaeaea

// You may also like
.recommend-title
  display: block
  margin: 0 0 16px 0
  padding: 0 8px
  border-bottom: 1px solid #eaeaea

  font-weight: 700
  font-size: 15px
  line-height: 1.2
  text-align: left

.product-recommend-row
  margin: 0 0 16px 0

.product-recommend-holder
  position: relative
  float: left
  width: 33%

#product-recommend-arrow-down
  position: relative
  top: -6px