/*media query for desktop*/
@media all and (max-width: 1500px) {
	.hero-text{
		width: 630px;
	}
	.hero-text span{
		font-size: 3.453rem;
	}
	h1{
		font-size: 6.158rem;
	}
	.btn{
		font-size: 2.168rem;
	}
}
@media all and (max-width: 1200px) {
	.hero-text{
		width: 500px;
	}
	.hero-text span{
		font-size: 2.453rem;
	}
	h1{
		font-size: 5.158rem;
	}
	.btn{
		padding: 20px 30px;
	}	
	.learn {
	    padding: 100px 0 180px;
	}
	.about-us{
		padding: 160px 0 90px;
	}
	.feature{
		padding: 140px 0 150px;
	}
	.method-text {
	    margin-right: 0;
	}
	.learn-method{
		padding: 140px 0 120px;
	}
}
@media all and (max-width: 1023px) {
	.wrapper{
		padding-top: 99px;
	}
	.session a{
		font-size: 2.14rem;
		padding: 4px 10px;
	}
	.session span{
		font-size: 1.2rem;
	}
	.waves a{
		font-size: 3.938rem;
	}
	.icon-wave{
		-webkit-background-size: 168px 168px;
		background-size: 168px 168px;
		width: 69px;
		height: 58px;
		background-position: 0 0;
	}
	h1 {
	    font-size: 4.158rem;
	}
	h2{
		font-size: 3.5rem;
	}
	p{
		font-size: 2.5rem;
	}
	.hero-text{
		width: 375px;
	}
	.hero-text span{
		font-size: 2.2rem;
	}	
	.hero-text h1 {
	    margin-bottom: 30px;
	}
	.btn{
		padding: 15px 25px;
		font-size: 1.8rem;
	}
	.learn {
	    padding: 70px 0 140px;
	}
	.learn-text {
	    padding: 0 10%;
	}
	.quote{
		width: 700px;
		padding: 20px 30px 15px;
	}
	.about-us {
	    padding: 130px 0 65px;
	}
	.general-quote, .footer .general-quote{
		width: 700px;
		padding: 33px 30px 31px;
	}
	.contact-media{
		width: 460px;
        padding: 5px 0 0 0;
	}	
	.lesson{
		width: 260px;
	}
	.lesson span{
		margin: -15px 8px 0px 10px;
	}
	.footer{
		padding: 150px 0 70px;
	}
}
@media all and (max-width: 767px) {
	.hide-mobile{
		display: none !important;
	}
	.show-mobile{
		display: block !important;
	}
	.wrapper {
	    padding-top: 90px;
	}
	.header{
		padding: 18px 16px 14px;
	}
	.session{
		margin-top: 7px;
	}
	.session a{
		font-size: 2rem;
		padding: 6px 9px;
	}
	.waves a {
	    font-size: 3.2rem;
	}
	h1{
		font-size: 3.987rem;
	}
	h2{
		font-size: 3.0rem;
		line-height: 1.2;
		margin-bottom: 21px;
	}
	p{
		font-size: 2.0rem;
		line-height: 1.5;
	}
	.hero-text{
		width: 100%;
		left: 0;
		right: 0;
		top: auto;
		bottom: 7%;
	}
	.hero-text span{
		font-size: 2.176rem;
	}	
	.hero-text h1 {
	    margin-bottom: 20px;
	}
	.hero-text .btn {
	    margin-left: 13px;
	}
	.btn{
		padding: 14px 19px;
		font-size: 1.548rem;
	}
	.learn {
	    padding: 60px 0 146px;
	}
	.learn-text img {
	    margin-right: 50px;
	    width: 159px;
	}
	.learn-text {
	    padding: 0 8px;
	}
	.learn-text figure {
	    margin-bottom: 22px;
	}
	.learn-text p{
		padding: 0 6px;
	}
	.quote{
		width: 90%;
		top: -88px;
		padding: 20px 30px 28px;
	}
	.quote p{
		font-size: 2rem;
		line-height: 1.5;
	}
	.quote span{
		color: rgba(255, 255, 255, 0.5);
	}
	.about-us{
		padding: 152px 0 48px;
	}
	.about-text figure {
	    margin-bottom: 12px;
	}
	.about-text h2 {
	    margin-bottom: 27px;
	}
	.about-text p {
	    line-height: 1.5;
	}
	.about-text {
	    padding: 0 14px;
	}
	.contact-details ul {
	    padding: 0 7px;
	}
	.contact-details li:last-child a{
		font-size: 2.6rem;
	}
	.contact-details li span{
		margin-bottom: 9px;
	}
	.general-quote{
		width: 87%;
		top: -118px;
		padding: 22px 15px 21px;
	}
	.general-quote p, .general-quote span{
		font-size: 2rem;
	}
	.general-quote p{
		line-height: 1.5;
		margin-bottom: 7px;
	}
	.general-quote span{
		color: rgba(0,0,0,0.7);
	}
	.feature{
		padding: 160px 0 158px;
	}
	.feature-text {
	    padding: 0;
	}
	.feature-text h2 {
	    margin-bottom: 24px;
	}
	.feature-text p {
	    line-height: 1.5;
	    padding: 0 9px 0 0px;	
	}
	.learn-method .general-quote{
		width: 88%;
		top: -102px;
		padding: 30px 25px;
	}
	.learn-method .general-quote p{
		margin-bottom: 16px;
	}
	.learn-method .general-quote span{
		margin-left: 15px;
	}
	.learn-method{
		padding: 170px 0 142px;
	}
	.method-text figure img {
	    margin-left: 24px;
	}
	.method-text figure {
	    margin-bottom: 15px;
	}
	.method-text h2{
		margin: 0 0 22px 28px;
	}
	.method-text p{
		padding: 0 17px 0 0;
		margin-bottom: 30px;
	}
	.footer .general-quote{
		width: 90%;
		top: -129px;
		padding: 41px 30px 39px;
	}
	.footer .general-quote span{
		font-size: 2rem;
	}
	.lesson{
		float: none;
		text-align: center;
		width: 100%;
		border-left: none;
		color: rgba(255, 255, 255, 0.6);
		font-size: 4rem;
	}
	.lesson span{
		margin: 0;
	}
	.footer {
	    padding: 172px 0 82px;
	}
	.contact-media{
		width: 100%;
		float: none;
		padding: 20px 0 0 11px;
	}
	.contact-media li {
	    margin-bottom: 19px;
	}
	.contact-media a{
		padding: 5px 9px 9px 19px;
	}
	.phone{
		font-size: 4.185rem;
	}
	.phone i {
	    margin-right: 23px;
	}
	.mail{
		font-size: 2.224rem;
	}
	.mail i{
		margin-right: 19px;
	}
	.skype{
		font-size: 2.303rem;
	}
	.skype i{
		margin-right: 20px;
		margin-top: 0;
	}
	.icon-phone {
	    width: 26px;
	    height: 45px;
	    background-position: -1px -155px;
	}
	.icon-mail {
	    width: 35px;
	    height: 23px;
	    background-position: -37px -155px;	
	}
	.icon-skype {
	    width: 34px;
	    height: 35px;
	    background-position: -87px -155px;	
	}
}
@media all and (max-width: 399px) {
	.wrapper {
	    padding-top: 68px;
	}
	.icon-wave{
		-webkit-background-size: 100px 100px;
		background-size: 100px 100px;
		width: 41px;
		height: 35px;
		background-position: 0 0;
	}
	.session {
	    margin-top: 0;
	}
	.session a{
		font-size: 1.6rem;
	}
	.waves a{
		font-size: 2.5rem;
	}
	.learn-text, .learn-text p {
	    padding: 0;
	}
	.quote{
		padding: 20px 15px 28px;
	}
	.quote p, .quote span, .general-quote p, .general-quote span{
		font-size: 1.6rem;
	}
	.about-text, .feature-text p, .method-text p {
	    padding: 0;
	}
	.contact-details ul {
	    padding: 0;
	}
	.contact-details li:last-child a {
	    font-size: 2.0rem;
	}
	.lesson{
		font-size: 3rem;
	}
	.contact-media{
	  padding: 20px 0 0 0;
	}
	.contact-media a {
	    padding: 14px 9px 6px 15px;
	}
	.phone {
	    font-size: 3.2rem;
	}
	.phone i {
	    margin-right: 15px;
	    margin-top: -5px;
    }
	.mail {
	    font-size: 1.6rem;
	}
	.mail i{
		margin-right: 15px;
	    margin-top: -1px;
	}
	.skype {
	    font-size: 1.7rem;
	}
	.skype i{
		margin-right: 15px;
	    margin-top: -5px;
	}
}