/* --- Reset --- */
* { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box; 
    padding: 0px;
    margin: 0px;
 }
 
 html, body { 
    height: 100%; 
    width: 100%; 
 }
 
 body {
   font-family: "Inter", sans-serif;
   font-weight: 300;
   background-color: #2b2b2b;
   color: #ccc !important;
 }
 
 ::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder { 
   color:    #999;
   font-family: "Inter", sans-serif;
   font-weight: 300;
 }
 
 p {
   font-size: 18px;
 }
 
 a, input, textarea, select, button {
    transition: background-color 0.8s ease;
    -webkit-appearance: none;
    appearance: none;
    font-family: "Inter", sans-serif;
 }
 
 /* --- Main styles --- */
 .holder {
     display: inline-block;
     max-width: 800px;
     text-align: center;
     padding: 30px;
 }
 
 .main {
     display: flex;
     justify-content: center;
     align-items: center;
     height: 100%;
     width: 100%;
 }
 
 .main h1 {
     font-size: 50px;
     font-weight: bold;
     margin-top: 10px;
 }

 a {
    display: inline-block;
    margin-top: 50px;
    padding: 10px 20px;
    border-radius: 10px;
    background-color: #0099cc;
    color: white;
    font-weight: bold;
    font-size: 18px;
    text-decoration: none;
 }

 a:hover {
    background-color: #006699;
 }

 .me img {
    width: 150px;
    height: 150px;
    display: inline-block;
    border-radius: 50%;
 }