/* This page
-------------------------------------------------- */
html, body {height:100%;}
body {background-color:#000;color:#c6c6c6;text-align:left;font-family: 'Source Sans Pro',sans-serif;font-weight:300;line-height:1.5em;font-size:18px;}
h1 {
  font-family: 'Source Sans Pro',sans-serif;
  font-size:2.2rem;
  font-weight:400;
  line-height:1.3em;
  margin-bottom:0.5em;
  color:#fff;
}
h2 {
  font-family: 'Source Sans Pro',sans-serif;
  font-size:2.2em;
  font-weight:400;
  margin-bottom:0.5em;
  color:#fff;
}
h5 {font-size:1.1em;color:#fff;font-weight:400;}
.txt-color {color:#fffb8f !important;}

video, 
#full-video img{
  width: 100%;
  height: auto;
}
#info ul h5 {font-size:1.6em;font-weight:400;color:#656b7b;}

.fullH {min-height: 53vw;}

/* Hero Page
-------------------------------------------------- */
#heropage {
	background: url("../images/LuciferLED/hero-lg.jpg") top right no-repeat;
	background-size: cover;
}
#heropage,
#heropage .container-fliud,
#heropage .row {margin:0;}

#heropage .txt {
	background: url("../images/LuciferLED/Lucifer-lg.png") right top no-repeat;
	padding:0em 1em 0 0;
	color:#fff;
	text-align:right;
	margin-bottom:1em;
}
#heropage .series {
	color:#cc995b;
}
#heropage .desc {
	margin-top:6vw;
	line-height: 1.2em;
}
#heropage .descmore {
	color:#c6c6c6;
	font-size:0.8em;
}


/* Unique & Trendy
-------------------------------------------------- */
#unique {
	background: url("../images/LuciferLED/Unique-bg-lg2.jpg") #000 top center no-repeat;
	background-size: cover;
	text-align:center;
	margin-top:5px;
	min-height: 65vw;
	padding-top:3em;
}
#unique ul {text-align:left;}
#unique ul strong {color:#fff;}
/* Lights
-------------------------------------------------- */
#lights {
	background: url("../images/LuciferLED/bike-lg.jpg") #000 top center no-repeat;
	background-size: 100% auto;
	text-align:center;
	margin-top:5px;
	padding-bottom:3em;
}
#lights,
#lights .container,
#lights .row {min-height: 65vw;}
#lights ul {text-align:left;}

/* 2 Flasing Effects
-------------------------------------------------- */
#flash {
	background: url("../images/LuciferLED/bg-LuciferLED-mirrors-lg.jpg") top right #fff no-repeat;
	background-size: auto 100%;
	margin-top:5px;
	color:#000;
	padding-top:3em;
	border-top:5px solid #fff;
}
#flash .fullH {min-height:40vw;}
#flash h1 {color:#000;}
#flash .txt {text-align:right;}
#flash figure img {max-width:100%;}
#flash a {text-decoration:underline;}
.arrow {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.2em 0 0.2em 0.32em;
  border-color: transparent transparent transparent #007bff;	
  margin-right:0.3em;
  display:inline-block;
}


/* Vistion
-------------------------------------------------- */
#vision {
	background: url("../images/LuciferLED/vision-lg.jpg") top right no-repeat;
	background-size: cover;
	border-top:5px solid #fff;
	color:#363636;
}
#vision h1 {color:#000;}
#vision .txt {margin-top:-3em;}

#vision .desc {
	width: fit-content;
    margin-bottom: 18vw;
	padding:0.5em 1em;
	color: #fff;
    background-color: rgba(0,0,0,0.5);
	border-radius: 10rem;
	float: right;
}


/* IP67
-------------------------------------------------- */
#IP67 {
	background: url("../images/LuciferLED/IP67-lg.jpg") top right no-repeat;
	background-size: cover;
	border-top:5px solid #fff;
	color:#fff;
}
#IP67 ,
#IP67  .container,
#IP67  .row {min-height: 47.7vw;}

#IP67 img {max-width:14vw;}




/* Install
-------------------------------------------------- */
#install {
	text-align:center;
	background: url("../images/LuciferLED/install-lg.jpg") top center no-repeat;
}
#install img {max-width:100%;}




/* Stems
-------------------------------------------------- */
#stems {
	background: url("../images/LuciferLED/stems-lg.jpg") #fff 1em center no-repeat;
	background-size: auto 100%;
	color:#363636;
	border-top:1em solid #fff;
	border-bottom:1em solid #fff;
}
#stems h1,
#stems h3 {color:#000;}
#stems ul {margin-top:2.5em;padding-left: 1.2em;}
#stems li {margin-top:2em;}



/* Print (Visualize it right away)
-------------------------------------------------- */
#print, 
#print .fullH {min-height:45vw;}
#print {
	background: url("../images/LuciferLED/print-lg.jpg") #fff top right no-repeat;
	background-size: auto 100%;
	color:#363636;
	border-top:1px solid #fff;
}
#print h1 {color:#000;}
#print .txt {margin-top:-2em;}
#print .icon img{width:40%;max-width:250px;height:auto}
#print .note {font-size:0.9em;}



/* Gallery
-------------------------------------------------- */
#gallery img {width:100%;}



/* Shop-Action
-------------------------------------------------- */
#shop-action {
	padding-top:5%;
	padding-bottom:5%;
	min-height:100%;
	text-align:center;
	background-color:#000;
	font-weight:500;
}
#shop-action h1 {color:#ff3d3d;}
.flash .txt{
	color:#ffc107;
	line-height:1.5;
	padding:.375rem .75rem;
}
.stem .txt {
	color:#52ccdf;
	line-height:1.5;
	padding:.375rem .75rem;
}
.btn-flash {
    color: #ffc107;
    background-color: #000;
    border-color: #ffc107;
}
.btn-flash:not(:disabled):not(.disabled).active, 
.btn-flash:not(:disabled):not(.disabled):active, 
.show>.btn-flash.dropdown-toggle {
	color:#000; 
	background-image: linear-gradient(0deg, rgb(255, 102, 0) 0%, rgb(249, 247, 99) 100%);
}
.btn-stem {
    color: #52ccdf;
    background-color: #000;
    border-color: #52ccdf;
}
.btn-stem:not(:disabled):not(.disabled).active, 
.btn-stem:not(:disabled):not(.disabled):active, 
.show>.btn-stem.dropdown-toggle {
	color:#000; 
	background-image: linear-gradient(0deg, rgb(0, 100, 152) 0%, rgb(150, 241, 255) 100%);
}
#shop-action div {
	-webkit-transition:all .2s linear;
	-moz-transition:all .2s linear;
	-o-transition:all .2s linear;
	-ms-transition:all .2s linear;
	transition:all .2s linear
}

#shop-action figure {margin:2em 0;}
#shop-action img {max-width:100%;}
#shop-action div.fit {
	position:absolute;
	right:3em;
	bottom:3.5em;
}
#shop-action figcaption {
	color:#fff;
	font-size:1.5em;
	text-align:right;
}
#shop-action figcaption span{
	font-size:0.8em;
}
#shop-action a .shop {
	font-size:0.6em;
	color:#ff3d3d;
	margin-top:0.3em;
}
#shop-action a:hover .shop {
	text-decoration:underline;
}
#shop-action figcaption p {margin:0;line-height:0.4em;}





/* Info
-------------------------------------------------- */
#info {height:auto;color:#858c9d;background-color: #242629;}
#info ul h5 {color:#fff;}
#info ul li a {color:#82aad2;}
#info strong {color:#a6acba;}


/* effect
-------------------------------------------------- */
section {transition:all 500ms ease-out;}

/* Responsive
-------------------------------------------------- */
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	.fullH {min-height: 150vw;}
	#heropage {
		margin-top:1em;
		background-image: url("../images/LuciferLED/hero-xs2.jpg");
		background-size: 100% auto;
		background-position:bottom center;
	}
	#heropage .fullH {min-height: 200vw;}
	#heropage .align-items-center {-ms-flex-align:start!important;align-items:flex-start!important}
	#heropage .txt {margin-top:3em;text-align:center;background: url("../images/LuciferLED/Lucifer-xl.png") center top no-repeat;background-size:100% auto;}
	#heropage .desc {margin-top:4em;}
	
	#unique {background-image: url("../images/LuciferLED/Unique-bg-xs.jpg");background-size:100% auto;background-position:bottom center;min-height: 200vw;}
	#lights {background-image: url("../images/LuciferLED/bike-xs.jpg");padding-bottom:2em;}
	#lights, #lights .container, #lights .row {min-height: 200vw;}
	
	#flash {background-image: none;}
	#flash, #flash .fullH {min-height:100vw;}
	
	#vision {border-color:#ccc;background-image: url("../images/LuciferLED/vision-xs.jpg");backgroudn-size: 100% auto;background-position: center bottom;}
	#vision .desc {margin-bottom:60vw;}
	#vision, #vision .fullH {min-height: 200vw;}
	#IP67 {background-image: url("../images/LuciferLED/IP67-xs.jpg");min-height: 143vw;}
	#vision .align-items-center,
	#IP67 .align-items-center {-ms-flex-align:start!important;align-items:start!important}
	#vision .txt,
	#IP67 .txt {text-align:center;margin-top:3em;}
	#install {background-image: none;}
	
	#stems {background-image: url("../images/LuciferLED/stems-xs.jpg");background-size: 95% auto;background-position: center top;}
	#stems .align-items-center {-ms-flex-align:end!important;align-items:flex-end!important}
	#stems, #stems .fullH {min-height: 175vw;}
	#print {background-image: url("../images/LuciferLED/print-xs.jpg");background-size: 100% auto;background-position: center top;}
	#print, #print .fullH {min-height: 150vw;}
	#print .align-items-center {-ms-flex-align:end!important;align-items:flex-end!important}
	#print .txt {margin-top:0;padding-bottom:2em;}
	
	#shop-action .float-right, #action .float-left {float:left!important;}
	#shop-action .stem {margin-top:1em;margin-left:2.6em;}
	#shop-action div.fit {right:2em;bottom:2em;z-index:1;}
	
}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {
	.fullH {min-height: 150vw;}
	#heropage {
		margin-top:1em;
		background-image: url("../images/LuciferLED/hero-xs2.jpg");
		background-size: 100% auto;
		background-position:bottom center;
	}
	#heropage .fullH {min-height: 200vw;}
	#heropage .align-items-center {-ms-flex-align:start!important;align-items:flex-start!important}
	#heropage .txt {margin-top:3em;text-align:center;background: url("../images/LuciferLED/Lucifer-xl.png") center top no-repeat;background-size:545px 167px;}
	#heropage .desc {margin-top:6em;}
	
	#unique {background-image: url("../images/LuciferLED/Unique-bg-xs.jpg");background-size:100% auto;background-position:bottom center;min-height: 200vw;}
	#lights {background-image: url("../images/LuciferLED/bike-xs.jpg");padding-bottom:2em;}
	#lights, #lights .container, #lights .row {min-height: 200vw;}
	
	#flash {background-image: url("../images/LuciferLED/bg-LuciferLED-mirrors-xs.jpg");}
	#flash, #flash .fullH {min-height:100vw;}
	#vision {border-color:#fff;background-image: url("../images/LuciferLED/vision-xs.jpg");backgroudn-size: 100% auto;background-position: center bottom;}
	#vision .desc {margin-bottom:60vw;}
	#vision, #vision .fullH {min-height: 200vw;}
	#IP67 {background-image: url("../images/LuciferLED/IP67-xs.jpg");min-height: 143vw;}
	#vision .align-items-center,
	#IP67 .align-items-center {-ms-flex-align:start!important;align-items:flex-start!important}
	#vision .txt,
	#IP67 .txt {text-align:center;margin-top:3em;}
	#install {background-image: none;}
	
	#stems {background-image: url("../images/LuciferLED/stems-xs.jpg");background-size: 95% auto;background-position: center top;}
	#stems .align-items-center {-ms-flex-align:end!important;align-items:flex-end!important}
	#stems, #stems .fullH {min-height: 175vw;}
	#print {background-image: url("../images/LuciferLED/print-xs.jpg");background-size: 100% auto;background-position: center top;}
	#print, #print .fullH {min-height: 150vw;}
	#print .align-items-center {-ms-flex-align:end!important;align-items:flex-end!important}
	#print .txt {margin-top:0;padding-bottom:2em;}
	
	#shop-action .float-right, #action .float-left {float:left!important;}
	#shop-action .stem {margin-top:1em;margin-left:2.6em;}
	#shop-action div.fit {right:2em;bottom:2em;z-index:1;}
}
/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .container {max-width: 900px;}
	#heropage {background-image: url("../images/LuciferLED/hero-md.jpg");}
	#heropage .txt {background: url("../images/LuciferLED/Lucifer-md.png") right top no-repeat;margin-top:8em;}
	
	#unique {background-image: url("../images/LuciferLED/Unique-bg-md2.jpg");}
	#lights {background-image: url("../images/LuciferLED/bike-md.jpg");}
	
	#flash {background-image: url("../images/LuciferLED/bg-LuciferLED-mirrors-md.jpg");}
	#vision {background-image: url("../images/LuciferLED/vision-md.jpg");}
	#IP67 {background-image: url("../images/LuciferLED/IP67-md.jpg");}
	#install {background-image: url("../images/LuciferLED/install-md.jpg");}
	#print, #print .fullH {min-height: 50vw;}
	
	#action {background-image: url("../images/Arrow/action-md.jpg");}
	#action .txt {margin-bottom:14vw;}
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1000px) {
}
/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1281px) {
	h1 {font-size:2.5rem;}
	#heropage {background-image: url("../images/LuciferLED/hero-xl.jpg");}
	#heropage .txt {padding-top:0 1.5em 0 0;background-image: url("../images/LuciferLED/Lucifer-xl.png");max-width: 545px;background-size:100% auto;font-size:1.2em;}
	#heropage .desc {text-align:center;}
	
	#unique {min-height: 47vw;background-image: url("../images/LuciferLED/Unique-bg-xl2.jpg");}
	#lights {background-image: url("../images/LuciferLED/bike-xl.jpg");padding-bottom:5em;}
	#lights, #lights .container, #lights .row {min-height: 50vw;}
	
	#flash {background-image: url("../images/LuciferLED/bg-LuciferLED-mirrors-xl.jpg");}
	#flash .txt {margin-top:-2em;}
	#vision {background-image: url("../images/LuciferLED/vision-xl.jpg");}
	#IP67 {background-image: url("../images/LuciferLED/IP67-xl.jpg");}
	#install {background-image: url("../images/LuciferLED/install-xl.jpg");}
	#stems {background-image: url("../images/LuciferLED/stems-xl.jpg");}
	#stems, #stems .fullH {min-height:50vw;}
	#print {background-image: url("../images/LuciferLED/print-xl.jpg");}
	#print .icon img{width:30%;}
	#print, #print .fullH {min-height: 40vw;}
	
	#action {background-image: url("../images/Arrow/action-xl.jpg");}
	#action, #action .container, #action .row {min-height: 54vw;}
	#action .container {width:90%;max-width:90%;}
	#action .txt {margin-bottom:18vw;}
}

@media (min-width: 1440px) {
	#heropage .desc {margin-top:6.5vw; font-size:1.3em;}
	#unique {min-height: 47vw;padding-top:7em;}
	#stems ul {margin-top:3.5em;}
	#stems li {margin-top:3em;}
	#print .txt {margin-top:-4em;}
}