html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    color: #333;
    background-color: #f2f2f2;
    font-family: Verdana, Arial, sans-serif;
    line-height: 18px;
    margin: 0 auto !important; /*centers page*/
    /*overflow-y: scroll;*/
    /*background-image: url('Images/shad.png');*/
    background-repeat: repeat-y;
    background-attachment: scroll;
    background-position: center center;
}

.decimal-day {
    /*color: #333 !important;*/
}
.decimal-day label:hover {
    color: #333 !important;
}

    .decimal-day input {
        padding: 5px;
        text-align: center;
    }

    .decimal-day input:disabled {
        background: #888 !important;
    }

.wrapper {
    min-height: 100%;
    margin: 0 auto 0 auto;
    padding: 0;
    background-color: #ffffff !important;
    border: 0 solid #E3E3D5;
}

    .wrapper > .container {
        margin-top: 10px;
    }

.container {
    color: rgb(100, 100, 100);
    /*margin-top: 20px;
	padding: 20px;*/
    padding-bottom: 20px; /* Height of the footer element */
}

.footer {
    text-align: center;
}

h1 {
    margin: 0 0 10px 0;
    font-weight: normal;
    font-size: 30px;
}

h2 {
    margin: 0 0 10px 0;
    font-weight: normal;
    font-size: 27px;
}

h3 {
    color: #1A75BC !important; /*0E76BC*/
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Sans Grande', 'Lucida Sans Unicode';
    font-size: large !important;
    font-weight: normal;
    /*text-decoration: none;*/
    /*display: block !important;*/
    margin-bottom: 4px !important;
}

.wtcColorBlue-light {
    color: #E2E9F8; /*box*/
}

.wtcColorBlue-medium {
    color: #8FAAD8; /*logo*/
}

.wtcColorBlue-medium-dark {
    color: #0E76BC; /*titles*/
}

.wtcColorBlue-dark {
    color: #1A75BC; /*logo*/
}

.wtcColorOrange {
    color: #FAA61A; /*logo*/
}

.wtcColorRed-dark {
    color: #BF202F; /*logo*/
}

.wtcColorRed-medium {
    color: #CC0000; /*font*/
}

.wtcColorGray {
    color: #888984; /*box header*/
}



.errorPanel {
    color: black;
    background-color: pink;
    padding: 10px 5px 10px 5px;
    border: 1px solid #FF0000;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-bottom: 10px;
}

.errorBackgroundColor {
    background-color: pink !important;
}

.requiredIndicator {
    font-size: 90%;
}

.card{
    background-color: #e2e9f8;
    padding: 10px;
    border: 1px solid #8faad8;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-bottom: 14px;
}

.progressIndicator, .progressIndicatorCenter {
    margin-left: auto;
    margin-right: auto;
    font-size: 90%;
    text-align: center;
    vertical-align: middle;
    line-height: 2.5em;
}

.progressIndicatorCenter {
}

a[href], input[type='submit'], input[type='image'], input[type=checkbox], label[for], select, button, .pointer {
    cursor: pointer;
}

.aspHyperLink {
    color: #1875BD;
    text-decoration: none;
}

    .aspHyperLink:hover {
        color: #0065CE;
        text-decoration: underline;
        cursor: pointer;
    }

.aspRadioButtonList input[type=radio] {
    margin-right: 5px;
}

.aspRadioButtonList label {
    display: inline !important;
    padding-right: 8px;
    font-weight: normal;
}

    .aspRadioButtonList input[type="radio"]:hover, .aspRadioButtonList label:hover, .aspRadioButtonList input[type="radio"]:hover + label {
        cursor: pointer;
        color: #0094ff;
    }

    .aspRadioButtonList label + br {
        margin-bottom: 12px;
    }

.aspRadioButtonList-table input[type=radio] {
    vertical-align: auto !important;
}

.aspRadioButtonList tr td {
    padding-bottom: 5px;
}

.aspRadioButtonList input[type="radio"]:checked, .aspRadioButtonList input[type="radio"]:hover:checked, .aspRadioButtonList input[type="radio"]:checked + label {
    cursor: default !important;
    color: #333333; /*#660066 #006FBF*/
}

.aspCheckBoxList {
    display: inline-block;
}

    .aspCheckBoxList input[type=checkbox] {
        margin-right: 5px;
        position: absolute;
        margin-left: -20px;
        margin: 4px 0 0;
    }

    .aspCheckBoxList input[type="checkbox"]:checked, .aspCheckBoxList input[type="checkbox"]:checked + label {
        color: #333333; /*#660066 #006FBF*/
    }

    .aspCheckBoxList input[type="checkbox"]:hover, .aspCheckBoxList label:hover, .aspCheckBoxList input[type="checkbox"]:hover + label {
        color: #0094ff;
    }

select:hover {
    cursor: pointer !important;
}

select:focus {
    cursor: pointer !important;
    border: 1px solid #129FEA !important;
    background-color: #E3FFE1 !important;
}

input[type="text"]:hover, textarea:hover {
    cursor: pointer;
    border: 1px solid #129FEA !important;
}

input[type="text"]:focus, textarea:focus {
    cursor: text;
    border: 1px solid #129FEA !important;
    background-color: #E3FFE1; /*#99FFCC #c6fce1*/
}

input[type=text]::-ms-clear {
    display: none !important;
    width: 0;
    height: 0;
}
/*::-ms-clear 
{ 
	display: none !important; 
	width : 0;
	height: 0;
}*/

/*input[type="text"]:hover + label, textarea:hover + label
{
	color: #1A75BC; 
}*/


/*.wtcColorBlue-dark .LESS !!!SPM!!!*/
.labelImitator-NoSelection {
    font-size: 90%;
    width: 10em;
    text-align: right;
    margin-top: 0;
    margin-right: 1em;
    margin-bottom: 0;
    margin-left: 0;
    vertical-align: middle;
    display: inline-block;
}

    .labelImitator-NoSelection:hover {
        cursor: default;
    }

label:hover {
    color: #1A75BC;
}


.horizontalRule {
    margin: 10px;
}

.header-form-group {
    font-size: large;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    color: #1A75BC;
}

.aspButton, .aspButton-back, .aspButton-next {
    width: 5em;
    color: white;
    background-color: #1A75BC !important;
}

.aspButton-back {
    float: left;
}

.aspButton-next {
    float: right;
}

.aspGridView td, .aspGridView th {
    padding: 5px 10px 0px 10px;
}

.aspGridView, .aspGridView td, .aspGridView th {
    border-width: 0px;
    border-style: none;
    border-collapse: collapse;
}

/*
The Overflow Method relies on setting the overflow CSS property on a parent element. 
If this property is set to auto or hidden on the parent element, the parent will expand to contain the floats, effectively clearing it for succeeding elements. 
This method can be beautifully semantic as it may not require an additional elements. 
However if you find yourself adding a new div just to apply this, it is equally as unsemantic as the empty div method and less adaptable. 
Also bear in mind that the overflow property isn't specifically for clearing floats. 
Be careful not to hide content or trigger unwanted scrollbars.
*/
/*used to clear floats contained within a div and prevent the floated elements from appearing outside of a collapsed parent */
.floatContainer {
    overflow: auto;
}

/*.aspRadioButtonList input[type="radio"]:checked
{
	cursor: default !important;
	color: #006FBF !important;
}
.aspRadioButtonList input[type="radio"]:checked:hover
{
	cursor: default !important;
	color: #006FBF !important;
}

.aspRadioButtonList input[type="radio"]:checked + label:hover
{
	cursor: default !important;
	color: #006FBF !important;
}

.aspRadioButtonList input[type="radio"]:checked:hover + label:hover
{
	cursor: default !important;
	color: #006FBF !important;
}*/


.ajaxValidatorCalloutExtender-Highlight {
    background-color: #FFFACD !important; /*LemonChiffon = FFFACD*/
}




.opacity80to100 {
    opacity: 0.8;
    filter: alpha(opacity=80);
}

    .opacity80to100:hover {
        opacity: 1;
        filter: alpha(opacity=100);
    }

.marginBottom04px {
    margin-bottom: 04px;
}

.marginBottom12px {
    margin-bottom: 12px;
}

.marginLeft10px {
    margin-left: 10px;
}

.marginLeft40px {
    margin-left: 40px;
}

.helpContainer, .helpContainerSurvivor {
    line-height: 125%;
}

.helpContainerSurvivor {
    margin-bottom: 10px;
}


/*#region MODAL POPUP */
.modalBackground, .modalBackground_UpdateProgress {
    background-color: #838383;
    filter: alpha(opacity=70); /*IE*/
    opacity: 0.7; /*Firefox*/
}

.modalBackground_UpdateProgress {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11000;
}

.modalBackground {
    z-index: 999 !important;
}

.modalPanel, .modalPanel_UpdateProgress, .modalPanel_ModalWithinAModal {
    background-color: #FFFFFF; /*#FFFFFF E6ECF9 e2e9f8*/
    border: 2px Solid Black; /*7C9CD1 #8faad8*/
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 33px 9px rgba(0,0,0,0.61);
    -moz-box-shadow: 0 0 33px 9px rgba(0,0,0,0.61);
    box-shadow: 0 0 33px 9px rgba(0,0,0,0.61);
    padding: 20px;
}

.modalPanel {
    z-index: 1000 !important;
}

.modalPanel_UpdateProgress {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 130px;
    height: 200px;
    z-index: 11001;
}

.modalPanel_ModalWithinAModal {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 300px;
    height: 600px;
    overflow: auto;
    /*
    width: 600px;
    height: 800px;
	*/
    z-index: 11001;
}
/*#endregion */

.centerImage {
    display: block;
    margin-left: auto;
    margin-right: auto;
}


.noticeContainer {
    max-height: 300px;
    overflow: auto;
}

.noticeHeader, .noticeSubHeader {
    font-weight: bold;
    text-decoration: underline;
    font-size: smaller;
}

.noticeSubHeader, .noticeSubSection1 {
    padding-left: 25px;
}

.noticeSubHeader {
    text-decoration: none;
}

.noticeSubSection2 {
    padding-left: 50px;
}

.noticeSubSection3 {
    padding-left: 75px;
}

.listItemHeader {
    margin-bottom: 10px;
}


/*#headerImage {
    width: 100%;
    background-color: rgba(14, 93, 157, 1);
}
.banner {
    width: 100%;
    background-color: rgba(14, 93, 157, 1);
    height: 130px;
}*/

@media (max-width: 768px) {
    #headerImage,
    #headerImage .container,
    #headerImage .container .banner,
    #headerImage .container .banner .bannerImage {
        padding-left: 0px;
        padding-right: 0px;
        width: 100%;
        position: relative;
        margin-left: 0;
    }

    #headerImage {
        background-color: #0e5d9d;
    }

        #headerImage .container {
            width: 100%;
            background-color: #0e5d9d;
            height: 30px;
        }

    .banner .bannerImage {
        height: 30px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        background-repeat: no-repeat;
        background-image: url(images/bannerSmall_blue.png);
    }

    .researcherInfo .imageContainer {
        max-width: 150px;
    }

    .researcherInfo img {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 10px;
    }

    .linkSpanner {
        position: absolute;
        width: 100%;
        height: 30px;
        top: 0;
        left: 0;
        z-index: 1;
        /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif 
  background-image: url('empty.gif');*/
    }
}


@media (min-width: 768px) {
    #headerImage {
        background-color: #0e5d9d;
    }

        #headerImage .container {
            background-color: #0e5d9d;
            height: 130px;
        }

    .banner .bannerImage {
        height: 130px;
        margin-left: auto;
        margin-right: auto;
        background-repeat: no-repeat;
        background-image: url(images/tinyLearn.png);
    }

    .linkSpanner {
        position: absolute;
        width: 100%;
        height: 130px;
        top: 0;
        left: 0;
        z-index: 1;
        /* edit: fixes overlap error in IE7/8, 
         make sure you have an empty gif 
      background-image: url('empty.gif');*/
    }
}

@media (min-width: 992px) {
    #headerImage {
        background-color: #0e5d9d;
    }

        #headerImage .container {
            background-color: #0e5d9d;
            height: 130px;
        }

    .banner .bannerImage {
        height: 130px;
        margin-left: auto;
        margin-right: auto;
        background-image: url(images/banner5.png);
        background-repeat: no-repeat;
    }

    .linkSpanner {
        position: absolute;
        width: 100%;
        height: 130px;
        top: 0;
        left: 0;
        z-index: 1;
        /* edit: fixes overlap error in IE7/8, 
         make sure you have an empty gif 
      background-image: url('empty.gif');*/
    }
}

@media all and (min-width: 1200px) {
    .container {
        width: 1170px;
    }

    #headerImage {
        background-color: #0e5d9d;
    }

        #headerImage .container {
            background-color: #0e5d9d;
            height: 130px;
        }

    .banner .bannerImage {
        height: 130px;
        margin-left: auto;
        margin-right: auto;
        background-image: url(images/banner5.png);
        background-repeat: no-repeat;
    }

    .linkSpanner {
        position: absolute;
        width: 100%;
        height: 130px;
        top: 0;
        left: 0;
        z-index: 1;
        /* edit: fixes overlap error in IE7/8, 
         make sure you have an empty gif 
      background-image: url('empty.gif');*/
    }
}
.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent;
}


.navbar-inverse, .navbar-brand {
    background-color: #FAA61A;
    border-color: #080808;
    color: #000;
}

    .navbar-inverse .navbar-nav > li > a, .navbar-inverse .navbar-brand {
        color: #000;
    }

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%
}

#nav > .container {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    padding-bottom: 0px;
}



.navbar-text a {
    color:#000;
    text-decoration: none;
}
.navbar-text a:hover, .navbar-text a:focus {
    color: #fff;
    
}

.navbar-inverse, .navbar-brand, .navbar {
    background-color: #FAA61A;
    border-color: #080808;
    color: #000;
}

.navbar .nav-link {
        color: black;
}
.navbar .nav-link:hover, .navbar .nav-link:focus {
    color:white !important
}
.navbar .container {
      padding-bottom:0;
}

.navbar-brand:hover, .navbar-brand:focus {
        color: white;
}


#nav-wrapper #nav, #nav .container {
    margin-bottom: 0px !important;
}

#nav-wrapper {
    background-color: #0E5D9D;
}

.navbar .navbar-toggler {
    color: white;
    border-color: #333;
    margin-top: .5rem;
    margin-bottom: .5rem;
    padding: 0.1rem .35rem;
}

.navbar-toggler:hover, .navbar-toggler:focus {
    background-color: #333
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.responderType .responderDescription {
    padding-top: 20px;
}

.responderType img {
    padding: 0px;
}

@media (max-width: 470px) {
    .responderType .imageContainer {
        padding: 0px;
    }

    .responderType .responderDescription {
    }
}


fieldset {
    border: none;
}

.row {
    max-width: 100%;
}

.floatContainer .row {
    margin-bottom: 10px;
}

@media (max-width: 250px) {
    .btn-responsive {
        padding: 2px 4px;
        font-size: 80%;
        border-radius: 3px;
    }
}

@media (min-width: 251px) and (max-width: 471px) {
    .btn-responsive {
        padding: 4px 9px;
        font-size: 90%;
    }
}


.control-label, .control-label-left, .control-label-selected {
    font-weight: normal;
}

.control-label {
    text-align: right;
}

.control-label-selected {
    color: #333333 !important;
}

hr {
    border-top: 1px solid #999;
    margin-top: 10px;
    margin-bottom: 20px;
}

.no-gutter {
    padding-right: 0;
    padding-left: 0;
}

.no-horizontal-margin {
    margin-left: 0;
    margin-right: 0;
}

#septemberCalendar th, #octoberCalendar th, #novemberCalendar th {
    text-align: center;
}

#septemberCalendar .card-header, #octoberCalendar .card-header, #novemberCalendar .card-header {
    padding: 5px;
    text-align: center;
    height: 28px;
}
#septemberCalendar .card, #octoberCalendar .card, #novemberCalendar .card {
    padding:0;
}

#septemberCalendar .card-body, #octoberCalendar .card-body, #novemberCalendar .card-body {
    padding: 0;
    text-align: center;
}

#septemberCalendar label:hover, #octoberCalendar label:hover, #novemberCalendar label:hover {
    color: #000;
}

.checkbox > div {
    margin-left: 30px;
}

    .checkbox > div label {
        padding-left: 25px;
    }

.calendarIcon {
    height: auto;
    padding: 10px 5px 10px 5px;
}

.ajax__calendar {
    right: 0px;
    left: auto !important;
}

.bottom-buffer {
    margin-bottom: 10px;
}

.top-buffer {
    margin-top: 10px;
}

legend {
    border-bottom: none;
    margin-bottom: 1.25rem;
}

@media (max-width: 767px) {
    .imageContainer {
        padding-left: 0px;
        padding-right: 0px;
    }
    .responderType img{
        float:left;
    }
    .responderDescription{
        float:right;
    }
}
@media (max-width: 576px) {

    .responderType img {
        float: left;
        max-width:25%;
    }

    .responderDescription {
        float: right;
        max-width:75%;
    }
}

.imageContainer img {
    height: 100%;
    width: 100%;
    padding-top: 20px;
    max-height: 320px;
}

.inlineBottom {
    display: inline;
    vertical-align: bottom;
}

.stepXofY {
    white-space: nowrap;
}

.supportingDocumentsContainer {
    width: 97%;
    overflow-x: scroll;
    margin-bottom: 10px;
    border-radius: 10px;
    padding: 20px;
    background-color: white;
}

.reviewContainer {
    margin-bottom: 10px;
}

    .reviewContainer h3 {
        display: inline;
        vertical-align: bottom;
        margin-bottom: 5px;
    }

.reviewSectionContainer {
    display: table;
    width: auto;
    margin-right: 0px; /*align right*/
    margin-left: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px;
}

.reviewSectionContent {
    display: table-cell;
    vertical-align: bottom;
    text-align: right;
}

.reviewButton {
    margin-left: 5px;
}

.btn-primary, .btn-primary-disabled, .btn-primary:disabled, .btn-primary-disabled:hover, .btn-primary:disabled:hover {
    background-color: #337ab7;
    border-color: #2e6da4;
}
.btn-primary-disabled, .btn-primary:disabled {
    cursor:not-allowed;
}

.btn-primary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}
.btn-outline-secondary {
    background-color: #fff;
    border-color: #ccc;
}
.btn-outline-secondary:hover {
    background-color: #e6e6e6;
    border-color: #adadad;
    color: #6c757d;
}

.card-primary > .card-header {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}