::-webkit-scrollbar {
  width: 0; /* remove scrollbar space */
  background: transparent; /* to make scrollbar invisible */
  }
  ::-webkit-scrollbar-thumb {
  background: transparent;
  }

body{
  margin: 0px;
}

.mainBox a{
  color:#b032cf!important;
}

a:hover{
  color:#ff9733!important;
}

#lights{
  background-image: url(https://64.media.tumblr.com/32cf58b17e99eca6facea1f30df559ac/tumblr_inline_p7xoueBhO61rhwzwl_250.gifv);
  background-repeat: repeat-x;
  height:65px;
  position:absolute;
  width: 100%;
  top:0;
  z-index: 1;

}

.feed-title{
  display: none;
}

.feed-item-title{
  font-size: 17px!important;
  background-color: #3399ff;
  padding:3px 5px;
}

.feed-item-title a{
  color: #fff;

}

.feed-item-title a:hover{
  color: #fff;
  text-shadow: none; 

}

.feed-item-desc{
  padding-bottom: 10px;
  border-bottom: 1px dashed #8e8f8f;
}



    #title{
      font-family:GrapeSoda;
      font-size:100px;
      margin-left:30px;
      margin-bottom:-10px;
      filter: drop-shadow(1px 1px 0 black) drop-shadow(-1px 1px 0 black) drop-shadow(0 -1px 0 black) drop-shadow(1px 0 black);
      color:white;
      text-align: left;
      position: relative;
      z-index: 2;

    }
    
    #title img{
      height:130px; 
      margin-bottom:-15px; 
      margin-left:-60px;
    }


    .tree-view{
        font-size:20px;
    }

    .child-small {
      flex: .36;
    }
    .child-half {
      flex: 0.5;
    }

    #plush{
      width:100%;
      height:auto;
      position: relative;
      z-index: 3;
      margin-left: -15px;
  	  margin-top: -30px;
    }
   

    #woof{
      position:absolute;
      height:200px;
      right:10%;
      top:200px;
    }
  
    #welcome{
      border:1px solid black;
      border-radius:10px;
      background-image: url(https://files.catbox.moe/qj6i5v.png);
      background-repeat: repeat;
      background-size: 13px;
      padding:15px;
      position: relative;
    }

    #welcome p{
      border:1px solid black;
      border-radius:10px;
      background-color:white;
      padding:10px 10px;
    }
    
    #header {
      padding:7px;
      padding-right: 9px;
      border:1px solid black;
      border-radius:10px;
      background-color:white;
      margin-bottom: 10px;

    }

    #header img{
      width:100%;
      height:auto;
      border:1px solid black; 
      margin-bottom:5px; 
      image-rendering: none;
      border-radius: 5px;
      margin-bottom: -4px;
    }
    
    #cool{
      position: absolute;
      right:-30px;
      bottom:-10px;
      width: auto;
      height: 4rem;
      image-rendering: pixelated;

    }


  
    
    #about{
      border:1px solid black;
      border-radius:10px;
      padding:5px;
      background-image: url(https://64.media.tumblr.com/f7417fcfd49cd0ae10576d552384981a/tumblr_inline_p7gjobvoCo1rhwzwl_250.png);
      background-position: -5px;
      background-color: #ff963348;

      background-repeat: repeat;
      background-size:40%;
      margin-top:15px;
      display: flex;
      margin-bottom: 10px;     
    }
    

    #about p{
      background-color:white;
      border:1px solid black;
      border-radius:10px;
      padding:8px 10px;
      text-align: left;

    }




    #statuscafe-content{
      border:1px solid #b032cf; 
      padding:5px 10px;
      border-radius: 5px;
       overflow:auto; 
       margin-top:3px;
        height: 42px;
     
    }

    #status{
      border:1px solid black;
      border-radius:10px;
      padding:10px;
      margin-top:10px;
      text-align: left;
      background: #ffffff;
  background: radial-gradient(ellipse,rgba(255, 255, 255, 1) 0%, rgba(255, 151, 51, .5) 100%);
    }

    #statusContainer{
      border-radius:10px;
      border:1px solid black;
      background-color:white;
      padding:30px 10px;
      text-align: left;
    }

    #to{
      border: 1px solid black;
      background-color:white;
      overflow:auto;
      height:135px;
      border-radius: 5px;
      }  

      [role="menuitem"] a{
        color: black !important;
        text-decoration: none!important;
      }

      [role="menuitem"] a:hover{
        color: white !important;
      }

      [role="tab"] a:hover{
        text-decoration: none;
      }

      [role="tabpanel"] {
        height:65px;
        text-align: left;
        overflow:auto;
        }


   .tabs{
    font-size: 15px;
    margin-bottom: -10px;
   }
      
      #tab-A p{
          margin-bottom:10px;
      }

      #tab-B li{
        margin-bottom: 5px;
      }

      

        

      #webrings{
        max-height:320px;
        background-color:white;
        border:1px solid black;
        padding:10px;
        overflow:auto;
        border-radius: 5px;
        margin-top:-15px;
        max-width: 20vw;
      }

      #xenicRing {
        font-size:15px;
        margin-top:10px;
      
      }
      
      #xenicRing #xenicFlag {
        background: url('images/bg/puppygender.webp')!important;
      }
      
      #xenicRing .webring-head {
         padding-bottom: 15px;
        
      }

      details{
        padding-left: 10px;
      }
      details:not(:last-of-type){
        margin-bottom: 10px;
      }

      details > p {
        margin-bottom: 10px;
      }


      #tree img{
        width: 100%;
        height: auto;
        position: absolute;
        bottom:-30px;
        right:0px;
      }

#statuscafe img{
  filter: drop-shadow(1px 0 0 black) 
        drop-shadow(0 1px 0 black)
        drop-shadow(-1px 0 0 black) 
        drop-shadow(0 -1px 0 black);
        float:right;
        shape-outside: ellipse(); 
        height:90px;
         margin-top: -5px;
        z-index: 1;
        margin-left: 10px;
}

#mii{
  height:65px; 
  margin:auto;
  filter: 
    drop-shadow(1px 0 0 black) 
    drop-shadow(0 1px 0 black)
    drop-shadow(-1px 0 0 black) 
    drop-shadow(0 -1px 0 black);
  margin-top:10px;
}



      #tip{
        width: auto;
        text-align: left;
        padding: 5px;
        
      }

  #bigBox{
    border:1px solid black;
    border-radius: 10px;
    padding:20px;
    padding-bottom: 10px;
    background-image: url(https://i.pinimg.com/736x/d1/cc/23/d1cc239d3d76789fab3ea4dc2280b148.jpg);
    background-size: cover;
    
    }

    .littleBox{
      border:1px solid black;
      border-radius: 5px;
      padding:15px;
      backdrop-filter: blur(10px);  
      background: rgb(255, 255, 255);
      }

      #floatie{
        height:300px;
        width:auto;
        position: absolute;
        bottom: -110px;
        right: -180px;

      }

      #clap{
        width: 70%;
        margin:10px auto;
      }
       
      #fish{
        margin-top: 25px;
      }
   
#fish img{
height: 30px;
width: auto;
}

.material-icons{
  color:#b032cf;
}

#audio{
  border:1px solid black;
  border-radius: 5px;
}

      #portrait{
        border:1px solid black;
        border-radius: 5px;
        width: auto;
        height: 235px;
        margin-top: 7px;
    
      }
      #guestbook{
        border:1px solid black;
        border-radius: 5px;
        padding:15px;
        width:calc(100% - 50px);
        margin-top: 7px;
        background-image: url(https://64.media.tumblr.com/2d40d069daa8e830b757b59106e297e8/tumblr_inline_p7gjocnyPg1rhwzwl_100.png);
        background-size: 10%;
        background-position: 5px;
        background-repeat: repeat;  
      }
      #guestbook p{
        border:1px solid black;
        border-radius: 5px;
        padding:40px 20px; 
        background-color: white;
  
      }

      @media (max-width: 800px) {

        #title{
          font-size: 10vw;
        }

        #title img{
          height:14vw ;
          margin-left:-15%;
          }



        .info{
          width: 100%;
        }

        #header {
          width: 50%;
          margin: auto;
          margin-bottom: 10px;
        }

        #clap{
          width: 30%;
        }

        .flexChild {
          width: auto;
        }

        #floatie{
          height:30vw;
          bottom: -14vw;
          right: -16vw;
  
        }
    
      }

      #nowPlaying{
        font-size: 15px;

      }