/*!
Theme Name: Ohio-Child
Theme URI: http://ohio.colabr.io/
Author: Colabrio
Author URI: http://colabr.io/
Description: Ohio is a WordPress theme bundled with premium plugins to build a modern and functional website.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: ohio
Text Domain: ohio-child
Tags: ajax, customizer, ecommerce, portfolio, minimal, page builder, responsive, multipurpose, shop, store, woocommerce, wpml

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/



@import url("css/fonts.css");

:root {
  --color-text: #384850;
  --color-text-light: #848484;
  --color-brand: #de354c;
  --font-family-heading: "Gilroy", sans-serif;
  --font-family-body: "Google Sans", sans-serif;
}


h1,
h2,
h3,
h4,
h5,
h6,
p {
  color: var(--color-text);
}
p {
  font-size: clamp(18px, 2.5vw, 20px);
  line-height: 1.5em;
}
/*
p {    
  letter-spacing: -.01em;
  font-size: 17px;
  line-height: 1.5em;
}
h1.heading-sm, h2.heading-sm, h3.heading-sm, h4.heading-sm, h5.heading-sm, h6.heading-sm {
font-weight: 700;
}
*/
h1 {
  text-transform: uppercase;
}

.site-header {
  z-index: 9999 !important;
}

.site-header.header-fixed {
  box-shadow: 0 0 3px 1px rgba(0, 0, 0, .1);
}

.site-header.header-fixed .site-branding img {
  max-height: 37px;
}

.site-header .header-wrap-inner .menu-optional {
  display: none;
}

.site-header:not(.mobile-header) .nav-item {
  margin-left: 3vw;
}

.site-header:not(.mobile-header) .nav-item a {
  padding: 0;
  text-transform: uppercase;
}

.project-page .project-meta li:last-child {
  width: 50%;
  margin: 0;
}

.flexslider {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.page-container.bottom-offset {
  padding-bottom: 0;
}

.client-logo-details {
  display: none;
}


.process-headline {
  margin: 0 0 20px;
  font-size: 1.8em;
  letter-spacing: -0.02em;
}

.process-number.heading-sm {
  margin: 0;
  font-size: 3em;
  font-weight: 100;
  letter-spacing: -0.02em;
}



.portfolio-item-grid .portfolio-item-details {
  background: linear-gradient(0deg, rgba(0, 0, 0, .75) 10%, transparent 100%);
  padding: 2rem !important;
}

.portfolio-item-grid .portfolio-item-details .show-project {
  left: 2rem;
  right: 2rem;
}

.portfolio-item-grid .portfolio-item-details h3.portfolio-item-headline {
  font-size: calc(22px + 5 * ((100vw - 576px) / 1024));
  font-weight: 900;
  text-transform: uppercase;
}

.portfolio-item-grid .portfolio-item-details .show-project-link {
  font-size: 16px;
}



.site-header.mobile-header .main-nav .close-bar {
  width: calc(100% - 56px);
  justify-content: flex-end;
  float: right;
  color: #ffffff;

}

.site-header.mobile-header .mbl-overlay-container {
  right: 0;
  left: auto;
  transform: translateX(50px);
  background-color: var(--color-brand);
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  padding: 100px 40px;
  justify-content: center;
}

.site-header.mobile-header .mbl-overlay-container .sub-nav {
  margin: 3em 0 0;
}

.site-header.mobile-header .mbl-overlay .close-bar .ion {
  color: #ffffff;
}

.site-header.mobile-header .main-nav .nav-item a {
  font-size: 1.6em;
  font-weight: 700;
  line-height: 1.5em;
  color: rgba(255, 255, 255, .5);
}

.site-header.mobile-header .main-nav .nav-item.current-menu-item a,
.site-header.mobile-header .main-nav .nav-item.current-menu-item .current-menu-item,
.site-header.mobile-header .main-nav .nav-item.current-menu-ancestor a,
.site-header.mobile-header .main-nav .nav-item.current-menu-ancestor .current-menu-item {
  font-weight: 700;
  color: #ffffff !important;
}

.site-header.mobile-header .main-nav .copyright {
  display: none;
}

.site-header.mobile-header .main-nav .nav-item.has-submenu>a {
  display: none;
}

.site-header.mobile-header .main-nav .sub-nav .sub-menu {
  padding-left: 15px;
  height: auto;
  margin-top: 25px;
}

.site-header.mobile-header .main-nav .nav-item .sub-nav-item a {
  font-weight: 400;
  font-size: 1.1em;
}

.site-header.mobile-header .main-nav .nav-item:last-child .sub-menu {
  display: flex;
  justify-content: flex-end;
}

.site-header.mobile-header .main-nav .nav-item:last-child .sub-menu li a {
  padding: 0;
  margin: 0 20px 0 10px;
  font-size: 24px;
}

.breadcrumbs-slug i {
  margin-top: 0;
}

.vc_row.bg-black-gradient {
  background: linear-gradient(180deg, rgb(96 96 96 / 20%), transparent);
  border-radius: 0;
  background-color: transparent !important;
  box-shadow: 0px -30px 30px -30px #000000;
}

.featured-box-details h3 {
  font-size: calc(28px + 4 * ((100vw - 576px) / 1024));
  margin-bottom: 1.5rem;
}

.featured-box-details h5.title {
  font-size: calc(16px + 1 * ((100vw - 576px) / 1024));
  border: 1px solid rgb(255 255 255 / 20%);
  display: inline-block;
  padding: 1rem .75rem .75rem;
  text-transform: uppercase;
  line-height: 1em;
}

.featured-box-details h5.title::before {
  content: ' ';
  width: 10px;
  height: 10px;
  display: inline-block;
  background: #e0344e;
  border-radius: 100%;
  margin-right: 14px;
  top: -1px;
  position: relative;
}

.process-flow .wpb_single_image img {
  max-height: 320px;
  margin-bottom: 1em;
}

.clb-page-headline .clb-title {
  color: var(--color-text);
  text-indent: -.075em;
}

.btn {
  text-transform: uppercase;
  letter-spacing: .01em;
  font-weight: 700;
  padding: 1em 1.4em .8em;
  display: inline-flex;
  gap: .7em;
}

.breadcrumbs-slug li {
  color: var(--color-text);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-heading);
  font-weight: 600;
  line-height: 1em;
}

.breadcrumbs-slug i {
  margin-top: -2px;
}

.breadcrumbs-slug .active,
.breadcrumbs-inner .active {
  font-weight: 400;
  color: var(--color-brand);
}

.single-ohio_portfolio .page-container.bottom-offset {
  max-width: 100%;
  background: rgba(136, 136, 136, 0.15) !important;
}

.single-ohio_portfolio .page-container.bottom-offset .project-page {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 20px;
}

h6.project-meta-title {
  text-transform: uppercase;
  color: var(--color-text);
}

.project-page .project-first-image img {
  margin: 0;
}

.category-holder {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.category-holder::after {
  display: none;
}

.post-meta .category-holder {
  margin: 0 0 .75rem;
}

.category-holder .category {
  font-weight: 400;
  color: var(--color-text-light);
  white-space: nowrap;
  line-height: 1em;
}

.category-holder .category:not(:last-child) {
  margin-right: 10px;
  padding-right: 10px;
  border-right: 1px solid;
}

.category-holder .category:after {
  display: none;
}

.portfolio-grid {
  margin: 0 -.5rem !important;
}

.portfolio-item-wrap {
  padding: .5rem !important;
}

.portfolio-item-grid.portfolio-grid-type-2 .category-holder .category {
  color: #fff;
  font-weight: 500;
  opacity: .8;
}

.clb-page-headline-holder {
  padding-bottom: 0;
}

.client-logo-overlay .client-logo-img {
  text-align: center;
}

.client-logo-overlay .client-logo-img img {
  max-width: 130px;
}

.heading .divider+h5.title {
  font-size: calc(18px + 6 * ((100vw - 576px) / 1024));
}

.portfolio-sorting {
  padding: 1em 0;
}

.portfolio-sorting ul {
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  background: #ededed;
  padding: 1em;
  border-radius: 0;
  display: flex;
  justify-content: space-evenly;
}

.portfolio-sorting ul li {
  padding: 0;
  color: var(--color-text);
  font-size: 0;
  border-right: 1px solid #bfbfbf;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portfolio-sorting ul li:first-child {
  display: none;
}

.portfolio-sorting ul li:last-child {
  border: none;
}

.portfolio-sorting ul li a {
  margin: 0;
  font-family: var(--font-family-heading);
  font-weight: 900 !important;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 18px;
  line-height: 18px;
}

.portfolio-sorting li a .num {
  display: none;
}

.sticky-nav-holder {
  padding: 1rem 1.5rem;
}

.sticky-nav-image,
.sticky-nav-holder {
  box-shadow: 0 0 4px rgba(0, 0, 0, .2);
}

.sticky-nav_heading {

  text-transform: uppercase;
}

.sticky-nav h6.heading-sm {
  font-weight: 400;
  font-size: 16px;
  margin-right: 1rem;
}


.wpb_single_image.svg .vc_figure {
  width: 100%;
}

.wpb_single_image.svg .vc_single_image-wrapper {
  width: 100%;
}

.wpb_single_image.svg img {
  width: 100%;
}

.wpcf7 form .wpcf7-response-output {
  padding: 15px;
  text-align: center;
  font-weight: bold;
  margin-top: 30px;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  border: 1px solid var(--color-brand);
  color: var(--color-brand);
  background: #fbdce0;
}

.wpcf7 form.sent .wpcf7-response-output {
  color: #46b450;
  border: 1px solid #46b450;
  background: #e3ffe5;
}


@media screen and (min-width: 1025px) {
  .featured-box-details .vc_column-inner {
    padding: 5rem !important;
  }
}

@media screen and (max-width: 1024px) {
  .featured-box-details {
    order: 99;
  }

  .featured-box-details .vc_column-inner {
    padding: 3rem !important;
  }

  .clb-hero-screen {
    flex-direction: row;
  }
}

@media screen and (max-width: 768px) {
  .featured-box-details {
    order: 99;
  }

  .featured-box-details .vc_column-inner {
    padding: 2rem !important;
  }

  .clb-hero-screen {
    flex-direction: column-reverse;
  }
}


.home-heading h1.title {
  font-size: clamp(3rem, 5.5vw, 5rem);
  line-height: 1em;
}
.heading .subtitle {
  margin: 0;
  font-size: 1.2em;
}
.counter-box {
  padding: 0 2rem;
}
.counter-box-count {
  font-size: 50px;
  margin: 10px 0;
}
.counter-box-headline {
  display: inline-block;
  font-weight: 600;
  text-transform: uppercase;
  font-weight: 900 !important;
  margin: 0 !important;
  line-height: 1em;
  font-size: 1.3em;
}
.grecaptcha-badge {
  opacity: 0;
  visibility: hidden;
}

.logo-small img {
  max-width: 125px;
}


.icon-box.about-box .icon-box-headline {
  margin-top: -2rem;
}
.icon-box.about-box .icon-box-icon {
  position: relative !important;
}
.icon-box-title.heading-sm {
  font-size: clamp(1.5em, 2.5vw, 1.7em) !important;
  color: var(--color-brand) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  min-height: 54px;
  line-height: 1em;
  margin: 0 !important;
  display: flex;
  align-items: center;
}

.icon-box.about-box .icon-box-title {
  font-size: clamp(1.8em, 2.5vw, 2.2em) !important;
  color: var(--color-brand) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  min-height: 50px;
  line-height: 60px;
  margin: 0 !important;
}

.widget_block p {
  color: var(--color-text-light);
  font-size: 16px;
  margin: 0 0 2rem;
  line-height: 1.5em;
}

.widget_block a:hover {
  color: var(--color-brand) !important;
}

.widget_block p:last-child {
  margin-bottom: 0;
}

footer.site-footer .widget-title {
  font-size: 20px;
  font-weight: 900;
  text-transform: uppercase;
  margin: 0 0 .5rem !important;
}
footer.site-footer .widget_nav_menu .menu-link span {
  color: #848484;
}

footer.site-footer .widget_nav_menu .menu-link:hover span {
  color: var(--color-brand);
  opacity: 1;
}

footer.site-footer .widget_nav_menu .current-menu-item .menu-link span {
  color: var(--color-brand);
  font-weight: bold;
}

footer.site-footer .widget_nav_menu .menu>li {
  font-size: 16px;
  padding: .15rem 0;
}

footer.site-footer a:hover {
  color: var(--color-brand);
}

footer.site-footer .site-info {
  color: #848484;
}

footer.site-footer .site-info-holder .right a {
  font-size: 22px;
  margin-left: 10px;
}