@charset "UTF-8";
/* CSS Document */

/*:: Header
------------------------------------- */
	#header #logo-lighting a{float:left; height:65px; width:198px; text-indent:-1000em; background:url(images/lighting/logo-lighting.gif) no-repeat top left; margin-top:23px;}
	
/*:: Cookie Banner
------------------------------------- */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  background: #832467; /* BANNER BACKGROUND COLOR */
  color: #fff; /* TEXT COLOR */
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  font-family: Arial, sans-serif;
  z-index: 9999;
  gap: 12px; 
}

.cookie-banner span {
  flex: 1;              
  min-width: 0;         /* CRITICAL: allows flexbox shrinking */
  font-size: 14px;
}

.cookie-buttons {
  display: flex;
  gap: 10px;
  flex-shrink: 0;       /* prevents buttons from being squished */
  flex-wrap: wrap;      /* allows wrapping on small screens */
  justify-content: flex-end;
}

.btn {
  border: none;
  padding: 8px 14px;
  cursor: pointer;
  font-size: 14px;
  border-radius: 3px;
  white-space: nowrap;
}

.btn.light {
  background: #fff;
  color: #000;
}

.btn.dark {
  background: #000;
  color: #fff;
}

	
/* - Navigation -
------------------------------------- 
		#nav-lighting{
	list-style:none;
	color:#999;
	float:right;
	clear:both;
	padding:5px 0 5px 0;
		
}
		#nav-lighting ul {

}
		#nav-lighting li {
	float: left;
	margin-left: 30px;
	font-weight:bold;
	font: 12px Arial, sans-serif;


}
	#nav-lighting li a {
		
		color:#999;
		
		}
		#nav-lighting li a:hover {
		color:#FFF;
		
		}
		#nav-lighting li a.on {
		color:#FFF;
		
		}
*/
/* remove the list style */
	#nav {
	list-style:none;
	color:#999;
	float:right;
	clear:both;
	padding:5px 0 5px 0;

	}	
	
		/* make the LI display inline */
		/* it's position relative so that position absolute */
		/* can be used in submenu */
		#nav li {
			font-weight:bold;
			font: 13px Arial, sans-serif;
			float:left; 
			display:block; 
			position:relative;
			z-index:5000; 
			padding: 0 0 0 15px;
			margin:0 1px;
			
		}
		
		/* this is the parent menu */
		#nav li a {
			display:block; 
			padding:8px 5px 0 5px; 
			height:23px; 
			text-decoration:none; 
			color:#999; 
			text-align:left; 
		}

		#nav li a:hover {
			color:#fff;
		}
	
		
	
		/* submenu, it's hidden by default */
		#nav ul {
			position:absolute; 
			left:0; 
			display:none; 
			margin:0 0 0 -1px; 
			padding:0; 
			list-style:none;
			background-color:#111;
						
			-moz-box-shadow: 0 3px 3px 2px #888;
			-webkit-box-shadow: 0 3px 3px 2px#888;
			box-shadow: 0 3px 3px 2px #888;
			
				/* Theoretically for IE 8 & 9 (more valid) */	
				/* ...but not required as filter works too */
				/* should come BEFORE filter */
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
				
				/* This works in IE 8 & 9 too */
				/* ... but also 5, 6, 7 */
				filter: alpha(opacity=90);
				
				/* Older than Firefox 0.9 */
				-moz-opacity:0.9;
				
				/* Safari 1.x (pre WebKit!) */
				-khtml-opacity: 0.9;
				
				/* Modern!
				/* Firefox 0.9+, Safari 2?, Chrome any?
				/* Opera 9+, IE 9+ */
				opacity: 0.9;

		}
		
		#nav ul li {
			width: 230px;
			float:left;
			text-align:left;
		}
		
		#nav ul li .last {
			padding-bottom:10px;
		}
		/* display block will make the link fill the whole area of LI */
		#nav ul a {
			display:block;  
			height:15px;
			padding: 8px 5px; 
			color:#999;
		}
		
		#nav ul a:hover {
			color:#fff;
		}

		/* fix ie6 small issue */
		/* we should always avoid using hack like this */
		/* should put it into separate file : ) */
		*html #nav ul {
			margin:0 0 0 -2px;
		}


	
/*:: Homepage
------------------------------------- */
	
	
		#content #home .rslides{height:296px; position:relative; margin-bottom:30px;}
		#content #home .rslides .slide{background-repeat:no-repeat; background-position:top left; height:296px;  position:absolute; top:0; left:0; width:100%;}	
		#content #home .rslides .slide h3{float:left; margin-left:-1000em;}
		#content #home .rslides .info{position:absolute;}
		#content #home .rslides .slide p{font-size:12px; line-height:17px; padding:0;}
		#content #home .rslides .slide p strong{font-size:15px; font-weight:normal;}
		#content #home .rslides .slide a.more{float:left; height:27px; width:104px; background:url(images/btn-learnMore.png) no-repeat top left; text-indent:-1000em;}
		#content #home .rslides .slide a.more2{float:left; height:27px; width:104px; background:url(images/btn-learnMore2.png) no-repeat top left; text-indent:-1000em;}
		#content #home .rslides .slide1{background-image:url(images/lighting/slider/slide1.jpg); display:block;}
		#content #home .rslides .slide1 .info{width:300px; top:131px; left:59px;}
		#content #home .rslides .slide1 .info p{
	color:#3E1130;
}
		#content #home .rslides .slide1 .info a.more{margin:18px 0 0 -8px;}
		#content #home .rslides .slide2{background-image:url(images/lighting/slider/slide2.jpg);}
		#content #home .rslides .slide2 .info{width:345px; top:111px; left:59px;}
		#content #home .rslides .slide2 .info p{color:#e5ecf7;}
		#content #home .rslides .slide2 .info a.more{margin:10px 0 0 -8px;}
		#content #home .rslides .slide3{background-image:url(images/lighting/slider/slide3.jpg);}
		#content #home .rslides .slide3 .info{width:300px; top:111px; left:59px;}
		#content #home .rslides .slide3 .info p{color:#d2d2d2;}
		#content #home .rslides .slide3 .info a.more{margin:10px 0 0 -8px;}
		#content #home .rslides .slide4{background-image:url(images/lighting/slider/slide4.jpg);}
		#content #home .rslides .slide4 .info{width:300px; top:111px; left:59px;}
		#content #home .rslides .slide4 .info p{color:#d2d2d2;}
		#content #home .rslides .slide4 .info a.more{margin:10px 0 0 -8px;}
		
		#content #home .rslides .slide5{background-image:url(images/lighting/slider/slide5.jpg);}
		#content #home .rslides .slide5 .info{width:300px; top:111px; left:59px;}
		#content #home .rslides .slide5 .info p{
	color: #000000;
}
		#content #home .rslides .slide5 .info a.more{margin:10px 0 0 -8px;}
		
		/* - slider - products */
			#Lighting-products .slide {padding: 20px; width: 621px; height: 185px; overflow: hidden; cursor: pointer;}
			#Lighting-products h2 {padding: 0 0 10px; font: 22px Arial, sans-serif; color: #fff; background: none !important; display: block;}
			#Lighting-products h3 {padding: 0 0 10px; font: 16px Arial, sans-serif; color: #ccc;}
			#Lighting-products p {width: 320px; color: #888;}
			
			.sliderProducts .slide { width: 100%; height: 296px; overflow: hidden; cursor: pointer;}
		.sliderProducts h2 {padding: 0 0 10px; font: 22px Arial, sans-serif; color: #fff; background: none !important; display: block;}
		.sliderProducts h3 {padding: 0 0 10px; font: 16px Arial, sans-serif; color: #ccc;}
		.sliderProducts p {width: 320px; color: #888;}
		.products-psl {background: url(images/lighting/thumbnails/products/products-psl.jpg) no-repeat 0 0;}
		.products-psl a {color: #005192 !important;}
		.products-medlux {background: url(images/lighting/thumbnails/products/products-gpi.jpg) no-repeat 0 0;}
		.products-medlux a {color: #ffbe14 !important;}
		.products-accent {background: url(images/lighting/thumbnails/products/products-accent.jpg) no-repeat 0 0;}
		.products-accent a {color: #46afe8 !important;}
		.products-xls {background: url(images/lighting/thumbnails/products/products-xls.jpg) no-repeat 0 0;}
		.products-xls p {color: #ffffff !important;}
		.products-xls a {color: #46afe8 !important;}
	
/* - tagline2 - */
		#content #tagline2{padding-bottom:15px;}
		#content #tagline2 h1{float:left; height:53px; width:222px; background:url(images/lighting/ir-light.png) no-repeat top left; text-indent:-1000em;}
		#content #tagline2 p{font-size:18px; line-height:20px; color:#aeb0b4; padding:5px 0 10px 19px; float:left; width:70%;}
		#content #tagline2 p strong{color:#58595b; font-weight:normal;}
	
		
		#content #tagline2 #banners li.highlight{border:3px solid #bfc0c4; margin-bottom:7px;margin-right:0; width:222px}
		#content #tagline2 #banners li.highlight h4 a{width:212px; display:block; background-color:#333; color:#ffbe14; padding:5px; }
		#content #tagline2 #banners li.highlight p{line-height:18px; color:#404042; padding:0; font-size:15px; width:212px; padding:5px;}

@media only screen and (max-width: 976px) {
  /* Layout */
  		#Lighting-products .slide {width: 90%;}
	}
	
@media only screen and (max-width: 600px) {
  /* Layout */
  		#Lighting-products {display: none; }
	}