body {
  overflow: hidden;
}

.full-width .page-title { display: none;}


/* Commercial Page ----------- */

div.commercial { width: 100% !important; margin: 0 auto; border-bottom: 0px solid; }
div.commercial h2 { font-family: Arial Black, Arial Bold, Gadget, sans-serif; text-transform: uppercase; }
div.commercial h2 { font-family: Arial Black, Arial Bold, Gadget, sans-serif; text-transform: uppercase; }
div.commercial h3 { font-family: 'Quicksand', Helvetica, Arial, sans-serif; font-weight: bold; }
div.commercial h4 { font-family: 'Quicksand', Helvetica, Arial, sans-serif; font-weight: bold; }
div.commercial h5 { font-family: 'Quicksand', Helvetica, Arial, sans-serif; font-weight: bold; }
div.commercial p { font-family: 'Quicksand', Helvetica, Arial, sans-serif; }


#commercial {
  clear: both;
  float: left;
  width: 100%;
  height: 800px;
  background: url(https://cdn.shopify.com/s/files/1/0234/8675/files/comm_hero.jpg?6311647147948894573) no-repeat top center;
  background-size: cover;
}


#commercial-text h1 { color: #ffffff !important; font-size: 42px; line-height: 1.5em;  }
#commercial-text h2 { color: #ffffff !important; font-size: 40px; line-height: 1.5em;  }
#commercial-text h3 { color: #ffffff !important; font-size: 24px; line-height: 1.5em;  text-transform: uppercase; }
#commercial-text p { color: #ffffff !important; font-size: 20px; line-height: 1.5em; font-weight: normal; margin: 0; }
#commercial-text a { color: #FFFF99 !important; font-size: 16px; line-height: 1.5em; font-weight: normal; margin: 0; }

#commercial-text {  width: 50%; max-width: 1200px; padding: 100px 0 0 50px; height: auto; }


#commercialbulbs {
  width: 100%;
  background-color: #D1EEEE;
}

#commercialbulbs img {
  margin: 0 auto;
  width: 50%;
  min-width: 100px;
  max-width: 250px;
}

#commerciallist {
  width: 100%;
  float: left;
  background-color: #fff;
  margin: 0 auto;
  padding: 150px 0;
}
#commerciallistcontainer { width: 70%; max-width: 1200px; margin: 0 auto;  }

#commerciallistcontainer p { font-size: 20px; line-height: 1em; font-weight: normal; margin: 0; }

#commerciallistcolumn { width: 49%; float: left; min-width: 300px; margin: 0 auto; text-align: center; }

#commercialphotos {
  width: 100%;
  min-width: 250px;
  margin: 0 auto;
  float: left;
}

#commercialphotoscontainer {
  width: 80%; 
  margin: 0 auto;
}

#commercialphotos img {
  width: 25%;  
  min-width: 200px;
  float: left;
  margin: 0 auto;
}


#commercialtestimonial {
  width: 100%;
  float: left;
  background-color: #00B8E6;
  margin: 0 auto;
  padding: 70px 0;
}

#commercialtestimonialcontainer { width: 70%; margin: 0 auto;  }

#commercialtestimonial p { color: #ffffff !important; font-size: 20px; line-height: 1.7em; font-weight: normal; margin: 0; }
#commercialtestimonial strong { color: #ffffff !important; font-size: 20px; line-height: 1.7em; font-weight: bold; margin: 0; }


#commercialreview {
  width: 100%;
  float: left;
  background-color: #fff;
  margin: 0 auto;
  padding: 100px 0;
}

#commercialreview1container { width: 70%; max-width: 1000px; margin: 0 auto;  }
#commercialreview1container p { color: #777; font-size: 12px; font-family: arial, sans-serif; line-height: 1.2em; font-weight: normal; margin: 0 auto; }
#commercialreview1container img { float: right; margin: 0 0 50px 50px; }


#commercialreview2container { width: 70%; max-width: 1000px; margin: 0 auto; padding-top: 100px;  }
#commercialreview2container p { color: #777; font-size: 12px; font-family: arial, sans-serif; line-height: 1.2em; font-weight: normal; margin: 0 auto; }
#commercialreview2container img { float: left; margin: 0 50px 50px 0; }

#commercialcontactform-text {  width: 70%; padding: 100px 0 0 50px; margin: 0 auto; text-align: center; }
#commercialcontactform  {
  width: 100%;
  float: left;
  background-color: #fff;
  margin: 0 auto;
  padding: 0 0 70px 0;
}

#commercialcontactformcontainer { width: 45%; background-color: #fff; max-width: 800px; min-width: 300px; margin: 0 auto; }
#mc_embed_signup .mc-field-group { padding-bottom: 10px !important; }
#mc-embedded-subscribe .button {  border: 0 !important; margin-top: 50px; background-color: #2ab577 !important; }



@media only screen and (min-width : 100px) and (max-width : 640px) { 
  #commercial { height: 400px; }
  #commercial-text { width: 65%; max-width: 300px; padding: 20px 10px;}
  #commercial h1 { font-size: 26px; line-height: 1.5em; }
  #commercial h2 { font-size: 22px; line-height: 1.1em; }
  #commercial p { font-size: 16px;}
  #commercial h3 { font-size: 18px;}
  #commercial a  { font-size: 12px;}
  #commerciallist { padding: 50px 0;}
  #commerciallistcontainer { width: 100%; max-width: 350px; }
  #commerciallistcolumn { width: 100%;}
  #commercialphotoscontainer { width: 100%; }
  #commercialphotos img { width: 100%; max-width: 600px; }
  #commercialtestimonialcontainer { width: 95%; }
  #commercialtestimonial p { font-size: 14px;}
  #commercialtestimonial strong { font-size: 14px;}
  #commercialreview1container { width: 80%; }
  #commercialreview2container { width: 80%; }
  #commercialreview1container img { float: left; margin: 50px 0 !important;} 
  #commercialreview2container img { float: left; margin: 50px 0 !important;}
  #commercialreview1container p { float: left; clear: both; margin: 0 auto; } 
  #commercialreview2container p { float: left; clear: both; margin: 0 auto; padding: 0 0 50px 0; }
  #commercialcontactform-text { width: 95%; padding: 0; }
  #commercialcontactform-text h2 {  font-size: 24px; line-height: 1.1em; }   
  #commercialcontactformcontainer { width: 95%; }
}

@media screen and (min-width: 480px) and (max-width: 640px) and (orientation: landscape) {
  #commercial-text { width: 95%; max-width: 300px; padding: 50px 10px;}
  #commercial h1 { font-size: 24px; line-height: 1.5em; }
  #commercial h2 { font-size: 20px;}
  #commercial p { font-size: 16px;}
  #commercial h3 { font-size: 18px;}
  #commercial a  { font-size: 12px;}
  #commercialtestimonialcontainer { width: 95%; }
  #commercialtestimonial p { font-size: 14px;}
  #commercialtestimonial strong { font-size: 14px;}
}
@media screen and (min-width : 641px) and (max-width: 767px){ 

  #commercial-text { width: 95%; max-width: 450px; padding: 50px 10px;}
  #commercial h1 { font-size: 32px; line-height: 1.5em; }
  #commercial h2 { font-size: 26px;}
  #commercial p { font-size: 16px;}
  #commercial h3 { font-size: 20px;}
  #commercial a  { font-size: 12px;}
  #commercialtestimonialcontainer { width: 95%; }
  #commercialtestimonial p { font-size: 14px;}
  #commercialtestimonial strong { font-size: 14px;}
}

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) { 
  #commercial-text { width: 95%; max-width: 500px; padding: 50px 10px;}
  #commercial h1 { font-size: 32px; line-height: 1.5em; }
  #commercial h2 { font-size: 24px;}
  #commercial p { font-size: 16px;}
  #commercial h3 { font-size: 20px;}
  #commercial a  { font-size: 12px;}
  #commercialtestimonialcontainer { width: 95%; }
  #commercialtestimonial p { font-size: 14px;}
  #commercialtestimonial strong { font-size: 14px;}
}

@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  #commercial-text { width: 95%; max-width: 500px; padding: 50px 10px;}
  #commercial h1 { font-size: 36px; line-height: 1.5em; }
  #commercial h2 { font-size: 32px;}
  #commercial p { font-size: 16px;}
  #commercial h3 { font-size: 20px;}
  #commercial a  { font-size: 12px;}
  #commerciallistcolumn { width: 100%; }
  #commercialtestimonialcontainer { width: 95%; }
  #commercialtestimonial p { font-size: 14px;}
  #commercialtestimonial strong { font-size: 14px;}
}

@media screen and (min-width: 980px) and (max-width: 1223px){
  #commercial h1 { font-size: 36px; line-height: 1.1em; }
}

@media screen and (min-width: 1500px){
#commercial-text {  width: 30%; max-width: 1200px; padding: 100px 0 0 50px; height: auto; }
}