/* Set padding to keep content from hitting the edges */
.body-content {
    margin-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
}
h1 {
   
    line-height: 30px;
}

.btn {
    /* min-width: 100%;*/
    text-align: left;
/*    margin: 15px 0px;*/
}

.input-group-btn button{
    margin-bottom:0px;padding:10px;
}

div.question {
    font-family: 'Inter Tight';
    font-weight: 600;
    color: #000;
}
span.questionSubTitle {
    font-family: 'Inter Tight';
    line-height: 120%;
    font-size:15px; line-height:inherit;
}

p {
    font-family: 'Inter';
    line-height: 120%;
    font-size: 15px;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.date-dropdowns .col-md-4 select{ margin-bottom:10px; }

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

.ans-info .alert {
    font-family: 'Inter Tight';
    line-height: 120%;
    font-size: 15px;
}

nav.bg-dark{ background-color:#000 !important;

}
nav a.navbar-brand {
color:black !important;
}

h1 {
    font-family: 'Inter Tight';
    font-size:2.3rem;
    font-weight:700;
    line-height:43px;
}

span.sub-banner, h2 {
    font-family: 'Inter Tight'; color:#222;
    font-size:1.6rem; font-weight:500;
}

.container{
    max-width:80% !important;
}
p.sub-banner {
    
}

.sub-error {
    color: red;
    position: absolute;
    font-size: 13px;
}

.btn.active {
    color: #fff;
    background-color: #109379;
    border-color: #fffefe;
}

section#jumbotron {
    position: relative;
    width: 100%;
    height: 90vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

    section#jumbotron .content {
        color: #fff;
        position: relative;
        z-index: 1;
        margin: 0 auto;
        max-width: 85ch;
        text-align: center;
    }

    section#jumbotron:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 28%;
        background: #17a88b1c;
        border-radius: 0 0 43% 178% / 0 0 1% 223%;
        transform: scaleX(1);
        z-index: -100;
    }

section#body {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-top: 10em;
    padding: 3em 0;
}

    section#body .content {
        color: #260645;
        position: relative;
        z-index: 1;
        margin: 0 auto;
        max-width: 85ch;
        text-align: center;
    }

    section#body:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 71%;
        /* background: #FFEB3B; */
        border-radius: 50% 50% 0 0 / 100% 100% 0 0;
        transform: scaleX(1.5);
        z-index: -100;
        background-image: linear-gradient(#e5e5e580 29%, white 61%);
    }

:root {
    --width: 100%;
    --height: 40px;
    --top-color: #f44336;
    --bottom-color: #2196F3;
}

.separator {
    position: relative;
    width: var(--width);
    height: var(--height);
}

    .separator::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background-color: var(--top-color);
        clip-path: polygon(100% 0, 0 0, 0 100%);
    }

    .separator::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background-color: var(--bottom-color);
        clip-path: polygon(100% 0, 0 100%, 100% 100%);
    }

    .separator.reverse {
        transform: rotateY(180deg);
    }

.vertical .separator.reverse {
    transform: rotateX(180deg);
}

@media only screen and (max-width: 600px) {
    .container {
    max-width:100% !important;
    }

    section#body:before {      
        height: 13%;       
    }
    h1 {       
        font-size: 1.5rem;      
        line-height: 30px;
    }

    p {
        font-family: 'Inter Tight';
 
        line-height: 120%;
       
    }
    .sub-banner {
        font-family: 'Inter Tight';
        font-size:1.2rem !important;
    }
    div.question {
        font-family: 'Inter Tight';
    }
    .form-title, h2 {
        font-family: 'Inter Tight';
        font-size: 1.2rem;
    }

}

.process li{
    list-style:none;
}

.personal-info-form input, .personal-info-form select {min-width:100%; text-align:left; padding:10px;}

footer {
background-color: #000;
color:#fff;
min-height:200px; 
padding-bottom:15px;
}
footer p {
   font-size:14px; font-family : 'Inter Tight'; line-height:25px;
}
    footer ul.footer-links {
        display: flex;
        justify-content: center;
        margin: 0px 0px 20px 0px;
        padding: 0px;
        flex-wrap: wrap;
    }

    footer ul.footer-links li {
        list-style: none;
        float: left; 
    }
        footer ul.footer-links li a{
           color:#888; 
           display:block; padding:5px 10px; text-decoration:none;
        }


            footer ul.footer-links li a:hover {
                -webkit-transition: color ease-in-out 800ms;
                color: #109379;
            }

   

#loginForm{
    margin:60px 0px;
}


footer img{

  margin:30px 0px;
  


}