:root {
  --tttblue: rgb(0,147,208);
  --tttorange: rgb(247,166,5);
  --nerve-black: rgb(59,59,58);
  --nerve-gray: rgb(98,98,97);
  --ms-black: rgb(8,26,37);
  --ms-text: rgba(0,0,0,.87);
  --ms-gray: rgb(240,242,244);
}

[data-md-color-scheme="nerve"] {
  --md-primary-fg-color: var(--ms-black);
  --md-accent-fg-color: var(--tttblue);
  --md-typeset-a-color: var(--md-accent-fg-color);
  --md-footer-bg-color: var(--ms-black);
  --md-code-bg-color: var(--ms-gray);
  --md-default-bg-color: var(--ms-gray);
}

@font-face {
    font-family: 'test-exo';
    src: url('../fonts/exo2-regular.eot');
    src: url('../fonts/exo2-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/exo2-regular.woff2') format('woff2'),
         url('../fonts/exo2-regular.woff') format('woff'),
         url('../fonts/exo2-regular.ttf') format('truetype'),
         url('../fonts/exo2-regular.svg#test-exo') format('svg');
    font-weight: normal;
    font-style: normal;
  }

@font-face {
    font-family: 'Public Sans';
    src: url('../fonts/PublicSans-Light.eot');
    src: url('../fonts/PublicSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PublicSans-Light.woff2') format('woff2'),
        url('../fonts/PublicSans-Light.woff') format('woff'),
        url('../fonts/PublicSans-Light.ttf') format('truetype'),
        url('../fonts/PublicSans-Light.svg#PublicSans-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

body,input{
      font-family: "Public Sans",Helvetica,Arial,sans-serif;
      /* font-family: "test-exo",Helvetica,Arial,sans-serif; */
      color: var(--ms-text);
      /* background-color: rgba(255,255,255,.9); */
      background-color: rgb(252,252,252);
    }

.md-ellipsis {
  font-weight: normal;
}

.md-grid {
  max-width: 1440px;
  }

@media only screen and (min-width: 2560px) {
  .md-grid {
    max-width: 1920px;
    }
}

table ul {
  margin-top: .5em !important;
  margin-bottom: .5em !important;
}

.md-typeset code, .md-typeset pre, kbd {
  font-family: "Courier New",Courier,monospace;
    }

.md-nav--lifted, .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link {
  background-color: var(--ms-gray);
  box-shadow: 1rem 0 0 0 var(--ms-gray);
  border-radius: 4px;
}

.md-nav--lifted>.md-nav__list>.md-nav__item--active {
    padding: .5rem 0;
}

.md-nav--secondary .md-nav__title {
  /* background-color: rgba(255,255,255,.9); */
  /* background-color: rgb(252,252,252); */
  background-color: inherit;
  box-shadow: none;
  /* padding-top: .5rem; */
}

.md-nav__item--section .md-nav__container .md-ellipsis {
  font-weight: bold;
}

.md-typeset h1 {
    margin: 0 0 1rem;
}

.md-typeset h4 {
    font-weight: normal;
}

/* colors for notes */

 .md-typeset .admonition .admonition-title,
 .md-typeset details {
  background-color: rgba(0,147,208,.1);
}

.md-typeset :is(.note)>:is(.admonition-title,summary) {
  background-color: rgba(0,147,208,.1);
}

.md-typeset .admonition .admonition-title:before {
  color: var(--tttblue);
}

.md-typeset :is(.admonition, details):is(.note) {
  border-color: var(--tttblue);
}

.md-typeset .admonition.note {
  background-color: rgba(0,147,208,.1);
  display: inline-block;
}

.md-footer-meta {
  background-color: var(--ms-black);
}

/* colors for warnings */

.md-typeset .admonition.warning .admonition-title {
  background-color: rgba(247,166,5,.1);
}

.md-typeset .admonition.warning .admonition-title:before {
  color: var(--tttorange);
}

.md-typeset .admonition.warning {
  background-color: rgba(247, 166, 5,.1);
  display: inline-block;
}


.md-typeset :is(.admonition, details):is(.warning, .caution, .attention) {
  border-color: var(--tttorange);
}

.network-gray {
  color: var(--nerve-gray);
}

.network-lightblue {
  color: rgb(91,184,229);
}

.network-darkblue {
  color: rgb(140,169,199);
}

.network-orange {
  color: var(--tttorange);
}

.network-green {
  color: rgb(162,210,182);
}

.network-purple {
  color: rgb(207,187,220);
}

.green {
  color: green;
}

.red {
  color: red;
}

/* classes for different image width */

.width33 {
  width: 33%;
}

.width50 {
  width: 50%;
}

.width60 {
  width: 60%;
}

.width70 {
  width: 70%;
}

.md-typeset h1[id] .headerlink:focus,
.md-typeset h1[id]:hover .headerlink:hover,
.md-typeset h1[id]:target .headerlink,
.md-typeset h2[id] .headerlink:focus,
.md-typeset h2[id]:hover .headerlink:hover,
.md-typeset h2[id]:target .headerlink,
.md-typeset h3[id] .headerlink:focus,
.md-typeset h3[id]:hover .headerlink:hover,
.md-typeset h3[id]:target .headerlink,
.md-typeset h4[id] .headerlink:focus,
.md-typeset h4[id]:hover .headerlink:hover,
.md-typeset h4[id]:target .headerlink,
.md-typeset h5[id] .headerlink:focus,
.md-typeset h5[id]:hover .headerlink:hover,
.md-typeset h5[id]:target .headerlink,
.md-typeset h6[id] .headerlink:focus,
.md-typeset h6[id]:hover .headerlink:hover,
.md-typeset h6[id]:target .headerlink,
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4, .md-typeset h5, .md-typeset h6 {
    color: var(--tttblue);
}

.md-typeset h5 {
  color: var(--ms-text);
  text-transform: none;
  font-size: inherit;
  margin-bottom: 0;
}

.md-tabs__link--active {
  color: var(--tttblue);
}

.md-typeset a:hover {
  color: rgba(0,147,208,.8);
}

.md-content__inner p {
  text-align: justify;
}

.md-tabs {
  border-bottom: solid 2px white;
}

/*statement for centering images with attr_list*/

 .center {
  display: block;
  margin: auto;
}

.v-align {
    vertical-align: middle;
}

.border {
  border: solid 1px var(--ms-black);
}

/* landing page css */

 .changelog-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 5%;
}

.landing-flex-links {
  flex: 100%;
  align-content: center;
  justify-content: center;
  display: inline-flex;
  flex-wrap: wrap;
}


.landing-flex-links a {
  display: block;
  overflow: hidden;
  height: 10rem;
  width: 16rem;
  border-left: solid 4px var(--ms-black);
  box-shadow: 0px 4px 13px 3px rgba(0, 0, 0, .2);
  margin: .5rem;
  background-color: var(--ms-black);
  text-align: center;
  color: var(--tttblue);
  padding: 1.8em .1em;
  font-size: 1.4rem;
  transition: 125ms;
}

.landing-flex-links a:hover {
  color: var(--tttblue);
  background: rgb(30,53,87);
  border-left: solid 4px var(--tttblue);
}

.landing-flex-links a span {
  font-size: .75rem;
  color: rgba(255,255,255,.9);
}

.changelog-box {
  border-left: solid 4px var(--tttblue);
  overflow: auto;
  height: 15rem;
  width: 32.5rem;
  box-shadow: 0px 4px 13px 3px rgba(0, 0, 0, .2);
  margin: 1rem;
  margin-top: 2rem;
  background-color: var(--ms-black);
  padding: 6px;
  padding-left: .8rem;
  color: rgba(255,255,255,.9);
  font-size: .7rem;
}

.changelog-box h1,
.changelog-box h2,
.changelog-box h3,
.changelog-box a {
  color: var(--tttblue);
  font-weight: normal;
}

.changelog-box a:hover {
  color: rgba(0,147,208,.8);
}

.changelog-flex h2 {
  margin-top: 0;
}

.changelog-box::-webkit-scrollbar {
  width: 10px;
}

.changelog-box::-webkit-scrollbar-track {
  background: var(--nerve-gray);
}

.changelog-box::-webkit-scrollbar-thumb {
  background: var(--tttblue);
  background: var(--nerve-black);
}

.changelog-box::-webkit-scrollbar-thumb:hover {
  background: var(--nerve-black);
}

.logo-box {
  display: block;
  /* margin-top: 11rem;
  margin-top: 20%; */
  margin-left: auto;
  margin-right: auto;
  margin-top: 25vh;
  height: 100vh;
}

.logo-box img {
  display: block;
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  animation: fadeIn 4s;
  -webkit-animation: fadeIn 4s;
  -moz-animation: fadeIn 4s;
  -o-animation: fadeIn 4s;
  -ms-animation: fadeIn 4s;
  transition: 300ms;
}

.logo-box img:hover {
  filter:drop-shadow(0px 10px 4px rgba(0, 0, 0, .5));
}

.mdx-container {
  background-image: url("../img/nerve_art.jpg");
  display: flex;
  flex: 100%;
  align-items: center;
  justify-content: center;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

#anchor {
  height: 1rem;
}

@media only screen and (max-width: 76.1875em) {

  .logo-box {
    display: none;
  }

  .changelog-box, .landing-flex-links a {
    width: 100%;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }
}

.fade-in {
  animation: fadeIn 2.5s;
  -webkit-animation: fadeIn 2.5s;
  -moz-animation: fadeIn 2.5s;
  -o-animation: fadeIn 2.5s;
  -ms-animation: fadeIn 2.5s;
  align-items: center;
  justify-content: center;
  display: block;
  color: rgba(255,255,255,.9);
  width: 4rem;
  height: 3rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right:0;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 4rem;
  opacity: .2;
  transition: 325ms;
}

.fade-in:hover {
  opacity: 1;
}

@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-moz-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-o-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-ms-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}
