:root {

}

@charset "utf-8";

@font-face {
    font-family: fontLight;
    src: url("materials/fonts/HelveticaNeueCyr-Light.ttf");
}
@font-face {
    font-family: fontRegular;
    src: url("materials/fonts/HelveticaNeueCyr-Roman.ttf");
}
#team-select, #team-select-filtr, #mem-select-filtr {
    cursor: pointer;
    transition: all .3s ease;
}
#team-select:hover, #team-select-filtr:hover, #mem-select-filtr:hover {
    background-color: rgba(255, 255, 0, 0.087);
}
.email-pay {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 5px;
  margin-bottom: 15px;
}

.ep-i {
  background-color: #6c581270;
  padding: 5px;
  border-radius: 5px;
  border: none;
  outline: none;
  color: white;
  font-size: 16px;
  margin-top: 5px;
  text-align: center;
  transition: all .3s ease;
  border: 1px solid transparent;
}
.ep-i input:focus {
  background-color: #886f16;
  border: 1px solid white;
}
.pin {
    width: 20px;
    position: absolute;
    top: 10px;
    left: 10px;
    transform: rotate(45deg);
    transition: all .3s ease;
    opacity: .6;
    cursor: pointer;
}
.pin:hover {
    opacity: 1;
}
select option {
    background-color: rgb(30, 30, 30);
    border: none;
}

.comingsoon {
  text-align: center;
  margin-top: 50px;
  line-height: 25px;
}
.editwar {
    background-color: rgba(255, 0, 0, 0.489);
    font-size: 12px;
    padding: 5px 10px;
    text-align: center;
    display: flex;
    align-items: center;
    border-radius: 5px;
    width: 91%;
    transition: all .3s ease;
    opacity: 0;
    margin-bottom: 5px;
    height: 0;
}
.free {
    display: flex;
    align-items: center;
}
.free2 {
    margin-left: 10px;
    max-width: 100px;
    min-width: 100px;
    text-align: center;
}
#warning-pop {
    position: fixed;
    z-index: 9999999999;
    top: -500px;
    left: 50%;
    padding: 15px;
    border-radius: 5px;
    backdrop-filter: blur(10px);
    transform: translate(-50%, 0);
    transition: all .3s ease;
}
.pop-ok {
    border: 1px solid green;
    background-color: rgba(24, 185, 48, 0.276);

}
.pop-bad {
    border: 1px solid rgb(128, 30, 0);
    background-color: rgba(185, 24, 24, 0.438);

}

.allteam {
    background-color: #ff7b0054;
    padding: 10px;
    margin-top: 10px;
    text-align: center;
}


.mem-newtask {
    position: fixed;
    top: -150vh;
    left: 50%;
    background-color: #484918;
    transform: translate(-50%, 0);
    transition: all .3s ease;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid yellow;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 99;
}
#newtaskmem-text, #newtaskmem-date, #newtaskmem-column, #newtaskmem-note, .dops {
    resize: none;
    outline: none;
    background-color: #ffff0030;
    color: white;
    padding: 10px;
    border-radius: 5px;
    border: none;
}
#newtaskmem-text::placeholder, #newtaskmem-note::placeholder, .dops::placeholder {
    color: rgba(255, 255, 255, 0.626);
}
.newtaskmem-desk {
    margin-top: 20px;
    margin-bottom: 5px;

}
.dops {
    margin-bottom: 10px;
}
.pod-block {
    position: absolute;
    left: 0;
    top: -150vh;
    background-color: #484918;
    height: calc(100% - 30px);
    display: flex;
    flex-direction: column;
    width: calc(100% - 30px);
    padding: 15px;
    z-index: 9;
    transition: all .3s ease;
}




.checklist-block {
    display: flex;
    background-color: rgba(247, 207, 8, 0.265);
    margin-top: 5px;
    text-align: center;
    justify-content: center;
    padding: 5px;
    border-radius: 5px;
    width: 95%;
    margin-inline: auto;
    font-size: 14px;
    flex-direction: column;
    transition: all .3s ease;
}
.cl-add-btn, .cl-show-btn {
    cursor: pointer;
    background-color: rgba(247, 207, 8, 0.396);
    padding: 5px;
    border-radius: 5px;
    transition: all .3s ease;
}
.cl-add-btn:hover, .cl-show-btn:hover {
    background-color: rgba(247, 207, 8, 0.504);
}

.cl-show-block {
    display: flex;
    flex-direction: column;
    padding: 0 5px 0 5px;
    margin-top: 5px;
    overflow: hidden;
}
.cl-one {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    padding: 0 0 10px 0;
    margin-bottom: 15px;
    border-bottom: 1px solid rgba(255, 255, 0, 0.593);
}
.cl-one-point {
    width: 20px;
    height: 20px;
    cursor: pointer;
    border-radius: 50000000000px;
    border: 1px solid white;
    position: relative;
}
.cl-one-point-checked {
    width: 20px;
    height: 20px;
    cursor: pointer;
    border-radius: 50000000000px;
    border: 1px solid white;
    position: relative;
}
.cl-one-point-checked::before {
    content: '';
    width: 70%;
    height: 70%;
    background-color: #f9fa00;
    border-radius: 50000000px;
    display: flex;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.cl-text {
    width: 100%;
    text-align: left;
    margin-left: 10px;
    display: flex;
    align-items: center;
    line-height: 16px;
}

.con-desc {
    text-align: center;
    color: gray;
    margin-bottom: 50px;
}
.new-cl-area {
    margin-top: 10px;
    width: 95%;
    resize: none;
    outline: none;
    padding: 5px;
    margin-inline: auto;
    background-color: transparent;
    border: none;
    caret-color: white;
    color: white;
    font-size: 16px;
    display: inline-table;
    display: none;
}
.new-cl-area::placeholder {
    color: rgb(213, 213, 213);
    font-family: fontRegular;
}
#jt-btn {
    display: none;
}
.onecl-block {
    width: 90%;
    text-align: left;
    margin-left: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.cl-edit {
    margin-top: 10px;
    width: 95%;
    resize: none;
    outline: none;
    padding: 5px;
    margin-inline: auto;
    border: none;
    caret-color: white;
    color: white;
    font-size: 14px;
    display: inline-table;
    background-color: #eeeeee1f;
    border-radius: 5px;
    height: auto;
    display: none;
}
.cl-edit::placeholder {
    color: rgb(213, 213, 213);
    font-family: fontRegular;
}


.newpass-block {
  width: 90%;
  margin-inline: auto;
  padding-top: 50px;
}
.tariff-block {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.sub-end {
    margin-top: 10px;
    margin-bottom: 20px;
}
.payment-block {
    display: flex;
    flex-direction: column;
    padding: 10px;
    overflow: hidden;
    height: 25px;
    transition: all .3s ease;
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 0, 0.367);
    width: 60%;
    margin-bottom: 40px;
}
#subbtn {
    margin-bottom: 20px;
}
.payment-main {
    display: flex;
    flex-direction: column;
}
.input30 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}
#subdays {
    text-align: center;
    background-color: #ffff001a;
    padding: 5px 5px 15px 5px;
    font-size: 30px;
    color: white;
    border-radius: 5000000px;
    width: 95px;
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: 25px;
    border: none;
    outline: none;
}

.terms-desk {
    opacity: .8;
    line-height: 30px;
    margin-bottom: 50px;
}
.terms-title {
    font-size: 30px;
    color: #ffcd00;
    margin-bottom: 15px;
    font-weight: bold;
}
.terms-text {
    margin-bottom: 30px;
    line-height: 25px;
}
.terms-block {
    padding-bottom: 100px;
    position: relative;
}
.termsdown {
    position: fixed;
    right: 50px;
    top: 50px;
    padding: 10px 15px;
    border-radius: 500000px;
    background-color: yellow;
    color: black;
    text-decoration: none;
    cursor: pointer;
}




.leftdays {
    background-color: #ffd100cf;
    margin-left: 5px;
    padding: 10px;
    border-radius: 50000000px;
    color: black;
}
.ddesc {
    position: relative;
}
.ddesc2 {
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translate(-50%, 0px);
    font-size: 10px;
    color: rgba(255, 255, 255, 0.624);
}
.minus, .plus {
    width: 30px;
    background-color: #323232;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5000000px;
    cursor: pointer;
    color: yellow;
    margin-top: 13px;
    opacity: .8;
    transition: all .3s ease;
    user-select: none;
}
.minus:hover, .plus:hover {
    transform: scale(1.3);
    opacity: 1;
}

.sum-block {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    margin-bottom: 20px;
    align-items: center;
}
#subsum {
    margin-left: 5px;
    font-size: 16px;
    background-color: transparent;
    border: none;
    outline: none;
    color: yellow;
}
#subsum2 {
    margin-left: 5px;
    font-size: 16px;
    background-color: transparent;
    border: none;
    outline: none;
    color: rgb(225, 225, 225);
    text-decoration: line-through rgb(255, 0, 0);
}
.pay-terms {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    margin-bottom: 15px;
}
.benefits {
    width: 60%;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 0, 0.367);
}
.bdesc {
    color: yellow;
    margin-bottom: 15px;
}

.ben1 {
    padding: 15px;
    background-color: rgba(255, 255, 255, 0.116);
    margin-bottom: 5px;
    border-radius: 5px;
    transition: all .3s ease;
    backdrop-filter: blur(5px);
}
.ben1:hover {
    background-color: rgba(255, 255, 255, 0.186);
}

.pay-recs {
    font-size: 12px;
    line-height: 15px;
    color: gray;
    margin-bottom: 10px;
}


html, body {
  height: 100%;
}


.wrap {
  height: 10%;
  transform-style: preserve-3d;
  position: fixed;
  top: 0;
  left: 50%;
  display: none;
}

.firework {
  position: absolute;
  top: 80px;
  backface-visibilty: hidden;
  opacity: 0;
}

.c {
  background: white;
  height: 5px;
  width: 5px;
  position: absolute;
  border-radius: 50%;
}

@keyframes shoot1 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
    opacity: 0;
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(0.923887396px, 0vh, 0) scale(2);
    opacity: 0;
  }
}
.firework:nth-child(1) {
  animation: shoot1 1s linear;
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(1) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(2) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(3) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(4) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(5) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(6) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(7) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(8) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(9) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(10) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(11) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(12) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(13) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(14) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(15) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(16) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(17) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(18) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(19) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(20) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(21) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(22) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(23) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(24) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(25) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(26) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(27) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(28) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(29) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(30) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(31) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(32) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(33) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(34) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(35) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(36) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(37) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(38) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(39) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ffe600;
   
}
.firework:nth-child(1) .c:nth-child(40) {
  animation-delay: 0.3s;
}

@keyframes shoot2 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
    opacity: 0;
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-30.745844075px, 0vh, 0) scale(2);
    opacity: 0;
  }
}
.firework:nth-child(2) {
  animation: shoot2 1s linear;
  animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(1) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(2) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(3) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(4) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(5) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(6) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(7) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(8) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(9) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(10) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(11) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(12) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(13) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(14) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(15) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(16) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(17) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(18) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(19) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(20) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(21) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(22) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(23) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(24) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(25) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(26) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(27) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(28) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(29) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(30) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(31) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(32) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(33) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(34) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(35) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(36) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(37) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(38) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(39) {
    animation-delay: none;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(40) {
    animation-delay: none;
}



@keyframes shoot3 {
    0% {
      transform: translate3d(0, 0, 0) scale(0.1);
      opacity: 0;
    }
    95% {
      opacity: 1;
    }
    100% {
      transform: translate3d(0.923887396px, 0vh, 0) scale(2);
      opacity: 0;
    }
  }
  .firework:nth-child(3) {
    animation: shoot3 1s linear;
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(3) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(2) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(3) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(4) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(5) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(6) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(7) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(8) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(9) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(10) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(11) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(12) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(13) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(14) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(15) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(16) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(17) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(18) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(19) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(20) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(21) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(22) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(23) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(24) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(25) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(26) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(27) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(28) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(29) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(30) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(31) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(32) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(33) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(34) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(35) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(36) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(37) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(38) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(39) {
    animation-delay: 0.7s;
  }
  
  .firework:nth-child(3) .c {
    background: white;
     
  }
  .firework:nth-child(3) .c:nth-child(40) {
    animation-delay: 0.7s;
  }
  


@keyframes explode1 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-21.7673987379px, -84.5963330903px, 0) scale(0.1);
  }
}
.c:nth-child(1) {
  animation: explode1 1s  linear;
  opacity: 0;
}

@keyframes explode2 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(31.1250239439px, -91.7415054791px, 0) scale(0.1);
  }
}
.c:nth-child(2) {
  animation: explode2 1s linear;
  opacity: 0;
}

@keyframes explode3 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-42.65634918px, 56.2166946938px, 0) scale(0.1);
  }
}
.c:nth-child(3) {
  animation: explode3 1s linear;
  opacity: 0;
}

@keyframes explode4 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-50.4236623176px, -87.2549668013px, 0) scale(0.1);
  }
}
.c:nth-child(4) {
  animation: explode4 1s linear;
  opacity: 0;
}

@keyframes explode5 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(22.8872780058px, -36.0668179123px, 0) scale(0.1);
  }
}
.c:nth-child(5) {
  animation: explode5 1s linear;
  opacity: 0;
}

@keyframes explode6 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(24.3928369902px, -2.8585001799px, 0) scale(0.1);
  }
}
.c:nth-child(6) {
  animation: explode6 1s linear;
  opacity: 0;
}

@keyframes explode7 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-7.0797057224px, 76.4802255648px, 0) scale(0.1);
  }
}
.c:nth-child(7) {
  animation: explode7 1s linear;
}

@keyframes explode8 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(11.1583037938px, 0.3414350947px, 0) scale(0.1);
  }
}
.c:nth-child(8) {
  animation: explode8 1s linear;
}

@keyframes explode9 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-18.1441113943px, 36.1801441601px, 0) scale(0.1);
  }
}
.c:nth-child(9) {
  animation: explode9 1s linear;
}

@keyframes explode10 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-27.4021034744px, 16.3704434838px, 0) scale(0.1);
  }
}
.c:nth-child(10) {
  animation: explode10 1s linear;
}

@keyframes explode11 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(73.2901994998px, -41.8549009329px, 0) scale(0.1);
  }
}
.c:nth-child(11) {
  animation: explode11 1s linear;
}

@keyframes explode12 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(60.3965812735px, 83.2595694074px, 0) scale(0.1);
  }
}
.c:nth-child(12) {
  animation: explode12 1s linear;
}

@keyframes explode13 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-48.6764194914px, 2.8071442917px, 0) scale(0.1);
  }
}
.c:nth-child(13) {
  animation: explode13 1s linear;
}

@keyframes explode14 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(85.3680283433px, -19.230721632px, 0) scale(0.1);
  }
}
.c:nth-child(14) {
  animation: explode14 1s linear;
}

@keyframes explode15 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(11.4814011722px, 7.2688215365px, 0) scale(0.1);
  }
}
.c:nth-child(15) {
  animation: explode15 1s linear;
}

@keyframes explode16 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-68.5620316405px, -52.8652227533px, 0) scale(0.1);
  }
}
.c:nth-child(16) {
  animation: explode16 1s linear;
}

@keyframes explode17 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(2.174123103px, -18.6700116062px, 0) scale(0.1);
  }
}
.c:nth-child(17) {
  animation: explode17 1s linear;
}

@keyframes explode18 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-87.9866457157px, 14.0607082835px, 0) scale(0.1);
  }
}
.c:nth-child(18) {
  animation: explode18 1s linear;
}

@keyframes explode19 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(43.7125056092px, 33.8080988668px, 0) scale(0.1);
  }
}
.c:nth-child(19) {
  animation: explode19 1s linear;
}

@keyframes explode20 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-31.2049634025px, 3.7640793796px, 0) scale(0.1);
  }
}
.c:nth-child(20) {
  animation: explode20 1s linear;
}

@keyframes explode21 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-4.8730877875px, -49.4826786435px, 0) scale(0.1);
  }
}
.c:nth-child(21) {
  animation: explode21 1s linear;
}

@keyframes explode22 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(29.8419282045px, 0.0396906412px, 0) scale(0.1);
  }
}
.c:nth-child(22) {
  animation: explode22 1s linear;
}

@keyframes explode23 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-10.1491969423px, -107.7707206623px, 0) scale(0.1);
  }
}
.c:nth-child(23) {
  animation: explode23 1s linear;
}

@keyframes explode24 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(40.6088459754px, 2.5257549346px, 0) scale(0.1);
  }
}
.c:nth-child(24) {
  animation: explode24 1s linear;
}

@keyframes explode25 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-30.3009978024px, 27.8196126817px, 0) scale(0.1);
  }
}
.c:nth-child(25) {
  animation: explode25 1s linear;
}

@keyframes explode26 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-4.6523326704px, -80.2806990153px, 0) scale(0.1);
  }
}
.c:nth-child(26) {
  animation: explode26 1s linear;
}

@keyframes explode27 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(0.5644044184px, 29.1132614505px, 0) scale(0.1);
  }
}
.c:nth-child(27) {
  animation: explode27 1s linear;
}

@keyframes explode28 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-15.6792097449px, -15.9233907529px, 0) scale(0.1);
  }
}
.c:nth-child(28) {
  animation: explode28 1s linear;
}

@keyframes explode29 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-48.3889031022px, 2.5746301133px, 0) scale(0.1);
  }
}
.c:nth-child(29) {
  animation: explode29 1s linear;
}

@keyframes explode30 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-8.4386912003px, -118.2962206717px, 0) scale(0.1);
  }
}
.c:nth-child(30) {
  animation: explode30 1s linear;
}

@keyframes explode31 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-117.2284393224px, 61.9852173932px, 0) scale(0.1);
  }
}
.c:nth-child(31) {
  animation: explode31 1s linear;
}

@keyframes explode32 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-38.9554242446px, -105.5262956664px, 0) scale(0.1);
  }
}
.c:nth-child(32) {
  animation: explode32 1s linear;
}

@keyframes explode33 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(18.8819704222px, -27.8073430676px, 0) scale(0.1);
  }
}
.c:nth-child(33) {
  animation: explode33 1s linear;
}

@keyframes explode34 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-38.3366993705px, -15.7076125924px, 0) scale(0.1);
  }
}
.c:nth-child(34) {
  animation: explode34 1s linear;
}

@keyframes explode35 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(16.510776107px, 10.2682632199px, 0) scale(0.1);
  }
}
.c:nth-child(35) {
  animation: explode35 1s linear;
}

@keyframes explode36 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(22.556746665px, -9.2052402982px, 0) scale(0.1);
  }
}
.c:nth-child(36) {
  animation: explode36 1s linear;
}

@keyframes explode37 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-105.8718732898px, -3.3710990276px, 0) scale(0.1);
  }
}
.c:nth-child(37) {
  animation: explode37 1s linear;
}

@keyframes explode38 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(115.9538460169px, 21.931096809px, 0) scale(0.1);
  }
}
.c:nth-child(38) {
  animation: explode38 1s linear;
}

@keyframes explode39 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-68.1994433063px, 47.0810441783px, 0) scale(0.1);
  }
}
.c:nth-child(39) {
  animation: explode39 1s linear;
}

@keyframes explode40 {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(64.8482125059px, -6.1513014293px, 0) scale(0.1);
  }
}
.c:nth-child(40) {
  animation: explode40 1s linear;
}



 
.hr {
    height: 1px;
    width: 15px;
    border-bottom: 1px solid #a5891b;
    margin-left: 3px;
}
.hrar {
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    height: 10px;
    width: 10px;
    background-color: #a5891b;
    margin-right: 3px;
    border-radius: 5px;
}
.background {
    width: 100%;
    height: 100%;
    background-image: url(img/hermes-ext.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30vw;
    position: fixed;
    z-index: -999999999;
    opacity: .1;
}
body {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    background-color: rgb(30, 30, 30);
    color: white;
    font-family: fontRegular;
}
body::-webkit-scrollbar {
width: 2px;
}  
body::-webkit-scrollbar-track {
background: rgba(255, 255, 0, 0.213);
}

body::-webkit-scrollbar-thumb {
background-color: yellow;
border-radius: 500000px;
}

.jobtitle-form::-webkit-scrollbar {
width: 5px;
}  
.jobtitle-form::-webkit-scrollbar-track {
background: rgba(255, 255, 0, 0.213);
}

.jobtitle-form::-webkit-scrollbar-thumb {
background-color: yellow;
border-radius: 500000px;
}
.plspress {
    position: absolute;
    z-index: 999999;
    top: 50%;
    left: 50%;
    width: 100%;
    text-align: center;
    transform: translate(-50%, -50%);
    opacity: .6;
    height: 100%;
    align-items: center;
    display: flex;
    justify-content: center;
    cursor: pointer;
}
#logout {
    width: 20px;
    margin-top: 15px;
    margin-left: 5px;
    margin-bottom: 20px;
    position: absolute;
    top: -30px;
    left: 0;
    cursor: pointer;
    padding: 5px;
    border-radius: 5px;
    transition: all .3s ease;
}
#logout:hover {
    background-color: rgb(248, 67, 67);
}

.totalblock {
    position: relative;
    width: 90%;
    min-height: 90vh;
    margin-top: 20px;
    background-color: transparent;
    margin-left: auto;
    margin-right: 2%;
    transition: all .3s ease;
    margin-bottom: 50px;
}
.teamname {
    padding: 5px;
    background-color: #00000030;
    border-radius: 2px;
    font-size: 12px;
    display: inline-block;
}
.title-floor {
    display: flex;
    justify-content: start;
    flex-direction: column;
}
.tf1 {
    display: flex;
    flex-direction: row;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ffff0024;
}
.tf2 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}
#team-select {
    margin-left: 15px;
    outline: none;
    padding: 5px 15px;
    border: 1px solid #a5891b;
    border-radius: 50000px;
    background-color: transparent;
    color: white;
    -webkit-appearance: none;
    max-width: 150px;
    text-align: center;
}
#team-select-filtr {
    outline: none;
    padding: 5px 15px;
    border: 1px solid #a5891b;
    border-radius: 50000px;
    background-color: transparent;
    color: white;
    -webkit-appearance: none;
    max-width: 150px;
    text-align: center;
}
#day-select-filtr {
    outline: none;
    padding: 5px 15px;
    border: 1px solid #a5891b;
    border-radius: 50000px;
    background-color: transparent;
    color: white;
    -webkit-appearance: none;
    max-width: 150px;
    text-align: center;
}
#mem-select-filtr {
    outline: none;
    padding: 5px 15px;
    border: 1px solid #a5891b;
    border-radius: 50000px;
    background-color: transparent;
    color: white;
    -webkit-appearance: none;
    max-width: 150px;
    min-width: 100px;
    text-align: center;
}
#delall {
    padding: 5px 15px;
    border: 1px solid transparent;
    border-radius: 50000px;
    background-color: #ba17175c;
    color: white;
    max-width: 150px;
    text-align: center;
    font-size: 14px;
    margin-left: 50px;
    transition: all .3s ease;
    cursor: pointer;
}
#delall:hover {
    background-color: #ba171790;
}

.side-menu {
    width: 5%;
    /* width: 16%; */
    background-color: rgb(39 39 39 / 85%);
    min-height: 100vh;
    border-radius: 0 20px 20px 0;
    position: fixed;
    transition: all .3s ease;
    overflow: hidden;
}

.avatar-name, .avatar-name-mob {
    color: white;
    text-decoration: none;
    cursor: pointer;
    margin-top: 5px;
}
.avatar-block {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 20px;
    align-items: center;
    position: relative;
}
.avatar-userpic {
    width: 50px;
    height: 50px;
    border-radius: 5000000px;
    object-fit: cover;
    transition: all .3s ease;
}
.avatar-info {
    display: none;
    flex-direction: column;
    margin-left: 15px;
    opacity: 0;
    transition: all .3s ease;
}
.avatar-title {
    font-size: 12px;
    color: rgba(240, 248, 255, 0.501);
    font-family: fontLight;
    margin-bottom: 3px;
}
.horizont {
    width: 80%;
    border-bottom: 1px solid rgba(240, 248, 255, 0.122);
    margin-inline: auto;
    margin-top: 15px;
    margin-bottom: 15px;
}
.openbtn {
    position: fixed;
    width: 30px;
    left: 4%;
    top: 65px;
    background-color: gray;
    border-radius: 10px;
    overflow: hidden;
    opacity: .3;
    transform: rotate(0deg);
    cursor: pointer;
    z-index: 999999;
    transition: all .3s ease;
}
.openbtn:hover {
    opacity: 1;
}
.menu-points {
    display: flex;
    flex-direction: column;
    width: 80%;
    margin-inline: auto;
    justify-content: space-between;
}
.menu-point {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-decoration: none;
    color: aliceblue;
    align-items: end;
    transition: all .3s ease;
    padding: 5px;
    border-radius: 5px;
    margin-bottom: 10px;
}
.menu-point:hover {
    background-color: rgba(255, 255, 255, 0.094);
}
.menu-point-icon {
    display: flex;
    width: 20px;
    height: 20px;
    opacity: .8;
} 
.menu-point-title {
    display: none;
    margin-left: 10px;
}
.side-calendar {
    background-color: rgba(255, 255, 255, 0.094);
    padding: 5px;
    border-radius: 10px;
    width: 70%;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.side-cal-day {
    font-size: 30px;
    text-align: center;
    font-family: fontLight;
    margin-bottom: 3px;
}
.side-cal-mounth {
    text-align: center;
    margin-bottom: 3px;
}
.side-cal-week {
    font-size: 12px;
    text-align: center;
    font-family: fontLight;
    margin-bottom: 3px;
    background-color: gray;
    padding: 3px;
    border-radius: 10px;
}


.calendar-item {
	width: 90%;
	display: inline-block;
	vertical-align: top;
    margin-inline: auto;
}
.calendar-head {
	text-align: center;
	padding: 5px;
	font-weight: 700;
	font-size: 14px;
}
.calendar-item table {
	border-collapse: collapse;
	width: 100%;
}
.calendar-item th {
	font-size: 12px;
	padding: 6px 7px;
	text-align: center;
	color: #888;
	font-weight: normal;
}
.calendar-item td {
	font-size: 13px;
	padding: 6px 5px;
	text-align: center;
    border-radius: 5px;
    cursor: default;
}
.calendar-item td:hover {
    background-color: rgba(128, 128, 128, 0.343);
}
.calendar-item tr th:nth-child(6), .calendar-item tr th:nth-child(7),
.calendar-item tr td:nth-child(6), .calendar-item tr td:nth-child(7)  {
    cursor: default;
}	
.calendar-item tr th:nth-child(6):hover, .calendar-item tr th:nth-child(7):hover,
.calendar-item tr td:nth-child(6):hover, .calendar-item tr td:nth-child(7):hover  {
    background-color: rgba(128, 128, 128, 0.343);
}	
.calendar-day.last {
	color: #999 !important;
    cursor: default;
}	
.calendar-day.last:hover {
    background-color: rgba(128, 128, 128, 0.343);
}	
.calendar-day.today {
	font-weight: bold;
    color: black;
    background-color: gray;
    border-radius: 5px;
    cursor: default;
}
.calendar-day.event {
	background: #46a2d8;
	position: relative;
	cursor: pointer;
    color: white;
    height: 50px;
    cursor: default;
}
.calendar-day.event:hover .calendar-popup {
	display: block;
    cursor: default;
}
.calendar-popup {
	display: none;
	position: absolute;
	top: 40px;
	left: 0;
	min-width: 230px;
	padding: 15px 0;
	background: #fff;
	text-align: left;
	font-size: 13px;
	z-index: 100;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	color: #000;
}
.calendar-popup:before {
	content: ""; 
	border: solid transparent;
	position: absolute;    
	left: 8px;    
	bottom: 100%;
	border-bottom-color: #fff;
	border-width: 9px;
	margin-left: 0;
}
.side-calendar-full {
    display: none;
    justify-content: center;
}

 

.totalblock-title {
    font-size: 30px;
}

.team-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    padding-bottom: 150px;
    position: relative;
    margin-bottom: 50px;
}
.task-column {
    width: 22%;
    min-width: 200px;
    border-radius: 10px;
    padding: 10px 5px 5px 5px;
    background-color: rgb(118 105 39 / 35%);
}
.addteam {
    width: 90%;
    display: flex;
    flex-direction: column;
    margin-inline: auto;
    padding: 15px;
    border: 2px dotted white;
    border-radius: 10px;
    cursor: pointer;
    transition: all .3s ease;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
}
.addteam:hover {
    background-color: #fdcf1656;
}
.addteam-title {
    display: flex;
    justify-content: center;
    font-size: 19px;
    margin-bottom: 10px;
}
.addteam-plus {
    width: 2%;
    display: flex;
    margin-inline: auto;
    padding: 10px;
    border: 2px dotted white;
    border-radius: 500000px;
}
.newteam-form {
    background-color: rgb(30, 30, 30);
    border: 1px solid rgba(255, 255, 0, 0.501);
    width: 60%;
    position: absolute;
    z-index: 999999;
    padding: 25px;
    border-radius: 10px;
    left: 50%;
    top: -500px;
    transform: translate(-50%, 0);
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
}
.newteam-close {
    width: 20px;
    padding: 10px;
    border-radius: 5px;
    transition: all .3s ease;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}
.newteam-close:hover {
    background-color: rgb(167, 56, 0);
}
.addmember-close {
    width: 20px;
    padding: 10px;
    border-radius: 5px;
    transition: all .3s ease;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}
.addmember-close:hover {
    background-color: rgb(167, 56, 0);
}

#myteams {
    display: flex;
    flex-direction: column;
}
.one-team {
    display: flex;
    flex-direction: column;
    background-color: rgba(255, 255, 0, 0.108);
    padding: 10px;
    border-radius: 5px;
    transition: all .3s ease;
    overflow: hidden;
    height: 40px;
    margin-bottom: 30px;
}
.team-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.one-team:hover {
    background-color: rgba(255, 255, 0, 0.195);
}
.one-team-name {
    font-size: 19px;
    font-family: fontLight;
    color: rgb(255, 213, 0);
    display: flex;
    flex-direction: row;
    align-items: center;
}
.one-team-count {
    display: flex;
    flex-direction: row;
}
.one-team-title {
    font-size: 19px;
}
.one-team-title img {
    width: 20px;
}
.open-team {
    width: 20px;
    padding: 10px 20px;
    cursor: pointer;
    transition: all .3s ease;
    border-radius: 10px;
}
.open-team:hover {
    background-color: rgba(255, 255, 0, 0.173);
}
.show-team {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
    background-color: rgb(30, 30, 30);
    padding: 50px 10px 20px 10px;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    transition: all .3s ease;
}
.member-block {
    width: 20%;
    display: grid;
    flex-direction: column;
    background-color: #ffff001f;
    padding: 15px;
    border-radius: 5px;
    margin-left: 1%;
    margin-right: 1%;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
}
.member-block-userpic {
    width: 150px;
    height: 150px;
    border-radius: 50000000px;
    object-fit: cover;
    display: flex;
    margin-inline: auto;
    margin-bottom: 20px;
}
.member-block .one-team-title {
    text-align: center;
    margin-bottom: 10px;
}
.member-menu {
    background-color: #1a1a0b85;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 5px;
    border-radius: 10px;
}
.ottmini {
    font-size: 14px;
    font-family: fontLight;
}
.member-menu img {
    padding: 10px;
    width: 20px;
    cursor: pointer;
    transition: all .3s ease;
    border-radius: 10px;
}
.member-menu img:hover {
    background-color: #ffff001f;
}
.addmember {
    position: absolute;
    border: 1px dotted white;
    display: flex;
    width: 90%;
    padding: 10px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    cursor: pointer;
    top: 10px;
    transition: all .3s ease;
}
.addmember:hover {
    border: 1px dotted yellow;
    color: yellow;
}
.addmember-form {
    position: absolute;
    background-color: rgb(30, 30, 30);
    border: 1px solid rgba(255, 255, 0, 0.501);
    padding: 15px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    top: -1000px;
    transition: all .3s ease;
    z-index: 9;
}
#addmem-btn {
    transition: all .3s ease;
}







.tasks-wrap {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-top: 20px;
    align-items: baseline;
    padding-bottom: 150px;
}

.task-title {
    margin-bottom: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0px;
    z-index: 99999;
    background-color: #3d3922;
    padding: 5px 0 5px 10px;
    border-radius: 0 0 5px 5px ;
}
.one-task, .one-task-new {
    width: 90%;
    margin-inline: auto;
    border-radius: 10px;
    background-color: #7c6306bd;
    padding: 10px;
    display: block;
    margin-bottom: 15px;
    position: relative;
}
.addtask {
    width: 20px;
    cursor: pointer;
    background-color: transparent;
    border-radius: 5px;
    transition: all .3s ease;
    padding: 5px;
    margin-right: 5px;
}
.addtask:hover {
    background-color: rgba(118, 105, 39, 0.583);
}
.task-desk {
    margin-bottom: 20px;
    line-height: 20px;
}

.dateadd {
    font-family: fontLight;
    font-size: 12px;
    margin-bottom: 5px;
    margin-top: 5px;
}
.deadline {
    font-family: fontLight;
    font-size: 12px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
}
.dd {
    border-bottom: 1px solid white;
}
.task-status {
    background-color: gray;
    padding: 10px 10px 10px 10px;
    border-radius: 500px;
    display: inline-flex;
    font-size: 14px;
    cursor: pointer;
    transition: all .3s ease;
    position: relative;
    z-index: 999;
    align-items: center;
}
.task-status:hover {
    filter: brightness(110%);
}
.accept {
    background-color: #348e96;
}
.new {
    background-color: #00000030;
}
.new::after {
    content: 'Новая';
}
.inprocess {
    background-color: #cd6d1691;
}
.inprocess::after {
    content: 'В процессе';
}
.complete {
    background-color: #e4c510b0;
}
.complete::after {
    content: 'Готово';
}

.new2 {
    background-color: #00000030;
}
.new2::after {
    content: 'Новая';
}
.inprocess2 {
    background-color: #cd6d1691;
}
.inprocess2::after {
    content: 'В процессе';
}
.complete2 {
    background-color: #e4c510b0;
}
.complete2::after {
    content: 'Готово';
}
.task-status:hover {
    filter: brightness(110%);
}
.status-dot {
    width: 10px;
    height: 10px;
    border-radius: 5000px;
    background-color: white;
    margin-right: 10px;
}
.task-menu {
    display: flex;
    flex-direction: row;
    margin-bottom: 25px;
    padding: 5px;
    right: 0;
    width: 10%;
    margin-left: auto;
    cursor: pointer;
    transition: all .3s ease;
    opacity: .4;
    position: relative;
}
.task-menu:hover {
    opacity: 1;
}
.dot {
    width: 5px;
    height: 5px;
    border-radius: 5000px;
    background-color: white;
    margin-left: 3px;
}
.task-floor {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    position: relative;
}
.task-note-btn {
    width: 10%;
    height: auto;
    cursor: pointer;
    opacity: .4;
    transition: all .3s ease;
}
.task-note-btn:hover {
    opacity: 1;
}
.note-popup {
    position: absolute;
    background-color: rgba(247, 207, 8, 0.952);
    padding: 10px;
    border-radius: 5px;
    top: 100%;
    color: rgb(81, 50, 9);
    display: none;
    width: 92%;
    z-index: 9999999999;
    overflow: hidden;
}
.note-popup-edit-wrap {
    width: 112%;
    display: none;
    top: 0;
    position: absolute;
    padding-bottom: 20px;
    left: -5%;
}
.note-popup-edit {
    background-color: rgba(247, 207, 8, 0.952);
    padding: 10px;
    border-radius: 5px 0 0 5px;
    color: rgb(81, 50, 9);
    resize: none;
    min-height: 150px;
    width: 90%;
    outline: none;
    border: 2px solid rgb(255, 217, 0);
    font-family: fontRegular;
    z-index: 99999;
    position: relative;
}
.note-edit-btn-floor {
    z-index: 9999;
    position: absolute;
    bottom: -20px;
    display: flex;
    justify-content: space-around;
    margin-left: 10%;
}
.edit-close {
    width: 10px;
    height: 32%;
    background-color: rgb(167, 56, 0);
    border-radius: 0 5px 5px 0;
    padding: 10px;
    cursor: pointer;
    opacity: .8;
    transition: all .3s ease;
    position: absolute;
    right: -25px;
    top: 0;
    z-index: 9997;
}
.edit-close:hover {
    opacity: 1;
}
.edit-check {
    background-color: rgb(83, 180, 3);
    width: 20px;
    height: 41%;
    border-radius: 0 5px 5px 0;
    padding: 5px;
    cursor: pointer;
    opacity: .8;
    transition: all .3s ease;
    position: absolute;
    right: -25px;
    bottom: 24px;
    z-index: 9997;
}
.edit-check:hover {
    opacity: 1;
}
.status-menu {
    position: absolute;
    width: 150%;
    background-color: rgb(102 97 72 / 75%);
    top: 0;
    display: none;
    flex-direction: column;
    justify-content: center;
    left: 0;
    padding: 10px;
    border-radius: 5px;
    z-index: 99999999;
}
.status-menu div {
    margin-bottom: 5px;
}
.popup-menu {
    position: absolute;
    background-color: rgb(82 69 5 / 91%);
    color: white;
    width: 200px;
    left: -180px;
    padding: 10px;
    border-radius: 5px;
    display: none;
    flex-direction: column;
    z-index: 99999999999;
}
.popup-menu-btn {
    display: flex;
    width: 90%;
    margin-inline: auto;
    margin-bottom: 5px;
    background-color: transparent;
    padding: 10px 5px 5px 5px;
    border-radius: 5px;
    justify-content: center;
    text-align: center;
    align-items: center;
    transition: all .3s ease;
}
.popup-menu-btn:hover {
    background-color: #fed534;
    color: rgb(81, 50, 9);
}

.new-task-area {
    width: 95%;
    resize: none;
    outline: none;
    padding: 5px;
    margin-inline: auto;
    background-color: transparent;
    border: none;
    caret-color: white;
    color: white;
    font-size: 16px;
    display: inline-table;
    margin-bottom: 15px;
}
.new-task-area::placeholder {
    color: rgb(189, 189, 189);
    font-family: fontRegular;
}
.new-task-comment {
    width: 95%;
    resize: none;
    outline: none;
    padding: 5px;
    margin-inline: auto;
    background-color: transparent;
    border: none;
    caret-color: white;
    color: white;
    display: inline-table;
    font-size: 16px;
    margin-bottom: 15px;
    margin-top: 10px;
    border-radius: 5px;
    font-size: 14px;
    font-family: fontLight;
}
.new-task-comment::placeholder {
    color: rgb(189, 189, 189);
    font-family: fontRegular;
}
.tipicalinput {
    width: 90%;
    margin-inline: auto;
    margin: 5px;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #fed534;
    background-color: transparent;
    color: white;
    text-align: center;
    cursor: pointer;
}

input[type="datetime-local"] {
    position: relative;
    text-align: center;
    font-family: fontRegular;
  }
  
  input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    color: transparent;
    background: transparent;
    cursor: pointer;
  }
  
  input[type="datetime-local"]::-webkit-inner-spin-button,
  input[type="datetime-local"]::-webkit-clear-button {
    z-index: -10;
  }
  
  input[type="datetime-local"]::-webkit-input-placeholder {
    z-index: 99;
  }
  
  input[type="datetime-local"]:placeholder {
    z-index: 99;
  }
  input[type="datetime-local"]:not(.has-value):before {
    content: attr(placeholder);
    width: 100%;
  }

  .tipicalbtn {
    background-color: #d2ad19;
    color: white;
    border-radius: 5px;
    padding: 5px 5px 5px 5px;
    text-align: center;
    cursor: pointer;
    transition: all .3s ease;
    display: flex;
    justify-content: center;
    border: none;
    outline: none;
  }
  .tipicalbtn:hover {
    background-color: #fed534;
    color: rgb(81, 50, 9);
  }

  #new-task-btn {
    display: none;
  }
  #new-task-1 {
    display: none;
  }

  #new-task-btn2 {
    display: none;
  }
  #new-task-2 {
    display: none;
  }
  #new-task-btn3 {
    display: none;
  }
  #new-task-3 {
    display: none;
  }
  #new-task-btn4 {
    display: none;
  }
  #new-task-4 {
    display: none;
  }

  .close-new-task {
    width: 20px;
    height: 20px;
    padding: 5px;
    border-radius: 5px;
    background-color: rgba(207, 119, 31, 0.792);
    transition: all .3s ease;
    cursor: pointer;
    position: absolute;
    right: -10px;
    top: -10px;
    opacity: .6;
    display: none;
  }
  .close-new-task:hover {
    opacity: 1;
  }
  .nt-loading {
    width: 100%;
    height: 100%;
    z-index: 9999999999;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
    border-radius: 10px;
  }
  .nt-loading2 {
    width: 100%;
    height: 100%;
    z-index: 9999999999;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
    border-radius: 10px;
  }
  .nt-loading3 {
    width: 100%;
    height: 100%;
    z-index: 9999999999;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
    border-radius: 10px;
  }
  .nt-loading4 {
    width: 100%;
    height: 100%;
    z-index: 9999999999;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
    border-radius: 10px;
  }
  .nt-loading-img {
    display: flex;
    margin: auto;
    width: 20%;
    height: 20%;
    animation: loading 5s infinite;
    transform: rotate(0deg);
    transition: all .3s ease;
  }

@keyframes loading {
    0% {transform: rotate(0deg);}
    50% {transform: rotate(1800deg);}
    100% {transform: rotate(360deg);}
}

.dead {
    color: white;
    background-color: #782c2c;
    padding: 5px;
    border-radius: 5px;
    margin-left: 5px;
    font-size: 12px;
}
.dead2 {
    color: white;
    background-color: #9d810e;
    padding: 5px;
    border-radius: 5px;
    margin-left: 5px;
    font-size: 12px;
    text-align: center;
}
.dead3 {
    color: white;
    background-color: #e3090987;
    padding: 5px;
    border-radius: 5px;
    font-size: 12px;
    text-align: center;
}
.deadimg {
    width: 20px;
    height: auto;
    margin-left: 10px;
    background-color: #e2030387;
    padding: 3px;
    border-radius: 5px;
}

#deadedit {
    padding: 5px 10px;
    border-radius: 3px;
    background-color: rgba(247, 207, 8, 0.265);
    display: inline-block;
    cursor: pointer;
    transition: all .3s ease;
    position: relative;
    z-index: 9999;
}
#deadedit:hover {
    background-color: rgba(247, 207, 8, 0.362);
}
.deadedit-input {
    position: absolute;
    z-index: 9999;
    background-color: rgba(99, 84, 4, 0.823);
    padding: 10px;
    border-radius: 5px;
    top: 0;
    left: 0;
    width: auto;
    display: none;
}
.editdead-close {
    width: 10px;
    height: 10px;
    padding: 5px;
    border-radius: 5px;
    position: absolute;
    right: -10px;
    top: -10px;
    background-color: rgb(167, 56, 0);
    opacity: .6;
    transition: all .3s ease;
    cursor: pointer;
    z-index: 99999;
}
.editdead-close:hover {
    opacity: 1;
}

.task-edit-area {
    background-color: transparent;
    font-family: fontRegular;
    font-size: 16px;
    color: white;
    width: 95%;
    padding: 10px 5px 5px 5px;
    border: none;
    outline: none;
    border-top: 2px solid #d2ad19;
    display: none;
    resize: none;
    box-sizing: border-box;
}

.comcom {
    background-color: #cebf9887;
    padding: 5px;
    border-radius: 5px;
    margin-left: 5px;
    font-size: 12px;
    text-align: center;
    color: #3c2b00;
}

.priority-mark {
    width: 10px;
    height: 10px;
    border-radius: 5000px;
    background-color: rgb(243, 87, 87);
    position: absolute;
    top: 10px;
    left: 10px;
    transition: all .3s ease;
    opacity: .6;
}
.mark-help {
    background-color: rgba(0, 0, 0, 0.677);
    display: none;
    flex-direction: row;
    position: absolute;
    padding: 10px 5px 5px 5px;
    border-radius: 5px;
    top: 0;
    left: 20px;
    white-space: nowrap;
}
.priority-mark:hover {
    opacity: 1;
}
.prime {
    background-color: #f7950859;
}
.hidden {
    z-index: -9999;
    opacity: 0;
    position: absolute;
    top: -99999px;
    left: -99999px;
}
.logo {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 3%;
    opacity: .6;
    transition: all .3s ease;
}
.logo:hover {
    opacity: 1;
    transform: scale(1.1);
}
.logo svg{
    width: 40%;
}
.logo2 {
    display: none;
    justify-content: center;
    position: absolute;
    bottom: 3%;
    opacity: .6;
    transition: all .3s ease;
}
.logo2:hover {
    opacity: 1;
    transform: scale(1.1);
}
.logo2 svg{
    width: 60%;
}
.cls-1 {
    fill: #f9cf00;
}

.mobile-menu {
    display: none;
}
.mob-decor {
    display: none;
}
.mob-decor2 {
    display: none;
}

.autho-block {
    background-color: rgba(255, 255, 255, 0.082);
    position: absolute;
    left: 50%;
    top: 5%;
    width: 25%;
    transform: translate(-50%, 0);
    padding: 50px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
}
.autho-logo {
    width: 50%;
    display: flex;
    margin-inline: auto;
    margin-bottom: 30px;
    cursor: pointer;
}
.autho-type {
    display: flex;
    flex-direction: row;
    margin-bottom: 30px;
    justify-content: space-between;
    position: relative;
    font-size: 19px;
}
.autho-login {
    margin-bottom: 5px;
    display: flex;
    text-align: center;
    width: 50%;
    justify-content: center;
    cursor: pointer;
    opacity: 1;
}
.autho-login:hover {
    opacity: .8;
}
.autho-signup {
    margin-bottom: 5px;
    display: flex;
    text-align: center;
    width: 50%;
    justify-content: center;
    cursor: pointer;
    opacity: .6;
    transition: all .3s ease;
}
.autho-signup:hover {
    opacity: .8;
}
.autho-decor {
    position: absolute;
    height: 1px;
    width: 50%;
    bottom: -1px;
    transition: all .3s ease;
    left: 0;
    background-color: #f2ce0c;
    transition: all .3s ease;
}
.frame-wrap {
    overflow: hidden;
    width: 100%;
    position: relative;
    padding: 10px 0 10px 0;
}
.form-frame {
    display: flex;
    flex-direction: row;
    width: 100%;
    position: relative;
    left: 0;
    transition: all .3s ease;
}
.autho-login-block {
    min-width: 100%;
    display: block;
    flex-direction: column;
    text-align: center;
}
.autho-forget-block {
    min-width: 100%;
    display: block;
    flex-direction: column;
    text-align: center;
}
.autho-signup-block {
    min-width: 100%;
}
.signup-code {
    min-width: 100%;
}
.autho-label {
    margin-bottom: 5px;
    color: #eddb77;
    text-align: left;
    font-family: fontLight;
    line-height: 20px;
}
.autho-input {
    margin-bottom: 20px;
    background-color: transparent;
    outline: none;
    border: none;
    color: white;
    border-bottom: 1px solid #eddb77;
    padding: 5px 0 10px 0;
    margin-top: 5px;
    width: 100%;
    border-radius: 0px;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 0;
  -webkit-text-fill-color: white;
  border-bottom: 1px solid #eddb77;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset;
  transition: background-color 5000s ease-in-out 0s;
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(0,174,255,0.04) 50%,rgba(255,255,255,0) 51%,rgba(0,174,255,0.03) 100%);  
}
.authobtn {
    margin-top: 10px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 60%;
}
.forget {
    text-align: center;
    margin-top: 20px;
    color: white;
    font-family: fontLight;
    padding-bottom: 5px;
    border-bottom: 1px solid white;
    font-size: 12px;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    transition: all .3s ease;
    opacity: .6;
}
.forget:hover {
    opacity: 1;
}
.forminput {
    position: relative;
}
.showpass {
    position: absolute;
    width: 20px;
    right: 5px;
    top: 10px;
    cursor: pointer;
    z-index: 9999;
    opacity: .6;
    transition: all .3s ease;
}
.showpass:hover {
    opacity: 1;
}
#warning {
    font-size: 10px;
    color: red;
    display: flex;
    margin-bottom: 10px;
}
#reg-code {
    display: block;
    font-size: 50px;
    position: relative;
    text-align: center;
    padding-top: 10px;
}
.telegram-btn {
    background-color: #2F9BDB;
    color: white;
    text-decoration: none;
    padding: 15px;
    border-radius: 5000px;
    display: flex;
    margin-top: 30px;
    justify-content: center;
    align-items: center;
    transition: all .3s ease;
}
.telegram-btn:hover {
    background-color: #4eb3ee;
}
.telegram-btn img {
    height: 30px;
    margin-right: 20px;
}
#copyBtn-reg {
    display: flex;
    margin-inline: auto;
    margin-top: 15px;
    background-color: #ffff00;
    border: none;
    padding: 3px 10px;
    color: #2b2b2b;
    border-radius: 5000px;
    opacity: .6;
    transition: all .3s ease;
    cursor: pointer;
}
#copyBtn-reg:hover {
    opacity: 1;
}
.qr-block {
    position: relative;
    width: 60%;
    margin-top: 20px;
    display: none;
    margin-inline: auto;
}
.botqr {
    background-color: rgba(255, 255, 255, 0);
    padding: 5px;
    border-radius: 10px;
}
.qrgif {
    overflow: hidden;
    border-radius: 5000px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 18%;
}
.telegtag {
    margin-top: 20px;
    font-size: 21px;
    display: flex;
    justify-content: center;
    text-align: center;
    font-family: fontLight;
    color: #d2ad19;
}
.reg-wrap {
    margin-top: 15px;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    border: 2px solid yellow;
}
.spoiler {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    filter: contrast(0.85);
    opacity: 1;
    transition: all .3s ease;
}
.copy-block {
    display: flex;
    flex-direction: column;
    position: relative;
}
.copy-alert {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 10%);
    z-index: -9;
    opacity: 0;
    transition: all .3s ease;
}
.desk {
    font-size: 12px;
    display: ruby-text;
}
a {
    color: yellow;
    transition: all .3s ease;
    cursor: pointer;
}
a:hover {
    color: #ff9d00;
}
.menu-point:hover {
    color: white;
}
.whatis {
    width: 10px;
    height: 10px;
    border-radius: 50000px;
    padding: 5px;
    background-color: #d2ad19;
    margin-left: 10px;
    position: relative;
    cursor: pointer;
    transform: translate(0, 3px);
    background-image: url(img/q.svg);
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center;
}
.cookie-whatis {
    display: none;
    position: absolute;
    left: 40px;
    top: 0;
    width: 200px;
    background-color: #d2ad19;
    padding: 5px;
    color: #0c0c0c;
    line-height: 13px;
    border-radius: 5px;
    text-align: center;
}

.invite-block {
    display: block;
    flex-direction: column;
    padding: 15px;
    border-radius: 10px;
    border: 2px solid yellow;
    position: absolute;
    left: 50%;
    top: 20px;
    transform: translate(-50%, 0);
    width: 50%;
    justify-content: center;
}
.invite-logo {
    width: 30%;
    display: flex;
    margin-inline: auto;
    margin-top: 20px;
    margin-bottom: 50px;
}
.invite-title {
    font-size: 19px;
    text-align: center;
    margin-bottom: 50px;
}
.invite-team {
    font-size: 21px;
    color: yellow;
}
#invite-accept {
    margin-bottom: 30px;
    margin-inline: auto;
    width: 60%;
}
.tipicalbtn2 {
    display: inline-block;
    margin-left: 50%;
    transform: translate(-50%, 0);
    padding: 0 0 5px 0;
    border-bottom: 1px solid white;
    margin-top: 20px;
    margin-bottom: 50px;
    font-size: 14px;
    font-family: fontLight;
    cursor: pointer;
    transition: all .3s ease;
    text-align: center;
}
.tipicalbtn2:hover {
    color: rgb(255, 93, 93);
    border-bottom: 1px solid rgb(255, 93, 93);
}

.link {
    margin-left: 5px;
}
.lw {
    text-align: center;
    padding: 20px 10px;
    border-radius: 5px;
    border: 1px solid red;
    display: flex;
    justify-content: center;
}

.delite-block {
    position: fixed;
    top: -150%;
    left: 50%;
    background-color: #734219;
    height: 30%;
    width: 70%;
    padding: 2%;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
    transform: translate(-50%, 0);
}
.abc {
    text-align: center;
    font-size: 12px;
    margin-bottom: 10px;
}
.teamdis {
    margin-right: 10px;
    cursor: pointer;
    background-color: transparent;
    transition: all .3s ease;
    padding: 5px;
    border-radius: 5px;
    width: 20px;
    border: 1px solid transparent;
}
.teamdis:hover {
    border: 1px solid #ff7a7a;
}

.exit-team-block {
    position: fixed;
    top: -100vh;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    width: 60%;
    background-color: rgb(30, 30, 30);
    left: 50%;
    transform: translate(-50%, 0);
    padding: 15px;
    border-radius: 10px;
    transition: all .3s ease;
    border: 2px solid rgb(255, 93, 93);
}
.team-context {
    display: flex;
    flex-direction: row;
}
.team-context-btn {
    width: 20px;
    padding: 10px 20px;
    cursor: pointer;
    transition: all .3s ease;
    border-radius: 10px;
}
.team-context-btn:hover {
    background-color: rgba(255, 255, 0, 0.173);
}
.team-context-block {
    position: relative;
}
.context-menu {
    position: fixed;
    top: -100vh;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    width: 30%;
    background-color: rgb(30, 30, 30);
    left: 50%;
    transform: translate(-50%, 0);
    padding: 20px 15px;
    border-radius: 10px;
    transition: all .3s ease;
    border: 2px solid yellow;
    min-height: 30vh;
    overflow: hidden;
    height: 20vh;
}
#close-context {
    width: 20px;
    padding: 10px;
    border-radius: 5px;
    transition: all .3s ease;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}
#close-context:hover {
    background-color: rgb(167, 56, 0);
}
.change-owner-form {
    background-color: rgb(30, 30, 30);
    position: absolute;
    top: -150%;
    left: 0;
    width: calc(100% - 30px);
    height: 100%;
    padding: 15px;
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
}
.jobtitle-form {
    background-color: rgb(30, 30, 30);
    position: absolute;
    top: -150%;
    left: 0;
    width: calc(100% - 30px);
    height: 100%;
    padding: 15px;
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
    overflow: scroll;
}

.star {
    width: 20px;
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px;
    border-radius: 500000px;
    border: 1px solid white;
}
.crown {
    width: 15px;
    padding: 5px;
    border-radius: 500000px;
    border: 1px solid white;
    margin-left: 10px;
}
.jinfo {
    font-size: 12px;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid yellow;
    margin-left: 10px;
    display: inline-block;
    cursor: help;
}
.marb {
    margin-bottom: 10px;
}
.jinfo2 {
    font-size: 12px;
    color: black;
    padding: 5px 10px;
    border-radius: 50000px;
    border: 1px solid yellow;
    display: inline-block;
    outline: none;
    background-color: yellow;
    max-width: 90%;
    text-align: center;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
#youowner {
    position: fixed;
    left: 50%;
    top: -150vh;
    width: 30%;
    border: 2px solid red;
    padding: 15px;
    border-radius: 10px;
    background-color: rgb(30, 30, 30);
    z-index: 99999999999;
    line-height: 25px;
    text-align: center;
    transform: translate(-50%, 0);
    transition: all .3s ease;
}

.pop-win {
    background-color: rgb(30, 30, 30);
    border: 1px solid rgba(255, 38, 0, 0.739);
    width: 60%;
    position: absolute;
    z-index: 999999;
    padding: 25px;
    border-radius: 10px;
    left: 50%;
    top: -500px;
    transform: translate(-50%, 0);
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
}
.pop-win span {
    margin-bottom: 10px;
    text-align: center;
}

.set-desk {
    margin-top: 20px;
    text-align: center;
    margin-bottom: 30px;
}
.set-block {
    display: flex;
    flex-direction: column;
    padding: 20px;
    width: 60%;
    margin-inline: auto;
    align-items: center;
}
.set-inp {
    width: 90%;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
}
.set-label {
    background-color: #d2ad185e;
    position: absolute;
    padding: 3px;
    border-radius: 5px;
    left: 5px;
    font-size: 12px;
    top: -5px;
}
.set-inp input {
    background-color: #6c581270;
    padding: 5px;
    border-radius: 5px;
    border: none;
    outline: none;
    color: white;
    font-size: 16px;
    margin-top: 5px;
    text-align: center;
    transition: all .3s ease;
    border: 1px solid transparent;
}
.set-inp input:focus {
    background-color: #886f16;
    border: 1px solid white;
}
.set-photo-block {
    width: 200px;
    height: 200px;
    border-radius: 500000000000px;
    margin-bottom: 20px;
    cursor: pointer;
    position: relative;
}
.userpic {
    width: 100%;
    height: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid yellow;
    border-radius: 50000000px;
    object-fit: cover;
}
.sel-p {
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 500000000px;
    cursor: pointer;
}

.jobtitle-list {
    width: 90%;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}
.one-jt {
    margin-bottom: 15px;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #d2ad19;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.jt-context {
    width: 20px;
    cursor: pointer;
    transition: all .3s ease;
    padding: 5px;
    border-radius: 5px;
}
.jt-context:hover {
    background-color: rgba(128, 128, 128, 0.286);
}
.jt-menu {
    position: absolute;
    top: -1px;
    right: -1px;
    padding: 10px;
    background-color: gray;
    border-radius: 5px;
    display: none;
    flex-direction: column;
}
.jt-menu-point {
    border-bottom: 10px;
    cursor: pointer;
    padding: 5px;
    border-radius: 5px;
    transition: all .3s ease;
}
.jt-menu-point:hover {
    background-color: #d2ad19;
}


.parallax-container {
  display: flex;
  min-height: 100vh;
  width: 100%;
  flex-direction: column;
  align-items: start;
  justify-content: start;
  background-attachment: fixed;

  background-image: url(img/land1.jpg);
  background-position: center;
  background-size: cover;
  position: relative;

}
.buffer {
  width: 100%;
  min-height: 20vh;
  background-color: #FAC710;
  display: flex;
  margin-inline: auto;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: black;
  font-size: 19px;
  line-height: 25px;
}

.parallax-container2 {
  flex-direction: row;
  flex-wrap: wrap;

  /* padding: 6rem 0; */
  background-image: url(img/land2.jpg);
  gap: 1.6em;
}
.promo-main {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
.land-filtr {
  width: 100%;
  min-height: 100vh;
  background-color: rgba(0, 0, 0, 0.581);
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
}
.land-filtr::after {
  content: '';
}
.hello-block {
  z-index: 2;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  margin-left: 7%;
  font-family: fontLight;
  margin-top: 15%;
}
.hello-title {
  font-size: 40px;
  margin-bottom: 15px;
  color: #FAC710;
  font-family: "Red Rose", serif;
  font-weight: 350;
}
.hello-title2 {
  font-size: 21px;
  margin-bottom: 30px;
}
.hello-desc {
  text-align: center;
  font-size: 26px;
  line-height: 40px;
  padding: 15px;
  /* background-color: rgba(0, 0, 0, 0.596); */
  margin-bottom: 40px;
  border-radius: 10px;
  color: rgba(255, 255, 255, 0.565);
}
.tologin {
  padding: 15px 30px;
  color: black;
  background-color: #FAC710;
  text-decoration: none;
  font-family: fontRegular;
  font-size: 20px;
  border-radius: 500000000000000px;
  transition: all .3s ease;
  position: relative;
  text-align: center;
  margin-inline: auto;
}
.tologin:hover {
  color: rgba(0, 0, 0, 0.752);
  background-color: #faa810;
}

.tologin::before {
  content: '';
  position: absolute;
  border: 2px solid #FAC710;
  opacity: 0;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  border-radius: 500px;
  animation: pulse 2s linear infinite;
}
@keyframes pulse {
  0% {
    height: 100%;
    width: 100%;
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    height: 125%;
    width: 105%;
    opacity: 0;
  }
}
.text-logo {
  font-family: "Red Rose", serif;
}
.prem-block {
  z-index: 5;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 80%;
  margin-inline: auto;
  margin-top: 50px;
  height: 100%;
}
.p-title {
  font-size: 40px;
  margin-bottom: 30px;
  color: #FAC710;
}
.promo-cards {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  min-height: 60%;
  margin-bottom: 10px;
}
.p-card {
  width: 35%;
  margin-left: 5%;
  margin-right: 5%;
  margin-bottom: 50px;
  text-align: center;
  background-color: #fac71043;
  backdrop-filter: blur(5px);
  height: 150px;
  border-radius: 10px;
  align-items: center;
  padding: 10px 20px;
}
.pc-title {
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 10px;
  font-size: 19px;
  padding-bottom: 5px;
  border-bottom: 1px solid white;
}
.main-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 60%;
  justify-content: center;
  height: 100%;
  align-items: center;
}
.main-footer img {
  width: 20%;
  margin-right: 2%;
  background-color: rgba(0, 0, 0, 0.707);
  padding: 10px;
  border-radius: 5px;
}
.line {
  height: 80%;
  width: 1px;
  background-color: black;
  margin-right: 2%;
}
.foo-desc {
  font-size: 14px;
  text-align: start;
  line-height: 20px;
}

.bot-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
.bot-logoblock {
  width: 20%;
  margin-top: 20px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.aa {
  width: 100%;
}
.bot-title {
  width: 100%;
  text-align: end;
  color: rgba(255, 255, 255, 0.594);
}
.bot-content {
  margin-top: 50px;
  width: 30%;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 15px;
  padding: 15px;
  border-radius: 15px;
  border: 2px solid yellow;
  margin-bottom: 100px;
}
.asf {
  /* position: absolute; */
  bottom: 0;
  z-index: -99;
}
.bot-title-a {
  font-size: 19px;
  margin-bottom: 15px;
  margin-top: 15px;
}
.bot-stroke {
  text-align: center;
}
.bot-price {
  border: 2px solid yellow;
  border-radius: 5000000000px;
  padding: 15px 20px;
}




@media only screen and (max-width: 1440px) {
  .hello-block {
    margin-top: 12%;
  }
}

@media only screen and (max-width: 1024px) {

  .hello-block {
    margin-top: 17%;
  }
}

@media only screen and (max-width: 768px) {

  .bot-content { 
    width: 90%;
  }
  .bot-logoblock {
    width: 50%;
  }
  .hello-block {
    margin-inline: auto;
    margin-top: 25%;
  }
  .promo-cards {
    width: 100%;
    height: 75%;
  }
  .p-card {
    width: 33%;
    height: 200px;
    margin-bottom: 10px;
  }
  .prem-block {
    margin-top: 30px;
  }
  .p-title {
    margin-bottom: 0;
    text-align: center;
  }
  .pc-desc {
    font-size: 14px;
  }
  .pc-title {
    font-size: 16px;
  }
  .foo-desc {
    font-size: 12px;
    line-height: 17px;
  }
}

@media only screen and (max-width: 425px) {

    .hello-block {
      text-align: center;
    }
    .main-format {
      font-size: 13px;
    }
    .parallax-container2 {
      min-height: initial;
    }
    .land-filtr {
      height: 100%;
    }
    .hello-desc {
      font-size: 21px;
    }
    .p-title {
      margin-bottom: 25px;
    }
    .p-card {
      width: 80%;
      height: 170px;
      margin-bottom: 30px;
    }
    .promo-cards {
      height: 84%;
    }
    .main-footer {
      width: 100%;
    }

    .background {
        width: 100vw;
        height: 100vh;
        background-size: 50vw;
    }
    body {
        width: 100vw;
    }
    .side-menu {
        display: none;
    }
    .openbtn {
        display: none;
    }
    .totalblock {
        width: auto;
        min-height: 100vh;
        margin-top: 20px;
        transition: all .3s ease;
        margin-left: 10px;
    }
    .tasks-wrap {
        gap: 20px;
        width: 150%;
    }
    .task-title {
        font-size: 14px;
    }
    .one-task {
    }
    .mobile-menu {
        position: fixed;
        width: 100vw;
        height: 6vh;
        background-color: rgb(50, 50, 50);
        bottom: 0;
        display: flex;
        flex-direction: column;
        border-radius: 20px 20px 0 0;
        transition: all .3s ease;
        overflow-y: initial;
        z-index: 999999999;
    }
    .mob-decor {
        width: 10%;
        height: 40px;
        border-radius: 2px;
        background-color: #121212;
        position: fixed;
        bottom: 6vh;
        right: 10px;
        transition: all .3s ease;
        opacity: .6;
        display: flex;
        z-index: 9999999999999999999999;
    }
    .mob-decor2 {
        width: 7%;
        height: 30px;
        border-radius: 2px;
        background-color: #121212;
        position: fixed;
        bottom: 6vh;
        right: -500px;
        transition: all .3s ease;
        opacity: .6;
        padding: 5px;
        display: flex;
        z-index: 9999999999999999999999;
    }
    .avatar-block-mob {
        width: 80%;
        margin-inline: auto;
        margin-top: 30px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        position: relative;
    }
    .avatar-userpic-mob {
        width: 50px;
        height: 50px;
        border-radius: 5000000px;
        object-fit: cover;
    }
    .avatar-info-mob {
        margin-left: 20px;
    }
    .avatar-title-mob {
        font-size: 12px;
        color: rgba(240, 248, 255, 0.501);
        font-family: fontLight;
        margin-bottom: 10px;
    }
    .horizont-mob {
        width: 80%;
        border-bottom: 1px solid rgba(240, 248, 255, 0.122);
        margin-inline: auto;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .menu-mob {
        width: 70%;
        margin-inline: auto;
    }
    .menu-points {
        gap: 10px;
    }
    .menu-point {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        text-decoration: none;
        color: aliceblue;
        align-items: end;
        transition: all .3s ease;
        padding: 5px;
        border-radius: 5px;
        margin-bottom: 10px;
    }
    .menu-point-title {
        display: flex;
    }

    .side-calendar-full {
        display: flex;
        justify-content: center;
    }
    .tipicalinput {
        display: flex;
        flex-direction: column;
        min-height: 30px;
        margin-inline: auto;
    }
    .tipicalbtn {
        margin-inline: auto;
    }
    .mini-mob-menu {
        margin-top: 5px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-around;
    }
    .side-calendar-mob {
        background-color: rgba(255, 255, 255, 0.094);
        padding: 5px;
        border-radius: 10px;
        width: auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .side-calendar-mob .side-cal-day {
        font-size: 28px;
    }
    .side-cal-mounth {
        font-size: 12px;
    }
    .side-cal-week {
        font-size: 10px;
        text-align: center;
        font-family: fontLight;
        margin-bottom: 3px;
        background-color: gray;
        padding: 3px;
        border-radius: 5px;
    }
    .mini-cal-mob-floor {
        margin-left: 5px;
    }

    .autho-block {
        top: 2%;
        width: 85%;
        padding: 20px;
    }
    .autho-logo {
        display: block;
    }
    .cookie-whatis {
        top: -60px;
    }
}

@media only screen and (max-width: 375px) {
  .hello-block {
    width: 95%;
  }
  .hello-title {
    font-size: 36px;
  }
  .hello-title2 {
    font-size: 18px;
  }
  .hello-desc {
    font-size: 19px;
    line-height: 30px;
    margin-bottom: 120px;
  }
  .parallax-container {
    background-size: cover;
    min-height: initial;
    height: 100%;
  }
  .parallax-container2 {
    height: initial;
    background-size: auto 100%;
    background-position: 10%;
  }
  .land-filtr {
    min-height: 100%;
  }
  .tologin {
    margin-bottom: 100px;
  }
  .foo-desc {
    color: black;
    text-decoration: none;
  }
  .main-format {
    font-size: 11px;
  }
}