@media screen and (min-width: 750px)


body {
 
  font-family: Courier New;
  font-color: #76d6ff;

}




#fullscreen-button {
    position: absolute;
    top:  5px;
    right:  5px;
    background: #aaaaaa;
    border:  0;
    width:  30px;
    height:  30px;
    border-radius: 50%;
    box-sizing: border-box;
    transition:  transform .3s;
    cursor:  pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;

}

#fullscreen-button:hover {
    transform: scale(1.125);
}
#fullscreen-button svg:nth-child(2) { 
    display: none;
}
[fullscreen] #fullscreen-button svg:nth-child(1) {
    display: none;
}
[fullscreen] #fullscreen-button svg:nth-child(2) {
    display: inline-block;
}


audio {
  width: 115px;
  height: 25px;
  opacity: 0.50;

}


audio::-webkit-media-controls-panel {
  -webkit-justify-content: center;
}
/* Removes the timeline */
audio::-webkit-media-controls-timeline {
  display: none !important;
}

/* Removes the time stamp */
audio::-webkit-media-controls-current-time-display {
  display: none;
}
audio::-webkit-media-controls-time-remaining-display {
  display: none;
}




@keyframes blink {
0% {
opacity: .1;
}

50% {
opacity: 1;
}

100% {
opacity: 1;
}
}

.blinking-text {
          
animation: blink 2s infinite;
}




.navigation {
  padding: 0;
  margin: 0;
  border: 0;
  letter-spacing: 2px;
}

.navigation ul,
.navigation ul li,
.navigation ul ul {
  list-style: none;
  margin: 0;
  padding: 0;
  min-height: 0.05em;
  line-height: .5em;

}


.navigation ul {
  position: relative;
  z-index: 500;
  float: left;



}
.navigation ul li {
  float: left;
  min-height: 0.05em;
  line-height: .9em;
  vertical-align: middle;
  position: relative;
  
}

.navigation ul li.hover,
.navigation ul li:hover {
  position: relative;
  z-index: 510;
  cursor: default;
 

}
.navigation ul ul {
  visibility: hidden;
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 520;
  width: 100%;

 
}

.navigation ul ul li { float: none; }
.navigation ul ul ul {
  top: 0;
  right: 0;

}
.navigation ul li:hover > ul { visibility: visible; }
.navigation ul ul {
  top: 0;
  left: 99%;



}
.navigation ul li { float: none; }
.navigation ul ul { margin-top: 0.05em; }
.navigation {
  width: 13em;
  background-color: none;
  font-family: 'COURIER NEW', sans-serif;
  font-size: 27px;
  zoom: 1;
     


}
.navigation:before {
  content: '';
  display: block;
}
.navigation:after {
  content: '';
  display: table;
  clear: both;
}
.navigation a {
  display: block;
  padding: .8em 1.3em;
  color: none;
  text-decoration: none;
  text-transform: uppercase;


}
.navigation > ul { width: 13em; }
.navigation ul ul { width: 20em; }
.navigation > ul > li > a {
  border-right: 0.3em solid none;
  color: #76d6ff;



}
.navigation > ul > li > a:hover { color: #ffffff; }
.navigation > ul > li a:hover, 
.navigation > ul > li:hover a { background: none; }
.navigation li { position: relative; }
.navigation ul li.has-sub > a:after {
  content: '»';
  position: absolute;
  right: 3.5em;
    

}


.navigation ul ul li.first {
  -webkit-border-radius: 0 3px 0 0;
  -moz-border-radius: 0 3px 0 0;
  border-radius: 0 3px 0 0;
}
.navigation ul ul li.last {
  -webkit-border-radius: 0 0 3px 0;
  -moz-border-radius: 0 0 3px 0;
  border-radius: 0 0 3px 0;
  border-bottom: 0;
}
.navigation ul ul {
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
}
.navigation ul ul { border: 1px solid none; }
.navigation ul ul a { color: #76d6ff; }
.navigation ul ul a:hover { color: #ffffff; }
.navigation ul ul li { border-bottom: 1px solid none; }
.navigation ul ul li:hover > a {
  background: none;
  color: none;
  
}
.navigation.align-right > ul > li > a {
  border-left: 0.3em solid none;
  border-right: none;
}
.navigation.align-right { float: right; }
.navigation.align-right li { text-align: right; }
.navigation.align-right ul li.has-sub > a:before {
  content: '»';
  position: absolute;
  top: 50%;
  left: 15px;
  margin-top: -6px;
}
.navigation.align-right ul li.has-sub > a:after { content: none; }
.navigation.align-right ul ul {
  visibility: hidden;
  position: absolute;
  top: 0;
  left: -100%;
  z-index: 598;
  width: 100%;

}
.navigation.align-right ul ul li.first {
  -webkit-border-radius: 3px 0 0 0;
  -moz-border-radius: 3px 0 0 0;
  border-radius: 3px 0 0 0;
}
.navigation.align-right ul ul li.last {
  -webkit-border-radius: 0 0 0 3px;
  -moz-border-radius: 0 0 0 3px;
  border-radius: 0 0 0 3px;
}
.navigation.align-right ul ul {
  -webkit-border-radius: 3px 0 0 3px;
  -moz-border-radius: 3px 0 0 3px;
  border-radius: 3px 0 0 3px;
}

/* [Object] Modal
 * =============================== */
.modal {
  visibility: hidden;
  position: fixed;
  top: 2px;
  right: 2px;
  bottom: 2px;
  left: 2px;
  text-align: justify;
  background: #000000;
  transition: opacity .25s ease;
  border: solid #76d6ff;
  border-width: 2px 2px;

}

.modal__bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
 

}

.modal-state {
  display: none;
}

.modal-state:checked + .modal {
  opacity: 5;
  visibility: visible;
}

.modal-state:checked + .modal .modal__inner {
  top: 0;
}

.modal__inner {
  transition: top .25s ease;
  position: absolute;
  top: -20%;
  right: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  margin: auto;
  overflow: auto;
  background: #000000;
  border-radius: 3px;
  color: #76d6ff;
  padding: 1em 1.3em;
  height: 50%;
  font-size: 18px;
  text-align: justify;
  line-height: 1.5;
  letter-spacing: 0px;

}

.modal__close {
  position: absolute;
  right: 1em;
  top: 1em;
  width: 1.1em;
  height: 1.1em;
  cursor: pointer;
}

.modal__close:after,
.modal__close:before {
  content: '';
  position: absolute;
  width: 2px;
  height: 1.5em;
  background: #76d6ff;
  display: block;
  transform: rotate(45deg);
  left: 50%;
  margin: -3px 0 0 -1px;
  top: 0;
}

.modal__close:hover:after,
.modal__close:hover:before {
  background: #ffffff;
}

.modal__close:before {
  transform: rotate(-45deg);
}


  
  .modal__inner {
    width: 90%;
    height: 90%;
    box-sizing: border-box;
    color: #76d6ff;

  }



/* Other
 * =============================== */
body {
  padding: 0%;
  font: 1/1.5em sans-serif;
  text-align: justify;

  
}

.btn {
  cursor: pointer;
  background: none;
  display: inline-block;
  padding: 1em 1.3em;
  color: #76d6ff;
  border-radius: 0px;
}

.btn:hover,
.btn:focus {
  background: none;
  color: #ffffff;

}

.btn:active {
  background: none;
  box-shadow: 0 1px 2px rgba(0,0,0, .2) inset;
  color: #76d6ff;
  
}



/* Contact Form */
.contact-section {
  width: 100%;
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
  padding: 3rem 1rem;
}

.contact-intro > * + * {
  margin-top: 1rem;
}

.contact-title {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 700;
}

.contact-description {
  color: #76d6ff;
}

.form-group-container {
  display: grid;
  gap: 1rem;
  margin-top: 2rem;

}

.form-group {
  display: flex;
  flex-direction: column;

}

.form-label {
  margin-bottom: 0.5rem;

}

.form-input,
.form-textarea {
  padding: 0.5rem;
  border: 1px solid #76d6ff;
  display: flex;
  height: 2.5rem;
  width: 100%;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  background-color: black;
  color: #76d6ff;
}

.form-input::placeholder,
.form-textarea:focus-visible {
  color: #76d6ff;

}

.form-input:focus-visible,
.form-textarea:focus-visible {
  outline: 2px solid #76d6ff;
  outline-offset: 2px;

}

.form-textarea {
  min-height: 120px;
 
}

.form-submit {
  width: 100%;
  margin-top: 1.2rem;
  background-color: #76d6ff;
  color: #000000;
  padding: 13px 5px;
  border-radius: 0.375rem;
}



#social-table {
margin-top: 0px;
margin-left: 15px;
border-spacing: 10px;
opacity: .9;

}
