/*============== Responsive CSS Document ============== */

/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 979px) {
	
	.GoohleMap{ padding:20px;}
	iframe{ width:100% !important; height:300px !important;}
	.MianWrapper, .Header, .PreHeader, #footer { margin: 0 auto; width: 758px; }

	.HeaderHeading span { font-size:18px !important; }
	div#form-wrapper{ position:relative; margin:auto;}
	
	/*div#right-form{ top:65px; right:5px; width:306px; }*/
	div.comprison-table{ width:auto; }
	.hd-form{ background-size:100% auto;font-size: 22px; height:42px;  }
	#form1, #form2, #form3, #form4{ background-size:100% auto; height:466px; }
	#btn-program{ background-size:100% auto; width:auto; font-size:23px;  }
	#footer{ width:auto !important; padding:5px 5px; }
	.btn-more{ width:280px; background-size:100% auto; }
	.btn-more a{ font-size:35px; }
	
	.FormWrapper { margin: 30px 0 0 20px; }
	
	div#comprison-table{ width:auto;}
	div.left-side-header, div.right-side-header { float: none; margin: 0 auto 10px; }
	div.right-side-header { border-radius: 12px; overflow: hidden; }
	
	.btn-more{ width:280px; background-size:100% auto; }
	.btn-more a{ font-size:35px; }

	#begnieer{ background:none #5C0C19; width:auto; height:auto; padding:10px; }
	#begnieer .content{ float:none; width:auto; }

	#training{ background-size:100% auto; width:auto;}
	#training .content { padding: 0 10px 0 0; width: 500px; }


	/*Sign up CSS*/
	div.step div.school{width: 100%;}
	div#offer-container p.plus{position: static;}

}

/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px){
	
	.GoohleMap{ padding:20px;}
	iframe{ width:100% !important; height:300px !important;}
	.ContentWrapper p.first-child{ padding:0;}
	.MianWrapper, .Header, .PreHeader, #footer{ width:auto;}
	div#form-wrapper{ position:relative; margin:auto; width:333px; top:0px; }
	.Header{ min-height: auto; padding-bottom:30px; }
	.Fight{ position:inherit; top:10px; }
	div#right-form{ position:inherit; float:none; top:20px; height: 460px; }
	
	.FormWrapper { margin:0 auto; padding:30px 0; float:none; }


	div.comprison-table{ width:auto;}
	div.left-side-header, div.right-side-header { float: none; margin: 0 auto 10px; }
	div.right-side-header { border-radius: 12px; overflow: hidden; width: 428px; }
	
		.SystemWrapper{ background:none #3DB04B; min-height:auto; width:auto; border-radius:12px; margin:10px; padding:20px; }
	.SystemDetail{ width:auto; float:none; }
	h1.ResponsiveH3{ display:block; }
	
	.FormContainerWrapper h3{ font-size:50px; }
	
	#begnieer{ background:none #5C0C19; width:auto; height:auto; padding:10px; }
	#begnieer .content{ float:none; width:auto; }
	
	#training{ background:none #B6C7D7;  width:auto; padding:10px; 
				border-radius:8px; height:auto;
			}
	#training .content { padding: 0 10px 0 0; width: auto; float:none; }

	/*Sign Up CSS*/
	div.signup img.Fight{display: none;}
	div.step div.school{width: 100%;}
	div.step div.school div.day{width: 50%; border: none;}
	img#gloves{position: static;}
	div#offer-container p.plus{position: static;}
	img#buy-now{padding-left: 0; padding-top: 20px;}

}



/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 479px) {
	
	.GoohleMap{ padding:20px;}
	iframe{ width:100% !important;}
	.PreHeader img{ padding:0; }
	.MianWrapper{ overflow:hidden; }
	.MianWrapper, .Header, .PreHeader, #footer{ width:auto;}
	.HeaderWrapper{ background:none #37A1D3; min-height:auto; }
	.ContentWrapper p.first-child{ padding:0;}
	.Header{ min-height: auto; padding-bottom:30px; }
	.Fight{ position:relative; top:10px; left:0; text-align:center; width:200px; margin:auto; display:block; }
	div#right-form{ position:inherit; }
	
	.Number{ position:inherit; text-align:center; padding:10px 0 0; }
	.Logo{ padding:30px; }
	.HeaderText{ display:block; margin-bottom:0; }
	.TopGirl{ display:none; }
	div#form-wrapper{ position:relative; margin:auto; width:auto; padding: 1px 0 20px; top:0px; left:0px; text-align:center; }
	div#right-form{ background-size: 100% 100%; width:auto; padding-top:160px; padding-left: 0; height:auto; float:none; left:0; top:20px; }
	div#right-form form{ display:block; left:0; margin:0; top:0; position:inherit;}
	.input-field{ width:auto; }
	.top-right-img{ display:none; }
	div#right-form h1, div#right-form h2{ float:none; margin:auto; text-align:center; }
	.free { margin-left: 12px !important; display:inline-block; float:none; }

	.HeaderHeading span { display: block; font-size: 13px !important;
    line-height: 20px !important; padding-top: 0 !important; }
	.FormMainWrapper{ border-bottom-right-radius:12px; border-bottom-left-radius:12px; }
	.FormWrapper { margin:0 auto; padding:20px; float:none; margin:auto; width:auto;  }
	div.LableWrap, div.InputWrap{ float:none; text-align:left; width:auto; margin:10px 0; }
	div.InputLableWrap{ padding:0; }
	.ImgRightWrap{ display:none;}
	
	#carea p { font-size: 17px; margin-bottom: 20px; }
	div.comprison-table { width: auto; margin:0 20px; }
	div.left-side-header, div.right-side-header { background-size: 100% auto; float: none; margin: 0 auto 10px;
	padding-left: 10px; padding-right: 10px; padding-top: 24px; width: auto; }
	div.right-side-header { border-radius: 12px; overflow: hidden; width: auto	; }
	.KickboxingProgramWrapper{ background:none #28427D; min-height:auto; width:auto; border-radius:12px; margin:10px; padding:20px; }
	div.left-side-header h2 { font-size: 18px; margin-bottom: 24px; top: 0; }
	div.right-side-header h3 { font-size: 13px; margin-bottom: 0; top: -12px; }
	div.table-contentsWrap ul li p.leftside, div.table-contentsRaightWrap ul li p.rightside {
    background-size: 9% auto;padding: 0 5px 10px 30px; width:auto; }
	
	.BenefitsWrap{ border-bottom:1px solid #cacaca; padding-bottom:20px; }
	.BenefitsImgWrap{ float:none; text-align:center; }
	.BenefitsTextWrap{ padding:0; }
	
	.BenefitsTextWrap span{ font-size:20px; text-align:center; }
	.BenefitsTextWrap p{ font-size:14px; text-align:center; }
	
	
	.KickboxingProgramDetail{ width:auto; float:none; }
	h1.ResponsiveH1{ display:block; font-size:12px; }
	
	.GetStartedWrapper{ background:none #C52C2F; min-height:auto; width:auto; border-radius:12px; margin:10px; padding:20px; }
	.GetStartedDetail{ width:auto; float:none; }
	h1.ResponsiveH2{ display:block; }
	
	.FooterLinks{ width:auto; padding:0px 10px;}


	.SystemWrapper{ background:none #3DB04B; min-height:auto; width:auto; border-radius:12px; margin:10px; padding:20px; }
	.SystemDetail{ width:auto; float:none; }
	h1.ResponsiveH2, h1.ResponsiveH3{ display:block; font-size:18px; margin-bottom:15px;  }
	
	.FormContainerWrapper h3{ font-size:36px; }

	.Buton button{ width:220px; height:auto;  }
	.Buton button img{ height:auto;  }
	
	#begnieer{ background:none #5C0C19; width:auto; height:auto; padding:10px; }
	#begnieer .content{ float:none; width:auto; }
	
	#training{ background:none #B6C7D7;  width:auto; padding:10px; 
				border-radius:8px; height:auto;
			}
	#training .content { padding: 0 10px 0 0; width: auto; float:none; }

	.input-field input[type="text"]{width: 166px;}
	div#right-form{ba}
	div#right-form form{padding-right: 0; padding-top: 180px; }
	form input.submit{width: 260px; background-size: 100% auto; margin: 0 auto}
	form p.privacy{margin-top: 0; text-align: left;padding-bottom: 21px;}


	/*Sign Up CSS*/
	div.signup img.Fight{display: none;}
	div#checkout{width: auto;}
	div#checkout strong, div#checkout span{font-size: 21px;}
	.hurry img{display: none;}
	div.step{margin: 25px 15px 85px;padding: 50px 35px;}
	div.step div.school{width: 100%;}
	div.step div.school div.day{width: 50%; border: none;}
	p.advantage{font-size: 18px;}
	img#gloves{position: static;}
	div#offer-container p.plus{font-size: 21px; width: auto;}
	img#badge{width: 100px;}
	div#offer-container p.plus{position: static;}
	img#buy-now{padding-left: 0; padding-top: 20px;}
}