/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

:root {--primary-color: #ffe49e;--fs-color-primary: #ffe49e;--fs-color-secondary: #d26e4b;--fs-color-success: #7a9c59;--fs-color-alert: #b20000;--fs-experimental-link-color: #e2aa1c;--fs-experimental-link-color-hover: #c82222;}.tooltipster-base {--tooltip-color: #fff;--tooltip-bg-color: #000;}.off-canvas-right .mfp-content, .off-canvas-left .mfp-content {--drawer-width: 300px;}
html{background-image: url('/wp-content/uploads/2024/11/nen-cute-ezgif.com-png-to-webp-converter.webp');background-size: 100% auto;}.container-width, .full-width .ubermenu-nav, .container, .row{max-width: 1570px}.row.row-collapse{max-width: 1540px}.row.row-small{max-width: 1562.5px}.row.row-large{max-width: 1600px}body.framed, body.framed header, body.framed .header-wrapper, body.boxed, body.boxed header, body.boxed .header-wrapper, body.boxed .is-sticky-section{ max-width: 1200px}.header-main{height: 90px}#logo img{max-height: 90px}#logo{width:200px;}.header-bottom{min-height: 55px}.header-top{min-height: 30px}.transparent .header-main{height: 90px}.transparent #logo img{max-height: 90px}.has-transparent + .page-title:first-of-type,.has-transparent + #main > .page-title,.has-transparent + #main > div > .page-title,.has-transparent + #main .page-header-wrapper:first-of-type .page-title{padding-top: 140px;}.header.show-on-scroll,.stuck .header-main{height:70px!important}.stuck #logo img{max-height: 70px!important}.header-bottom {background-color: #f1f1f1}.header-bottom-nav > li > a{line-height: 16px }@media (max-width: 549px) {.header-main{height: 70px}#logo img{max-height: 70px}}.nav-dropdown{font-size:100%}body{color: #141414}h1,h2,h3,h4,h5,h6,.heading-font{color: #801e1e;}body{font-size: 100%;}@media screen and (max-width: 549px){body{font-size: 100%;}}body{font-family: "Roboto Slab", sans-serif;}body {font-weight: 400;font-style: normal;}.nav > li > a {font-family: "Roboto Slab", sans-serif;}.mobile-sidebar-levels-2 .nav > li > ul > li > a {font-family: "Roboto Slab", sans-serif;}.nav > li > a,.mobile-sidebar-levels-2 .nav > li > ul > li > a {font-weight: 700;font-style: normal;}h1,h2,h3,h4,h5,h6,.heading-font, .off-canvas-center .nav-sidebar.nav-vertical > li > a{font-family: "Roboto Slab", sans-serif;}h1,h2,h3,h4,h5,h6,.heading-font,.banner h1,.banner h2 {font-weight: 700;font-style: normal;}.alt-font{font-family: "Dancing Script", sans-serif;}.alt-font {font-weight: 400!important;font-style: normal!important;}.header:not(.transparent) .header-bottom-nav.nav > li > a{color: #df3e3e;}.header:not(.transparent) .header-bottom-nav.nav > li > a:hover,.header:not(.transparent) .header-bottom-nav.nav > li.active > a,.header:not(.transparent) .header-bottom-nav.nav > li.current > a,.header:not(.transparent) .header-bottom-nav.nav > li > a.active,.header:not(.transparent) .header-bottom-nav.nav > li > a.current{color: #1e73be;}.header-bottom-nav.nav-line-bottom > li > a:before,.header-bottom-nav.nav-line-grow > li > a:before,.header-bottom-nav.nav-line > li > a:before,.header-bottom-nav.nav-box > li > a:hover,.header-bottom-nav.nav-box > li.active > a,.header-bottom-nav.nav-pills > li > a:hover,.header-bottom-nav.nav-pills > li.active > a{color:#FFF!important;background-color: #1e73be;}.nav-vertical-fly-out > li + li {border-top-width: 1px; border-top-style: solid;}.label-new.menu-item > a:after{content:"New";}.label-hot.menu-item > a:after{content:"Hot";}.label-sale.menu-item > a:after{content:"Sale";}.label-popular.menu-item > a:after{content:"Popular";}
.header-button > a {
  background: #ffd900 !important;
  color: #000;
  font-size: 0.9rem;
  border: none;
  padding: 0 12px;
  position: relative;
  outline: 0;
  animation: 1s ease-out infinite shockwaveJump;
  border-radius: 5px !important;
}

.header-button {
  margin: 0;
}

.header-button > a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  border-radius: 8px;
  -webkit-animation: 1s ease-out 0.5s infinite shockwave;
  animation: 1s ease-out 0.5s infinite shockwave;
}

.header-button > a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  border-radius: 8px;
  -webkit-animation: 1s ease-out 0.65s infinite shockwave;
  animation: 1s ease-out 0.65s infinite shockwave;
}

@keyframes shockwaveJump {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  40% {
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
  }

  50% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
  }

  55% {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
  }

  60% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes shockwave {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    box-shadow: 0 0 2px #028843, inset 0 0 1px #028843;
  }

  95% {
    box-shadow: 0 0 25px transparent, inset 0 0 20px transparent;
  }

  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
  }
}
.box-content>.col {
  border: 3px solid red;
  border-radius: 10px;
  height: 680px;
  padding: 10px;
  margin-bottom: 36px;
  box-shadow: 0 0 8px 2px red;
}
.box-content > .col > .col-inner {
  height: 100%;
  overflow: auto;
}
.box-content > .col > .col-inner::-webkit-scrollbar {
  width: 0.5rem;
  border-radius: 10px;
}
.box-content > .col > .col-inner::-webkit-scrollbar-thumb {
  border-radius: 50px;
  background-color: red;
}

/* breadcrumbs Rankmath */
.large-12.col-breadcrumbs {
background-color: #f1f1f1;
color: #0f3e66;
padding: 7px;
border-radius: 5px;
border-bottom: 1px solid #c3b3b3;
border-right: 1px solid #c3b3b3;
margin-bottom: 10px;
}
.large-12.col-breadcrumbs p{
    margin-bottom: 0px !important;
}
.large-12.col-breadcrumbs a {
color: #0f3e66;
}

nav.rank-math-breadcrumb {
display: flex;
}
span.separator {
padding: 5px;
}
.taxonomy-description ul,.taxonomy-description ol{
    margin-left:20px;
}
.w-20{
    width:20% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}
.flickity-slider .section .box-image {
    padding-top: 100%;
}
.flickity-slider .section .box-image>* {
    position: absolute;
    bottom: 0;
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/

  .w-20{
    width:40% !important;
  }
  .w-20 .button{
    font-size:12px;
    padding: 0px 8px;
  }
}