:root{
    --pink1 :rgba(89, 13, 34);
    --pink2 :rgba(128, 15, 47);
    --pink3 :rgba(164, 19, 60);
    --pink4 :rgba(201, 24, 74);
    --pink5 :rgba(255, 77, 109);
    --pink6 :rgba(255, 117, 143);
    --pink7 :rgba(255, 143, 163);
    --pink8 :rgba(255, 179, 193);
    --pink9 :rgba(255, 204, 213);
    --pink10 :rgba(255, 240, 243);
    
    --pink1-hex :#590D22;
    --pink2-hex :#800F2F;
    --pink3-hex :#A4133C;
    --pink4-hex :#C9184A;
    --pink5-hex :#FF4D6D;
    --pink6-hex :#FF758F;
    --pink7-hex :#FF8FA3;
    --pink8-hex :#FFB3C1;
    --pink9-hex :#FFCCD5;
    --pink10-hex :#FFF0F3;
}
.container1 {
    height: 4vh;
}
.container2 {
    height: 96vh;
    width: 100%;
    /* display: grid;
    grid-template-columns: 300px 1fr; */
}
aside {

}
.bg {
    background-color: #00330b;
}
.bg2 {
    color: white;
    background-color: #00330b;
}

.main-content {
    height: 100%;
}
.content {
    height: 100%;
}
.left-side {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    
}
.right-side {
    width: 20%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 96vh;
}
.right-side-ad {
    width: 20%;

    height: 96vh;
}
.infor {
    height: 18vh;
    
}

.fade-in {
    animation: fadeInUp 0.5s linear;
}
.fade-down {
    animation: fadeIndown 0.75s linear;
}
.cont {
    height: 70vh;
    
    overflow: scroll;

}
.cont-o {
    height: 60vh;
    
    overflow: scroll;

}
.cont-ch {
    height: 65vh;
    overflow: scroll;
    display: flex;
    flex-direction: column-reverse;
}
.cont::-webkit-scrollbar {
    display: none;
}
.cont-o::-webkit-scrollbar {
    display: none;
}
.cont-ch::-webkit-scrollbar {
    display: none;
}

/* popup */
.popup {
    height: 100vh;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    position: fixed;
    z-index:1000;
}
.popd {
    max-width: 900px;
    width: 100%;
   
    top: 0;
    left: 0;
    justify-self: center;

}
.det {
    height: 60%;
    background-color: white;
}
.comtt {
    height: 40vh;
    overflow: scroll;
}
.comtt::-webkit-scrollbar {
    display: none;
}
.cch::-webkit-scrollbar {
    display: none;
}
.cch {
    height: 80vh;

    overflow: scroll;

}
.rep1-d {
    width: 100%;
    height: 65vh;
    overflow: scroll;
}
.bg-primary {
    background-color: #060FB2;
    color: white;
}
@keyframes fadeInUp {
    0% {
      transform: translateY(-100%);
      opacity: 0;
    }
    75% {
      opacity: 0;
    }

    100% {
      transform: translateY(0%);
      opacity: 1;
    }
  }
  @keyframes fadeIndown {
    0% {
      transform: translateY(100%);
      opacity: 0;
    }

    100% {
      transform: translateY(0%);
      opacity: 1;
    }
  }
  .bb {
    height: 15vh;
    overflow:scroll;
  }
  .bb::-webkit-scrollbar {
    display: none;
  }