/* Modern Business */
@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.top_bar {
    min-height: 40px; /* background: #30bed6; /* Old browsers */
    background: -moz-linear-gradient(left, #FFF 0, #FFF 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #FFF 0,#FFF 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #FFF 0,#FFF 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=1); /* IE6-9 */
}

/*
    Uncomment if we're putting the COVID-19 message back on the site.

.globalAlert {
    background: black;
    box-sizing: border-box;
    color: #fff;
    font-family: Optimist, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    position: relative;
    padding: 5px 0 5px 0;
}
*/

.rightc {
    list-style-type: none;
    margin-bottom: 0;
    float: right;
    margin-top:20px;
}

    .rightc li {
        margin: 0 10px;
        font-size: 13px;
        float: left;
        line-height: 40px;
        color: #FFF;
    }

        .rightc li a {
            color: black;
        }

.navbar { background-color:white;}

.navbar-brand img {
    margin-top: 0;
    margin-left: 0;
}

.navbar-brand {
    padding: 0;
}

/*.header_image { margin-top:-70px; float:left;}*/
.nav.navbar-nav.navbar-right span {
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    font-weight: 300;
    color: #1b6977;
}

.navbar-right li a {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
}
/* color:#1b6977 !important; */


.img-home-portfolio,
.img-customer,
.portfolio-item {
    margin-bottom: 30px;
}

.offset:before {
    display: block;
    content: " ";
    height: 135px; /* Give height of your fixed element */
    margin-top: -135px; /* Give negative margin of your fixed element */
    visibility: hidden;
}

.tab-pane {
    margin-top: 15px;
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1010;
    display: none;
    max-width: 600px;
    padding: 1px;
    text-align: left;
    white-space: normal;
    background-color: #ffffff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
}

/* Page Sections */
.section,
.section-colored {
    padding: 50px 0;
}

.section-colored {
    background-color: #e1e1e1;
    /* change this to change the background color of a colored section */
}

.section-white {
    background-color: #ffffff;
    /*padding: 50px 0;*/
    /*padding-top: 140px;*/
    padding-bottom: 50px;
    /* change this to change the background color of a colored section */
}

.sidebar {
    margin-top: 40px;
}

    .sidebar ul {
        border-radius: 5px;
        padding: 5px;
        border: 1px solid #cccccc;
    }

/* Half Page Height Carousel Customization */
.carousel {
    height: 70%; 
    /*height: 50%; switch to 50 when re-adding COVID message*/
    /*top: 125px; Remove when COVID is removed*/
}

.carousel-caption {
    position: absolute;
    width: 750px;
    left: 15%;
    right: 15%;
    bottom: 80px;
    z-index: 10;
    padding: 20px;
    color: #ffffff;
    text-align: left;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
    background: rgba(0, 0, 0, 0.45);
    font-family: 'Raleway',sans-serif;
    line-height: 1.1;
}
    .carousel-caption .head1 {
        font-size: 36px;
        font-weight: bold;
        text-transform: uppercase;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .carousel-caption .text1 {
        font-style: italic;
        padding-bottom: 15px
    }



.carousel-box {
    background-color: gray;
    opacity: .6;
}

.item,
.active,
.carousel-inner {
    height: 100%;
}

/* Used at the top of each linked page */
.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}

.skyLogo {
    background: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('/assets/Home/Sky image 1.jpg');
    background-position: center;
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    /*top: 125px;*/
    width: 100%;
    overflow: hidden;
    display: block;
}

.solarPanelRow {
    background-color: white;
    display:block;
    position:relative;
    overflow:hidden;
}

.solarPanelImage {
    background-image: url('/assets/Home/DronePhotoCropped.JPG');
    height: 600px;
    width: 100%;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: block;
}

.AlmoVideo {
    height: 300px;
    width: 550px;
}

.icons {
    z-index: 10;
    max-height: 150px;
    max-width: 135px;
    margin-top:50px;
    /*remove margin top on mobile*/
}

#displayData {
    font-size: 30px;
    white-space: normal;
}

/* Social Icons Styles */
.list-social-icons {
    margin-bottom: 45px;
}

.tooltip-social a {
    text-decoration: none;
    color: inherit;
}

.facebook-link a:hover {
    color: #3b5998;
}

.linkedin-link a:hover {
    color: #007fb1;
}

.twitter-link a:hover {
    color: #39a9e0;
}

.google-plus-link a:hover {
    color: #d14836;
}



/* Service Page Styles */
.service-icon {
    font-size: 50px;
}

/* 404 Page Styles */
.error-404 {
    font-size: 8em;
}

/* Footer Styles */
footer {
    margin: 50px 0;
}

/* LESS Variables and mixins */
.font1 {
    font-family: 'Lato', sans-serif;
}

.font2 {
    font-family: 'Raleway', sans-serif;
}
/* END LESS Variables and mixins */

/* Bootstrap overrides */
/* Override Bootstrap printing urls*/
@media print {
    a[href]:after {
        content: "";
    }
}

.contactForm {
    margin-bottom: 30px;
}

.btn {
    border-radius: 0;
    font-family: 'Lato', sans-serif;
    padding: 8px 12px;
    font-size: 16px;
}
/* Turn off bootstrap default gradient shading behind arrows */
.carousel-control.left,
.carousel-control.right {
    background: none;
    width: 10%;
}

.carousel-caption h1,
.carousel-caption h2,
.carousel-caption h3,
.carousel-caption h4 {
    color: white;
    font-weight: bold;
}

.ALMOdropdown{
    position: relative;
  display: inline-block;
  margin-right: 20px;
}

.ALMOdropdown-content {
  display: none;
  position: absolute;
  background-color: silver;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  /*
      min-width: 160px;
  
  
      */
}

.ALMOdropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.ALMOdropdown-content a:hover {background-color: #dadada;}

.ALMOdropdown:hover .ALMOdropdown-content {display: block;}

.almo-green {
    color: #80c64b;
}

.almo-green-border {
    border-color: #80c64b;
}

.almo-blue {
    color: #143a7e;
}

.blue-bar {
    background-image: url('/assets/Static/blueBlock.png');
    height: 10px;
    width: 100%;
    vertical-align: bottom;
}

.blue-up {
    position: relative;
    top: -15px;
    /*right:-115px;*/
}

.blue-up-shrink {
    position: relative;
    top: -14px;
}

.top-nav-collapse {
    padding: 0;
    border-bottom: 1px solid #878787 !important;
}
/*
.navbar-fixed-top {
  top: 0;
  border-width: 0;
}
.navbar-default.top-nav-collapse,
.navbar-collapse.collapse {
  background: white;
}
.navbar-custom {
  /*background-color: transparent;
  background: white;
  z-index: 1000;
  -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -o-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;
}
 .navbar-default .navbar-nav li a:hover, 
 .navbar-default .navbar-nav li a:active, 
 .navbar-default .navbar-nav > .active > a,
 .navbar-default .navbar-nav > .active > a:hover, 
 .navbar-default .navbar-nav > .active > a:focus {
        box-shadow: none;
 }*/
.fadder {
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 2s;
}
/* End Bootstrap overrides */
/* Default HTML values */
html {
    overflow-x: hidden !important;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-font-smoothing: antialiased;
    /*text-rendering: optimizeLegibility; // CAUSES FONT ISSUES!!!!!!!!!*/
}

.page-footer {
    background: #2a2a2a;
}

body {
    /*padding-top: 50px;*/
    height: 100%;
    background: #373838;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    color: #444444;
    border: 0;
    margin: 0;
    /*padding: 0;*/
    /*padding-top: 112px;*/
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    color: #143a7e;
    text-transform: uppercase;
}

h3, .h3 { font-size: 28px; }

a,
a:hover,
a:active,
a:focus {
    color: #adacac;
    text-decoration: none;
}

#navlist a,
#navlist a:hover,
#navlist a:active,
#navlist a:focus {
    color: black;
    text-decoration: none;
    border: none;
    font-weight: bold;
    border-radius: 0;
}

#navHidden a,
#navHidden a:hover,
#navHidden a:active,
#navHidden a:focus {
    color: black;
    text-decoration: none;
    border: none;
    border-radius: 0;
}

.navbar-collapse.in {
    overflow: hidden;
    max-height: none !important;
    height: auto !important;
}
/*
#navlist a,
#navlist a:hover,
#navlist a:active,
#navlist a:focus {
    color: black;
    font-weight:bold;
    text-decoration: none;
    border:none;
    padding: 8px 16px;
    margin: 6px 6px;
    border-radius: 0;

#xsNav > li > a {
    padding-left: 30px;
    margin: 0 !important;
    border: 1px solid transparent;
    overflow-x:hidden;
    border-radius: 4px;
}*/
.no-left {
    padding-left: 15px;
}
/*ul.dropdown-menu > li {
    padding-left: 30px;
    margin: 0;
    border: 1px solid transparent;
    border-radius: 4px;
}*/

/*#navlist a:hover,
#navlist a:active,
#navlist a:focus {
  background: #143a7e;
  color: white;
  border-radius: 0;
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}*/

/*#navlistright a,
#navlistright a:hover,
#navlistright a:active,
#navlistright a:focus {
    color: #143a7e;
    font-weight:bold;
    /*text-decoration: underline;
    border:none;
}*/
.section {
    padding: 50px 0;
    color: white;
}

    .section h4,
    .section h3,
    .section h2,
    .section h1 {
        color: white;
        font-weight: bold;
    }
/* End Default HTML values */
/* Menu and NAV */
.menu {
    display: inline-block;
    vertical-align: middle;
    margin-top: 5px;
}

    .menu a {
        color: black;
        padding: 0;
        margin: 0 10px;
        position: relative;
    }

        .menu a:hover {
            text-decoration: none;
        }

        .menu a::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 1px;
            top: -5px;
            left: 0;
            background-color: black;
            visibility: hidden;
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
        }

        .menu a:not(.dropdown-toggle):hover:before {
            visibility: visible;
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }

#top {
    position: absolute;
}

#tbLogo {
    margin-left: 25px;
    width:182px;
    top: 20%;
    position: absolute;
    /*position: relative;*/
    z-index: 10000;
}

#tbLogoxs {
    margin-top: -15px;
    position: relative;
    z-index: 10000;
}

#imgBar {
    background-image: url('/assets/Home/Strip.jpg');
    height:150px;
}

.logoLarge {
    width: 182px;
    height: 69px;
    -webkit-transition: width .5s linear, height .5s linear;
    -moz-transition: width .5s linear, height .5s linear;
    -o-transition: width .5s linear, height .5s linear;
    transition: width .5s linear, height .5s linear;
}

.logoShrink {
    width: 108px;
    height: 41px;
    -webkit-transition: width .5s linear, height .5s linear;
    -moz-transition: width .5s linear, height .5s linear;
    -o-transition: width .5s linear, height .5s linear;
    transition: width .5s linear, height .5s linear;
}

.mfr-img {
    border: 0;
}

.front-img {
    border: 0;
}

.well {
    background-color: white;
}

.textShrink {
    font-size: smaller;
    height: 44px;
}
/* END Menu and NAV */
/* Home page, main image slider */
#home {
    /*position:relative;
    top: -4px;*/
}
/*#home,*/
.slide1 {
    background-image: url('/assets/Home/Major_appliance2.jpg');
    min-height: 800px;
    position: relative;
    /*min-width:100%;*/
    background-size: cover;
    background-position: center center;
}

.slide2 {
    background-image: url('/assets/Home/Premium4.jpg');
    min-height: 800px;
    position: relative;
    background-size: cover;
    min-width: 100%;
    /*top:-100px;*/
    background-position: center center;
}

.slide3 {
    background-image: url('/assets/Home/CE.jpg');
    min-height: 800px;
    position: relative;
    background-size: cover;
    min-width: 100%;
    background-position: center center;
}

.slide4 {
    background-image: url('/assets/Home/Pro_av.jpg');
    min-height: 1200px;
    position: relative;
    min-width: 100%;
    background-position: bottom;
    /*top: 100px;*/
}

.slide5 {
    background-image: url('/assets/Home/Outdoor_furniture2.jpg');
    /*height: 10vh;*/
    min-height: 800px;
    position: relative;
    background-size: cover;
    /*top:130px;*/
    background-position: center center;
    /*background-position:bottom;*/
}

.slide6 {
    background-image: url('/assets/Home/Drone photo 2 .JPG');
    min-height: 800px;
    position: relative;
    background-size: cover;
    background-position: center center;
}

.slide7 {
    background-image: url('/assets/Home/DroneSlider.jpg');
    min-height: 800px;
    position: relative;
    background-size: cover;
    background-position: center center;
}

.slide8 {
    background-image: url('/assets/Home/HospSlider.jpg');
    min-height: 800px;
    position: relative;
    background-size: cover;
    background-position: center center;
}

#mainSlide {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

#myCarousel .carousel-control .icon-prev,
#myCarousel .carousel-control .icon-next {
    font-size: 100px;
    color: white;
}

/* END Home page, main image slider */
/* Divider bar on frontpage */
#overlay {
    height: 16px;
    background-color: white;
    position: absolute;
}

.white-right {
    height: 16px;
    z-index: 25;
    background-color: white;
    left: auto;
    right: 0;
    position: absolute;
    bottom: 0;
    width: 49%;
    font-size: 20px;
    color: #ffffff;
    text-align: center;
}

.white-left {
    height: 16px;
    z-index: 25;
    background-color: white;
    left: 0;
    right: auto;
    position: absolute;
    bottom: 0;
    width: 49%;
    font-size: 20px;
    color: #ffffff;
    text-align: center;
}

#vImg {
/*    border-left: 15px solid white;
    border-right: 15px solid white;*/
    vertical-align: top;
}

#divider {
    height: 16px;
    /*background-image: url('/assets/Static/ssBG.jpg');*/
    background-color: #143a7e;
}

.main-img {
    height: 50%;
    position: relative;
}

.main-caption {
    left: 10%;
    right: 10%;
    bottom: 8%;
    text-align: center;
    color: white;
    position: absolute;
    z-index: 10;
    text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6)
}

    .main-caption h1,
    .main-caption h2,
    .main-caption h3,
    .main-caption h4,
    .main-caption h5 {
        color: white;
        font-weight: bold;
        font-family: 'Raleway',sans-serif;
        text-transform: uppercase;
        text-align: center;
    }

.second-caption {
    text-align: center;
    color: white;
    position: absolute;
    z-index: 10;
    text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6);
    margin-top: 30px;
    display: block;
    left: 10%;
    right: 10%;
    /*Mobile top: 118px;*/
}

    .second-caption h1,
    .second-caption h2,
    .second-caption h3,
    .second-caption h4,
    .second-caption h5 {
        font-size: 24px;
        color: white;
        font-weight: bold;
        font-family: 'Raleway',sans-serif;
        text-transform: uppercase;
        text-align: center;
    }

    .second-caption b{
        font-size: 16px;
    }

.energy-caption {
    text-align: center;
    color: white;
    z-index: 10;
    text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6);
    margin-top: 50px;
    left: 10%;
    right: 10%;
}


    .energy-caption h4 {
        color: white;
        font-weight: bold;
        font-family: 'Raleway',sans-serif;
        text-transform: uppercase;
    }

.kw {
    font-size: 20px;
}

.solarData b {
    font-size: 40px;
}


@media (min-width: 1200px){
    .skyLogo {
        height: 770px;
        top: 98px;
    }
}

@media (max-width: 1024px){
    .solarPanelImage {
        height: 400px;
    }
}

@media (max-width: 1012px){
    .skyLogo{
        /*top: 170px;*/
    }

    .AlmoVideo{
        height: 200px;
        width: 350px;
    }

}

@media (max-width: 805px) {
    .skyLogo {
        /*top: 230px;*/
    }
    .icons{
        height: 100px;
        width: 90px;
    }
    .solarPanelImage {
        height: 275px;
    }
}


@media (max-width: 768px){
    .skyLogo{
        top:0;
    }
    .icons{
        height: 75px;
        width: 70px;
        margin-top: 0;
    }

    .second-caption h4{
        font-size: 18px;
    }
}

@media (max-width: 450px){
    .energy-caption b {
        font-size: 18px;
    }
    .solarPanelImage{
        height: 250px;
    }
    .AlmoVideo{
        height: 150px;
        width: 250px;
    }
    .solarPanelImage {
        height: 200px;
    }
}


.navbar { margin-bottom:0;}
/*Test on changing the top bar position to not go with window scroll.*/

/* Keep the covid banner visible */
@media (min-width: 1201px)
{
    .globalAlert {
        margin-top: 98px;
    }
}

@media (max-width: 1200px) {
    .navbar-fixed-top {
        position: relative;
    }
    .navbar {
        margin-bottom: 0;
    }

    #tbLogo {
        /*width: 150px;*/
        height: 50px;
        margin-left:0;
        margin-top: -5px;
    }
}

/*Solar Data*/
.solarData {
    display: inline-block;
    color: white;
}

    .solarData b {
        /*font-size: 36px;*/
        padding: 2px;
        background-color: #80c64b;
        border-color: white;
        border: solid;
        border-width: 1px;
        letter-spacing: 5px;
        margin-top: 5px;
        margin-bottom: 5px;
    }

/*
#divArrow {
    height: 16px;
    position: absolute;
    bottom: 5px;
    z-index: 25;
    width: 100%;
    text-align: center;
}*/

#arrowV {
    width: 100%;
    bottom: 0;
    position: absolute;
    height: 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

#divArrow {
    /*height: 16px;*/
    /*position: absolute;*/
    bottom: 5px;
    z-index: 25;
    /*width: 100%;*/
    text-align: center;
    height: 16px;
    flex-grow: 0;
}
.whiteSide {
    background: white;
    flex-grow: 1;
    width: 100%;
    height: 16px;
}

/* Welcome message on home page slider */
.welcome {
    color: #f4f4f4;
    /*max-width: 860px;*/
    padding: 0 10px;
    position: absolute;
    /*top: 60%;
        margin-top: -170px;*/
    bottom: 60px;
}

    .welcome .description {
        display: block;
        font-size: 30px;
        line-height: 30px;
        margin: 20px 0;
        text-shadow: 2px 2px 2px black, /*1px 1px 1px black,*/ 1px 1px 1px black, 1px 1px 10px black;
    }
/* END Welcome message on home page slider */

/* Parters section */
#Partners {
    background: white;
}

    #Partners p,
    #Partners h3 {
        color: black;
    }

.box {
    margin: 0 auto;
}

    .box .text-container {
        padding: 10px;
        /*margin-bottom: 15px;*/
    }
/* END Parters section */

/* Pre-footer */
#preFoot {
    background: #383838;
    color: #848484;
}

.contactInfo .company-name {
    font-weight: 700;
}

.contactInfo ul {
    list-style: none;
    margin: 0;
    padding-left: 25px;
    font-size: 14px;
    font-weight: 300;
}

    .contactInfo ul li {
        margin-bottom: 7px;
    }

        .contactInfo ul li::before {
            display: inline-block;
            font-family: FontAwesome;
            font-size: 14px;
            margin-left: -35px;
            text-align: center;
            vertical-align: top;
            width: 35px;
        }

        .contactInfo ul li:nth-child(1)::before {
            content: "\f041";
            /* Home */
        }

        .contactInfo ul li:nth-child(2)::before {
            content: "\f095";
            /* Phone */
        }

        .contactInfo ul li:nth-child(3)::before {
            content: "\f1ac";
            /* Fax */
        }

        .contactInfo ul li:nth-child(4)::before {
            content: "\f003";
            /* Email */
        }
/* END Pre-Footer */

/* Footer */
#footer {
    background: #2b2b2b;
    padding: 30px 0;
    font-size: 14px;
    color: #878787;
}

    #footer .terms {
        margin-right: 20px;
    }

.social i {
    font-size: 40px;
    padding: 20px;
}
/* END Footer */

/* Link Buttons */
.btn-big {
    font-size: 20px;
    padding: 15px 25px;
}

.btn-med {
    font-size: 20px;
    padding: 13px 23px;
}

.btn-front-blue,
a.btn-front-blue:active,
a.btn-front-blue:visited {
    color: #143a7e;
    border: 1px solid #143a7e;
    font-size: 16px;
    padding: 8px 12px;
}

a.btn-front-blue:hover {
    background: rgba(0, 0, 0, 0.2);
    color: black;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.btn-front-green,
a.btn-front-green:active,
a.btn-front-green:visited {
    color: #80c64b;
    border: 1px solid #80c64b;
    font-size: 16px;
    padding: 8px 12px;
}

a.btn-front-green:hover {
    background: rgba(0, 0, 0, 0.2);
    color: black;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

a.btn-light,
.btn-light,
a.btn-light:active,
a.btn-light:visited {
    border: 1px solid white;
    color: white;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

    a.btn-light:hover {
        background: rgba(255, 255, 255, 0.2);
        color: white;
        -webkit-transition: all 0.3s ease-in-out 0s;
        transition: all 0.3s ease-in-out 0s;
    }

a.btn-dark:hover {
    background: rgba(0, 0, 0, 0.2);
    color: black;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

a.btn-dark,
.btn-dark {
    color: black;
    border: 1px solid black;
}

a.btn-dark-c,
.btn-dark-c {
    background: rgba(0, 0, 0, 0.2);
    color: black;
    /*border: 1px solid black;*/
}

    a.btn-dark-c:hover {
        color: black;
        background-color: transparent;
        -webkit-transition: all 0.3s ease-in-out 0s;
        transition: all 0.3s ease-in-out 0s;
    }

#eventBlog {
    background-color: #d1d1d1;
}

    #eventBlog h3,
    #events h4,
    #blogSlide h4 {
        color: white;
    }

    #eventBlog hr {
        border-color: #8c8c8c;
    }

#blogSlide a,
#blogSlide a:link {
    color: white;
}

.blogArrows {
    margin-top: 10px;
    text-align: right;
}

#terms {
    background-color: white;
}
/* End of link buttons */

@media (max-width: 993px) {
    .hidden-sm {
        display: none;
    }
}

.blog-social {
    margin-top: 25px;
    font-size: 35px;
}

    .blog-social a {
        padding: 15px;
        color: #337ab7;
    }
/* Front Home Page Items */
#vendRow {
    text-align: right;
    padding-top: 30px;
}

#vendors {
    margin-top: 0;
}

#vendWell {
    padding-left: 30px;
    padding-right: 45px;
}

#brandRow1, #brandRow2, #brandRow3, #brandRow4, #brandRow5, #brandRow6, #brandRow7 {
    padding-left: 40px;
    padding-right: 50px;
}

#topSpace {
    height: 98px;
}

.mfr-blank {
    height: 150px;
    width: 150px;
    margin: 0 auto;
}

/* End of Front Home Page */

.tiles {
        display              : grid;
        grid-gap             : 30px;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
/* Portrait and Landscape Tablet */
@media (min-width: 300px) and (max-width: 1000px) {
    #top {
        display: none;
    }

    .visible-xs {
        display: block !important;
    }

    .navbar-header {
        float: none;
    }

    .navbar-left, .navbar-right {
        float: none !important;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
        padding:5px 0 5px 0;
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-nav {
        float: none !important;
        /*margin-top: 7.5px;*/
    }

        .navbar-nav > li {
            float: none;
        }

            .navbar-nav > li > a {
                padding-top: 10px;
                padding-bottom: 10px;
            }

    .collapse.in {
        display: block !important;
    }

    #myCarousel {
        /*margin-top: 50px;*/
    }
/*
    .white-right {
        height: 16px;
        z-index: 25;
        background-color: white;
        left: auto;
        right: 0;
        position: absolute;
        bottom: 0;
        width: 50%;
        font-size: 20px;
        color: #ffffff;
        text-align: center;
    }

    .white-left {
        height: 16px;
        z-index: 25;
        background-color: white;
        left: 0;
        right: auto;
        position: absolute;
        bottom: 0;
        width: 50%;
        font-size: 20px;
        color: #ffffff;
        text-align: center;
    }
*/
    body > div.container-fluid.visible-xs > div,
    .navbar-header {
        width: 100% !important;
    }

    html {
        overflow-x: hidden !important;
    }

    body > div.container-fluid.visible-xs > div,
    body > div.container-fluid.visible-xs > div > div > div.navbar-collapse.navbar-ex1-collapse.navbar-right.collapse.in {
        overflow-x: hidden !important;
    }

    .carousel {
        height: 70%;
        /* increases the carousel height so it looks good on phones */
    }

    .carousel-caption {
        position: absolute;
        width: 80%;
        left: 10%;
        right: 10%;
        bottom: 80px;
        z-index: 10;
        /*padding: 20px;*/
        /*padding-bottom: 20px;*/
        padding-top: 50px;
        color: #ffffff;
        text-align: left;
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
        background: rgba(0, 0, 0, 0.45);
    }

        .carousel-caption h1 {
            font-size: x-large;
        }

    .slide2 {
        background-image: url('/assets/Home/Premium3.jpg');
        min-height: 668px;
        position: relative;
        background-size: cover;
        min-width: 100%;
        /*top:-100px;*/
        background-position: center right;
    }

    .slide3 {
        background-image: url('/assets/Home/CE.jpg');
        min-height: 688px;
        position: relative;
        background-size: cover;
        background-position: top left;
        top: -100px;
    }

    .slide4 {
        background-image: url('/assets/Home/Pro_av.jpg');
        min-height: 668px;
        position: relative;
        background-size: cover;
        background-position: center right;
        top: unset;
    }

    .slide5 {
        background-image: url('/assets/Home/Outdoor_furniture2.jpg');
        position: relative;
        background-size: cover;
        background-position: top;
        top: -200px;
    }

    .mfr-img {
        height: 75px;
        width: 75px;
    }

    .front-img {
        height: 100px;
        width: 100px;
    }

    .front-green-img {
        height: 100px;
        width: 100px;
    }

    #vendRow, #resellRow, #topRow {
        text-align: center;
    }

    #vendors {
        margin-top: 50px;
    }

    #vendWell {
        padding-left: 35px !important;
        padding-right: 35px;
        /*margin-top: 500px;*/
    }

    #brandRow1, #brandRow2, #brandRow3, #brandRow4, #brandRow5, #brandRow6, #brandRow7 {
        padding-left: 5px !important;
        padding-right: 10px;
    }                

    #topSpace {
        height: 0;
        /*height: 56px;*/
    }

    .offset:before {
        display: block;
        content: " ";
        height: 60px; /* Give height of your fixed element */
        margin-top: -60px; /* Give negative margin of your fixed element */
        visibility: hidden;
    }

    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        position: relative;
        min-height: 1px;
        padding-left: 15px !important;
        padding-right: 15px;
    }

    .col-md-4 InTheNews {
        height: 475px;
        margin-bottom: 50px;
        position: relative;
        min-height: 1px;
        padding-left: 15px !important;
        padding-right: 15px;
    }

    @media(max-width: 660px){
        .InTheNews{
            /*margin-bottom: 100px;*/
        }
    }
    

    .btn {
        white-space: unset;
    }

    .no-left {
        padding-left: 0 !important;
    }

    #tbLogo {
        position: relative;
        margin-top: 0;
    }

/*    #dealerApp {
        margin-top: 10px;
    }*/
}

/* Responsive Styles */
@media (max-width: 660px) {
    #myCarousel {
        /*margin-top: 50px;*/
    }

    .white-right {
        height: 16px;
        z-index: 25;
        background-color: white;
        left: auto;
        right: 0;
        position: absolute;
        bottom: 0;
        width: 50%;
        font-size: 20px;
        color: #ffffff;
        text-align: center;
    }

    .white-left {
        height: 16px;
        z-index: 25;
        background-color: white;
        left: 0;
        right: auto;
        position: absolute;
        bottom: 0;
        width: 50%;
        font-size: 20px;
        color: #ffffff;
        text-align: center;
    }
/*
    body > div.container-fluid.visible-xs > div,
    .navbar-header {
        max-width: 425px !important;
    }
*/
    html {
        overflow-x: hidden !important;
    }

    body > div.container-fluid.visible-xs > div,
    body > div.container-fluid.visible-xs > div > div > div.navbar-collapse.navbar-ex1-collapse.navbar-right.collapse.in {
        overflow-x: hidden !important;
    }

    .carousel {
        height: 70%;
        /* increases the carousel height so it looks good on phones */
    }

    .carousel-caption {
        position: absolute;
        width: 80%;
        left: 10%;
        right: 10%;
        bottom: 80px;
        z-index: 10;
        /*padding: 20px;*/
        /*padding-bottom: 20px;*/
        padding-top: 50px;
        color: #ffffff;
        text-align: left;
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
        background: rgba(0, 0, 0, 0.45);
    }

        .carousel-caption h1 {
            font-size: x-large;
        }

    .slide2 {
        background-image: url('/assets/Home/Premium3.jpg');
        min-height: 668px;
        position: relative;
        background-size: cover;
        min-width: 100%;
        /*top:-100px;*/
        background-position: center right;
    }

    .slide3 {
        background-image: url('/assets/Home/CE.jpg');
        min-height: 688px;
        position: relative;
        background-size: cover;
        background-position: top left;
        top: -100px;
    }

    .slide4 {
        background-image: url('/assets/Home/Pro_av.jpg');
        min-height: 668px;
        position: relative;
        background-size: cover;
        background-position: center right;
        top: unset;
    }

    .slide5 {
        background-image: url('/assets/Home/Outdoor_furniture2.jpg');
        position: relative;
        background-size: cover;
        background-position: top;
        top: -200px;
    }

    .mfr-img {
        height: 75px;
        width: 75px;
    }
    

    .front-img {
        height: 100px;
        width: 100px;
    }

    .front-green-img {
        height: 100px;
        width: 100px;
    }

    #vendRow, #resellRow, #topRow {
        text-align: center;
    }

    #vendors {
        margin-top: 50px;
    }

    #vendWell {
        padding-left: 35px !important;
        padding-right: 35px;
    }

    #mfrRow1, #mfrRow2, #mfrRow3, #mfrRow4, #mfrRow5, #mfrRow6, #mfrRow7 {
        padding-left: 0 !important;
    }

    #brandRow1, #brandRow2, #brandRow3, #brandRow4, #brandRow5, #brandRow6, #brandRow7 {
        padding-left: 5px !important;
        padding-right: 10px;
    }

    #topSpace {
        height: 0;
        /*height: 56px;*/
    }

    .offset:before {
        display: block;
        content: " ";
        height: 60px; /* Give height of your fixed element */
        margin-top: -60px; /* Give negative margin of your fixed element */
        visibility: hidden;
    }

    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        position: relative;
        min-height: 1px;
        padding-left: 15px !important;
        padding-right: 15px;
    }

    .btn {
        white-space: unset;
    }

/*    #dealerApp {
        margin-top: 10px;
    }*/

    .no-left {
        padding-left: 0 !important;
    }
}

@media (min-width: 769px) and (max-width: 1023px) {
    #topSpace{
        height: 200px;
    }
}

/*
    Global Alert max/min width formatting
    Commented out 4/5/22 as we're removing the COVID-19 message.
    Uncomment if we need to bring it back up.
*/

/*
@media (max-width: 768px) {
    .globalAlert{
        top: 0;
    }
    .carousel{
        top:0;
        height: 50%;
    }
    .section-white {
        padding-top: 50px;
    }
}

@media (max-width: 736px) {
    .globalAlert {
        top: 0;
    }

    .carousel {
        top: 0px;
        height: 70%;            // Comment height: 70% if this section is uncommented
        height: 60%;
    }

    .section-white {
        padding-top: 50px;
    }
}

@media (max-width: 568px){
    .globalAlertFont {
        padding-left: 5px;
        padding-right: 5px;
        font-size: 14px;        // Comment font-size: 14px if this section is uncommented
    }
}


@media (max-width: 414px) {
    .globalAlertFont {
        font-size: 12px;
    }
    .warning-logo {
        height: 16px;
        width: 16px;
    }
}

@media (max-width: 320px) {
    .globalAlertFont {
        font-size: 10px;
    }

    .warning-logo {
        height: 14px;
        width: 14px;
    }
}

*/


/*Font formatting*/

.BlueHeader{
    font-weight: bold;
    padding-bottom: 10px;
    padding-top:20px;
}

.GreenSubHeader{
    font-size: 24px;
    font-weight: bold;
    color: #80c64b;
    padding-top:20px;
}

.BodyText{
    font-size: 20px;
    /*font-family: 'Lato' sans-serif;*/
}

.startOfText {
    padding-top: 10px;
}

.fitContainer, .topWorkContainer {
    display: flex;
    padding: 0 20% 0 20%;
    justify-content: center;
    flex-flow: row;
    align-items: center;
}
.topWorkContainer
{
    padding: 25px 11% 0 11%;
}
@media(max-width: 1200px)
{
    .fitContainer, .topWorkContainer {
        padding: 0 5% 0 5%;
    }

    .philanQuote {
        padding: 10px 5% 10px 5%;
    }
}
.fitLogo {
    object-fit: contain;
    align-self: flex-start;
    margin: 20px 30px 0 0;
}

.topWorkLogo {
    object-fit: contain;
    /*align-self: flex-start;*/
    margin-right:35px;
}

.fitQuote, .topWorkQuote {
    flex: 1 1 auto;
}

.quoteText {
    font-style: italic;
    font-weight: bold;
}

.philanGall {
    display: flex;
    flex-wrap: wrap;
    margin-bottom:25px;
}
.philanCol {
    flex: 50%;
    max-width: 50%;
    /*padding: 0 4px;*/
}
.philanCol img {
    padding:10px;
    max-width:100%;
}
.philanList
{
    padding-top:15px;
    padding-bottom:15px;
}
.philanQuote{
    display:flex;
    padding: 10px 10% 5px 10%;
}
.internShips {
    display: flex;
    align-items: center;
    flex-direction:row;
}
.resposibility, .policy {
    width: 100%;
    height: auto;
    object-fit: cover;
}

#respHeader, #policyHeader {
    padding-top:100px;
}
@media(max-width: 1000px) {
    .internShips {
        flex-direction: column;
    }

}
@media(max-width: 1200px){
    #respHeader, #policyHeader {
        padding-top: 0px;
        margin-top: -50px;
    }

}

#navHidden { display: none; }
/* collapse the menu system - override the bootstrap default, needed due to the width of the menu and overlapping */
@media (max-width: 1000px) {
    .topMenuRow 
    {
        display:none;
    }
    #navHidden { display: block; }
    .navbar-header {
        float: none;
    }
}

.almoBlue, .almoBlue:hover a {
    color: #143a7e !important
}

.fpTextLink, .fpTextLink:hover a {
    color: #444444 !important
}

.newsHeading, .footerHeading {
    margin-top: 10px;
    margin-bottom: 10px;
    font-family: 'Raleway',sans-serif;
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.1;
}
h3.contactHdr{font-size:18px}
.icon-bar {
    background-color:#888;
}

.CharityCarouselImage{
    width: 100%;
    height: auto;
}

/*
    Image Lightbox
*/

#gallery {
  padding-top: 40px;
}

@media screen and (min-width: 991px){
    #gallery{
        padding: 60px 30px 0 30px;
    }
}

.img-wrapper {
  position: relative;
  margin-top: 15px;
}

.img-wrapper img{
    width: 100%;
}

.img-overlay {
  background: rgba(0,0,0,0.7);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
}

.img-overlay img{
    color: #fff;
    font-size: 3em;
}

#overlay {
  background: rgba(0,0,0,0.7);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
  // Removes blue highlight
  -webkit-user-select: none;
  -moz-user-select: none;    
  -ms-user-select: none; 
  user-select: none; 
}

#overlay img{
    margin: 0;
    width: 80%;
    height: auto;
    object-fit: contain;
    padding: 5%;
}

@media screen and (min-width:768px) {
    #overlay img{
        width: 60%;
    }
    #nextButton{
        font-size: 3em;
    }
    #prevButton {
        font-size: 3em;
    }
    #exitButton {
        font-size: 3em;
    }
}
@media screen and (min-width:1200px) {
    #overlay img{
        width: 50%;
    }
}

#nextButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
}

#nextButton :hover{
    opacity: 0.7;
}


#prevButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
}

#prevButton :hover{
    opacity: 0.7;
}

#exitButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
  position: absolute;
  top: 15px;
  right: 15px;
}
#exitButton :hover{
    opacity: 0.7;
}
/*
    End Image Lightbox
*/
@media (min-width: 1001px) and (max-width: 1150px) {
    .navbar-right {
        margin-top: 20px;
    }
    .nav > li > a {
        padding: 10px 14px;
    }
}