body {
  background-color: rgba(255,255,255,0.3);
  background-blend-mode: multiply;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

@media(max-width:991px) {
  .sidebar{
    /*background-color: rgba(255,255,255,0.75) !important;*/
    -webkit-backdrop-filter: blur(7px) !important;
    backdrop-filter: blur(7px) !important;
  }
}

.navbar-brand {
  /*font-family: "newsreader-regular";*/
  font-weight: 200;
}

.navbar-social-icons {
  scale: 0.5;
  margin-right: -18px;
}

.intro-hero {
    text-align: center;
    /*padding-top: 300px;
    padding-bottom: 200px;*/
    max-width: 600px;
}

.intro-hero-text {
    font-family: "Newsreader";
    font-weight: 300;
    font-size: 40px;
}


/*
.dropdown .dropdown-menu {
  -webkit-transition: max-height 0.3s, opacity 0.2s 0.1s, visibility 0s 0.3s;
  -moz-transition: max-height 0.3s, opacity 0.2s 0.1s, visibility 0s 0.3s;
  -ms-transition: max-height 0.3s, opacity 0.2s 0.1s, visibility 0s 0.3s;
  -o-transition: max-height 0.3s, opacity 0.2s 0.1s, visibility 0s 0.3s;
  transition: max-height 0.3s, opacity 0.2s 0.1s, visibility 0s 0.3s;

  max-height: 0;
  display: block;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
}

.dropdown.show .dropdown-menu {
  -webkit-transition: max-height 0.3s, opacity 0.2s, visibility 0s;
  -moz-transition: max-height 0.3s, opacity 0.2s, visibility 0s;
  -ms-transition: max-height 0.3s, opacity 0.2s, visibility 0s;
  -o-transition: max-height 0.3s, opacity 0.2s, visibility 0s;
  transition: max-height 0.3s, opacity 0.2s, visibility 0s;

  max-height: 300px;
  opacity: 1;
  visibility: visible;
}
*/


/* Dropdown menu opening animation */
@keyframes slideDown {
  0% {
    max-height: 0px;
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    max-height: 300px;
    opacity: 1;
  }
}

.slideDown {
  
  -webkit-animation-name: slideDown;
  animation-name: slideDown;
  animation-duration: 0.4s;
  animation-fill-mode: both;
  animation-direction:alternate;
}

/* Trying to write dropdown menu closing animation */
@keyframes slideUp {
  0% {
    max-height: 300px;
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  100% {
    max-height: 0px;
    opacity: 0;
  }
}

.dropdown.hide > .slideUp {
  
  -webkit-animation-name: slideUp;
  animation-name: slideUp;
  animation-duration: 0.4s;
  animation-fill-mode: both;
  animation-direction:alternate;
}



#Fonts 

.newsreader-regular {
  font-family: "Newsreader", serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}


#Colors

[display-theme="light"]{
  --mainText: #201e1f;
  --secondText: #555153;
  --altText: #8c867f;
  --c3: #BFAC9B;
  --c4: #F7EDDE;
  --bgColor: #faf6f0;
  --c6: #ffffff;
}