@media(min-width:1200px){

	.form {

		margin-left: 145px;

	}

	.box {

		width: 500px;

		margin: 50px 0;

	}





	.float {

		position: absolute;

		z-index: 2;

	}

	.shape1{

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -50px;

	}

	.shape2 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

	}

	.shape3 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

		margin-left: -31px;

	}

	.shape4 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -25px;

		float: left;

		margin-left: -32px;

	}

	.shape5 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -48px;

		margin-left: -32px;

		margin-top: -30px;

	}

	.shape6 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -35px;

	}

	.shape7 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -57px;

	}

}

@media(min-width:992px){

	.form {

		margin-left: 145px;

		width: 220px;

		margin-top: 20px;

	}

	

	.box {

		width: 500px;

		margin: 40px 0;

	}





	.float {

		position: fixed;

		z-index: 2;

	}

	.shape1{

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -50px;

	}

	.shape2 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

	}

	.shape3 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

		margin-left: -31px;

	}

	.shape4 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -25px;

		float: left;

		margin-left: -32px;

	}

	.shape5 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -48px;

		margin-left: -32px;

		margin-top: -30px;

	}

	.shape6 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -35px;

	}

	.shape7 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -57px;

	}

}



@media(min-width:992px) and (max-width:1199px){

	.form {

		margin-left: 145px;

	}

	

	.box {

		width: 500px;

		margin: 50px 0;

	}





	.float {

		position: absolute;

		z-index: 2;

	}

	.shape1{

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -50px;

	}

	.shape2 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

	}

	.shape3 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

		margin-left: -31px;

	}

	.shape4 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -25px;

		float: left;

		margin-left: -32px;

	}

	.shape5 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -48px;

		margin-left: -32px;

		margin-top: -30px;

	}

	.shape6 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -35px;

	}

	.shape7 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -57px;

	}

}

@media(min-width:768px) and (max-width:991px){

	.form {

		margin-left: 145px;

	}

	.box {

		width: 500px;

		margin: 50px 0;

	}





	.float {

		position: absolute;

		z-index: 2;

	}

	.shape1{

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -50px;

	}

	.shape2 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

	}

	.shape3 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -30px;

		float: left;

		margin-left: -31px;

	}

	.shape4 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -25px;

		float: left;

		margin-left: -32px;

	}

	.shape5 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -48px;

		margin-left: -32px;

		margin-top: -30px;

	}

	.shape6 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -35px;

	}

	.shape7 {

		position: relative;

		height: 150px;

		width: 150px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -20px;

		margin-top: -57px;

	}

}



@media(min-width:300px) and (max-width:840px)

{

	.container{

		height: 350px;

	}

	.form {

		

		margin-left: 70px;

		width: 240px;

		position: absolute;

	}

	

	

	.box {

		width: 365px;

		margin: auto;

		position: absolute;

		left: 25px;

		

	}

	

	label{

		font-size: 15px;

	}

	

	input[type="text"], input[type="password"]{

		font-size: 13px;		

	}



	.reg{

		

	}

	.float {

		

	}

	.shape1{

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -60px;

	}

	.shape2 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -20px;

		float: left;

	}

	.shape3 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -24px;

		float: left;

		margin-left: -35px;

	}

	.shape4 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		margin-top: -18px;

		float: left;

		margin-left: -37px;

	}

	.shape5 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -45px;

		margin-left: -32px;

		margin-top: -38px;

	}

	.shape6 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -22px;

		margin-top: -40px;

	}

	.shape7 {

		position: relative;

		height: 120px;

		width: 120px;

		background-color: #28a745;

		border-radius: 80px;

		float: left;

		margin-right: -25px;

		margin-top: -50px;

	}

	

	.footer-copyright{

		

	}

}