/*  Updates and changes to base USWDS css */

h1,h2,h3,.h1,.h2,.h3 {
  font-family: "Merriweather", serif;
  line-height: 135%;
  font-weight: 700;
  margin:0;
}

h1,.h1 {
  font-size: 24px;
}

h2,.h2 {
  font-size: 20px;
}

h3,.h3 {
  font-size: 18px;
}

h1 + h2 {
  margin: .5rem 0 .25rem;
}

h3 + h3 {
  margin-top: .5rem;
}

h1 + p, h2 + p, h3 + p,
  .h1 + p, .h2 + p, .h3 + p{
    margin-top: .25rem;
  }

p + .h2, p + h2, ul + .h2, ul + h2 {
  margin-top:1rem;
}

.h2 + h3, p + h3 {
    margin-top: .5rem;
  }

p {
  font-family: "Open Sans", sans-serif;  
  font-size: 16px;
  line-height: 162%;
  margin: 0;
}

p + p {
  margin: 1rem 0;
}

.small-text {
  font-family: "Open Sans", sans-serif;  
  font-size: 14px;
  line-height: 162%;
}

.usa-menu-btn {
  background-color: #fff;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  padding: 0.5rem 1rem;
}


.main-content {
  margin-bottom: 1rem;
}

#OJP-top-link {
  width: 100%;
  /*height: 25px;*/
  /*background: url("/assets/graphics/header/ojp/OJP_top_header.gif") no-repeat left top #fff;*/
  /*max-width: 1200px;*/
  margin: auto;
  
}

.usa-banner__inner {
  max-width: 1200px;
}


.search-results-line  {
  color: #ECCF87;
  font-size:18px;
}

.filter-button  {
  font-size:16px;
  background-color: #F9EFD7;
}

.filter-header {
  background-color: #EDEFF0;
  border-bottom: 2px solid #ECCF87;
}


.filter-content-header {
  border-bottom: 1px solid #ECCF87;
}

.usa-accordion__item:last-child .filter-content-header {
  border-bottom: 0;
}

.usa-accordion__content ul.usa-list--unstyled li:first-of-type .usa-checkbox__label {
  margin-top: 0 !important;
}

.yellow-border {
  border-left: 1px solid #F9EFD7;
  border-right: 1px solid #F9EFD7;
}

.custom-card {
  border-radius: 4px;
  border: 1px solid #F9EFD7;
}

#header-banner {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  height: 65px;
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: #fff;
  text-shadow: none;
}

#header-container {
  font-size: 16px;
  position: relative;
  width: 100%;
  margin: 0 auto;
  height: 65px;
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: #FCF7EB;
  text-shadow: none;
  border-color: #F2DFAF !important;
  border-bottom: 2px solid #F2DFAF !important;
}

#header-container-links {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  height: 65px;
  padding-top: 10px;
  text-shadow: none;
}



.main-container {
  font-size: 16px;
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 15px;
  padding-right: 15px;
  text-shadow: none;
  max-width: 1200px;
}

.main-container-beige {
  font-size: 16px;
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding-left: 15px; 
  padding-right: 15px;  
  text-shadow: none;
  max-width: 1200px;
  background-color: #FCF7EB;
  border: #F2DFAF 1px solid;
}

.main-spacer{
  height: 20px;
}

.main-searchInput{
  max-width: 40rem;
}

.main-searchDropdown{
  width: 20rem;
  vertical-align: bottom;
}

.main-rightsLink{
  font-weight: 700;
  color: #2B6777;
  text-decoration: none;
  line-height: 162%;
}

#footer-container {
  background-color: #EDEFF0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  align-self: stretch;

 p {
  font-size: 14px;
 }

 .logos {
  display: flex;
  align-items: center;
  gap: 18px;
}

.socials {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-left: auto;
}

}

.footer-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding-right: 10px;
  margin-right: 10px;
  text-decoration: none;
  color: #2B6777;
  text-decoration: underline;
  line-height: 162%;
  font-size:14px;
}
.footer-link:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 1.4em;
  background-color: #ECCF87;
}

.footer-link:hover {
  color: #1A3E47;
}


.text-bold-light {
  font-weight: 600;
}


.DefaultRow{
	border-right: black 1px solid;
	border-top: black 1px solid;
	font-size: 12pt;
	border-left: black 1px solid;
	color: dimgray;
	border-bottom: black 1px solid;
	background-color: #fff;
	text-align: left;
}

.AlternateRow{
	border-right: lightgrey 1px solid;
	border-top: lightgrey 1px solid;
	font-size: 12pt;
	border-left: lightgrey 1px solid;
	color: dimgray;
	border-bottom: lightgrey 1px solid;
	background-color: #eef1f5;
	text-align: left;
}

.grid-container {
  max-width: 80rem;
}

.usa-card__container {
  border: none;
}

.usa-card__img {
  border-radius: 0 !important;
}


.usa-icon {  
  fill: #2B6777;
  height: 24px;
  position: relative;
  width: 24px;
}

.usa-media-block{
    align-items: center;
    align-self: stretch;
    gap: 4px;
}


a {
  color: #2B6777;
}
a:hover {
  color: #1A3E47;
}
a:visited {
  color: #54278f;
}

ul {
  line-height: 162%;
  padding-inline-start: 25px;

}

nav.usa-nav {
  border-bottom: 2px solid #ECCF87;
}

.borderline {
  border-top: 1px solid #ECCF87;
}

.yellow-background {
  background-color: #FCF7EB;
  border: #F2DFAF 1px solid;
}

.helper-text {
  font-size: 14px;
  line-height: 162%;
}

.gray-light {
    color:#5C677D;
}

.width-305{
    width: 305px;
  }


.vl-search-container{
    padding: 1.5rem 0;
    width:100%;
    background: #FCF7EB;
  }

.vl-search-container__inner{
    margin-left: auto;
    margin-right: auto;
    max-width: 76rem;
    position: relative;
    
    .usa-label {
      margin-top:0
    }
    .usa-form--large {
      max-width: 100%;
    }

    .usa-button {
      margin-top:0.5rem;
      margin-right: 0;
      border-radius: 0px 4px 4px 0px;
    }
    
}

/* media queries styles */

@media (min-width: 64em) {

  h1 + h2 {
    margin: 1.5rem 0 .5rem;
  }

  h3 + h3 {
    margin-top: 1rem;
  }

  h1 + p, h2 + p, h3 + p,
  .h1 + p, .h2 + p, .h3 + p, p + h3 {
    margin-top: .5rem;
  }

  p + .h2, p + h2, ul + .h2, ul + h2 {
    margin-top:1.5rem;
  }

  .h2 + h3, p + h3 {
    margin-top: 1rem;
  }

  .main-content {
    margin-bottom: 1.5rem;
  }

  .usa-banner__inner {
      padding-left: 0;
      padding-right: 0;
  }

  .footer-link{
    padding-right: 5px;
    margin-right: 5px;
  }



  .desktop\:text-center{
    text-align: center;
  }

  .desktop\:width-375{
    width: 375px;
  }

  .desktop\:text-right{
    text-align: right;
  }

  .usa-in-page-nav-container{
    margin-top:1.5rem;
  }
  
  .book-image-width {
    width:344px !important;
  }

  .usa-banner {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (max-width: 64em) {

  h1,.h1,.usa-card__heading {
  font-size: 20px;
  }

  h2,.h2 {
    font-size: 18px;
  }

  h3,.h3 {
    font-size: 16px;
  }

  p,ul,.usa-label, .usa-button--unstyled {
    font-size: 14px;
  }

  .small-text,.helper-text,.usa-banner__button,.usa-banner__header-text {
    font-size: 12px;
  }
  
  #footer-container {
  p {
    font-size: 12px;
  }
}

  .vl-search-container  {
    padding:1rem 0;
  }

  .usa-button-group__item {
    margin: 0.35rem;
    width: 40px;
    height: 40px;
}

  .flex-row-reverse {
    flex-direction: row-reverse;
  }

  .rightslink_Alt{
    line-height: 162%;
  }

  .usa-card__body{
  padding-left:1rem;
  padding-right:1rem;
  }

  .usa-card__body:last-child{
    padding-bottom:1rem;
  }

  .usa-card__body:first-child{
    padding-top:1rem;
  }

  .usa-card__body:only-child{
    padding-bottom:1rem;
    padding-top:1rem;
  }

  .padding-x-0-important {
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .book-image-width {
    height: 152px !important;
  }

  .width-30 { 
    width: 30% !important;
  }
}


/* side navigation styles */
  @media all and (max-width: 63.99em) {
    .usa-in-page-nav-container {
      display: flex;
      flex-direction: column;
    }

    .usa-in-page-nav-container > .page-title-wrapper {
      order: 0;
      margin-bottom: .5rem;
    }

    .usa-in-page-nav-container > .usa-in-page-nav {
      order: 1;
      position:unset;
     margin-top: .5rem;
    }

    .usa-in-page-nav-container > .main-content {
      order: 2;
    }

  }

  @media all and (min-width: 64em) {
    .usa-in-page-nav-container {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 2rem 1.5rem; 
      align-items: start;
    }

    .page-title-wrapper {
      grid-column: 1 / -1; /* make h1 span both columns */
    }

    .usa-in-page-nav-container > .usa-in-page-nav {
        margin-top: -3.25rem;
    }
    
  }



@media (max-width: 80em) {
    .usa-button {
        width: auto;
    }
  }