/* ===================== LOCAL FONT ========================================= */
@font-face { font-family: font-head; src: url("../fonts/BALLW__.TTF"); }
/* ===================== MAIN CONTENT ======================================= */
*{ margin: 0px; padding: 0px; }
body{ background: #0000CC; }
main, footer, div, img, p, input, button{ display: block; position: relative; }
button{ border: none; text-decoration: none; background: none; cursor: pointer; }
main{ margin-bottom: 70px; }
footer{ position: relative; bottom: 0vh; width: 100%; height: 70px; padding: 0px; margin: 0px; background-color: #010D28; color: #FFFFFF; }
*.copyright{ font-size: 65%; position: absolute; left: 10px; bottom: 5px; color: #D6D6D6; }
/* ===================== NAV ================================================ */
#menu nav{ float: right; margin: 4px 10px; }
#menu nav ul{ margin: 0; padding: 0; }
#menu nav ul li{ list-style: none; float: left; width: 110px; }
#menu nav ul li a{ display: block; color: #FFFFFF; font-size: 1.2em; text-decoration: none; padding: 3px 0; width: 100%; text-align: center; }
#menu nav ul li a:hover{ color: #CC0000; }
/* ===================== SECTION ============================================ */
.section:nth-child(1){ margin-top: 100px; }
.section{
  height: 100vh;
  min-height: 800px;
  overflow: hidden;
  padding-top: 60px;
  position: relative;
  border: 1px solid black;
  background-size: cover;
  background-position: center center;
}
.section h2{
  background-color: white;
  padding: 5px;
  font-size: 2em;
  text-transform: uppercase;
  text-align: center;
}
.section article{
  background-color: rgb(255,255,255);
  background-color: rgba(255,255,255,0.8);
  padding: 10px; margin: 10px;
  border-radius: 20px;
}
#intro{
  background-image: url(/images/pimage1.jpg);
  background-color: chartreuse;
}
#intro p{ font-size: 1.2em; padding: 3px; }
#history{
  background-color: darkmagenta;
}
#strengths{
  background-color: #0000CC;
}
#weaknesses{
  background-color: #00CC00;
}
#biography{
  background-color: #C3C3C3;
}

.fixpoint{
  background-attachment: fixed;
}

/* ===================== RESPONSIVE SETTINGS ================================ */
@media screen and (min-width : 20em) and (max-height : 23em) {  }
@media screen and (min-width: 20em) and (min-height : 24em) {  }
/* ===== == = === 20em (320px) === = == ========== */
@media screen and (min-width : 320px) {
}
/* ===== == = === 30em (480px) === = == ========== */
@media screen and (min-width : 30em) and (min-height : 24em) {
}
/* ===== == = === 37.5em (600px) === = == ======== */
@media screen and (min-width: 37.5em) {
}
/* ===== == = === 48em (768px) === = == ========== */
@media screen and (min-width : 48em) {
  *.copyright{ font-size: 100%;  }
}
/* ===== == = === 56.25em (900px) ================ */
@media screen and (min-width : 56.25em) {
}
/* ===== == = === 68.75em (1100px) =============== */
@media screen and (min-width : 68.75em) {
}
/* ===== == = === 81.25em (1300px) =============== */
@media screen and (min-width : 81.25em) {
}