/* LAYOUT ------------------------------------------------------------------- */
/* This CSS is largely adapted/plagiarized from Lola Santos's much better website- https://lolasantos.xyz/. --*/

body{
  margin: 0;
  font-family: Verdana, Arial, serif, sans-serif;
    max-width: 1400px;
  background-color: #fffdf8;
  color: #141414;
  
}

section{
  margin: 20px;
  position: relative;
  margin-left: 100px;
}

#about{
 position: absolute;
  left: 290px;
  width: 500px;
}

@media only screen and (max-device-width: 480px){
  section{
    margin-left: 10px;
  }

  #headshot{
    display: none;
  }

  #about{
    left: 0;
    width: auto;
  }
}

/* HEADSHOT ----------------------------------------------------------------- */
#headshot{
}

#headshot img{
  width: 250px;
  border: 4px solid #141414;
}

/* FANTOM ------------------------------------------------------------------- */

#fantom {
  background-color: #121212;
  color: #00FFAE;
  position: absolute;
  width: 500px;
  left: 200px;
  top: 300px;
  display: none;
}

#fantom a {
  color: #00FFAE;
  text-decoration: none;
}

/* TENEBRA ------------------------------------------------------------------- */

#tenebra {
  background: #838bfc; /* Old browsers */
  background: -moz-radial-gradient(center, ellipse cover, #838bfc 0%, #FFC1E9 100%); /* FF3.6-15 */
  background: -webkit-radial-gradient(center, ellipse cover, #838bfc 0%,#FFC1E9 100%); /* Chrome10-25,Safari5.1-6 */
  background: radial-gradient(ellipse at bottom right, #838bfc 0%,#FFC1E9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  color: #64387C;
  position: absolute;
  width: 610px;
  left: 200px;
  top: 100px;
  display: none;
}

#tenebra img {
  width: 600px;
  margin: 0;
  padding: 0;
}

/* BLOG --------------------------------------------------------------------- */

#blog {
  width: 600px;
}

.blog-blurb {
  margin-bottom: 60px;
}