/* Hide "On GitHub" section from versions menu */

.md-header {
  background-color: #363178 !important;
} 

/* New selector customization*/

.md-version__current {
  font-size: 14px !important; 
}

.md-version__link {
  font-size: 14px !important; 
  background-color: #f8f9fa !important;
}

.md-version__item {
  font-size: 14px !important; 
}

/*body > div.injected > div > div > dl:nth-child(2) {
  display: none !important;
}

.rst-versions {
  z-index: 4 !important;
}

.rst-versions .rst-current-version {
  color: #363178 !important;
  background-color: #f8f9fa !important;
}

.rst-versions .rst-current-version .fa {
  color: #363178 !important;
}

.rst-versions.rst-badge {
  font-size: 1.2em !important;
  align-items: center !important;
  bottom: inherit !important;
}

.rst-versions.rst-badge .rst-current-version {
  line-height: 30px !important;
  text-align: right !important;
  height: 30px !important;
  overflow: hidden;
}

.rst-versions .rst-other-versions {
  background:#f8f9fa !important;
}

.rst-versions .rst-other-versions hr {
  display: none !important;
}

.rst-versions .rst-other-versions dd a {
  color: #363178 !important;
}

body > div.injected > div > div > dl:nth-child(1) > dt {
  color: #363178 !important;
  margin-bottom: 10px;
}

body > div.injected > div > div > dl:nth-child(1) > dd {
  width: 100%;
}

.rst-versions.rst-badge.shift-up .rst-current-version .fa-book {
  float: none !important;
}

body > div.injected > div > div > div {
  display: none !important;
}

body > div.injected > .rst-versions {
  max-height: fit-content !important;
  width: 100px !important;
  background: #363178 !important;
  left: 50% !important;
  margin-left: -714px;
  top: 128px;
  right: inherit !important;
  border: 0.7px solid #ddd;
}
*/
body {
  background: #f8f9fa;
  background-image: url('../../assets/common/background.png');
  background-position: right bottom;
  background-size: 20% auto;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/*
@media (max-width: 2000px) {
  body > div.injected > .rst-versions {
    margin-left: -654px !important;
    top: 115px !important;
  }
}

@media (max-width: 1600px) {
  body > div.injected > .rst-versions {
    margin-left: -594px !important;
    top: 105px !important;
  }
}

@media (max-width: 1220px) {
  body > div.injected > .rst-versions {
    top: 4px !important;
    right: 250px !important;
    left: inherit !important;
    margin-left: inherit !important;
  }

  .rst-versions .rst-current-version {
    background-color: transparent !important;
    color: #f8f9fa !important;
    border: 0.7px solid #ddd;
  }

  .rst-versions .rst-current-version .fa {
    color: #ddd !important;
  }

  .md-nav--primary > .md-nav__title {
    background-color: #7261d5 !important;
  }

  .md-nav--primary .md-nav__item--active > .md-nav__link {
    color: #7261d5 !important;
    background: transparent !important;
  }
}
*/
/*
@media (max-width: 1220px) {
  body > div.injected > .rst-versions {
    top: 4px !important;
    right: 250px !important;
    left: inherit !important;
    margin-left: inherit !important;
  }
}

@media (max-width: 955px) {
  body > div.injected > .rst-versions {
    right: 50px !important;
  }
}

body > header.md-header--shadow ~ .injected > .rst-versions {
  top: 68px;
}

@media (max-width: 2000px) {
  body > header.md-header--shadow ~ .injected > .rst-versions {
    top: 65px !important;
  }
}

@media (max-width: 1600px) {
  body > header.md-header--shadow ~ .injected > .rst-versions {
    top: 55px !important;
  }
}

@media (max-width: 1220px) {
  body > header.md-header--shadow ~ .injected > .rst-versions {
    top: 4px !important;
  }
}
*/

body > header.md-header--shadow ~ .md-container .md-nav--primary {
  margin-top: 32px;
}

body > div.md-container > nav {
  background-color: #7261d5;
}

.sidra-card-grid {
  max-width: 2900px;
  margin: 0 auto;
  display: grid;
  grid-gap: 1rem;

  @media (min-width: 100px) {
    grid-template-columns: repeat(1, 1fr);
  }

  @media (min-width: 1300px) {
    grid-template-columns: repeat(2, 1fr);
  }

  @media (min-width: 1900px) {
    grid-template-columns: repeat(3, 1fr);
  }

  @media (min-width: 2500px) {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sidra-small-card-grid {
  max-width: 2900px;
  margin: 0 auto;
  display: grid;
  grid-gap: 1rem;

  @media (min-width: 100px) {
    grid-template-columns: repeat(1, 1fr);
  }
  @media (min-width: 700px) {
    grid-template-columns: repeat(2, 1fr);
  }
  @media (min-width: 1400px) {
    grid-template-columns: repeat(3, 1fr);
  }
  @media (min-width: 2100px) {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sidra-card {
  display: flex;
  justify-content: center; 
  align-items: center; 
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0);
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  box-shadow: 0 0.3rem 0.5rem 0.1rem #D0CDDF;
  font-size: 0.6rem;
  flex-wrap: wrap;

}

.sidra-card-text {
  color: black;
  margin-bottom: 0.5rem;
}

.sidra-card-margin-img {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  align-items: center; 
}

.sidra-card-img {
  align-items: center; 
}


.sidra-small-card-title {
  color: #363178; 
  font-size: 0.7rem; 
  margin-top: 0.9rem;
  margin-bottom: 0;
  font-weight: 100;
  line-height: 1.3; 
  text-transform: none; 
}


.sidra-small-card-title-2 {
  color: #363178 !important;
  font-size:medium;
  margin-top: 0.9rem;
  margin-bottom: 0;
  text-align: center;
}

.version-tag {
  display: inline-block;
  background-color: #d0d3d5;
  font-weight: 800;
  font-size: 0.5rem;
  height: 5hv;
  width: 10hv;
  border-radius: 5px;
  margin: 0;
}

body > header > nav > div.md-header__title > div {
  --md-primary-fg-color: #8672fa !important;
}

.swagger-ui {
  .model-box {
    word-break: break-all;
  }
}

.sidra-card-versions {
  display: inline-flexbox;
  background-color: #d0d3d5;
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  border-radius: 25px;
  font-size: 0.6rem;
}

.sidra-card-versions h3 {
  color: #363178 !important;
  margin: 0.8em 0;
}

.sidra-card-tutorial {
  display: inline-flexbox;
  background-color: rgba(0, 0, 0, 0);
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  border: solid 1px #8672fa;
  margin-bottom: 1rem;
  border-radius: 25px;
  font-size: 0.6rem;
}

.sidra-card-tutorial h3 {
  color: #363178 !important;
  margin: 0.8em 0;
}

.sidra-card-intro h4 {
  color: #363178 !important;
  margin: 0.8em 0;
}

.sidra-card-intro h3 {
  color: #363178 !important;
  margin: 0.8em 0;
}

.sidra-card-intro {
  display: flex;
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  border-radius: 25px;
  font-size: 0.6rem;
}

.sidra-card-glossary {
  display: flex;
  background-color: rgba(0, 0, 0, 0);
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  border-radius: 25px;
  font-size: 0.6rem;
}

.sidra-card-intro-column {
  flex: 1; 
  margin: 5px;
}

.sidra-card-intro-row {
  margin-bottom: 10px;
}

.sidra-card-summary {
  display: inline-flexbox;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #363178; 
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  border-radius: 25px;
  font-size: 0.6rem;
}

.sidra-card-summary h3 {
  color: #363178 !important;
  margin: 0.8em 0;
}

.sidra-card-info {
  display: inline-flexbox;
  background-color: rgba(0, 0, 0, 0);
  padding: 0.1rem 1rem;
  margin-right: 0.5rem;
  margin-bottom: 1rem;
  border-radius: 25px;
  border: 1px solid #363178; 
  font-size: 0.6rem;
}

.sidra-card-info h3 {
  color: #363178 !important;
  border-color: #363178 !important;
  margin: 0.8em 0;
}

.md-footer-meta {
  background: #eaecf0;
}

.md-copyright {
  position: relative;
  font-size: 0;
  height: 60px;
  align-items: center;
  display: flex;
}

.md-copyright::before {
  content: "Powered by";
  position: relative;
  display: inline-block;
  color: #15212f;
  font-size: 0.4rem;
  margin-right: 5px;
  margin-top: 5px;
}

.md-copyright::after {
  content: "";
  background-image: url(../../assets/common/logo-sidra-smaller.svg);
  width: 106px;
  height: 40px;
  position: relative;
  display: inline-block;
}

/* Button horizontal welcome page */

.horizontal-card {
  max-width: 65vw;
  margin: 48px auto;
  display: block;
  overflow: hidden;
}

.content {
  display: flex;
}
@media (max-width: 1024px){
  .content{
  flex-direction: column;
  }
  .horizontal-card {
   max-width: 95vw;
  }
}
.leftside, .rightside {
  width: 150%; 
  height: auto; 
}

.rightside img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1vw;
}



.rightside video {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1vw;

}

.leftside {
  color: rgb(0, 0, 0);
  padding: 20px;
  width: 1000px;

}
.btn {
  display: inline-block;
  background: rgba(0, 0, 0, 0);
  border-color: #8672FA;
  margin-right: 4px;
  padding: 10px;
  border-radius: 5px;
  margin-top: 14px;
}
a.btn{
   text-decoration: none;
   font-size: 0.6rem !important;
}
a.btn:first-of-type {
   background: #8672FA;
   color: white;
}
a.btn:hover{
   opacity: 0.8;
   color: white !important;
}

h2.title-horizontal-card {
  line-height: 1 !important;
  margin: 0.3em 0 0.7em !important;
  font-size: 1rem !important;
  font-weight: bold;
  color:#555
}

p.text-horizontal-card {
  font-size: 0.6rem !important;
  color:#555
}

/* Button horizontal2 welcome page */

.leftside2 img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1vw;
  width: 30rem;
  height: 8rem;
}
.rightside2 {
  color: rgb(0, 0, 0);
  padding: 20px;
  width: 1000px !important;
}

.leftside2, .rightside2 {
  width: 100%;
}

h2.title-horizontal-card2 {
  line-height: 1 !important;
  margin: 0.3em 0 0.7em !important;
  font-size: 1rem !important;
  text-align: right;
  font-weight: bold;
  color:#555
}

p.text-horizontal-card2 {
  font-size: 0.6rem !important;
  text-align: right;
  color:#555
}

.btn2 {
  display: inline-block;
  margin-left: 8px;
  padding: 10px;
  border-radius: 5px;
  margin-top: 14px;

}

a.btn2{
  text-decoration: none;
  font-size: 0.6rem !important;
}
a.btn2:first-of-type {
  background: #8672FA;
  color: white;
}
a.btn2:hover{
  opacity: 0.8;
}

/* Button vertical welcome page */

.vertical-card {
  vertical-align: top;
  display: inline-block;
  text-align: center;
  width: 100px;
  margin-right: 4.5em;
  margin-top: 1.2em;
}

.topside img {
  display: block;
  width: 100px;
  height: 100px;
}

.bottomside, .topside {
  width: 100%;
}

span.title-vertical-card {
  line-height: 1 !important;
  margin: 0.3em 0 0.7em !important;
  font-size: 0.63rem !important;
  text-align: center;
  font-weight: bold;
  color:#555
}

p.text-vertical-card {
  font-size: 0.5rem !important;
  text-align: left;
  color:#555

}

/* Button vertical data products welcome page */

.vertical-card2 {
  vertical-align: top;
  display: inline-block;
  text-align: left;
  width: 200px;
  margin-right:2.80em;
  margin-top: 1.2em;
}

.topside2 img {
  display: block;
  width: 120px;
  height: 120px;
}

.bottomside2, .topside2 {
  width: 100%;
}

span.title-vertical-card2 {
  line-height: 1 !important;
  margin: 0.3em 0 0.7em !important;
  font-size: 0.70rem !important;
  text-align: left;
  font-weight: bold;
  color:#555
}

p.text-vertical-card2 {
  font-size: 0.60rem !important;
  text-align: left;
  color:#555

}


.md-nav {
  font-size: .6rem;
}

.md-nav--primary > .md-nav__title{
  color: #121c28 !important;
  background-color: transparent !important;
}


.md-nav--primary > .md-nav__list {
  font-size: .8rem !important;
  color: #121c28 !important;
  background-color: transparent !important;
}


.md-nav--secondary > .md-nav__title{
  font-size: .65rem !important;
  color: #5b646d;
  background-color: transparent !important;
}


.md-nav--secondary > .md-nav__list {
  font-size: .6rem !important;
  color: #8a9097;
  background-color: transparent !important;
}

.md-nav--lifted>.md-nav__list>.md-nav__item>[for]{
  color: #555 !important;
  background-color:  #f8f9fa !important;
}

.md-nav__item--section>.md-nav__link[for]{
  color: #555 !important;
  background: rgba(0, 0, 0, 0) !important;
}


.md-footer {
  background-color: #363178 !important;
}

.md-nav__list {
  list-style:none;
  margin: 0;
  padding: 0;
  background-color: transparent !important;

}


.md-tabs__link:hover {
  color:white !important;
}

a:hover {
  color: #7261d5 !important;
}

a:active {
  color: #363178 !important;
}

.md-nav--primary {
  border-right: 1px solid #e8e9ea;
  width: 90%;
}

.md-top {
  background-color: #363178;
  color:white;
}

.md-top:hover {
  background-color: #7261d5;
  color:white !important;
}

.highlight {
  font-size:medium !important;
  --md-code-bg-color: #e8e9ea;
}


.tabbed-labels:hover{
  color: #7261d5 !important;
}

.tabbed-labels:active{
  color: #7261d5 !important;
}


.btn-main {
  display: inline-block;
  background: #363178; 
  color: #FFF; 
  border: 2px solid #363178; 
  margin-right: 4px;
  padding: 10px;
  border-radius: 5px;
  margin-top: 14px;
  font-size: 0.7rem;
}

a.btn-main {
  text-decoration: none;
  font-size: 0.7rem; 
  color: #FFF; 
}

a.btn-main:first-of-type {
  background: rgba(0, 0, 0, 0);
  color: #363178;
}

a.btn-main:hover {
  opacity: 0.8;
  color: #7261d5 !important; 
}

.card-main {
  background: rgba(0, 0, 0, 0); 
  border: 1px solid #ddd; 
  border-radius: 8px; 
  padding: 20px; 
  margin: 10px 0; 
}

.card-main-title {
  font-size: 1rem; 
  color: #363178; 
}

a.btn-main2 {
  text-decoration: none;
  font-size: 0.7rem; 
}

a.btn-main2:first-of-type {
  color: #363178;
}

a.btn-main2:hover {
  opacity: 0.8;
  color: #7261d5 !important; 
}

.md-typeset {
  font-size: .75rem;
  line-height: 1.65;
}

.md-footer__link--next:hover{
  color: white !important;
}

.md-footer__link--prev:hover{
  color: white !important;
}

.md-nav--secondary .md-nav__title {
  background-color: rgba(0, 0, 0, 0) !important;
  box-shadow: 0 0 0 0 transparent !important;
}

.md-nav__link {
  background-color: rgba(0, 0, 0, 0) !important;
  box-shadow: 0 0 0 0 transparent !important;
}

.md-nav__icon > .md-icon {
  background-color: rgba(0, 0, 0, 0) !important;
  box-shadow: 0 0 0 0 transparent !important;
}

.md-nav__title[for] {
  background-color: #f8f9fa !important;
  box-shadow: 0 0 0 0 transparent !important;
}

.__nav_1[for]{
  background-color: #f8f9fa !important;
  box-shadow: 0 0 0 0 transparent !important;
}

/*PDF button*/

div.download-btn {
 /* position: absolute;
  right: 30%;
  bottom: 4.65%;
  text-align: right;*/
  font-size: .6rem !important;
  color: #8a9097;
}