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

@media only screen and (min-width: 768px) and (max-width: 1050px) {
	.ImgBigWrapper{ margin:20px auto; width:auto; }
	}

/*		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) {
	
	iframe{ width:100% !important;}
	.Mainwrapper, .Header, .PreHeader, #footer { margin: 0 auto; width: auto; }
	.FirstPara { padding-top:0px;  }
	.HeaderWrapper{ background-size:100% auto; padding-bottom:0px; min-height:366px; }
	.LetterWrapper{ width:auto; height:auto; background:none; padding:0px 10px; }
	.LetterWrapper > p{ display:block; }
	.LetterWrapper ul{ padding:0; margin:0; }
	.LetterWrapper ul li{padding:0 0 20px 30px;}
	.ImgBigWrapper{ margin:20px auto; width:auto; }
	.FormContainerWrapper{ margin:20px auto 0;}
	div#form-wrapper{ position:relative; margin:auto;}
	
	
	div#right-form{ top:65px; right:0px; width:312px; position:absolute; }
	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 auto; }
	
	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; }

	/*--------------------Signup Css-----------------*/
	div.step div.school div.day{width: 14.8%;}
	div#offer-container p.plus{position: static;}
	img#gloves{position: static; display:block;}
	div#offer-container{margin-bottom: 10px;}
	img#badge{top: -123px;}
	img#buy-now{padding-left: 0;}

}

/*		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){
	
	iframe{ width:100% !important;}
	body{ font-size:16px; }
	.ContentWrapper p.first-child{ padding:0;}
	.Mainwrapper, .Header, .PreHeader, #footer{ width:auto;}
	.FirstPara { padding-top:0px; padding-right: 0; }
	.VideoWrapper{ width:auto; text-align:center; padding:10px;}
	
	.HeaderWrapper{ background-size:100% auto; min-height:auto;  padding-bottom: 240px; }
	.LetterWrapper{ width:auto; height:auto; background:none; padding:0px 10px; }
	.LetterWrapper > p{ display:block; }
	.LetterWrapper ul{ padding:0; margin:0; }
	.LetterWrapper ul li{padding:0 0 20px 30px;}
	.ImgBigWrapper{ margin:20px auto; 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: 230px; margin:auto; right: 0; }
	
	.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; }
	
	.FormContainerWrapper h3{ font-size:50px; }
	
	#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: none #8a2a27;
		border-radius: 12px;
		float: none;
		margin: 0 auto 10px;
		padding-top: 24px;
		width: auto;
	}
	
	div.right-side-header { background:none #58595B; border-radius: 12px; overflow: hidden; width: auto	; }
	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 10px 20px 50px; width:auto; }
	div.table-contentsWrap{ background:none #71A62F; }
	div.table-contentsRaightWrap{ background:none #E4E4E4; }
	p.privacy{padding-bottom: 10px;}



	/*signup Css*/
	div#signup-header img.attention{width: 150px;}
	div#signup-header img.number{width: 250px;}
	div.step-heading h1{font-size: 30px; padding-left: 50px;}
	div.step div.school{width: auto;}
	div.step div.school div.day{width: 48.8%; border: none;}
	/*div.b-none{border-right: none;}*/
	div.step .step-heading{top: -30px; width: 160px;}
	div.step{padding: 50px 30px;}
	div.step2{padding: 100px 30px 50px;}
	img#buy-now{padding-left: 0}
	img#badge{width: 150px;}
	img#gloves{bottom: 170px; right: 5px;}
	div#offer-container p.plus{position: static;}
	img#fighter{display: none;}
	div#offer-container{margin-bottom: 0px;}

}



/*		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) {
	
	iframe{ width:100% !important; }
	body{ font-size:16px; }
	.Number{ display:block; margin:0 auto; padding:10px 0;}
	p, .ExplainWrapper ul li, .HdTechWrapper ul li, .LetterWrapper ul li, .LearnSecretsWrapper ul li, .HdTechWrapper p{ font-size: 16px;}
	.PreHeader img{ padding:0; }
	.Mainwrapper{ overflow:hidden; }
	.VideoWrapper{ width:auto; text-align:center; padding:10px;}
	
	.Mainwrapper, .Header, .PreHeader, #footer{ width:auto;}
	
	.ContentWrapper{ padding:0 5px 20px; }
	.FirstPara { padding-top:0px; padding-right: 0; }
	.HeaderWrapper{ background:none; min-height:auto; }
	.LetterWrapper{ width:auto; height:auto; background:none; padding:0px 10px; }
	.LetterWrapper > p{ display:block; }
	.LetterWrapper ul{ padding:0; margin:0; }
	.LetterWrapper ul li{padding:0 0 20px 30px;}
	.ImgBigWrapper{ margin:20px auto; width:auto; }
	
	.LearnSecretsWrapper{ margin-bottom:10px; }
	div#right-form{ position:inherit; }
	
	div#form-wrapper{ position:relative; margin:auto; width:auto; padding: 1px 0 20px; top:0px; left:0px; text-align:center; }
	div#right-form{ width:auto;height:auto; float:none; left:0; top:20px; }
	div#right-form form{ display:block; left:0; padding:205px 0 10px; 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 2px ; 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; }
	
	div.left-side-header, div.right-side-header {
		background: none #8a2a27;
		border-radius: 12px;
		float: none;
		margin: 0 auto 10px;
		padding-top: 24px;
		width: auto;
	}
	
	div.right-side-header { background:none #58595B; border-radius: 12px; overflow: hidden; width: auto	; }
	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; }
	div.table-contentsWrap{ background:none #71A62F; }
	div.table-contentsRaightWrap{ background:none #E4E4E4; }
	
	.FormContainerWrapper h3{ font-size:36px; }

	.Buton button{ width:220px; height:auto;  }
	.Buton button img{ height:auto;  }
	.FormContainerWrapper{ margin:20px auto; }
	
	.HdTechWrapper{ padding:20px; }
	.HdTechWrapper > img { float: none; padding: 0 0 20px; }
	#footer{ padding:0 10px; }
	.input-field input[type="text"]{width: 185px;}
	form input.submit{
	background-size: 100% 100%;
    width: 200px;
    height: 50px;
    padding: 20px 0;
    margin-left: 18%;
	}
	p.privacy{padding-bottom: 10px;}
	div#right-form{background-size: 100%;}


	/*signup Css*/
	div#signup-header img.attention{width: 100px;}
	div#signup-header img.number{width: 170px; top: 27px;}
	div.step-heading h1{font-size: 23px; padding-left: 0px;}
	div.step div.school{width: auto;}
	div.step div.school div.day{width: 48.8%; border: none;}
	/*div.b-none{border-right: none;}*/
	div.step .step-heading{top: -30px; width: 160px;}
	div.step{padding: 50px 30px; margin: 25px 15px 80px;}
	img#buy-now{padding-left: 0}
	div#offer-container{margin-bottom: 0}
	img#badge{width: 110px; top: -60px;}
	img#gloves{bottom: 142px; right: 5px;}
	div#offer-container p.plus{position: static;}
	img#fighter{display: none;}
	p.advantage{font-size: 21px;}
}