.wrapper-thanks {
		height: auto;
		background: rgb(51,41,102);
		background: linear-gradient(90deg, rgba(51,41,102,1) 0%, rgba(124,108,176,1) 50%, rgba(51,41,102,1) 100%);
		width: 100%;
		height: 100vh;
		align-items: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.wrapper-thanks h1 {
		font-size: 40px;
		text-transform: uppercase;
		font-family: 'Montserrat', sans-serif;
		color: #332966;
		background: #fff;
		padding: 45px 35px;
		border-radius: 25px;
		display: inline-block;
		box-shadow: 1px 5px 10px 0;
		margin: 0 auto;
	}
	.wrapper-thanks .button {
		display: inline-block;
		text-align: center;
		padding: 18px 20px;
		height: auto;
		font-size: 32px;
		font-weight: bold;	
	}
	
	.running {
	 --color: #fff;
	 --duration: 0.8s;
	 text-align: center;
	 border-radius: 50%;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 transform: scale(var(--scale, 2)) translate(-50%, 0px);
	 top: 265px;
	 left: 50%;
	 margin-left: 8px;
}
 .running .outer {
	 animation: outer var(--duration) linear infinite;
	 margin-top: -8px;
}
 .running .outer .body {
	 background: var(--color);
	 height: 15px;
	 width: 8px;
	 border-radius: 4px;
	 transform-origin: 4px 11px;
	 position: relative;
	 transform: rotate(32deg);
	 animation: body var(--duration) linear infinite;
}
 .running .outer .body:before {
	 content: '';
	 width: 8px;
	 height: 8px;
	 border-radius: 4px;
	 bottom: 16px;
	 left: 0;
	 position: absolute;
	 background: var(--color);
}
 .running .outer .body .arm, .running .outer .body .arm:before, .running .outer .body .leg, .running .outer .body .leg:before {
	 content: '';
	 width: var(--w, 11px);
	 height: 4px;
	 top: var(--t, 0);
	 left: var(--l, 2px);
	 border-radius: 2px;
	 transform-origin: 2px 2px;
	 position: absolute;
	 background: var(--c, var(--color));
	 transform: rotate(var(--r, 0deg));
	 animation: var(--name, arm-leg) var(--duration) linear infinite;
}
 .running .outer .body .arm:before {
	 --l: 7px;
	 --name: arm-b;
}
 .running .outer .body .arm.front {
	 --r: 24deg;
	 --r-to: 164deg;
}
 .running .outer .body .arm.front:before {
	 --r: -48deg;
	 --r-to: -36deg;
}
 .running .outer .body .arm.behind {
	 --r: 164deg;
	 --r-to: 24deg;
}
 .running .outer .body .arm.behind:before {
	 --r: -36deg;
	 --r-to: -48deg;
}
 .running .outer .body .leg {
	 --w: 12px;
	 --t: 11px;
}
 .running .outer .body .leg:before {
	 --t: 0;
	 --l: 8px;
}
 .running .outer .body .leg.front {
	 --r: 10deg;
	 --r-to: 108deg;
}
 .running .outer .body .leg.front:before {
	 --r: 18deg;
	 --r-to: 76deg;
}
 .running .outer .body .leg.behind {
	 --r: 108deg;
	 --r-to: 10deg;
	 --c: none;
}
 .running .outer .body .leg.behind:before {
	 --c: var(--color);
	 --r: 76deg;
	 --r-to: 18deg;
}
 .running .outer .body .leg.behind:after {
	 content: '';
	 top: 0;
	 right: 0;
	 height: 4px;
	 width: 6px;
	 clip-path: polygon(2px 0, 6px 0, 6px 4px, 0 4px);
	 border-radius: 0 2px 2px 0;
	 position: absolute;
	 background: var(--color);
}

 @keyframes outer {
	 50% {
		 transform: translateY(0);
	}
	 25%, 75% {
		 transform: translateY(4px);
	}
}
 @keyframes body {
	 50% {
		 transform: rotate(16deg);
	}
	 25%, 75% {
		 transform: rotate(24deg);
	}
}
 @keyframes arm-leg {
	 50% {
		 transform: rotate(var(--r-to));
	}
}
 @keyframes arm-b {
	 30%, 70% {
		 transform: rotate(var(--r-to));
	}
}
 html {
	 box-sizing: border-box;
	 -webkit-font-smoothing: antialiased;
}
 * {
	 box-sizing: inherit;
}
 *:before, *:after {
	 box-sizing: inherit;
}

.circle-wrap {
	width: 125px;
	height: 125px;
	border: 2px solid #fed141;
	border-radius: 50%;
	display: flex;
	margin-bottom: 40px;
	align-items: center;
	justify-content: center;
}

@media (max-width: 568px){
	.wrapper-thanks h1 { 
		width: 100%;
	    padding: 10px;
	    font-size: 24px;
	    padding: 15px;
	}
	.circle-wrap {
	    margin-top: -85px;
	}
}