.main {
 height: 100vh;
 background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%);
}

.navv {
    z-index: 1000;
 display: flex;

 justify-content: space-around;
 flex-direction: row;
 width: 100%;
 height: 50px;
 filter: drop-shadow(0 0 5px rgba(31, 31, 31, 0.1));
 position: fixed;
 bottom: 0;
}

.navv-slot {
 flex-basis: 15%;
 text-align: center;
 height: 100%;
 display: flex;
 align-items: center;
 justify-content: center;
}

.navv-link{
 width: 25px;
 height: 25px;
 line-height: 1.5;
 align-items: center;
 color: #aab2bd;
 border-radius: 50rem;
 padding: 0.5rem 0.5rem;
 transition: 0.3s all;
}

.active {
 color: darkblue;
}

.navv-link:hover {
 transition: 0.3s all;
 background: rgba(31, 31, 31, 0.1);
}

.curve {
 flex-basis: auto !important;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff'%3E%3Cpath d='M99,0A36.33,36.33,0,0,0,70,15,25,25,0,0,1,30,15,36.33,36.33,0,0,0,1,0H0V50H100V0Z'/%3E%3C/svg%3E");
 background-repeat: no-repeat;
 background-size: cover;
 background-position-y: center;
 width: 100px;
}

.bg-white-navv {
 background: white;
}

.floating-button {
 position: fixed;
 width: 60px;
 height: 60px;
 line-height: 3;
 text-align: center;
 color: #bc4749;
 border-radius: 50%;
 bottom: 35px;
 background-image: linear-gradient(to right, #bc4749 0%, #bc4749 100%);
 box-shadow: 0 10px 6px -6px #777;
 z-index: 1;
 transition: 0.3s all;
}

.floating-button:hover {
 bottom: 40px;
 transition: 0.3s all;
}

.round-top-left {
 border-top-left-radius: 15px;
}

.round-top-right {
 border-top-right-radius: 15px;
}

svg {
 height: 100%;
}