@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

body {
    background: linear-gradient(to right, #0ef, #015f66);
    font-weight: 400;
    min-height: 100vh;
    display: grid;
    place-content: center;
	overflow: hidden;
}

.lendrow {
	position: relative;
    max-width: 1000px;
    width: 100%;
	transition: all .5s ease;
}

.lendrow h1 {
	position: relative;
	width: 100%;
    font-size: 90px;
	font-weight: 800;
	margin-bottom: -73.5px;
	background: linear-gradient(to right, #f7f7f7, #787777);
	-webkit-background-clip: text;
    background-clip: text;
    color: transparent;
	text-shadow: 0px 0px 0px rgba(0,0,0,0.20);
}

.lendrow h2 {
	position: relative;
	width: 100%;
    font-size: 90px;
	font-weight: 800;
	background: linear-gradient(to right, #f7f7f7, #787777);
	-webkit-background-clip: text;
    background-clip: text;
    color: transparent;
	background-image: linear-gradient(to right, #f7f7f7, #787777);
    mask-image: linear-gradient(to top, rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0));
	text-shadow: 0px 0px 0px rgba(0,0,0,0.40);
	transform: rotateX(180deg);
	z-index: -100;
}

.lendrow .class1 {
	position: relative;
	width: 100%;
	font-size: 20px;
}

.lendrow .class3 {
	position: relative;
	left: 0;
	width: 100%;
	font-size: 20px;
}

.start {
	margin-top: 50px;
}

.start a {
	position: relative;
	text-decoration: none;
    color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.8);
    width: 100%;
    font-size: 30px;
    font-weight: 700;
    outline: none;
    border: none;
    border-radius: 10px;
    cursor: pointer;
	transition: all .5s ease;
}

.start a:hover {
	color: #0ef;
}

.start a .animated-dots {
	position: relative;
}

.dots::after {
	content: "";
	position: absolute;
	right: -20px;
	display: inline-block;
	width: 0.6em;
	height: 1em;
	animation: dots 1.5s steps(4, end) infinite;
	opacity: 0.5;
	transition: opacity 0.5s;
}

@keyframes dots {
	0% {
		content: "";
		opacity: 0.5;
	}
	25% {
		content: ".";
		opacity: 1;
	}
	50% {
		content: "..";
		opacity: 1;
	}
	75% {
		content: "...";
		opacity: 1;
	}
	100% {
		content: "";
		opacity: 0.5;
	}
}

.copyright {
	position: fixed;
	bottom: 2%;
	right: 2%;
	color: #fff;
	font-size: 10px;
	font-weight: 500;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.8);
	z-index: 999;
	transition: all .5s ease;
}

@media screen and (max-width: 768px) {
	.lendrow {
		width: 100%;
		transform: scale(70%);
	}
	
}