:root {
    background-color: #333;
}

body {
        font-family: monospace;
}
        

.default {

    

    .main-container {
	    color: white;
		margin: 0;

		width: 100%;
		height: 100%;

		display: flex;
		flex-direction: column;
		justify-content: justify;

		width: 80vw;
		height: 80vh;

		margin: 1vh auto;
	}

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

a:hover {
	color: lightgray;
	background: rgba(255, 255, 255, 0.5);
}

.hover-rotate:hover {
	transform: rotate(45deg);
}

.hover-label {
	opacity: 0;
}
.hover-label:hover {
	opacity: 1;
}


.icon-button-container {
    position: absolute;
    /* background: #f0f0f0; */
    border-radius: 50%;
        
}
.icon-button-container img, .icon-button-container label {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-button-container label {
        z-index: 3;
        opacity: 0;
        white-space: nowrap;
    }
    .icon-button-container img {
        z-index: 2;
        width: 140%;
        /* filter: blur(0.5px); */
    }

    .icon-button-container:hover img {
        transform: translate(-50%, -50%) rotate(45deg);
    }
    .icon-button-container:hover label {
        opacity: 1;
        font-size: 2rem;
        font-weight: bolder;
        color: white;
        background: rgba(255, 255, 255, 0.5);
        -webkit-text-stroke: 0.1rem black;
        /* https://www.reddit.com/r/csshelp/comments/b3z3gp/how_to_i_make_text_with_black_outline/ */
        /* text-shadow: 0.05em 0 black, 0 0.05em black, -0.05em 0 black, 0 -0.05em black, -0.05em -0.05em black, -0.05em 0.05em black, 0.05em -0.05em black, 0.05em 0.05em black; */
    }


}

.terminal {
    body::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.15) 0,
      rgba(0, 0, 0, 0.15) 1px,
      transparent 1px,
      transparent 2px
    );
    pointer-events: none;
    z-index: 100;

    /* filter: blur(10rem) */
  }
}