/*
    Theme Name: Sperling Starter
    Theme URI: https://www.sperlinginteractive.com
    Description: Sperling Interactive WordPress Starter Theme
    Version: 1.0
    Author: Sperling Interactive
  Theme URI: https://www.sperlinginteractive.com
*/

:root {
    --dark-blue: #181948;  
    --blue: #4F69AC; 
    --lightblue2: #BBC6E3;       
    --lightblue: #CBE5DE;
    --orange: #E16E47;
    --white: white;
    --black: black;
    --lightblue2-rgba: rgba(187, 198, 227, 0.25);
    --green: #1B4752;
    --brown: #8D6E66;

}


/* @keyframes bubbleAnimation {
    0%, 100% {
        transform: translate(0%, 0%) translateY(0);
    }
    50% {
        transform: translate(0%, 0%) translateY(-25px);
    }
} */


.green-bg {
    background-color: var(--green) !important;
}


/* global box-sizing */
*,
*:after,
*:before {
    box-sizing: border-box;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* html element 62.5% font-size for REM use */
html {
    font-size: 62.5%;
    scroll-behavior: smooth;
}

body {
    color: #444;
    font: 300 11px/1.4 Helvetica, Arial, sans-serif;
    font-family: "sofia-pro", sans-serif;
    font-weight: 400;
    font-style: normal;
}

/* clear */
.clear:before,
.clear:after {
    content: ' ';
    display: table;
}

.clear:after {
    clear: both;
}

.clear {
    zoom: 1;
}

img {
    max-width: 100%;
    vertical-align: bottom;
    height: auto;
}

/* Lightspeed Lazy load fade in */
img[data-lazyloaded] {
    opacity: 0;
}

img.litespeed-loaded {
    -webkit-transition: opacity .5s linear 0.2s;
    -moz-transition: opacity .5s linear 0.2s;
    transition: opacity .5s linear 0.2s;
    opacity: 1;
}

a {
    text-decoration: none;
    color: var(--blue);
    transition: 0.3s ease;
}

a:hover {
    color: var(--orange);
}

a:focus {
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
}

input:focus {
    border: 1px solid #04A4CC;
    outline: 0;
}

p,
ul,
ol {
    font-size: 1.6rem;
    font-family: "sofia-pro", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: var(--dark-blue);
    line-height:1.8;
}

h1 {
    font-size: 3.6rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

h2 {
    font-size: 3.2rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

h3 {
    font-size: 2.8rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

h4 {
    font-size: 2.4rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

h5 {
    font-size: 2.0rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

h6 {
    font-size: 1.6rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}

blockquote {
    margin: 25px 0;
    padding: 25px 0 25px 5vw;
    font-style: italic;
    border-top: 1px solid;
    border-bottom: 1px solid;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/
/* wrapper */
.wrapper {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    min-height: 100vh;
    position: relative;
    width: 100%;
    max-width: 2560px;
    overflow:hidden;
}

.container {
    max-width:1280px; 
    align-self: center;
    flex: 1 auto;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    padding: 0 20px;
}

.container.container-fluid {
    max-width:100%;
}

/* header */
.header {}

.logo-img {
    backface-visibility: hidden;
    height: 80px;
}

/* nav */
.nav {}

/* sidebar */
.sidebar {}

/* footer */
.footer {
    background: var(--dark-blue);
    padding: 20px;
}

.pagination {
    font-size: 1.6rem;
}

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*------------------------------------*\
    PAGES
\*------------------------------------*/
/*------------------------------------*\
    IMAGES
\*------------------------------------*/


/*------------------------------------*\
    ACF GOOGLE MAP
\*------------------------------------*/

.acf-map {
    width: 100%;
    height: 100%;
    min-height: 400px;
    max-height: 600px;
    border: #ccc solid 1px;
    margin: 20px 0;
  }

   /* Fixes potential theme css conflict. */
  .acf-map img {
   max-width: inherit !important;
  }


  .mgt-100 {
    margin-top: 100px !important;
  }

  .mgb-100 {
    margin-bottom: 100px !important;
  }

  .mgt-50 {
    margin-top: 50px !important;
  }

  .mgb-50 {
    margin-bottom: 50px !important;
  }

  .mgt-25 {
    margin-top: 25px !important;
  }

  .mgb-25 {
    margin-bottom: 25px !important;
  }


  /* HOME */
.hero {
    padding-top: 145px;
}
  .home-hero {
    background-color: var(--dark-blue);
    position:relative;
    min-height: 750px;
  }

header{
    position: absolute;
    left:0px;
    top:0px;
    width:100%;
    padding: 35px 0px 35px 0px;
    z-index:2;
    border-top: 15px solid var(--dark-blue);
    transition: 0.3s ease;
}

header.sticky-header {
    position:fixed;
    top: 0px;
    background-color: var(--dark-blue);
    padding: 25px 0px 15px 0px;
    z-index:3;
}

header .columns {
    justify-content: space-between;
}

nav ul {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: 0px;
    margin: 0px;
    list-style:none;
}

nav ul li a {
    color: var(--white);
}


.nav ul li a:after{
    content: '';
    display: block;
    border-bottom: 2px solid var(--orange);
    transform: scaleX(0);
    transition: transform 350ms ease-in-out;
}

.nav ul li a:hover:after,
.nav ul li.menu-item-has-children:hover > a:after{
  transform: scaleX(1);
  transform-origin:  0% 50%;
}

.nav ul .sub-menu li a:hover:after,
.nav ul .sub-menu li a:after{ 
    display: none;
}

.nav ul li a {
    font-family: 'Roboto Slab', serif;
    font-weight:400;
}




.nav ul li.menu-item-has-children{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    perspective: 1000px;
    z-index: 100;
  }
  
  .nav ul li.menu-item-has-children:hover .sub-menu li{
    display: block;
  }
  
  .nav ul .sub-menu{
      padding: 10px 0;
      position: absolute;
      top: 100%;
      left: -70px;
      width: 250px;
      perspective: 1000px;
      z-index: -1;
      background-color: var(--lightblue);
      border-top: 2px solid var(--orange);
      border-radius: 0 0  15px 15px;
      -webkit-box-shadow: 0px 4px 8px -1px rgba(0,0,0,0.3);
      box-shadow: 0px 4px 8px -1px rgba(0,0,0,0.3);
  }
  
  .nav ul .sub-menu li{
    display: none;
    opacity: 0;
    padding: 0 20px;
    margin-bottom:5px;
  }
  
  .nav ul li.menu-item-has-children:hover .sub-menu{
    display: block;
  }
  
  .nav ul .sub-menu{
    display: none;
  }
  
  .nav ul .sub-menu li{
    display: block;
    opacity: 1;
  }
  
  .nav ul li.menu-item-has-children:hover .sub-menu{
    animation: growDown 300ms ease-in-out forwards;
    transform-origin: top center;
  }

  .nav ul .sub-menu li a{
    color: var(--dark-blue);
  }

  .nav ul .sub-menu li a:hover{
    color: var(--orange);
  }
  
  /* Menu Animation */
  @-moz-keyframes growDown {
      0% {
        transform: scaleY(0);
      }
      80% {
        transform: scaleY(1.1);
      }
      100% {
        transform: scaleY(1);
      }
  }
  @-webkit-keyframes growDown {
      0% {
        transform: scaleY(0);
      }
      80% {
        transform: scaleY(1.1);
      }
      100% {
        transform: scaleY(1);
      }
  }
  @-o-keyframes growDown {
      0% {
        transform: scaleY(0);
      }
      80% {
        transform: scaleY(1.1);
      }
      100% {
        transform: scaleY(1);
      }
  }
  @keyframes growDown {
      0% {
        transform: scaleY(0);
      }
      80% {
        transform: scaleY(1.1);
      }
      100% {
        transform: scaleY(1);
      }
  }

.button.orange,
.custom-orange-button a  {
    padding: 5px 17px 8px 17px;
    background-color: var(--orange);
    transition: 0.3s ease;
    color: var(--white) !important;
    border-radius:7px;
    font-size:1.6rem;
}

.button.orange:hover,
.custom-orange-button a:hover{
    background-color: var(--blue);
}

.custom-orange-button a {
    display:block;
    padding: 8px 17px 8px 17px;
}


.custom-orange-button a:after{
    display:none !important;
}



.nav-button{
    text-align:right;
    margin-bottom: 35px;
    margin-top: -15px;
}

.white,
.white p{
    color: var(--white);
}


.home-hero  h1 {
    font-size:4.6rem;
}

.dark-blue-bg {
    background-color: var(--dark-blue);
}

.blue-bg {
   background-color: var(--blue);
}

.light-blue-bg {
    background-color: var(--lightblue);
}

.orange-bg {
    background-color: var(--orange);
}

.light-blue2-bg {
    background-color: var(--lightblue2);
}

.bubble {
    display:block;
    width:21px;
    height:21px;
    border-radius:50%;
    position:absolute;
  
}

.bubble.small {
    width:21px;
    height:21px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 4s infinite;
}

.bubble.medium {
    width:60px;
    height:60px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 7s infinite;
}

.bubble.medium-large {
    width: 85px;
    height:85px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 8s infinite;
}

.bubble.large {
    width:100px;
    height:100px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 9s infinite;
}

.bubble-list {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:calc(100% - 100px);
    z-index:0;
    padding: 0px;
    margin: 0px;
}

.hero .container {
    position:relative;
    z-index:1;
}

.bubble-list .x1 {
    right: 5%;
    top: 15px;
}

.bubble-list .x2 {
    left: 5%;
    top: 25px;
}

.bubble-list .x3 {
    right: 55%;
    bottom: 13%;
}


.home .bubble-list .x3 {
    left:0px;
    bottom: 50%;
}

.bubble-list .x4 {
    right: 5%;
    bottom: 30%;
    left: unset;
    top: unset;
}


.bubble-list .x5 {
    left: 0%;
    bottom: 45%;
}


.bubble-list .x6 {
    left: 2%;
    top: 45px;
}

.bubble-list .x7 {
    right: 1%;
    top: 35px;
}

.bubble-list .x8 {
    right: 50%;
    bottom: 5%;
}

.bubble-list .x9 {
    left: -50px;
    bottom: 58%;
}

.bubble-list .x10 {
    left: 60%;
    top: 25%;
}

.center {
    text-align:center;
}

.orange-h2 h2 {
    color: var(--orange);
    font-size:2.2rem;
}

.orange-h2 strong {
    font-size:3rem;
    line-height:1.2;
    font-family: 'Roboto Slab', serif;
}

.justify-center {
    justify-content: center;
}

.button-box {
    margin-top: 25px;
}

.button-box a {
    display:inline-block;
}

.button {
    background-color: var(--blue);
    padding: 10px 15px;
    color: var(--white);
    transition: 0.3s ease;
    font-size: 1.5rem;
    font-family: 'Roboto Slab', serif;
    min-width:150px;
    text-align:left;
    border-radius: 6px;
}

.button:hover{
    background-color: var(--orange);
    color: var(--white);
}

.button i {
    float: right;
    position: relative;
    top: 3px;
}

.image-box.circle {
    width: 500px;
    height: 500px;
    border-radius: 50%;
    overflow: hidden;
}
.opportunity .bubble-list {
    height:100%;
}
.opportunity .x1 {
    right: 0%;
    top: 15px;
}

.opportunity .x2 {
    left: 0;
    bottom: 0px;
    top:unset;
}

.opportunity .x3 {
    right: 5%;
    top: 45px;
    left:unset;
}

.opportunity .image-box {
    position:relative;
    z-index:2;
}

.franchise-process {
    justify-content: space-between;
    padding: 75px 0px;
    overflow:hidden;
}


.franchise-process .container {
    position:relative;
    z-index: 2;
}
.franchise-process strong,
.franchise-process p {
    color: var(--white);
}


.franchise-process .x1 {
    top: 35px;
    left: -40px;
    right:unset;
}

.franchise-process .x2 {
    left: 5%;
    top: 150px;
}

.franchise-process .x3 {
    left: 2%;
    top: 175px;
}
.franchise-process .bubble-list {
height:100%;
}
.bubble-list .x4 {
    right: unset;
    bottom: 50px;
    left: -30px;
    top: unset;
}

.bubble.medium-small {
    width:30px;
    height:30px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 5s infinite;
}

.bubble-list .x7 {
    right: -1%;
    top: unset;
    bottom: 20px;
}

.medium-large-xl {
    width:150px;
    height:150px;
    transform: translate(-50%, -50%);
    animation: bubbleAnimation 10s infinite;
}
.bubble-list .x8 {
    right: -50px;
    bottom: unset;
    top: 5px;
}

.bubble-list .x6 {
    left: unset;
    top: 145px;
    right: 100px;
}
.bubble-list .x5 {
    left: unset;
    bottom: 183px;
    right: 100px;
}

.video .video-box {
    border: 10px solid var(--lightblue2);
    position: relative;
    padding-bottom: 56.25%;
}
.home .video {
    margin-top: -40px;
}
.video .video-box iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
}

.image-box {
    border-radius: 9px;
    overflow:hidden;
}

.image-box img {
    transition: 0.3s ease;
    transform: scale(1.0);
    width:100%;
   
}

.image-box:hover img {
    transform: scale(1.05);
}

.blog-section .content-box-inner {
    padding: 50px;
}

.blog-section .content-box-inner h2 a {
    font-size: 3rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
    color: var(--black)
}

.blog-section .content-box-inner h2 a:hover,
.blog-section .no-margin a:hover{
    color: var(--blue);
}

.blog-section .content-box-inner p {
    margin-top: 0px;
}

.date{
    color: var(--orange);
    font-size:15px;
    font-weight:300;
}

.blog-section .image-box.bottom {
    margin-bottom: 15px;
}


.no-margin {
    margin: 0px;
}

.blog-section .no-margin  {
    margin-top: 5px;
}
.blog-section .no-margin a {
    font-size: 1.7rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
    color: var(--black)
}
.footer {
    padding: 0px;
    margin-top: auto;
}

.bottom-footer {
    background-color: var(--lightblue2);
}


.top-footer {
    padding: 50px 0px;
}


.home-hero .image-box:hover img {
    transform: scale(1.0);
}


.grecaptcha-badge {
    z-index:999;
}


.submit-box {
    max-width:450px;
    margin-left:auto;
}
.submit-box label {
    display:none !important;
}

.submit-box #frm_field_7_container,
.submit-box #frm_field_6_container {
    margin: 0px;
}

.submit-box input[type='email'] {
    padding: 24px 145px 25px 25px !important;
}

footer .submit-box input[type='email'] {
    padding: 15px 145px 16px 25px !important;
}

.submit-box input[type='email']::placeholder {
    color: #104F7C !important;
}

.submit-box button {
    margin: 0px !important;
    background-color: var(--blue) !important;
    padding: 10px 15px !important;
    color: var(--white) !important;
    transition: 0.3s ease !important;
    font-size: 1.5rem !important;
    font-family: 'Roboto Slab', serif !important;
    min-width: 125px !important;
    text-align: left !important;
    border-radius: 6px !important;
    outline: none !important;
    border: 0px !important;
}

.submit-box button:hover{
    background-color: var(--orange) !important;
    color: var(--white) !important;
}

.submit-box button i {
    float: right !important;
    position: relative !important;
    top: 3px !important;
}

.submit-box .frm_fields_container {
    position: relative !important;
}

.submit-box  .frm_submit {
    position:absolute !important;
    right: 5px !important;
    top: 5px !important;
    max-width: 150px !important;
}

footer nav {
    margin-top: 20px;
}

.column.logo-columns {
  display: flex;
}

.logo-columns .logo {
    margin-top: auto;
}

.bottom-footer a.small {
    font-size:1.6rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 400;
    color: var(--dark-blue);
}

.bottom-footer a.small:hover{
    color: var(--orange);
}
.bottom-footer {
    padding-top: 25px;
}
.bottom-footer .copyright {
    text-align: center;
    margin-top: 0px;
    
}

.social-list {
    display: flex;
    justify-content: end;
    align-items:center;
}


.social-list a {
    font-size:20px;
    color: var(--dark-blue);
    transition: 0.3s ease;
    margin-left: 10px;
}

.social-list a:hover{
    color: var(--orange);
}

#responsive-menu-pro-container #responsive-menu-pro-title #responsive-menu-pro-title-image img {
    max-width:250px !important;
    height:100px !important;
}


.why-onyva .hero .image-box.circle,
.onyva-territories .hero .image-box.circle {
    width: 200px;
    height: 200px;
}

.why-onyva .image-box-list,
.onyva-territories .image-box-list {
    display:flex;
}

.why-onyva .hero .image-box,
.onyva-territories .hero .image-box {
    position:relative;
    transition: 1s ease;
    top:0px;
}

.why-onyva .hero .image-box:hover,
.onyva-territories .hero .image-box:hover{
    top:-10px;
}

.why-onyva .image-box-list .first,
.onyva-territories .image-box-list .first {
    margin-bottom: 100px;
}

.why-onyva .image-box-list .second,
.onyva-territories .image-box-list .second {
    margin-top: 100px;
}

.orange {
    color: var(--orange) !important;
}

.hero h1.small {
    font-size: 2.2rem;
}

.hero .content-box.white p strong {
    font-size: 3rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
}

.why-onyva .image-box.circle.third,
.onyva-territories .image-box.circle.third {
    width:300px;
    height:300px;
    margin-left: auto;
    margin-right: 0px;
    margin-top:200px;
}

.why-onyva  .bubble-list .x9,
.onyva-territories  .bubble-list .x9 {
    left: 262px;
    top: 300px;
    bottom: unset;
}
.why-onyva  .bubble-list .x4,
.onyva-territories  .bubble-list .x4 {
    right: unset;
    top: 220px;
    left: 320px;
}

.why-onyva .bubble-list .x2,
.onyva-territories .bubble-list .x2 {
    left: 685px;
    top: 300px;
}

.why-onyva .bubble-list .x11,
.onyva-territories .bubble-list .x11 {
    left: 50%;
    top: 200px;
}

.sidebar-content-box h2 {
    color: white;
    font-size: 3rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
}

.sidebar-content-box h3 {
    color: var(--white);
    margin-top: 0px;
    font-weight: 300;
    font-size: 2rem;
    
}

.sidebar-content-box p:last-child{
    font-family: 'Roboto Slab', serif;
}

.sidebar-content-box .content-box {
    padding: 20px 15px;
}

.sidebar-content-box{
    margin-bottom: -150px;
    margin-top: 150px;
}


.why-onyva .hero{
    margin-bottom: 200px
}

.expectations-section h3{
    margin: 0px 0px 10px 0px;
    color: var(--blue);
    font-size:2rem;
    font-weight:500;
}

.expectations-section .column {
    margin-bottom: 15px;
}

.ceo-section .image-box {
    border-radius: 0px;
}

.ceo-section .content-box {
    padding: 0px 25px;
}

.blue p {
    color: var(--blue);
    font-weight:600;
}


.home-hero.hero-white-bg {
    background-color: var(--white);
    padding-top: 185px;
}


.header.white nav li a {
    color: var(--dark-blue);
}

.header.white.sticky-header nav li a {
    color: var(--white);
}

.header.white.sticky-header nav li a:hover,
.header.white.sticky-header nav .sub-menu li a:hover{
    color: var(--orange);
}

.header.white.sticky-header .logo img {
    display:none;
}

.header.white.sticky-header .logo {
    width: 230px;
    height:80px;
    background-image:url(img/logo-white-v2.svg);
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;
}

.header.white.sticky-header .logo a {
    display:block;
    width:100%;
    height:100%;
}

.header.white.sticky-header nav .sub-menu li a {
    color: var(--dark-blue);
}

.home-hero.hero-white-bg p strong {
    font-size: 3rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
}

.home-hero.hero-white-bg .bubble.x12 {
    left: 300px;
    top: 500px;
}

.home-hero.hero-white-bg .bubble.x11 {
    left: 50%;
    top: 300px;
}


.home-hero.hero-white-bg .bubble-list .x5 {
    left: 47%;
    top: 223px;
    right: unset;
    bottom:unset;
}


.home-hero.hero-white-bg .bubble-list .x6 {
    left: unset;
    top: 284px;
    right: 44%;
}

.home-hero.hero-white-bg .bubble-list .x7 {
    right: 11%;
    top: 320px;
    bottom: unset;
}

.home-hero.hero-white-bg .bubble-list .x10 {
    left: unset;
    top: unset;
    right: 5%;
    bottom: 0px;
}

.home-hero.hero-white-bg .content-box {
    padding: 0px 35px;
}

.service-section .image-box.circle {
    width:300px;
    height: 300px;
    position:relative;
    z-index:1;
}

.service-section p strong,
.onyva-territories .left-copy-right-image   p strong {
    color: var(--blue);
    font-size:2rem;
}


.service-section  .bubble-list .x2 {
    left: unset;
    top: 25px;
    right: 50px;
}

.service-section  .bubble-list .x1 {
    right: 30px;
    top: 200px;
    bottom: unset;
}

.service-section  .bubble-list .x4 {
    right: unset;
    bottom: unset;
    left: 19%;
    top: 50px;
}


.service-section .bubble-list .x3 {
    right: 78%;
    bottom: 0%;
    top: unset;
}

.service-section .bubble-list {
    height:100%;
}


.lightblue2-rgba-bg {
    background-color: var(--lightblue2-rgba);
    border-radius: 15px;
    padding-bottom:50px;
}

footer .sub-menu {
    display:none !important;
}

.difference-section .image-box {
    margin-top: -100px;
}

.container.medium {
    max-width:1200px;
}

.section-ways p strong {
    color: var(--blue);
    font-family: 'Roboto Slab', serif;

}

.section-ways .content-box-orange {
    border-radius: 15px;
    height:100%;
}

.section-ways .content-box-orange {
    padding: 25px;
    display:flex;
    align-items:center;
    justify-content: space-between;
}
.section-ways .content-box-orange .button-box{
    margin-top: 0px;
}
.section-ways .content-box-orange p {
    color: var(--white);
    margin: 0px;
    font-size: 2.7rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
}

.section-ways .content-box-orange .copy-box {
    max-width: 540px;
}

.section-ways .content-box-orange .button:hover {
    background-color: var(--dark-blue);
}


.hero.home-hero.hero-white-bg .content-box p em {
    font-style:normal;
    font-family: 'Roboto Slab', serif;
    font-weight: 300;
    font-size: 2.6rem;
}

.flex-content-section .column,
.flex-content-section .copy-colored-box {
    height:100%;
    min-height:300px;
}

.flex-content-section .copy-colored-box {
border-radius:9px;
padding: 25px 50px;
font-size:2rem;
display: flex;
align-items: center;
}

.flex-content-section .copy-colored-box p {
    margin: 0px;
    font-weight: 600;
    font-size: 2.5rem;
    font-weight: 600;
 
}

.flex-content-section .columns .column:first-child .copy-colored-box p {
    font-family: 'Roboto Slab', serif;
    font-size:3rem;
}

.flex-content-section  .image-box {
    height: 300px;
}
.flex-content-section  .image-box img {
    height: 100%;
    object-fit: cover;
}

.additional-content hr {
    border-top:1px solid #CBE5DE;
    background:none;
}


.content-repeater .bubble-list {
height:100%;
z-index: -1;
}


.image-box.small.circle {
    width:350px;
    height:350px;
}

.image-box.small-xs.circle {
    width:110px;
    height:110px;
}

.content-repeater .bubble-list .x1 {
    right: 25%;
}

.content-repeater .bubble-list .x4 {
    left: 125px;
}

.content-repeater .bubble-list .x3 {
    right: 8%;
}

.content-repeater .bubble-list .x2 {
    left: 8%;
    top: unset;
    bottom: 36px;
}


.content-repeater .columns-1 .image-box.small-xs {
    position: absolute;
    bottom: -16%;
    right: 6%;
}

.content-repeater .columns-2 .image-box.small-xs,
.content-repeater .columns-4 .image-box.small-xs  {
    position: absolute;
    top: -10%;
    right:0px;
}

.team-repeater .content-box {
    padding: 0px 15px;
}

.team-repeater .content-box h3 {
    color: var(--blue);
    margin: 0px 0px -10px 0px;
    font-family: "sofia-pro", sans-serif !important;

}

.left-copy-right-image .bubble-list {
    height:100%;
    z-index:-1;
}

.left-copy-right-image h3 {
    color: var(--blue);
    font-size:2rem;
}

.left-copy-right-image p {
    margin-bottom: 35px;
}

.hero-content-in-row {
    padding-top: 205px;
}

.hero-content-in-row h1 {
    font-size: 1.5rem;
}

.hero-content-in-row p strong {
    font-size: 3rem;
    line-height: 1.2;
    font-family: 'Roboto Slab', serif;
}

.gallery-section .column {
    margin-bottom: 35px;
}

.gallery-section .column:nth-child(3n + 2) {
    position: relative;
    top: 35px;
}

/* CIRCLES WITH CONTENT */

.circle {
    position: relative;
    display: block;
    margin: 2em 0;
    background-color: transparent;
    color: var(--white);
    text-align: center;

  }
  .circle p {
    color: var(--white);
    padding: 0px 20px;
  }

  .circle .number{
    font-weight:600;
    font-size: 4rem;
    margin-top: 11px;
    margin-bottom: -22px;
  }
  
  .circle:after {
    display: block;
    padding-bottom: 100%;
    width: 100%;
    height: 0;
    border-radius: 50%;
    background-color: #ddd;
    content: "";
  }

  .circle.dark-blue-bg:after {
    background-color: var(--dark-blue);
  
  }

  .circle.blue-bg:after {
    background-color: var(--blue);
  }

  .circle.orange-bg:after {
    background-color: var(--orange);
  }
  .circle.green-bg {
    background:none !important; 
  }
  .circle.green-bg:after {
    background-color: var(--green);
  }

  .circle.dark-blue-bg {
    max-width:360px;
  }

  .circle.orange-bg {
    max-width:210px;
    margin-left: auto;
    top: -85px;
   
  }

  .circle.blue-bg {
    max-width:310px;
    margin-right: auto;
    margin-left: auto;
    margin-top: -450px;
    left: 100px;
  }

  .circle.green-bg {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    bottom: 217px;
    left: 50px;
  }
  
  .circle__inner {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  .circle__wrapper {
    display: table;
    width: 100%;
    height: 100%;
  }
  
  .circle__content {
    display: table-cell;
    padding: 1em;
    vertical-align: middle;
  }

  .circle__content i {
    font-size:45px;
  }
  

.container.extra-small {
    max-width:720px;
}

.with-additional-style h3 {
    font-size: 1.5rem;
    color: var(--blue);
    margin-top: 30px;
    margin-bottom: 0px;
}

.with-additional-style h4 {
    font-size: 1.5rem;
    margin: 10px 0px 0px 0px;
}


.with-additional-style .circle.orange-bg {
    max-width: 275px;
    margin-left: unset;
    top: -70px;
    margin-right: auto;
    z-index: -1;
}

.image-box.middle.circle {
    width:350px;
    height:350px;
}

.keys-section {
    margin-top: -100px;
}

.keys-section h2 {
    margin: 0px 0px 20px 0px;

}

.keys-box {
    border: 2px solid #BBC6E3;
border-radius: 11px;
padding: 15px 25px 10px 25px;
}

.keys-box h3 {
    font-size: 1.5rem;
    color: var(--blue);
    margin-top: 30px;
    margin-bottom: 0px;
    margin-top: 0px;
}

.keys-box p {
    margin-top:5px;
   
}

.keys-box .content-box.first {
    position: relative;
    padding-right: 70px;
}


.keys-box .content-box.first:before{
    content:'';
    display:block;
    width:1px;
    height:100%;
    border-right:1px dotted var(--blue);
    position:absolute;
    right:35px;
    top:0px;
}


.whats-my-investment .addtional-section .bubble-list {
    height:100%;
    z-index:-1;
}

.whats-my-investment .addtional-section .bubble-list .x3 {
    right: 13%;
    bottom: 13%;
}
.note-box p {
    margin: 0px;
}

.the-ideal-onyva-franchisee .hero.home-hero.hero-white-bg .content-box p em,
.onyvas-franchise-process .hero.home-hero.hero-white-bg .content-box p em {
    color: var(--blue);
    font-size:1.7rem;
    font-family: "sofia-pro", sans-serif;
    font-weight: 600;

}


.content-with-repeater h2 {
    margin-bottom: 0px;
}

.content-with-repeater h3,
.operating-section h3 {
    font-size: 1.5rem;
    color: var(--blue);
    margin-top: 30px;
    margin-bottom: 0px;
    margin-top: 0px;
}

.content-with-repeater .bubble-list {
    height: 100%;
    z-index:-1;
}

.brown-bg {
    background-color: var(--brown);
}


.content-with-repeater .bubble-list .x3 {
    bottom: -24%;
}


.operating-section h2 {
    margin-bottom: -10px;
}


.operating-section .image-box-main {
    margin-bottom: 50px;
}


.operating-section .bubble-list .x3 {
    right: -8%;
    bottom: 4%;
}


.the-ideal-onyva-franchisee .left-copy-right-image .bubble-list .x3 {
left:50px;
bottom: 0px;
}

.the-ideal-onyva-franchisee .image-box.circle.small {
    width:300px;
    height:300px;
}
.right-image-additional-circle .button-box .button {
    min-width:180px;
}
/* .right-image-additional-circle .button-box:nth-child(2n) .button {
background-color: var(--dark-blue);
} */

.right-image-additional-circle .button-box:nth-child(2n) .button:hover{
    background-color: var(--orange);
   
}


.how-much-can-you-earn .bubble-list .x3 {
    right: 0px;
    bottom: 25%;
}

.how-much-can-you-earn .circle.green-bg {
    max-width:250px;
    max-width: 200px;
    margin-right: auto;
    margin-left: unset;
    left: 0px;
    bottom: 66px;
}

.step-repeater p {
    margin: 0px;
}
.step-repeater .content-box {
    height: 100%;
    padding: 20px;
    border-radius: 22px;
    min-height:150px;
}

.step-repeater .content-box h3,
.step-repeater .content-box p {
    color: var(--white);
    margin: 0px;
}

.step-repeater .content-box h3 {
    font-size:2.3rem;
    margin-bottom: 20px;
}

.step-repeater .content-box p {
    font-weight: bold;
}

.onyvas-franchise-process .flex-content .columns-0 .bubble-list .x3 {
    right: 55%;
    bottom: -10%;
} 

.onyvas-franchise-process .flex-content .columns-1 .bubble-list .x1 {
    left: 0px;
}

.onyvas-franchise-process .flex-content .columns-1 .bubble-list .x2 { 
    right: 0px;
    bottom: unset;
    top:0px;
    left:unset;
}

.onyvas-franchise-process .flex-content .columns-1 .bubble-list .x3 {
    right: 0%;
    bottom: 0px;
   left:unset;
} 


.onyvas-franchise-process .flex-content .columns-3 .bubble-list .x3 {
    left: 0px;
    bottom: -50px;
    right: unset;

}


.onyva-training-and-support .additional-content h2 {
    margin-bottom: 0px;
}

.onyva-training-and-support .additional-content p {
    margin-top: 5px;
}

.content-box.blue-h3 h3 {
    font-size: 2rem;
    color: var(--blue);
    margin-bottom: 10px;
}

.onyva-training-and-support  .circle.dark-blue-bg {
    max-width:265px;
}

.onyva-training-and-support  .circle.blue-bg {
    max-width:285px;
    left:50px;
}

.onyva-training-and-support .circle.green-bg {
    max-width:235px;
}

.onyva-training-and-support .bubbles-content .image-box {
    margin-top: -110px;
}

.onyva-training-and-support .content-box-note {
    margin-top:-150px;
}

.onyva-training-and-support .content-box.blue-h3 h3 {
    margin-top: 0px;
}

.content-box.support_last_content p {
margin: 0px;
font-size: 2.5rem;
}

.small-strong strong {
    margin-bottom: 0px;
    font-size:2rem !important;
}

.store-design .circle.green-bg,
.store-design .circle.orange-bg {
    margin: unset;
    top: 0px;
    left: unset;
    bottom: unset;
    max-width: 500px;
}
.store-design .circle.green-bg p,
.store-design .circle.orange-bg p {
    margin-bottom: 0px;
}
.store-design .circle.green-bg h3,
.store-design .circle.orange-bg h3{
    color: var(--white);
    font-size:1.7rem;
    margin: 0px;
    
}


.store-design .circle.orange-bg {
    max-width:350px;
    top:50px;
}

.store-design .bubbles-content .image-box {
    bottom:50px;
}


.contact .home-hero.hero-white-bg {
padding-top: 230px;
}
.contact .left-box h1 {
margin-bottom: 25px;
}

.contact .left-box h3 {
    font-size: 1.5rem;
    margin-bottom: 5px;
}

.contact .left-box a {
    color: var(--dark-blue);
    font-size: 20px;
}


.contact .left-box a:hover{
    color: var(--orange);
}

.contact .left-box .social {
    font-size:18px;
    margin-right:5px;
    font-size: 25px;
}

.contact .left-box .image-box.small.circle {
width:300px;
height:300px;
}


.form-box label,
.form-box .frm_primary_label {
    color: var(--dark-blue) !important;
    text-transform: uppercase !important;
    font-family: "sofia-pro", sans-serif !important;
    font-weight: 600 !important;
    margin-bottom: 10px !important;
}

.form-box input,
.form-box select,
.form-box textarea {
    border: 1px solid #707070 !important;
    border-radius: 8px !important;
    padding: 20px 15px !important;
}

.form-box select {
    padding: 0px 15px !important;
    height:42px !important;
}

.form-box .frm_other_input  {
    margin-top: 25px;
}

.form-box .frm_checkbox label {
    text-transform: unset !important;
}

.form-box .frm_checkbox label a{
    color: var(--orange);
}

.form-box .frm_checkbox label a:hover{
    color: var(--blue);
}

.form-box input[type=checkbox] {
    padding: 0px !important;
    border-radius: 0px !important; 
    box-shadow: 0px 3px 6px #00000029 !important;
    border-radius: 6px !important;
    border: none !important;
}

.form-box .submit-box {
    margin-left: unset !important;
}
.form-box .submit-box button {
    min-width: 165px !important;
}

.mgt-150 {
    margin-top: 150px !important; 
}
.onyva-territories .hero {
    padding-bottom: 50px;
    padding-top: 195px;
}
.onyva-territories .hero h2 {
    color: var(--white);
}

.onyva-territories .hero strong {
    color: var(--orange);
    font-size: 1.5rem !important; 
}
.onyva-territories .left-copy-right-image strong {
    color: var(--blue);
}
.onyva-territories .left-copy-right-image p {
    margin-bottom: 15px;
}



.filter-box {
    position: relative;
    min-height: 100px;
}

.options-list {
    list-style: none;
    padding: 0px;
    max-width: 500px;
    margin-left: auto;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 6px;
    height: 50px;
    overflow: hidden;
    transition: 0.3s ease;
    position: absolute;
    right: 0px;
    width: 300px;
    top: 0px;
    max-width: 100%;
    z-index: 2;
}

.options-list:hover {
    height: auto;
}



.options-list li {
    height: 100%;
    max-height: 50px;
    height: 50px;
}

.options-list li a {
    color: var(--dark-blue);
    padding: 10px 15px;
    display: flex;
    height: 100%;
    align-items: center;
    transition: 0.3s ease;
    background-color: white;
}

.options-list li a:hover {
    background-color: var(--blue);
    color: var(--white);
}

.options-list .all-categories a {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.options-list i {
    color: var(--dark-blue);
    position: absolute;
    right: 20px;
    top: 18px;
}

.options-list:hover i {

    transform: rotate(180deg);
}


.hero-blog-section {
    background-color: var(--dark-blue);
    padding: 25px 0px;
    
}

.hero-blog-section h1 {
    font-size: 1.5rem;
}

.btn.btn__primary.button {
    display:inline-block;
    cursor: pointer;
}


.news-section .image-box {
    margin-bottom: 25px;
}
.news-section h2 {
    font-size:2rem;
}
.news-section h2 a {
    color: var(--dark-blue);
    transition: 0.3s ease;
}

.news-section h2 a:hover{
    color: var(--orange);
}


.news-section .content-box {
    display:flex;
    flex-direction: column;
    height:100%;
}

.btn__wrapper {
    text-align:center;
}

.post-unique-container {
    padding-top: 120px;
}

.share-blog {
    display: flex;
    align-items: center;
    margin-bottom: 50px;

}

.share-blog a {
    color: var(--blue);
}

.share-blog h3 {
    font-size:1.8rem;
    margin-right:15px;
}


.single-post-sidebar ul {
    list-style:none;
    margin:0px;
    padding: 0px;
}
.single-post-sidebar h4 {
    margin-top: 0px;
}

.single-post-sidebar h4 a {
    color: var(--dark-blue);
    font-size:2rem;
}

.single-post-sidebar h4 a:hover{
    color: var(--orange);
}
.single-post-sidebar ul li {
    border-bottom: 1px solid var(--blue);
    margin-bottom: 25px;
}
.single-post-sidebar ul li:last-child {
    border-bottom: 0px;
}


.mission-and-values .content-repeater h3 {
    color: var(--blue);
    font-size:2rem;
    font-family: "sofia-pro", sans-serif !important;
}

.onyva-solutions .left-copy-right-image h3,
.onyva-training-and-support .blue-h3 h3  {
    font-family: "sofia-pro", sans-serif !important;
}

.the-ideal-onyva-franchisee  .content-with-repeater h3,
.the-ideal-onyva-franchisee .operating-section h3 {
    font-size:2rem;
}


.nav ul li.no-click a {
    pointer-events: none;;
}

.nav ul li.no-click ul li a {
    pointer-events: initial;
}

footer .nav li.no-click {
    display:none;
}


/* Home */

.home-top {
    height: 100vh;
}

section.home-video-container {
    position: relative;
    /* width: 100%;
    height: 100vh;*/
    overflow: hidden;
    background:white;
    display: flex;
    align-items: center;
}

.home header {
    background-color: var(--dark-blue);
}

.loading-video {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 9999999;
}

video.home-video {
    width: 100%;

    opacity: 0.25;
    position:absolute;
    left:0px;
    top:0px;
}

.mobile-header-images {
    opacity: 0.25;
}

.mobile-header-images img {
    width: 100%;
}

.home-video-container .loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%);
}

.home-video-content.container {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: auto;
}

#videoHeader {
    position: relative;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 75vw;
    min-height: 800px;
    max-height: 95vh;
    overflow: hidden;
}



#videoHeader video {
    object-fit: cover;
    height: 100%;
    width: 100%;
}


#videoHeader .container {
    height:auto;
}

.the-opportunity .content-box p {
    color:white;
}

.the-opportunity .hero.home-hero.hero-white-bg,
.onyvas-franchise-process .hero.home-hero.hero-white-bg,
.locations .hero.home-hero.hero-white-bg {
    background-color: var(--dark-blue);
}


.home-hero-additional-text p {
    font-size:2rem;
}

.contact-content-box p {
    font-size:1.5rem;
}

.the-opportunity .content-box.blue p {
    color: var(--blue);
}

.the-opportunity .content-box.blue  {
    padding: 0px 25px;
}

.locations .hover-box {
    opacity:0;
    z-index:-1;
    background-color: rgba(0, 0, 0, 0.65);
    position:absolute;
    left:0px;
    top: 0px;
    width: 100%;
    height: 100%;
    transition: 0.3s ease;
    display:flex;
    align-items:center;
    color:white;
    padding: 15px 35px;

}
.locations .hover-box p {
    color:white;
    font-size: 20px;
    font-family: "sofia-pro", sans-serif;
    font-weight: 600;
    line-height:1.2;
    max-width:300px;
    flex:none;
}
.locations .hover-box i {
    color:white;
    font-size: 20px;
 
    line-height:1.2;
}

.locations .card-box:hover .hover-box {
    opacity:1;
    z-index:1;
}

.locations .card-box {
    background-size:cover;
    background-position: center;
    background-repeat:no-repeat;
    min-height:250px;
}
.locations .card-box {
    position:relative;
    border-radius:6px;
    overflow:hidden;
}
.locations .bg-box {
    color:white;
    padding: 10px 15px;
    text-align:center;
    background-color: #181948;
    position:absolute;
    bottom:0px;
    left:0px;
    width:100%;
    z-index:3;
    
}
.locations .bg-box h2 {
    color:white;
    margin:0px;
    font-size:2.3rem;
}

.locations .card-box a {
display:block;
width:100%;
height:100%;
position:absolute;
}

.locations .locations-list .column {
    margin-bottom: 15px;
}

.locations .locations-list .columns .column:nth-child(2n) .bg-box {
background-color:#4F69AC;
}

.locations header.sticky-header {
    z-index:9;
}
.single-locations .home-hero.hero-white-bg {
    margin-bottom: 0px !important;
    padding-bottom: 50px;
}
.single-locations .hero-contentn-repeater {
    background-color:white;
    padding-bottom: 50px;
}

.single-locations .hero-contentn-repeater .content-box {
    border:2px solid #BBC6E3;
    padding: 25px;
    border-radius: 34px;
}
.single-locations .hero-contentn-repeater h2 {
    margin-top: 0px;
    font-size: 2.8rem;
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    color: var(--dark-blue);
}
.single-locations .hero-contentn-repeater p {
    color: #4F69AC;
    margin: 0px;

}

.single-locations .hero-contentn-repeater .columns {
    margin: 0px -35px;
}

.single-locations .hero-contentn-repeater .columns .column {
    padding: 0px 35px;
    border-right: 1px solid #BBC6E3;
}
.single-locations .hero-contentn-repeater .columns .column:last-child {
    border-right: 0px;
}


body.single-locations {
    background-color: #F2F4FA;
}

.single-locations .neighborhoods-repeater  {
    padding-top:30px;
}
.single-locations .neighborhoods-repeater  h4 {
    margin-bottom: 0px;

}
.single-locations .neighborhoods-repeater p {
    margin-top: 0px;
}
.single-locations .stats-box h4 {
    margin-top: 0px;
}
.single-locations .stats-box {
    background-color: #4F69AC;
    border-radius:10px;
    max-width:500px;
    padding: 10px 20px;
    margin-top:35px;
}
.single-locations .stats-box * {
    color:white;
}
.single-locations .stats-box ul {
    padding-left:18px;
}

.single-locations .dogs-in h4 {
    margin-bottom:15px;
}
.single-locations .dogs-in .columns {
    margin: 0px -25px;
}
.single-locations .dogs-in .columns .column {
    padding: 0px 25px;
    border-right: 1px solid #BBC6E3;
}
.single-locations .dogs-in .columns .column:last-child {
    border-right:0px;
}

.single-locations .neighborhoods-repeater a i {
    margin-left:15px;
}

.single-locations .neighborhoods-repeater .white-bg {
    background-color:white;
}

.single-locations .neighborhoods-repeater .column.with-padding {
    padding-bottom: 50px;
    padding-top:50px;
}
.single-locations .neighborhoods-repeater .image-box {
    z-index:2;
}
.single-locations .neighborhoods-repeater .bubble-list {
    z-index: 0;
}


.single-locations .specific-content p{
    font-size:1.4rem;
}

.single-locations .additional-content {
    padding-top:50px;
    padding-bottom: 50px;
}

.single-locations .additional-content .image-box  {
    z-index:2;
}

.single-locations .additional-form-section {
    position:relative;
}
.tag {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    margin-top:-135px;
}

.social-list .footer-logo-certificate img {
    max-width:75px;
}
/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/
@media only screen and (min-width:320px) {
    .nav-button {
        display:none !important;
    }

    .home-hero h1 {
        font-size: 2.9rem;
        margin-top: 50px;
        text-align:center;
        color: var(--dark-blue);
    }
    .home-hero-additional-text p {
        font-size: 1.6rem;
    }


    .bubble-list li:nth-child(2n) {
        display:none;
    }

    .home-hero .image-box {
        max-width:300px;
        margin: 0px auto;
    }

    .image-box.circle {
        width:300px;
        height:300px;
        margin: 0px auto;
    }
    .blog-section .content-box-inner {
        padding: 0px;
    }

    .blog-section .column.is-3-desktop {
        margin-bottom: 20px;
    }
    .why-onyva .image-box.circle.third,
    .onyva-territories .image-box.circle.third {
        display:none;
    }
    .sidebar-content-box {
       
        margin-top: 50px;
    }
    .why-onyva .image-box-list,
    .onyva-territories .image-box-list {
        flex-wrap:wrap;
    }

    .why-onyva .image-box-list .first,
    .onyva-territories .image-box-list .first {
        margin-bottom: 20px;
    }
    .why-onyva .image-box-list .second,
    .onyva-territories .image-box-list .second {
        margin-top: 20px;
    }

    .home-hero.hero-white-bg .content-box {
        padding: 0px;
    }

    .hero.home-hero.hero-white-bg h1 {
        text-align:left;
    }

    .difference-section .image-box {
        margin-top: 0px;
    }
    .difference-section.mgt-100 {
        margin-top: 0px !important;
    }
    .section-ways .content-box-orange {
        flex-wrap:wrap;
    }
    .section-ways .content-box-orange .button-box {
        margin-top: 15px;
    }
    .home-hero.hero-white-bg .image-box {
        max-width:500px;
        }
      
        .flex-content-section .column.column-35 {
            width:100%;
        }  

        .gallery-section .column:nth-child(3n + 2) {
            position: relative;
            top: 0px;
        }
        .circle.dark-blue-bg {
            margin-left:auto;
            margin-right:auto;
        }
        .circle.orange-bg {
            max-width:210px;
            margin-left: auto;
            margin-right:auto;
            top: 0px;
           
          }
        
          .circle.blue-bg {
            max-width:310px;
            margin-right: auto;
            margin-left: auto;
            margin-top: 0px;
            left: 0px;
          }
        
          .circle.green-bg {
            max-width: 400px;
            margin-left: auto;
            margin-right: auto;
            bottom: 0px;
            left: 0px;
          }

          .chart-section h2 {
            font-size:2.2rem;
          }
          .onyva-training-and-support .content-box-note,
            .onyva-training-and-support .bubbles-content .image-box {
            margin-top: 0px;
          }

          .onyva-training-and-support .bubbles-content .column.is-5-desktop .circle.orange-bg  {
            top:0px;
          }

          .store-design .circle.green-bg p,
            .store-design .circle.orange-bg p {
                font-size:1.4rem;
            }
            .store-design .bubbles-content .image-box {
                bottom: 0px;
            }
            .how-much-can-you-earn .no-margin-mobile {
                margin-top: 0px !important;
            }


            .custom-orange-button a {
                color: var(--dark-blue) !important;
            }



            .home .bubble-list .x5,
            .home .bubble-list .x7 {
                display:none;
            }            
}

@media only screen and (min-width:480px) {

    .circle.dark-blue-bg {
        margin-left:unset;
        margin-right:auto;
    }
    .circle.orange-bg {
        max-width:210px;
        margin-left: unset;
        margin-right:auto;
        top: -200px;
       
      }
    
      .circle.blue-bg {
        max-width:310px;
        margin-right: unset;
        margin-left: auto;
        margin-top: 0px;
        left: 0px;
        top:-100px
      }
    
      .circle.green-bg {
        max-width: 400px;
        margin-left: auto;
        margin-right: unset;
        bottom: 200px;
        left: 0px;
      }
      .bubbles-content.mgb-50 .column.is-8-desktop {
        margin-bottom: -200px !important;
      }
      .onyva-training-and-support .content-box-note {
        margin-top: -150px;
      }

      .store-design .circle.green-bg p,
      .store-design .circle.orange-bg p {
          font-size:1.7rem;
      }
      .hidden-mobile {
        padding: 0.0rem;
    }
    
}

@media only screen and (min-width:769px) {
    .image-box.circle {
        width:500px;
        height:500px;
    }
    .blog-section .content-box-inner {
        padding: 50px;
    }
    .blog-section .column.is-3-desktop {
        margin-bottom: 0px;
    }
    .why-onyva .image-box-list,
    .onyva-territories .image-box-list {
        flex-wrap:unset;
    }

    .why-onyva .image-box-list .first,
    .onyva-territories .image-box-list .first {
        margin-bottom: 100px;
    }
    .why-onyva .image-box-list .second,
    .onyva-territories .image-box-list .second {
        margin-top: 100px;
    }
   
    .flex-content-section .column.column-35 {
        width:50%;
    }   

    .circle.orange-bg {
        max-width:210px;
        margin-left: auto;
        top: -85px;
        margin-right:unset;
       
      }
    
      .circle.blue-bg {
        max-width:310px;
        margin-right: auto;
        margin-left: auto;
        margin-top: -450px;
        left: 100px;
        top:0px;
      }
    
      .circle.green-bg {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
        bottom: 217px;
        left: 50px;
      }

      .circle.dark-blue-bg {
        margin-left:unset;
        margin-right:unset;
    }
    .chart-section h2 {
        font-size:3.2rem;
      }

      .onyva-training-and-support .bubbles-content .image-box {
        margin-top:-110px;
      }
      .store-design .bubbles-content .image-box {
        bottom: 50px;
    }

    .home-hero-additional-text p {
        font-size: 2rem;
    }
}

@media only screen and (min-width:1024px) {

    .desktop-hidden {
        display:none !important;
    }

    .nav-button {
        display:block !important;
    }


    .home-hero h1 {
        font-size: 4.6rem;
        margin-top: 0px;
        text-align:left;
    }

    .custom-orange-button a {
        color: var(--white) !important;
    }

    .bubble-list li:nth-child(2n) {
        display:block;
    }
    .home-hero .image-box {
        max-width: unset;
    }
    .why-onyva .image-box.circle.third,
    .onyva-territories .image-box.circle.third {
        display:block;
    }
    .sidebar-content-box {
        margin-bottom: -150px;
        margin-top: 150px;
    }
    .home-hero.hero-white-bg .content-box {
        padding: 0px 35px;
    }

    .hero.home-hero.hero-white-bg h1 {
        text-align:left;
    }

    .difference-section .image-box {
        margin-top: -100px;
    }

    .difference-section.mgt-100 {
        margin-top: 100px !important;
    }

    .section-ways .content-box-orange {
        flex-wrap:nowrap;
    }

    .section-ways .button-box {
        margin-top: 0px;
    }
    .home-hero.hero-white-bg .image-box {
        max-width:500px;
        }
        .hero.home-hero.hero-white-bg .is-5-desktop.is-offset-1-desktop {
            margin-left:0px;
            width:50%;
            }
            .flex-content-section .column.column-35 {
                width:37.5%;
            }


            .gallery-section .column:nth-child(3n + 2) {
                position: relative;
                top: 35px;
            }
            .onyva-training-and-support .bubbles-content .column.is-5-desktop .circle.orange-bg  {
                top:-130px;
              }

              .how-much-can-you-earn .no-margin-mobile {
                margin-top: 50px !important;
            }

            .home .bubble-list .x5,
    .home .bubble-list .x7 {
        display: block;
    }
    .hidden-mobile {
        padding: 0.75rem;
    }
}

@media only screen and (min-width:1140px) {
    .hero.home-hero.hero-white-bg .is-5-desktop.is-offset-1-desktop {
        margin-left: 8.33333%;
        width: 41.66667%;
    }
      
    .circle.orange-bg {
        max-width:210px;
        margin-left: auto;
        top: -85px;
        margin-right:unset;
       
      }
    
      .circle.blue-bg {
        max-width:310px;
        margin-right: auto;
        margin-left: auto;
        margin-top: -450px;
        left: 100px;
        top:0px;
      }
    
      .circle.green-bg {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
        bottom: 217px;
        left: 50px;
      }

      .circle.dark-blue-bg {
        margin-left:unset;
        margin-right:unset;
    }
    
}

@media only screen and (min-width:1280px) {}

@media only screen and (max-width:1023px) {
    .locations .hover-box p {
        max-width:unset;
        flex:unset;
    }
    .single-locations .image-box {
        margin: 0px auto !important;
    }
}


  


/*------------------------------------*\
    MISC
\*------------------------------------*/
::selection {
    background: #04A4CC;
    color: #FFF;
    text-shadow: none;
}

::-webkit-selection {
    background: #04A4CC;
    color: #FFF;
    text-shadow: none;
}

::-moz-selection {
    background: #04A4CC;
    color: #FFF;
    text-shadow: none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #FFF;
    border: 1px solid #F0F0F0;
    max-width: 96%;
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption .wp-caption-text,
.gallery-caption {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

.sticky {}

.bypostauthor {}

/*------------------------------------*\
    PRINT
\*------------------------------------*/
@media print {
    * {
        background: transparent !important;
        box-shadow: none !important;
        color: #000 !important;
        text-shadow: none !important;
    }

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

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

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

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

    pre,
    blockquote {
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

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

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

    @page {
        margin: 0.5cm;
    }

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

    h2,
    h3 {
        page-break-after: avoid;
    }

    .nav,
    .sidebar,
    .home-slider,
    #respond {
        display: none;
    }

    @page {
        margin: 2cm;
    }
}