.fira-code {
	font-family: "Fira Code", monospace;
	font-weight: 400;
	font-style: normal;
}

.fira-sans-regular {
	font-family: "Fira Sans", sans-serif;
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "rabbit";
	src: url("../font/whiterabbit.woff") format("woff");
}

ul {
	list-style-type: none;
}

html{
	cursor: url("../cursor.cur"), auto;
}

a, a:hover{
	cursor: url("../pointer.cur"), pointer;
}

body {
	background-color: #0a0a0a;
	background-size: 100%;
}

.body {
	zoom: 75%;
	width: 1080px;
}

.title {
    width: 50%;
	height: auto;
	position: fixed;
	top: 0;
    left:0;
	display: block;
}

.main{
    position: relative;
    top:110px;
    left:740px;
    width: 1100px;
    height: 977px;
    background-image: url("https://file.garden/aG3rdTNO_Dlar7-g/new%20site/info/com-edit-dithered-smaller.png");
    background-repeat: no-repeat;
}

.main-content{
    position: absolute;
    top:100px;
    left: 200px;
    width: 660px;
    height: 500px;
    padding: 0 10px;
    color:white;
    font-family: "Fira Code", monospace;
    font-size: 32px;
    overflow-y: scroll;
}

.menu{
    position: absolute;
    top: 600px;
    left: 80px;
    display: flex;
    flex-direction: column;
}

.menu a{
    color:#6dd93b;
    font-family: "Fira Code", monospace;
    font-size: 48px;
    margin-bottom: 15px;
    padding: 0;
    width: 300px;
    text-decoration: none;
}

.menu a:before{
    content: '>';
    margin-right: 5px;
}

.menu a:hover:after{
    content: "▍";
	margin: 0 8px 20px;
	font-size: 48px;
	color: #6dd93b;
	font-family: "Fira Code", monospace;
	animation: blink 1.5s steps(1, start) infinite;
    animation-delay: .5s;
	transform: translateY(10px);
}

.menu button{
    background: none;
    border: none;
    color:#6dd93b;
    font-family: "Fira Code", monospace;
    font-size: 48px;
    margin-bottom: 25px;
    padding: 0;
    width: 650px;
    text-align: left;
}

.menu button:before{
    content: '>';
    margin-right: 5px;
}

.menu button:hover:after{
    content: "▍";
	margin: 0 8px 20px;
	font-size: 50px;
	color: #6dd93b;
	font-family: "Fira Code", monospace;
	animation: blink 1.5s steps(1, start) infinite;
    animation-delay: .5s;
	transform: translateY(10px);
}

.activetab:after{
    content: "▍";
	margin: 0 8px 20px;
	font-size: 30px;
	color: #6dd93b;
	font-family: "Fira Code", monospace;
	animation: blink 1.5s steps(1, start) infinite;
	transform: translateY(10px);
}

#info{
	text-align: center;
} 

#text::after{
	content: "▍";
	margin: 0 8px 20px;
	font-size: 25px;
	color: #6dd93b;
	font-family: "Fira Code", monospace;
	transform: translateY(10px);
	animation: blink 1.5s steps(1, start) infinite;
    animation-delay: 2.8s;
}

@keyframes blink {
	0%,
	50% {
		opacity: 1;
	}
	50.1%,
	100% {
		opacity: 0;
	}
}