@keyframes fade {
    from {opacity: 0%;}
    to {opacity: 100%;}
}

#background {
    background-color: #0d030e;
    color: white;
}

#bottomSpace {
    margin-bottom: 2.5%;
}

#selfie {
    display: block;
    margin: auto;
    width: 20%;
    border-radius: 25px;
    animation-name: fade;
    animation-duration: 8s;
}

#introduction {
    margin: auto;
    width: 70%;
    font-size: 125%;
    animation-name: fade;
    animation-duration: 8s;
}

#introTitle {
    font-size: 300%;
    font-style: bold;
    animation-name: fade;
    animation-duration: 1s;
    animation-name: fade;
    animation-duration: 2s;
}

#introSubtitle {
    font-size: 150%;
    font-style: italic;
    margin-bottom: 2.5%;
    animation-name: fade;
    animation-duration: 3s;
}

.centered {
    text-align: center;
}

.line {
    margin: 2.5%;
    border-bottom: 5px solid white;
}

.websites {
    display: block;
    width: 50%;
    margin: auto;
}

* {
    box-sizing: border-box;
  }
  
  .row {
    display: flex;
  }

  .column {
    -ms-flex: 50%; /* IE 10 */
    flex: 50%;
    animation-name: fade;
    animation-duration: 5s;
    padding: 5px;
  }

  .twitter {
    width: 5%;
    margin-left: 15%;
  }
  .linkedin {
    width: 5%;
    margin-left: 5px;
  }

  @media only screen and (max-width: 600px) {
    #selfie {
        width: 50%;
    }
  }