* {
    box-sizing: border-box;
}

/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/people/peo-6/peo787.cur), auto !important;} /* End https://www.cursors-4u.com */


body {
    background-color:white;
    display: flex;
    justify-content: center;
    font-family:Arial, Helvetica, sans-serif
}

main {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#all {
    background-color: rgba(0, 81, 255, 0);
    min-width: 96%;
    padding:2%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

header img {
    max-width: 600px;
    max-height: 800px;
}

#logo {
    height:250px;
    width: 600px;
}

img {
    max-width: 50%;
    margin: 0px;
}

#well {
    clip-path: inset(0 3% 0 3%);
}

main nav ul {
    list-style-type: none;
    display: flex;
    align-items: center;
    padding-left: 0%;
}

nav ul li img {
    max-height: 50px;
    min-width: 100px;
}


nav ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px;
    flex-wrap: wrap;
}


h1 {
    background-color: rgb(255, 0, 170);
    color: white;
    padding: 0px 15px;
}


.box {
    display: flex;
    max-width: 600px;
}

#link_tree {
    list-style-image: url("./page/about/lips_xxs.png");
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#link_tree li a {
    font-family: 'Times New Roman', Times, serif;
    color: black;
}

#link_tree li a:hover {
    background-color: #ff3333;
    color: white
}

#home {
    background-color: rgb(255, 0, 170) ;
    padding: 10px;
    color: white;
}

#home:hover {
    background-color: white ;
    padding: 10px;
    color: rgb(255, 0, 170);
}




#movies ul {
    list-style: none;
    font-family: 'Times New Roman', Times, serif;
    font-size: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: center;
    justify-content: center;
    padding: 0px
}

#movies ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1em;
    padding-top: 0px;
}

#movies ul li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2em;
}

#movies ul li span {
    text-align: center;
}

#flyers ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    gap: 3em;
    flex-wrap: wrap;
}

#flyers img {
    max-width: 300px;
}

main section {
    display: flex;
    flex-direction: row;
    max-width: 96%;
}

#about_main {
    max-width: 96%;
}

@media (max-width: 600px) {
  .flex-container {
    flex-direction: column;
  }
}






#movies ul {
    list-style: none;
    font-family: 'Times New Roman', Times, serif;
    font-size: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: center;
    justify-content: center;
    padding: 0px
}

#movies ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1em;
    padding-top: 0px;
}

#movies ul li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2em;
}

#movies ul li span {
    text-align: center;
}

#flyers ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    gap: 3em;
    flex-wrap: wrap;
}

#flyers img {
    max-width: 300px;
}

main section {
    display: flex;
    flex-direction: row;
    max-width: 96%;
}

#about_main {
    max-width: 96%;
}

@media (max-width: 600px) {
  .flex-container {
    flex-direction: column;
  }
}


.tooltip {
  position: relative;
  display: inline-block;
}


.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #fca1f7;
  color: #000;
  text-align: center;
  border-radius: 0px;
  padding: 3px;
  position: absolute;
  z-index: 1;
  bottom: 140%;
  left: 50%;
  margin-left: -60px;
  border-width: 1px;
  border-style: solid;
  border-color: black;
}

.tooltip .tooltiptext::after {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}




.merch ul {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    max-width:1100px;
    align-items: center;
    justify-content:space-evenly;
    padding-bottom: 50px;
}

.merch ul li img {
    max-width: 300px;
    padding:15px;
}

#clouds {
    background-image: url('/page/backgrounds/bg_clouds.png');
}

#flower {
    background-image: url('/page/merch/bg_flower.gif');
}

#pink {
  background-image: url('/page/art/img/bg_white.jpg');
}

#nightsky {
  background-image: url('/page/backgrounds/nightsky.gif');
}

#lightstars {
  background-image: url('/page/backgrounds/starlight.gif');
}