@media print { 
    body * {
        visibility: visible;
    }
    #notprintable, #notprintable * {
        visibility: hidden;
    }
    #notprintable { /* aligning the printable area */
        position: absolute; left: 40px; top: 40px;
    }
}

:root {
  --darkGreen: #3A833A;
  --lightGreen: #55AA00;
  --white: #FFFFFF;
}

html { scroll-behavior: smooth; }

body { font-family: "Nunito Sans", sans-serif, Verdana, Geneva, sans-serif; font-size: 16px; background-color: var(--white); }

* {
  box-sizing: border-box;
}

.column50 {
  float: left;
  width: 50%;
  padding: 00px;
}

.row50:after {
  content: "";
  display: table;
  clear: both;
}

button {
    background-color: var(--darkGreen);
    font-family: 'Nunito Sans';
    font-size: 14px;
    border: none;
    color: white;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s; 
}
button:hover { border: thin; background-color: var(--lightGreen); }

input[type=submit] {
    background-color: var(--darkGreen);
    font-family: 'Nunito Sans';
    font-size: 14px;
    border: none;
    color: white;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s; 
}

input[type=submit]:hover { border: thin; background-color: var(--lightGreen); }

input[type=button] {
    background-color: var(--darkGreen);
    font-family: 'Nunito Sans';
    font-size: 14px;
    border: none;
    color: white;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s; 
}

input[type=button]:hover   { border-width: thin; background-color: var(--lightGreen); }
input[type=text]           { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 5px; }
input[type=text]:hover     { border-color: green; }
input[type=url]            { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 5px; }
input[type=url]:hover      { border-color: green; }
input[type=email]          { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 5px; }
input[type=email]:hover    { border-color: green; }
input[type=date]           { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 4px; }
input[type=date]:hover     { border-color: green; }
input[type=time]           { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 4px; }
input[type=time]:hover     { border-color: green; }
input[type=password]       { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 5px; }
input[type=password]:hover { border-color: green; }
input[type=ul] { padding: 5px; }
input[type=ol] { padding: 5px; }
input[type=number] { border-width: thin; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; padding: 5px; }
input[type=number]:hover { border-color: green; }
input[type=checkbox] { padding: 5px; }

h1 { font-size: 18px; margin-top: 0em; margin-bottom: 0.5em; color:black;}
h2 { font-size: 16px; margin-top: 0em; margin-bottom: 0.5em; color:black;}
h3 { font-size: 14px; margin-top: 0em; margin-bottom: 0.5em; color:black;}
h4 { font-size: 12px; margin-top: 0em; margin-bottom: 0.5em; color:black;}
h5 { font-size: 10px; margin-top: 0em; margin-bottom: 0.5em; color:black;}
h6 { font-size: 14px; margin-top: 0em; margin-bottom: 0.5em; color:black;}

textarea {
    border-width: thin;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s; 
    font-family: 'Nunito Sans';
    font-weight: normal;
    font-size: 1em;
    padding: 5px;
    width: 97%;
    height: 97%;    
}

textarea:hover {
    border-color: green;
}

input {
    font-family: 'Nunito Sans';
    font-weight: normal;
    font-size: 1em;
}

select {
    border-width: thin;
    font-family: "Nunito Sans", sans-serif, Verdana, Geneva, sans-serif;
    font-weight: normal;
    font-size: 1em;
    padding: 5px;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s; 
}

select:hover {
    border-color: green;
}

img {
    border: 0;
    vertical-align: middle;
}

fieldset {
    padding: 5px;
    border-radius: 4px;
    -webkit-border-radius:4px;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
}

ins {
    text-align: center;
    font-family: 'Nunito Sans';
    color: green;
}

del {
    text-align: center;
    font-family: 'Nunito Sans';
    color: red;
}
                  
a {color: black;}

a:visited {color: black;}

table { border-width: 2px; border-spacing: 0px; border-style: outset; border-color: black; border-radius: 5px 5px 0px 0px; }
table.header { border: 0px; border-collapse: separate; border-style: none; vertical-align: middle; border-radius: 0px / 0px; }
table.header td { border: 0px; }
table.header th { border: 0px; }

th { text-align: center; font-size: 1em; font-weight:bold; color: black; border-style: outset; padding: 5px; border-width: thin; border-color: white; background-color: white; }
td { font-size: 1em; font-weight: normal; color: black; padding: 5px; border-style: outset; border-width: thin; border-color: white; vertical-align: top;}      
th.rotate { height: 180px; white-space: nowrap; }

th.rotate > div {
  transform: 
    /* Magic Numbers */
    translate(25px, 51px)
    /* 45 is really 360 - 45 */
    rotate(315deg);
  width: 30px;
}
th.rotate > div > span {
  border-bottom: 1px solid #ccc;
  padding: 5px 10px;
}
th.rotate270 {
  height: 220px;
  white-space: nowrap;
}

th.rotate270 > div {
  transform: 
    /* Magic Numbers */
    translate(1px, 90px)
    /* 45 is really 360 - 45 */
    rotate(270deg);
  width: 30px;
}
th.rotate270 > div > span { padding: 3px 3px; }

table.menubar { border-width: 1px; border-color: gray; border-collapse: separate; border-spacing: 0; border-radius: 5px 5px 5px 5px;}
table.menubar td { border: solid 1px #000; border-style: none solid solid none; padding: 5px; background-color: #ABD8ED; border-color: #808080; vertical-align: middle;}
table.menubar th { text-align: center; font-weight:bold; border-style: none none none none; padding: 5px; background-color: #54AEDA; }
table.menubar tr:first-child th:first-child { border-top-left-radius: 5px; }
table.menubar tr:first-child th:last-child { border-top-right-radius: 5px; }
table.menubar tr:first-child td:first-child { border-top-left-radius: 5px; }
table.menubar tr:first-child td:last-child { border-top-right-radius: 5px; }
table.menubar tr:last-child td:first-child { border-bottom-left-radius: 5px; }
table.menubar tr:last-child td:last-child { border-bottom-right-radius: 5px; }
table.menubar tr:first-child td { border-top-style: solid; }
table.menubar tr td:first-child { border-left-style: solid; }


table.menubar td a { display: block; padding: 3px; text-decoration: none; }
table.menubar td a:link, table.navbar td a:visited { color: #000000; }
table.menubar td a:hover, table.navbar td a:active { background-color: #54AEDA; border-color: #54AEDA; }

table.navbar { border-collapse: collapse; }
table.navbar td { border: 0px; background-color: #CFECFA; }
table.navbar td a { padding: 0px; text-decoration: none; }

table.flat { border-width: 1px; border-color: gray; border-collapse: separate; border-spacing: 0; border-radius: 5px 5px 5px 5px;}
table.flat td { border: solid 0px #000; border-style: none solid solid none; padding: 5px; background-color: #ABD8ED; }
table.flat th { border-style: none none none none; padding: 5px; background-color: #54AEDA; }
table.flat tr:first-child th:first-child { border-top-left-radius: 5px; }
table.flat tr:first-child th:last-child { border-top-right-radius: 5px; }
table.flat tr:first-child td:first-child { border-top-left-radius: 5px; }
table.flat tr:first-child td:last-child { border-top-right-radius: 5px; }
table.flat tr:last-child td:first-child { border-bottom-left-radius: 5px; }
table.flat tr:last-child td:last-child { border-bottom-right-radius: 5px; }
table.flat tr:first-child td { border-top-style: solid; }
table.flat tr td:first-child { border-left-style: solid; }

table.flatlist { border-width: 1px; border-color: gray; border-collapse: separate; border-spacing: 0; border-radius: 5px 5px 5px 5px;}
table.flatlist td { border: solid 1px #000; border-style: none solid solid none; padding: 5px; }
table.flatlist th { border-style: none none none none; background-color: #54AEDA; }
table.flatlist tr:first-child th:first-child { border-top-left-radius: 5px; }
table.flatlist tr:first-child th:last-child { border-top-right-radius: 5px; }
table.flatlist tr:first-child td:first-child { border-top-left-radius: 5px; }
table.flatlist tr:first-child td:last-child { border-top-right-radius: 5px; }
table.flatlist tr:last-child td:first-child { border-bottom-left-radius: 5px; }
table.flatlist tr:last-child td:last-child { border-bottom-right-radius: 5px; }
table.flatlist tr:first-child td { border-top-style: solid; }
table.flatlist tr td:first-child { border-left-style: solid; }
table.flatlist tr:nth-child(odd) td { background-color: #ABD8ED; border-color: #ABD8ED; }
table.flatlist tr:nth-child(even) td { background-color: #C0E1F1; border-color: #C0E1F1; }  

table.plain { border-width: 1px; border-color: gray; border-collapse: separate; border-spacing: 0; border-radius: 5px 5px 5px 5px;}
table.plain td { border: solid 1px #000; border-style: none solid solid none; padding: 5px; background-color: #F0F0F0; border-color: #ABD8ED; }
table.plain th { border-style: none none none none; background-color: #54AEDA; }
table.plain tr:first-child th:first-child { border-top-left-radius: 5px; }
table.plain tr:first-child th:last-child { border-top-right-radius: 5px; }
table.plain tr:first-child td:first-child { border-top-left-radius: 5px; }
table.plain tr:first-child td:last-child { border-top-right-radius: 5px; }
table.plain tr:last-child td:first-child { border-bottom-left-radius: 5px; }
table.plain tr:last-child td:last-child { border-bottom-right-radius: 5px; }
table.plain tr:first-child td { border-top-style: solid; }
table.plain tr td:first-child { border-left-style: solid; }


/* Dropdown Button */
.dropbtn {
  background-color: #3A833A;
  font-family: 'Nunito Sans';
  color: white;
  padding: 5px 15px 5px 1px;
  font-size: 14px;
  border: none;
  text-align: center;
  text-decoration: none;
  margin: 4px 2px 4px 1px;
  cursor: pointer;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s; 
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 250px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #3e8e41;}

#tabs { 
    padding: 0px; 
    background: none; 
    border-width: 0px; 
} 

#tabs .ui-tabs-nav { 
    padding-left: 0px; 
    background: transparent; 
    border-width: 0px 0px 0px 0px;  
    -moz-border-radius: 0px; 
    -webkit-border-radius: 0px; 
    border-radius: 0px; 
} 

#tabs .ui-tabs-panel { 
    background: #ABD8ED; 
    border-width: 0px 1px 1px 1px; 
}

#tabs .ui-tabs-active {
    background: #ABD8ED;
    font-weight: bold;
    color: black;
}

#tabs li.ui-tabs-active a {
    color: black;
}

.card {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
}

.card:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

.container {
  padding:10px 2px 16px;
}


/* Container so styles don’t leak */
.markdown pre {
  overflow: auto;              /* scroll for long lines */
  background: #f7f7f9;         /* light panel */
  border: 1px solid #e1e4e8;
  border-radius: 6px;
  margin: 1rem 0;
}

.markdown pre code {
  display: block;
  padding: 0.75rem 1rem;
  border: 1px solid black;
  border-radius: 6px;
  color: black;
  font-size: 0.85rem;
  line-height: 1.5;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  white-space: pre;
}

/* Inline code (single backticks) */
.markdown :not(pre) > code {
  background: #f0f3f6;
  border: 1px solid #d0d7de;
  border-radius: 4px;
  padding: 0.1rem 0.35rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  white-space: nowrap;
}