body {
    background: url('images/codioful-gradient.jpeg') no-repeat center fixed;
    background-size: cover;
    background-attachment: fixed;
    height: 500vh;
  }

html {
    scroll-behavior: smooth;
  }

a#navbar-id, .navbar {
    float: center;
    padding: 0px;
    text-align: center;    
}

a#navbar-id{
    font-family: 'Great Vibes', cursive;
    font-weight: 500;
    font-size: 7vh;
    max-width: 50%;
    background-image: url('images/codioful-gradient.jpeg');
    background-clip: text;
    -webkit-background-clip: text;
    color: #064235;
}

.navbar-brand {float:none;}

@media screen and (max-width: 800px) {
    #navlogo-id{text-align: center; display: block;}
    .navbar{margin: auto;}
    #nav-cont{display: inline;}
    a#navbar-id {margin: auto; font-size: 7vh; text-align: center;}
    body{overflow-y: scroll; overflow-x: hidden;}
    /* .navbar-brand img{width: 100%; height: 100%;} */
  }

.second-font {
    font-family: "Cinzel", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #064235
  }

.menu-btn{
  background-color: #064235;
  width: 20vh;
  font-size: 2.5vh;
}
.menu-btn:hover{
  background-color: #0f735d;
}

.menu-img{
  width: 50%;
  box-shadow:0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)
}
.ico{
  color: #064235;
}
.dtl{
  color: #064235;
  font-size: 5vh; 
  font-family: Tangerine, cursive; 
  font-weight: 400;
}

@media screen and (max-width: 430px) {
  .menu-img{
    width: 90% !important;
  }
}