/* ТАБЛИЦА
-------------------------------------------------------------*/
.forum_table {
  height: 230px;
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.game {
    width: 350px;
    height: 60px;
    overflow: hidden;
    display: flex;
    border-radius: 0px;
    box-shadow: var(--boxshadow);
    border: 1px solid var(--whiteborder);
    align-content: space-between;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(5px);
}

.gametitle {-webkit-mask-image: -webkit-gradient(linear, left 20%, left bottom, from(rgb(0 0 0)), to(rgb(0 0 0 / 60%)));}
.gametitle a {
    color: var(--pun)!important;
    display: flex;
    align-items: center;
    flex-direction: column-reverse;
    letter-spacing: 3px;
    text-transform: lowercase;
}

.gametitle span {
  text-transform: uppercase;
  font-weight: lighter;
  letter-spacing: 3px;
  display: flex;
  text-shadow: 1px 1px 1px var(--base);
  color: var(--pun);
  align-items: stretch;
  justify-content: space-evenly;
  flex-direction: row-reverse;
}

.table_center{
  display: flex;
justify-content: space-between;
  text-align: justify;
  padding: 8px;
}

.table_top {
    display: flex;
    text-align: justify;
    padding: 8px;
    flex-wrap: wrap;
    flex-direction: row;
    -webkit-mask-image: -webkit-gradient(linear, left 50%, left bottom, from(rgb(0 0 0)), to(rgb(0 0 0 / 0%)));
}

.table_text {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.table_text b{
    text-transform: uppercase;
    align-content: space-between;
    display: flex;
    letter-spacing: 10px;
align-items: flex-end;
}

.table_text b::before, .table_text b::after {
    content: '\eaba';
    font-family: 'cappuccicons';
    font-size: large;
}

.table_bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: justify;
  height: 40px;
  box-sizing: border-box
 
}

.persons_table {
  padding: 10px;
}

.persons_table.writers {
  display: flex;
  align-items: center;
  gap: 10px;
}

.persons_table.need {
  display: flex;
  align-items: center;
  gap: 10px;
}

.persons_table span {
  text-transform: uppercase;
}

.persons {
  display: flex;
  gap: 10px;
}

.persons img {
  width: 40px;
  height: 40px;
  object-fit: cover;
filter: grayscale(100%) brightness(.7) opacity(.5);
    transition: all ease 0.9s;
    border-radius: 4px;
}

.persons img:hover {
    transition: all ease 0.9s;
    filter: grayscale(0%);
    }

.table_text_center {
  width: 1000px;
  height: 90px;
  position: relative;
  display: grid;
  gap: 5px 5px;
  align-items: start;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr 3.5fr;
}

.nav {
display: flex;
justify-content: center;
position: relative;
width:1000px;
}

.nav > li a {
display: block;
padding: 5px 30px;
color: var(--maincolor)!important;
font-weight:bold;
text-transform: uppercase;
letter-spacing: 3px;
border-bottom: 1px solid var(--maincolor);
transition: all ease .8s!important;
font-size: 9px !important;}

.nav:hover > li a {
  opacity: .5;
  transition: all ease .8s!important;
}

.nav > li:hover a {
  opacity: 1;
  color:  var(--maincolor) !important;
  border-color: var(--maincolor) !important;
}

/* Параллакс
-------------------------------------------------------*/

@keyframes slidein {
from {
    translate: 0 -30vw;
}

to {
    translate: 0 0;
}
}

#parallaxwrapone {
animation-duration: 4s;
animation-name: slidein;
animation-timing-function: cubic-bezier(0, 0, 0.51, 1.0);
animation-delay: 0s;
animation-iteration-count: 1;
position: absolute;
top: -45px;
left: 450px;
}

#parallaxwraptwo {
animation-duration: 3.5s;
animation-name: slidein;
animation-timing-function: cubic-bezier(0, 0, 0.46, 1.0);
animation-delay: 0s;
animation-iteration-count: 1;
position: absolute;
top: -115px;
left: 60px;
}

#parallaxwrapthree {
animation-duration: 5s;
animation-name: slidein;
animation-timing-function: cubic-bezier(0, 0, 0.46, 1.0);
animation-delay: 0s;
animation-iteration-count: 1;
position: absolute;
top: -100px;
left: 1050px;
}

.parallax {
position: absolute;
background-image: var(--star);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 38px;
height: 38px;
transition: all 0.1s ease;
opacity: .6;
will-change: transform;
}