body {margin:0;
padding:0;
font-family: "Kanit", sans-serif;
background-image:url(https://xixxii.neocities.org/images/bgs/background293.jpg);
background-size:200px;}

* { scrollbar-color:cyan white ;
}

.sriracha-regular {
  font-family: "Sriracha", cursive;
  font-weight: 400;
  font-style: normal;
}

.headerimg {position:relative;
z-index:1;
width:700px;
}

.welc {width:325px;
  background-image:url(https://xixxii.neocities.org/images/personal/paper.png);
 font-family: "Sriracha", cursive;
  font-size:22px;
  line-height:1.1;
  color:#00B2A0;
height:144px;
  z-index:-1;
  margin-top:-40px;
margin-left:100px;
  padding:100px;
rotate:-10deg;}


.top-tape {
  position: absolute;
  height: 4vmin;
  top: -15px;
left:80px;
  width: 50%;
  background-color: var(--tape-gray);
  border-right: 1px dotted var(--tape-edge-gray);
  border-left: 1px dotted var(--tape-edge-gray);
  opacity: 0.5;
z-index:5;
}

.tape-section {
  position: absolute;
  width: 100%;
}

.tape-section:first-of-type {
  top: 0;
}

.tape-section:last-of-type {
  bottom: 0;
}

.tape-section::before,
.tape-section::after {
  content: "";
  width: 10vmin;
  height: 4vmin;
  position: absolute;
  background-color: var(--tape-gray);
  opacity: 0.4;
  border-right: 1px dotted var(--tape-edge-gray);
  border-left: 1px dotted var(--tape-edge-gray);
z-index:2;
}

.tape-section:last-of-type::after {
  transform: rotate(-45deg);
  right: -4vmin;
  top: -3vmin;
}

.tape-section:first-of-type::before {
  transform: rotate(-45deg);
  left: -4vmin;
}

.tape-section:first-of-type::after {
  transform: rotate(45deg);
  right: -4vmin;
  top: 0;
}

.tape-section:last-of-type::before {
  transform: rotate(45deg);
  left: -4vmin;
  bottom: 0;
}

:root {
  --tape-gray: #dbd8be;
  --tape-edge-gray: #b7b49d;
  --transparent: rgba(255, 255, 255, 0);
}

.backnav {position:absolute;
left:15px;
top:260px;}


#bookmarks {position:absolute;
line-height:1.5;
font-family: "Kanit", sans-serif;
top:400px;
left:500px;
background-image:url(https://xixxii.neocities.org/images/frames/bookmarksbg.png);
background-size:400px;
width:400px;
height:573px;
rotate:-5deg}

#bookmarkscontent {
  scrollbar-width:thin;
  line-height:1;
position:relative;
top:-20px;
width:358px;
margin:auto;
overflow:auto;
height:460px;
font-size:1.3em;
}

#bookmarkscontent a {font-weight:400;
transition:0.4s;
color:gold;
text-decoration:underline;
text-shadow: -2px 2px #ef3550,
               -4px 4px #f48fb1,
               -6px 6px #7e57c2,
               -8px 8px #2196f3,
               -10px 10px #26c6da,
               -12px 12px #43a047,
               -14px 14px #eeff41,
               -16px 16px #f9a825,
               -18px 18px #ff5722;

}
#bookmarkscontent a:hover {text-decoration:underline;
font-size:1.2em;
color:white;}

#bookmarkscontent  ul {
    list-style-image: url('https://xixxii.neocities.org/images/berryicon.gif');
}


#bookmarkstitle {position:relative;
color:black;
 -webkit-text-fill-color: cyan;
  -webkit-text-stroke: 2px;
width:fit-content;
margin:auto;
text-align:center;
justify-content:center;
top:-45px;
font-size:50px;}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color:rgba(256,256,256,0.1)
}

.overlay p {font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;}
  
  .overlay a {color:black;}

.backnav:hover {rotate:20deg;}

.media {height:250px;
width:200px;
border-style:double;
border-width:4px;
border-radius:5px;
  border-color:#4237d5;
position:absolute;
  padding:3px;
left:100px;
  font-family: "Kanit", sans-serif;
  font-size:14px;
background: rgb(92,82,223);
background: linear-gradient(0deg, rgba(92,82,223,1) 0%, rgba(153,255,247,1) 82%);
}

.mediacontent {
  font-weight:400;
  line-height:1;
  margin-top:-50px;
  padding-left:4px;
  color:#03036c;
  overflow-y: auto;
  height:230px;
  scrollbar-color: #7fffd4 #e5fff6;
  scrollbar-width:thin;}

h2 {
    font-size: 45px;
  font-weight:600;
  color:white;
padding:1px;
margin-top:-40px;
  margin-left:-15px;
  top: 0;
  rotate:-5deg;
  -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;
}

.month {position:absolute;
left:600px;
top:0px;
}

.thoughtbox {background-image:url("https://xixxii.neocities.org/images/personal/thoughtbox.png");
position:absolute;
  font-weight:400;
  line-height:1;
  left:920px;
  top:140px;
width:686px;
height:469px;
font-family: "Kanit", sans-serif;
  font-size:14px;}

#thought {height:50px;
width:380px;
  padding:20px;
background-color:#f7f7e3;
border-style:solid;
border-width:1px;
border-color:  #e2d6b8;
rotate:5deg;
position:absolute;
top:150px;
left:140px;}

#thought2 {height:50px;
width:380px;
  padding:20px;
background-color:#f7f7e3;
border-style:solid;
border-width:1px;
border-color:  #e2d6b8;
rotate:-5deg;
position:absolute;
top:170px;
left:140px;}

.polaroids {
display:flex;
justify-content:center;
width:fit-content;
position:absolute;
left:980px;
top:600px;;}

.polaroids img {max-height:400px;}

.polaroids > :nth-child(even) {transform:rotate(5deg);}
.polaroids > :nth-child(odd) {transform:rotate(-5deg);}

#thiscountryv {position:absolute;
top:900px;
left:15px;
rotate:2deg;
z-index:-1;}

#greensheep {position:absolute;
width:300px;
left:1300px;}

#kamillebidan {position:absolute;
left:1030px;
top:860px;
width:640px;}

#stupidtime {position:absolute;
width:300px;
left:920px;
top:550px;
rotate:5deg;}