/* Version: US-7347-1 */

a.gray-background:link {
  color: white
}

a.gray-background:visited {
  color: lightgray;
}

a.gray-background:hover {
  color: #8ebf42;
}

button.primary-button {
  border-radius: 15px;
  background-color: #001F55;
  border: 2px solid #001F55;
  color: white;
  font-size: 14px;
  height: 32px;
  margin: 0;
  min-width: 0;
  padding: 0 16px 0 16px;
}

button.secondary-button {
  border-radius: 20px;
  border: 1px solid #CA9658;
  background-color: #CA9658;
  color: white;
  font-size: 14px;
  height: 32px;
  margin: 0;
  min-width: 0;
  padding: 0 16px 0 16px;
}

/* https://codeconvey.com/responsive-accordion-pure-css/ */
.tabs {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.5);
}
 
.tab {
  width: 100%;
  color: #386E8E;
  overflow: hidden;
}
.tab-label {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
          justify-content: space-between;
  padding: 1em;
  font-weight: bold;
  cursor: pointer;
  /* Icon */
}

/* styles for tab content (the detailed contents in accordion) */
.tab-content {
  max-height: 0;
  padding: 0 1em;
  color: #2c3e50;
  background: white;
  -webkit-transition: all .35s;
  transition: all .35s;
}

.tab-label:hover {
  background: #1B242F;
  color: #5491C3;
}
.tab-label::after {
  content: "\276F";
  color: #F2E5D4;
  width: 1em;
  height: 1em;
  text-align: center;
  -webkit-transition: all .35s;
  transition: all .35s;
}

/* we’ll use CSS pseudo selector for input checked to functionalities the accordion.
https://css-tricks.com/pseudo-class-selectors/ */
input:checked + .tab-label {
  background: #1B242F;
  color: #5491C3;
}
input:checked + .tab-label::after {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
input:checked ~ .tab-content {
  max-height: 100vh;
  padding: 1em;
}

/* hide the HTML input element from the users. You can use the CSS display none property for it. 
Likewise, set its opacity value to zero. It’s your choice to place it behind the scene.
*/

input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}