html, body {height: 100%; width: 100%;}
body {display: flex; height: 100%; width: 100%; flex-direction: column;}

h2 { color: black; background: #eff3fc;}

.hatter {background-image: url("../hatter.jpg"); height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover;}
.elvalaszt{height:3px; border-width:0; color:white; background-color:white; margin:0; opacity: 0.9;}

main {margin-top:20vh !important; padding-bottom:20vh !important;}

/** Loader Styles */
#preloader {position: fixed; top: 0; left: 0; width: calc(100%); height: calc(100%); z-index: 999; background: #0000008f; display: flex; align-items: center; justify-content: center;}
#preloader .lds-ring {display: inline-block; position: relative; width: 80px; height: 80px;}
#preloader .lds-ring div {box-sizing: border-box; display: block; position: absolute; width: 64px; height: 64px; margin: 8px; border: 4px solid #fff; border-radius: 50%;
	animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #00b6ff transparent transparent transparent;}
#preloader .lds-ring div:nth-child(1) {animation-delay: -0.45s;}
#preloader .lds-ring div:nth-child(2) {animation-delay: -0.3s;}
#preloader .lds-ring div:nth-child(3) {animation-delay: -0.15s;}
@keyframes lds-ring {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}