/* CUSTOM STYLES */
.pretext {
    color: #000000;
}

.pretextActive {
    color: #a1a1a1;
    font-style: italic;
}

.dateInput {
    color: #000000;
}

.phoneInput {
    color: #000000;
}

.style1 {
    font-size: large;
    color: #000000;
    text-align: center;
    /*font-family: "Comic Sans MS";*/
    /*font-style: italic;*/
    height: auto;
    font-weight: bolder;
    margin-bottom:24px;
}

a {
    color: #0950a0;
    text-decoration: underline;
}

/* Header: left-aligned, background only behind text */
/*.style2-header {
    display: inline-block;*/ /* shrink background to text */
    /*background-color: #008080;*/ /* teal */
    /*color: #fff;
    padding: 6px 10px;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 10px;*/ /* space below header */
    /*vertical-align: top;*/ /* optional: aligns with paragraph baseline */
    /*float:left;
}*/

input[type="radio"] {
    accent-color: #008080;
    margin-right: 8px;
}

.question {
    margin-bottom: 24px;
}

.question-text {
    margin-bottom: 12px;
    font-weight: 600;
}

.question-answers label {
    display: inline-block;
    margin-bottom: 6px;
}

.form-input {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box; /* CRITICAL */
}

.form-panel {
    padding: 12px;
}   

.input-name {
    width: 100%;
    max-width: 200px;
    box-sizing: border-box;
}

.input-address {
    width: 100%;
    max-width: 410px;
    box-sizing: border-box;
}

input[type="text"],
select {
    border-width: 1px;
}

.asp-textbox {
    border-width: 1px;
}



.login-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 20px;
}

/* Small screens */
@media (max-width: 576px) {
    .login-container {
        min-height: 100vh;
        justify-content: normal; /* vertical center */
    }

        .login-container input,
        .login-container button {
            width: 100%;
            max-width: 280px;
        }
}








.style2-header {
    display: inline-block; /* hug text width */
    background-color: #009999; /* slightly different teal */
    color: #ffffff;
    font-size: 20px; /* slightly bigger than button */
    font-weight: bold;
    padding: 8px 14px; /* a bit more padding than buttons */
    margin-bottom: 12px;
    border-left: 6px solid #006666; /* adds visual accent on left */
    border-radius: 4px; /* subtle rounding */
    text-shadow: 1px 1px 2px rgba(0,0,0,0.2); /* gentle shadow for depth */
    float: left; /* keep left-aligned */
}



/* Paragraph: left-aligned, starts on its own line */
.style2 {
    display: block; /* ensures paragraph starts below header */
    text-align: left;
    font-size: 14px;
    color: #222;
    line-height: 1.5;
    margin: 0;
    margin: 0 0 15px 0; /* bottom margin creates spacing after paragraph */
    clear: both; /* ensures paragraph starts below header */

}


.style6 {
    color: #000000;
}

.style6 {
    text-align: center;
}

.style7 {
    text-align: left;
}

.teal-button {
    background-color: #008080;
    color: #ffffff;
    border: none; /* removes edges */
    outline: none;
    padding: 6px 14px;
    font-size: 14px;
    cursor: pointer;
}

    .teal-button:hover {
        background-color: #006d6d;
    }



/* 3-COLUMN LAYOUT STYLES */
/* mac hide\*/
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

end hide
body {
    padding: 0;
    margin: 0 !important;
    text-align: center;
    /*min-width: 1150px;*/
    /*for mozilla*/
    background-color: #FFFFFF;
    color: #000000;
}


#outer {
    height: 100%;
    min-height: 100%;
    /*width: 1150px;*/
    color: #000000;
    text-align: left;
    /*margin: auto;*/
    position: relative;
    max-width: 1150px;
    margin: 0 auto; /* centers the layout */
    padding: 0 15px; /* optional: adds a little gutter on small screens */
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* full viewport height */
}

html > body #outer {
    height: 100%;
}
/*for mozilla as IE treats height as min-height anyway*/
#innerwrap { /* enables content first */
    /*float: left;*/
    /*width: 867px;*/
    /*height: 100%;*/
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex: 1;
}

#header {
    position: absolute;
    text-align: center;
    top: 0;
    left: -1px;
    width: 858px;
    height: 70px;
    margin-bottom: 35px;
    background: #FFFFFF;
    overflow: hidden;
    color: #000000;
    z-index: 100;
}

#left {
    position: relative; /*ie needs this to show float */
    width: 120px;
    /*height: 1100px;*/
    float: left;
    background-image: url(../images/NYTD_left.gif);
    background-repeat: no-repeat;
    background-position: left top;
    padding-top: 0px; /*needed to make room for header*/
    padding-bottom: 32px; /* needed to make room for footer */
}

    #left p {
        padding-left: 3px;
        padding-right: 2px
    }

#right p {
    padding-left: 4px;
    padding-right: 2px
}

#right {
    position: relative; /*ie needs this to show float */
    width: 260px;
    /*height: 1100px;*/
    float: right;
    background-image: url(../images/NYTD_right.gif);
    background-repeat: no-repeat;
    background-position: right top;
    padding-top: 0px; /*needed to make room for header*/
    padding-bottom: 32px; /* needed to make room for footer */
}

#container {
    min-height: 100%;
    margin-bottom: -330px;
    position: relative;
}

/*#footer {
    width: 100%;*/ /* takes full width of parent */
    /*clear: both;*/ /* ensures it appears below floated elements */
    /*height: 60px;*/ /* fixed height */
    /*background-color: #FFFFFF;
    color: #000000;
    text-align: center;
    left: 0;
    bottom: 0;
    position: relative;*/ /* positioned relative, not fixed */
    /*overflow: hidden;*/ /* hides anything overflowing */
    /*background-color: #fff;
    color: #000;
    text-align: center;
    padding: 10px 0;
}*/

/* IE5/6 hack */
/** html #footer {
    height: 52px;*/ /* for ie5 */
    /*height: 50px;*/ /* for ie6 */
/*}*/


div, p {
    margin-top: 0
}
/*clear top margin for mozilla*/
#centrecontent {
    /*width: 743px;*/
    /*height: 100%;*/
    /*float: right;*/
    flex: 1;
    padding-top: 10px;
    padding-bottom: 32px; /* needed to make room for footer */
    /*width: 100%;*/
    box-sizing: border-box;
}

    #centrecontent p {
        padding-left: 3px
    }

#clearfooter {
    width: 100%;
    height: 330px;
    clear: both
}
/* to clear footer */








/* CALENDAR STYLES */
table.jCalendar {
    border: 1px solid #000;
    background: #aaa;
    border-collapse: separate;
    border-spacing: 2px;
}

    table.jCalendar th {
        background: #333;
        color: #fff;
        font-weight: bold;
        padding: 3px 5px;
    }

    table.jCalendar td {
        background: #ccc;
        color: #000;
        padding: 3px 5px;
        text-align: center;
    }

        table.jCalendar td.other-month {
            background: #ddd;
            color: #aaa;
        }

        table.jCalendar td.today {
            background: #666;
            color: #fff;
        }

        table.jCalendar td.selected {
            background: #f66;
            color: #fff;
        }

            table.jCalendar td.selected.dp-hover {
                background: #f33;
                color: #fff;
            }

        table.jCalendar td.dp-hover,
        table.jCalendar tr.activeWeekHover td {
            background: #fff;
            color: #000;
        }

    table.jCalendar tr.selectedWeek td {
        background: #f66;
        color: #fff;
    }

    table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
        background: #bbb;
        color: #888;
    }

    table.jCalendar td.unselectable,
    table.jCalendar td.unselectable:hover,
    table.jCalendar td.unselectable.dp-hover {
        background: #bbb;
        color: #888;
    }

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
    position: relative;
    background: #ccc;
    font-size: 10px;
    font-family: arial, sans-serif;
    padding: 2px;
    width: 171px;
    line-height: 1.2em;
}

div#dp-popup {
    position: absolute;
    z-index: 199;
}

div.dp-popup h2 {
    font-size: 12px;
    text-align: center;
    margin: 2px 0;
    padding: 0;
}

a#dp-close {
    font-size: 11px;
    padding: 4px 0;
    text-align: center;
    display: block;
}

    a#dp-close:hover {
        text-decoration: underline;
    }

div.dp-popup a {
    color: #000;
    text-decoration: none;
    padding: 3px 2px 0;
}

div.dp-popup div.dp-nav-prev {
    position: absolute;
    top: 2px;
    left: 4px;
    width: 100px;
}

    div.dp-popup div.dp-nav-prev a {
        float: left;
    }
    /* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
    div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
        cursor: pointer;
    }

        div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
            cursor: default;
        }

div.dp-popup div.dp-nav-next {
    position: absolute;
    top: 2px;
    right: 4px;
    width: 100px;
}

    div.dp-popup div.dp-nav-next a {
        float: right;
    }

div.dp-popup a.disabled {
    cursor: default;
    color: #aaa;
}

div.dp-popup td {
    cursor: pointer;
}

    div.dp-popup td.disabled {
        cursor: default;
    }


a.dp-choose-date {
    float: left;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 5px 3px 0;
    display: block;
    text-indent: -2000px;
    overflow: hidden;
    background: url(../images/calendar.png) no-repeat;
}

    a.dp-choose-date.dp-disabled {
        background-position: 0 -20px;
        cursor: default;
    }

input.dp-applied {
    width: 140px;
    float: left;
}

/* Skip link: visible when focused */
.skip-link {
  position: absolute;
  left: -999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  background: #005ea2;
  color: #fff;
  padding: 8px;
  z-index: 1000;
}
.skip-link:focus {
  left: 10px;
  top: 10px;
  width: auto;
  height: auto;
  border-radius: 4px;
}

/* Utility for hidden descriptive text */
.visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}