html {
  overflow-y: scroll;
}

body {
  width: 100%;
  height: 100%;
  margin:0;
  padding:0;

  font-family:arial;
  font-size:small;
  color:#333333;

  display: table;
}

h1,h2 {
  font-family: "Varela Round", arial, helvetica, sans-serif;
}

div {
  text-align:left;
}

a:link, a:active, a:visited {
  color:#003399;
  text-decoration:none;
  border:0;
}

a:hover {
  color:#CC0000;
  text-decoration:underline;
}


#header {
/*  height:150px;  */
  margin:0;
  padding:0;
/*  background-color:#e5f4e7;  */
}

#header_content {
  width:940px;
  height:120px;
  margin: 0 auto 0 auto;
  text-align:right;

/*  background-image:url(../images/header/header_blazes.gif); */
  background-position:top left;
  background-repeat:no-repeat;

}

#main {
    width: 960px;
    margin: 1px auto 20px auto;
    padding: 10px 0 0 0;
}

#wrapper {
    width:100%;
    margin:0 0 72px 0;
    padding:0;
    background-color:#ffffff;
    background-image:url(../images/backgrounds/fade_grey_white.jpg);
    background-position:top;
    background-repeat:repeat-x;
}





#footer {
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  height:72px;
  background-color:#e0e0e0;
  border:1px solid #666666;
  z-index:102;
}

#footer_content {
    width:960px;
    margin: 0 auto;
    padding: 8px 0 8px 0;
    text-align:left;
}

#footer_line {
  width:100%;
  height:1px;
  border-bottom:1px solid #ffffff;
}

#footer a:link, #footer a:active, #footer a:visited {
    color:#666666;
    text-decoration:none;
}

#footer a:hover {
    color:#000000;
    text-decoration:none;
}




/* NAV ITEMS */

#nav_simple {
    width:100%;
    height:1px;
    background-color: #333333;
}

#nav {
        width:100%;

/*    background-color: #e5f4e7;  */
}

#nav_content {
  width:960px;
  margin:0 auto;
}

#nav .tab_app {
  border-bottom:1px solid #333333;
}

#nav .tab_app a:link, #nav .tab_app a:active, #nav .tab_app a:visited {
        padding:4px;
         background-color:#000000;
         color:#ffffff;
}

#nav .tab_app a:hover {
        padding:4px;
         background-color:#990000;
         color:#ffffff;
}


#nav .tab {
  padding: .5em .8em .5em .8em;
  border-top:1px solid #999999;
  border-right:1px solid #999999;
  border-bottom:1px solid #333333;
  border-left:1px solid #999999;
  background-color:#ffffff;
}

#nav .tab a {
  margin: .5em;
  color: #000000;
}

#nav .spacer {
  border-bottom:1px solid #333333;
}

#nav .end {
  border-bottom:1px solid #333333;
}


#nav .tab_active {
  padding: .5em .8em .5em .8em;
  border-top:1px solid #333333;
  border-right:1px solid #333333;
  border-bottom:1px solid #f0f0f0;
  border-left:1px solid #333333;
  background-color: #f0f0f0;
}

#nav .tab_active a {
  margin: .5em;
  color: #000000;
}


/* --- SUPRESS PRINTING HEADERS AND FOOTERS --- */

#header_print {
    display:none;
}

#footer_print {
    display:none;
}



/* ATTRACTIVE PAGE FORMATTING */
.table_form {
  border-top:1px solid #e0e0e0;
}

.table_form td {
  border-bottom:1px solid #e0e0e0;
}

.table_grid {
  border-top:1px solid #e0e0e0;
  border-left:1px solid #e0e0e0;
}

.table_grid td {
  border-right:1px solid #e0e0e0;
  border-bottom:1px solid #e0e0e0;
}


.table_header, .table_footer, .table_highlight {
  background-color:#d8e2e7;
}

.table_header td {
  background-color:#d8e2e7;
  position: sticky; /* Keeps it fixed when scrolling */
  top: -12px; /* Position relative to the viewport */
  z-index: 1; /* Ensures it stays above the rows */
}

.table_header td, .table_footer td, .table_highlight td {
  border-right:1px solid #d0d0d0;
  border-bottom:1px solid #d0d0d0;
}

.table_header_dark {
  background-color:#c2cbcf;
}

.table_grid tr:nth-child(even) {
/*    background-color: #f0f0f0;   */
}




.messagearea {
  z-index:700;
  display:none;
  position:fixed;
  bottom:73px;
  left:0;
  width:100%;
}

.messagearea_content {
  width:960px;
  margin:0 auto 12px auto;
  padding:16px 8px;
}

.messagearea .info {
  background-color:#d5efdd;
  border:1px solid #009933;
}

.messagearea .error, .messagearea .error {
  background-color:#ffb2b2;
  border:1px solid #993333;
}





/* STYLING FOR DYNAMIC FEATURES */

#messagebox {
    z-index:1;
    position:absolute;
    width:100%;
    top:30px;
    left:0;
}

#messagebox p {
    width:300px;
    margin:0 auto 0 auto;
    padding:30px;
    background-color:#e0ffe0;
    border:1px solid #000000;

    text-align:center;
    font-size:medium;
    font-weight:bold;
    color:#006600;
}


#alertbox {
    z-index:1;
    position:absolute;
    width:100%;
    top:30px;
    left:0;
}

#alertbox p {
    width:300px;
    margin:0 auto 0 auto;
    padding:30px;
    background-color:#ffe0e0;
    border:2px solid #000000;
    text-align:center;
    font-size:medium;
    font-weight:bold;
    color:#660000;
}
















/* wrapper is the overlay */
.popup_wrapper {
  position: fixed;
  left:40px;
  top:40px;
/*  top: 45%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);*/
}

.popup_header {
  padding:4px;
  border-bottom:1px solid #666;
  background-color:#ccc;

  text-align:right;
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.popup_header_title {
  padding:6px 4px 4px 6px;
  color: #333;
  font-size:larger;
  font-weight:bold;
}

.popup_header_right {
  margin-left:auto;
  margin-right:20px;
}




.popup_header_submit_and_stay {

}

.popup_header_close {
  padding:4px;
  text-align: right;
}

.popup_content, .popup_loader, .popup_submit {
  padding:10px;
  border-top:1px solid #ffffff;
  border-bottom:1px solid #666666;
  background-color:#ffffff;
  background-image:url(../images/backgrounds/fade_grey_white.jpg);
  background-position:top;
  background-repeat:repeat-x;
  overflow-y:scroll;
}

.popup_footer {
  bottom: 0;
  height: 32px;
  padding:18px 10px 8px 10px;
  background-color:#dddddd;
  border-top:1px solid #ffffff;
}

.popup_move {
  cursor:move;
}





#ajaxdiv_wrapper {
  border:1px solid #000000;
  background-color: #666666;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

#ajaxdiv_close, #ajaxdiv_move {
  float:right;
  margin:3px;
  padding:0 8px;
  border:1px solid #777777;
  color:#ffffff;
}

#ajaxdiv_move {
  cursor:move;
}

#ajaxdiv, #ajaxloader, #ajaxsubmit {
  margin-bottom:32px;
  padding:10px 10px 64px 10px;
  background-color:#ffffff;
  overflow-y:scroll;
}

#ajaxdiv_footer {
  position: absolute;
  width:100%;
  bottom: 0;
  height: 32px;
  padding-top:8px;
  background-color:#eeeeee;
}










/* ITEMS FOR DOCUMENT FORM */

.doc_tab {
  margin-right:12px;
  padding:4px;
  background-color:#fafafa;
  border-bottom:1px solid #e0e0e0;
}

.doc_tab_sel {
  margin-right:12px;
  padding:4px;
  background-color:#f0f0f0;
  border-bottom:1px solid #f0f0f0;
}



/* Tab Handling CSS */

.tabset_active {
  font-weight:bold;
  padding:6px 10px;
  border-top:1px solid #333333;
  border-right:1px solid #333333;
  border-bottom:1px solid #ffffff;
  border-left:1px solid #333333;
  background-color:#ffffff;
}

.tabset_active a {
  color:#333333;
  text-decoration:none;
}

.tabset_inactive {
  font-weight:bold;
  padding:6px 10px;
  border-top:1px solid #cccccc;
  border-right:1px solid #cccccc;
  border-bottom:1px solid #333333;
  border-left:1px solid #cccccc;
  background-color:#f8f8f8;
}

.tabset_table {
/*  background-image:url(../images/backgrounds/tab_background.jpg); */
  background-position:bottom;
  background-repeat:repeat-x;
}





.varela {
  font-family: "Varela Round", arial, helvetica, sans-serif;
}








/* Export options - mainly for PP */

.export {
  height:36px;
  padding:8px 12px 8px 28px;
  margin-right:6px;
  margin-bottom:4px;

  background-position:left;
  background-repeat:no-repeat;
}

.pdf {
  background-image:url(../images/backgrounds/button_export_pdf.gif);
}

.csv {
  background-image:url(../images/backgrounds/button_export_csv.gif);
}


/* Highlighting of search results */
.highlight {
  background-color:#ffff00;
  font-weight:bold;
}



/* Scaling for Divs, taken from http://www.developerdrive.com/2012/02/scaling-web-page-elements-using-the-css3-scale-transform/#disqus_thread  */

div.scaleon {

  /* General, Firefox, MSIE, Chrome/Safair, Opera */

  transform: translate(0, -25%) scale(0.5, 0.5);
  -moz-transform: translate(0, -25%) scale(0.5, 0.5);
  -ms-transform: translate(0, -25%) scale(0.5, 0.5);
  -webkit-transform: translate(0, -25%) scale(0.5, 0.5);
  -o-transform: translate(0, -25%) scale(0.5, 0.5);

  /* IE8+ - must be on one line, unfortunately */
   -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.5, M12=0, M21=0, M22=0.5, SizingMethod='auto expand')";

}

div.scaleoff {

  /* General, Firefox, MSIE, Chrome/Safair, Opera */

  transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  -o-transform: scale(1, 1);

  margin:0;

  /*general version*/
  transition: 1s ease-out;

  /*browser specific versions*/
  -moz-transition: 1s ease-out;
  -ms-transition: 1s ease-out;
  -webkit-transition: 1s ease-out;
  -o-transition: 1s ease-out;

  /* IE8+ - must be on one line, unfortunately */
   -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";

}




input[readonly] {
  background-color: #e0e0e0; /* Light grey background */
  border: 1px solid #ccc; /* Match default input border */
  color: #000; /* Ensure text is readable */
  cursor: not-allowed; /* Indicate it's not editable */
  box-shadow: none; /* Remove unwanted inset shadow */
  appearance: none; /* Normalize across browsers */
}

input:disabled {
  background-color: #e0e0e0; /* Same background for disabled */
  color: #000; /* Ensure readability */
  border: 1px solid #ccc; /* Keep a consistent border */
  cursor: not-allowed; /* Indicate it's not interactive */
  box-shadow: none; /* Remove any browser-added effects */
  appearance: none; /* Normalize styling */
}