/*
 Theme Name:   Hello-elementor Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Hello-elementor Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     hello-elementor
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  hello-elementor-child
*/
#wpadminbar{

}
html {
    
}

.woocommerce-result-count, .woocommerce-ordering{
	display: none !important;
}

.main-menu a{
    height: 60px;
    align-items: flex-end !important;
}
.homelink:before,
.accountlink:before,
.cartlink:before,
.aboutlink:before,
.offerlink:before{
    content: "\e9a7";
    font-family: elementskit !important;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    color: #fff;
    position: absolute;
    font-size: 30px;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
}
.accountlink:before{
    content: "\e82a";
}
.cartlink:before{
    content: "\e82e";
}
.aboutlink:before{
	content:"\e854";
}
.offerlink:before{
	content: "\e88e";
}

.ov-hidden{
    overflow: hidden !important;
}
.ov-hidden-x{
    overflow-x: hidden !important;
}
.ov-hidden-y{
    overflow-y: hidden !important;
}
.header-toggle{
    z-index: 2 !important;
    position: fixed !important;
    transition: all 0.3s;
    margin-top: 0px;
    width: 100%;
}
.header-toggle.toggled{
    padding: 0px 10px 0px 10px;
    transition: all 0.3s;
}
.main-mid-logo{
    z-index: 2;
    margin: 0px auto;
    max-width: 300px !important;
}
.page-padding{
    margin-top: 75px !important;
}
.undersub{
    z-index: -1 !important;
}
.onlydesktop{
    display: block !important;
}
.onlymobile{
    display: none !important;
}
.about-copy{
    padding-top: 130px !important;
}
.height-a{
    min-height: 480px !important;
}
.copy-a h2{
    /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
    font-size: clamp(12px, 5cqw, 30px) !important;
}
.about-bg{
    background-image: url("images/about-img.jpg");
    background-repeat: no-repeat;
    background-size: 36%;
    background-position: 10% 5%;
}
.balloon img{
    z-index: 1;
    max-width: 200px !important;
    position: absolute;
    left: 2%;
    bottom: -400px;
    transform-origin: bottom center;
    animation: balloonRise 12s linear infinite,
             balloonSwing 2.5s ease-in-out infinite;
}
.no-wrap{
    flex-wrap: nowrap !important;  
}
/* Movement + growth + opacity */
@keyframes balloonRise {

  /* Start small below screen */
  0% {
    transform: translate(-50%, -150px) scale(0.3);
    opacity: 0;
  }

  /* Grow while rising */
  15% {
    transform: translate(-50%, -200px) scale(0.7);
    opacity: 0.8;
  }

  /* Reach floating position */
  25% {
    transform: translate(-50%, -250px) scale(1);
    opacity: 1;
  }

  /* Stay floating in place for ~5 seconds */
  65% {
    transform: translate(-50%, -250px) scale(1);
    opacity: 1;
  }

  /* Float away upward */
  90% {
    transform: translate(-50%, -650px) scale(1.05);
    opacity: 1;
  }

  /* Exit frame */
  100% {
    transform: translate(-50%, -120vh) scale(1.1);
    opacity: 0;
  }
}

/* Gentle swing + tilt */
@keyframes balloonSwing {

  0% {
    rotate: -4deg;
  }

  50% {
    rotate: 4deg;
  }

  100% {
    rotate: -4deg;
  }

}

.rocket img{
    z-index: 1;
    max-width: 100px !important;
    position: absolute;
    left: auto;
    right: 10%;
    bottom: -350px;
    animation: rocketFlight 12s linear infinite;
}
@keyframes rocketFlight {

  /* Start below screen */
  0% {
    transform: translate(0, 0) scale(0.4) rotate(25deg);
    opacity: 0;
  }

  /* Curve upward */
  20% {
    transform: translate(120px, -220px) scale(0.7) rotate(25deg);
    opacity: 1;
  }

  /* Reach hover point */
  35% {
    transform: translate(150px, -300px) scale(1) rotate(30deg);
    opacity: 1;
  }

  /* Stay still for ~5 seconds */
  70% {
    transform: translate(150px, -300px) scale(1) rotate(0deg);
    opacity: 1;
  }

  /* Curve out upward */
  90% {
    transform: translate(420px, -720px) scale(1.05) rotate(40deg);
  }

  /* Exit top */
  100% {
    transform: translate(520px, -120vh) scale(1.1) rotate(60deg);
    opacity: 0;
  }

}
.aeroplane img{
    z-index: 1;
    max-width: 200px !important;
  position: absolute;
  top: -20px !important;
  right: -900px;

  animation:
    planeFly 12s linear infinite,
    planeBounce 2s ease-in-out infinite;
}

/* Right → Left movement */
@keyframes planeFly {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-150vw);
  }
}

/* Slight vertical bounce */
@keyframes planeBounce {

  0% {
    margin-top: 0px;
  }

  50% {
    margin-top: -15px;
  }

  100% {
    margin-top: 0px;
  }

}


.jump-boy img{
    max-width: 290px !important;
}
.jump-girl img{
    max-width: 310px !important;
}
@media all and (max-width: 1700px){
  .about-copy{
      padding-top: 110px !important;
  }
  .about-bg{
      background-size: 30%;
      background-position: 10% 5%;
  }
}
@media all and (max-width: 1600px){
  .about-copy{
      padding-top: 80px !important;
  }
  .about-bg{
      background-size: 26%;
      background-position: 10% 5%;
  }
}
@media all and (max-width: 1500px){
  .about-copy{
      padding-top: 80px !important;
  }
  .about-bg{
      background-size: 26%;
      background-position: 7% 5%;
  }
}
@media all and (max-width: 1400px){
  .about-copy{
      padding-top: 260px !important;
  }
  .about-bg{
      background-image: url("images/about-img-2.jpg");
      background-size: 40%;
      background-position: 7% 5%;
  }
  .balloon img{
    max-width: 150px !important;
    left: 10%;
    bottom: -350px;
  }
  .rocket img{
    max-width: 100px !important;
    left: auto;
    right: 30%;
    bottom: -300px;
  }
  .aeroplane img{
    max-width: 150px !important;
    top: -20px !important;
    right: -100px;
  }
}
@media all and (max-width: 1200px){
  .balloon img{
    max-width: 120px !important;
    left: 10%;
    bottom: -350px;
  }
  .rocket img{
    max-width: 90px !important;
    left: auto;
    right: 30%;
    bottom: -300px;
  }
  .aeroplane img{
    max-width: 130px !important;
    top: -20px !important;
    right: -100px;
  }
}
@media all and (max-width: 980px){
  .balloon img{
    max-width: 120px !important;
    left: 15%;
    bottom: -350px;
  }
  .rocket img{
    max-width: 90px !important;
    left: auto;
    right: 30%;
    bottom: -300px;
  }
  .aeroplane img{
    max-width: 130px !important;
    top: -20px !important;
    right: -100px;
  }
}
@media all and (max-width: 1090px){
  .about-copy{
      padding-top: 220px !important;
  }
  .about-bg{
      background-size: 40%;
      background-position: 7% 5%;
  }
}
@media all and (max-width: 1080px){
  .jump-boy img{
    max-width: 280px !important;
  }
  .jump-girl img{
    max-width: 290px !important;
  }
  .jump-girl{
    right: -20px !important;
  }
  .height-a{
      min-height: 460px !important;
  }
  .copy-a h2{
      /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
      font-size: clamp(12px, 5cqw, 30px) !important;
  }
}

@media all and (max-width: 1024px){
  .main-menu a{
    height: 40px;
    align-items: flex-end !important;
  }
  .jump-boy img{
    max-width: 260px !important;
  }
  .jump-girl img{
    max-width: 260px !important;
  }
  .about-copy{
      padding-top: 180px !important;
  }
  .about-bg{
      background-size: 40%;
      background-position: 3% 5%;
  }
  .height-a{
      min-height: 440px !important;
  }
  .copy-a h2{
      /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
      font-size: clamp(12px, 5cqw, 26px) !important;
  }
}
@media all and (max-width: 980px){
  .jump-boy img{
    max-width: 240px !important;
  }
  .jump-girl img{
    max-width: 230px !important;
  }
  .height-a{
      min-height: 400px !important;
  }
}
@media all and (max-width: 930px){
  .jump-boy img{
    max-width: 210px !important;
  }
  .jump-girl img{
    max-width: 200px !important;
  }
  .copy-a h2{
      /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
      font-size: clamp(12px, 5cqw, 20px) !important;
  }
  .height-a{
      min-height: 360px !important;
  }
}
@media all and (max-width: 800px){
  .jump-boy img{
    max-width: 200px !important;
  }
  .jump-girl img{
    max-width: 200px !important;
  }
  .copy-a h2{
      /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
      font-size: clamp(12px, 5cqw, 20px) !important;
  }
  .height-a{
      min-height: 330px !important;
  }
}
@media all and (max-width: 767px){
    .onlydesktop{
        display: none !important;
    }
    .onlymobile{
        display: block !important;
    }
    .balloon img{
      max-width: 80px !important;
      left: 15%;
      bottom: -250px;
    }
    .rocket img{
      max-width: 60px !important;
      left: auto;
      right: 30%;
      bottom: -250px;
    }
    .aeroplane img{
      max-width: 100px !important;
      top: -20px !important;
      right: -100px;
    }
}
@media all and (max-width: 670px){
  .b-socials{
      max-width: 40px !important;
  }
  .main-mid-logo{
    max-width: 200px !important;
  }
  .about-copy{
      padding-top: 200px !important;
  }
  .about-bg{
      background-size: 60%;
      background-position: 3% 5%;
  }
  .balloon img{
    max-width: 80px !important;
    left: 15%;
    bottom: -300px;
  }
  .rocket img{
    max-width: 60px !important;
    left: auto;
    right: 30%;
    bottom: -300px;
  }
  .aeroplane img{
    max-width: 100px !important;
    top: 20px !important;
    right: -100px;
  }
}
@media all and (max-width: 500px){
  .about-copy{
      padding-top: 150px !important;
  }
  .about-bg{
      background-size: 60%;
      background-position: 3% 5%;
  }
  .b-socials{
      max-width: 30px !important;
  }
  .main-mid-logo{
      max-width: 170px !important;
      margin-top: 70px;
  }
  .balloon img{
    max-width: 80px !important;
    left: 15%;
    bottom: -300px;
  }
  .rocket img{
    max-width: 60px !important;
    left: auto;
    right: 40%;
    bottom: -300px;
  }
  .aeroplane img{
    max-width: 100px !important;
    top: 20px !important;
    right: -100px;
    animation:
    planeFly 6s linear infinite,
    planeBounce 2s ease-in-out infinite;
  }
}
@media all and (max-width: 420px){
  .subheader{
    min-height: 430px !important;
  }
  .jump-boy img{
    max-width: 200px !important;
  }
  .jump-girl img{
    max-width: 200px !important;
  }
  .copy-a h2{
      /* Minimum size 12px, fluid size 5cqw, maximum size 50px */
      font-size: clamp(12px, 5cqw, 16px) !important;
  }
  .height-a{
      min-height: 310px !important;
  }
  .balloon img{
    max-width: 60px !important;
    left: 15%;
    bottom: -200px;
  }
  .rocket img{
    max-width: 40px !important;
    left: auto;
    right: 50%;
    bottom: -200px;
  }
  .aeroplane img{
    max-width: 80px !important;
    top: 20px !important;
    right: -100px;
  }
}