/*
Theme Name: Fluid Systems Services
Theme URI: https://www.fluidsystemsohio.com
Author: TKG
Description: Custom one-page theme for Fluid Systems Services, Inc.
Version: 1.0.9
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: fluid-systems-ohio-theme
*/

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 10px; -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 1.42857143; color: #666666; background: #ffffff; overflow-x: hidden; border-top: 72px solid #222222; }
img { vertical-align: middle; border: 0; max-width: 100%; height: auto; }
figure { margin: 0; }
a { color: #666666; text-decoration: none; }
a:hover, a:focus, a:active { color: #043cb7; text-decoration: none; outline: none; }
h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: 500; line-height: 1.1; color: #222222; }
h1, h2, h3 { margin-top: 20px; margin-bottom: 10px; }
h4, h5, h6 { margin-top: 10px; margin-bottom: 10px; }
h1 { font-size: 4em; }
h2 { font-size: 3.3em; line-height: 1em; }
h3 { font-size: 2.3em; }
h4 { font-size: 1.8em; }
h5 { font-size: 1.3em; }
h6 { font-size: 1.1em; }
p { margin: 0 0 10px; }
p strong { color: #222222; }
p.lead { margin-bottom: 20px; font-size: 1.7em; font-weight: 300; line-height: 1.5em; }
p.lead:last-child { margin-bottom: 0; }
small { font-size: 80%; }
iframe { border: 0; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* Utilities (names kept from the previous build so copy carries over) */
.upper { text-transform: uppercase; }
.lighter { opacity: 0.8; }
.light, .light h1, .light h2, .light h3, .light h4, .light h5, .light h6, .light p { color: #ffffff; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-primary { color: #043cb7; }
.sep-top-xs { padding-top: 1.5em; }
.sep-top-sm { padding-top: 2.2em; }
.sep-top-md { padding-top: 3em; }
.sep-top-lg { padding-top: 4.3em; }
.sep-top-2x { padding-top: 6.5em; }
.sep-top-3x { padding-top: 9.4em; }
.sep-top-5x { padding-top: 16em; }
.sep-bottom-xs { padding-bottom: 1.5em; }
.sep-bottom-sm { padding-bottom: 2.2em; }
.sep-bottom-md { padding-bottom: 3em; }
.sep-bottom-lg { padding-bottom: 4.3em; }
.sep-bottom-2x { padding-bottom: 6.5em; }
.sep-bottom-3x { padding-bottom: 9.4em; }
.sep-bottom-5x { padding-bottom: 16em; }
.fs-space-50 { height: 50px; }

/* Grid */
.container { margin: 0 auto; padding-left: 15px; padding-right: 15px; }
.container::after, .fs-row::after, .navbar .container::after { content: ""; display: table; clear: both; }
.fs-row { margin-left: -15px; margin-right: -15px; }
[class*="fs-col-"] { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; width: 100%; }
.fs-row--full { position: relative; width: var(--fs-vw, 100vw); margin-left: calc(50% - var(--fs-vw, 100vw) / 2); margin-right: 0; }
.fs-el { margin-bottom: 0; }
.fs-el > :last-child { margin-bottom: 0; }
.fs-image { text-align: center; margin: 0 0 35px; }
.fs-image img { display: inline-block; vertical-align: top; }

/* Section titles */
.section-title h1, .section-title h2, .section-title h3, .section-title h4, .section-title h5, .section-title h6 { margin: 0 0 30px 0; }
.bordered-right { border-right: 5px solid #043cb7; padding-right: 40px; }

/* Header strip (the page title band, reduced to a strip) */
.header-section { margin-top: -72px; height: 120px; background-color: #222222; }

/* Navigation */
.navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 1030; min-height: 50px; margin: 0; border: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.25); background-color: rgba(0, 0, 0, 0.76); transition: all .4s; }
.navbar-header { position: relative; z-index: 100; }
.navbar-brand { float: left; display: block; height: auto; padding: 15px 15px; margin-left: -15px; margin-right: 20px; }
.navbar-brand h1.infoname { padding: 12px 0 15px 0; margin: 0; font-size: 20px; line-height: 1.1; color: #ffffff; transition: all .4s; }
.navbar-toggle { display: none; position: absolute; top: 0; left: 0; margin: 25px 20px 0; padding: 0; background: none; border: 0; border-radius: 0; color: #ffffff; font-size: 14px; cursor: pointer; transition: all .4s; }
.navbar-toggle .fs-i { font-size: 1.33333333em; vertical-align: -15%; }
.navbar-nav { list-style: none; margin: 0; padding: 0; }
.navbar-nav > li { position: relative; display: block; }
.navbar-nav > li > a { position: relative; display: block; line-height: 41px; padding: 12px 4px 15px 4px; font-size: 0.8em; font-weight: 600; text-transform: uppercase; color: #ffffff; border-top: 3px solid transparent; background: none; }
.navbar-nav > li > a:hover, .navbar-nav > li > a:focus, .navbar-nav > li.open > a, .navbar-nav > li.active > a { color: #7bb6f0; border-color: #7bb6f0; }
.caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; }
.dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 220px; margin: 0; padding: 0; list-style: none; font-size: 14px; text-align: left; background-color: #ffffff; border: 0; border-top: 6px solid #7bb6f0; border-radius: 0; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); background-clip: padding-box; }
.navbar-nav > li.open > .dropdown-menu { display: block; }
.dropdown-menu > li { padding: 0 15px; }
.dropdown-menu > li > a { display: block; padding: 0 10px 0 0; font-size: 0.9em; line-height: 42px; text-transform: uppercase; color: #909090; border-bottom: 1px solid #eeeeee; white-space: nowrap; }
.dropdown-menu > li:last-of-type > a { border-bottom: 0; }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #7bb6f0; background: transparent; }
.navbar.opaque { background-color: #ffffff; border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
.navbar.opaque .navbar-nav > li > a { padding-top: 5px; padding-bottom: 8px; color: #aaaaaa; }
.navbar.opaque .navbar-nav > li > a:hover, .navbar.opaque .navbar-nav > li > a:focus, .navbar.opaque .navbar-nav > li.open > a, .navbar.opaque .navbar-nav > li.active > a { color: #7bb6f0; border-color: #7bb6f0; }
.navbar.opaque .navbar-brand { padding-top: 12px; padding-bottom: 12px; }
.navbar.opaque .navbar-brand h1.infoname { padding: 7px 0 8px 0; color: #222222; }
.navbar.opaque .navbar-toggle { margin-top: 20px; color: #222222; }

/* Logged-in admin bar sits above the fixed nav */
.admin-bar .navbar { top: 32px; }
.admin-bar .navbar-collapse { top: 32px; }
@media (max-width: 782px) { .admin-bar .navbar, .admin-bar .navbar-collapse { top: 46px; } }

/* Icon boxes */
.icon-box { overflow: hidden; }
.icon-box h1, .icon-box h2, .icon-box h3, .icon-box h4, .icon-box h5, .icon-box h6 { margin: 20px 0 15px 0; }
.icon-box .icon-content { display: block; float: left; text-align: center; max-width: 100%; background-color: #043cb7; color: #ffffff; }
.fs-i { display: inline-block; fill: currentColor; }
.icon-box .icon-content .fs-i { vertical-align: -0.14em; }
.icon-box.icon-lg .icon-content { width: 110px; height: 110px; line-height: 110px; font-size: 4.5em; }
.icon-box.icon-md .icon-content { width: 95px; height: 95px; line-height: 95px; font-size: 4em; }
.icon-box.icon-xs .icon-content { width: 45px; height: 45px; line-height: 45px; font-size: 1.7em; }
.icon-box.icon-lg .icon-box-content { margin: 0 0 0 135px; }
.icon-box.icon-md .icon-box-content { margin: 0 0 0 120px; }
.icon-box.icon-xs .icon-box-content { margin: 0 0 0 65px; }
.icon-box.icon-xs .icon-box-content h6 { margin: 10px 0 15px 0; color: #043cb7; }
.icon-box.icon-xs .icon-box-content p { margin: 0; }
.icon-box.icon-horizontal { text-align: center; }
.icon-box.icon-horizontal .icon-content { float: none; margin: auto; display: inline-block; }
.icon-box.icon-horizontal .icon-box-content { margin: 0; }
.img-circle { border-radius: 50%; }

/* Services */
.fs-service h5 { color: #043cb7; }
.fs-service .icon-box { overflow: visible; }

/* Products band */
.fs-products { position: relative; background-image: url(https://www.fluidsystemsohio.com/wp-content/uploads/2019/11/products.png); }
.fs-products > .container { position: relative; z-index: 2; }
.section-shade { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; background-color: rgba(0, 0, 0, 0.45); background-image: linear-gradient(to bottom, transparent 0, #000000 130%); background-repeat: repeat-x; }
.section-shade::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 100px; z-index: 60; background-image: linear-gradient(to top, transparent 0, #000000 165%); background-repeat: repeat-x; }

/* Map */
.fs-map { background-color: #f7f7f7; padding: 0; }
.fs-map iframe { display: block; width: 100%; height: 450px; margin: 0; padding: 0; border: 0; }

/* Contact form (Contact Form 7, with or without its Bootstrap helper) */
.wpcf7 p { margin: 0 0 10px; }
.wpcf7 .form-group { margin-bottom: 15px; }
.wpcf7 .wpcf7-form-control-wrap { display: block; padding-bottom: 5px; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea, .form-control { display: block; width: 100%; height: 46px; padding: 10px 16px; font-family: inherit; font-size: 0.9em; line-height: 1.42857143; color: #555555; background-color: #ffffff; background-image: none; border: 1px solid #cccccc; border-radius: 0; box-shadow: none; resize: none; transition: border-color ease-in-out .15s; }
.wpcf7 textarea, textarea.form-control { min-height: 140px; }
.wpcf7 input:focus, .wpcf7 textarea:focus, .form-control:focus { border-color: #666666; outline: 0; box-shadow: none; }
.wpcf7-submit, .btn-primary { display: inline-block; margin-bottom: 0; padding: 10px 40px; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; color: #ffffff; background-color: #043cb7; background-image: none; border: 2px solid #043cb7; border-radius: 40px; -webkit-appearance: none; }
.wpcf7-submit:hover, .wpcf7-submit:focus, .btn-primary:hover, .btn-primary:focus { color: #ffffff; background-color: #043cb7; border-color: #043cb7; outline: none; }
.wpcf7 form .wpcf7-response-output { margin: 2em 0 1em; padding: 15px; border: 1px solid transparent; border-radius: 4px; }
.wpcf7 form.init .wpcf7-response-output, .wpcf7 form.resetting .wpcf7-response-output, .wpcf7 form.submitting .wpcf7-response-output { display: none; }
.wpcf7 form.sent .wpcf7-response-output { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; }
.wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output { color: #a94442; background-color: #f2dede; border-color: #ebccd1; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; }
.wpcf7 .wpcf7-not-valid-tip { display: block; margin-top: 4px; font-size: 0.9em; color: #d9534f; }
.wpcf7 .hidden-fields-container { display: none; }
.wpcf7 .alert { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; }
.wpcf7 .alert-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; }
.wpcf7 .alert-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; }
.wpcf7 .alert-warning { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; }

/* Footer */
#footer { color: #909090; }
#footer a { color: #ffffff; }
#footer a:hover { color: #7bb6f0; }
#footer .inner { background-color: #222222; }
#footer .copyright { background-color: #171717; }
#footer small { display: block; font-size: 90%; color: #909090; }
#back_to_top { display: none; position: fixed; z-index: 1000; bottom: 40px; right: 40px; }
#back_to_top a { display: block; width: 45px; height: 45px; line-height: 45px; text-align: center; outline: none; border-radius: 50%; opacity: 0.5; color: #ffffff; background: #555555; }
#back_to_top a:hover { opacity: 0.8; background: #555555; }
#back_to_top .fs-i { font-size: 1.33333333em; vertical-align: -15%; }

/* Reveal animations (same timing as before) */
.wow { visibility: hidden; }
.wow.animated { visibility: visible; }
.animated { animation-duration: 1s; animation-fill-mode: both; }
.fs-no-anim .wow, .fs-no-anim .fs-anim { visibility: visible; opacity: 1; animation: none !important; }
.flipInY { backface-visibility: visible !important; animation-name: flipInY; }
.bounceInLeft { animation-name: bounceInLeft; }
.bounceInUp { animation-name: bounceInUp; }
@keyframes flipInY { 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateY(-10deg); } 70% { transform: perspective(400px) rotateY(10deg); } 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; } }
@keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } }
@keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } }
.fs-anim { opacity: 0; }
.fs-anim.fs-in { opacity: 1; }
.fs-appear.fs-in { animation: fs-appear .7s 1 cubic-bezier(.175, .885, .32, 1.275); transform: scale(1); }
@keyframes fs-appear { 0% { transform: scale(.5); opacity: .1; } 100% { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .wow, .fs-anim { visibility: visible; opacity: 1; animation: none !important; } }

/* Generic inner pages */
.fs-page-title { padding: 2.2em 0 0; }
.fs-page-title h2 { margin: 0 0 30px; }
.fs-content { padding-bottom: 4.3em; }
.fs-content h1, .fs-content h2, .fs-content h3 { font-size: 1.9em; }

/* Tablet and up */
@media (min-width: 768px) {
  .container { width: 750px; }
  .fs-col-2 { float: left; width: 16.66666667%; }
  .fs-col-3 { float: left; width: 25%; }
  .fs-col-6 { float: left; width: 50%; }
  .fs-col-12 { float: left; width: 100%; }
  .navbar-header { float: left; }
  .navbar-collapse { float: left; }
  .navbar-nav { float: left; }
  .navbar-nav > li { float: left; }
  .navbar-nav > li.dropdown:hover > .dropdown-menu { display: block; }
  .navbar-nav > li.dropdown:hover > a { color: #7bb6f0; border-color: #7bb6f0; }
  .navbar-collapse .navbar-toggle { display: none; }
}
@media (min-width: 992px) {
  .container { width: 970px; }
  .navbar-nav > li > a { font-size: 0.9em; padding-left: 10px; padding-right: 10px; }
}
@media (min-width: 1200px) {
  .container { width: 1170px; }
}

/* Phone */
@media (max-width: 767px) {
  html, body, .text-right, .text-left { text-align: center; }
  h1 { font-size: 2.5em; }
  h2 { font-size: 1.9em; }
  h3 { font-size: 1.7em; }
  h4 { font-size: 1.5em; }
  .bordered-right { padding-right: 0; }
  .sep-top-xs { padding-top: 1em; }
  .sep-top-sm { padding-top: 1.3em; }
  .sep-top-md { padding-top: 2em; }
  .sep-top-lg { padding-top: 2.6em; }
  .sep-top-2x { padding-top: 4.5em; }
  .sep-top-3x { padding-top: 5em; }
  .sep-top-5x { padding-top: 8em; }
  .sep-bottom-xs { padding-bottom: 1em; }
  .sep-bottom-sm { padding-bottom: 1.3em; }
  .sep-bottom-md { padding-bottom: 2em; }
  .sep-bottom-lg { padding-bottom: 2.6em; }
  .sep-bottom-2x { padding-bottom: 4.5em; }
  .sep-bottom-3x { padding-bottom: 5em; }
  .sep-bottom-5x { padding-bottom: 8em; }
  .navbar-header { text-align: center; z-index: 0; }
  .navbar-brand { float: none; display: inline-block; margin-left: 0; margin-right: 0; }
  .navbar-toggle { display: block; }
  .navbar-collapse { position: fixed; z-index: 50; left: -100%; top: 0; bottom: 0; width: 100%; padding-top: 55px; background: #151515; overflow-y: auto; transition: left 0.5s ease; }
  .navbar-collapse.in { left: 0; }
  .navbar-collapse .navbar-toggle { display: block; margin: 25px; color: #ffffff; }
  .navbar-nav { margin: 0; padding: 0 10px; text-align: left; }
  .navbar-nav > li > a, .navbar.opaque .navbar-nav > li > a { padding: 0; border: 0; border-bottom: 1px solid #555555; color: #ffffff; }
  .navbar-nav > li > a:hover, .navbar-nav > li > a:focus, .navbar.opaque .navbar-nav > li > a:hover, .navbar.opaque .navbar-nav > li > a:focus { color: #7bb6f0; }
  .navbar-nav > li.dropdown > .dropdown-menu { position: static; float: none; width: auto; margin: 0; padding: 0 0 0 20px; background: transparent; border: 0; box-shadow: none; }
  .navbar-nav > li.dropdown.open > .dropdown-menu { display: block; }
  .dropdown-menu > li { padding: 0; }
  .dropdown-menu > li > a, .dropdown-menu > li:last-of-type > a { border-bottom: 1px solid #555555; }
  .icon-box .icon-content { margin: auto; float: none; }
  .icon-box.icon-lg .icon-box-content, .icon-box.icon-md .icon-box-content, .icon-box.icon-xs .icon-box-content { margin-left: 0; }
  #back_to_top a { font-size: 1em; width: 30px; height: 30px; line-height: 30px; }
}