@font-face { font-family: 'Aileron'; src: local('Aileron'), url('fonts/Aileron-Light.otf') }
html {background-color: #fff;}
body {padding: 0px; margin: 0px; background-image: linear-gradient(#ddd, #fff, #fff, #fff); height: calc(100vh - 20px);}
.list input {padding: 5px; margin: 10px; width: 350px;}
 #msg {font-size: 150%; width: 70%; margin: auto; padding-bottom: 20px; font-weight: bold; color: green;}
main {min-height: 50vh !important; font-family: Aileron; line-height: 1.5; border-radius: 0px; margin-top: 30px;}
main p {color: #666; width: 70%; margin-bottom: 40px; margin-left: auto; margin-right: auto; margin-top: 10px; font-size: 20px;}
.list {line-height: 35px; color: #666; width: 70%; margin-bottom: 40px; margin-left: auto; margin-right: auto; margin-top: 10px; font-size: 20px;}
.subtitle {border-bottom: solid 1px #5f879a; margin-left: auto; margin-right: auto; width: 70%; color: #5f879a; font-family: Aileron; font-size: 30px; letter-spacing: -1px; }
.logo {background: #e6921f; padding-right: 45px; padding-left: 60px; margin-left: -270px; height: 180px; width: 139px; padding-top: 40px; margin-bottom: -100px;}
.header {padding-left: 5px; font-weight: normal; letter-spacing: -3px; font-family: Aileron; color: #4b7385; font-size: 75px;}
.subheader {white-space: nowrap; color: #4b7385; font-size: 30px; padding-top: 5px; margin-left: 155px; margin-top: -40px; font-family: Aileron; font-style: italic;}
.heading {margin-left: 0px; margin-top: 20px; margin-bottom: 50px;}
.footer {padding-bottom: 30px; color: #4b7385; font-size: 15px; text-align: center; height: 20px;}
.hr1 {border-width: 0px; height: 2px; background-color: #044e70; left: 0px; margin-left: 0px; opacity: .2; width: 680px;}
.hr2 {position: absolute; border-width: 0px; height: 2px; left: 220px; background-color: #e6921f; top: 140px; opacity: 1; width: 730px;}
h4 {color: #044e70; margin: 0px; padding: 0px; font-size: 145%;}
textarea, input {border-radius: 5px; width: 590px; border: solid 1px #999;}
main a {text-decoration: none; color: #5f879a;}
nav {margin-bottom: 70px; text-align: center; width: 100%; border-top: solid 3px #5f879a; padding-top: 10px; margin-top: 30px; line-height: 110%; font-size: 30px;}
nav a {font-variant: small-caps; padding-right: 40px; font-family: Aileron; display: inline-block; text-decoration: none; color: #4b7385;}
.sflogo {border: solid 3px #5f879a; vertical-align: -50px; height: 100px; padding: 5px; background: linear-gradient(#ffb90f, #fbca02); border-radius: 0px; margin-left: 20px; margin-top: 20px;}
.header4 {width: 100%; margin-top: 0px; }
.selected {font-weight: bold;}
.leader {font-weight: bold; font-size: 30px; color: #4b7385;}
.submit_btn {width: 100px !important; }

@media only screen and (max-width: 1000px) {
    .sflogo {display: none;}
    .heading {text-align: center; margin-top: 50px; padding-bottom: 40px;}
    .header {font-size: 90px;}
    .subheader {font-size: 40px; margin-top: 0px !important; margin-left: 0px;}
    nav {padding-top: 50px; border-bottom: solid 3px #5f879a; padding-bottom: 30px;}
    nav a {margin-bottom: 30px; font-size: 60px; display: inline-block; padding-right: 20px;}
    .subtitle, main p {width: 95%;}
    nav a:before { content: '\2022'; margin-right: 6px;}
    .subtitle {font-size: 50px;}
    .leader, main p, li, p {line-height: 60px; font-size: 50px;}
    .list input, .list textarea, .list {white-space: nowrap; font-size: 40px; width: 95%;}
    .submit_btn {width: 200px !important; }
}