html{
  scroll-behavior: smooth;
}

*{
  box-sizing: border-box;
  margin: 20;
  padding: 0;
}

body{
  background: #262626;
  color: #fff;
  font-size: 14px;
  height: 100vh;
  dsplay: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}

section{
  background-color:transparent;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

section:nth-child(odd){
  background: #ccc;
}

section:before{
  content: attr(data-text);
  color: #262626;
  font-size: 8em;
  text-transform: bold;
}

nav{
  position: fixed;
  top:0;
  background-color:transparent;
  width: 100vw;
}

nav ul{
  display: flex;
  list-style: none;
  box-shadow: 0 15px 40px #bb382c;  
  justify-content: center;
}
nav ul li{
  position:relative;
  padding: 15px;
  cursor: pointer;
  transition: .5s;
}

nav ul li a{
  text-decoration: none;
  color: inherit;
}
nav ul li:hover{
  color: #dcba1d;
}
nav ul li:before,
nav ul li:after{
  content: '';
  width: 100%;
  height:100%;
  position: absolute;
  top:-20;
  left:0;
  background:#256e35;
  z-index: -1;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform .5s;
}
nav ul li:after{
  z-index:-2;
  filter: blur(20px);
}
nav ul li:hover:before,
nav ul li:hover:after{
  transform: scaleY(1);
  transition-origin: top;
}

@media all and (max-width: 500px;){
display: block;
cursor: pointer;
}

#container{
  margin-top: 30px;
}

::selection{
  background-color: #256e35;
}

::-webkit-scrollbar {
  width: 5px;
}

.navigation-bar {
    width: 100%;  /* i'm assuming full width */
    height: 40px; /* change it to desired width */
    background-color: transparent; /* change to desired color */
}
.logo {
    display: inline-flex;
    vertical-align: center;
    width: 80px;
    height: 60px;
    margin-left: -370px;
    
}
.navigation-bar > a {
    display: inline-block;
    vertical-align: bottom;
    margin-right: 50px;
    height: 20px;        /* if you want it to take the full height of the bar */
    line-height: 80px;    /* if you want it vertically middle of the navbar */
}



.w3-center strong {
    font-family: "ShadowsIntoLight Regular";
}