.glassmorphism{
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(0.8rem);
    -webkit-backdrop-filter: blur(0.8rem);
}

.big-gap{
    margin-top: 9rem;
    margin-bottom: 1rem;
}

.circle-image{
    border: 0.2rem solid orange;
    border-radius: 50%;
    object-fit: contain;
    height: 5rem;
    width:5rem;
}

.float-from-left{
    transform: translateX(-20rem);
    animation: floatInLeft 1.5s ease-out forwards;
}

.float-from-right{
    transform: translateX(20rem);
    animation: floatInRight 1.5s ease-out forwards;
}

@keyframes floatInLeft {
    0%{
        opacity: 1;
        transform: translateX(-20rem);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes floatInRight {
    0%{
        opacity: 1;
        transform: translateX(20rem);
    }
    100%{
        opacity: 1;
        transform: translateX(0);
    }
}

.spinner-border{
    animation-duration: 20s;
    border: none;
}

.hidden{
    display: none;
}

.fancy-link {
    position: relative;
    text-decoration: none;
    color: darkorange;
    padding: 8px 16px;
    display: inline-block;
}

.fancy-link::before,
.fancy-link::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 0;
    height: 2px;
    background: white;
    transition: width 0.3s ease;
}

.fancy-link::before {
    left: 0;
}

.fancy-link::after {
    right: 0;
}

.fancy-link:hover::before,
.fancy-link:hover::after {
    width: 50%;
    color: white;
}
