/** Shopify CDN: Minification failed

Line 30:2 Unexpected "}"
Line 221:0 Unexpected "@"
Line 330:0 Unexpected "}"

**/
  img.w-100.h-100 {
      height: auto;
  }
 
  .mount {
      height: 170px !important;
      width: 178px !important;
      margin: 1%;
  }
  .mount1 {
      height: 174px !important;
      width: 218px !important;
      margin: 1%;
  }
  .mount2{
      height: 158px !important;
      width: 172px !important;
  }
  .backboard-wh{
    width: 104% !important;
    height: 74% !important;
  }
  }
  .mount-wh {
      width: 140px;
      height: 102px;
  }
  img.power-wh {
      width: 100% !important;
      height: 54% !important;
  }
  .back-mar{
    margin-top: -15px;
  }


	body.template-index .main-content .videoBackground {
		margin-top: -55px;
	}
  .testBtnHome{
    position:absolute;
    top:50px;
    z-index:555
  }
	.videoBackground {
		position: relative;
	}
	.videoBackground .fullscreen-video-wrap {
		position: absolute;
		top: 0;
		left: 0;
		min-width: 100%;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	.videoBackground .fullscreen-video-wrap .video-js {
		position: absolute;
		top: 0;
		left: 0;
		min-height: 100%;
		min-width: 100%;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.videoBackground .fullscreen-video-wrap video {
		min-height: 100%;
		min-width: 100%;
		object-fit: cover;
	}
	.videoBackground .videoBox {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-direction: column;
		padding: 100px 20px 80px;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		min-height: 500px;
      	max-height: 800px;
        height: calc(100vh - 165px);
		position: relative;
	}
	.videoBackground .imageBox {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		padding: 100px 20px 80px;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		position: relative;
		min-height: calc(100vh - 165px);
		height: auto;
	}
	.videoBackground .videoBoxInfo, .videoBackground .imageBoxInfo {
		z-index: 2;
		text-align: center;
    margin-bottom: 13pc;
      
	}
	.videoBackground .overlay {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #000;
		z-index: 1;
	}
	.videoBackground .videoBoxInfoBtn, .videoBackground .imageBoxInfoBtn {
		-moz-user-select: none;
		-ms-user-select: none;
		-webkit-user-select: none;
		user-select: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		display: inline-block;
		width: auto;
		text-decoration: none;
		text-align: center;
		vertical-align: middle;
		cursor: pointer;
		border: 2px solid transparent;
		border-radius: 2px;
		padding: 8px 15px;
		font-style: normal;
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		white-space: normal;
		font-size: 14px;
		margin: 20px 15px !important;
	}
  .videoBackground .videoBoxInfoBtn:hover, .videoBackground .imageBoxInfoBtn:hover {
    background-color:white !important;
    border:2px solid black;
  }
	.videoBackground .videoBoxInfoTitle, .videoBackground .imageBoxInfoTitle {
		color: #FFF;
		font-size: 61px;
		line-height: 40px;
	}
	.videoBackground .videoBoxInfoDescription, .videoBackground .imageBoxInfoDescription {
		max-width: 500px;
		margin: 0 auto;
	}
	.videoBackground .videoBoxInfoDescription p, .videoBackground .imageBoxInfoDescription p {
		font-size: 18px;
		line-height: 28px;
	}
	.videoBackground .placeholderNoblocks {
		text-align: center;
		max-width: 500px;
		margin: 0 auto;
	}
  @media screen and (max-width:923px){
    .videoBackground .videoBoxInfoTitle, .videoBackground .imageBoxInfoTitle {
    color: #FFF;
    font-size: 48px;
    line-height: 40px;
}
    .imageBoxInfoDescription p {
            font-size: 14px;
            line-height: 28px;
        }
  }
    @media screen and (max-width: 767px) {
		body.template-index .main-content .videoBackground {
			margin-top: -35px;
		}
		.videoBackground .fullscreen-video-wrap {
			z-index: 3;
		}
		.videoBackground .videoBox {
          	min-height: 500px;
          	height: 100%;
          	position: relative;
			padding: 0;
      	}
		.videoBackground .fullscreen-video-wrap {
			position: relative;
			min-height: 300px;
		}
		.videoBackground .videoBoxInfo {
            padding: 31px 20px;
            background: #000;
            width: 100%;
            margin: 0px 0px 30px;
        }
        .videoBackground .overlay {
            display:none;
        }
      .videoBackground .videoBoxInfoTitle, .videoBackground .imageBoxInfoTitle {
            color: #FFF;
            font-size: 35px;
            line-height: 40px;
        }
      .imageBoxInfoDescription p {
            font-size: 14px;
            line-height: 28px;
        }
    }


#productSpecifications {
    height: auto;
}
@ media (max-width:768px){
 #productSpecifications {
    height: auto;
}
}

.header .tab,
.tab-selector {

    padding: 15px 25px;
    cursor: pointer;
}

.tab-selector {
    background-color: #D9D9D9;
    margin: 10px 0;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.header .tab.active {
    padding: 15px 25px;
    background-color: white;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.tab-selector.active {
    padding: 15px 25px;
    background-color: white;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.direct-to-wall-selectors .selector {
    padding: 10px 15px;
    background-color: #e8e8eb;
    color: rgba(119, 119, 119, 0.582);
    margin: 15px 0;
    border-radius: 30px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 5px 0px;
    cursor: pointer;
    transition: all ease .3s;
}

.direct-to-wall-selectors .selector:hover {
    background-color: #fac87d;
    color: black;
}

.direct-to-wall-selectors .selector.active {
    padding: 10px 15px;
    background-color: #FEA621;
    color: black;
    margin: 10px 0;
    border-radius: 30px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.overview-icon{
  width:120px;
  height:120px;
  box-shadow:none !important;
  text-align:center
}

/* #direct-to-wall-selectors .direct-to-wall-preview-colors,
#direct-to-wall-selectors .direct-to-wall-secondary-material,
#direct-to-wall-selectors .direct-to-wall-mounting-options,
#direct-to-wall-selectors .direct-to-wall-electrical,

#premounted-selectors .premounted-preview-colors,
#premounted-selectors .premounted-secondary-material,
#premounted-selectors .premounted-mounting-options,
#premounted-selectors .premounted-electrical,
#colors{
    overflow-y: scroll;
    width: 100%;
    height: 300px;
} */
/* div#direct-to-wall-selectors-attr {
    height: 370px;
    overflow-y: scroll;
    overflow-x: hidden;
} */

.scrollable-height{
   height: 290px;
    overflow-y: scroll;
    overflow-x: hidden;
  width:100%;
}
.scrollable-height::-webkit-scrollbar ,
.overview-attributes::-webkit-scrollbar{ 
    display: none;  /* Safari and Chrome */
}

.direct-to-wall-preview-colors .color,
.direct-to-wall-secondary-material .color,
.direct-to-wall-mounting-options .color,
.direct-to-wall-electrical .color,

.premounted-preview-colors .color,
.premounted-secondary-material .color,
.premounted-background .color,
.premounted-mounting-options .color,
.premounted-electrical .color {
        width: 130px;
    height: 110px;
    font-size: 12px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    cursor: pointer;
}
}

/* Style the scrollbar */
#colors::-webkit-scrollbar {
    width: 1px;
    /* Set the width of the scrollbar */
}

#colors::-webkit-scrollbar-thumb {
    background-color: #F8F8F8;
    /* Set the color of the scrollbar thumb */
    border-radius: 6px;
    /* Set the border radius of the scrollbar thumb */
}

#colors::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    /* Set the color of the scrollbar track */
    border-radius: 6px;
    /* Set the border radius of the scrollbar track */
}

.color .text.p{
  font-size:14px
}
.content .card .text.p{
  font-size:12px
}

.content .card .circlecolor{
  width:56px !important;
  height:56px !important;
}

.transparent{
  background: rgb(255,255,255);
background: linear-gradient(315deg, rgba(255,255,255,1) 53%, rgba(129,128,128,0.33657212885154064) 100%);
}
.frosted{
  background: rgb(226,182,60);
background: linear-gradient(315deg, rgba(226,182,60,0.23573179271708689) 66%, rgba(255,255,255,0) 88%);
}
.painted-black{
  background:#28282B
}
.painted-white{
  background:#F9F6EE
}
.rgba{
  background: rgb(63,94,251);
background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%);
}

.faq-section{
  background-color:#F8F8F8 !important
}



        .item {
            position: relative;
            cursor: pointer;
        }

        .item img {
            /* height: 380px;
            width: 250px !important; */
            border-radius: 10px;
        }


        .overlayy {
            position: absolute;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 380px;
            width:250px !important;
            background-color: rgba(255, 255, 255, 0.692);
            text-align: center;
            opacity: 0;
            transition: opacity ease .3s;
        }

        .item:hover .overlayy {
            opacity: 1;
        }
        .swiper-button-next{
            position: absolute;
    right: -50px;
          z-index:99999999
          
}
        
        .swiper-button-prev{
            position: absolute;
    left: -50px;
          z-index:99999999
}



@media (max-width:768px){
  #selectors{
   display: flex;
    overflow: scroll;
    gap: 10px; 
  }
  /* .neon-page-how-works {
    margin-top: 57vh !important;
} */
  .accordion button[aria-expanded='true'] + .accordion-content {
    opacity: 1;
    max-height: 17em !important;
    transition: all 200ms linear;
    will-change: opacity, max-height;
  }

  .content .card .circlecolor {
    width: 30px !important;
    height: 29px !important;
}
.direct-to-wall-preview-colors .color,
.direct-to-wall-secondary-material .color,
.direct-to-wall-mounting-options .color,
.direct-to-wall-electrical .color,

.premounted-preview-colors .color,
.premounted-secondary-material .color,
.premounted-background .color,
.premounted-mounting-options .color,
.premounted-electrical .color {
    width: 100px;
    height: 80px;
    font-size: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    cursor: pointer;
}


  .swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

  .item img {
    height: 380px;
    width: 300px !important;
    border-radius: 10px;
}

  .overlayy {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 380px;
    width: 300px !important;
    background-color: rgba(255, 255, 255, 0.692);
    text-align: center;
    opacity: 0;
    transition: opacity ease .3s;
}

  .accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 18px;
    right: -26px;
    width: 22px;
    height: 22px;
    border: 1px solid;
    border-radius: 22px;
}
  .accordion button .accordion-title {
    padding: 0px;
    font-size: 18px;
    
}
  
}


@media (max-width:768px){
  .mount {
    height: 90px !important;
    width: 100px !important;
  }
  .mount1 {
    height: 100px !important;
    width: 104px !important;
  }
  .mount2 {
    height: 98px !important;
    width: 110px !important;
  }
  .backboard-wh{
    width: 80% !important;
    height: 48% !important;
  }
  .mount-wh{
    width: 57% !important;
    height: 48% !important;
  }
  .power-wh {
    width: 70% !important;
    height: 48% !important;
  }
  .text.back-mar {
    font-size: 10px !important;
  }
  .text.p.py-1.text-nowrap {
    font-size: 10px !important;
  }
  .text.p.py-1.text-wrap {
    font-size: 10px !important;
  }
  
}