
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/



.page_success_message {background-color:#DFF2BF; color:#4F8A10; padding:14px; margin-bottom:20px; border: 1px solid #b3ca8b; }
.page_error_message {background-color:#FFBABA; color:#D8000C; padding: 14px; margin-bottom:20px; border:1px solid #e67e7e;}
.page_error_message ul {margin-bottom:0;}



/* ==========================================================================
Author's custom styles
========================================================================== */


.video-container {position: relative;width:100%;padding-bottom: 56.25%; /* 16:9 */height: 0;}
.video-container video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.text-message {
    padding:20px;
    border:2px solid #c51f31;
    border-radius:6px;
    margin-bottom:25px;
    max-width:400px;
}

.text-message p:last-of-type {
    margin:0;
}

.logos img {
  float: left;
  height: 100px;
  padding: 2.5%;
}
@media screen and (max-width: 380px) {
  .logos img {
    float: none;
    display: block;
    max-width: 50%;
    margin: 0 auto;
    height: auto;
    padding: 25px 0;
  }
}
.image-listing {border-bottom:1px solid #e3e2df; margin-top:25px; padding-bottom:6px;}
.image-listing img {float:left; margin-right:3%; margin-bottom:15px; width:20%;}
.image-listing div {float:left; width:75%;}
.image-listing ul {padding-left:20px;}

.articles-list {margin:0; padding:0; list-style:none;}
    .articles-list li {margin-bottom:15px; border-bottom:1px solid #e3e2df;}
    .articles-list li h4 {margin-bottom:3px; background:none;}
    .articles-list li h5 {margin-bottom:4px;}

.contact-left {float:left; width:55%; margin-right:5%;}
    #form_contact {margin:0;}
    #form_contact div {margin-bottom:20px;}
    #form_contact div h4 {margin-bottom:8px;}
    #form_contact input[type="text"], #form_contact input[type="email"], #form_contact textarea {width:100%; padding:6px; box-sizing:border-box; border:1px solid #e3e2df; border-radius:0;}
    #form_contact textarea {height:200px;}
    #form_contact input[type="submit"] {padding: 14px; width:50%;}

.contact-right {width:40%; float:right;}
    .contact-right h3 {margin-bottom:15px;}


   #tabs {}
   #tabs ul {list-style:none; margin:0 0 30px; padding:0; background-color:#424343; }
   #tabs ul li {display:block; float:left; width:25%;}
   #tabs ul li a {display:block; font-family: 'arialnarrow'; text-align:center; text-decoration:none; color:#fff; text-transform:uppercase; font-size:24px; padding:8px 0;}

   #tabs ul li.ui-state-active a {background-color:#c51f31;}


  .slider-products .block-33 {margin: 0 10px; left:0; width:100%;}

  .slider-products .nav-container-left {display:block; position:absolute; top:-70px; right:50px;}
   .slider-products .slick-prev {display:block; outline:0; border:0; text-indent:-9999px; height:31px; width:25px; background:transparent url('../images/icon-arrow-left.png') no-repeat center top;}
  .slider-products .nav-container-right {display:block;position:absolute; top:-70px; right:15px;}
   .slider-products .slick-next {display:block;outline:0; border:0; text-indent:-9999px; height:31px; width:25px; background:transparent url('../images/icon-arrow-right.png') no-repeat center top;}



.resources-grid {}
.resources-grid a {display:block; text-decoration:none; text-align:center; margin-bottom:30px;}
.resources-grid a img {margin:0 auto 10px;}

.resources-grid a:nth-of-type(3n+4) {clear:both;}

.branding-logos {
    display:grid;
    grid-template-columns: 1.5fr 1fr;
    list-style:none;
    margin:0 0 2rem;
    padding:0;
}
.branding-logos li {
    text-align: center;
}
.branding-logos li img {
    margin:0 auto 1rem;
}

    .branding-colors {
        list-style:none;
        margin:0;
        padding:0;
        text-align:center;
        display:grid;
        grid-template-columns: 1fr 1fr 1fr;
        column-gap:1rem;
    }
    .branding-colors li {
        padding:2rem 1rem;
    }
    .branding-colors li h4 {
        color:#fff;
    }
    .branding-colors li p {
        margin:0;
        color:#fff;
        font-size:1.1rem;
    }
    .branding-colors li.black {
        background-color:#222222;
        color:#fff;
    }
    .branding-colors li.gray {
        background-color:#424343;
        color:#fff;
    }
    .branding-colors li.red {
        background-color:#c71c2d;
        color:#fff;
    }


.row-footer {padding: 22px 0 22px;}
.row-footer p {color:#fff; font-size:13px; line-height:16px;font-weight:normal; margin:0; padding-top:4px;}

.row-footer img {float:left; margin-right:16px;}
.row-footer .footer-block {display:block; float:left; border-right:1px solid #c51f31; margin-top:15px; margin-right:16px; padding-right:16px;}
.row-footer .footer-block.last {border-right:0; margin-right:0; padding-right:0;}
.row-footer .copyright {float:right; margin-top:15px;}
.row-footer .copyright p {font-size:12px;}
.row-footer .copyright p span {position:relative; top:6px; margin-right:5px;}
.lt-ie8 .row-footer .copyright p span {top:0;}
.row-footer .copyright a {display:inline-block; *display:inline; *zoom:1;}
.row-footer .authors {margin-top:5px;}
.row-footer .verdin {display:block; text-indent:-9999px; background: url('../images/logo-verdin.png') no-repeat center top; width:79px; height:20px; margin-right:12px;}
.row-footer .itech {display:block; text-indent:-9999px; background: url('../images/logo-itech.png') no-repeat center top; width:50px; height:20px;}
.row-footer a:hover {opacity:0.8;}

/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */





/* Medium Devices, Desktops */
@media (max-width : 1020px) {
.container {width:100%; box-sizing:border-box; padding: 0 10px;}

.menu ul li {margin: 0 14px;}

.row-footer {padding-bottom:0;}
.row-footer .container {padding:0;}
.row-footer .container img {margin-left:10px;}
.row-footer .footer-left, .row-footer .copyright {width:100%; display:block;}

.row-footer .footer-block {margin-top:8px;}
.row-footer .copyright {background-color:#242424;box-sizing:border-box; padding:6px 6px 6px 10px; margin-top:22px;}
.row-footer p {display:inline; margin-right:10px;}

.row-footer .authors {margin-top:0;}
.row-footer .copyright p span {top:0;}
.row-footer .copyright a {position:relative; top:-3px; margin-right:8px; margin-left:6px;}
.row-footer .copyright a.verdin {top:-5px;}

/* hidden content */
.hide-md {display:none;}
.hide-lg {display:inherit;}
}
@media (max-width : 950px) {

    .row-header {padding:20px 0;}
    #logo {float:none; margin:0 auto; width:223px; height:80px; background-size: 223px 80px;}
   .menu {float:none; text-align:center; padding:0; margin-top:20px;}
    .menu ul li a {padding:20px 0;}
    .menu ul ul li a {text-align:left;}



}

@media (max-width : 850px) {

    .row-top-banner {height:auto;text-align:center;}
    .row-top-banner .banner-info, .row-top-banner ul {float:none; margin:0 auto;}
    .row-top-banner ul {width:400px; margin-top:12px; margin-bottom:4px;}
    .row-top-banner ul li.facebook {margin-left:0;}

   .row-footer .footer-block {margin-right:10px; padding-right:10px;}

}


/* Small Devices, Tablets */
@media (max-width : 768px) {



    .row-header {padding-bottom:0;}
    .row-header .container {padding: 0;}
    a.menu-link {
display: block;
font-size:18px;
letter-spacing:1px;
text-transform:uppercase;
color: #fff;
padding:10px 0;
text-align:center;
background-color: #c51f31;
display:block;width:100%; float:none; margin-top:15px;
}
.menu {
clear: both;
min-width: inherit;
float: none;
padding:0; border:0; margin-top:0;
}
.menu, .menu > ul ul {
overflow: hidden;
max-height: 0;
background-color: #f4f4f4;
}
.menu > li > ul.sub-menu {
padding: 0px;
border: none;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
.menu.active, .menu > ul ul.active {
max-height: 55em;
}
.menu ul {
display: inline;
}
.menu > ul {
border-top: 1px solid #808080;
}
.menu li, .menu > ul > li {
display: block;
}

.menu ul li {margin:0;}
.menu li a {
color: #000;
display: block;
padding: 0.8em;
border-bottom: 1px solid #808080;
position: relative;
}
.menu li.has-submenu > a:after {
content: '+';
position: absolute;
top: 0;
right: 0;
display: block;
font-size: 1.5em;
padding: 0.55em 0.5em;
}
.menu li.has-submenu > a.active:after {
content: "-";
}
.menu ul ul > li a {
background-color: #e4e4e4;
padding: 19px 18px 19px 30px;
}
.menu ul ul, .menu ul ul ul {
display: inherit;
position: relative;
left: auto; top:auto;
box-shadow: none;
border:none;
padding:0;
}

.menu ul li a:hover {color:#c51f31;background-image:none;}

.menu ul li:hover a {background-image:none; background-color:#fff;}
.menu ul li:hover ul li a {background-color:#e4e4e4;}
.menu ul ul li a:hover {background-color:#fff;}



.menu ul ul > li a {text-align:center; padding-right:0; padding-left:0;}
.row-slider {padding: 15px 0 32px;}

.row-content {padding-top:15px; padding-bottom:15px;}
.row-content .home-66 {padding-left: 2%; width: 60%; box-sizing:border-box;}
.row-content .home-33 {width:38%;}
.two-col {
        -moz-column-count: 1;
       -moz-column-gap: 0%;
       -moz-column-width:100%;
       -webkit-column-count: 1;
       -webkit-column-gap:0%;
       -webkit-column-width:100%;

    column-count:1;
    column-gap:0;
    column-width:100%;}

.image-listing img {width:25%;}
.image-listing div {width:72%;}

.contact-left {width:100%; margin-right:0; float:none; margin-bottom:20px;}
.contact-right {width:100%; float:none;}

.block-33 {margin-bottom:20px;}

#tabs ul li a {font-size:18px;}

.leadership img {width:100%;}
.leadership div {width:100%; text-align:center;}
.leadership h5 {border-bottom:0; padding-bottom:0;}

.staff-block {width:47%;}


.row-footer .container img {float:none; margin:0 auto; display:block; text-align:center;}
.row-footer .footer-block {display:block; float:none; text-align:center; margin: 0 auto 10px; padding-right:0; border-right:0; border-bottom:1px solid #424343; width:100%; padding-bottom:14px;}
.row-footer .footer-block.last {border-bottom:0; margin-bottom:0;}
.row-footer p {margin-top:0; margin-right:0; padding-top:0;}

.row-footer .copyright {text-align:center; margin-top:8px;}
.copyright p {margin-right:10px;}
/* hidden content */
.hide-sm {display:none;}
.hide-lg, .hide-md {display:inherit;}
}


@media (max-width : 600px) {

   .slider-main .slick-slide img {width:auto; height:183px;}

 .commercial-image, .residential-image {display:none;}

 .branding-colors {
     display:block
 }
 .branding-colors li {
    margin-bottom:1rem;
 }


}


/* Extra Small Devices, Phones */
@media (max-width : 480px) {

    h1 {font-size:22px; line-height:22px;}
    h2 {font-size:20px;}
    .red-button { width:100%; box-sizing:border-box;}

.row-top-banner .tel {margin-right:0;}
.row-top-banner div span {display:block;}
.row-top-banner ul {width:185px;}
.row-top-banner ul li.search {margin-top:10px;margin-left:0;}
.row-top-banner ul li.search input[type="text"] {width:100%;}

.row-content .home-66 {padding-left: 2%; width:100%; box-sizing:border-box;}
.row-content .home-33 {width:100%;}

.image-listing img {width:100%;}
.image-listing div {width:100%;}

.image-50 {width:100%!important;}
.img-right {width:100%; float:none; margin: 0 0 20px 0;}

#form_contact input[type="submit"] {width:100%;}

.block-33 {width:100%!important; margin: 0 0 20px!important; float:none!important; left:0;}
.slider-products .block-33 {float:left;}

#tabs ul li a {font-size:14px;}

.nicet-certified {display:block; margin: 0 auto;}

.slider-products .nav-container-left {top:-63px; right:36px;}
.slider-products .nav-container-right {top:-63px; right:5px;}


.staff-block {width: 100%; float:none;}

.branding-logos {
    display:block;
    margin-bottom:0;
}
.branding-logos li {
    margin-bottom:2rem;
}

.copyright p {display:block; text-align:center; margin: 5px 0;}
.copyright p.authors {margin-top:10px;}
.copyright a.itech {margin-right:0;}


/* hidden content */
.hide-xs {display:none;}
.hide-lg, .hide-md, .hide-sm {display:inherit;}
}

@media (max-width : 416px) {

  .slider-products .nav-container-left, .slider-products .nav-container-right {display:none!important;}





}

@media (max-width : 400px) {

 .overlay {display:none;}
    .caption h2 {padding-right:20px;
    background: rgba(66, 67, 67, 0.6);}


}


/* ==========================================================================
Print styles.
Inlined to avoid the additional HTTP request: h5bp.com/r
========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    .row-header, .row-slider, .row-footer, .row-top-banner ul, .red-button, .contact-left {display:none;}

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
* Don't show links that are fragment identifiers,
* or use the `javascript:` pseudo protocol
*/

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
	/* kill urls printing after links in FF */
	a:link:after,
    a:visited:after {
        content: "" !important;
    }
}
