img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} * { scroll-behavior: smooth; }body, .cover, footer, .lighting { position: relative; }body, .products .sidebar a, .catalogsheet { color: #3c3c3c; }body { font-family: 'Libre Franklin', Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1.6; text-align: center; min-width: 320px;}body, header ul, .hero h1, .hero p, .products ul { padding: 0; margin: 0; }h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; }h1, h2, h3, h4, h5, h6, nav { font-weight: 500; }h1, h2, h3, h4, h5, h6, .articles h2 a { color: #112f49; }img, iframe { max-width: 100%; height: auto; }iframe, video { display: block; aspect-ratio: auto 16 / 9; width: 100%; margin: 0 auto; }.fullwidth { width: 100%; }a img, iframe { border: none; }a { transition: ease-in-out .3s; }a, header a:hover, form input[type=submit]:hover, .btn:hover, footer a:hover, .products .sidebar a:hover, .news a:hover, .articles h2 a:hover, .catalogsheet:hover, .products li a { text-decoration: none; }a, .articles h2 a:hover { color: #387ebd; }main p a, main li a { text-decoration: underline; }hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 40px 0; }h1 span { text-align: center; display: block; }.imgLeft, .imgRight { max-width: 45%; }.imgLeft { float: left; margin: 10px 4% 2% 0; }.imgCenter { display: block; margin: 0 auto; }.imgRight { float: right; margin: 10px 0 2% 4%; }.clear { clear: both; }.nowrap, a[href^=tel] { white-space: nowrap; }sup { line-height: 0; }.hide { display: none !important; }.center, .hero h1, .counter h2, .counter p, .news h3, .news p, .catalogsheet, .drivers table th, .drivers table td { text-align: center; }.wrap { display: block; max-width: 1080px; margin: 0 auto; position: relative; }.mid { align-items: center; align-self: center; }.grid, .products, .products .content ul { display: grid; grid-gap: 10px 40px; }.grid.half, .products .content ul { grid-template-columns: repeat(2,1fr); }.grid.third { grid-template-columns: repeat(3,1fr); }.grid.fourth { grid-template-columns: repeat(4,1fr); } header, .hero, .products h1, .drivers h1, .products h1 span, .drivers h1 span, .products .sidebar h2 a { position: relative; }header { position: sticky; top: 0; z-index: 999; backdrop-filter: blur(3px) }#logo { filter: drop-shadow(2px 2px 4px #000);grid-row: span 2 }header { width: 100%; background-image: linear-gradient(rgba(0,0,0,.8),transparent); }header .wrap { padding: 10px; }header .grid, footer .grid { grid-gap: 0; }header .grid { grid-template-columns: 300px 1fr; }header a:hover, footer a:hover { color: #ffd99b; }nav, footer .subfoot .grid > div:last-of-type { text-align: right; }nav ul li, footer .address ul:last-of-type li { display: inline-block; font-size: 16px; }nav ul li:hover > ul { display: grid; }nav a { padding: 5px; display: block }nav > ul > li > a { text-shadow: 0 0 3px #000; margin: 5px 5px 0; }nav a, footer .address, footer h3, footer a, .hero h1, .counter .grid, .counter h2, .news h3, .news p, .drivers table th { color: #fff; }nav > ul > li > ul { display: none; width: 100%;; border-radius: 0 0 5px 5px; border: 1px solid #112f49; position: absolute; left: 0; grid-template-columns: repeat(5, 1fr); padding: 0; box-shadow: 0px 10px 10px rgba(0,0,0,0.3), 0 10px 10px rgba(255,255,255,.5); overflow: hidden; grid-gap: 0; border-top: 10px solid transparent }nav ul ul li { display: block; text-align: left; position: relative; border: 5px solid #fff; background-color: #fff }nav li[class^=prod] > a { padding: 10px 15px }nav ul ul a { padding: 5px 10px; }nav ul ul a:hover, nav ul ul a:focus { background-color: #112f49; color: #fff; }nav ul ul a, nav ul ul a:hover { color: #112f49; }nav svg { display: inline-block; margin-left: 5px } .prod-int > a { border-bottom: 3px solid #83c89e }.prod-ext > a { border-bottom: 3px solid #f29671 }.prod-spe > a { border-bottom: 3px solid #ffd99b }.prod-haz > a { border-bottom: 3px solid #8bd1c0 }.prod-dri > a { border-bottom: 3px solid #112f49 }.prod-int a:hover { background-color: rgba(131,200,158,.3) }.prod-ext a:hover { background-color: rgba(242,150,113,.3) }.prod-spe a:hover { background-color: rgba(255,217,155,.3) }.prod-haz a:hover { background-color: rgba(139,209,192,.3) }.prod-dri a:hover { background-color: rgba(17,47,73,.1) } .hero, .cover, footer, .lighting { background-size: cover; background-position: center; }.hero { width: 100%; height: 450px; position: relative; background-color: #fff; margin-top: -200px }.hero::before { content: ''; background-size: cover; opacity: 0.5; position: absolute; inset: 0; }.hero > .wrap { top: 66%; transform: translateY(-50%); }.hero h1 { text-transform: uppercase; text-shadow: 2px 2px 3px rgba(0,0,0,.6),-2px -2px 2px rgba(0,0,0,.3); padding: 0 15px; text-transform: uppercase; font-weight: bolder; line-height: 1.1; text-align: left; font-size: clamp(40px, 9vw,55px) } .home > div { padding: 30px 0; }.home > div.pad { padding: 30px 10px }.pad { padding-left: 10px; padding-right: 10px }.home .grid, .news, .products .content ul { grid-gap: 10px; }.counter, footer .subfoot, .products .content li h2, form input, form textarea, .btn, .drivers table { font-size: 16px; }.counter .grid > div, footer .address .grid > div:first-of-type, .news a, .drivers table th { background-color: #112f49; }.counter .grid > div, .news a, .products .content img { border-radius: 5px; }.counter .grid > div { padding: 50px 10px; max-width: 240px; width: 100%; margin: 0 auto; grid-gap: 20px; box-sizing: border-box }.home .counter h2 { font-size: 36px; font-weight: 500; margin: 0; }.counter p { padding-top: 50px; }.lighting { min-height: 530px; background-image: url(/images/bg-lighting.jpg); }.lighting h3, .lighting li { color: #112f49; text-align: center; }.lighting h3 { font-size: 56px; }.lighting ul { padding: 0 }.lighting li { list-style-type: none; font-size: 24px; }.news a { padding: 40px clamp(20px, 6vw, 60px); }.news p { margin-bottom: 30px; }.btn2, .btn3, .btn4 { border-radius: 5px; border: none; }.btn2 { background-color: #f29671; }.btn3 { background-color: #ffd99b; }.btn4 { background-color: #8bd1c0; }.home .featured { overflow: hidden }.home .featured a img { transition: .5s ease all; width: 100%; object-fit: cover; }.home .featured a img:hover { transform: scale(1.1); } form { margin: 20px 0; }form .grid { grid-gap: 0 10px; }form label { display: block; }form input, form textarea, .btn { font-family: 'Libre Franklin', sans-serif; }form input, form select, form textarea { background-color: #fff; margin-bottom: 10px; padding: 10px; border: 1px solid #eee; box-sizing: border-box; width: 100% }form textarea { height: 100px; }form input[type=submit], .btn, .btn2, .btn3, .btn4 { display: inline-block; min-width: 120px; font-weight: 500; text-align: center; line-height: 1.5; color: #3c3c3c; padding: 10px 40px; margin: 10px 0; transition: ease-in-out .3s; }form input[type=submit], .btn, .catalogsheet { background-color: #fff; border: 1px solid #ddd; }form input[type=submit] { min-width: 250px; margin: 0; width: auto }form input[type=submit]:hover, .btn:hover { cursor: pointer; color: #3c3c3c; border-color: #387ebd; } main { padding: 40px 10px; }main svg, footer svg { vertical-align: middle; }.home h1, .home h2, footer h3 { font-size: 30px; }main h1, main h2, footer .address, .counter p, .news h3, .products .content h3 { font-size: 24px; }main h3, .articles h2 { font-size: 20px; }main h4, .products .sidebar h2 { font-size: 18px; }main ul, main ol { padding-left: 25px; }main li, footer li { margin: 5px 0; } .nolist, footer ul, .products .content ul { list-style: none; padding-left: 0; }.products { grid-template-columns: 105px 1fr; }.products .content .interior, .products .content .exterior, .products .content .specialty, .products .content .hazardous { display: none; }.products h1, .drivers h1, .products .sidebar h2 { border-left: 10px solid #eee; }.products h1, .drivers h1 { line-height: 1.2; padding-left: 15px; margin: 40px 0 20px; }.products .interior h1, .products .sidebar .interior h2, .products .content .interior .btn:hover { border-color: #83c89e; }.products .exterior h1, .products .sidebar .exterior h2, .products .content .exterior .btn:hover { border-color: #f29671; }.products .specialty h1, .products .sidebar .specialty h2, .products .content .specialty .btn:hover { border-color: #ffd99b; }.products .hazardous h1, .products .sidebar .hazardous h2, .products .content .hazardous .btn:hover { border-color: #8bd1c0; }.drivers h1, .products .sidebar .drivers h2 { border-color: #112f49; }.sidebar .clearance-sub h2 {border-left: 10px solid #EF0000;}.products h1 span, .drivers h1 span { background-color: #fff; padding: 0 20px 0 15px; left: -15px; z-index: 888; }.products h1:after, .drivers h1:after { content: ""; background-color: #eee; width: 100%; height: 1px; position: absolute; left: 0; top: 50%; }.products .interior h1:after { background-color: #83c89e; }.products .exterior h1:after { background-color: #f29671; }.products .specialty h1:after { background-color: #ffd99b; }.products .hazardous h1:after { background-color: #8bd1c0; }.drivers h1:after { background-color: #112f49; }.products .sidebar h2, .products .content li h2 { font-weight: 400; }.products .sidebar { margin-top: 50px; }.products .sidebar a { display: block; letter-spacing: .25px }.products .sidebar a:hover { font-weight: 600; letter-spacing: unset }.products .sidebar a:hover, .products .sidebar a { transition: letter-spacing 0s }.products .sidebar h2 { max-height: 45px; margin: 50px 0; padding-left: 10px; }.products .sidebar h2 a { top: -5px; }.products .content li h2 { margin-bottom: 0; }.products .content li h3 { margin-top: 0; }.products .content li p { min-height: 145px; }.drivers h1 { margin: 20px 0 40px; }.product-features { text-align: left; }.products .content .product-features ul { grid-gap: 10px 40px; list-style: disc; padding-left: 20px; }.products .content .product-features li { margin: 0; }.catframe { max-width: 600px; padding: 20px 10px; margin: 40px auto 10px }.catframe embed { display: block; width: 100%; height: 250px; overflow: hidden; }.catframe a.catalogsheet { display: block; padding: 10px 0; margin-top: 20px; }.catframe a.catalogsheet:hover { border-color: #387ebd; }.drivers table, .drivers table th, .drivers table td { border: 1px solid #eee; }.drivers table th, .drivers table td { padding: 10px; }.drivers table { width: 100%; border-collapse: collapse; padding: 0; line-height: 1.4; }.drivers table .controls { font-weight: 500; background-color: #eee; }.articles { margin-top: 50px; }.articles h2 { margin-top: 30px; }.top { text-align: right; }.top .btn{padding:5px 20px 4px;margin:0 10px}.top .btn:hover { color: #fff; background-color: #112f49 }.sitesearch input { padding: 7px;display:inline-block;width:100%;margin:0 }.sitesearch { margin: 0;display:inline-block;padding-right:40px;position:relative }.sitesearch button { background-color: #f29671; padding: 10px; border: none;display:inline-block;position:absolute;right:0;cursor:pointer } footer { background-image: url(/images/map.png); background-position-y: 70%; }footer .address { background-image: linear-gradient(to right,#112f49 30%,transparent 30%); }footer .address h3, footer li { text-align: center; }footer .address .grid > div:first-of-type { padding: 20px 0; }footer .address ul { margin-bottom: 30px; font-size: 18px; }footer .address ul:last-of-type li { margin-right: 10px; }footer .subfoot { background-color: #fff; padding: 20px 0; }footer .address .grid { grid-template-columns: 350px 1fr; }.subfoot .wrap { padding: 0 10px }.subfoot .grid { grid-template-columns: 1fr 150px }.ccpaNotice { text-align: center !important; }.bg-light {background-color:#f5f0f0; margin:10px;} .clearance h3 {text-align: center; font-size: 30px;}.clearance .product {padding: 20px;} .clearance h2 {font-size: 40px;}.clearance h4 {text-align: center; font-weight: bold;} .clearance h3 {text-align:left;}#specialtylighting {border-left:10px solid #ffd99b;}#exteriorlighting {border-left:10px solid #f29671;}#interiorlighting {border-left:10px solid #83c89e;}#hazardouslighting {border-left:10px solid #8bd1c0; }.clearance h2:nth-of-type(2) {border-left:10px solid #f29671;}.clearanceSpecialty h3 {color:#ffd99b;}.clearanceInterior h3 {color:#83c89e;}.clearanceHazardous h3 {color:#8bd1c0;}.clearanceExterior h3 {color:#f29671;}.clearance summary::marker {float:right;}.clearance summary .btn {border: none;}.clearance summary {text-align: left;} @media(prefers-reduced-motion) { * { scroll-behavior: unset } * { transition: all 0s !important } * { animation: none } .home .featured a img:hover { transform: none }} @media(max-width:999px) { header .grid{grid-template-columns:250px 1fr} nav ul ul { display: none !important } nav svg{display:none} .grid.news, .featured .grid { grid-template-columns: 1fr 1fr } .news a { padding: 10px clamp(20px, 6vw, 60px) } .news a:last-of-type { grid-column: span 2 } .featured img { max-height: 200px } nav a { text-shadow: 1px 1px 1px #000,-1px -1px 2px #666 }} @media(max-width:800px){ .grid.half:has(.catframe) { grid-template-columns: 1fr }} @media(max-width:767px) { header .grid, .products, .grid.slides { grid-template-columns: 1fr } nav ul,.top { text-align: center } nav a { margin: 5px 10px } header { background-color: #112f49; position: relative } .hero { margin-top: 0; height: 300px } .hero > .wrap { top: 50% } .sidebar { display: flex; flex-wrap: wrap } .sidebar > * { flex: 1 0 150px; margin: 10px 5px } .sidebar a { white-space: nowrap } .products .sidebar h2 { margin: 0 } .products .sidebar h2 a { top: unset } .slides a { height: 300px } .slides img { object-fit: cover; height: 100%; width: 100% } .sitesearch form input { width: 50%; }} @media(max-width:600px) { footer .address .grid, .grid.news { grid-template-columns: 1fr } .news a:last-of-type { grid-column: unset } footer { background-image: unset } .top .btn, .sitesearch { width: 200px; box-sizing: border-box; white-space: nowrap; margin: 4px }} @media(max-width:500px) { .products .content ul, .counter .grid, .featured .grid { grid-template-columns: 1fr } .counter .grid > div { max-width: unset; padding: 20px 10px } nav ul { display: grid; grid-template-columns: 1fr 1fr 1fr } nav li:last-of-type:nth-of-type(odd){grid-column: 1/-1} nav a { margin: 5px;text-align:center } } @media(max-width:400px) { .subfoot .grid { grid-template-columns: 1fr } .subfoot p { text-align: center }}