/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: #524f4f;
  color: #fff;
  font-family: serif;
}


.box {
 width: 555px;
 height: 200px;
 color: #262525;
  position: absolute;
  top: 15px;
  left: 270px;
}

.cont1{
  font-family: 'Yeseva One', cursive;
  width: 850px;
  height: 390px;
  border: 2px solid #262525;
  background: #4a4848;
  position: absolute;
  left: 30px;
  top: 30px;
}

.user {
  font-size: 20px;
  position: absolute;
  top: 15px;
  left: 70px;
  color: #262525;
}

.square {
  width: 130px;
  height:190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
}

.square1 {
  width: 130px;
  height: 190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
  left: 140px;
}

.square2 {
  width: 130px;
  height: 190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
  left: 420px;
}

.square3 {
  width: 130px;
  height: 190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
  left: 560px;
}


.square4 {
  width: 130px;
  height: 190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
  left: 280px;
}

.gib {
  width: 100px;
  height: 100px;
  position: absolute;
  left: 10px;
  top: -5px;
}

.square5 {
  width: 130px;
  height: 190px;
  border: 2px solid #262525;
  position: absolute;
  top: 5px;
  left: 700px;
}

.smlinf {
  position: absolute;
  font-size: 13px;
  top: 200px;
  left: 52px;
  color:#262525;
}

.pfp {
  width: 130px;
  height: 130px;
  position: absolute;
  top: 50px;
  left: 60px;
  border-radius: 50%;
}

.emoji {
  font-size: 20px;
  position: absolute;
  top: 40px;
  left: 5px;
  width: 135px;
}

.title1 {
  font-size:16.5px;
  position: absolute;
  left: 25px;
  top: 5px;
}

.title2 {
  font-size: 16.5px;
  position: absolute;
  left: 47px;
  top: 5px;
}

.links a {
    font-size: 16.5px;
    color: #262525;
  position: absolute;
  left:47px;
   top: 5px;
}

.links a:hover {
  color: #302d33
}

.title4 {
    font-size: 16.5px;
  position: absolute;
  left: 43px;
   top: 5px;
   color: #262525;
}

.title5 {
 font-size: 16.5px;
  position: absolute;
  left: 40px;
   top: 5px;
}

.title6 {
  position: absolute;
  left: 25px;
  font-size: 16.5px;
   top: 5px;
}

.title7 {
  position: absolute;
  font-size: 16.5px;
  left: 35px;
}

.mini {
  font-size: 13px;
  position: absolute;
  top: 30px;
  left: 5px;
  width: 120px;
}

.mini a {
  font-size: 13px;
  color: #262525;
}

.mini a:hover {
  color: #302d33
}

a {
   color: #4a4848;
}

a:hover {
  color: #4a4848
}

.gallery {
  position:absolute; 
  top:250px; 
  left:25px; 
  width: 800px;
  overflow:hidden; 
  white-space: nowrap;
}

.gallery img {    
width: 110px;
height: 110px;
object-fit: cover;
  object-position: 10% 20%;
padding: 10px;
filter: blur(0.85px);
border-radius: 50%;
}

img:hover {
transform: scale(110%);
filter: none;
}



.gallerydeux {
  width: 770px;
  height: 390px;
  border: 2px solid #262525;
  background: #4a4848;
  font-family: 'Yeseva One', cursive;
  position: absolute;
  right: 30px;
  top: 30px;
  overflow-y: scroll;
}

.gallerydeux::-webkit-scrollbar {
  display: none;
}

.hehe {
  font-size: 16.5px;
  position: absolute;
  left: 10px;
  top: 10px;
  color: #262525;
}

.box17 {
  position: absolute;
  right: 30px;
  bottom: 30px;
  height: 360px;
  width: 185px;
  border: 2px solid #262525;
  background: #4a4848;
  overflow: hidden;
}

.text2 {
  position: absolute;
  left: 15px;
  font-size: 13.8px;
}

.catimg {
  position: absolute;
  left: 18px;
  width: 150px;
  height: 150px;
  top: 18px;
}

.catimg2 {
  position: absolute;
  left: 18px;
  bottom: 18px;
  height: 150px;
  width: 150px;
}

.bnjrtxt {
  font-size: 14.6px;
  position: absolute;
  top: 35px;
  left: 10px;
  color: #262525;
  width: 735px;
}


.canigetuhhh{
  width: 179px;
  height: 775px;
  border: 2px solid #262525;
  background: #4a4848;
  position: absolute;
  top: 30px;
  left: 30px;
}

.TITLEZ4 {
  font-size: 16.5px;
  color: #262525;
  position: absolute;
  left: 53px;
  font-family: 'Yeseva One', cursive;
    top: 3px;
}

.ermpoet {
  border: 2px solid #262525;
  width: 400px;
  height: 775px;
  position: absolute;
  left: 220px;
  top: 30px;
  font-family: 'Yeseva One', cursive;
    color: #262525;
  overflow-y: scroll;
  background: #4a4848;
}

.hhe {
  position: absolute;
  left: 160px;
  font-size: 16.5px;
  top: 3px;
}

.week{
  position: absolute;
  top: 35px;
  left: 10px;
  font-size: 15px;
}

.toc {
  font-family: 'Yeseva One', cursive;
  font-size: 15px;
    position: absolute;
  left: 20px;
  top: 35px;
  color: #262525;
}

.mini2 {
  font-size: 13px;
  color: #262525;
}

.ermminiauthor {
  border: 2px solid #262525;
  width: 400px;
  height: 775px;
  position: absolute;
  left: 630px;
  top: 30px;
  background: #4a4848;
  overflow-y: scroll;
}

.ermauthor {
   border: 2px solid #262525;
  width: 400px;
  height: 775px;
  position: absolute;
  left: 1041px;
  top: 30px;
  background: #4a4848;
  overflow-y: scroll;
}

.TITLEC7 {
  font-size: 16.5px;
  color: #262525;
  position: absolute;
  top: 3px;
  font-family: 'Yeseva One', cursive;
  left: 130px;
}

.TITLEC6 {
    font-size: 16.5px;
  color: #262525;
  position: absolute;
  top: 3px;
  font-family: 'Yeseva One', cursive;
  left: 130px;
}

.mini3 {
  font-size: 15px;
  color: #262525;
  font-family: 'Yeseva One', cursive;
  position: absolute;
  left: 10px;
  top: 35px;
}

.mini4 {
  font-size: 15px;
  position: absolute;
  color: #262525;
  font-family: 'Yeseva One', cursive;
  top: 35px;
  left: 10px;
}

.nav {
  height: 775px;
  width: 222px;
  position: absolute;
  right: 30px;
  top: 30px;
  border: 2px solid #262525;
  background: #4a4848;
}


.TITLEC5 {
  color: #262525;
  position: absolute;
  left: 65px;
  top: 3px;
  font-size: 16.5px;
  font-family: 'Yeseva One', cursive;
}

.mini17 {
  font-size: 15px;
  position: absolute;
  top: 35px;
  font-family: 'Yeseva One', cursive;
  left: 20px;
}

.mini17 a {
  color: #262525;
}

.mini17 a:hover {
  color: #302d33;
}


::-webkit-scrollbar-track {
  background: #333131; 
}

::-webkit-scrollbar-thumb {
  background: #403e3e; 
}

::-webkit-scrollbar-thumb:hover {
  background: #2e2d2d;
}


::-webkit-scrollbar {
  width: 12px; 
  height: 12px; 
}

::-webkit-scrollbar-button {
  background: #5e5c5c;
}

.box13 {
  width: 1435px;
  height: 360px;
  position: absolute;
  left: 30px;
  bottom: 30px;
  border: 2px solid #262525;
  background: #4a4848;
}

.title13 {
  color: #262525; 
font-size: 16.5px;
font-family: 'Yeseva One', cursive;
  position: absolute;
  left: 10px;
  top:3px;
}

.mt {
  font-family: 'Yeseva One', cursive;
  font-size: 14.5px;
  position: absolute;
  top: 35px;
  left: 15px;
  color: #262525
}

.catimg13 {
  width: 150px;
  height: 200px;
  position: absolute;
  left: 10px;
  top: 0px;
}

.catimg3 {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 170px;
  top: 0px;
}

.gallerytrois {
  width: 500px;
  height: 290px;
  overflow-x: scroll;
  position: absolute;
  left: 15px;
  bottom: 10px;
}

.catimg11 {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 380px;
}

.catimg12 {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 590px;
}

.catimg9 {
  height: 200px;
  width: 180px;
  position: absolute;
  left: 800px;
}

.catimg8 {
  height: 200px;
  width: 150px;
  position: absolute;
  left: 990px;
}