
 .guestbooktitle {  font-family: var(--heading-font);
  font-size: 3em;
  font-weight: bold;
  font-style:italic;
  color: #89d1ff;
  position: absolute;
   margin-left:3px;
   z-index:40;
    text-shadow: -1px -1px 0 #5395d7, 1px -1px 0 #5395d7, -1px 1px 0 #5395d7, 1px 1px 0 #5395d7;}
      
       .guestbooktitle2 { font-family: var(--heading-font);
          z-index:30;
        font-size: 3em;
        font-weight: bold;
        font-style:italic;
        color: #2586d2;
        position: absolute;
              text-shadow: 0 0 10px #fff, 0 0 20px #ffffff, 0 0 30px #ffffff, 0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff;}
      
      .iframecontainer {height: 303px; width: 280px; position:absolute;   border-width: 10px; 
                border-style: solid;
            border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;  
}
      
        .atabookcontainer { top:30%; margin-left:650px; position:absolute}
      /* -------------------------------------------------------- */
      /* VARIABLES */
      /* -------------------------------------------------------- */

      /* Variables are used like this: var(--text-color) */
      :root {
        /* Background Colors: */
        --background-color: #eeeeee;
        --content-background-color: #ffffff;
        --sidebar-background-color: #ffffff;

     /* Text Colors: */
  --text-color:#2076b9;
  --sidebar-text-color: #000000;
  --link-color: #268ee8;
  --link-color-hover: #a8ddff;

        /* Text: */
        --font: Willow;
        --heading-font: Willow;
        --font-size: 14px;

        /* Other Settings: */
        --margin: 0px;
        --padding: 20px;

        --round-borders: 0px;
        
      }

      /* -------------------------------------------------------- */
      /* BASICS */
      /* -------------------------------------------------------- */

      * {
        box-sizing: border-box;
      }

      @font-face {
        font-family: "willow";
          src: url("fonts/willow.ttf");
          }

b {color:#ff68b7}

      body {overflow-x:hidden;
      cursor: url(pixels/heartcursor.png), auto;
      font-family: 'willow';
        min-height: 100vh;
        font-size: var(--font-size);
        padding: var(--margin);
         color: #2076b9;
        font-family: var(--font);
        line-height: 1.2;
      }
      ::selection {
        /* (Text highlighted by the user) */
        background: rgba(0, 0, 0, 0.2);
      }

      
      
      mark {
        /* Text highlighted by using the <mark> element */
        text-shadow: 1px 1px 4px var(--link-color);
        background-color: inherit;
        color: var(--text-color);
      }

      /* Links: */
      a {
        text-decoration: underline;
          cursor: url(pixels/heartcursorclick.png), auto;
      }

      a,
      a:visited {
        color: var(--link-color);
      }

      a:hover,
      a:focus {
        color: var(--link-color-hover);
        text-decoration: none;
      }

      /* -------------------------------------------------------- */
      /* LAYOUT */
      /* -------------------------------------------------------- */
      .fa, .fab {text-decoration:none; margin:4px}

      
      #listen {margin-top:6px; margin-bottom:6px; font-size: 18px}
      
      section {margin-bottom:20px;}
      
          .bebidora {width:205px; height: 135px; background-image: url(images/bebidora.png); background-size:contain; z-index:20; background-repeat:no-repeat;  bottom:0%; margin-left:826px; position:fixed; z-index:50}
      
     

       
     #mainbody {background-image:url(bg/bluegingham.png); 
       height:auto;     
        border-radius: 10px;
        width:486px;
       padding-top:30px;
       padding-bottom:15px;
      padding-left:8px;
       padding-right:8px;
        text-align: center;
       }


    
      
    
        main .boxcontainer {

        background-image:url(bg/bluestarry2.png);
        padding: 4px;
       margin-bottom:10px;
        border-radius: 10px;
        overflow: hidden;
      
        text-align: center;}
      
     
      
      #introimage img { border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;}
      
      .descriptionbox {font-size:13px; background:white;  width:300px; height:238px; border-radius:8px; margin-left:10px; text-align:left; padding:8px;  margin:auto; }
      
        .introphoto { width:120px; height:120px; margin-left:10px; background-image:url(images/amadora.png); background-size: cover;}
    
   
      /* -------------------------------------------------------- */
      /* HEADER */
      /* -------------------------------------------------------- */


     
  .mx-3 {
height:22px; width:100%;

position: absolute; height:23px;border-radius:15px; border: solid 1.5px #81b9f1;

 
}
 
      .audiocover {border-radius:15px; position: absolute; height: 22px; background: rgba(255, 255, 255, 0.52); width: 240px; z-index:-1}
      
      .audioholder {width: 242px; height:60px; margin-top:-79px; margin-left:-14px; position:absolute}
      .musicnote {  display: inline-block;}
      #songtitle {width: 210px;   display: inline-block; font-size:11pt; color:#2076b9; font-weight:bold;       text-shadow: 0 0 10px #fff, 0 0 20px #ffffff, 0 0 30px #ffffff, 0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff;}
      
    
      
      header {
        grid-area: header;
         height: 198px;
        font-size: 1.2em;
        border: var(--border);
        border-radius: var(--round-borders);
         background-image:url(images/cutout.png);
          background-size: cover;
        background-repeat: no-repeat;
        position:relative;
          border-bottom: #78b6f4 1.5px solid;
        width: 100%;
      }

      .header-content {
        padding: var(--padding);    position:relative;
      }

    
         #rainbow {z-index:20;  margin-top:-18px;  font-size: 1.8em; position: absolute}
      
      #rainbow2 {z-index:10; margin-top:-18px;  font-size: 1.8em; position: absolute}
      
   
    
    
          #starlogo {position: absolute; left:-46px; margin-top: -36px; z-index: 1}
    
    #bebiclub {z-index:100; position: absolute;}
      
        .bebidoraclubfront {
      
  font-family: var(--heading-font);
  font-size: 2.9em;
  font-weight: bold;
  font-style:italic;
  color: #89d1ff;

  position: absolute;
    text-shadow: -1px -1px 0 #5395d7, 1px -1px 0 #5395d7, -1px 1px 0 #5395d7, 1px 1px 0 #5395d7;
          width: 100%;
  height: 100%;
           top: -46%;
  left: 59%;
}

          .bebidoraclubglow {
        font-family: var(--heading-font);
        font-size: 2.9em;
        font-weight: bold;
        font-style:italic;
        top: -42%;
  left: 58.6%;
  width: 100%;
  height: 100%;
        color: #2586d2;
        position: absolute;
              text-shadow: 0 0 10px #fff, 0 0 20px #ffffff, 0 0 30px #ffffff, 0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff;
      }

      
      .fansite {

  font-family: var(--heading-font);
  font-size: 1.2em;
  font-weight: bold;
  font-style:italic;
 left: 74%;
   top: 75%;
  width: 100%;
  height: 100%;
  color: #dcedff;
              text-shadow: 0 0 10px #fff, 0 0 20px #ffffff, 0 0 30px #ffffff, 0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff;
  z-index:10;
  position: absolute;
}

    
        .fansitefront {
         

  font-family: var(--heading-font);
  font-size: 1.2em;
  font-weight: bold;
  font-style:italic;
 left: 74%;
    top: 75%;
  width: 100%;
  height: 100%;
  color: #dcedff;
   text-shadow: -1px -1px 0 #5395d7, 1px -1px 0 #5395d7, -1px 1px 0 #5395d7, 1px 1px 0 #5395d7;
  z-index:10;
  position: absolute;
}
    
    
      .header-image img {
        width: 100%;
        height: auto;
      }

      /* -------------------------------------------------------- */
      /* SIDEBARS */
      /* -------------------------------------------------------- */

      aside {
        grid-area: aside;
        border: var(--border);
        border-radius: var(--round-borders);
        overflow: hidden;
        background: var(--sidebar-background-color);
        padding: 14px;
       
        background-image: url(bg/bluegingham.png);


      }

      .left-sidebar {
        grid-area: leftSidebar;
      }

          #lefty {margin-top:4px; }

              .righty {margin-top:18px; }

                #amainterview {border-width: 10px;
                border-style: solid;
                border-image: url("borders/cloudlace2.png") 8 fill round;}

      #hearteffect {position:absolute; margin-left: -2px; margin-top:2px}
            #hearteffect2 {position:absolute; margin-left: 120px; margin-top:120px}
      .amadoraholder {position:relative}
      
       .news-section    {
        margin:auto;
        height: 110px;
       width: 162px;
      overflow-y: auto;
      border-radius: 10px;
      overflow-x:hidden;
       clip-path: inset(0 round 14px); background:white;
            }


          .news-section p {margin-top:3px;   border-radius: 10px;}

          .newstext {  border-radius: 10px;
       width: 155px; padding:10px;   height: 110px;}

              .outerbox {

            border-radius: 10px;
             border: 1px solid #5395d7;
               height: 115px;
            margin-top:15px;    background:white; }

      .right-sidebar {
        grid-area: rightSidebar;
      }

      .sidebar-title {

        font-size: 2em;
        font-weight:bolder;
        font-style:italic;
        color: #3baaf2;
         text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
      position:relative;
        margin-bottom:-23px;
      z-index:10;
        line-height:22px;
      }

     
      
          .sidebar-title :after {
          position: absolute;
          content: "";
          bottom: 900px;
          height: 40px;
          width: 1px;
      }


      .sidebar-section:not(:last-child) {
        margin-bottom: 1em;
      }

      .sidebar-section ul,
      .sidebar-section ol {
        padding-left: 1.5em;
      }

      .sidebar-section > *:not(p):not(ul):not(ol):not(blockquote) {
        margin-top: 10px;
      }
      
      #tiktoksection {margin-top:-2px; margin-bottom:-10px}
      
      .todaystiktok { 
      
        font-size: 2em;
        font-weight:bolder;
     
        color: #3baaf2;
         text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
      letter-spacing: -1px;
       
     width: 181px;  margin:auto;  }

      .tiktok iframe {margin:auto; display:block; border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box; margin-top:-20px}
    
    
    
      
      #loveorlike { border: 3px solid;
          border-image-slice: 100%;
          border-image-source: none;
          border-image-slice: 1;
          border-image-source: linear-gradient(to bottom right, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
         background: black;
        margin-top:23px;
      padding: 10px;
      
      }
      
      #loveorlike img {margin-bottom:10px; cursor: url(pixels/heartcursorclick.png), auto;  transition: .2s  }
      
      #loveorlike img:hover {filter: brightness(150%);} 
        
      #rainbowtext2 {
   background: linear-gradient(90deg, #f00, #ff2b00, #f50, #ff8000, #fa0, #ffd500, #ff0, #d4ff00, #af0, #80ff00, #5f0, #2bff00, #0f0, #00ff2b, #0f5, #00ff80, #0fa, #00ffd5, #0ff, #00d4ff, #0af, #007fff, #05f, #002bff, #00f, #2a00ff, #50f, #7f00ff, #a0f, #d400ff, #f0f, #ff00d4, #f0a, #ff0080, #f05, #ff002b, #f00);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text; font-weight:bold
}

.rainbowtext{
  font-weight: bold;
		animation: rainbow 2.5s linear;
		animation-iteration-count: infinite;
  font-size:1.2em;
  text-align:center;
}

.rainbowtext a {
  color: inherit; /* Inherits the color of its parent element */

 
}

.rainbowtext a:visited {
  color: inherit; /* Ensures visited links also inherit the parent color */
}

.rainbowtext a:hover,
.rainbowtext a:active {
  color: inherit; /* Prevents color changes on hover or active state */
  text-decoration: none; /* Maintains no underline on hover or active state */
}

@keyframes rainbow{
		100%,0%{
			color: rgb(255,0,0);
		}
		8%{
			color: rgb(255,127,0);
		}
		16%{
			color: rgb(255,255,0);
		}
		25%{
			color: rgb(127,255,0);
		}
		33%{
			color: rgb(0,255,0);
		}
		41%{
			color: rgb(0,255,127);
		}
		50%{
			color: rgb(0,255,255);
		}
		58%{
			color: rgb(0,127,255);
		}
		66%{
			color: rgb(0,0,255);
		}
		75%{
			color: rgb(127,0,255);
		}
		83%{
			color: rgb(255,0,255);
		}
		91%{
			color: rgb(255,0,127);
		}
}
      
 
      
      /* Sidebar Blockquote: */

    
      #membersection {border-color:#f54fa2;
        background-image:url(bg/pinkgingham.png);
      }
      
    
      
      .sidebar-section .boxcontainer {

        background: white;
        padding: 10px 8px 8px 8px;
        margin: 1em 0;
        border-radius: 10px;
        overflow: hidden;
        border: 1px solid #5395d7;
        text-align: center;}

      .sidebar-section blockquote > *:first-child {
        margin-top: 0;
      }

      .sidebar-section blockquote > *:last-child {
        margin-bottom: 0;
      }

      /* Site Button: */

      .site-button {
        display: flex;
        flex-direction: column;
        align-items: center;
      }

      .site-button textarea {
        font-family: monospace;
        font-size: 0.7em;
      }

      /* -------------------------------------------------------- */
      /* FOOTER */
      /* -------------------------------------------------------- */

      footer {
        grid-area: footer;
        border: var(--border);
        border-radius: var(--round-borders);
        overflow: hidden;
        font-size: 0.75em;
        padding-top: 15px;
           padding-bottom: 15px;
        background: var(--content-background-color);
        display: flex;
        justify-content: center;
      }

#supertitle {font-size: 2.8em;
  font-weight:bolder;
  font-style:italic;
 color: #63a5e6;
  text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
         z-index:99;
         margin-bottom:-30px;
              margin-top:5px;
position:relative;
              letter-spacing:-4px; }

      footer a,
      footer a:visited {
        color: var(--link-color);
      }

      footer a:hover,
      footer a:focus {
        color: var(--link-color-hover);
      }

      /* -------------------------------------------------------- */
      /* NAVIGATION */
      /* -------------------------------------------------------- */

      nav {
      
        margin-top: 126px;
      }

      nav .sidebar-title {
        margin-bottom: 0.5em;
      }

      nav ul {
        margin: 0 -5px;
        padding: 0;
        list-style: none;
        user-select: none;
       
      }

      nav ul li {
        margin-bottom: 0;
      
      }

      nav > ul li > a,
      nav > ul li > strong {
        display: inline-block; text-decoration: none; 
      }

      nav > ul li > a,
      nav > ul li > details summary,
      nav > ul li > strong {
        padding: 5px 10px;
      }

      nav > ul li > a.active,
      nav > ul li > details.active summary {
        font-weight: bold;

      }

      nav ul summary {
        cursor: pointer;
      }

      nav ul ul li > a {
        padding-left: 30px;

      }

      /* NAVIGATION IN HEADER */

      header nav {

        margin-left:26px;
        font-size: 18px;
      font-weight: bold;
        font-style: italic;
  

      }

      header nav ul {
        display: flex;
        flex-wrap: wrap;
        margin: 0;
        justify-content: center;
        z-index: 90;
      }

      header nav ul li {
        background:none;
        position: relative;
          margin: 5px; padding:2px;
        
      }

       nav ul li:first-child > a {
            color: #ea5e9e;
      background-color: #ffc8ee;
        box-shadow: -4px -3px #f599c3 inset, 2px 3px #ffe3fa inset;
            border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;
      }

      nav ul li:nth-child(2) > a {
            color: #ea5e9e;
      background-color: #ffc8ee;
        box-shadow: -4px -3px #f599c3 inset, 2px 3px #ffe3fa inset;
            border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;
      }

       nav ul li:nth-child(3) > a {
      background-color: #ffe0d5;
          color: #d69031;
             box-shadow: -4px -3px #ffa991 inset, 2px 3px #fff4e4 inset;
      border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;

      }

       nav ul li:nth-child(4) > a {

         background-color: #fff2b4;
          color: #ce9e46;
             box-shadow: -4px -3px #dfbf5e inset, 2px 3px #feffc7 inset;
      border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;

      }

       nav ul li:nth-child(5) > a {
         background-color: #beffad;
              color: #50b960;
             box-shadow: -4px -3px #70d96c inset, 2px 3px #dfffe9 inset;
      border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;

      }

          nav ul li:nth-child(6) > a {


           background-color: #bcdfff;
                       color: #519edb;
                box-shadow: -4px -3px #76b5fb inset, 2px 3px #e3eeff inset;
             border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;

      }


              nav ul li:nth-child(7) > a {
      background-color: #f8d5ff;
          color: #b982ca;
             box-shadow: -4px -3px #d29ee1 inset, 2px 3px #ffe4f4 inset;
      border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box;
      }




      /* -------------------------------------------------------- */
      /* CONTENT */
      /* -------------------------------------------------------- */



       main {
          max-height: none;
          padding: 15px;
        line-height: 1.5; 
         overflow-y: none;
      }
      
      
        #memberclick{width:280px; margin:auto; padding:12px; margin-top:12px; margin-bottom:20px}

    
 



    
    .maintextbox {font-size: 1.9em;
  font-weight:bolder;
  font-style:italic;
 color: #63a5e6;
   text-shadow: -1px -1px 0 #ebf7ff, 1px -1px 0 #ebf7ff, -1px 1px 0 #ebf7ff, 1px 1px 0 #ebf7ff;
 margin:auto; height:28px; margin-top:3px;
    }
    

      
      #socialtitle {
        font-size: 1.3em;
  font-weight:bolder;
  font-style:italic;
 color: #a5d2ff;
  text-shadow: -2px -1px 0 #2076b9, 1px -1px 0 #2076b9, -1px 1px 0 #2076b9, 1px 1px 0 #2076b9;
            position:relative;
        margin-bottom:-30px;
}
      
      .socialmenu {margin-top:18px;
        
        
      }
      
          .main-title2 { font-size: 2.8em;
  font-weight:bolder;
  font-style:italic;
 color: #a5d2ff;
  text-shadow: -2px -1px 0 #2076b9, 1px -1px 0 #2076b9, -1px 1px 0 #2076b9, 1px 1px 0 #2076b9;
      position:relative;
  margin-bottom:-28px;
      margin-left:20px;
z-index:99;}
      
         .starwing {  display:inline-block;}
    
      .starwing2 { display:inline-block; }
    
      #socialsection {font-size:2.4em; margin:auto; text-align:center; margin-top:30px}
      
      .watchmenu { margin:auto;   justify-content: center;
  align-items: center; display:flex; }
      
      #watchsection {background:none}
      
      .watchtitles {position: absolute;  z-index:50;  font-size: 1.2em;
  font-weight:bolder;
  font-style:italic;
 color: #d8efff;
  text-shadow: -1px -1px 0 #2076b9, 1px -1px 0 #2076b9, -1px 1px 0 #2076b9, 1px 1px 0 #2076b9;  margin-left:-245px; margin-top:70px
      
      }
     
      #watchtitle2 {margin-left:-37px}
      
           #watchtitle3 {margin-left:165px}
      
      .watchbuttons {border: solid 1px #2076b9;
      border-radius:15px; height:67px; width:94px; display:inline-block; margin-right:10px;  background-size:cover; background-repeat:no-repeat; background-position:center;
      transition: .2s  ;
      background-color:white;
        cursor:url(pixels/heartcursorclick.png), auto;}
      
      .watchbuttons:hover {opacity: 60%;}
      
      #dreamland {background-image: url(images/dreamland2.png); }
      
      #darkheroes {background-image: url(images/darkheroes.jpg);  }
      
        #npc {background-image: url(images/rakunpc.png);  }


      
 
      
      .ytiframe {width:342px; height:201px;
            margin:auto;  border-width: 10px;
                border-style: solid;
                border-image: url(borders/cloudlace2.png) 8 fill round; background-clip: padding-box; margin-bottom:10px}

     
      main a,
      main a:visited {
        color: var(--link-color);
      }

      main a:hover,
      main a:focus {
        color: var(--link-color-hover);
        text-decoration-style: wavy;
      }

      main p,
      main .image,
      main .full-width-image,
      main .two-columns {
        margin: 0.75em 0;
      }

      main ol,
      main ul {
        margin: 0.5em 0;
        padding-left: 1.5em;
      }

      main ol li,
      main ul li {
        margin-bottom: 0.2em;
        line-height: 1.3;
      }

      main ol {
        padding-left: 2em;
      }

      main blockquote {
        background: white;
        border: solid 1px #5395d7;
        padding: 15px;
        margin: 1em 0;
        border-radius: 10px;
      }

      main pre {
        margin: 1em 0 1.5em;
      }

      main code {
        text-transform: none;
      }

      main center {
        margin: 1em 0;
        padding: 0 1em;
      }

      main hr {
        border: 0;
        border-top: var(--border);
        margin: 1.5em 0;
      }

      /* HEADINGS: */

      main h1,
      main h2,
      main h3,
      main h4,
      main h5,
      main h6 {
        font-family: var(--heading-font);
        margin-bottom: 0;
        line-height: 1.5;
      }

      main h1:first-child,
      main h2:first-child,
      main h3:first-child,
      main h4:first-child,
      main h5:first-child,
      main h6:first-child {
        margin-top: 0;
      }

      main h1 {
        font-size: 1.5em;
      }

      main h2 {
        font-size: 1.4em;
      }

      main h3 {
        font-size: 1.3em;
      }

      main h4 {
        font-size: 1.2em;
      }

      main h5 {
        font-size: 1.1em;
      }

      main h6 {
        font-size: 1em;
      }

      /* COLUMNS: */

      .two-columns {
        display: flex;
      }

      .two-columns > * {
        flex: 1 1 0;
        margin: 0;
      }

      .two-columns > *:first-child {
        padding-right: 0.75em;
      }

      .two-columns > *:last-child {
        padding-left: 0.75em;
      }

      /* -------------------------------------------------------- */
      /* CONTENT IMAGES */
      /* -------------------------------------------------------- */

    
      .image {
        display: block;
        width: auto;
        height: auto;
        max-width: 100%;
      }

      .borderimage {
        display: block;
        width: auto;
        height: auto;
        max-width: 100%;
        border-width: 10px;
        border-style: solid;
        border-image: url("borders/cloudlace2.png") 8 fill round;
      }

                #concealer {

            width:140px;
            height:140px;
      margin:auto;


        }
      
  


          #concealer img {width: 140px; height: 140px; object-fit: cover;     border-width: 10px;
                border-style: solid;
                border-image: url("borders/cloudlace2.png") 8 fill round;}


      .full-width-image {
        display: block;
        width: 100%;
        height: auto;
      }

      .images {
        display: flex;
        width: calc(100% + 5px + 5px);
        margin-left: -5px;
        margin-right: -5px;
        align-items: center;
        justify-content: center;
        margin:auto;
      }

      .images img {
        width: 100%;
        height: auto;
        margin: 10px;
        overflow: hidden;
      }

      /* -------------------------------------------------------- */
      /* ACCESSIBILITY */
      /* -------------------------------------------------------- */

      /* please do not remove this. */

      #skip-to-content-link {
        position: fixed;
        top: 0;
        left: 0;
        display: inline-block;
        padding: 0.375rem 0.75rem;
        line-height: 1;
        font-size: 1.25rem;
        background-color: var(--content-background-color);
        color: var(--text-color);
        transform: translateY(-3rem);
        transition: transform 0.1s ease-in;
        z-index: 99999999999;
      }

      #skip-to-content-link:focus,
      #skip-to-content-link:focus-within {
        transform: translateY(0);
      }

      /* -------------------------------------------------------- */
      /* MOBILE RESPONSIVE */
      /* -------------------------------------------------------- */

      /* CSS Code for devices < 800px */
      @media (max-width: 800px) {
        body {
          font-size: 14px;
        }

        .layout {
          width: 100%;
          grid-template: "header" auto  "leftSidebar" auto "main" auto "footer" auto / 1fr;
          /* Confused by the grid? Check out my tutorial: https://petrapixel.neocities.org/coding/positioning-tutorial#grid */
        }

         .bebidora, .audioholder {display:none}
        
         .bebidoraclubglow, .bebidoraclubfront, #starlogo {left:-10px; top: -42px}
        
        #starlogo { top:0px; left:-40px;}
        
        .fansitefront, .fansite {left:-30px; top:0px}

        .right-sidebar {
          display: none;
        }

        
        aside {
          border-bottom: 1px solid;
          padding: 9px;
          font-size: 0.9em;
          margin-top:100px;
        }

       header nav {margin:auto; margin-top:132px; position: relative; z-index:90;  font-size: 14px;}

        nav > ul {
          padding-top: 0.5em;
        }

        nav > ul li > a,
        nav > ul li > details summary,
        nav > ul li > strong {
          padding: 0.5em;
        }

        nav > ul li:first-child {display:none;}

      

        .images {
          flex-wrap: wrap;
        }

        .images img {
          width: 100%;
        }

        #skip-to-content-link {
          font-size: 1rem;
        }

      }
