@font-face {
  font-family: msgothic;
  src: url(https://od.lk/d/MTlfNzU4OTU1MjFf/msgothic.ttc);
}

@font-face {
  font-family: mingliub;
  src: url(https://od.lk/d/MTlfNzU4OTU1MjJf/mingliub.ttc);
}


body{
background-image: url(https://u.cubeupload.com/letmeinpls1/coloreditedimage.jpg);
background-repeat: repeat;
color: #614140;
background-size:1650px;
}

#all{
width: 560px;
height: 600px;
position: absolute;
left: 50%;
top: 40%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

#top{
  width:562px;
  height:auto;
  float:top;
  background-image: url(https://u.cubeupload.com/letmeinpls1/Screenshot2025111921.png);
  background-size:570px;
  margin-bottom: 20px;
}

#left{
width: 215px;
height: 600px;
float: left;
}

#lefttop{
background-color: #ebe1dd;
width: 215px;
height: 160px;
margin-bottom: 20px;
background-image: url('https://u.cubeupload.com/letmeinpls1/Beautifulglaze.jpg');
background-size: 100%;
}
  

#leftmiddle{
background-image: url(https://u.cubeupload.com/letmeinpls1/74b92fe3cf6bd69ab4c1.jpg);
background-size:100%;
width: 188px;
height: 260px;
padding: 5px;
border: 1px solid #614140;
text-align: left;
overflow: scroll;
overflow-x: hidden;
margin-bottom:20px;
line-height: 13px;
padding-left: 20px;
}

#leftbottom {
  background-color:#e1eef7;
  width: 185px;
  height:150px;
  padding:15px;
  font-size:15px;
  font-family:"msgothic";
  overflow: scroll;
overflow-x: hidden;
line-height: 13px;
border: 1px solid #614140;
}

h1{
	font-size: 1.4rem;
	letter-spacing: 2px;
	font-weight: normal;
	text-align: center;
	border-bottom: 2px ridge #a47473;
	padding-bottom: 5px;
}

h2 { 
	font-size: 1.25rem;
	font-weight: normal;
	text-align: center;
}
h3 { 
	font-size: 1.1rem;
}
h4 { 
	font-size: 1rem;
	color: #a47473;
	padding-left: 12px;
}

h5{
  margin:1px;
  color:#5B8687;
  font-family:"mingliub";
  	font-size: 1.25rem;
}

i{
  font-family:"mingliub";
  color:#5b8687;
  font-weight:bold;
}
  
#leftmiddle a{
  color:#e1eef7;
}

#leftmiddle a:hover{
  font-style:italic;
  text-decoration:underline;
  color:#B3E8E9;
}

#leftbottom ul, li{
list-style-type: none;
padding: 0px;
letter-spacing: 1px;
}


#right{
float: right;
width: 325px;
height: 600px;
}

#righttop{
background-color: #ebe1dd;
width: 295px;
height: 325px;
padding: 15px;
margin-bottom: 20px;
border: 1px solid #614140;
text-align: center;
overflow: scroll;
overflow-x: hidden;
font-size: 15px;
letter-spacing: 1px;
font-family: "msgothic";
}

.content{
text-align: left;
}

#rightbottom{
background-color: transparent;
width: 295px;
text-align: justify;
font-size: 15px;
letter-spacing: 1px;
font-family: "mingliub";
color: #B3E8E9;
}

::-webkit-scrollbar{
width: 8px; 
}
    
::-webkit-scrollbar-track{
background-color: transparent;
}

::-webkit-scrollbar-thumb{
background-color: #80ad99;  
}

