
/*> ################## All Boxes ################## <*/
.box {
  border-radius: 7px;
  background: #e5e5e5;
  margin-bottom: 20px;
}
.box_head {
  padding: 7px 10px;
  border: 0 solid #3f4d37;  /* #3f4d37=BorderGreen(dark) */
  border-width: 1px 1px 0;
  border-radius: 5px 5px 0 0;
  background: #748669;    /* #748669=HeaderGreen(medium) */
}
.box_body {
  border: 0 solid #3f4d37;
  border-width: 0 1px;
  background: #e5e5e5;         /* #e5e5e5=BgGray(medium) */
}
.box_foot {  min-height: 10px;
  text-align: center;
  border: 0 solid #3f4d37;
  border-width: 0 1px 1px;
  border-radius: 0 0 5px 5px;
  background: #e5e5e5;
}

/*> ############### All Link Boxes (2) ############### <*/
.box_links {  padding-top: 7px;  }

  .box_links > a {  display: block;
    font-size:  1.3rem;
    padding: 6px 10px;
    border: 0 solid #e5e5e5;
    border-width: 1px 0;
  }
    .box_links > a > span.small {  display: block;
      padding-bottom: 1px;
    }

  .box_links > a:hover,
  .box_links > a:active,
  .box_links > a:focus {  color: #085848;
    background: #f1f1f1;
  }
  .box_links > a:focus {  outline: none;
    border-color: #3f4d37;
  }

  .link-box .box_links > a {  padding: 5px 10px;  }


/*> ############# Script Info Box ############# <*/
.info-box {    }

  .info-box a:focus {  outline: none;  } /* all links in info-box /**/

  .info-box a.info {  display: block;
    padding: 8px 10px 9px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
  }
  .info-box a.info:hover,
  .info-box a.info:active,
  .info-box a.info:focus {
    background: #f1f1f1;     /*#dedede #9ba297 #808000*/
    border-top-color: #3f4d37;
    border-bottom-color: #3f4d37;
  }

    .info-box .info > span {  display: block;
      padding-bottom: 1px;
    }

    .info-box .info > span:first-child {
      padding: 0;
    }
    .info-box .info > span:nth-child(5) {
      padding-bottom: 0.9em;
    }
    .info-box .info > span:nth-child(6) {
      padding: 0;
    }

      .info-box .info > span > span {  display: inline-block;  }

      .info-box .info > span > span:first-child {
        min-width: 10.0rem;
      }
      .info-box .info > span > span:last-child {
        padding-left: 6px;
      }

      .info-box .info > span:first-child > span:first-child { /*lable: scrname*/
        position: relative;       top: 1px;
        padding: 3px 0 2px;
      }
      .info-box .info > span:first-child > span:last-child { /*scriptname*/
        position: relative;       top: 1px;
        min-width: 16.0rem;
        padding: 2px 10px 1px 5px;
        border: 1px solid transparent;
        border-radius: 2px;
      }

      .info-box .info > span:nth-child(7) > span:first-child { /*lable: filname*/
        position: relative;       bottom: 2px;
        padding: 3px 0 2px;
      }
      .info-box .info > span:nth-child(7) > span:last-child { /*filename*/
        position: relative;       bottom: 2px;
        min-width: 16.0rem;
        color: #085848;
        padding: 2px 5px 1px 5px;
        border: 1px solid transparent;
        border-radius: 2px;
      }

      .info-box a.info:hover > span:nth-child(7) > span:last-child {
        border-color: #c8c8c8;  /* #e5e5e5 #d9d9d9 #c8c8c8 #b2b7ae #9ba297*/
        background: #f8f8f8;
      }
      .info-box a.info > span:first-child > span:last-child:hover,
      .info-box a.info > span:nth-child(7) > span:last-child:hover {
        border-color: #808000; /*a0a040 b2b7ae #808000*/
        color: #085848;
        background: #f8f8f8; /* #f1f1f1*/
      }
      .info-box a.info > span:nth-child(7) > span:last-child:hover {
      }

      .info-box a.info:active > span:nth-child(7) > span:last-child,
      .info-box a.info:focus > span:nth-child(7) > span:last-child {
        border-color: #808000; /*b2b7ae #085848*/
        background: #f8f8f8;
      }
      .info-box a.info:focus > span:nth-child(7) > span:last-child:hover {
        background: white;
      }

    .info-box .info > span.desc {  padding: 10px 0;  }

      .info-box .info > .desc span {  display: block;  }
      .info-box .info > .desc span:first-child {
        padding-bottom: 3px;
      }
      .info-box .info > .desc span:last-child {
        padding-left: 10px;
        padding-right: 10px;
      }

  .info-box .file {    }

    .info-box .file > div:first-child {
      padding: 8px 10px;
      background: #9eb096;     /* SameAs:  TheadRowColor */
    }
    .info-box .file > div:nth-child(2) {
      padding: 5px 10px 1px;
    }
    .info-box .file pre {  overflow-x: auto;  }


/*> ########## Contact Form & Submit Form Boxes ########## <*/
#contact_wrap,
#submit_wrap {  text-align: center;  }

.form-box {  display: inline-block;
  width: 75%;      min-width: 52.0rem;
  text-align: left;
  margin: 50px auto 25px;
}

.form-box .box_head {  padding: 7px 3%;  }
.form-box h2 {  color: #e5e5e5;  }

.contact-box .box_body {  padding: 30px 6% 12px;  }
.submit-box .box_body {   padding: 3px 6% 12px;  }


/* ##  the <form></form> tags  ## */
#contact,  #submit {  font-size: 1.5rem;  }

.submit-box form h3 {  position: relative;
  left: -16px;
  cursor: default;
  color: black;
  font-size: 1.5rem;
  width: 16.0rem;
  margin: 12px 0 6px;
  padding: 2px 4px 1px;
  border: 1px solid transparent;
  border-radius: 2px;
}
.submit-box form h3:nth-of-type(2) {  width: 14.8rem;  }
.submit-box form h3:nth-of-type(3) {  width: 18.2rem;  }

.submit-box form h3:hover {
  background: #dedede;     border-color: #c8c8c8;
}
#submit_wrap form h3:hover + fieldset .text label,
#submit_wrap form h3:hover + fieldset .area label,
#submit_wrap form h3:hover + fieldset .file div {
  background: #dedede;     border-color: #c8c8c8;
  color: black;
}
#submit_wrap form h3:hover + fieldset .file label,
#submit_wrap form h3:hover + fieldset .file input[type=text] {
  color: black;
}

#submit_wrap form h3:hover + fieldset .file input[type=text]::-webkit-input-placeholder {
  color: black;  }
#submit_wrap form h3:hover + fieldset .file input[type=text]:-moz-placeholder {
  color: black;   opacity: 1;  }
#submit_wrap form h3:hover + fieldset .file input[type=text]::-moz-placeholder {
  color: black;   opacity: 1;  }
#submit_wrap form h3:hover + fieldset .file input[type=text]:-ms-input-placeholder {
  color: black;  }
#submit_wrap form h3:hover + fieldset .file input[type=text]::-ms-input-placeholder {
  color: black;  }
/**/

#submit_wrap form h3:hover + fieldset .radio-group,
#submit_wrap form h3:hover + fieldset .select {
  background: #dedede;         border-color: #c8c8c8;
}
#submit_wrap form h3:hover + fieldset .radio-group label,
#submit_wrap form h3:hover + fieldset .select label {
  background: transparent;     border-color: transparent;
  color: black;
}
#submit_wrap .radio input:checked + label {  color: black;  }

.submit-box fieldset {  font-size: 1.5rem;  }

  /* ##  wrapper divs for ea form-input/label pair  ## */
  .form-box form > fieldset > div {  position: relative;
    max-width: 55.0rem;
    padding-bottom: 15px;
  }
  .submit-box form > fieldset > div {  padding-bottom: 7px;  }

  .form-box form .area,
  .form-box form .submit {  max-width: 80.0rem;  }

  #contact fieldset > div:nth-child(4) { padding-bottom: 30px; }
  #contact fieldset > div:nth-child(5) {  display: none;  }
  #contact fieldset > div.message { padding-bottom: 20px;  }
  #contact fieldset > div.submit {  padding-bottom: 0;  }


    /* ## all TextLines & TextAreas  (in contact & submit) ## */
    .form-box .text input[type=text],
    .form-box textarea {  position: absolute;
      top: 1px;           left: 7.5rem;
      background: transparent;     /*background: tan; /**/
      padding: 6px 4px 5px 5px;
      height: calc(1.15em + 11px);
      width:  calc(100% - 7.9rem);
    }
    .form-box textarea {
      resize: none;    overflow: auto;
      height: calc(9.0em - 2px);
    }
    .submit-box textarea {  height: calc(6.7em - 2px);  }

    .submit-box .contact_info input[type=text],
    .submit-box .contact_info textarea {  left: 6.8rem;
      width: calc(100% - 7.2rem);
    }
    .submit-box .script_info input[type=text],
    .submit-box .script_info textarea {  left: 9.5rem;
      width: calc(100% - 9.9rem);
    }

    /* labels for textlines & textareas */
    .form-box .text label,
    .form-box .area label {   display: block;
      padding: 6px 0 0 10px;
      background: #f1f1f1;   /*f1f1f1 e5e5e5 d9d9d9 c8c8c8 a0a79c*/
      border: 1px solid #c8c8c8;
      border-radius: 3px;
      color: #9ba297;
      height: 9.0em;
    }
    .form-box .text label {  height: calc(1.16em + 13px);  }
    .submit-box .area label {  height: 6.7em;  }

      .submit-box label small {  display: block;
        font-size: 0.9rem;
        padding-top: 1px;
      }
      .submit-box label[for=description] small { width: 8.6rem; }

    /* hover/focus for textlines & textareas */
    .form-box .text input[type=text]:hover + label,
    .form-box textarea:hover + label {  color: black;
      background: #f8f8f8;     border-color: #a0a79c;
    }
    .form-box .text input[type=text]:active + label,
    .form-box textarea:active + label { color: black;
      background: #f8f8f8;     border-color: #808000;
    }
    .form-box .text input[type=text]:focus + label,
    .form-box textarea:focus + label {  color: black;
      background: #f8f8f8;     border-color: #808000;
    }

    /* ## all ChooseFiles (2 in submit form) ## */
    .submit-box input[type=file] {  position: absolute;
      top: 4px;   left: 14.0rem;    z-index: -1;
      width: 80px;
    }
    .submit-box .file label {  display: block;
      position: absolute;
      top: 0;     left: 0;     z-index: 1;
      color: #9ba297;
      height: 3.0em;      width: 100%;
      padding: 7px 0 0 11px;
    }
    .submit-box .file div {  height: 3.0em;
      background: #f1f1f1;
      border: 1px solid #c8c8c8;
      border-radius: 3px;
    }
    .submit-box .file input[type=text] {
      position: absolute;
      top: 1px;        left: 14.0rem;
      color: black;
      width: calc(100% - 14.4rem);
      background: transparent;
      padding: 6px 4px 5px 5px;
    }

    .submit-box .file input[type=text]::-webkit-input-placeholder {
      color: #687362;  }
    .submit-box .file input[type=text]:-moz-placeholder {
      color: #687362;   opacity: 1;  }
    .submit-box .file input[type=text]::-moz-placeholder {
      color: #687362;   opacity: 1;  }
    .submit-box .file input[type=text]:-ms-input-placeholder {
      color: #687362;  }
    .submit-box .file input[type=text]::-ms-input-placeholder {
      color: #687362;  }
    /**/

    /* hover/focus for  choosefiles */
    .submit-box .file label:hover,
    .submit-box .file label:active {  color: black;  }

    .submit-box .file label:hover + div + input,
    .submit-box .file label:active + div + input { color: black; }

    .submit-box .file label:hover + div + input::-webkit-input-placeholder,
    .submit-box .file label:active + div + input::-webkit-input-placeholder {
      color: black;  }
    .submit-box .file label:hover + div + input:-moz-placeholder,
    .submit-box .file label:active + div + input:-moz-placeholder {
      color: black;   opacity: 1;  }
    .submit-box .file label:hover + div + input::-moz-placeholder,
    .submit-box .file label:active + div + input::-moz-placeholder {
      color: black;   opacity: 1;  }
    .submit-box .file label:hover + div + input:-ms-input-placeholder,
    .submit-box .file label:active + div + input:-ms-input-placeholder {
      color: black;  }
    .submit-box .file label:hover + div + input::-ms-input-placeholder,
    .submit-box .file label:active + div + input::-ms-input-placeholder {
      color: black;  }
    /**/

    .submit-box .file input[type=file]:hover + label,
    .submit-box .file input[type=file]:active + label,
    .submit-box .file input[type=file]:focus + label {  color: black;  }

    .submit-box .file input[type=file]:hover + label + div + input::-webkit-input-placeholder,
    .submit-box .file input[type=file]:active + label + div + input::-webkit-input-placeholder,
    .submit-box .file input[type=file]:focus + label + div + input::-webkit-input-placeholder {
      color: black;  }
    .submit-box .file input[type=file]:hover + label + div + input:-moz-placeholder,
    .submit-box .file input[type=file]:active + label + div + input:-moz-placeholder,
    .submit-box .file input[type=file]:focus + label + div + input:-moz-placeholder {
      color: black;   opacity: 1;  }
    .submit-box .file input[type=file]:hover + label + div + input::-moz-placeholder,
    .submit-box .file input[type=file]:active + label + div + input::-moz-placeholder,
    .submit-box .file input[type=file]:focus + label + div + input::-moz-placeholder {
      color: black;   opacity: 1;  }
    .submit-box .file input[type=file]:hover + label + div + input:-ms-input-placeholder,
    .submit-box .file input[type=file]:active + label + div + input:-ms-input-placeholder,
    .submit-box .file input[type=file]:focus + label + div + input:-ms-input-placeholder {
      color: black;  }
    .submit-box .file input[type=file]:hover + label + div + input::-ms-input-placeholder,
    .submit-box .file input[type=file]:active + label + div + input::-ms-input-placeholder,
    .submit-box .file input[type=file]:focus + label + div + input::-ms-input-placeholder {
      color: black;  }
    /**/

    .submit-box .file label:hover + div.file-bg,
    .submit-box .file input[type=file]:hover + label + div.file-bg {
      background: #f8f8f8;     border-color: #a0a79c;
    }

    .submit-box .file label:active + div.file-bg,
    .submit-box .file input[type=file]:active + label + div.file-bg,
    .submit-box .file label:focus + div.file-bg,
    .submit-box .file input[type=file]:focus + label + div.file-bg {
      background: #f8f8f8;     border-color: #808000;
    }

    /* ## RadioButtons (in submit form (submit type)) ## */
    .submit-box form > fieldset > div.radio-group {
      padding: 3px 0 6px;
      margin-bottom: 7px;
      border: 1px solid transparent;
      border-radius: 3px;
    }

    .submit-box .radio-group legend {  position: relative;
      z-index: 1;         left: 5px;
      cursor: default;
      padding: 2px 4px 0;
      border: 1px solid transparent;
    }
    .submit-box .radio-group .hover {  position: absolute;
      top: -1px;        left: -1px;
      height: 3.65em;   width: 100%;
      height: calc(2.32em + 20px);
      width:  calc(100% + 2px);
      border: 1px solid transparent;
      border-radius: 3px;
    }
    .submit-box .radio-group .radio {   float: left;
      position: relative;
      width: 50%;
    }

    .submit-box .radio-group input[type=radio] {
      position: absolute;
      top: 0.4rem;      left: 13px;
    }
    .submit-box .radio-group label {  display: block;
      color: #878f82;            /* #9ba297 878f82 */
      padding: 2px 0 0 35px;
      border: 1px solid transparent;
      border-radius: 3px;
      height: calc(1.16em + 5px);
    }

    /* # hover/focus for radiobuttons # */
    .submit-box .radio-group input[type=radio]:hover + label {
      color: black;
      background: #f1f1f1;     border-color: #a0a79c;
    }
    .submit-box .radio-group input[type=radio]:active + label,
    .submit-box .radio-group input[type=radio]:focus + label {
      color: black;
      background: #f8f8f8;    border-color: #808000;
    }
    .submit-box .radio-group input[type=radio]:hover + label {
      background: #f1f1f1;
    }

    #submit_wrap .submit-box .radio-group legend:hover + div {
      background: #dedede;     border-color: #c8c8c8;
    }
    #submit_wrap .submit-box .radio-group legend:hover + div + div label,
    #submit_wrap .submit-box .radio-group legend:hover + div + div + div label {
      color: black;
      background: #dedede;     border-color: #dedede;
    }

    /* ## Select &Options (in submit form (category)) ## */
    .submit-box form > fieldset > div.select {
      border: 1px solid transparent;
      border-radius: 3px;
      padding: 0;
      margin-bottom: 7px;
    }

    .submit-box form .select select {  position: absolute;
      top: 1px;       left: 2px;       z-index: 1;
      height: calc(1.16em + 9px);
      width:  calc(50% - 6px);
      padding-left: 4px;
      background-color: transparent;
    }
    .submit-box form .select label {   display: block;
      position: relative;    left: -1px;
      height: calc(1.16em + 11px);
      width: 50%;
      width: calc(50% + 1px);
      background: #f1f1f1;
      border: 1px solid #c8c8c8;
      border-radius: 3px;
    }

    .submit-box form .select select:hover + label {
      background: #f8f8f8;     border-color: #a0a79c;
    }
    .submit-box form .select select:active + label,
    .submit-box form .select select:focus + label {
      background: #f8f8f8;     border-color: #808000;
    }

    /* ##  SubmitButton (in contact & submit forms )  ## */
    /* label for submit buttons */
    .form-box .submit label {  display: block;
      width: 10.0rem;
      padding: 10px 0;
      margin: 0 auto;
    }
      /* submit buttons */
      .form-box input[type=submit] {  display: block;
        font-size: 1.5rem;
        color: #878f82;  /* a0a79c 9ba297 878f82 */
        padding: 5px 7px;
        background: #d9d9d9; /*f1f1f1 e5e5e5 d9d9d9 c8c8c8 a0a79c*/
        border: 1px solid #a0a79c;
        border-radius: 3px;
        margin: 0 auto;
      }
      .submit-box input[type=submit] {  color: #687362;  }

      /* hover/focus for submit buttons */
      .form-box input[type=submit]:hover,
      .form-box input[type=submit]:focus {  color: black;
        background: #f1f1f1;      border-color: #808000;
      }
      .form-box input[type=submit]:focus {  outline: none;
        background: #f8f8f8;
      }
      @supports (outline-color: -webkit-focus-ring-color) {
          .form-box input[type=submit]:focus { outline: olive auto 3px; }
      }

/* ##  Success/Fail pages for Contact & Submit forms  ## */
.success > .top-right section,
.fail > .top-right section {  font-size: 1.6rem;  }

.success .form-box,
.fail .form-box {  margin-top: 32px;
  width: 80%;      min-width: 53.5rem;
}

.success .form-box .box_body,
.fail .form-box .box_body {  font-size: 1.5rem;
  padding: 22px 5% 20px;
}
  .success .form-box .box_body > h4,
  .fail .form-box .box_body > h4 {  padding-bottom: 22px;  }

  /* ## success specific ## */
  .success .contact-box .box_body > p {
    padding-bottom: 10px; /* */
  }
  .success .form-box .box_body > p:nth-child(4) {
    padding: 25px 0 0;
    font-size: 1.5rem;
  }

  .success .form-box .sent {  padding-left: 2%;  }

    .success .form-box .line {  padding-bottom: 7px;
      white-space: nowrap;    overflow: hidden;
    }
    .success .submit-box .line {  padding-bottom: 5px;  }

      .success .form-box .line span {
        display: inline-block;
        min-width: 7.4rem;
      }
      .success .submit-box .sent > div:nth-child(4) .line span {
        min-width: 10.0rem;
      }
      .success .submit-box .sent > div:nth-child(6) .line span {
        min-width: 12.0rem;
      }

    .success .form-box .area {  position: relative;
      padding-top: 1px;
    }
      .success .form-box .area div:first-child {
        position: absolute;    top: 1px;
      }
      .success .form-box .area div:nth-child(2) {
        padding-left: 7.4rem;
        min-height: 1.16em;
      }
      .success .submit-box .sent > div:nth-child(4) .area div:nth-child(2) {
        padding-left: 10.0rem;
      }

  /* ## submit-success only ## */
  .success .submit-box .sent h4 {  position: relative;
    left: -16px;
    padding: 2px 4px 1px;
    border: 1px solid transparent;
    margin: 15px 0 4px;
  }
  .success .submit-box .sent h4:first-child {
    margin-top: 20px;
  }

  /* ## fail specific ## */
  .fail .form-box .fullerror {  line-height: 2.2rem;
    padding-left: 2%;
  }
  .fail .form-box .box_body p {  padding-top: 24px;  }


/*> ############# Donate Box ############# <*/
#donate {    }

#donate a {  display: block;
  padding: 12px 9px 16px;
  border: 1px solid #808000;  /* #d9d9d9  */
  border-radius: 5px;
  margin: 32px 16px 20px;  /*  */
  background: #e5e5e5;  /* c8c8c8 #d9d9d9 */
}
#donate span {  display: block;  }

#donate .don_head {  font-size: 1.6rem;
  padding-bottom: 10px;
  color: #606800;
}
#donate .don_body {  font-size: 1.2rem;  }
#donate .help {    padding-bottom: 5px;  }


#donate .pplogo {  text-align: center;
  padding-top: 8px;

  margin-right: 4px;
}



#donate a:hover,
#donate a:active,
#donate a:focus {  outline: none;
  border-color: #707000;  /* #878f82 #808000 #707000 #606800  */
  background: #f1f1f1;   /* #e5e5e5  */
  color: #085848;
}
#donate a:focus {  border-color: #808000;  }
#donate a:focus:hover {  background: #e9e9e9;  }


/*> ###### End File ###### <*/
