Yasir CSS

body {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #25211E;
    width: 100%;<link href="https://fonts.googleapis.com/css2?family=Dosis:wght@200&display=swap" rel="stylesheet">
}

.picture {
    background-image: url(https://i.imgur.com/x8yS3hl.png);
    background-size: 40vw;
    background-repeat: no-repeat;
    position:absolute;
    bottom: 0vw;
    left: 45vw;
    width: 40vw;
    height: 31.6vw;
    z-index: 1;
    transition: .9s ease-in-out;
    transform: rotate(-0deg);
    pointer-events: none;
    filter: drop-shadow(.3vw .3vw #C9A54B);
}

.name {
    background-image: url(https://i.imgur.com/8DemsWe.png);
    background-size: 25vw;
    background-repeat: no-repeat;
    position: absolute;
    left: 22vw;
    bottom: 16.5vw;
    width: 35vw;
    height: 8.5vw;
    transition: .9s ease-in-out;
    z-index: 10;
    opacity: 1;
    transform: rotate(0deg);
    pointer-events: none;
    filter: drop-shadow(0vw 0vw .2vw #CCC96C);
}

.namebg {
    position: absolute;
    left: 22vw;
    bottom: 15.75vw;
    width: 25vw;
    height: 8.25vw;
    padding-top: 1vw;
    border-top: .5vw solid #C9A54B;
    border-bottom: .5vw solid #C9A54B;
    border-radius: 1vw 1vw 1vw 1vw;
    transition: .9s ease-in-out;
    z-index: 10;
    opacity: 1;
    filter: drop-shadow(.3vw .3vw .4vw #403E3A);
  transform: rotate(0deg);
    pointer-events: none;
    filter: drop-shadow(0vw 0vw .2vw #CCC96C);
}


.tabs {
    position: absolute;
    left: 15vw;
    bottom: 4.8vw;
    width: 3vw;
    height: 10vw;
    z-index: 5;
    transform: rotate(0deg);
    opacity: 1;
    transition: .9s ease-in-out;
  filter: drop-shadow(0vw 0vw .2vw #CCC96C);
}

  body:hover .tabs{
    opacity: 1;
    transition: 2s;
    transition-delay: 1.5s;
}

.tab {
  float: left;
}
.tab label {
  padding: .5vw;
  bottom: -1vw;
  margin-left: -0.5vw;
  position: relative;
  left: 0.5vw;
}
.tab [type=radio] {
  display: none;
}

.content {
  position: absolute;
  bottom: -3.5vw;
  left: 5.25vw;
  width: 26vw;
  height: 11.75vw;
  background: #C9A54B;
  border-left: .45vw solid #635624;
  border-radius: 1vw 1vw 1vw 1vw;
  font-family: 'Bacasime Antique', serif;
  color: #2C2426;
  font-size: 1.25vw;
  padding: 0vw 1vw 1.35vw 1vw;
  opacity: 1;
  transition: 1.5s ease-in-out;
  transition-delay: 1.5s;
  word-wrap: break-word;
  overflow-y: scroll;
}

.ooc {
    position: absolute;
    width: 8vw;
    height: 11.5vw;
    bottom: 1vw;
    left: 50vw;
    border-radius: 1vw 1vw 1vw 1vw;
    font-family: 'Bacasime Antique', serif;
    border-top: .5vw solid #C9A54B;
    line-height: 2vw;
    text-align: center;
    font-size: 1.15vw;
    color: #C9A54B;
    z-index: 4;
    transition: .9s ease-in-out;
    opacity: 1;
    transform: rotate(0deg);
    overflow-y: scroll;
    filter: drop-shadow(0vw 0vw .3vw #CCC96C);
}

body:hover .content{
    opacity: 1;
    transition: 2s;
    transition-delay: 2.5s ease-in-out;
}

.content span {
    float: left;
    color: #fff;
}

.credit {
    position: absolute;
    bottom: 0vw;
    left: 96.4vw;
    width: 24.9vw;
    height: 1.75vw;
    z-index: 100000001;
    opacity: .4;
    transition: .9s ease-out;
    transition-delay: 1s;
    color: #cbdff8;
}


[type=radio]:checked ~ label {
    background: ;

    z-index: 2;
}
[type=radio]:checked ~ label ~ .content {
    z-index: 1;
}


a {color: #000;
          text-decoration: none;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        }

l {
    text-transform: uppercase;
    text-decoration: none;
    color: #4E3E48;
    border: .2vw solid #2A2F31;
    opacity: 1;
    background: #C9A54B;
    padding: .2vw .4vw .1vw .4vw;
}

::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 0.6vw rgba(0,0,0,0.3);
	  border-radius: 0vw;
  	background-color: #;
}

::-webkit-scrollbar
{
	  width: 0vh;
	  background-color: #;
}

::-webkit-scrollbar-thumb
{
  	border-radius: 0vw;
	  -webkit-box-shadow: inset 0 0 0.6vw rgba(0,0,0,.3);
	  background-color: #;
}