body { background-color: #FFFFFF; margin: 0px; }

.tab { overflow: hidden; border: 1px solid #ccc; background-color: #475f57; font-size: 12px; font-family: serif; font-weight: 500; height:100px; width:100%; }
.tab button { font-family: serif; font-size: 14px; color: #ffffff; font-weight:500; background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 14px 16px; transition: 0.3s; margin-top:60px; }
.tab button:hover { color: #000000; background-color: #ddd; }
.tab button.active { color: #000000; background-color: #ccc; }
.tab .symbolbox { font-size: 12px; font-family: serif; font-weight: 500; color:white; float:righ; position:absolute; left:85%; top:20px; }
.tab .symbolbox a { font-size: 12px; color: yellow }
.tab .logo { width:100px;padding-left:50px; padding-right:30px; float:left }

.tabcontent { border-bottom: 1px solid #475f57; padding-right: 20px; padding-left: 20px; padding-bottom: 30px; margin-bottom: 20px; }

.outer { border: 0px solid #ccc; width: 100%; vertical-align: top; }
.inner { font-size: 14px; font-family: serif; font-weight: 500; border: 0px solid #ccc; vertical-align: top; display: inline-block; }

#quickhelp { margin-top: 20px; padding:10px; font-size: .8; border: 2px solid rgb(155, 153, 153); width:98%; }

.styled-table { border-collapse: collapse; margin: 0px 0; color: rgb(1, 34, 21); font-size: 14px; font-family: serif; font-weight: 500; width: 100%; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); }
.styled-table thead tr th { background-color: #378c6d; color: #ffffff; font-weight:bold; text-align: left; padding: 5px 7px; }
.styled-table td { font-size: 14px; font-family: serif; font-weight: 500; text-align: left; padding: 5px 7px; }
.styled-table tbody tr { border-bottom: 1px solid #dddddd; }
.styled-table tbody tr:nth-of-type(odd) { background-color: #f3f3f3; }
.styled-table tbody tr:last-of-type { border-bottom: 2px solid #009879; }
.styled-table tbody tr.active-row { font-weight: bold; color: #009879; }
.styled-table tbody tr:hover { background-color: #e5f2d9f7; }
.styled-table input { background-color: #eaffeb; border: #98dc92 2px solid; padding:5px; border-radius: 5px; }
.styled-table a { font-size: 14px; font-family: serif; font-weight: bold; color:#009879 }

.snip-table { border-collapse: collapse; margin: 0px 0; font-size: 14px; font-family: serif; font-weight: 500; color: rgb(1, 34, 21) ; width: 100%; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); }
.snip-table thead tr th { background-color: #378c6d; color: #ffffff; font-weight:bold; text-align: left; padding: 5px 7px; }
.snip-table td { text-align: left; padding: 10px 12px; }
.snip-table tbody tr { border-bottom: 1px solid #dddddd; }
.snip-table input { background-color: #eaffeb; border: #98dc92 2px solid; padding:5px; border-radius: 5px; }
.snip-table a { font-size: 14px; font-family: serif; font-weight: bold; color:#009879 }

.redrow { color: red; }
.greenrow { color: green; }

.detailsframe { width: 100%; height: 750px; background-color: white; top: 0px; left: 0px; margin: 0px; padding: 0px; }
.detailstopbar div { display: inline-block; width: 100%; height: 20px; background-color: #009879; color: white; padding: 4px 0px 0px 10px; font-family: serif; font-size: 14px; font-weight: bold; text-decoration: none; }

h1 { font-family: serif; font-size: 1.9em; font-weight: 400; color: rgb(1, 34, 21) } 
h2 { font-family: serif; font-size: 1.7em; font-weight: 400; color: rgb(1, 34, 21) } 
h3 { font-family: serif; font-size: 1.5em; font-weight: 400; color: rgb(1, 34, 21) } 
h4 { font-family: serif; font-size: 1.3em; font-weight: 400; color: rgb(1, 34, 21) } 
a { font-size: 14px; font-family: serif; font-weight: 500; text-decoration: none; color: rgb(17, 81, 49) }
a:hover { text-decoration: underline }
div, span, P { font-size: 14px; font-family: serif; font-weight: 500; text-decoration: none; color: rgb(1, 34, 21) }
select, input[type=text], input[type=email], textarea { background-color: #eaffeb; border: #98dc92 2px solid; padding:5px; border-radius: 5px; }
input[type=button], input[type=submit], input[type=reset] {
    background-image: linear-gradient(#108938, #035d2b);
    border: 0;
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, .3) 0 5px 15px;
    box-sizing: border-box;
    color: #eaffeb;
    cursor: pointer;
    font-family: serif;
    font-size: 14px;
    margin: 5px;
    padding: 7px 14px;
    text-align: center;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation; 
}

.tabset > input[type="radio"] { position: absolute; left: -200vw; }
.tabset .tab-panel { display: none; }

.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6), 
.tabset > input:nth-child(13):checked ~ .tab-panels > .tab-panel:nth-child(7) { display: block; }

.tabset > label { position: relative; display: inline-block; padding: 5px 15px 20px; border: 1px solid transparent; border-bottom: 0; cursor: pointer; font-weight: 600; }
.tabset > label::after { content: ""; position: absolute; left: 15px; bottom: 10px; width: 22px; height: 4px; background: #475f57; }
input:focus-visible + label { outline: 2px solid #475f57; border-radius: 3px; }
.tabset > label:hover,
.tabset > input:focus + label,
.tabset > input:checked + label { color: rgb(17, 81, 49); }
.tabset > label:hover::after,
.tabset > input:focus + label::after,
.tabset > input:checked + label::after { background: #19c659; }
.tabset > input:checked + label { border-color: #7e7d7d; border-bottom: 1px solid #fff; margin-bottom: -1px; }
.tab-panel { padding: 0px 0; border-top: 1px solid #7e7d7d; }