/* Block styles */
html {
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    background-color: black;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

body {
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
}

header {
	display: flex;
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
}

.landing-wrapper {
    height: 100%;
    width: 100%;
    background-color: red;
}

.iframe-wrapper {
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-filter: sepia(1);
    z-index: 0;
}

* {
    margin: 0;
}

iframe {
	opacity: .5 !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-filter: sepia(1);
    z-index: -1;
}

@media (min-aspect-ratio: 16 / 9) {
    iframe {
        height: 300%;
        top: -100%;/
    }
}

@media (max-aspect-ratio: 16 / 9) {
    iframe {
        width: 300%;
        left: -100%;
    }
}

.header-wrapper {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: column;
	margin: auto;
	width: 50%;
	max-width: 30em;
	min-width: 10em;
	max-height: 30em;
	padding: 2em;
	background-color: white;
	opacity: .3;
	border-radius: 50px;
	z-index: 1;
	transition: .5s;
}

.header-wrapper:hover {
}

.fill-div {
    display: block;
    height: 100%;
    width: 100%;
    text-decoration: none;
}

.main-header {
	font-size: 250%;
	color: black;
	cursor: default;
}

hr {
	width: 20%;
	opacity: .4;
	margin-bottom: 1em;
}

a {
}

.logo-wrapper {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
	align-content: space-around;
}

.logo-a {
	width: 30%;
	height: 30%;
	margin: 1em;
	transition: .5s;
	padding: 10px;

}

.logo-a:hover {
	background-color: rgba(0,0,0,.3);
	border-radius: 25px;
	transition: background-color .5s;
}

.logo-img {
	width: 100%;
	height: 100%;
}


@media only screen and (max-width: 1024px) {
	hr {
	margin-bottom: 1em;
}
	.logo-a {
		width: 40%;
		height: 5%;
		margin: .3em;
	}
}