/* Navi */

#nanavi{
cursor: pointer;
}

#oblivion{
max-height:100%;
width:50%;
transition: all 0.3s ease-in-out;
filter: opacity(100%) blur(0px) brightness(100%) contrast(100%) saturate(100%) drop-shadow(5px 5px 10px rgba(0,0,0,0.5));
}

#oblivion:hover{
transform: scale(1.2);
filter: brightness(75%) contrast(100%) saturate(150%) drop-shadow(5px 5px 10px rgba(0,0,0,0.5));
}

#returnToOblivion{
max-height:100%;
max-width:100%;
}

.PWA{
  position: fixed;
  bottom: 8px;
  right: -100px;
}

.auRevoir{
  background-color:#9c1c00;
  height:0px;
  width:35%;
  z-index:2;
  position:fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow-x:hidden;
  transition:0.3s;
  border: 0px solid #9c1c00;
  border-radius: 5px;
  filter: drop-shadow(0 0 16px rgba(160, 185, 192, 0.5));
  opacity:0.95;  
  color:#b5ee80;
}

/* Navi */

/* Ascension */

#uppies{
cursor: pointer;
}

#ass{
max-height:100%;
width:25%;
transition: all 0.3s ease-in-out;
filter: opacity(100%) blur(0px) brightness(100%) contrast(100%) saturate(100%) drop-shadow(5px 5px 10px rgba(0,0,0,0.5));
}

#ass:hover{
transform: scale(1.2);
filter: brightness(75%) contrast(100%) saturate(150%) drop-shadow(5px 5px 10px rgba(0,0,0,0.5));
}

.rise{
  position: fixed;
  bottom: 150px;
  right: -150px;
}

/* Ascension */

@font-face {
  font-family: 'block'; /* set name */
  src: url('https://rayepierre335.neocities.org/assets/BebasNeue-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'buster'; /* set name */
  src: url('https://rayepierre335.neocities.org/assets/UbuntuMono-Regular.ttf') format('truetype');
}

body{
  background-image: url('https://rayepierre335.neocities.org/assets/flixbeat.gif');  
  background-size:5em;
  background-color: #1c1c1c;
}

h1{
  margin: 15px 25% 0 25%;
  font-size: 3em;
  color: #938846;
  font-family: block;
    text-align: center;
  text-shadow: 3px 3px 6px black;
  border-style: ridge;
  border-width: 5px 15px 0 15px;
  background-color: #262e93;
}

h2{
  margin: 0 25% 0 25%;
  padding:1em 2em 1em 2em;
  font-size: 1.2em;
  color: #262e93;
  font-family: buster;
    text-align: center;
  text-shadow: 1px 1px 2px black;
  border-style: ridge;
  border-width: 0 15px 5px 15px;
  background-color: #938846;
}

h3{
  font-size: 1.2em;
  color: #7074c4;
  font-family: block;
  text-shadow: 1px 1px 2px black;
}

p{
  font-size: 1.3em;
  color: #7074c4;
  font-family: buster;
  text-shadow: 1px 1px 2px black;
  text-align: center;
}

.oblivion{
padding:1em 5em 5em 5em;
margin:1em;
}

.staringAtDeath{
  overflow-y: hidden;
  border: 3px solid #1e4584;
  background-color: #a4b5d1;
}

.staringAtDeath button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  transition: 0.3s;
  color: #262e93;
  font-family: buster;
  font-size: 1.2em;
  font-weight:bold;
}

.staringAtDeath button:hover {
  background-color: black;
}

.staringAtDeath button.active {
  background-color: #938846;
}


.iTakeaBreath{
  display: none;
  grid-template-columns: repeat(auto-fit, minmax(200px, auto));
  gap:1em;
  color: #262e93;
  overflow-x:hidden;
  background-color: #938846;
  border: 3px ridge #1e4584;
  padding:1em;
}

.theresNothingLeft{
  display: flex;
  flex-direction:column;
  text-align: center;
}

.theresNothingLeft img{
  max-height:100%;
  width:5em;
}