@media screen and (min-width:1280px) {

	#main .layout-section .intro,
	#main .layout-section .outro,
	#main .layout-section .cols-1 .col-1 {width:840px; max-width:100%; margin:0 auto;}

	#main .about-section .col:not(.col-2) {padding-top:100px;}

}

@media screen and (max-width:1279px) {

	h1 > br, h2 > br, h3 > br, h4 > br, h5 > br, h6 > br, p > br, li > br {display:none;}

	h1 {font-size:34px;}
	h1 span {font-size:26px;}
	h2 {font-size:34px;}
	h3 {font-size:26px;}
	.editable-content p.intro-text {font-size:18px;}

	.wrapper {width:940px;}

	#main .layout-section {padding:50px 0 30px 0;}
	#main .layout-section .intro {padding-bottom:30px;}

	#main .about-section .stat .number {font-size:60px;}

	#main .intro-section .calculator {padding:30px;}

	#main .points-section .points-list .point .wrap .details h3 {font-size:20px;}

	#main .process-section .process-list .point .wrap .icon {padding:30px;}
	#main .process-section .process-list .point:not(:last-child) .wrap::after {top:55px; right:-65px; width:80px; height:22.5px;}
	#main .process-section .process-list .point:nth-child(even) .wrap:after {top:95px;}
	#main .process-section .process-list .point .wrap .icon::before {width:30px; height:30px; font-size:16px; line-height:30px;}
	#main .process-section .process-list .point .wrap .details h3 {font-size:20px;}

}

@media screen and (max-width:979px) {

	.wrapper {width:720px;}
	
	#main .intro-section .cols-wrap .col {width:100%;}
	#main .intro-section .cols-wrap .col-1 {margin:0 0 30px 0;}
	#main .intro-section .cols-wrap .col-2 {text-align:center;}
	#main .intro-section .awards .award .wrap img {margin:0 auto;}

	#main .about-section .col {width:50%;}
	#main .about-section .col-1 {width:100%;}
	#main .about-section .col:not(.col-2) {padding-top:0}

	#main .points-section .points-list .point {width:50%;}

	#main .process-section .process-list .point:not(:last-child) .wrap::after {display:none;}

	#main .tv-section .icon-4 {bottom:0;width:100px}

}


@media screen and (max-width:759px) {

	h1, h2, h3 {margin:0 0 20px 0;}

	h1 {font-size:28px;}
	h1 span {font-size:20px;}
	h2 {font-size:28px;}
	h3 {font-size:20px;}

	.wrapper {width:580px;}

	.cols-wrap .col {width:100%!important;}
		
	.button .text {height:30px; padding:0 10px 3px 10px; font-size:16px; line-height:30px;}
	.button .text::after {height:3px;}
	.button:hover,
	.button:active {padding-top:3px;}

	.info-list .wrap h3.title {font-size:16px;}
	
	p.align-button {text-align:center;}

	#main .about-section {text-align:center;}
	#main .about-section h3 {margin:20px 0 10px 0;}
	#main .about-section .stat {margin:0 0 40px 0; font-size:26px;}
	#main .about-section .stat .title-1 {padding:0 0 5px 0;}
	#main .about-section .stat .title-2 {padding:15px 0 5px 0; text-align:center;}
	#main .about-section .stat .text {text-align:center; font-size:16px;}
	#main .about-section .timeline {display:none;}

	#main .process-section .process-list .point {width:100%;}
	
	#main .tv-section .icon-1 {top:480px;}
	#main .tv-section .icon-4 {bottom:270px;}
	
	#main .tv-section .col-2 img {margin:0 auto; width:60%;}

	#main .video-section .video-wrap .image .play {padding:50px 10px 10px 10px;}
	#main .video-section .video-wrap .image .play::before {width:40px; height:40px; border:2px solid #FFF; background-size:20px;}

}


@media screen and (max-width:579px) {

	body {font-size:14px;}

	.wrapper {width:100%;}

	h1 {font-size:24px;}
	h1 span {font-size:20px;}
	h2 {font-size:24px;}
	h3 {font-size:20px;}

	.info-list .wrap h3.title a {padding:10px 40px 10px 10px;}
	.info-list .wrap h3.title a .more {top:10px; width:12px; height:12px;}

	.editable-content .checklist li {min-height:20px; padding:0 0 0 30px; font-size:16px;}
	.editable-content .checklist li:not(:last-child) {margin-bottom:20px;}
	.editable-content .checklist li::before {width:20px; height:20px;}

	#main .layout-section .intro {padding-bottom:20px;}

	#main .about-section .stat .number {font-size:50px;}

	#main .intro-section .cols-wrap .col-1 {margin:0;}
	#main .intro-section .calculator {box-shadow:none;}
	#main .intro-section .calculator .variable {margin:0 0 20px 0;}
	#main .intro-section .calculator .variable .loan {font-size:24px; line-height:30px;}
	#main .intro-section .calculator .variable .input-wrap {padding:0 40px;}
	#main .intro-section .calculator .variable .input-wrap .slider .dragger {width:30px; height:30px;}
	#main .intro-section .calculator .variable .input-wrap .slider .dragger::after {background-size:25px;} 
	#main .intro-section .calculator .variable .input-wrap .slider-controls .amount {width:30px; height:30px; background-size:20px;}
	#main .intro-section .calculator .points {margin:0 0 20px 0;}
	#main .intro-section .calculator .points .point {padding:0 10px; font-size:14px;}
	#main .intro-section .calculator .points .point p {min-height:20px; padding:40px 0 0 0; text-align:center;}
	#main .intro-section .calculator .points .point p::after {top:0; left:50%; width:30px; height:30px; margin-left:-15px;}

	#main .points-section .points-list .point {width:100%; margin:0 0 20px 0;}
	
	#main .tv-section .icon-2 {right:-20px;width:90px;}
	#main .tv-section .icon-1 {left:-10px;top:330px;width:80px;}
	#main .tv-section .icon-4 {right:-10px;bottom:140px;}


}