/*
Theme Name: Perform You Biz Theme
Author: tamas illes
Description: theme of perform-you
Version: 1.0
*/

:root {
  --blackcolor: #000;
  --whitecolor: #fff;
  --goldcolor: #cc9918;
  --yellowcolor: #ffde59;
  --greycolor: #44443d;
  --greycolor_v2: #242b2c;
  --geometry-mask-image-v1: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20preserveAspectRatio%3D%22none%22%20viewBox%3D%220%200%20134.99%20134.99%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M21.92%2C134.29C9.31%2C137.36-.51%2C130.08%2C0%2C118.07L3.94%2C29.51c.53-12%2C9.48-22.47%2C19.94-23.3L101%2C.06c10.45-.83%2C20.28%2C6.45%2C21.9%2C16.23L134.8%2C88.36c1.62%2C9.78-7.32%2C20.23-19.93%2C23.3Z%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E);
  --geometry-mask-image-v2: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20preserveAspectRatio%3D%22none%22%20viewBox%3D%220%200%20140%20140%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M41.52%2C0S3.23-.77%2C2%2C43.69-5.24%2C119.05%2C12.23%2C127%2C50.51%2C140.55%2C87%2C140s47.28-6.19%2C50.11-26.94%2C5.29-47-1.59-68.45C124.75%2C10.79%2C85.56%2C8.39%2C68.16%2C3%2C64.06%2C1.73%2C58.63%2C0%2C41.52%2C0Z%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E);
  --border-radius: 20px;
  --screenpadding: 3rem 125px;

  --float-duration: 8s; /* Total animation time */
  --float-opacity-min: 0.3; /* Min opacity */
  --float-opacity-max: 0.7; /* Max opacity */
  --float-scale-from: 1; /* Starting scale */
  --float-scale-to: 2.3; /* Ending scale */
  --spawn-interval: 350; /* New word every X ms */
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0 !important;
  background: var(--whitecolor);
}

html *::marker,
body *::marker {
  content: "" !important;
}

.uppercase {
  text-transform: uppercase;
}

.textcenter {
  text-align: center;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Oswald;
  background-color: #fff;
  color: #333;
}

@font-face {
  font-family: Oswald;
  src: url(fonts/Oswald.ttf);
}

/*Burger Menu*/

.oarg_menu_rsp ul {
  padding: 0;
  margin: 0;
}

.oarg_menu-wrap {
  position: relative;
  top: 0;
  right: 0;
  z-index: 1;
  width: 100%;
}

.oarg_navbar_responsive {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

#oarg_menuburger {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.oarg_menu-wrap .toggler {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1001;
  cursor: pointer;
  width: 40px;
  height: 40px;
  opacity: 0;
}

.oarg_menu-wrap .oarg_hamburger {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Hamburger lines */
.oarg_menu-wrap .oarg_hamburger > div {
  position: relative;
  width: 30px;
  height: 2px;
  background-color: var(--whitecolor);
}

/* Top and bottom lines */
.oarg_menu-wrap .oarg_hamburger > div:before,
.oarg_menu-wrap .oarg_hamburger > div:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: inherit;
}

.oarg_menu-wrap .oarg_hamburger > div:before {
  top: -8px;
}

.oarg_menu-wrap .oarg_hamburger > div:after {
  top: 8px;
}

/* Toggler animate */
.oarg_menu-wrap .toggler:checked + #oarg_menuburger .oarg_hamburger > div {
  transform: rotate(135deg);
}

/* Turn Lines into X */
.oarg_menu-wrap
  .toggler:checked
  + #oarg_menuburger
  .oarg_hamburger
  > div:before,
.oarg_menu-wrap
  .toggler:checked
  + #oarg_menuburger
  .oarg_hamburger
  > div:after {
  top: 0;
  transform: rotate(90deg);
}

/* Rotate on hover when checked */
.oarg_menu-wrap
  .toggler:checked:hover
  + #oarg_menuburger
  .oarg_hamburger
  > div {
  transform: rotate(225deg);
  background-color: var(--blackcolor);
}

/* Show menu */
.oarg_menu-wrap .toggler:checked ~ .oarg_menu_rsp {
  visibility: visible;
}

.oarg_menu-wrap .toggler:checked ~ .oarg_menu_rsp > div {
  display: block;
  transform: scale(1);
}

.oarg_menu-wrap .toggler:checked ~ .oarg_menu_rsp > div > div {
  opacity: 1;
}

.oarg_menu-wrap .oarg_menu_rsp {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  overflow: hidden;
}

.oarg_menu-wrap .oarg_menu_rsp > div {
  background-color: var(--whitecolor);
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
}

.oarg_menu-wrap .oarg_menu_rsp > div > div {
  text-align: center;
  max-width: 100%;
  max-height: 100%;
  opacity: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.oarg_menu-wrap .oarg_menu_rsp > div > div > ul {
  padding: 0;
  width: 90%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: baseline;
  justify-content: center;
}

.oarg_menu-wrap .oarg_menu_rsp > div > div > ul > li {
  list-style: none;
  /* color: var(--navigation_color); */
  font-size: 1.5rem;
  padding: 1rem;
}

.oarg_menu-wrap .oarg_menu_rsp > div > div > ul > li > a {
  color: inherit;
  text-decoration: none;
}

.oarg_menu-wrap
  .toggler:checked
  ~ .oarg_navbar_responsive
  #oarg_navbar_logo
  span {
  color: var(--blackcolor) !important;
}

.oarg_menu-wrap
  .toggler:checked
  ~ .oarg_navbar_responsive
  .oarg_hamburger
  > div {
  background: var(--blackcolor) !important;
}

.oarg_menu-wrap .toggler:checked ~ .oarg_menu_rsp ul li a {
  color: var(--blackcolor) !important;
}

/*Cookie*/
div#cmplz-manage-consent,
div#cmplz-cookiebanner-container {
}

div#cmplz-manage-consent,
div#cmplz-cookiebanner-container * {
}

.oarg_menu-wrap .oarg_menu_rsp > div > div > ul > li {
  text-align: left;
}

/*CUSTOM CSS*/
/*----------------------------------------------------------------------------------------------*/

/*Effects*/

#performyou-header {
  position: relative;
  z-index: 1;
}

.performyou-floating-word-container {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  overflow: hidden;
}

.performyou-floating-word {
  position: absolute;
  font-size: 12px;
  opacity: 0;
  color: white;
  white-space: nowrap;
  animation: performyouFloatLoop var(--float-duration) ease-in-out forwards;
  transform: scale(var(--float-scale-from));
}

@keyframes performyouFloatLoop {
  0% {
    transform: scale(var(--float-scale-from));
    opacity: 0;
  }
  25% {
    transform: scale(var(--float-scale-to));
    opacity: var(--target-opacity, var(--float-opacity-max));
  }
  75% {
    transform: scale(var(--float-scale-to));
    opacity: var(--target-opacity, var(--float-opacity-max));
  }
  100% {
    transform: scale(var(--float-scale-from));
    opacity: 0;
  }
}

.perform_bold {
  font-weight: bold;
}

.perform_h2 {
  font-size: 32px;
}

.perform_h3 {
  font-size: 25px;
}

.perform_p {
  font-size: 20px;
}

.goldcolor {
  color: var(--goldcolor);
}

.goldbackgroundcolor {
  background: var(--goldcolor);
}

.greybackgroundcolor {
  background: var(--greycolor);
}

.greytwobackgroundcolor {
  background: var(--greycolor_v2);
}

.whitebackgroundcolor {
  background: white;
}

.greycolor {
  color: var(--greycolor);
}

.greytwocolor {
  color: var(--greycolor_v2);
}

.whitecolor {
  color: white;
}

.perform_centertext {
  text-align: center;
}

.perform_space_totitle {
  height: 0.5rem;
}

.perform_space_inbetween {
  height: 1.5rem;
}

/*Header*/
#performyou-header {
  display: flex;
  align-items: center;
  flex-direction: row;
  padding: var(--screenpadding);
  justify-content: space-between;
}

.performyou-header-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#performyou-header-logo a.performyou-a {
  width: 100%;
  height: 100%;
  display: flex;
  border-radius: var(--border-radius);
  transition: all 2s ease-in-out;
}

#performyou-header img.performyou-logo {
  height: 200px;
  box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
}

div#performyou-header-navigation a.performyou-btn {
  margin: 1rem 2rem 0 2rem;
  border: 2px solid white;
  padding: 10px;
  background: white;
  color: black;
  border-radius: var(--border-radius);
  font-weight: 400;
}

.performyou-btn {
  text-decoration: none !important;
  transition: box-shadow 0.4s ease, transform 0.3s ease;
}

a.performyou-btn:hover {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,
    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  transform: translateY(-1px);
}

.performyou-logo {
  border-radius: var(--border-radius) !important;
}

#performyou-header-logo a.performyou-a:hover {
  animation: tilt-shaking 1s linear infinite;
}

@keyframes tilt-shaking {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(1deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(-1deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

/*Sections*/
.perform_section-inner_bottom {
  clip-path: polygon(
    100% 100%,
    100% 197.2px,
    100% 0,
    99.95833333% 10.3px,
    99.83333333% 20.5px,
    99.625% 30.3px,
    99.34166667% 39.9px,
    98.99166667% 49px,
    98.56666667% 57.8px,
    98.08333333% 66px,
    97.54166667% 73.7px,
    96.95% 80.9px,
    96.3% 87.3px,
    95.60833333% 93.1px,
    94.88333333% 98.1px,
    94.10833333% 102.3px,
    93.30833333% 105.6px,
    92.475% 108px,
    91.61666667% 109.4px,
    8.38333333% 196.8px,
    7.525% 197.2px,
    6.69166667% 196.5px,
    5.89166667% 194.9px,
    5.125% 192.3px,
    4.39166667% 188.9px,
    3.7% 184.6px,
    3.05% 179.4px,
    2.45833333% 173.6px,
    1.91666667% 167px,
    1.43333333% 159.8px,
    1.00833333% 151.9px,
    0.65833333% 143.5px,
    0.375% 134.5px,
    0.16666667% 125.1px,
    0.04166667% 115.2px,
    0 105px,
    0 197.2px,
    0 100%
  );
  -webkit-clip-path: polygon(
    100% 100%,
    100% 197.2px,
    100% 0,
    99.95833333% 10.3px,
    99.83333333% 20.5px,
    99.625% 30.3px,
    99.34166667% 39.9px,
    98.99166667% 49px,
    98.56666667% 57.8px,
    98.08333333% 66px,
    97.54166667% 73.7px,
    96.95% 80.9px,
    96.3% 87.3px,
    95.60833333% 93.1px,
    94.88333333% 98.1px,
    94.10833333% 102.3px,
    93.30833333% 105.6px,
    92.475% 108px,
    91.61666667% 109.4px,
    8.38333333% 196.8px,
    7.525% 197.2px,
    6.69166667% 196.5px,
    5.89166667% 194.9px,
    5.125% 192.3px,
    4.39166667% 188.9px,
    3.7% 184.6px,
    3.05% 179.4px,
    2.45833333% 173.6px,
    1.91666667% 167px,
    1.43333333% 159.8px,
    1.00833333% 151.9px,
    0.65833333% 143.5px,
    0.375% 134.5px,
    0.16666667% 125.1px,
    0.04166667% 115.2px,
    0 105px,
    0 197.2px,
    0 100%
  );
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 300px;
}

.perform_section-inner_bottom_v2 {
  clip-path: polygon(
    0 100%,
    0 197.2px,
    0 0,
    0.04166667% 10.3px,
    0.16666667% 20.5px,
    0.375% 30.3px,
    0.65833333% 39.9px,
    1.00833333% 49px,
    1.43333333% 57.8px,
    1.91666667% 66px,
    2.45833333% 73.7px,
    3.05% 80.9px,
    3.7% 87.3px,
    4.39166667% 93.1px,
    5.125% 98.1px,
    5.89166667% 102.3px,
    6.69166667% 105.6px,
    7.525% 108px,
    8.38333333% 109.4px,
    91.61666667% 196.8px,
    92.475% 197.2px,
    93.30833333% 196.5px,
    94.10833333% 194.9px,
    94.88333333% 192.3px,
    95.60833333% 188.9px,
    96.3% 184.6px,
    96.95% 179.4px,
    97.54166667% 173.6px,
    98.08333333% 167px,
    98.56666667% 159.8px,
    98.99166667% 151.9px,
    99.34166667% 143.5px,
    99.625% 134.5px,
    99.83333333% 125.1px,
    99.95833333% 115.2px,
    100% 105px,
    100% 197.2px,
    100% 100%
  );
  -webkit-clip-path: polygon(
    0 100%,
    0 197.2px,
    0 0,
    0.04166667% 10.3px,
    0.16666667% 20.5px,
    0.375% 30.3px,
    0.65833333% 39.9px,
    1.00833333% 49px,
    1.43333333% 57.8px,
    1.91666667% 66px,
    2.45833333% 73.7px,
    3.05% 80.9px,
    3.7% 87.3px,
    4.39166667% 93.1px,
    5.125% 98.1px,
    5.89166667% 102.3px,
    6.69166667% 105.6px,
    7.525% 108px,
    8.38333333% 109.4px,
    91.61666667% 196.8px,
    92.475% 197.2px,
    93.30833333% 196.5px,
    94.10833333% 194.9px,
    94.88333333% 192.3px,
    95.60833333% 188.9px,
    96.3% 184.6px,
    96.95% 179.4px,
    97.54166667% 173.6px,
    98.08333333% 167px,
    98.56666667% 159.8px,
    98.99166667% 151.9px,
    99.34166667% 143.5px,
    99.625% 134.5px,
    99.83333333% 125.1px,
    99.95833333% 115.2px,
    100% 105px,
    100% 197.2px,
    100% 100%
  );
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 300px;
}

.perform_section-inner_top {
  clip-path: polygon(
    100% 100%,
    100% 200px,
    100% 197.18px,
    99.95666667% 186.85px,
    99.83% 176.73px,
    99.62333333% 166.86px,
    99.34083333% 157.32px,
    98.98833333% 148.16px,
    98.56833333% 139.42px,
    98.085% 131.17px,
    97.54416667% 123.46px,
    96.94833333% 116.34px,
    96.30333333% 109.87px,
    95.61166667% 104.1px,
    94.87916667% 99.09px,
    94.10833333% 94.9px,
    93.305% 91.58px,
    92.4725% 89.18px,
    91.615% 87.76px,
    8.385% 0.38px,
    7.5275% 0,
    6.695% 0.65px,
    5.89166667% 2.29px,
    5.12083333% 4.86px,
    4.38833333% 8.33px,
    3.69666667% 12.64px,
    3.05166667% 17.76px,
    2.45583333% 23.63px,
    1.915% 30.2px,
    1.43166667% 37.44px,
    1.01166667% 45.3px,
    0.65916667% 53.72px,
    0.37666667% 62.67px,
    0.17% 72.1px,
    0.04333333% 81.95px,
    0 92.2px,
    0 200px,
    0 100%
  );
  -webkit-clip-path: polygon(
    100% 100%,
    100% 200px,
    100% 197.18px,
    99.95666667% 186.85px,
    99.83% 176.73px,
    99.62333333% 166.86px,
    99.34083333% 157.32px,
    98.98833333% 148.16px,
    98.56833333% 139.42px,
    98.085% 131.17px,
    97.54416667% 123.46px,
    96.94833333% 116.34px,
    96.30333333% 109.87px,
    95.61166667% 104.1px,
    94.87916667% 99.09px,
    94.10833333% 94.9px,
    93.305% 91.58px,
    92.4725% 89.18px,
    91.615% 87.76px,
    8.385% 0.38px,
    7.5275% 0,
    6.695% 0.65px,
    5.89166667% 2.29px,
    5.12083333% 4.86px,
    4.38833333% 8.33px,
    3.69666667% 12.64px,
    3.05166667% 17.76px,
    2.45583333% 23.63px,
    1.915% 30.2px,
    1.43166667% 37.44px,
    1.01166667% 45.3px,
    0.65916667% 53.72px,
    0.37666667% 62.67px,
    0.17% 72.1px,
    0.04333333% 81.95px,
    0 92.2px,
    0 200px,
    0 100%
  );
  left: 0;
  top: 0;
  width: 100%;
  height: 200px;
}

/*Footer*/
.performyou-footer-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3rem;
}

ul.performyou-footer-nav-ul {
  display: flex;
  justify-content: space-between;
  gap: 3rem;
}

.performyou-footer-nav-ul li::marker {
  content: none;
}
.performyou-footer-container img.performyou-logo {
  width: 200px;
}