body {
    height: 100vh;
    width: 100vw;
    margin: 0;
    background-color: black;
    color: white;
    user-select: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

a {
    text-decoration: none;
    color: white;
}

@font-face {
    font-family: "Manomafont";
    src: url('../fonts/Manomafont-Regular.ttf');
}

@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-15px);
	}
	100% {
		transform: translatey(0px);
	}
}

.flex-column {
    display: flex;
    flex-direction: column;
}

#particles-js {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: -1;
}

#mano-logo {
    /* max-height: 33vh;
    max-width: 75vw; */
    object-fit: contain;
    width: 100%;
    max-height: 250px;
    z-index: 999;
	overflow: hidden;
	transform: translatey(0px);
	animation: float 6s ease-in-out infinite;
}

#mano-title {
    font-family: "Manomafont";
    margin: 0;
    text-align: center;
    font-size: 4rem;
}

.btn-link-social {
    padding: 2rem;
    position: absolute;
}

#btn-youtube {
    top: 1rem;
    left: 1rem;
}
#btn-bandcamp {
    top: 1rem;
    right: 1rem;
}
#btn-instagram {
    bottom: 1rem;
    left: 1rem;
}
#btn-facebook {
    bottom: 1rem;
    right: 1rem;
}

@media (max-width: 768px)
    , screen and (orientation: portrait) {
    #mano-logo {
        max-height: 150px;        
    }
    
    #mano-title {
        font-size: 2rem;
    }
    
    .btn-link-social {
        padding: 1rem;
    }
    
    #btn-youtube {
        top: .5rem;
        left: .5rem;
    }
    #btn-bandcamp {
        top: .5rem;
        right: .5rem;
    }
    #btn-instagram {
        bottom: .5rem;
        left: .5rem;
    }
    #btn-facebook {
        bottom: .5rem;
        right: .5rem;
    }
     
    
}