/* *, *:before, *:after {
box-sizing:border-box;
border: 0.1px solid red;
} */

html{
	height: 600px;
	margin: 0;

}

body {
	background-color:#FFD432; 
	height: 600px;
	background-image: url("");
    background-repeat: repeat;
}

a {
	text-decoration: none;
	text-decoration-line: none;
}

.container {
	max-width:1000px;
	margin-right: auto;
	margin-left: auto;
}

@media (max-width:900px) {
	.logo-lg {
		width: 60%;
	}
}

@media (max-width:500px) {
	.logo-sm {
		width: 80%;
	}
}

.logo {
	position: relative;
	top:100px;
}

.img {
	vertical-align: middle;
}

.btn {
	color: #000;
	text-decoration: none;
	border: 10px solid #000;
	border-radius: 35px;
	font-family: sans-serif;
	font-size: 1.3em;
	font-weight: 600;
	padding: 15px 40px;
	display: inline-block;
	position: absolute;
	top: 55%;
	left: 50%;
	transform: translate(-50%,-50%);
	overflow: hidden;
	transition: all 1s;
	background-color: #fff;
}

.btn:before {
	content: "";
	position: absolute;
	width: 320px;
	height: 320px;
	border-radius: 125px;
	background-color: #5473FF;
	opacity: 0.7;
	top: 60px;
	left: 50%;
	transform: translateX(-50%);
	transition: all 1s;
	animation: wave 5s infinite linear;

}

@keyframes wave{
	0%{
		transform: translateX(-50%) rotate(0deg);
	}
	100%{
		transform: translateX(-50%) rotate(360deg);
	}
}


.btn:hover:before {
	top: 5px;
	
}

.btn:hover {
	text-decoration-line: none;
}

img {
	position: relative;
	width: 45%;
	top: 50%;
	left: 50%;
	transform: translate(-50%);
}