a{
    color: unset;
    text-decoration: none;
}
a:hover{
    color: unset;
    text-decoration: none;
}
body {
    display: block;
    position: relative;
  }
  
body::after {
  content: "";
  background-image: url("../img/bg.jpg");
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

#bigSizeNav{
  left: 33px;
  width: 176px;
  text-shadow: 0 0 3px black;
  top: 53px;
  position: fixed;
  z-index: 5;
  display: flex;
  align-items: center;
  flex-direction: column;
  color: rgb(255 255 255);
}
#smallSizeNav{
  display: none;
}
#zoneLogo{
  padding-bottom: 22px;
  padding: 20px;
  align-items: center;
  display: flex;
  flex-direction: column;
  background-color: rgb(0 0 0 / 33%);
  /* border: solid 1px black; */
  width: 100%;
}
#zoneMenu{
  /* padding: 20px; */
  padding: 0px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.31);
  margin-top: 10px;
}
#logo{
  opacity: 0.6;
  width: 100%;
}

#architect{
  margin-top: 18px;
  text-transform: uppercase;
  text-align: center;
  font-family: 'Roboto Slab', serif;
}

#bigSizeNav ul{
  text-align: center;
  width: 100%;
  margin-top: 14px;
  list-style-type: none;
  padding: 0;
  margin: 0;
}
#bigSizeNav ul li{
  padding: 2px 6px;
  /* padding: 0px; */
  /* text-shadow: 0px 1px 4px black; */
  font-family: 'Roboto Slab', serif;
  font-size: 20px;
  border-top: solid 1px black;
}
.active{
  color: rgb(255, 255, 255);
  background-color: #0100fc57;
}

#bigSizeNav ul li:hover{
  color: rgb(255 255 255);
  background-color: #0100fc57;
}

button{
    background-color: transparent;
    border: none;
    outline: none;
}

/* footer */
footer{
    background-color: rgb(42, 42, 42);
    padding: 21px;
}
footer .fa{
    color: aliceblue;
    margin: 0 10px;
    font-size: 24px;
}
 @media only screen and (max-width: 990px) {
    /* #bigSizeNav { top:26px; left:8px;position: relative !important;}
    #architect {font-size: small;}
    #zoneLogo {width: 83% !important ;}
    #zoneMenu {width: 83% !important;}
    #zoneMenu li {font-size: small !important;}
    #logo {width: 100px ;} */
    .active{
      color: rgb(255, 255, 255,0.7);
      background-color: #00000000;
    }
    #bigSizeNav{display: none;}
    #smallSizeNav{display: flex;}
  }
  @media only screen and (max-width: 990px) {
    /* #bigSizeNav { position: relative !important;left:18px} */
  }