@import url('https://fonts.googleapis.com/css2?family=Cantarell:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root{
 --bg-body-1:linear-gradient(
  rgba(17, 49, 56, 0.88),
  rgba(17, 49, 56, 0.88)
), url(img/cybergif.gif);

 --bg-body-2: linear-gradient(
  rgba(29, 41, 57, 0.88),
  rgba(29, 41, 57, 0.88)
), url(img/cybergif.gif);

 --bg-body-3: linear-gradient(
  rgba(46, 60, 92, 0.88),
  rgba(46, 60, 92, 0.88)
), url(img/cybergif.gif);

 --bg-body-4:linear-gradient(
  rgba(58, 40, 20, 0.88),
  rgba(58, 40, 20, 0.88)
), url(img/cybergif.gif);

 --bg-body-5:linear-gradient(
  rgba(0, 13, 33, .88),
  rgba(0, 13, 33, .88)
  ),url(img/cybergif.gif);

 --bg-body:var(--bg-body-2);

  --bg-1:linear-gradient(to left, #f88e38, #df24fc);
  --bg-2: linear-gradient(to left, #ff0c6d, #bb28fa);
  --bg-3: linear-gradient(to left, #ec9751, #f35656);
  --bg-4: linear-gradient(to left, #7d27ec, #00c1c8);
  --bg-5: linear-gradient(to left, #f08d65, #c8aa00);
  
  --border-radius-1:50%;
  --border-radius-2:5px;

  --border-main:var(--border-radius-1);

  --bg-card:var(--bg-2);

  --color-1:#a566f8;
--color-2:#ef016f;
--color-3:#dfa1a1;
--color-4:#00c1c8;
--color-5:#f88e38;

--card-main:var(--color-2);

--title-color-1:var(--white);
--title-color-2:var(--card-main);

--title-color-main:var(--title-color-1);


--font-size-18-20:19px;
--font-size-20-28:24px;
--border-size-1-2: 1px;
--font-weight-bold:800;



--padding-13-16:13px;
--padding-15-18:18px;
--padding-18-22:22px;
--padding-12-14:13px;
--margin25:24px 0px;
--sec-padd:36px 0px;
--border-r:26px;
  --white:white;
  --black:black;
  --gap-25-30: 26px;
  --gap-30-40:39px;
--transition:all 0.4s ease;


}

html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
}


button{
  border: none;
  cursor: pointer;
}
ol, ul {
  list-style: none;
}

img {
  max-width: 100%;
  height: auto;
}

body{
  overflow-x: hidden;
  line-height: 1.2;
  direction: ltr;
  font-family: 'Cantarell', sans-serif !important;
  font-size: 19px;
  margin: 0;
  padding: 0px;
  background-size: cover;
  background-position: center;
  
}
.overlay-body{
  background-image: var(--bg-body);
  background-position: 0 0, 0 0;
  background-size: auto, auto;
  width: 100vw;
  height: 100%; 
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; 
  overflow: auto;
}
ul,li{
  padding: 0px;
  margin: 0px;
  list-style: none;
}

a {
  text-decoration: none;
  transition:var(--transition);
}

img{
  width: 100%;
  display: block;
}


.ssd-anw{
  position: relative;
  width: 100%; 
  max-width: 1200px; 
  margin: 0 auto;
padding-left: 10px;
padding-right: 10px;
  box-sizing: border-box;
}
.cyber-sec-anw{
  padding:45px  0px;
}
#anw-cyber-game1{
  display:none;
}
.line-separator-anw-top{
  filter: saturate(200%) blur(10px);
  width: 100%;
  margin-bottom: 0;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
  width: 100%;
  height: 5px;
  background:var(--bg-card);
  transform: scaleX(0);
  transform-origin: left;
  animation: lineGrow 1s ease-out forwards;
}
.line-separator-anw-bottom {
  filter: saturate(200%) blur(10px);
  width: 100%;
  margin-bottom: 0;
  position: absolute;
  top: 0%;
  left: 0%;
  height: 5px;
  background:var(--bg-card);

  transform: scaleX(0);
  transform-origin: left;
  animation: lineGrow 1s ease-out forwards;
}
.palka-decor-anw {
  width: 100%;
  margin-bottom: 0;
  height: 5px;
  background:var(--bg-card);
}

@keyframes lineGrow {
  to {
    transform: scaleX(1);
  }
}
.box-title-anw{
  display: flex;
  justify-content: left;
}
.title-anw {
  position: relative;
  margin: var(--gap-30-40) 0px;
  font-size:35px;
  font-weight: 500;
  color: var(--title-color-main);
  text-transform: capitalize;

}
.title-anw::before{
  content: '';
    position: absolute;
    bottom: -10px;
    width: 87px;
    height: 14px;
    background:var(--bg-card);
    left: 0;
    transform: translateX(0);
}
.headers{
border-bottom: 1px solid #ffffff40;

}
.navigate-box{
width: 100%;
margin: 0 auto;
padding-left: 14px;
padding-right: 14px;
}
.2 {
position: fixed;
top: 0;
inset-inline-end: 0;
width: 100%;
height: 100%;
background:var(--bg-card);
opacity: 0;          
z-index: 1; 
visibility: hidden;
transition: all 700ms ease;
}
.overlay2.active{
opacity: 0.8;
visibility: visible;
transition: all 700ms ease;
}
.top-naviget{
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
}
.top-logo{
display: flex;
gap: 8px;
flex-wrap: wrap;
justify-content: center;
align-items: center;
text-align: center;
padding: 10px 0;
font-size: 19px;
font-weight: 500;
letter-spacing: 2px;
background:var(--bg-card);;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;

}
.top-logo img{
  height: 45px;
  width: auto;
  object-fit: contain;
  transition: transform 0.3s ease-in-out;
}

.hamburger-menu{
height:24px;
width: 36px;
cursor: pointer;
text-align: center;
outline: none;
border: none;
background: transparent;
}
.hamburger-menu >span{
display: inline-block;
position: relative;
height: 3px;
width: 100%;
border-radius: 1px;
background:var(--bg-card); 
vertical-align: middle;
}
.hamburger-menu >span::before,.hamburger-menu >span::after{
display: inline-block;
position: absolute;
content: "";
height: 3px;
border-radius: 1px;
background:var(--bg-card);
  transition: all 0.3s ease-out 0s;
}
.hamburger-menu > span:before {
top: -11px;
inset-inline-start: 0px;
width: 70%;
}
.hamburger-menu > span:after {
top: 11px;
inset-inline-end: 0px;
width: 70%;
}

.hamburger-menu:hover span:after,.hamburger-menu:hover span::before{
width: 100%;
}
.top-naviget.active .hamburger-menu > span{
height: 0;
}
.top-naviget.active .hamburger-menu > span:before {
top: 0;
width: 34px;
inset-inline-start: 0;
transform: rotate(45deg);
}
.top-naviget.active .hamburger-menu > span:after {
top: 0;
inset-inline-start: 0;
width: 34px;
transform: rotate(-45deg);
} 
.top-naviget.active .menu-cyber-anw {
right: 0;
}
.menu-cyber-anw{
position: fixed;
top: 0;
display: flex;
flex-direction: column;
right: -100vw;
width: 320px;
transition: all 0.3s ease;
height: 100vh;
background:var(--bg-card); 
transition: all 600ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
z-index: 2;
overflow-y: scroll;
overflow-x: hidden;
scrollbar-width: none;
box-shadow: 0 6px 25px 0 rgba(255, 165, 0, 0);
}
.menu-cyber-anw_header {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 26px 39px 24px;

}
.menu-cyber-anw_butonClose{
width: 36px;
height: 36px;
background:transparent;
border-radius: 20% 20% 20% 20%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
border: none;
cursor: pointer;
transition: all 0.3s ease-out 0s;

}
.menu-cyber-anw_butonClose svg{
  fill: #adb0bc;
  width: 26px;
  height: 26px;
  transition: all 0.3s ease-out 0s;
}

.menu-cyber-anw_butonClose:hover svg{
fill:var(--black);
}
.menu-cyber-anw_title{
padding: 0 14px;
text-align: center;
font-size: 20px;
color: #fff;
font-weight: 500;
}

.menu-cyber-anw_maine{
display: flex;
flex-direction: column;
gap: 26px;
}
.menu-cyber-anw_list,.menu-cyber-anw_list-contact{
display: flex;
flex-direction: column;  
}
.menu-cyber-anw_list li{
border-top: 1px solid #5a372059;
}
.menu-cyber-anw_list li:last-child{
border-bottom: 1px solid #5a372059;
}
.menu-cyber-anw_link-anw{
position: relative;
display: block;
padding: 13px 22px;
transition: all 0.35s ease-in-out;
color: var(--white);
font-size:  18px;
word-wrap: break-word;
}

.menu-cyber-anw_list li:hover .menu-cyber-anw_link-anw{
transform: translateY(-5px);
color: var(--card-main);
}

.tom-menu_img{
display: flex;
align-items: center;
justify-content: center;

}
.tom-menu_img img{
  width: auto;
  height:  133px;
  object-fit: contain;
}

.bg-hero-anw{
  position: relative;
  background-image: url(galleryarchive/dir-bg/bg-dark-06870013f3347c.jpg);
  background-repeat: no-repeat;
background-size: cover;
background-position: center;
min-height: 575px;
display: flex;
    align-items: center;
}
.bg-hero-anw::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); 
  z-index: 0;
}
.marker-hero-dev-anw{

  background-color: rgba(0, 0, 0, .7);
  justify-content: center;
  width: 100%;
  padding-top: .4em;
  padding-bottom: .4em;
  display: flex;
  overflow: hidden;
  color: var(--white);
  align-items: center;
}
.marker-hero-dev-anw p{
  color: var(--white);
  padding: 0 4px;
  white-space: nowrap;
  position: relative;
  z-index: 1;
}
.marker-hero-top-anw{
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}
.marker-hero-bottom-anw{
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}
.hello-hero-anw{
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  gap: var(--padding-18-22);
  padding:0px 10px ;
}
@media (max-width:767px) {
  .hello-hero-anw{
    flex-direction: column;
    padding:40px 10px;
  }
}
.txt-hero-hello-anw{
  flex: 1;
  display: flex;
  gap: 18px;
  flex-direction: column;
}
.bg-site-hero-hero-anw{
  background-color: rgba(0, 0, 0, .7);
  width: fit-content;
  padding: 0 6px;
}
.site-hero-anw{
  text-align: center;

font-size: 39px;
font-weight: 800;
color: var(--white);
}
.say-hello-hero-anw{
  text-align: center;

  color: var(--white);
  font-size: 22px;
}
.text-anim-anw1 {
  opacity: 0;
  animation: fadeIn 2s forwards;
}
.text-anim-anw2 {
  opacity: 0;
  animation: fadeIn 3.5s forwards;
}



@keyframes fadeIn {
  to {
      opacity: 1;
  }
}
.hero-btn-anw{

  display: flex;
  justify-content:left;
}
.img-hero-hello-anw{
  flex: 1;
}
@media (max-width:767px) {
  .img-hero-hello-anw{
    display: none;
  }
}
.block-img-hero-anw img{
  object-fit: contain;
  width: 100%;
  height: 360px;
}

.thumb-steps-anw {
  display: flex;
  gap: var(--gap-30-40);
  flex-direction: column;
}
.box-steps-anw {
  display: flex;
  gap: var(--font-size-20-28);
  align-items: center;
  flex-direction: row;
}
.txt-steps-anw {
  position: relative;
width: 60%;
 color: var(--white);
}
@media (max-width:991px) {
  .txt-steps-anw {
  width: 80%;}
}
.box-steps-arrow-anw{
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (max-width:991px) {
  .box-steps-arrow-anw{
    display: none;
  }
}
.aroow-steps-svg-anw{
  color: var(--white);
  width:42px;
  height:42px;
}
.arrow-left-steps-anw{
  animation: moveAndColorRight 2s infinite alternate;

}
.arrow-right-steps-anw{
  animation: moveAndColor 2s infinite alternate;
}
@keyframes moveAndColor {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-90%);
   
    color: var(--card-main);
  }
  100% {
    transform: translateX(0);
    color: var(--white);
  }
}
@keyframes moveAndColorRight {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(90%);
    color: var(--card-main);
  }
  100% {
    transform: translateX(0);
   
    color: var(--white);
  }
}

.num-steps-anw {
  position: relative;
 width: 20%;
  display: flex;
  justify-content: center;
  align-items: center;

}

.num-steps-anw::before{
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--bg-card);
  animation: floating-border 8s infinite ease-in-out;
  transition: border-radius 1s ease-in-out;
}
.num-steps-anw p {
  position: relative;
  font-weight: 800;
  font-size: 42px;
  color: var(--white);
  animation: textColor 2s infinite alternate;
  padding: 10px;
}
@keyframes textColor {
  0% {
    color: var(--white);
  }
  50% {
    color: var(--card-main);
  }
  100% {
    color: var(--white);
  }
}

.thumb-about-anw {
  display: flex;
  gap: var(--gap-25-30);
  flex-direction: row;
  align-items: center;
}
.rand-direct-ab-step-anw{
  display: flex;
  flex-direction: column;
}
@media (max-width:767px) {
  
  .thumb-about-anw{
    flex-direction: column;
  }
}
.about-box-anw {
  flex: 1;
  width: 100%;
}
.box-img-about-anw {
  position: relative;
height: 360px;
}
.box-img-about-anw::before{
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height:calc(360px + 21px) ;
  background: var(--bg-card);
  animation: floating-border 8s infinite ease-in-out;
  transition: border-radius 1s ease-in-out;
}

@keyframes floating-border {
  0% {
    border-radius: 71% 29% 45% 55% / 40% 41% 59% 60%;
  }
  25% {
    border-radius: 60% 40% 60% 40% / 50% 60% 40% 50%;
  }
  50% {
    border-radius: 80% 20% 30% 70% / 60% 30% 70% 40%;
  }
  75% {
    border-radius: 65% 35% 55% 45% / 35% 55% 45% 65%;
  }
  100% {
    border-radius: 71% 29% 45% 55% / 40% 41% 59% 60%;
  }
}
.box-img-about-anw img{
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 25% 75% 45% 55% / 40% 67% 33% 60% ;
  animation: floating-borders 8s infinite ease-in-out;
  transition: border-radius 1s ease-in-out;
}
@keyframes floating-borders {
  0% {
    border-radius: 25% 75% 45% 55% / 40% 67% 33% 60%;
  }
  25% {
    border-radius: 60% 40% 60% 40% / 55% 35% 65% 45%;
  }
  50% {
    border-radius: 75% 25% 30% 70% / 60% 30% 70% 40%;
  }
  75% {
    border-radius: 35% 65% 55% 45% / 30% 60% 40% 70%;
  }
  100% {
    border-radius: 25% 75% 45% 55% / 40% 67% 33% 60%;
  }
}
.txt-about-anw{
  color: var(--white);
}
.about-btn-anw{
  display: flex;
  justify-content: center;
  margin: var(--margin25);
}

.video-section-anw {
  position: relative;
  background-image: url(galleryarchive/dir-bg/bg-dark-16870013f334b1.jpg);
  background-repeat: no-repeat;
background-size: cover;
background-position: center;
height: 417px;
}
.video-section-anw:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.52);
  width: 100%;
  height: 100%;
}
.play-button-anw {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
}

.play-button-anw svg {
  width: 100px;
  height: 100px;
  transition: transform 0.3s ease;
}

.play-button-anw:hover svg {
  transform: scale(1.1);
}


.video-modal-anw {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background:var(--bg-card);
  align-items: center;
  justify-content: center;
}

.modal-content-anw {
  position: relative;
  width: 90%;
  max-width: 800px;
  aspect-ratio: 16 / 9;
  background: #000;
}

.close-anw {
  position: absolute;
  top: -50px;
  right: 0;
  font-size: 42px;
  color: var(--white);
  cursor: pointer;
}
.video-wrapper-anw{
  position: absolute;
  top:50%;
left:50%;
transform:translate(-50%, -50%);
}

.thumb-games1-cyber-anw{
  display: flex;
  gap: var(--padding-18-22);
  flex-wrap: wrap;
}
.box-games1-cyber-anw{
  width: 100%;

}
@media (min-width:992px)  {
  .box-games1-cyber-anw{
    width:calc(50% - var(--padding-18-22));
  
  }
}

.box-games1-cyber-img-anw{
  height: 428px;
  box-shadow: 0 0 2px var(--card-main), 0 0 1px var(--card-main), 0 0 13px var(--card-main), 0 0 15px var(--card-main);
  border-radius:5px;
  transition: all 0.3s ease;
}
.box-games1-cyber-img-anw:hover{
  opacity: 0.5;
}
.box-games1-cyber-img-anw img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius:5px;
}
.box-txt-games1-cyber-anw{
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;

}
.box-title-games1-cyber-anw{
  transition: all 0.3s ease;
  font-size:clamp(22px,4vw,26px) ;
  text-align: start;
  font-weight: 800;
  color: var(--card-main);
}
.box-title-games1-cyber-anw:hover{
  color: var(--white);
}
.box-cyber-games1-svg-anw{
  width:45px;
height:45px;
}
.svg-cyber-games1-anw{
  width:45px;
height:45px;
color: var(--white);
transition: transform 1s ease;
}
@media (max-width:767px) {
  .svg-cyber-games1-anw{
    width:25px;
    height:25px;
  }
  .box-cyber-games1-svg-anw{
    width:25px;
    height:25px;
  }
}
.box-games1-cyber-anw:hover .svg-cyber-games1-anw{
  color: var(--card-main);
  transform: rotate(360deg);
}

.thumb-cyber-games2-anw {
  display: flex;
  flex-direction: column;
  gap:42px;
}
.box-games2-anw {
  position: relative;
  width: 100%;
  padding: var(--font-size-18-20);
  transform: translateY(0px);
}

@media (min-width:768px) {
  .box-games2-row-anw{
    flex-direction: row;
  }
  .box-games2-row2-anw{
    flex-direction: row-reverse;
  }
}
.box-games2-anw:hover{
  transform: translateY(-20px);
}
.title-cyber-games2-anw{
  color: var(--white);
  transition: all 0.3s ease;
}
.box-games2-anw:hover .title-cyber-games2-anw{
  color: var(--card-main);
}
.txt-cyber2-games-anw{
  color: var(--white);
}
.box-games2-anw:hover .box-games2-line-top{
  filter: saturate(200%) blur(10px);
  transform: scaleX(0);
  transform-origin: left;
  animation: lineGrow 1s ease-out forwards;
}
.box-games2-anw:hover .box-games2-line-bottom{
  filter: saturate(200%) blur(10px);
  transform: scaleX(0);
  transform-origin: left;
  animation: lineGrow 1s ease-out forwards;
}
.box-games2-line-top{
    width: 100%;
    margin-bottom: 0;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: auto;
    width: 100%;
    height: 5px;
    background: var(--bg-card);
  
}
.box-games2-line-bottom{
  width: 100%;
  margin-bottom: 0;
  position: absolute;
  top: 0%;
  left: 0%;
  height: 5px;
  background: var(--bg-card);

}

.box-cyber-games2-anw {
  display: flex;
  gap: var(--gap-30-40);
  align-items: center;
}
@media (max-width:767px) {
  .box-cyber-games2-anw{
    flex-direction: column;
  }
}
.img-cyber-games2-anw {
  width: 100%;
  height: 360px;
  position: relative;
}
@media (min-width:768px) {
  .img-cyber-games2-anw {
    flex: 1;}
}
.img-cyber-games2-anw img {
 
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 25% 75% 45% 55% / 40% 67% 33% 60%;
  animation: floating-borders 8s infinite ease-in-out;
  transition: border-radius 1s ease-in-out;
}
.img-cyber-games2-anw::before{
  content: "";
    position: absolute;
    z-index: -1;
    display: block;
    width: 100%;
    height:calc(360px + 10px) ;
    background: var(--bg-card);
    animation: floating-border 8s infinite ease-in-out;
    transition: border-radius 1s ease-in-out;
}
@media (max-width:575px) {
  .img-cyber-games2-anw::before{
    height: 100%;
  }
}
.txt-cyber-games2-anw {
  flex: 2;
  display: flex;
  flex-direction: column;
  gap: var(--gap-30-40);
}

.thumb-form-anw {
  display: flex;
  gap: var(--gap-30-40);
  align-items: center;
flex-direction: row;
}

.box-form-anw {
  flex: 1;
}
@media (max-width:991px) {
  .img-box-form-anw{
    display: none;
  }
}
.forma-anw {
  display: flex;
    flex-direction: column;
}
.forma-anw label{
margin-bottom: 10px;
  color: var(--title-color-main);
}
.input-user_field--control,
.textarea-user_field--control,
.input-contact-anw
{
  margin-bottom: 20px ;
  padding: 6px 20px;
  background:  transparent;
  color: var(--white);
  border:none;
  border-bottom: 3px solid var(--card-main);
}
.textarea-user_field--control{
  resize: none;
  min-height: 55px;
}
.input-user_field--control:focus,
.textarea-user_field--control:focus,
.input-contact-anw:focus{
  outline: none;
}
.input-user_field--control:active,
.textarea-user_field--control:active,
.input-contact-anw:active{
  outline: none;
}
.check-box-anw {
  display: flex;
    align-items: center;
    margin: var(--font-size-20-28) 0px;
    justify-content: center;
}

.check-form-anw {
  color: var(--white);
}
.privacy-link-anw {
  color: var(--white);
}
.privacy-link-anw:hover{
  color: var(--card-main);
}
.btn-box-form-anw {
  display: flex;
  justify-content: center;
}


.form-img-anw img{
  object-fit: contain;
  width: 100%;
  height: 360px;
  animation: shake-anw 0.5s infinite;
}
@keyframes shake-anw {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(2deg); }
  50% { transform: rotate(-2deg); }
  75% { transform: rotate(2deg); }
  100% { transform: rotate(0deg); }
}

.thumb-team-anw {
  position: relative;
  display: flex;
  gap: var(--font-size-20-28);
  flex-wrap: wrap;
}
.box-team-anw {
  width: 100%;
  transform: translateY(0px);
  transition: all 0.3s ease;
}
.box-team-anw:hover{
  transform: translateY(-30px);
}

@media (min-width:768px) and (max-width:991px) {
  .box-team-anw{
    width: calc(50% - var(--font-size-20-28));
  }
}
@media (min-width:992px){
  .box-team-anw{
    width: calc(25% - var(--font-size-20-28));
  }
}
.box-img-team-anw {
  height: 268px;

}
@media (min-width:768px) {
  height: 360px;
}
.box-img-team-anw img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius:var(--border-main);
  box-shadow: 0 0 2px var(--card-main), 0 0 1px var(--card-main), 0 0 13px var(--card-main), 0 0 15px var(--card-main);


}
.txt-team-company-anw p{
  text-align: center;
  color: var(--white);
  font-size: 24px;
  font-weight: 800;
}
.txt-team-name-anw p{
  text-align: center;
  color: var(--white);
  font-size: 19px;
  font-weight: 200;
}

.thumb-discl-anw{

  display: flex;
  flex-direction: column;
  margin: 61px auto;
  position: relative;
  background-image: url(img/cyberpunk.jpg);
  background-repeat: no-repeat;
background-size: cover;
background-position: center;
max-width: 960px;
}
.thumb-discl-anw:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.52);
  width: 100%;
  height: 100%;
}
.box-txt-discl-anw{
  position: relative;
  text-align: center;
  padding: 18px;
  color: var(--white);
  font-size: 24px;
}
.box-img-discl-anw{
  position: relative;
  width: 95px;
  height: 95px;
  margin:25px auto;
}
.box-img-discl-anw img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.footer-logo-anw{
  display: flex;
  justify-content:center ;
  gap: 6px;
}
@media (max-width:767px) {
  .footer-logo-anw{
    justify-content:center ;
  }
}
.box-footer-logo-anw{
  display: flex;
    align-items: center;
    color:var(--card-main);
    flex-direction: row;
    gap: 6px;
    font-size:36px ;
    font-weight:800 ;
    color: var(--card-main);
}
.box-footer-logo-anw:hover{
  color: var(--white);
  transition: all 0.3s ease;

}

@media (max-width:767px) {
  .box-footer-logo-anw{
    flex-direction: column;
  }
}
.logo-footer-img-anw{
  width: 95px;
  height: 95px;
}
.logo-footer-img-anw img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.thumb-ft-link-anw{
  display: flex;
  flex-wrap: wrap;
  gap:var(--padding-12-14);
  justify-content: space-around;
  margin: 26px 0px;
}

.ft-link-anw {
  color: var(--card-main);
  transition: all 0.3s ease;
}
.ft-link-anw:hover{
  color: var(--white);
}
.copy-title-anw{
  color: var(--card-main);
  text-align: center;
  margin:20px 0px;
}

.box-adr-number-contact-anw{
  display: flex;
  gap: var(--gap-30-40);
  flex-wrap: wrap;
}
@media (max-width:767px) {
  .box-adr-number-contact-anw{
    flex-direction: column;
  }
}
.box-contacts-anw{
  display: flex;
  flex: 1;
  gap: var(--padding-12-14);
  align-items: center;
  justify-content: center;
}
@media (max-width:767px) {
  .box-contacts-anw{
    flex-direction: column-reverse;
  }
}
.link-contacts-anw{
  position: relative;
  font-weight: 800;
  color: var(--white);
 
  padding: 10px;
}
.link-contacts-anw:hover{
  color:var(--card-main);
}
.box-svg-contacts-anw{
  position: relative;
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width:768px) {
  .contacts-flex-row-anw{
    flex-direction: row;
  }
  .contacts-flex-row2-anw{
    flex-direction: row-reverse;
  }
}
.box-svg-contacts-anw::before{
  content: "";
position: absolute;
display: block;
width:calc(100% + var(--padding-15-18));
height: calc(100% + var(--padding-15-18));
background: var(--bg-card);
animation: floating-border 8s infinite ease-in-out;
transition: border-radius 1s ease-in-out;
}
.svg-contacts-anw{
 position: relative;
  width: 55px;
  height:55px;
  animation: textColor 2s infinite alternate;
}
.box-geo-contacts-anw{
  display: flex;
  justify-content: center;
  margin: var(--margin25);
  flex-direction: column;
  align-items: center;
  gap: var(--padding-12-14);
}
.geo-contacts-anw{
  text-align: center;
  font-weight: 800;
  color: var(--white);
  padding: 10px;
}
.form-contacts-anw{
  display: flex;
  flex-direction: column;

}
.rnd-contacts-direction-anw{
  display: flex;
  gap:var(--gap-30-40);
  flex-direction: column;
}

.privacy-anw{
  color: var(--white);
}
.privacy-anw li{
  margin: 0px 25px ;
 list-style: square;
}
.privacy-anw p{
  padding: 4px 0px;
}
.privacy-anw li{
  padding: 4px 0px;
}

.rand-games-pg-anw{
  display: flex;
  gap:var(--gap-30-40);
  flex-direction:column;
}
 
.content-main-games-anw{
  color: var(--white);
}
.box-img-main-games-anw{
  display: flex;
  align-items: center;
  margin: var(--gap-25-30) auto;
  position: relative;
  width:575px;
  
}


@media (max-width:575px) {
  .marker-hero-top-anw {
    display: none;
  }
  .marker-hero-bottom-anw {
    display: none;
  }
  .box-img-main-games-anw{
    width:100%;
    height:auto;
  }
}
@media (min-width:576px) and (max-width:991px) {

  .box-img-main-games-anw{
    height:auto;
  }
}
.main-img-games-anw{
  position: relative;
  object-fit: contain;
  border-radius: 25% 75% 45% 55% / 40% 67% 33% 60%;
  animation: floating-borders 8s infinite ease-in-out;
  transition: border-radius 1s ease-in-out;
}
.box-frame-games-anw{
  border-radius:5px;
  box-shadow: 0 0 2px var(--card-main), 0 0 1px var(--card-main), 0 0 13px var(--card-main), 0 0 15px var(--card-main);
}
.box-frame-games-anw iframe{
  width: 100%;
  height: 428px;
  border-radius:5px;
}

.btn-cyb-1{
padding: 14px 19px;
  border-radius: 36px;
  font-size:18px;
font-weight: 800;
  border: none;
  position: relative;
  overflow: hidden;
  z-index: 1;
background-color: #ffffff;
color: var(--black);
 }
 
 .btn-cyb-1::before {
  content: '';
  width: 0;
  height:100%;
  border-radius: 36px;
  position: absolute;
  top: 0;
  left: 0;
  background-image: var(--bg-card);
  transition: .4s ease;
  display: block;
  z-index: -1;
 }
 
 .btn-cyb-1:hover::before {
  width: 100%;
 }
 .btn-cyb-2{
  padding: 1.3em 3em;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 500;
  color:var(--black);
  background-color: var(--white);
  border: none;
  border-radius: 45px;
  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
}

.btn-cyb-2:hover {
  background-color: var(--card-main);
  box-shadow: 0px 15px 20px var(--card-main);
  color: var(--white);
  transform: translateY(-7px);
}

.btn-cyb-2:active {
  transform: translateY(-1px);
}
.btn-cyb-3 {
  --green: var(--card-main);
  font-size: 18px;
  padding: 10px 39px;
  letter-spacing: 0.06em;
  position: relative;
  font-family: inherit;
  border-radius: 0.6em;
  overflow: hidden;
  transition: all 0.3s;
  line-height: 1.4em;
  border: 1px solid var(--green);
  background:var(--bg-card);
  color: var(--black);
}

.btn-cyb-3:hover {
  color: var(--white);
}
.btn-cyb-4 {
  padding: 10px 39px;
  border-radius: 10px;
  border: 0;
  background-color: var(--card-main);
  letter-spacing: 1.5px;
  font-size: 18px;
  transition: all 0.3s ease;
  color: hsl(0, 0%, 100%);
  cursor: pointer;
}

.btn-cyb-4:hover {
  background-color: var(--card-main);

  transform: translateY(5px);
  transition: 200ms;
}
.btn-cyb-5 {
  color: var(--card-main);
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid  var(--card-main);
  padding: 10px 19px;
  font-size: 18px;
  cursor: pointer;
  font-weight: 800;
  background: transparent;
  position: relative;
  transition: all 1s;
  overflow: hidden;
}

.btn-cyb-5:hover {
  color: white;
}

