@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap'); 
:root{
 
  --white:white;
  --bg-1:rgba(90, 22, 79, 0.951);
  --bg-2:#b19860;
  --bg-3:#46331e;
  --bg-4:#1e462e;
  --bg-5:#252c3d;
  --green:#053009;
  --overlay-1:rgba(255, 165, 0, 0.5);
--overlay-2:rgba(255, 165, 0, 0.7);
--overlay-3:rgba(94, 255, 0, 0.5);
--overlay-4:rgba(94, 255, 0, 0.7);
--overlay-5:rgba(0, 255, 179, 0.5);
--black: #000;
--btn-1:rgba(90, 22, 79, 0.951);
--btn-2:#e4a00f;
--btn-3:#b8670a;
--btn-4:#237c46;
--btn-5:#2b3d6b;
--btnhov-1:rgba(231, 21, 196, 0.951);
--btnhov-2:#e4640f;
--btnhov-3:#daee27;
--btnhov-4:#1dd466;
--btnhov-5:#042069;

--yellow:rgb(255 213 28);
--light-yellow: rgb(255 209 98 / 60%);
--gray:  rgb(167 167 167 / 30%);
--duration: 0.3s;


--primary-color:#ACA22E;

}
.swiper-button-next, .swiper-button-prev {
  display: none;
}
.rnd-games{
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.main-page__box li{
  color: #fff;
}

body{
  direction: ltr;
  font-family: 'https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap', sans-serif !important;
  font-size: 16px;
  margin: 0;
  padding: 0px;
  overflow-x: hidden;
}
ul,li{
  padding: 0px;
  margin: 0px;
  list-style: none;
}
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}
ol,
ul,
li {
}
body {
	line-height: 1;
	height: 100%;
	margin: 0;
}
main {
	display: block;
}
h1 {
	font-size: 2em;
	margin: 0.67em 0;
  color: white;
}
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}
a {
	text-decoration: none;
	background-color: transparent;
}
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}
b,
strong {
	font-weight: bolder;
}
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}
small {
	font-size: 80%;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
img {
	border-style: none;
}
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}
button,
input {
	overflow: visible;
}
button,
select {
	text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}
fieldset {
	padding: 0.35em 0.75em 0.625em;
}
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}
progress {
	vertical-align: baseline;
}
textarea {
	overflow: auto;
}
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}
details {
	display: block;
}
summary {
	display: list-item;
}
template {
	display: none;
}
[hidden] {
	display: none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

blockquote,
q {
	quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a{text-decoration: none;
  color: white!important}
  
  img{
    width: 100%;
    display: block;
  }
  .container{
    position: relative;
    z-index: 1;
  }
  
  
  .section{
    padding: 36px 0px;
  }
  .title{
    color: var(--white);
    position: relative;
    font-size:42px;
    font-weight: 700;
    letter-spacing: 1px;
    margin: 0 auto;
    margin-bottom: 20px;
    text-align:  center;
  
}


@media (max-width:767px) {
  .title-border{
    display: none;
  }
}
@media (max-width:575px) {
  .title{
    
    font-size: 27px;
    
    
  }
}
.header{
  position: absolute;
  background-color: transparent;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 10;
}
.header-logo{
  padding: 19px 0px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
@media (max-width:1199px) {
  .header-logo{
    display: none;
  }
  
}
.logo-mobile{
  
  width: 62px;
  height: 62px;
}
@media (min-width:1199px) {
  .logo-mobile{
    display:none;
    
  }
}
.menu{
  display: none;
}
.logo{
  width: 96px;
  height: 96px;
  object-fit: contain;
}
.logo-title{
  font-size: 36px;
}
.nav-table{
  font-size:  20px;
  display: flex;
  gap: 47px;
  justify-content: center;
}
@media (max-width:1199px) {
  .nav-table{
    display: none;
  }
}
.menu-btn {
  width:  27px;
  height:  27px;
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.bg-menu{
  background: var(--bg-3);
}
    
    @media (min-width: 1200px) {
      .menu-btn{  display: none; }
      
    }
    @media (min-width:1200px) {
      .knopkavmenu{
        display: none;
      }
    }
    .msenu-box-modbile {
      margin-top: 42px;
      display: flex;
      flex-direction: column;
      
    }
    
    
    .msenu-box-modbile li {
      border-bottom: 1px solid var(--overlay-3);
      width: 100%;
      padding: 12px;
      display: inline-block;
      color: var(--white );
      
    }
    .mesanu-itedm_lianks{
      transition: all 0.3s;
    }
    .mesanu-itedm_lianks:hover{
      color: var(--btnhov-3)!important;
    }
    .span-btn {
      width: 30px;
      height: 2px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background-color:   white;
      transition: all 0.5s;
    }
    
    .span_btn_colored {
      width: 30px;
      height: 2px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      
      transition: all 0.5s;
      background-color:   white;
    }
    
    .menu-btn span:nth-of-type(2) {
      top: calc(50% - 5px);
    }
    
    .menu-btn span:nth-of-type(3) {
      top: calc(50% + 5px);
    }
    
    
    .menu-btn.active span:nth-of-type(1) {
      display: none;
    }
    
    .menu-btn.active span:nth-of-type(2) {
      top: 50%;
      background-color:   white;
      transform: translate(-50%, 0%) rotate(45deg);
    }
    
    .menu-btn.active span:nth-of-type(3) {
      top: 50%;
      background-color:   white;
      transform: translate(-50%, 0%) rotate(-45deg);
    }
    .menu.active {
      display: flex;
      
    }
    .mobile-menu{
      padding: 10px 0px;
      display: flex;
      justify-content: space-between  ;
    }
  
    
    .section-heroqq{
      position: relative;
      background-image: url(visualtreasure/bg-assets/bg-light-068462b46d176d.jpg ); 
      background-size: cover; 
      background-position: center; 
      height: auto;
      display: flex;
      justify-content: center;
      
      text-align: center;
      color: #fff;
      align-items: flex-end;
    }
.section-heroqq::before {
  content: ''; 
  position: absolute; 
  top: 0; 
  left: 0;
  width: 100%;
  height: 100%; 
  background: var(--overlay-3);
  
  z-index: 1; 
}

.hero-content {
  position: relative; 
  z-index: 2;
  gap: 16px;
  display: flex;
  margin: 0px -10px;
  padding-top: 300px;
  padding-bottom: 170px;
  align-items: center;
  justify-content: center;
}
@media (max-width:990px) {
  .hero-content{
    flex-direction: column;
    gap: 16px;
    
  }
}
@media (max-width:1199px) {
  .hero-content{
    padding-top: 100px;
  }
}
.hero-box{
width: 100%;
padding: 0px 13px;
}
.hero-box1{
  padding: 0px 13px;
  width: 80%;
}
@media (min-width:991px) {
  .hero-box{
    width: 50%;
    
  }
  .hero-box1{
    width: 50%;}
}


.swiper-container {
  
  width: 95%;
  height: 420px;
}
.swiper-slide{
  position: relative;
}
.slider-content-absl{
  padding:25px;
  position: absolute;
  
  bottom: 0;
  left: 0;
  right:0;
}
.swiper-slide img {
  
  object-fit: cover;
  height: 420px;
  border-radius: 40px;
  
}

.swiper-slide::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 40px;
}

.swiper-rtl .swiper-button-prev{
  color: #55184B;
}
.swiper-rtl .swiper-button-next{
  color: #55184B;
}


.section-game1{
  background-color: var(--bg-3);
}

.section-game2{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-image: url(visualtreasure/bg-assets/bg-light-068462b46d176d.jpg);
}
.section-game2::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--overlay-3);
  
  z-index: 1;}
  .pansael23sindex{
    position: relative;
    z-index: 3;
  }
  .pent-txt{
    padding: 0px 30px;
    z-index: 12;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 125px;
  }
  .pen-btns {
    padding: 0px 30px;
    z-index: 12;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 300px;
  }
  .pansael23s {
      margin: -13px -13px;
      display: flex;
       flex-wrap: wrap;
      }
      .pansael23 {
        padding: 13px 13px;
        
        height: 420px;
        animation: scale-in-ver-center var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
        opacity: 0;
        position: relative;
      }
      @media (max-width:767px) {
        .pansael23{
          width: 100%;
        }
}
 .pansael23 a {
	 font-size: 17px;
	 left: 0;
	 margin: 0 auto;
	 position: absolute;
	 right: 0;
	 top: 0;
  }
  
  .pansael23img {
    object-fit: cover;
    filter: brightness(0.33);
    height: 420px;
    padding: 13px;
  }
  .pansael23 span {
    font-size: 20px;
    align-items: center;
    display: flex;
    flex-flow: row wrap;
    height: fit-content;
    justify-content: space-evenly;
    opacity: 0;
    padding: 20px 5px ;
    position: relative;
    width: 100%;
    z-index:30;
    text-align: center;
  }
  .pansael23 span::before {
    background-color: var(--gray);
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scaleY(0);
    transform-origin: bottom left;
    transition: transform var(--duration) ease-in-out;
    z-index: -1;
  }
  .pansael23:nth-of-type(1) span {
    animation: slide-in-top var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .pansael23:nth-of-type(2) span {
    animation: slide-in-top var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .pansael23:nth-of-type(3) span {
    animation: slide-in-left var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .pansael23:nth-of-type(4) span {
	 animation: slide-in-right var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}
.pansael23:nth-of-type(5) span {
  animation: slide-in-right var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}
.pansael23:nth-of-type(6) span {
  animation: slide-in-right var(--duration) cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}
.pansael23:hover {
  box-shadow: rgba(255, 209, 98, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}
.pansael23:hover span {
  color: var(--btnhov-3);
}
.pansael23:hover  .pent-txt{
  color: var(--btnhov-3);
}
.pansael23:hover  .pen-btns{
  color: var(--btnhov-3);
}
.pansael23:hover span::before {
	 transform: scaleX(1);
	 transform-origin: bottom center;
  }
  .pansael23:hover .fill {
	 fill: var(--btnhov-3);
  }
  .pansael23:hover img {
    filter: brightness(1);
  }
  .pansael23 svg {
    width: calc(var(--logo-dimensions) / 6);
  }
  

  
  @keyframes scale-in-ver-center {
    0% {
      transform: scaleY(0);
      opacity: 1;
    }
    100% {
      transform: scaleY(1);
      opacity: 1;
    }
  }
  @keyframes scale-in-hor-center {
    0% {
      transform: scaleX(0);
      opacity: 1;
    }
    100% {
      transform: scaleX(1);
      opacity: 1;
    }
  }
  @keyframes slit-out-vertical {
    0% {
      transform: translateZ(0) rotateY(0);
      opacity: 1;
    }
    54% {
      transform: translateZ(-160px) rotateY(87deg);
      opacity: 1;
    }
    100% {
      transform: translateZ(-800px) rotateY(90deg);
      opacity: 0;
    }
  }
  @keyframes bounce-in-fwd {
    0% {
      transform: scale(0);
		 animation-timing-function: ease-in;
		 opacity: 0;
    }
    38% {
      transform: scale(1);
      animation-timing-function: ease-out;
      opacity: 1;
    }
    55% {
      transform: scale(0.7);
      animation-timing-function: ease-in;
    }
    72% {
      transform: scale(1);
      animation-timing-function: ease-out;
    }
    81% {
      transform: scale(0.84);
      animation-timing-function: ease-in;
    }
    89% {
      transform: scale(1);
      animation-timing-function: ease-out;
    }
    95% {
      transform: scale(0.95);
      animation-timing-function: ease-in;
    }
    100% {
      opacity: 1;
      transform: scale(1);
      animation-timing-function: ease-out;
    }
  }
  @keyframes slide-in-top {
    0% {
      transform: translateY(-100rem);
      opacity: 0;
    }
    100% {
      transform: translateY(0);
      opacity: 1;
    }
  }
 @keyframes scale-out-hor-left {
	 0% {
     transform: scaleX(1);
		 transform-origin: 0 0;
		 opacity: 1;
    }
    100% {
      transform: scaleX(0);
      transform-origin: 0 0;
      opacity: 1;
    }
  }
 @keyframes slide-in-left {
	 0% {
     transform: translateX(-1000px);
		 opacity: 0;
    }
    100% {
      transform: translateX(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-right {
	 0% {
     transform: translateX(1000px);
		 opacity: 0;
    }
    100% {
      transform: translateX(0);
      opacity: 1;
    }
  }
  @media (prefers-reduced-motion: reduce) {
	 * {
     transition: none;
		 animation: none;
    }
  }


  .section-benefic{
    position: relative;
    background-image: url(theme/img/bg-benef.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.section-benefic::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--overlay-3);
  z-index: 1;}
  
  .banner__feature__wrapper {
    padding: 19px 0px;
    position: relative;
    z-index: 3;
  }
  .banner__feature__items {
    box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    background-color: var(--bg-3);
    padding: 16px 16px;
    gap: 16px;
    display:flex;
    align-items: center;
    justify-content: center;
  }
  .banner__feature__items .thumb {
    background: linear-gradient(168.62deg, #715fa5 2.08%, rgba(226, 107, 206, 0.44) 96.46%);
    border-radius: 12px;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s;
  }
  .banner__feature__items .thumb img {
    width: 59px;
    height: 59px;
    object-fit: contain;
    transition: all 0.5s;
  }
  .banner__feature__items .content {
    width: calc(100% - 120px);
  }
  .banner__feature__items .content h5 {
    color: var(--white);
    margin-bottom: 13px;
    transition: all 0.5s;
  }
  .banner__feature__items .content p {
    color: var(--white);
  }
  .banner__feature__items:hover .thumb {
    transform: rotate(90deg);
  }
  .banner__feature__items:hover .thumb img {
    transform: rotate(-90deg);
  }
  .banner__feature__items:hover .content h5 {
    color: var(--bg-2);
  }

  .section-about{
    background-color: var(--bg-3);
background: linear-gradient(171deg, var(--bg-3) 50%, var(--btn-3) 50%);
}
.about-thumb{
  position: relative;
  margin: 0px -10px;
  display: flex;
}
@media (max-width:990px) {
  .about-thumb{
    align-items: center;
    flex-direction: column!important;
  }
}

.about-box{
  text-align: center;
  
  padding: 0px 13px;
}
@media (min-width:991px) {
  .about-box{
    width: 50%;
  }
}
.about-box p {
  color: var(--white);
  font-weight: 700;
}
.about-video{
  width: 100%;
  height: 100%;
  border-radius: 40%;
}

.games__item {
  position: relative;
  width: 100%;
  border-radius: 16px;
}
.games__item img {
  
  height:314px;
  border-radius: 16px;
}
 .games__item .game__overlays {
   width: 100%;
	 height: 100%;
	 position: absolute;
	 display: flex;
	 align-items: flex-end;
	 justify-content: center;
	 inset: 0 0 -100% 0;
	 border: 1px solid var(--bg-2);
	 border-radius: 16px;
	 background: linear-gradient(180deg, rgba(53, 8, 43, 0) 0%, #35082b 88.22%);
	 opacity: 0;
	 transition: all 0.5s;
  }
  .games__item .game__overlays .content {
    text-align: center;
    display: flex;
    gap: 13px;
    padding: 0 0 36px;
    text-align: center;
    flex-direction: column;
  }
  .games__item .game__overlays .content h4 {
    color: var(--white);
  }
  .games__item .game__overlays .content h6 {
    color: var(--bg-2);
    margin-bottom: 20px;
  }
  .games__item:hover .game__overlays {
    inset: 0 0 -100% 0;
    opacity: 1;
  }
  @media (max-width:767px) {
    .games__item .game__overlays {
      inset: 0 0 -100% 0;
      opacity: 1;
    }
  }
 
  .section-disclaimer{
    background: var(--bg-3);
  }
  .disclaimer-thumb{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
  }
  
  
  .diassclaimer-box {
    background-color: #ACA22Eb0;
    padding: 13px 5px;
    border: 1px solid;
    border-radius: 12px;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    animation: glow 3s infinite alternate;
  }
  @media (max-width:767px) {
    .diassclaimer-box {
      font-size: 20px;
    }
  }
  
  @keyframes glow {
    0% { text-shadow: 0 0 5px rgb(234, 133, 133); }
    50% { text-shadow: 0 0 20px #ff00ff; }
    100% { text-shadow: 0 0 5px rgb(234, 133, 133);; }
  }
  
  .section-form{
  position: relative;
     background: var(--bg-3);
    }
    
    
    .formsbox{
      padding: 0px 13px;
      flex-direction: column;
      align-content: center;
    }
    .formsbox label{
      color: var(--white);
    }
    .checkbox-box{display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-content: center;
  align-items: center;}
  .checkbox-box1{
    gap: 13px;
    display: flex;
    align-items: center;
  }
  .main_form .input-field__panel__item::placeholder {
    color: var(--white);
    opacity: 1;
  }
  .main_form .input-field__panel__item{
    
    padding: 0px 13px;
    margin-bottom: 16px;
    width: 100%;
    height: 45px;
    background:var(--overlay-3);
    color:var(--white);
    font-size: 16px;
    font-weight: normal;
    border: none;
    border-radius:  40px;
    
  }
  .main_form .textarea-field__panel__item {
    
    padding: 0px 13px;
    margin-bottom: 16px;
    padding-top: 21px;
    width: 100%;
    height: 80px;
    background:var(--overlay-3);
    color:var(--white);
    font-size: 16px;
    font-weight: normal;
    border: none;
    border-radius:  40px;
    
  }
  .main_form .textarea-field__panel__item::placeholder {
    color: var(--white);
    opacity: 1;
  }
  
  .confcolor{
    color: var(--white);
  }

  .footer-thumsasab{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  @media (max-width:767px) {
    .footer-thumsasab{
flex-direction: column;
align-items: center;
}
}
.main-privacy__img{
  display: flex;
  justify-content: center;
}
.footer-07sa {
  position: relative;
  background-color: var(--bg-3);
}

.footer-07sa .footer-heading {
  font-size: 27px;
  color: #fff;
  font-weight:700;
  margin-bottom: 27px;
 }
  .footer-07sa .footer-heading .logo {
    color: #fff; }
    .footer-07sa .footer-menu {
      margin-bottom: 27px; }
      .footer-menu{
        display: flex;
        
      }
      
      
      @media (max-width:575px) {
        .footer-menu{
          font-size: 13px;
          
        }
      }
          @media (max-width:991px) {
            .footer-menu{
              align-items: center;
              flex-direction: column;
              gap: 16px;
              
            }
          }
          .footer-07sa .footer-menu a {
            color: var(--white);
            margin: 0 10px;
            text-transform: uppercase;
            letter-spacing: 1px;
           transition: all 0.3s; }
           .footer-07sa .footer-menu a:hover{
                color: var(--overlay-3)!important;
              }
              
            .copyright{
              color: var(--white);
            }
            
            .section-contact{
      display: flex;
      background: linear-gradient(171deg, var(--bg-3) 50%, var(--btn-3) 50%);

    }
    
    .contacts-thumb{
      display: flex;
}
.contacts-ul{
  display: flex;
  gap: 16px;
}
.contacts-ul a {
  display: flex;
  gap: 13px;
}
@media (max-width:767px) {
  .contacts-ul{
    align-items: center;
    flex-direction: column;
  }
}
.contacts-box{
  gap: 16px;
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 10px 19px;
}
.contacts-thumb-phone{
  display: flex;
  gap: 16px;
}
@media (max-width:990px) {
  .contacts-thumb-phone{
    width: 100%;
  }
}
.contacts-box-phone{
  display: flex;
  
  gap: 70px;
  
}
@media (max-width:990px) {
  .contacts-box-phone{
    flex-direction: column;
    gap: 16px;
    width: 100%;
    
  }
}
.contacts-box-phone li{
  padding: 13px;
  background-color: var(--primary-color);
  clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
}
.contacts-box-phone a{
  
  font-size: 20px;
  justify-content: center;
  display: flex;
  gap: 5px;
  color: var(--white);
}
@media (max-width:575px) {
  .contacts-box-phone a{
    font-size: 16px;
    
  }
}
@media (max-width:990px) {
  .contact-box-adres{
    width: 100%;
  }
}
.contact-box-adres a{
  padding: 13px;
  background-color: var(--primary-color);
  clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
  font-size: 20px;
  display: flex;
  gap: 5px;
  color: var(--white);
  justify-content: center;
}
@media (max-width:575px) {
  .contact-box-adres a{
    font-size: 16px;
    
  }
}
@media (max-width:990px) {
  .contact-box-adres a{
    width: 100%;
    
  }
}
.width-form{
  width: 100%;
}

.checkbox-box{   
  gap: 16px;
  margin-top:  16px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-content: center;
  align-items: center;}
  .checkbox-box1{
    display: flex;}
    .confcolor{
      color:  var(--white);
    }
    .confcolor:hover{
      color:  var(--bright-color);
    }
    .check-color{
      color: var(--white);
    }
    
    
    .login-box {
      padding: 32px;
      box-sizing: border-box;
    border-radius: 12px;
  }
  
  .login-box h2 {
    margin: 0 0 30px;
    padding: 0;
    color: #fff;
    text-align: center;
  }
  
  .login-box .user-box {
    position: relative;
  }
  
  .login-box .user-box input {
    padding: 0px 13px;
    
    width: 100%;
    height: 45px;
    background:var(--overlay-3);
    color:var(--white);
    font-size: 16px;
    font-weight: normal;
    border: none;
    border-radius:  40px;
    
  }
  .login-box .user-box input:focus-visible{
    outline: 0;
    outline-offset: 0;
  }
  @media (max-width:500px) {
    .user-box label{
      font-size: 14px;
    }
    
  }

  .login-box .user-box label {
    
    padding: 13px 0;
    font-size: 17px;
    color: var(--white);
    pointer-events: none;
    transition: .5s;
  }
  
  .login-box .user-box input:focus ~ label,
  .login-box .user-box input:valid ~ label {
    top: -20px;
    left: 0;
    color: var(--bright-color);
    font-size: 14px;
  }
  
  .formawidth{
    display: flex;
    gap: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    
  }
  @media (max-width: 767px){
    .formawidth{
      flex-direction: column;
    }
  }
  .width100{flex: 1;
    max-width: 100%;}
    
    
    .form-img{
      width: 150px;
    }
    
    .form-img1{
      transform: scaleX(-1);
      width: 150px;
    }
    
    .section-page-main{
      background: linear-gradient(171deg, var(--bg-3) 50%, var(--btn-3) 50%);
      
    }
    .main-page__box h2{
      color: var(--white);
    }
    .main-page__box p{
      color: var(--white);
    }
    .main-frame{
      display: flex;
      height: 582px;
    }
    .main-frame iframe{
      width: 100%;
    }
    .main-page__img{
      box-shadow: 5px 16px 86px rgb(255 4 4 / 20%);
      border-radius: 40px;
      margin: 10px auto;
      
      
    }
    @media (min-width:768px) {
      .main-page__img{
        
        width: 500px;
        
      }
    }
    
    @media (min-width:575px) {
      .float-start{
        margin: 13px 25px;
      }
      .float-end{
        margin: 13px 25px;
      }
  } */

  .qq{
   position: relative;
   background-image: url(theme/img/bg-benef.jpg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
  }
.qq::before{
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%; 
    background: var(--overlay-3);
    
    z-index: 1; 
  }
  .section-page-about{
    position: relative;
    background-image: url(theme/img/bg-benef.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .section-page-about::before{
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%; 
    background: var(--overlay-3);
    
    z-index: 1; 
  }
  .accordion-item {
    padding: 5px 13px!important;
  }
  .accordion .accordion-item {
    border-bottom: 1px solid #e5e5e5;
    padding: 5px 13px!important;
    background: var(--btn-3);
  }
  .accordion .accordion-item button[aria-expanded='true'] {
	 border-bottom: 1px solid var(--btn-3);
  }
  .accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding: 1em 0;
    color:white;
    font-size: 1.15rem;
	 font-weight: 600;
	 border: none;
	 background: none;
	 outline: none;
  }
 .accordion button:hover, .accordion button:focus {
	 cursor: pointer;
	 color: var(--btn-3);
}
.accordion button:hover::after, .accordion button:focus::after {
  cursor: pointer;
  color: var(--btn-3);
  border: 1px solid var(--btn-3);
}
.accordion button .accordion-title {
  padding: 1em 1.5em 1em 0;
  color: white;
  font-size: 19px;
}
.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 0;
  width: 22px;
  height: 22px;
  border: 1px solid;
  border-radius: 22px;
  background-color: black;
}
.accordion button .icon::before {
  display: block;
  position: absolute;
  content: '';
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: var(--btn-3);
}
.accordion button .icon::after {
  display: block;
  position: absolute;
  content: '';
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: var(--btn-3);
}
.accordion button[aria-expanded='true'] {
  color: var(--btn-3);
}
.accordion button[aria-expanded='true'] .icon::after {
  width: 0;
}
.accordion button[aria-expanded='true'] + .accordion-content {
  opacity: 1;
  max-height: 9em;
  transition: all 200ms linear;
  will-change: opacity, max-height;
  border-top: solid 1px white;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content p {
  font-size: 16px;
  font-weight: 600;
  margin: 2em 0;
  color: red;
}


.block1 {
  display: block;
}

.block2 {
  display: none; }  
  .section-privacy-page{
    background-color: var(--bg-3);
  }
  .contsaent-blocdak{
    color: var(--white);
    padding: 0px 30px;
  }
  @media (max-width:575px) {
    .contsaent-blocdak{
      
      padding: 0px 48px;
    }
  }
  .contsaent-blocdak li {
    list-style: disc;
  }
  .contsaent-blocdak p{
    color: var(--white);
  }
.custom-btn {
  color: #fff;
	border-radius: 5px;
	background: transparent;
	transition: all 0.3s ease;
	position: relative;
	display: inline-block;
	outline: none;
	transition: all 0.3s;
}
.button-1 {
  display: inline-block;
	padding: 0.5em 1em;
	font-size: 1.06em;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	background: var(--btn-3);
	border: none;
	border-radius: 0.25em;
	box-shadow: 0 0.15em 0.3em rgba(0, 0, 0, 0.3);
	transform: perspective(1em) rotateX(-1deg) rotateY(1deg);
	transition: all 0.3s ease-in-out;
}

.button-1:hover {
  transform: perspective(1em) rotateX(-3deg) rotateY(3deg) translateY(-0.05em);
	background: var(--btnhov-3);
	box-shadow: 0 0.3em 0.6em rgba(0, 0, 0, 0.3);
}

.button-1:focus,
.button-1:active {
  transform: perspective(1em) rotateX(-3deg) rotateY(3deg) translateY(-0.05em);
	background: var(--btnhov-3);
	box-shadow: 0 0.3em 0.6em rgba(0, 0, 0, 0.3);
	outline: none;
}

.button-2 {
  cursor: pointer;
  
	padding: 14px 26px;
	margin: 1em;
	position: relative;
	min-width: 12em;
	background: var(--btn-3);
	font-size:14px;
	font-weight: 700;
	color: var(--white);
	text-align: center;
	text-transform: uppercase;
	font-family: sans-serif;
	letter-spacing: 0.1em;
	border: 3px solid var(--bg);
	border-radius: 9px;
	overflow: hidden;
	z-index: 1;
	transition: 0.5s;
}

.button-2 span {
  position: absolute;
	width: 25%;
	height: 100%;
	background: var(--bg);
	transform: translateY(150%);
	border-radius: 50%;
	left: calc((var(--n) - 1) * 25%);
	transition: 0.5s;
	transition-delay: calc((var(--n) - 1) * 0.1s);
	z-index: -1;
}

.button-2:hover {
  color: var(--white);
	background: var(--btnhov-3);
}

.button-2:hover span {
  transform: translateY(0) scale(2);
}

.button-2 span:nth-child(1) {
  --n: 1;
}

.button-2 span:nth-child(2) {
  --n: 2;
}

.button-2 span:nth-child(3) {
  --n: 3;
}

.button-2 span:nth-child(4) {
  --n: 4;
}


.button-3 {
  border: none;
  color: #fff;
  background-image: linear-gradient(30deg,var(--btn-3), var(--overlay-3));
  border-radius: 16px;
  background-size: 100% auto;
  font-family: inherit;
  font-size: 16px;
  padding: 0.6em 1.5em;
}

.button-3:hover {
  background-position: right center;
  background-size: 200% auto;
  -webkit-animation: pulse 3s infinite;
  animation: pulse512 1.5s infinite;
}

@keyframes pulse512 {
  0% {
    box-shadow: 0 0 0 0 var(--btnhov-3);
  }
  
  70% {
    box-shadow: 0 0 0 10px rgb(218 103 68 / 0%);
  }
  
  100% {
    box-shadow: 0 0 0 0 rgb(218 103 68 / 0%);
  }
}



.button-4 {
  --border-color: linear-gradient(-45deg, #ffae00, #d49037, #334405);
	--border-width: 0.125em;
	--curve-size: 0.5em;
	--blur: 30px;
	--bg: var(--btn-3);
	--color: #afffff;
	color: var(--color);
	position: relative;
	isolation: isolate;
	display: inline-grid;
	place-content: center;
	padding: 0.5em 1.5em;
	font-size: 16px;
	border: 0;
	text-transform: uppercase;
	box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.6);
	clip-path: polygon(
 0% var(--curve-size),
		var(--curve-size) 0,
	100% 0,
		100% calc(100% - var(--curve-size)),
		calc(100% - var(--curve-size)) 100%,
 0 100%
    );
    transition: color 250ms;
  }
  
  .button-4::after,
  .button-4::before {
    content: "";
    position: absolute;
    inset: 0;
  }
  
  .button-4::before {
    background: var(--btnhov-3);
    background-size: 300% 300%;
    animation: move-bg7234 5s ease infinite;
    z-index: -2;
  }
  
  @keyframes move-bg7234 {
    0% {
      background-position: 31% 0%;
    }
    
    50% {
      background-position: 70% 100%;
    }
    
    100% {
      background-position: 31% 0%;
    }
  }
  
  .button-4::after {
    background: var(--bg);
    z-index: -1;
    clip-path: polygon(
    var(--border-width)
			calc(var(--curve-size) + var(--border-width) * 0.5),
		calc(var(--curve-size) + var(--border-width) * 0.5) var(--border-width),
	calc(100% - var(--border-width)) var(--border-width),
		calc(100% - var(--border-width))
    calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5)),
	
    calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5))
    calc(100% - var(--border-width)),
	 var(--border-width)
    calc(100% - var(--border-width))
    );
    transition: clip-path 500ms;
  }
  
  .button-4:where(:hover, :focus)::after {
    clip-path: polygon(
      calc(100% - var(--border-width))
			calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5)),
      calc(100% - var(--border-width)) var(--border-width),
     calc(100% - var(--border-width)) var(--border-width),
      calc(100% - var(--border-width))
			calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5)),
    
			calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5))
			calc(100% - var(--border-width)),
     
			calc(100% - calc(var(--curve-size) + var(--border-width) * 0.5))
			calc(100% - var(--border-width))
      );
      transition: 200ms;
    }
    
    .button-4:where(:hover, :focus) {
      color: #fff;
    }
    
    .button-5 {
      font-size: 16px;
      padding: 1rem 2.5rem;
      border: none;
      outline: none;
      border-radius: 0.4rem;
      cursor: pointer;
      text-transform: uppercase;
      background: var(--btn-3);
      color: rgb(234, 234, 234);
      font-weight:700;
      transition: 0.6s;
      box-shadow: var(--shadow);
    }
    
    .button-5:active {
      scale: 0.92;
    }
    
    .button-5:hover {
      background: var(--btnhov-3);
      background: linear-gradient(
        270deg,
        rgba(2, 29, 78, 0.681) 0%,
        var(--btnhov-3) 60%
        );
        color: rgb(240, 240, 240);
      }