@import url("https://fonts.googleapis.com/css?family=Montserrat|Roboto|Source+Sans+Pro");
html, body { font-family: "Source Sans Pro", "Roboto", Arial, Helvetica, sans-serif; font-weight: 400; color: #f5f5f5; }
body { background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url("../images/6457-Balcom-Ave_01.jpg"); background-size: cover; background-position: center center; background-repeat: no-repeat; background-attachment: fixed; height: 100%; margin: 0; }
h1, h2, h3, h4, h5, h6 { font-family: "Montserrat", "Source Sans Pro", "Roboto", Arial, Helvetica, sans-serif; font-weight: 400; color: #f2f2f2; }
a { color: #f5f5f5; }
a:hover { color: #dddddd; text-decoration: none; }
::placeholder { color: #f5f5f5 !important; }
#profile-card { top: 0; padding-top: 30vh; padding-bottom: 5vh; min-height: 45vh; }
#profile-card .avatar { padding: 1em 0; }
#profile-card .avatar > img { border-radius: 50%; width: 150px; height: 150px; }
#profile-card hr { width: 10%; margin: 0px; }
#profile-card .divider { border-top: solid 1px #aaaaaa; }
#profile-card .fa-1x { font-size: 1.3em; }
#profile-card .text-spacing { letter-spacing: 0.5rem; }
@media screen and (max-width: 1920px) { #profile-card { padding-top: 25vh; } }
@media screen and (max-width: 1440px) { #profile-card { padding-top: 30vh; } }
@media screen and (max-width: 1200px) { #profile-card { padding-top: 20vh; } }
@media screen and (max-width: 1024px) { #profile-card { padding-top: 25vh; } #profile-card hr { width: 30%; } }
@media screen and (max-width: 480px) { #profile-card { padding-top: 20vh; padding-bottom: 10vh; } #profile-card hr { width: 30%; } }
@media screen and (max-width: 350px) {#profile-card { padding-top: 15vh; } }