:root{
  --off-white: #FAFAFA;
  --dark-grey: #6C757D;
  --onyx-black: #1D1D1D;
  --accent-gold: #F1C21B;
}
body {
  height: 100%;
  min-height: -webkit-fill-available;
}
.bg-dark{
  background-color:var(--onyx-black) !important;
}
.list-unstyled{
  color: var(--off-white) !important;
}
.montserrat-heading {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}
html {
  height: -webkit-fill-available;

}
main {
  height: 100vh;
  height: -webkit-fill-available;
  max-height: 100vh;
  overflow-x: auto;
  overflow-y: auto;
  font-family: "Montserrat", sans-serif;
}
.monoton-regular {
  font-family: "Monoton", sans-serif;
  font-weight: 400;
  font-style: normal;
}
p{
  margin-bottom:20px;
}

h1{
  font-size: 61.04px;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  margin-bottom:30px;
  background-color:var(--onyx-black);
  color: var(--off-white);
  max-width:fit-content;
  padding:10px;
  border-radius: 10px;
}
.dropdown-toggle { 
  outline: 0;
 }

.btn-toggle {
  padding: .25rem .5rem;
  font-weight: 600;
  color: var(--off-white);
  background-color: transparent;
}

.btn-toggle::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform .35s ease;
  transform-origin: .5em 50%;
  filter: invert(1);
}

.btn-toggle[aria-expanded="true"] {
  color: var(--off-white);
}

.btn-toggle[aria-expanded="true"]::before {
  transform: rotate(90deg);
  filter:invert(1);
  color:var(--off-white)!important;
}
.btn-toggle-nav a {
  padding: .1875rem .5rem;
  margin-top: .125rem;
  margin-left: 1.25rem;
  color:var(--off-white)!important;
}
.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
  background-color: var(--accent-gold);
  filter:none;
}

.btn-toggle-nav [aria-current="true"]{
  color:var(--onyx-black) !important;
  background-color: var(--accent-gold);
}

.scrollarea {
  overflow-y: auto;
}

.b-example-divider {
  height: 100vh;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr {
  flex-shrink: 0;
  width: 1.5rem;
  height: 100vh;
}

.code-background{
  background-color: rgba(213, 213, 213, 0.363);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 1px 1px 1px;

}

.page-link{
  color: grey;
}

.pagination {
  --bs-pagination-hover-color: #222;
  --bs-pagination-hover-bg: #F1C21B;
  --bs-pagination-active-color: #222;
  --bs-pagination-active-bg: #F1C21B;
  --bs-pagination-active-border-color: #222;
}

.logo{
  z-index:109;
  position:relative;
}
.logo-blob{
  top: 0;
  left:10;
  z-index:-1;
  position:absolute;
}
.onyx-heading{
  font-family: "Monoton", sans-serif!important;
  /* top:0; */
  left:30%;
  font-weight: 400;
  font-size:100px;
  font-style: normal;
  position:relative;
  z-index:99;
  text-align: center;
  color:var(--onyx-black);
}
.onyx-text{
  font-family: "Monoton", sans-serif!important;
  font-weight:400;
  font-size:250px;
  font-style: normal;
  color:black;
  line-height:80%;
}

.details{
  display:flex;
  align-items: center;
}

.color-palette{
  height:15vh;
}

#color-offwhite{
  background-color:var(--off-white);
}

#color-darkgrey{
  background-color: var(--dark-grey);
}
#color-onyxblack{
  background-color: var(--onyx-black);
}

#color-accentgold{
  background-color: var(--accent-gold);
}

#home-hero{
  width:100%;
  min-height:30vh;
  background-color: var(--onyx-black);
  padding:50px;
}
#home-hero-content{
  z-index:99;
  position:relative;
  color:white;
}
#home-hero-content span{
  color:white;
}
#home-hero-content h1{
  font-size:90px;
  font-weight:400;
}
#lottie-blob{
  z-index:-1;
  /* margin-left:auto;
  margin-right: auto; */
  position:absolute;
  width:100%;
  max-height:400px !important;
}

#body.codepen-embed-hidden-nav #output{
  min-height:fit-content;
}
.card-img-top{
  min-height:290px;
  object-fit: cover;
  
}
.accordion-flush>.accordion-item>.accordion-header .accordion-button, .accordion-flush>.accordion-item>.accordion-header .accordion-button.collapsed{
  background-color:#1D1D1D;
  color:#FAFAFA;
}
.nav-link{
  color:var(--onyx-black);
  background-color: var(--dark-grey) ;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
  background-color: var(--accent-gold);
  color:var(--onyx-black);
  border:var(--onyx-black) 2px solid;

}
.nav-tabs{
  border-bottom:var(--onyx-black) 2px solid;
}
.tab-content{
  margin-top:40px;
}
.page-hero{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-color: var(--onyx-black);
  margin-bottom:10px;
  color:var(--off-white);
  min-width:100%;
  height: 40vh;
  padding: 0 0 0px 10px;
}
.page-hero h1{
font-size:90px;
font-weight:400;
}
img{
  max-width:95%;
}