@font-face { font-family: impacted; src: url(IMPACTED.ttf); }
@font-face { font-family: grime-slime; src: url(GrimeSlime-Regular.ttf); }
@font-face { font-family: grafina;  src: url(Grafina.ttf); }
@font-face {font-family: arial-narrow; src: url(arialnarrow.ttf);}

/* ===== scrolls ===== */
	.scroll { overflow-y: auto; overflow-x: hidden; }

	.no-scrollbar::-webkit-scrollbar {
		width: 0px; } 

	.no-scrollbar-lg::-webkit-scrollbar {
		@media (max-width: 768px) {	width: auto !important; }
		@media (min-width: 800px) {	width: 0px; }
		} 

/* flat on mobile */

	.mobile-flat {
		@media (max-width: 768px) {	height: auto !important; }
		@media (min-width: 800px) {	height: auto; }
	}


:root {
    --yellow: #ffc813;
}
        body {
        background: url(https://i.pinimg.com/736x/bf/2a/81/bf2a819ac3093b4dd479e6ed97e69113.jpg)
        1030px/450px no-repeat #202020;
        height: 100%;
        color: white;
        font-size: 15px;
        line-height: 14px;
        letter-spacing: 1px;
        font-family: arial-narrow;
        }

    #MUSIC-PAGE-ID {

    #everything {
        background: url(https://i.pinimg.com/1200x/83/be/df/83bedf767034004a6d56f547f413fa10.jpg)
        center/contain;
        outline: 2px solid black;
        border-radius: 0; 
        filter: drop-shadow(0 0 10px black);}

    #everything-body {
        background: url(https://64.media.tumblr.com/8df9442a2b436f8d12112c602e7350ea/10ff2b713f53612e-8b/s2048x3072/d1e1eac314aad939938355d94a77a0aefe4b8295.jpg)
        black;
    }

    #card-content {
        background: url(https://i.pinimg.com/736x/77/6e/7c/776e7ce2ffb7247e52e8d625631a17c9.jpg)
        center/500px #202020;
        border: 1px solid black;
        outline: 1px solid black;
        border-radius: 0;
        padding: 5px;
	@media (max-width: 768px) { margin: 5px;}
	@media (min-width: 800px) { margin: 5px;}
    }

    #card-body { 
        background: url(https://i.pinimg.com/736x/df/14/81/df148134b49d8a115da8373995befdfb.jpg)
        center/cover black;
        margin: 5px;
        padding: 15px;
        border: 2px solid black;
        border-radius: 5px;
        box-shadow: 0 0 5px black;
    }

    img {
        max-width: 100%; height: auto;
        object-fit: cover;
        border-radius: 0;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family: grime-slime;
        text-align: center;
    }

    h1 { font-size: 5rem; margin-left: 0; filter: drop-shadow(0 0 5px black); }
    h3 { font-size: 2.5rem; margin: 10px; filter: drop-shadow(0 0 5px black); }
    h4 { font-size: 1.4rem;}
    h5 { font-size: 1.2rem; line-height: 25px; margin: -5px;}
    h6 { font-size: 0.8rem; line-height: 15px;}

    a { color: #ff4848; display: block; font-weight: bold; margin: 5px;
    filter: drop-shadow(1px 1px 0 black); }
    a:hover { color: white; filter: drop-shadow(0 0 2px white); }

    #divider {
		margin: 30px auto 5px auto;
		height: 30px;
        background: url(https://i.pinimg.com/736x/df/14/81/df148134b49d8a115da8373995befdfb.jpg)
        center/100px black;
        filter: drop-shadow(0 0 3px black);
        border: 2px solid black;

        h3 {
            margin: 3px;
            text-align: center;
			text-transform: uppercase;
			font-weight: 900;
			font-size: 1.8rem;
            font-family: grime-slime;
			color: var(--yellow);
			z-index: 1;
			line-height: 25px;
            filter: drop-shadow(0 0 3px black);
        }
    }

    b { color: var(--yellow); }

    #SONGS {
    ul {  list-style-type: square;  }
    h6::before {content: ""; display: block; width: 100%; height: 1px; background-color: white; border-radius: 5%; margin: 5px 0 5px 0;}
    li { margin-left: -20px;}
    li::before { content: ""; display: block; width: 100%; height: 0.5px; background-color: white; border-radius: 5%; margin: 5px 0 5px -20px;}
        }

    #MUSIC-NAVIGATION {
        li { margin: 0 10px 0 0; }
        a {
            font-family: grime-slime;
            font-size: 1.5rem;
            line-height: 35px;
            text-align: center;
            color: var(--yellow);
        }
        a:hover { filter: drop-shadow(0 0 2px black); }

        a::before { content: " / "; font-family: sans-serif; font-weight: lighter;  }
    }
    li { margin-left: -20px; }

    #FAV-ARTISTS-BANDS {
        #card-body { margin: 5px }
    }

    .screen-border-1 {
        background: url(https://gifcity.carrd.co/assets/images/gallery47/06ea90ae.gif?v=20a350bf)
        center/contain repeat-x; height: 30px; width: 100%;
        position: fixed;
        z-index: 999999999999;
    }
    .screen-border-2 {
        background: url(https://gifcity.carrd.co/assets/images/gallery48/274c12b0.png?v=20a350bf)
        center/contain repeat-x; height: 70px; width: 100%;
        position: fixed;
        z-index: 999999999999;
    }

    img.decor { border-radius: 0; z-index: 999;}

/*===== STYLE: SCROLLBAR =====*/
	::-webkit-scrollbar { width: 5px;	}
	::-webkit-scrollbar-track { background: transparent; }
	::-webkit-scrollbar-thumb { background: red}
	::-webkit-scrollbar-thumb:hover { background: #ff3d3d ;}

    .stamps img { width: 50% !important;
			max-height: 60px !important;
			object-position: center;
			object-fit: contain;
			margin: 0 auto;
			display: inline-block;}

    }