@font-face{font-family:'Poppins'; src:url("../css/fonts/Poppins-Regular.ttf") format("truetype"); font-weight:normal; font-style:normal;}
@font-face{font-family:'Poppins'; src:url("../css/fonts/Poppins-SemiBold.ttf") format("truetype"); font-weight:600; font-style:normal;}
@font-face{font-family:'Poppins'; src:url("../css/fonts/Poppins-Bold.ttf") format("truetype"); font-weight:bold; font-style:normal;}

html{font-size:25px;background:url('../images/slot_bg1.jpg') no-repeat center/cover;background-attachment:fixed;font-family: Poppins,sans-serif;color:#fff;margin:0;padding:0;min-height:100%;overflow:hidden;}
.content{overflow:hidden;}
.image-wrap{position:absolute;bottom:0;top:0;width:65%;animation: imageIn .7s ease-in, floating 3s 1s ease-in-out infinite;}
.image-wrap img{position:absolute;bottom:0;max-width:100%; max-height:90%;min-height:70%;/*transform:translateX(-50%);left:50%;*/}
.image-wrap .image-animate{animation: fade 3s ease-in-out infinite;}
.content-wrap{z-index:999;position:absolute;right:10%;width:40%;transform:translateY(-50%);top:50%;text-align:right;line-height:1.1}
.logo{width:100%; max-height:20vh;animation: textIn .5s ease-in, floating 5s ease-in-out infinite}
h2{font-size:4vw;margin:0 0 10px;background: #AE2E78;background: linear-gradient(to bottom, #AE5E93 0%, #EBC1ED 25%, #D169A4 26%, #E7BAE8 50%, #AE5E93 51%, #EBC1ED 75%, #D169A4 76%, #E7BAE8 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation: textIn .7s ease-in, blink 2s 1s ease-in-out infinite;}
b{font-size:3vw;}
small{display:block;margin-top:30px;}
a{color:#fff; transition:.5s; font-size:.7rem; text-decoration:none;display:inline-block;text-align:center;}
a + a{margin-left:30px;}
a:hover{color:#24ffff;}
a img{display:block;width:90px;animation: floating 2s ease-in-out infinite;margin:0 auto 30px;transition:.3s;border-radius:50%;}
a:hover img{box-shadow:0 0 15px #42ffff90;}
a + a img{animation: floating 2s .5s ease-in-out infinite;}
p{animation: textIn 1s ease-in;}
@keyframes fade {
	25% {opacity:.5; transform:scale(.95)}
	50% {opacity:1; transform:scale(1)}
	60% {opacity:.5; transform:scale(.95)}
	70% {opacity:1; transform:scale(1)}
	80% {opacity:.5; transform:scale(.95)}
	100% {opacity:1; transform:scale(1)}
}
@keyframes blink {
	from {text-shadow:none;}
	50% {text-shadow:0 0 5px #ffffff80;}
	to {text-shadow:none;}
}
@keyframes floating {
    from { transform: translate(0,  0px)}
    50%  { transform: translate(0, 15px)}
    to   { transform: translate(0, -0px)}    
}
@keyframes imageIn {
    from { transform: translate(0, 100%);opacity:0;}
    to  { transform: translate(0, 0);opacity:1;}   
}
@keyframes textIn {
    from { transform: translate(100%,0);opacity:0;}
    to  { transform: translate(0, 0);opacity:1;}   
}
@media (max-width:1439px){
	.content-wrap{right:5%;}
	.image-wrap img{bottom:50%; margin-bottom:-50%;min-height:auto;}
}
@media (max-width:991px){
	.content-wrap{position:relative;right:0;left:0;width:auto;text-align:center;transform:translate(0);padding:0 20px;}
	h2{font-size:2rem;}
	b{font-size:1.3rem;}
	.image-wrap{position:relative; width:100%; height:0;padding:15px 0 72%;overflow:hidden;}
	.image-wrap img{left:5%;top:0;bottom:auto;margin:0;}
}
@media (max-width:575px){
	html{font-size:16px;}
}