.visible-xs {
	display: none !important;
}

.hidden-xs {
	display: block !important;
}
@media(min-width: 767px){
	body,
html {
    font-size: 1.35vh;}
	.all-content{
padding-bottom: 15rem;
min-height: 47rem;
}
#step-1 .all-content{
	min-height: 53rem;
}
#step-4 .all-content,
#step-8 .all-content,
#step-3 .all-content,
#step-10 .all-content{
min-height: 70rem
}
#step-5 .all-content{
min-height: 49rem
}
#step-7 .all-content{
min-height: 64rem
}
#step-9 .all-content{
min-height: 49.5rem
}
#step-9 .right h1{
margin-top: 3.5rem
}
#step-11 .all-content{
min-height: 59rem;
}
.svg-btn{
position: absolute;
bottom:0;
width: 100%;
left:0;
}
.practice{
	position: absolute;
	bottom: 1rem;
	width: 100%;
	left:0;
}
}
@media(max-width: 767px) {
	.visible-xs {
		display: block !important;
	}

	.hidden-xs {
		display: none !important;
	}
	.main{
		padding: 0;
	}
}

@media(max-width: 500px) {
	.welcome {
		width: 30rem;
	}

	body,
	html {
		font-size: 10px;
	}

	.cloud-1 {
		width: 3.5rem;
	}

	.cloud-2 {
		width: 7.5rem;
	}

	.cloud-3 {
		width: 6rem;
	}

	.cloud-4 {
		width: 5.5rem;
	}

	.cloud-5 {
		top: 13.5rem;
		width: 6.2rem;
	}

	.cloud-6 {
		width: 10rem;
	}

	.cloud-7 {
		width: 9rem;
	}

	.cloud-8 {
		width: 7rem;
	}

	.face-1 {
		width: 20rem;
	}

	.welcome-1 h1 {
		font-size: 3.1rem;
	}

	.time p {
		font-size: 1.3rem;
	}

	.svg-btn svg {
		margin-top: -2rem;
	}

	.practice h6 {
		margin-top: -4rem;
		margin-bottom: 3rem;
	}

	.cloud-11 {
		width: 7rem;
	}

	.cloud-10 {
		width: 6rem;
	}

	.all-check {
		margin-bottom: 1.5rem;
		padding-top: 0.5rem;
	}

	.checkmark {
		height: 24px;
		width: 24px;
	}

	.container .checkmark:after {
		left: 10px;
	}

	.line-one {
		display: none;
	}

	.form-1 {
		background-size: 11px 7px;
	}

	.face-4 {
		width: 60%;
	}
}