body, html {
   background-image: url("backgrounds/Recording\ 2025-09-07\ 194537\ \(1\).gif");
   background-size: 100% 100%;
   min-height: 100%;
   overflow-x:hidden;
   overflow-y: hidden;

   
}





#headerandnav {
  width: 100%;
  position: absolute;
  top: 2%;
}



#contentbox {
     background-image: url("boxes/IMG_9203 2.png");
     width: 40%;
     top: 13%;
     right:0%;
     position: absolute;
     height: 80%;
}









#globe {
   position:absolute;
   top:35%;
   right:60%;
   width:10%;
}

#playlist {
   position:absolute;
   width: 8%;
   right: 41%;
   top: 21%;
   height: 20%;
}


* {font-family: Connectionserif;
   color:white;
   font-size: 0.89vw;
   
}

@font-face {
   font-family: 'Connectionserif';
   src: url('ConnectionSerif-d20X.otf');

}


p {
   margin:5px;

}

.h {
   font-size: 1.2vw;
}

#bart {
   position:absolute;
   width:50%;
   bottom:0%;
 
  

}

#barttext {
   width:50%;
   position:absolute;
   bottom:1%;
   left:0%;
}


#nav1 {
   position:absolute;
   right:37%;
   top:7%;
   
   
   
   
}

#nav2 {
   position:absolute;
   right:19%;
   top:7%;
   
}

#nav3 {
   position:absolute;
   right:2.5%;
   top:7%;
   
}

a:hover {
   color:#E5B054;
}

#header1 {
   position:absolute;
   top:18%;
   right:17.5%;
   font-size: 1.5vw;
   
}

#header2 {
   position:absolute;
   top:18%;
   right:15%;
   font-size: 1.5vw;
   
}

#header3 {
   position:absolute;
   top:18%;
   right:13%;
   font-size: 1.5vw;
  
}

.paragraph {
   border:2px;
   border-style:dashed;
   border-color:white;
   overflow-x: hidden;
   
}

.text{
   font-size:0.89vw;
   padding-left: 4px;
   padding-right: 6px;
}

#content {
   border:2px;
   border-style:dashed;
   position:absolute;
   width:34%;
   height:66%;
   border-color: white;
   right:3%;
   top:23%;
   display:grid;
   grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
   grid-template-rows: 70px 70px 70px 70px 70px 70px 70px 70px 70px 70px 70px auto;
   grid-row-gap:5px;
   grid-column-gap:5px;
   overflow-y:scroll;
}

#intro {
   grid-row:1/4;
   grid-column:1/4;
}

#bombasticnews {
   grid-column:2/7;
   grid-row:4/6;
   
}

#sine {
   grid-column:4/7;
   grid-row:1/3;
   width:100%;
   height:48%;
}

#buttons {
   border-color:aliceblue;
   position:absolute;
   bottom:1%;
   right:2%;
   width:34%;
}

#welcome {
   width: 30%;
   position:absolute;
   top:0px;
   right:70%;

}

#flowers {
   position:absolute;
   right:40%;
   top:120px;
}

#ipod {
  position:absolute;
  width:15%;
  top:17%;
  right:38%;
  height:45%
}



#musicplayer {
  position:absolute;
  width:12%;
  height:18%;
  top:20%;
  right:39.5%;
}

#playlistcover {
   position:absolute;
   width:7%;
   height:14.5%;
   top:20.5%;
   right:40%;
}

#musicbuttons {
   position:absolute;
   top:35%;
   right:39.5%;
   width:12%;
   background-color: black;
}

#radiotext {
   position:absolute;
   top:16%;
   width:12%;
   right:39.5%;
}

#reviews {
   grid-column: 4/7;
   grid-row: 2/4;
   overflow:hidden;
   
}

#rev {
   border:2px;
   border-style:ridge;
   width: 98%;
   height:fit-content;

}

#revtag {
   position:absolute;
   right:20%;
   top:0px;
   height:160px;
}

#r {
   color:#E5B054;
}

#speakergif {
   position:absolute;
   top:17%;
   right:50%;
}

#newstitlediv {
   border-radius: 2px;
   border-style:ridge;
   border-color:#E5B054;
   background-image: url(backgrounds/BBFQDQ56H763CKCIZTXPHTOH4XSVZXYH.gif);
   grid-column:1/2;
   grid-row:4/6;
}

#newstitle {
   color:#E5B054;
}

#latestdiv {
   height:fit-content;
   width:100%;
   background-image:url("gifs and buttons etc\QIK6RH5LEUNAETPXCA72I7MHLFSZ6BPR.gif");
}

#newspic {
   border-radius: 2px;
   border-color:#E5B054;
   border-style:dashed;
   height:95px;
   width:93px;
   grid-column:1/2;
   grid-row:1/2;
}

#newscontent {
   border-color:#E5B054;
   height:100px;
   border-radius: 2px;
   border-style:ridge;
   display:grid;
   grid-template-columns: 95px auto;
   grid-gap: 2px;
   grid-template-rows:95px;
   
}

#newstext {
   grid-column: 2/auto;
   overflow-y: scroll;
   border-radius:1px;
   border-color:#E5B054;
   border-style:dashed;
   height:95px;
}

#yellow {
   color:#E5B054;
}

* ::-webkit-scrollbar {
   display:none;
}