html { margin:0;font-size: 18px;}

/*
:root{
  --primary-color: #0060a5;
  --secondary-color: #659dbf;
  --tertiary-color: #a7c6d9;
  --quarternary-color: #c4f2ee;
  --quinary-color: #38373d;
}
*/
:root{
  --primary-color: #0060a5;
  --secondary-color: #41B6E6;
  --tertiary-color: #a7c6d9;
  --quarternary-color: #c4f2ee;
  --quinary-color: #002855;
}

html,body,p{color: var(--quinary-color);}

/* Float Definitions */
.flt-rt{float: right;}
.flt-lft{float: left;}

/* Top Bar Styles */
.top-bar{
  background-color: var(--quinary-color);
  color: #fff;
  margin-top: 0;
}
.top-bar .location{
  float: left;
}
.top-bar p{
  margin: 10px 15px;
  font-size: 1rem;
  line-height: 1.5rem;
}
.top-bar .socials{
  float: right;
}
.top-bar .socials i{
  float: right;
  margin: 0px 15px;
  font-size: 1rem;
  line-height: 1.5rem;
  color: #fff;
}
.top-bar a,
.top-bar p,
.top-bar span{ color: #fff;}

.logo-bar{margin-top: 0;}
.logo-bar-info{display: flex;min-height: 65px;}
.logo-bar-info .info{margin: auto;}
.logo-bar-info i {float: left; margin-right: 10px;color: var(--primary-color);font-size: 2rem;margin-top: 8px;}
.logo-bar-info div {float: left;}
.logo {
  height: 80px;
  margin: 10px 0;
}
.logo img{
  width: 100%;
  height: 100%;
  max-width: 268px;
}

.nav-bar{margin-top: 0;}

/* Style the navbar */
#navigation {
    background-color: transparent;
}
#navigation.sticky, #navigation.open {
    background-color: transparent;
    z-index: 900;
}
#navigation.sticky .logo-img-webp{
    margin: 0;
}

.dropdown .sub-menu {
  display: none;
  background-color: var(--quinary-color);
  width: 300px;
  padding-inline-start: unset;
}
.dropdown:hover .sub-menu {
  display: block;
  position: absolute;
  top: 70px;
  left: 30px;
}
.dropdown .sub-menu li {
  list-style: none;
}
.dropdown .sub-menu .dropdown .sub-menu {
  display: none;
  top: 32px;
  background-color: var(--primary-color);
}
.dropdown .sub-menu .dropdown:hover .sub-menu {
  display: block;
}

.bg-blue{
  background-color: #0975c2;
}









.dropdown-menu,.dropdown-submenu{background: transparent;}
/* Page content */
.content {
padding: 16px;
}
.dropdown-item:focus, .dropdown-item:hover {
    text-decoration: none;
    background-color: transparent;
}
/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky, .open {
position: fixed;
top: 0;
width: 100%;
}

#error-msg, #thanks{margin-top:20px;display: none;}
.error{border: 2px solid red;}

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
padding-top: 60px;
}

.d-sm-md-only{ display: block;}
.d-lg-only{ display: none;}
.hidden{display: none;}




.signature{font-family: 'Brush Script MT', cursive;font-size: 2rem;}

/* Sidebar Styles */

#sidebar {
  z-index: 1000;
  height: 100%;
  overflow-y: auto;
  background: #115b98;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#sidebar .sidebar-header {
  background-color:  #0975c2;
  font-size: 20px;
  line-height: 52px;
  text-align: center;
  border-bottom: 1px solid #0975c2;
}

#sidebar .sidebar-header a {
  color: #fff;
  display: block;
  text-decoration: none;
}

#sidebar .sidebar-header a:hover {
  color: #fff;
}

#sidebar .nav{
  
}

#sidebar .nav li {
  position: relative;
  background: none;
  width: 100%;
  padding: 16px 24px;
  border-bottom: 1px solid #0975c2;
}
#sidebar .nav li.active,
#sidebar .nav li:hover {
  position: relative;
  background: #fff;
  width: 100%;
  padding: 16px 24px;
  border-top: 0px;
  border-right: 1px solid #0975c2;
  border-left: 1px solid #0975c2;
  border-bottom: 1px solid #0975c2;
}
#sidebar .nav li.active a,
#sidebar .nav li:hover a {
  color: #0975c2;
  text-decoration: none;
}
#sidebar .nav a {
  background: none;
  color: #CFD8DC;
  font-size: 14px;
}
#sidebar .nav a:hover {
  text-decoration: none;
}


#sidebar .nav a i{
  margin-right: 16px;
}







#sidebar-services {
  z-index: 1000;
  height: 100%;
  overflow-y: auto;
  background: transparent;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#sidebar-services h2 {
  color: #fff;
  background-color: var(--quinary-color);
  font-size: 20px;
  line-height: 52px;
  text-align: center;
  border-bottom: 3px solid var(--quinary-color);
}

#sidebar-services a {
  color: var(--quinary-color);
  font: 600 16px/25px Montserrat,sans-serif;
  display: block;
  background: #f1f1f1;
  border-left: 4px solid #d2d2d2;
  padding: 15px 25px;
  -webkit-transition: all .3s linear;
  -o-transition: all .3s linear;
  transition: all .3s linear;
}

#sidebar-services ul{list-style: none;padding-inline-start: 0;}

#sidebar-services li+li{margin-top: 3px;}

#sidebar-services a:hover,
#sidebar-services a:focus,
#sidebar-services a:active,
#sidebar-services .current_page_item a {
  color: #fff;
  background-color: var(--primary-color);
  text-decoration: none;
  margin-left: -4px;
}

#sidebar-services .nav{
  
}

#sidebar-services .nav li {
  position: relative;
  background: none;
  width: 100%;
  padding: 16px 24px;
  border-bottom: 1px solid #0975c2;
}
#sidebar-services .nav li.active,
#sidebar-services .nav li:hover {
  position: relative;
  background: #fff;
  width: 100%;
  padding: 16px 24px;
  border-top: 0px;
  border-right: 1px solid #0975c2;
  border-left: 1px solid #0975c2;
  border-bottom: 1px solid #0975c2;
}
#sidebar-services .nav li.active a,
#sidebar-services .nav li:hover a {
  color: #0975c2;
  text-decoration: none;
}
#sidebar-services .nav a {
  background: none;
  color: #CFD8DC;
  font-size: 14px;
}
#sidebar-services .nav a:hover {
  text-decoration: none;
}


#sidebar .nav a i{
  margin-right: 16px;
}
.service-text h2{font-size: 2rem;}
.service-text h3{font-size: 1.5rem;}
.service-text h4{font-size: 1.25rem;}
.service-text h5{font-size: 1rem;}
.service-text ul{list-style: none;margin: 20px auto 30px;}
.service-text ul li{line-height: 40px;}
.service-text ul li:before {    
  font-family: 'FontAwesome';
  content: '\f043';
  margin:0 15px 0 -15px;
  color: var(--primary-color);
}

#service-accordion .sow-accordion-panel .sow-accordion-panel-header{background-color: var(--quinary-color);}

#service-form form{background-color: var(--quarternary-color);border-color: var(--quinary-color);padding: 20px;}

#service-form form input[type="text"],
#service-form form input[type="email"],
#service-form form select {color: var(--quinary-color);padding-left: 10px;height: 31px; width: 100%;}
#service-form form textarea{color: var(--quinary-color);padding-left: 10px;height: 185px; width: 100%;}ng: 20px;}

#service-form form input[type="text"]::placeholder,
#service-form form input[type="email"]::placeholder,
#service-form form select::placeholder,
#service-form form textarea::placeholder {color: var(--quinary-color); opacity: 75%;}




.firepit-sun-blue{
  /*   rgba sets the dark overlay    */
  background: linear-gradient(0deg,
  rgba(9,117,194,0.9),
  rgba(9,117,194,0.9)),
  url("/assets/images/firepit-sun.jpg");
  background-repeat: no-repeat;
  background-attachment: scroll;
  /*   these set the focus point on the background image    */
  background-position-x: 70%;
  background-position-y: 40%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.firepit-sun-blue h2, .firepit-sun-blue h3,
 .firepit-sun-blue p, .firepit-sun-blue a, 
 .firepit-sun-blue h4{
  color: #fff;
}

.firepit-sun-blue-webp{
  /*   rgba sets the dark overlay    */
  background: linear-gradient(0deg,
  rgba(9,117,194,0.9),
  rgba(9,117,194,0.9)),
  url("/assets/images/firepit-sun.webp");
  background-repeat: no-repeat;
  background-attachment: scroll;
  /*   these set the focus point on the background image    */
  background-position-x: 70%;
  background-position-y: 40%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.firepit-sun-blue-webp h2, .firepit-sun-blue-webp h3,
 .firepit-sun-blue-webp p, .firepit-sun-blue-webp a, 
 .firepit-sun-blue-webp h4{
  color: #fff;
}


.firepit-sun-blue-webp .container,
.firepit-sun-blue .container{
  margin-top: 20px;
  margin-bottom: -10px;
}

.cta-full{padding-top: 50px;padding-bottom: 50px;}
.cta-btns { display: inline-flex; width: 100%;}
.cta-btn { margin-right: auto; margin-left: auto; margin-top: 20px; margin-bottom: 30px;}


/************************************************************************/
/***                           Image Styles                           ***/
/************************************************************************/
.img-rt{display:flex;padding-bottom: 30px;margin-left: auto;margin-right: auto;}
.img-lt{display:flex;padding-bottom: 30px;margin-left: auto;margin-right: auto;}
.round{border-radius: 50%;}
.img-row-325{height: 100%;max-height: 325px;overflow: hidden;}
.img-row-325 .sow-image-container{
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden
}
.img-row-325 img{
  width: 100%; 
  min-height: 325px; 
  max-height: 325px;
  object-fit: cover;
}
.img-row-350{height: 100%;max-height: 350px;overflow: hidden;}
.img-row-350 .sow-image-container{
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden
}
.img-row-350 img{
  width: 100%; 
  min-height: 350px; 
  max-height: 350px;
  object-fit: cover;
}
.img-row-400{height: 100%;max-height: 400px;overflow: hidden;}
.img-row-400 .sow-image-container{
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden
}
.img-row-400 img{
  width: 100%; 
  min-height: 400px; 
  max-height: 400px;
  object-fit: cover;
}



/************************************************************************/
/***                           Footer Styles                          ***/
/************************************************************************/
#footer{margin-top: -50px;}
#footer .container{max-width: 100%;}
#footer.text-white a{
    color: #fff;
}
#footer-bottom .social, #footer-bottom .copyright{
    float: none;
    text-align: center;
}
#footer .head1 {
  text-align: center;
  font-size: 1.5rem;
  color: var(--secondary-color);
}
#footer ul {
  list-style-type: none;
  margin-bottom: 0;
  padding-left: 0;
}
#footer ul li {
  margin-bottom: 15px;
}
#footer .bg-quinary p,
#footer .bg-quinary a,
#footer .bg-quinary h2,
#footer .bg-quinary h3,
#footer .bg-quinary h4{color:#fff;}
#footer .info-container{display: flex;margin: 20px 0;}
#footer .info{display: flex; margin: auto; color: #fff;}
#footer .info i {
  margin-right: 10px;
  color: var(--secondary-color);
  font-size: 2rem;
  margin-top: 8px;
}
.footer-nav a{color: #fff;text-decoration: none;}
.footer-nav a:hover{color: var(--quarternary-color);}

/************************************************************************/
/***                          Gallery Styles                          ***/
/************************************************************************/
.gallery-title{
    font-size: 36px;
    color: #42B32F;
    text-align: center;
    font-weight: 500;
    margin-bottom: 70px;
}
.gallery-title:after {
    content: "";
    position: absolute;
    width: 7.5%;
    left: 46.5%;
    height: 45px;
    border-bottom: 1px solid #5e5e5e;
}

.port-image{
    width: 100%;
}

.gallery_product{
    margin-bottom: 30px;
}
.gallery-title{
    font-size: 36px;
    text-align: center;
    font-weight: 500;
    margin-bottom: 70px;
}
.gallery-title:after {
    content: "";
    position: absolute;
    width: 7.5%;
    left: 46.5%;
    height: 45px;
    border-bottom: 1px solid #5e5e5e;
}

.port-image{
    width: 100%;
}

.gallery_product{
    position: relative;
    margin-bottom: 30px;
    height: 200px;
    vertical-align: middle;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
}

.gallery_product img{
  position: absolute;
  top:-100%; left:0; right: 0; bottom:-100%;
  min-height: 200px;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: 20px;
  margin-right: 20px;
}




/************************************************************************/
/***                           Modal Styles                           ***/
/************************************************************************/
#modal-quote .modal-content {
  padding: 50px 15px;
  border: 2px solid #2a3a4a;
  border-radius: 5px;
  background-color: rgba(17,91,152, 0.8);
}
.modal-colors .modal-content {
  padding: 50px 15px;
  border: 2px solid #2a3a4a;
  border-radius: 5px;
  background-color: rgba(256,256,256, 0.8);
}
.modal-title{margin-top: 50px;}
.modal-message{margin-bottom: 50px;}
.modal-title h3 {
  font-size: 35px;
  line-height: 50px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 47px;
}
.modal-message p, #contact-main label {
  font-size: 1rem;
  line-height: 34px;
  font-weight: 500;
  letter-spacing: .1rem;
  color: #ffffff;
  margin-top: 10px;
}
#thanks, #error-msg,
#thanks1, #error-msg1 {
  font-size: 1rem;
  line-height: 34px;
  font-weight: 500;
  letter-spacing: .1rem;
  color: #ffffff;
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
  margin: 20px 0;
  display: none;
}
#modal-close{color: #fff;}
input.error,
input.form-control.error,
textarea.form-control.error { border: #ff0000 solid 3px; }

#contact-modal label {
  margin-top: 20px;
  color: #fff;
  font-weight: 400;
}

.quote-qs{display: none;}

ul#paverstyles, ul#copingstyles { margin-top: 50px;}
ul#paverstyles a, ul#copingstyles a { color: #0975c2; font-size: .85rem; font-weight: 500; padding-left: .6rem; padding-right: .6rem;}
ul#paverstyles a:hover, ul#paverstyles a.active, ul#copingstyles a:hover, ul#copingstyles a.active { color: #fff; background-color: #0975c2;}
.paver-style h3, .paver-style h5 {
  margin: 30px 0px 30px;
}
.paver-style .main-img {
  width: 100%;
  margin-bottom: 30px;
}
.paver-style .block-img {
  display: block;
  width: 90%;
  margin: 0 auto 25px;
}
.paver-style .sizes{
  display: flex;
  flex-direction: column;
  margin: auto;
}
.paver-colors div { margin: auto;}
.paver-colors img { margin: 0 auto 30px !important;}

@media only screen and (min-width: 768px){
  ul#paverstyles, ul#copingstyles { margin-top: 50px;}
  ul#paverstyles a, ul#copingstyles a { color: #0975c2; font-size: 1rem; font-weight: 500; padding-left: 1rem; padding-right: 1rem;}
  ul#paverstyles a:hover, ul#paverstyles a.active, ul#copingstyles a:hover, ul#copingstyles a.active { color: #fff; background-color: #0975c2;}
  .paver-style h3, .paver-style h5 {
    margin: 30px 0px 30px;
  }
  .paver-style .main-img {
    width: 100%;
    margin-bottom: 30px;
  }
  .paver-style .block-img {
    display: block;
    width: 90%;
    margin: 0 auto 25px;
  }
  .paver-style .sizes{
    display: flex;
    flex-direction: column;
    margin: auto;
  }
  .paver-colors div { margin: auto;}
  .paver-colors img { margin: 0 auto 30px !important;}
}

html,body{overflow-x: hidden;}
section{margin-top: 50px;}

h2, h3, h4, h5{ color:  #115b98; }

#header{margin-top: -120px;z-index: 1;position: relative;}
#header .so-widget-sow-hero::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.35;
    background-color: var(--quinary-color);
    z-index: 2;
    cursor: pointer;
}
.header-blocks{margin-top: -30px;}
.header-blocks h2,
.header-blocks h3,
.header-blocks h4,
.header-blocks h5,
.header-blocks p{color: #fff;}
.header-blocks .header-block{position: relative;}
.header-blocks .header-block .residential,
.header-blocks .header-block .municipal{padding: 30px 15px; min-height: 300px;position: relative;}
.header-blocks .header-block .commercial{padding: 30px 15px; min-height: 318px;position: relative;margin-top: -18px;z-index: 99;}
.header-blocks .header-block .residential:after,
.header-blocks .header-block .commercial:after,
.header-blocks .header-block .municipal:after{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0.85;
  z-index: 2;
  cursor: pointer;
}
.header-blocks .header-block .residential:after{background-color: var(--primary-color);}
.header-blocks .header-block .commercial:after{background-color: var(--quinary-color);}
.header-blocks .header-block .municipal:after{background-color: var(--secondary-color);}
.header-blocks .header-block .sow-features-list .sow-features-feature{position: absolute;z-index: 5;width: 91% !important;}
.header-blocks .header-block .sow-features-list .sow-features-feature .textwidget{margin-left: 65px;}
img{max-width: 100%;}
.so-widget-sow-hero-default-d213ff767ea3-195 .sow-slider-base ul.sow-slider-images .sow-slider-image-wrapper p {
    margin: 0 0 1em !important;
}
html, body {
  font-family:sans-serif, luminari;
}
h1{font-size: 3rem; font-weight: 700;}
h2{font-size: 2.5rem; font-weight: 700;}
h3{font-size: 2.25rem; font-weight: 700;}
h4{font-size: 1.75rem; font-weight: 700;}
h5{font-size: 1.5rem; font-weight: 700;}
h6{font-size: 1.25rem; font-weight: 700;}
h1, h2, h3, h4, h5, h6{color: var(--quinary-color);}

/************************************************************************
***                           Navbar Styles                           ***
************************************************************************/
.navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link a, .dropdown-item, .dropdown-item a, .navbar-nav .nav-item a {
  display: block;
  color: rgba(255,255,255,1);
  padding: .5rem 1rem;
  text-decoration: none;
  margin: auto;
  font-weight: 600;
}
.nav-item{display: flex;}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link a:hover, .dropdown-item:hover, .dropdown-item a:hover, .navbar-nav .nav-item a:hover {
  color: rgba(255,255,255,.8);
}
.navbar{
  z-index: 1000; 
  height: 70px;
  margin-left: auto;
  background-color: var(--quinary-color);
  padding: 0;
}
.navbar-collapse{ height: 100%;}

.navbar-rt a{margin: auto;}
a.tel{color:var(--tertiary-color);text-decoration: none;font-size: 1.5rem;}
@media only screen and (min-width: 1200px){
  .navbar{width: calc(50% + 556px);}
  .navbar-nav{padding: 0 35px 0 60px;min-width: 675px;width:70%;height: 100%;background-color: var(--primary-color);}
  .navbar-rt{display: flex;width: 30%;}
}
@media only screen and (max-width: 1199px){
  .navbar{width: calc(50% + 465px);}
  .navbar-nav{padding: 0 35px 0 60px;min-width: 675px;width:75%;height: 100%;background-color: var(--primary-color);}
  .navbar-rt{display: flex;width: 25%;}
}
@media only screen and (max-width: 991px){
  .navbar{width: 100%;}
}



.logo-img-webp{
  position: relative;
  height: 60px;
  width: 60px;
  float: left;
  margin: 10px 0;
}
#logo-img {
  content: '';
  background-image: url(/assets/images/flo-logo-mobile.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 60px;
  padding-left: 60px;
}
.dropdown-submenu {
  position: relative;
}
.dropdown-submenu a::after {
  transform: rotate(-90deg);
  right: 6px;
  top: .8em;
}
.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-left: .1rem;
  margin-right: .1rem;
}
.dropdown-submenu .dropdown-menu a {
  padding: .25rem 2.5rem;
}
.dropdown-submenu .dropdown-menu .dropdown-submenu .dropdown-menu a {
  padding: .25rem 3.5rem;
}


/************************************************************************
***                           Feature Styles                          ***
************************************************************************/
#service-features{display: block;border: 1px solid var(--primary-color);}
#service-features .sow-icon-container{margin-top: 15px;}
#service-features .sow-features-list{display: flex;flex-wrap: wrap;}
#service-features .sow-features-list .sow-features-feature{border: 1px solid var(--tertiary-color);margin-bottom: 0;padding: 0 20px 30px;}
#service-features .sow-features-list .sow-features-feature {background-color: #fff;}
#service-features .sow-features-list .sow-features-feature:hover h5{color: var(--primary-color);}

@media only screen and (max-width: 991px){
  #service-features .sow-features-list .sow-features-feature:nth-child(odd) {background-color: var(--quarternary-color);}
  #service-features .sow-features-list .sow-features-feature:nth-child(even) {background-color: #fff;}
}

@media only screen and (min-width: 992px){
  #service-features .sow-features-list .sow-features-feature:nth-child(1),
  #service-features .sow-features-list .sow-features-feature:nth-child(4) {background-color: var(--quarternary-color);}
  #service-features .sow-features-list .sow-features-feature:nth-child(3) .sow-icon-container {color: #fff !important;}
  #service-features .sow-features-list .sow-features-feature:nth-child(4) .sow-icon-container {color: var(--quarternary-color) !important;}
}


/************************************************************************
***                           Cards Styles                            ***
************************************************************************/
.cards a{text-decoration: none;}
.cards .sow-features-list{margin: 0 -15px;}
.cards .sow-features-list .sow-features-feature {
  padding: 0 15px !important;
}
.cards .textwidget .img-overlay{
  position: relative;
}
.cards .textwidget .img-overlay .primary-50 .info-txt{
  display: none;
  color: #fff;
  position: absolute;
  bottom: 40px;
  border-bottom: 3px solid #fff;
  left: 39px;
  width: 75%;
  text-align: left;
  z-index: 99;
}
.cards .textwidget .img-overlay .primary-50:after{
  display: none;
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--primary-color);
  opacity: 50%;
}
.cards .textwidget:hover .img-overlay .primary-50 .info-txt,
.cards .textwidget:hover .img-overlay .primary-50:after{
  display: block;
}

.cards .textwidget img{
  width: 100%;
  height: auto;
  position: relative;
}
.cards .textwidget h2{
  font-size: 22px;
  text-align: left;
  margin: 15px 0 50px;
}
.cards .textwidget:hover h2{color: var(--primary-color);}

@media only screen and (min-width: 768px){
  .cards .textwidget h2{
    font-size: 32px;
  }
}

.team-cards .card-img-cont{position: relative;}
.team-cards .card:after{
  display: none;
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--primary-color);
  opacity: 85%;
}
.team-cards .card-text{
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  padding: 30px 20px;
  z-index: 99;
}
.team-cards .card-text p{color: #fff;}
.team-cards .card-body h5{font-size: 1.15rem;}
.team-cards .card-body h6{font-size: 1rem;font-style: italic;}
.team-cards .card:hover:after,
.team-cards .card:hover .card-text{ display: block;}
.testimonials .sow-testimonial-text {background-color: transparent !important;}
.testimonials .sow-testimonial-user{display: flex;}
.testimonials .sow-testimonial-user .sow-image-wrapper{margin-right: 20px;}
.testimonials .sow-testimonial-user .sow-text{display: flex;flex-direction: column; margin-top: auto; margin-bottom: auto;}
/************************************************************************
***                          Carousel Styles                          ***
************************************************************************/
.carousel-item {
  height: 350px;
  width: 100%;
  min-height: 350px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.carousel-caption.position1{
  right: 15%;
  top: 20%;
  left: 15%;
}



/************************************************************************
***                         Jumbotron Styles                          ***
************************************************************************/
.jumbotron {
  position: relative;
  overflow: hidden;
  background-color:black;
  padding: 0;
}
.jumbotron video {
  position: absolute;
  z-index: 1;
  top: -55px;
  width:100%;
  height:100%;
  /*  object-fit is not supported on IE  */
  object-fit: cover;
  opacity:0.65;
  height: 450px;
}
.jumbotron .container {
  z-index: 2;
  position: relative;
}



/************************************************************************
***                         Page Header Styles                        ***
************************************************************************/
.banner-top{margin-top: 100px;}
.about{
  /*   rgba sets the dark overlay    */
  background: linear-gradient(0deg,
  rgba(0,0,0,0.5),
  rgba(0,0,0,0.5)),
  url("/assets/images/about.jpg");
  background-repeat: no-repeat;
  background-attachment: scroll;
  /*   these set the focus point on the background image    */
  background-position-x: 70%;
  background-position-y: 40%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.page-header{
  height: 350px;
  width: 100%;
  min-height: 350px;
  padding-top: 150px;
}
.page-header, 
.page-header h1, 
.page-header h2, 
.page-header h3, 
.page-header p, 
.page-header a{color: #fff;}
.page-header .breadcrumbs{margin-top: 4rem;}
.page-header-caption.position1{
  right: 15%;
  top: 20%;
  left: 15%;
}
.page-heading{position: relative;margin-top: 100px;}
.page-heading h3.widget-title:after{
  content: '';
  background-color: var(--primary-color);
  height: 3px;
  width: 50px;
  position: absolute;
  top: 40px;
  margin-left: 15px;
}

/************************************************************************
***                           Button Styles                           ***
************************************************************************/
.btn{padding: 10px 15px;font-weight: 600;font-size: 1.25rem;}
.btn-primary {
  color: #fff;
  background-color:var(--primary-color);
  border: 2px solid var(--primary-color);
}
.btn-primary:hover, .btn-primary:active  {
  color: var(--primary-color);
  background-color: transparent;
  border-color: var(--primary-color);
}
.btn-secondary {
  color: #fff;
  background-color:var(--secondary-color);
  border: 2px solid var(--secondary-color);
}
.btn-secondary:hover, .btn-secondary:active  {
  color: var(--secondary-color);
  background-color: transparent;
  border-color: var(--secondary-color);
}
.btn-quinary,
.btn-quinary-white {
  color: #fff;
  background-color:var(--quinary-color);
  border: 2px solid var(--quinary-color);
}
.btn-quinary:hover, .btn-quinary:active  {
  color: var(--quinary-color);
  background-color: transparent;
  border-color: var(--quinary-color);
}
.btn-quinary-white:hover, .btn-quinary-white:active  {
  color: var(--quinary-color);
  background-color: #fff;
  border-color: var(--quinary-color);
}
.btn-white{
  color: #115b98;
  background-color: #fff;
  border: 2px solid #fff;
}
.btn-white:hover{
  color: #fff;
  background-color: transparent;
  border: 2px solid #fff;
}
.side-menu-button,
.filter-button{
    font-size: 15px;
    border: 1px solid #115b98;
    border-radius: 5px;
    text-align: center;
    color: #115b98;
    margin-bottom: 30px;

}
.side-menu-button.active,
.filter-button:hover{
    font-size: 18px;
    border: 1px solid #0975c2;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #115b98;

}
.btn-default:active .filter-button:active{
    background-color: #115b98;
    color: white;
}


/************************************************************************
***                           Spacing Styles                           ***
************************************************************************/
.mb-20{margin-bottom: 20px;}
.mb-30{margin-bottom: 30px;}
.mb-50{margin-bottom: 50px;}
.mb-75{margin-bottom: 75px;}
.mb-100{margin-bottom: 100px;}
.mt-20{margin-top: 20px;}
.mt-30{margin-top: 30px;}
.mt-50{margin-top: 50px;}
.mt-75{margin-top: 75px;}
.mt-100{margin-top: 100px;}


.w-150{width:100%;max-width:150px;}
.w-200{width:100%;max-width:200px;}
.w-300{width:100%;max-width:300px;}
.w-400{width:100%;max-width:400px;}



.my-3{border-top: 1px solid rgba(0,0,0,.0);}
.d-flex{display: flex;flex-wrap: wrap;}
.d-flex .panel-grid-cell{margin: auto;}
.d-flex-md-lg-only { display: block;}

.card{ height: 100%; padding-bottom: 0px;}

.card a { 
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.projects .nav-justified .nav-item {
  -ms-flex-preferred-size: 0;
  flex-basis: auto;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  text-align: center;
  width: 50%;
}





@media only screen and (min-width: 600px){
    header{margin-top: -70px;z-index: 1;}
    .carousel-item {
        height: 600px;
    }
    .logo-img-webp{
        height: 80px;
        width: 268px;
    }
    #logo-img {
      background-image: url(/assets/images/flo-logo.webp);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      padding-top: 80px;
      padding-left: 268px;
    }
    #navigation.sticky .logo-img-webp{
      height: 60px;
      width: 201px;
    }
    #navigation.sticky #logo-img {
      background-image: url(/assets/images/flo-logo-sticky.webp);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      padding-top: 60px;
      padding-left: 201px;
    }
    .jumbotron {
      height: 400px;
    }
    .jumbotron video {
      height: 550px;
    }
    .banner-top{margin-top: 150px;}
    div.modal-dialog { max-width: 900px; }
    .d-flex-md-lg-only { display: flex;}
  }
  
  @media only screen and (min-width: 768px){
    .img-rt{
        display:flex;
        padding-bottom: 30px;
        margin-left: 30px;
        margin-right: 0;
        float: right;
    }
    .img-lt{
        display:flex;
        padding-bottom: 30px;
        margin-left: 0;
        margin-right: 30px;
        float: left;
    } 
    .projects .nav-justified .nav-item {
      flex-basis: 0;
    }
  }

/************************************************************************/
/***                         Mega-Menu Styles                         ***/
/************************************************************************/
@media screen and (max-width: 991px){
  .nav-item{display: block;}
  .dropdown:hover .sub-menu {
    display: block;
    position: relative;
    top: 0px;
    left: 30px;
  }
  .navbar-collapse{ 
    height: 100vh; 
    background-color: #000;
    position: absolute;
    left: -20%;
    right: 0;
    top: 120px;
    width: calc(100vw + 20%);
    padding: 30px 20%;
    overflow-y: scroll;
  }

  .navbar-collapse.show{display: block;}
  .has-mega-menu{
      position:relative;
  }
  .navbar-nav{
    height: 100vh;
    overflow-y: scroll;}
  .navbar-nav .nav-item a {margin-left: 0;}
  li.has-mega-menu .sub-menu {
      display: none;
      width: 100%;
      position: relative;
      top: 0px; /*insert the needed value*/
      z-index: 100;
      left:0px;
      right:0px;
      list-style: none;
      padding-inline-start: unset;
      background-color: #808080;
  }
  li.has-mega-menu:hover>.sub-menu{
  /*flexbox fallback for browsers that do not support CSS GRID lyout*/
      display: flex;
      flex-wrap: wrap; 
  }
  li.has-mega-menu>.sub-menu>li>.sub-menu {
      display: none;
      width: 100%;
      position: inherit;
      z-index: 100;
      padding-top: 5px;
      padding-left: 30px;
  }
  li.has-mega-menu:hover>.sub-menu>li>.sub-menu{
      display: block;
  }
  .navbar-expand-lg .logo {
    display: block;
    float: left;
    height: 60px;
    margin: 5px 20px;
  }
  .navbar-expand-lg .navbar-toggler {
    float: right;
    margin-right: 20px;
  }
  .d-none-sm-md-only{display: none;}
}
li.has-mega-menu>.sub-menu>li.mega-menu-column>a {
  margin-top: 0px;
  text-align: center;
}
.bg-primary{background-color: var(--primary-color);}
.bg-secondary{background-color: var(--secondary-color) !important;}
.bg-tertiary{background-color: var(--tertiary-color);}
.bg-quarternary{background-color: var(--quarternary-color);}
.bg-quinary{background-color: var(--quinary-color);}

.text-primary{color: var(--primary-color);}
.text-secondary{color: var(--secondary-color);}
.text-tertiary{color: var(--tertiary-color);}
.text-quarternary{color: var(--quarternary-color);}
.text-quinary{color: var(--quinary-color);}

@media screen and (min-width: 992px){
  .has-mega-menu{
    position:static;
  }
  li.has-mega-menu .sub-menu {
      display: none;
      width: 100%;
      position: fixed;
      top: 213px; 
      z-index: 100;
      left:0px;
      right:0px;
      list-style: none;
      padding-inline-start: unset;
      background-color: var(--quinary-color);
  }
  li.has-mega-menu .sub-menu .sub-menu {
    display: flex;
    flex-direction: column;
  }
  .sticky li.has-mega-menu .sub-menu {
      position: fixed;
      top: 70px; 
  }

  li.has-mega-menu .sub-menu a{
    font-size: 1.25rem;
    position: relative;
  }
  li.has-mega-menu .sub-menu a:after{
    content: "";
    background: var(--tertiary-color);
    position: absolute;
    bottom: -10px;
    left: 35%;
    height: 3px;
    width: 30%;
  }
  li.has-mega-menu .sub-menu .sub-menu a{
    display: block;
    color: rgba(255,255,255,1);
    padding: .5rem 1rem;
    text-decoration: none;
    margin: auto;
    font-weight: 600;
    font-size: 1rem;
  }
  li.has-mega-menu .sub-menu .sub-menu a:hover, 
  li.has-mega-menu .sub-menu .sub-menu a:active,
  li.has-mega-menu .sub-menu .sub-menu a:focus {color: rgba(255,255,255,0.8);}
  li.has-mega-menu .sub-menu .sub-menu a:after{
    display: none;
  }


  li.has-mega-menu:hover>.sub-menu{
  /*flexbox fallback for browsers that do not support CSS GRID lyout*/
      display: flex;
      flex-wrap: wrap; 
  }
  li.has-mega-menu>.sub-menu>li>.sub-menu {
      display: none;
      width: 100%;
      position: inherit;
      z-index: 100;
      padding-top: 20px;
      padding-left: 0px;
  }
  li.has-mega-menu:hover>.sub-menu>li>.sub-menu{
  /*flexbox fallback for browsers that do not support CSS GRID lyout*/
      display: flex;
      flex-wrap: wrap;  
  }
  .navbar-expand-lg .navbar-toggler {
    display: none;
  }
  .navbar-expand-lg .logo {
    display: none;
  }
  .d-none-sm-md-only{display: block;}
}
@media screen and (min-width: 600px){
  li.mega-menu-column {
      width: 100%;
      max-width: 100%;
      min-height: 1px;
      padding: 0px 25px;
  }
}
@media screen and (min-width: 992px){
  li.mega-menu-column {width: 33.3%; padding: 10px 25px;}
}
@media screen and (min-width: 1200px){
  li.mega-menu-column {}
}
.mega-menu-column img {
  display: block;
}



@media only screen and (min-width: 992px){
  .dropdown-item, .dropdown-item a {
      color: rgba(256,256,256,1);
    }
    .dropdown-item:hover, .dropdown-item:hover a, .dropdown-item a:hover {
      color: rgba(256,256,256,0.8);
    }
  .carousel-item {    
      height: 750px;
  } 
  .img-rt{
      display:flex;
      padding-bottom: 30px;
      margin-left: 30px;
      margin-right: 0;
      float: right;
  }
  .d-sm-md-only{ display: none;}
  .d-lg-only{ display: block;}
  .img-lt{
      display:flex;
      padding-bottom: 30px;
      margin-left: 0;
      margin-right: 30px;
      float: left;
  } 
  #footer .copyright{
      float: left;
      text-align: center;
      color: #fff;
      width: 100%;
  }
  #footer-bottom .social{
      float: right;
      text-align: center;
  } 
  .dropdown-menu, .dropdown-submenu {
      background: #fff;
  }
  .jumbotron {
    height: 500px;
  }
  .jumbotron video {
    height: 650px;
  }
  .banner-top{margin-top: 200px;}
  div.modal-dialog { max-width: 1000px; }
  #logo-img {
    background-image: url(/assets/images/flo-logo.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 70px;
    padding-left: 200px;
  }
  .logo-img {
    height: 70px;
    width: 200px;
  }
  .logo-img-webp {
    height: 70px;
    width: 200px;
  }
}
  
@media only screen and (min-width: 1200px){
  #logo-img {
    background-image: url(/assets/images/flo-logo.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 80px;
    padding-left: 268px;
  }
  .logo-img {
    height: 80px;
    width: 268px;
  }
  .logo-img-webp {
    height: 80px;
    width: 268px;
  } 
}

/************************************************************************/
/***                      Miscellaneous Styles                        ***/
/************************************************************************/
.side-title h2,.side-title h3,.side-title h4,{font-weight: 700;}
.so-widget-sow-anything-carousel .sow-carousel-container {
  align-items: center;
  display: flex;
  justify-content: center;
  margin: 0 -32px;
}
.so-widget-sow-anything-carousel .sow-carousel-container h4 {font-size: 1.5rem;}
.so-widget-sow-anything-carousel .sow-carousel-container a.sow-carousel-next, .so-widget-sow-anything-carousel .sow-carousel-container a.sow-carousel-previous {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: 'anything-carousel-arrows';
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  position: relative;
}
.so-widget-sow-anything-carousel .sow-carousel-container a.sow-carousel-previous {
  bottom: -125px;
  left: 45%;
}
.so-widget-sow-anything-carousel .sow-carousel-container a.sow-carousel-next {
  bottom: -125px;
  left: -45%;
}
.counter-number{font-size: 65px;line-height: 85px; text-align: center;}
.counter-number:before{
  content: "";
  background: var(--tertiary-color);
  position: absolute;
  top: -10px;
  height: 3px;
  width: 30%;
}
.counter-text{font-size: 18px;line-height: 25px; text-align: center;}

.counter-number:before{
  content: "";
  background: var(--tertiary-color);
  position: absolute;
  top: -10px;
  height: 3px;
  width: 30%;
}
.counter-text{font-size: 18px;line-height: 25px; text-align: center;}

.video-columns .panel-row-style{align-items: center !important;}


.overlay-primary,.overlay-quinary,.overlay-quinary-50{position: relative;color: #fff;}
.overlay-primary .panel-grid-cell,.overlay-quinary .panel-grid-cell{margin: auto;}
.overlay-primary h2, .overlay-primary h3, .overlay-primary h4, .overlay-primary h5, 
.overlay-primary p, .overlay-quinary h2, .overlay-quinary h3, .overlay-quinary h4, 
.overlay-quinary h5, .overlay-quinary p, .overlay-quinary-50 h2, .overlay-quinary-50 h3, 
.overlay-quinary-50 h4, .overlay-quinary-50 h5, .overlay-quinary-50 p {color: #fff;} 
.overlay-primary:after,.overlay-quinary:after,.overlay-quinary-50:after{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  cursor: pointer;
}
.overlay-primary:after{
  background-color: var(--primary-color);
  opacity: 0.85;
}
.overlay-quinary:after{
  background-color: var(--quinary-color);
  opacity: 0.85;
}
.overlay-quinary-50:after{
  background-color: var(--quinary-color);
  opacity: 0.30;
}
.overlay-primary .so-panel,.overlay-quinary .so-panel,.overlay-quinary-50 .so-panel{position: relative;z-index: 5;}

.client-carousel img{
  max-height: 100px;
  width: auto;
  margin: auto;
}
.client-carousel a.sow-carousel-previous,.client-carousel a.sow-carousel-next{display: none !important;}
.client-carousel .sow-carousel-items .sow-carousel-item {
  margin: 0px 12px 0px 12px !important;
}
#split-50.panel-row-style{display: flex;flex-wrap: wrap;}
#split-50.panel-row-style .panel-grid-cell{width: 100%;margin-bottom: 50px;}
#split-50.panel-row-style .panel-grid-cell .img-lft{margin-right: 30px;}

@media only screen and (min-width: 1200px){
  #split-50.panel-row-style .panel-grid-cell{width: 50%;}
}

/************************************************************************
***                          Animated Styles                          ***
************************************************************************/
a.btn-call {
  display: flex;
  background-color: #0975c2;
  color: #fff;
  padding: 10px 20px;
  max-width: 100px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: auto;
  margin-right: auto;
  -webkit-animation: glowing 1500ms infinite;
  -moz-animation: glowing 1500ms infinite;
  -o-animation: glowing 1500ms infinite;
  animation: glowing 1500ms infinite;
}

@-webkit-keyframes glowing {
  0% { background-color: #115b98; -webkit-box-shadow: 0 0 3px#115b98; }
  50% { background-color: #0975c2; -webkit-box-shadow: 0 0 40px#0975c2; }
  100% { background-color: #115b98; -webkit-box-shadow: 0 0 3px#115b98; }
}

@-moz-keyframes glowing {
  0% { background-color:#115b98; -moz-box-shadow: 0 0 3px #115b98; }
  50% { background-color:#0975c2; -moz-box-shadow: 0 0 40px#0975c2; }
  100% { background-color:#115b98; -moz-box-shadow: 0 0 3px #115b98; }
}

@-o-keyframes glowing {
  0% { background-color: #115b98; box-shadow: 0 0 3px #115b98; }
  50% { background-color: #0975c2; box-shadow: 0 0 40px#0975c2; }
  100% { background-color: #115b98; box-shadow: 0 0 3px #115b98; }
}

@keyframes glowing {
  0% { background-color: #115b98; box-shadow: 0 0 3px #115b98; }
  50% { background-color: #0975c2; box-shadow: 0 0 40px #0975c2; }
  100% { background-color:#115b98; box-shadow: 0 0 3px #115b98; }
}