html {
    background-image: url("https://files.catbox.moe/16llkb.png");
    font-family: SH Pinscher;
    color: rgb(42, 109, 168);
  background-repeat: no-repeat;
  background-attachment: scroll;
    
}

#header {
    background-image: url("https://files.catbox.moe/e9wz93.png");
    width: 900px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 400px;
    
    
}




.marquee {
  height: 25px;
  width: 900px;
border: 3px solid white;
  overflow: hidden;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  background-color: #e1ff5c;
  margin-top: 20px;
  border-radius: 5px;
  color: black;
}

.marquee div {
  display: block;
  width: 200%;
  height: 30px;

  position: absolute;
  overflow: hidden;

  animation: marquee 20s linear infinite;
}

.marquee span {
  float: left;
  width: 50%;
}

@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}


#navbar {
    margin-left: auto;
    margin-right: auto;
    border: 3px solid #1F1508 ;
    width: 900px;
    height: 50px;
    border-radius: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
    background-color: #382B12;
}

#navlinks {
    display: flex;
    padding: 6px;
    text-align: center;
}

#navlinks a {
    text-decoration: none;
    color: #9cf7d4;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 10px;
    height: 35px;
    border-radius: 10px;
    font-size: xx-large;
    font-family: 'Franxurter', sans-serif;
    margin-left: 50px;
}

#navlinks a:nth-child(even) {
    color:#c8f09a
}

#navlinks a:hover {
    color: white;
}

#container {
    width: 1300px;
    display: flex;
    margin-left: auto;
    margin-right: auto;
}

#sidebar1 {
    margin-left: auto;
    width: 200px;
    height: 900px;
    border-width:7px;
}

#sidelinks1 {
    width: 180px;
    padding: 5px;
    margin-bottom: 10px;
    height: 300px;
}

#sidelinks1 a {
    text-decoration: none;
    color: #348365;
    background-color: #60cea0;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 10px;
    height: 35px;
    border-radius: 10px;
    border: #e9ffb6 solid;
    font-size: xx-large;
    font-family: 'Franxurter', sans-serif;
}

#sidelinks1 a:hover {
  color: white;
}

#xtras1{
    width: 180px;
    height: 400px;
    border-width: 10px;
    border-style: solid;
    border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    background: linear-gradient(180deg, #89b844 0%, #e1f1a6 100%);   
    background-clip: padding-box;
     font-size: xxx-large;
    font-family: 'Franxurter', sans-serif;
    text-align: center;
    color:#1a6430;
    
}

#dotha {
    border: solid #7cb8a0;;
    height: 320px;
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    background-color: #d3fdec;
     overflow-y: auto;
    overflow-x: hidden; 
}

#dotha li {
    font-family: SH Pinscher;
    font-size: medium;
    padding: 5px;
    line-height: 10px;
}

#xtras2 {
    border-width: 10px;
    border-style: solid;
    border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    width: 180px;
    height: 170px;
    margin-top: 10px;
    background: linear-gradient(180deg, #96ebeb 0%, #ccffee 100%);   
    background-clip: padding-box; 
       font-family: 'Franxurter', sans-serif;
    text-align: center;
    font-size: xx-large;
}

#sitebox {
    border: dashed #71ad94;;
    width: 150px;
    height: 120px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    background-color: #e0fff2;
      overflow-y: auto;
    overflow-x: hidden;     
}

a {
    display: block;
}

#content1 {
    display: grid;
    grid-template-columns: 200px 200px 200px;
    grid-template-rows: 200px 200px 200px 200px;
    grid-template-areas: 
        "box-1 box-2 box-2"
        "box-3 box-2 box-2"
        "box-3 box-4 box-4"
        "box-5 box-5 box-6"
    ;
    gap: 2em;
    margin-left: auto;
    margin-right: auto;
    
    width: 800px;
    height: 900px;
}

#piccy {
    display: grid;          
    border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    width: 200px;
    height: 200px;
   
    
}

#about {
    display: grid;
 border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    background: linear-gradient(180deg, #89b844 0%, #addd75 100%);   
    background-color: #e1ff5c;
    width: 560px;
    height: 400px;
    background-clip: padding-box;
}

#bark {
    border: #998873 solid;
    border-radius: 60px;
    width: 500px;
    height: 350px;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    background-color: white;
     background: linear-gradient(180deg, #ffffff 0%, #e9ffb6 100%);
    text-align: center;
    padding: 10px;
    font-size: large;
    color: #20a76e;
}

#welcome {
    color: #4e310b;
    font-family: 'Franxurter', sans-serif;                                                                     
    background-image: radial-gradient(#96eecc 50%, transparent 80%); 
    margin-top: 10px;
    text-align: center; 
    font-size: xxx-large;                                         
}   

#log {
 border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;      
  background: linear-gradient(180deg, #ffffff 0%, #68dbab 100%);  
    width: 200px;
    height: 400px;
    background-clip: padding-box;
    font-family: 'Franxurter', sans-serif; 
    font-size: xxx-large;
    text-align: center;
    color: #2d9688;
}


#updatetxt {
    border: dashed #2fa894;
    height: 330px;
    width: 180px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3px;
    border-radius: 10px;
    background-color: #edfff9;
    font-family: SH Pinscher;
    font-size: medium;
    overflow-y: auto;
    overflow-x: hidden;      
    padding-left: 5px;
}


#todo {
    border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    display: grid;
    width: 560px;
    background: linear-gradient(180deg, #fff09e 0%, #82ebbf 100%);  
    background-clip: padding-box;
}

#mood {
    border: rgb(255, 248, 230) solid;
    width: 250px;
    height: 150px;
    margin-top: 15px;
    margin-left: 15px;
    border-radius: 10px;
    background-color: rgb(255, 248, 230);
    font-family: 'Franxurter', sans-serif; 
    text-align: center;
    font-size: x-large;
    color: #6e5533;
    letter-spacing: 5px;
}

#ham {
    margin-right: auto;
    height: 50px;
    width: 78px;
    margin-top: 20px;
}

#busnus {
    height: 90px;
    width: 150px;
    margin-left: 70px;
    margin-top: -40px;
    margin-right: 5px;
    line-height: 18px;
    text-align: center;
    color: #409478;
}

#busnus p {
    font-family: SH Pinscher;
    line-height: 4px;
}

#now {
        border: rgb(255, 248, 230) solid;
    width: 250px;
    height: 150px;
    margin-top: -162px;
    margin-left: 290px;
    border-radius: 10px;
    background-color: rgb(255, 248, 230);
    font-family: 'Franxurter', sans-serif; 
    text-align: center;
    font-size: x-large;
    color: #6e5533;
    letter-spacing: 5px;
}

#nowbus{
    border-radius: 10px;
    height: 110px;
    width: 210px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    background-color: white;
    overflow-y: auto;
    overflow-x: hidden;
}

#nowbus p {
    font-family: SH Pinscher;
    font-size: medium;
    letter-spacing: 1px;
}

#box {
    border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    display: grid;
    width: 400px;
    height: 250px;
    background: linear-gradient(180deg, #bda67b 0%, #4e310b 100%);  
    background-clip: padding-box;
}



#yt {
   font-family: 'Franxurter', sans-serif; 
   color: rgb(61, 38, 9);
   margin-left: auto;
   margin-right: auto;
   font-size: xx-large;
   margin-top: 10px; 
}

#ytbox {
    height: 180px;
    width: 350px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -6px;
    border: white solid;
    border-radius: 10px;
    overflow: hidden ;
}



#box2 {
    display: grid;
    border-width: 10px;
border-style: solid;
border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    width: 340px;
    height: 250px;
    background: linear-gradient(180deg, #c2ff7c 0%, #ffffff 100%);  
    background-clip: padding-box;
    margin-left: -30px;
}

#topalbum {
   font-family: 'Franxurter', sans-serif;
   margin-left: auto;
   margin-right: auto;
   color: #348365;
   font-size: xx-large;
   text-align: center;  
   line-height: 25px;
   margin-top: 10px;

}

#albumcont {
    margin-left: 20px;
    height: 150px;
    width: 150px;
    border-radius: 10px;
    text-align: center;
    margin-top: -1px;
    font-size: xx-large;
    color: #2d7572;
    line-height: 1px;
    font-family: 'Franxurter', sans-serif;
}

#albumcont img {
    margin-top: -15px;
}

#albinfo {
    height: 40px;
    width: 130px;
    margin-left: 180px;
}

#albinfo img {
    border: rgb(216, 181, 116) solid;
    margin-top: -300px;
    border-radius: 10px;
    margin-right: auto;

}

#sidebar2 {
    margin-left: 1px;
    margin-right: auto;
    width: 210px;
}

#dos1 {
    text-align: center;
    padding: 5px;
    background-clip: padding-box;
    background-color: #382B12;
    width: 210px;
    height: 400px;
    border-width: 10px;
    border-style: solid;
    border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
}

#dos2 {
    border-width: 10px;
    border-style: solid;
    border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    width: 220px;
    height: 200px;
    margin-top: 20px;
    background: linear-gradient(180deg, #4e310b 0%, #dbaf6d 100%);  
    background-clip: padding-box;
     font-family: 'Franxurter', sans-serif;
     text-align: center;
     line-height: 30px;
     color: rgb(255, 238, 212);
     letter-spacing: 2px;
     font-size: xx-large;
}

#buttonl {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    height: 60px;
    margin-top: -40px;
    overflow-y: auto;
    overflow-x: hidden;
}

#meh {
    margin-top: -25px;
    height: 90px;
    margin-bottom: 100px;
}

#meh img {
    margin-top: -80px;
    margin-bottom: 20px;
}

#dos3 {
    border-width: 10px;
    border-style: solid;
    border-image: url("https://file.garden/ZZ2PUl9MPilKgIvB/collection/borders/fp9ci4.png") 8 fill round;
    width: 220px;
    height: 200px;
    margin-top: 20px;
    background: linear-gradient(180deg, #c8fff3 0%, #64dba0 100%);  
    background-clip: padding-box;
    font-family: 'Franxurter', sans-serif;
     text-align: center;
     font-size: x-large;
}

#fanbox {
    border: dashed;
    width: 200px;
    height: 120px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    background-color: rgb(220, 255, 246);
      overflow-y: auto;
    overflow-x: hidden;
}

.marquee2 {
  height: 100px;
  width: 800px;
  overflow: hidden;
  position: relative;
  margin-left: 550px;
  margin-right: auto;
  margin-top: 70px;
}