@font-face {
    font-family: Roobert-Medium;
    src: url(Roobert-Medium.otf);
}
    body {
    width: 100%;
    min-height: 10px;
    font-family: Roobert-Medium;
    margin: 0;
    padding: 0;
    transition: .5s;
    background-image: linear-gradient(rgb(0 0 0 / 0%), rgb(0 0 0 / 75%)) , url(img/background5.webp);
    background-size: cover;
	background-position: bottom;
	background-blend-mode: lighten;
}
    .wrapper {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    width: 100%;
}
    .box-item {
    margin: 14px;
    width: 240px;
    text-align: center;
}
	.item-heading {
    height: 55px;
    line-height: 54px;
    font-weight: 900;
    color: #0f0843;
    border-radius: 10px;
    font-size: 1.4em;
    margin-bottom: 5px;
    /* border: solid 2px #231b64; */
    background-image: linear-gradient(310deg, #1374ff, #01c8ff);
}
    ul {
    /*background: #100949;*/
    /*border: #01c8ff solid 2px;*/
    padding: 5px 0px 20px 0px;
    margin: 0;
    border-radius: 10px;
}

	ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
}
    li {
    padding: 10px 0;
    font-size: 1em;
    font-weight: normal;
    list-style: none;
	border-radius: 10px;
	margin-top: 7px;
}
	
	/* social links */
	li:hover {
    transform: scale(1.2);
    transition: transform .2s;
}
	li#twitchli {
    background: #9146ff;
}
    li#vrchatli {
    background: white;
    box-shadow: black inset 0px 0px 0px 3px;
}
	li#vrchatli a {
    color: black !important;
}
	li#blskli {
    background: #1185fe;
}
    li#tiktokli {
    background: black;
    box-shadow: inset #fe2c55 -2px -2px 1px 0px, inset #25f4ee 2px 2px 1px 0px;
}
	li#telegamli {
    background: #24a2df;
}
	/* ------------ */
	
    li a, a:link, a:visited, a:focus {
    color: white;
    text-decoration: none;
    cursor: pointer;
	font-weight: 600;
}
    li a:hover {
    color: #white;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none;
}
    img#logo {
    width: 80%;
    margin-bottom: 10px;
	filter: drop-shadow(2px 4px 6px black);
}

	div#center {
	left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 30%;
    height: 200px;
    position: absolute;
}

	#background-video {
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: -1;
}

	@font-face {
    font-family: 'hinytz';
    src:  url('hinytz.eot');
    src:  url('hinytz.eot') format('embedded-opentype'),
    url('hinytz.ttf') format('truetype'),
    url('hinytz.woff') format('woff'),
    url('hinytz.svg') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

	[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'hinytz' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

	/* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

	.icon-VRChat:before {
    content: "\e900";

}