body{
  background-attachment: fixed;
  cursor: url("wii_cursor_fixed.png"), default;
  /*font-family: 'Belanosima', sans-serif;*/
  font-family: "Urbanist", sans-serif;
  font-style: normal;

}


#index{
 background-image: url("bg_bluesticker.jpg"); 
}

#about{
  background-image: url("bg_sticker2.jpg"); 
}

#sites{
  background-image: url("bg_fish_widesmall.jpg"); 
  background-size: cover;
}

#notfound{
  background-image: url("bg_hellokittyburger.jpg"); 
}

mark{
 background-color: #fffd7a;
}

p{
 /*border: red 5px double;*/
 border-radius: 10px;
}

a{
  color: #308aff;
  cursor: url("wii_cursor_link.png"), default;
}


/*h1, h2, h3, h4 {
 text-align: center; 
 font-family: 'Lilita One', sans-serif;
 color:#51db4f;
 background-image: linear-gradient(white, yellow)
 
}*/

h1{
  display: inline-block;
  text-align: center; 
 font-family: "Gluten", cursive;
  padding: 1%;
  margin: 10px;
 background-image: linear-gradient(white, #99f579);
 border-radius: 30px;
 border-top: 2px solid #99f579;
 border-bottom: 4px solid #6bd15c;
 border-left: 4px solid #99f579;
 border-right: 4px solid #99f579;
}


h2{
  display: inline-block;
  text-align: center; 
 font-family: "Gluten", cursive;
 padding: 1%;
 margin: 10px;
 background-image: linear-gradient(white, #81c3ff);
 border-radius: 30px;
 border-top: 2px solid #81c3ff;
 border-bottom: 4px solid #5d91de;
 border-left: 4px solid #81c3ff;
 border-right: 4px solid #81c3ff;
}

h3{
  display: inline-block;
  text-align: center; 
 font-family: "Gluten", cursive;
 padding: 1%;
 margin: 10px;
 background-image: linear-gradient(white, #fff307);
 border-radius: 30px;
 border-top: 2px solid #fff307;
 border-bottom: 4px solid #ffe207;
 border-left: 4px solid #fff307;
 border-right: 4px solid #fff307;
}

.list{
  width: 300px;
  margin: auto;
  border:double red 5px;
  border-radius: 10px;
}

footer{
 border: red 10px double;
 background-color: white;
 border-radius: 10px;
 width: fit-content;
 margin:auto;
}

.logo{
 width: 440px;
 margin: auto;
}

.COLLECTIVEbody{
 width: 840px;
 margin:auto;
 text-align: center;
}

.sidebodydiv{
 background-color: white;
  /*min-width: 19%;*/
  width: 180px;
  height:100%;
  margin: 3px;
  /*margin:  .5% auto .5% auto;*/
  padding: 5px;
  overflow-y: scroll;
  overflow-x: hidden;
  border: red 10px double;
  border-radius: 10px; 
}

.bodydiv{
  background-color: white;
  width: 590px;
  height:100%;
  margin: 3px;
  padding: 5px;
  overflow-y: scroll;
  overflow-x: hidden;
  border: red 10px double;
  border-radius: 10px;
}

#navbarBox{
width: 90%;
margin: .5% auto;
padding: 1%;
height: fit-content;
}

#navbarLink{
  display: inline-block;
  color: black;
  margin: .5% auto .5% auto;
background-color: #d3e3f0;
border-left: 5px solid white;
 border-top: 5px solid white;
 border-right: 5px solid #99c5f2;
 border-bottom: 5px solid #99c5f2;
border-radius: 10px;
padding: 10px;
font-family: "Gluten", cursive;
}

#navbarLink:hover{
  transform: scale(1.1);
  background-color:orangered;
  border: #ffa352 outset 5px;
  transition-duration: .3s;
}

/*#navbarLink {
  background-color: #d3e3f0;
  border: 5px #f5faff outset;
border-radius: 10px;
padding: 1%;
}*/

.codebox{
  width: 160px;
  border: #6bd15c 5px double;
 border-radius: 10px;
 padding: 5px;
 overflow: scroll;
}


.divider{
 width:590px; 
}

.featured{
 width: 270px; 
 height: 270px;
}

.pngflex{
  width:120px;
}

.flexrow{
 display: flex;
 flex-direction: row;
 margin-left:auto;
 margin-right:auto;
}

.flexrowmobile{
 display: flex;
 flex-direction: row;
 margin-left:auto;
 margin-right: auto;
}

#pleaseCenterImBegging{
 margin-left: auto;
 margin-right:auto;
 width: fit-content;
 height: fit-content;
}

.logo:hover{
  transform: scale(1.1);
  transition-duration: .3s;
}

.hidden{
display : none;
}

.socials{
  background-image: linear-gradient(white, #fff307);
 border-radius: 30px;
 border-top: 2px solid #fff307;
 border-bottom: 4px solid #ffe207;
 border-left: 4px solid #fff307;
 border-right: 4px solid #fff307;
 margin: 5px;
 list-style-type: circle;
 color: black;
}

.logoimg{
 display: inline-block;
}

/*--------------MOBILE CODE----------------*/



@media (max-width: 800px) {
  .flexrowmobile {
    flex-direction: column;
  }
  
  .sidebodydiv{
   width: 100%; 
  }
  
  .bodydiv{
    width: 100%;
  }
  
  .COLLECTIVEbody{
   width: 85%; 
  }
  
  .divider{
    width: 100%;
  }

}