@import '../components/header.css';
@import '../components/footer.css';
@import '../components/common.css';

@import '../components/hero.css';

@import '../lib/imageviewer.css';
@import '../lib/owl.carousel.min.css';
@import '../lib/owl.theme.default.min.css';

@import '../components/carousel.css';
@import '../components/product-gallery-zoom.css';

@import '../components/color-buy.css';
@import '../components/bv-ratings-reviews.css';

@import '../components/how-to.css';
@import '../utils/video-thumb.css';
@import '../components/how-to-articles.css';
@import '../components/right-paint.css';
@import '../components/cr-report-thumbnail.css';

.color-buy-right .align-self-start.mb-2 {
  width: 100px !important;
}

div.col-12.col-lg-3 h3 {
  font-size: 22px;
  font-weight:700;
}
.bvdetail {
    display: none;
}
div.row.product-usage-description h5 {
  font-size: 20px;
  font-weight:700;
}

div.row.component-header.mt-5 h3 {
  font-size: 22px;
  font-weight:700;
}

.product-detail-title h1 {
  font-size: 42px;
  font-weight: 700;
}
.product-detail-title p {
  font-size: 24px;
  font-weight: 400;
}



.product-usage-description {
  max-height: 250px;
  overflow: hidden;
}

.content-mask {
  height: 100px;
  margin-top: -100px;
  position: relative;
  margin-right: -15px;
  background: -moz-linear-gradient(top, rgba(255,255,255,0) -26%, rgba(255,255,255,1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1)));
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) -26%,rgba(255,255,255,1) 100%);
  background: -o-linear-gradient(top, rgba(255,255,255,0) -26%,rgba(255,255,255,1) 100%);
  background: -ms-linear-gradient(top, rgba(255,255,255,0) -26%,rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,0) -26%,rgba(255,255,255,1) 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#1ffffff',GradientType=0 );
}


.product-detail {
  display: grid;
  display: -ms-grid;
}

.product-usage-summary {
  font-size: 14px;
  font-weight: 600;
}

.product-detail-description {
  border-bottom: 1px solid #cccccc;
}

.product-detail-dropdown select {
  max-width: 300px;  
  background-color: #e6e6e6;
}



.bvdetail {
  float:left;	
}	
.bv-curations-cleanslate .bv-direct-upload-wrapper .bv-btn-direct-upload {
  margin-bottom: 45px !important;
}

.bv-curations-cleanslate .fm-carousel.BVTemplateSmallCarousel {
  background: transparent !important;
}

#writeReviewModal .modal-body .description p {
	font-size: 12px;
}

/* desktop */
@media screen and (min-width: 992px) {
  .product-detail {
    /* use this when we have thumbs
	grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: minmax(10px, auto);
    grid-column-gap: 40px;*/
	grid-column-gap:5rem;
    -ms-grid-columns: 50% 50%;    
  }
  .desktop-product-gallery {
    grid-row: 1/5;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-row-span: 4;
  }  
  .product-detail-title {
    -ms-grid-column: 2;
  }
  .product-detail-rr {
    grid-row: 2/3;
    grid-column: 2/3;
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .product-detail-description {
    grid-row: 3/4;
    grid-column: 2/3;
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .product-detail-dropdown {
    grid-row: 4/5;
    -ms-grid-row: 4;
    -ms-grid-column: 2;
  }
  .product-detail-cr {
    grid-row: 4/5;
  }

  #writeReviewModal .modal-body .description p {
	font-size: 16px;
  }
}

/* mobile & tablet */
@media screen and (max-width: 991px) {
  .product-detail-title h1 {
    font-size: 40px;
  }
  .product-detail-title {
    -ms-grid-row: 1;
  }
  .product-detail {
    grid-template-columns: 100%;
    grid-auto-columns: minmax(10px, auto);
    -ms-grid-columns: 100%;
  }
  .product-detail-rr {
    -ms-grid-row: 2;
  }
  .product-detail-description {
    -ms-grid-row: 4;
  }
  .product-detail-dropdown {
    -ms-grid-row: 5;
  }
  .mobile-product-gallery {
    grid-row: 3/4;
    -ms-grid-row: 3;
  }
  .read-more {
    display: block;
    text-align: center;
  }
  
  #writeReviewModal .modal-body .description p {
	font-size: 12px;
  }  
}

/* tablet only */
@media screen and (min-width: 992px) {
  .product-detail-cr .btn {
    margin: auto;
    display: block;
    width: 68%;
  }
  
  #writeReviewModal .modal-body .description p {
	font-size: 16px;
  }  
}

a.about-product {
    text-transform: capitalize;
}