:root {
--tf-col-primary: #1444dd;
--tf-col-accent: #1444dd;
--tf-col-text: #353935;
--tf-col-border-light: #d5d5d5;
--tf-col-code-block: #efefef;
--tf-col-bg: #ffffff;
}
.md-typeset mark {
  color: var(--tf-col-accent);
  background: #1444dd30 !important;
}

* {box-sizing: border-box;}

/* Typo */
.md-typeset h1 {
color: var(--tf-col-primary);
}
.md-typeset h2, .md-typeset h3,
.md-typeset h4, .md-typeset h5,
p {
  color: var(--tf-col-text);
}
.md-typeset h1 {
  font-size: 1.5rem;
  font-weight: 700;
}
.md-typeset h2 {
  margin: 1rem 0 0;
  font-size: 1.25rem;
  font-weight: 500;
}
.md-typeset h3 {
  font-size: 1rem;
  font-weight: 500;
}
p {
  margin: .5rem 0;
}

/* Navbar */
.md-header, .md-tabs {
background: var(--tf-col-primary);
}
.md-nav__item .md-nav__link--active {
  font-weight: 600;
  color: var(--tf-col-primary);
}

/* Footer */
.md-footer-meta__inner {
  border-top: 1px solid var(--tf-col-border-light);
}
.md-footer, .md-footer-meta {
  background: transparent !important;
  }
.md-copyright, 
html .md-footer-meta.md-typeset a {
  color: var(--tf-col-text);
}
html .md-footer-meta.md-typeset a:hover {
  color: var(--tf-col-primary);
}
.md-copyright__highlight {
  color: var(--tf-col-text);
}

/* Lists */
.md-typeset ol, .md-typeset ul {
  margin-left: 0 !important;
}
.md-typeset ol li, .md-typeset ul li {
  margin-left: 15px !important;
}

/* Code Blocks */

.md-typeset code {
  padding: .5rem;
  background: var(--tf-col-code-block);
}

/* Headline */
.headline h1 {
  margin: 0;
}

/* Feature Blocks */
.feature-blocks {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* Two columns, each taking up half the width */
  grid-gap: 20px; /* 20px gap both horizontally and vertically */
}
@media (max-width: 800px) {
  .feature-blocks {
    grid-template-columns: 1fr; /* Single column layout */
  }
}
.feature-block {
  border: 1px solid var(--tf-col-primary);
  padding: 20px;
  border-radius: 1rem;
  -webkit-border-radius: 1rem;
  -moz-border-radius: 1rem;
  -ms-border-radius: 1rem;
  -o-border-radius: 1rem;
  transition: all .25s ease-out;
  -webkit-transition: all .25s ease-out;
  -moz-transition: all .25s ease-out;
  -ms-transition: all .25s ease-out;
  -o-transition: all .25s ease-out;
}
.feature-block h2 {
  margin: 0;
  font-weight: 300;
  color: var(--tf-col-primary);
}
.feature-block p {
  margin: 0 0 .75rem;
  margin-top: .5rem;
  font-size: .75rem;
  font-weight: 300;
  line-height: 1.4;
  color: var(--tf-col-text);
}
.btn-more {
  cursor: pointer;
  padding: 6px 12px;
  font-size: .675rem;
  font-weight: 400;
  text-transform: uppercase;
  background: transparent;
  border: 1px solid var(--tf-col-primary);
  border-radius: .35rem;
  -webkit-border-radius: .35rem;
  -moz-border-radius: .35rem;
  -ms-border-radius: .35rem;
  -o-border-radius: .35rem;
}
.btn-more:hover {
  color: var(--tf-col-primary) !important;
  background: var(--tf-col-bg);
}
.feature-block:hover {
  background: var(--tf-col-primary);
}
.feature-block:hover h2,
.feature-block:hover p {
  color: var(--tf-col-bg);
}
.feature-block:hover .btn-more {
  color: var(--tf-col-bg);
  border: 1px solid var(--tf-col-bg);
}