/* -------- MEDIA QUERIES -------- */

@media screen and (max-width: 1720px) {
	/* -------- Global -------- */
	.container{width:100%;padding:0 80px;}
	
	/* -------- Nav -------- */
	.main-logo{left:73px;}
}

@media screen and (max-width: 1580px) {
	/* -------- Contact -------- */
	DIV.left-ctc H2, DIV.right-ctc H2{width:80%;}
	DIV.left-ctc P, DIV.right-ctc P{width:80%;}
	DIV.right-ctc UL{width:80%;}
}

@media screen and (max-width: 1420px) {
	/* -------- Banner -------- */
	SECTION.banner{padding:250px 0 100px 0;}
	SECTION.banner-white{padding:250px 0 75px 0;}
	
	/* -------- Featured -------- */
	SECTION.featured{padding:0 0 160px 0;}
	.featured H2{position:relative;left:auto;top:auto;margin:0 0 50px 0;}
	.featured H2::after{bottom:-20px;}
	.work-container{width:100%;margin:0;padding:0 70px;}
}

@media screen and (max-width: 1330px) {
	/* -------- Intro -------- */
	SECTION.intro, SECTION.intro-black{height:auto;padding:30px 0 40px 0;}
	.intro-img, SECTION.intro-black .intro-img{width:65%;top:-25px;}
	.intro-cnt{width:100%;margin:0 0 30px 0;padding:0 80px;}	
}

@media screen and (max-width: 1180px) {
	/* -------- Banner -------- */
	SECTION.banner H1, SECTION.banner-white H1{font-size:50px;}
	SECTION.banner-white P.work-p{font-size:40px;}
	SECTION.banner-white P.work-p-sml{font-size:32px;}
	
	/* -------- Intro -------- */
	.intro-desc-left{width:65%;}
}

@media screen and (max-width: 980px) {
	/* -------- Intro -------- */
	.intro-desc-left{width:85%;padding:80px 60px 120px 0;}
	.intro H2, .intro-black H2{font-size:46px;}
	.intro H2::after, .intro-black H2::after{bottom:-50px;}
	
	/* -------- Featured -------- */
	SECTION.featured{padding:0 0 140px 0;}
	.featured H2{font-size:46px;}
	.feat-item H3, .work-item H3{top:46%;padding:0 40px;font-size:34px;}
	
	/* -------- About -------- */
	SECTION.about{width:100%;max-width:100%;margin:0;padding:80px 80px 100px 80px;}
	SECTION.about H3{font-size:46px;}
	
	/* -------- Intro About -------- */
	SECTION.intro-about{width:100%;max-width:100%;margin:0;padding:0 80px 100px 80px;}
	SECTION.intro-about H3{font-size:46px;}
	
	/* -------- Pre-contact -------- */
	SECTION.hi{padding:80px 0;}
	SECTION.hi H3{font-size:46px;}
	
	/* -------- Contact -------- */
	SECTION.ctcs{display:block;}
	DIV.left-ctc, DIV.right-ctc{width:100%;float:none;margin:0;padding:80px 80px 100px 80px;}
	DIV.left-ctc H2, DIV.right-ctc H2{font-size:46px;width:100%;margin:0 0 30px 0;padding:0;text-align:center;}
	DIV.left-ctc P, DIV.right-ctc P{font-size:18px;width:100%;margin:0;text-align:center;}
	DIV.right-ctc UL{width:100%;margin:0;text-align:center;}
	DIV.right-ctc UL LI{margin:0 10px;font-size:18px;float:none;display:inline-block;}
}

@media screen and (max-width: 780px) {
	/* -------- Global -------- */
	.container{padding:0 40px;}
	
	/* -------- Menu -------- */
	NAV.menu-links UL{margin:80px 0 0 0;}
	NAV.menu-links UL LI A{font-size:70px;}
	
	/* -------- Nav -------- */
	.main-logo{left:33px;}
	
	/* -------- Banner -------- */
	SECTION.banner H1, SECTION.banner-white H1{font-size:46px;}
	SECTION.banner-white P.work-p{font-size:36px;}
	SECTION.banner-white P.work-p-sml{font-size:28px;}
	
	/* -------- Intro -------- */
	.intro-cnt{padding:0 40px;}
	
	/* -------- Featured -------- */
	SECTION.featured{padding:0 0 120px 0;}
	.work-container{padding:0 40px;}
	.feat-item, .work-item, .work-item-full{width:100%;margin:0 0 40px 0;}
	.feat-item H3, .work-item H3{padding:0 20px;}
	
	/* -------- About -------- */
	SECTION.about{padding:50px 40px 80px 40px;}
	
	/* -------- Intro About -------- */
	SECTION.intro-about{padding:0 40px 100px 40px;}
	
	/* -------- Contact -------- */
	DIV.left-ctc, DIV.right-ctc{padding:80px 40px 100px 40px;}
	
	SECTION.banner-ctc{padding:250px 0 0 0;}
	SECTION.banner-ctc H1{font-size:46px;margin:0 0 80px 0;}
	SECTION.banner-ctc H1::after{height:8px;bottom:-23px;}
	SECTION.banner-ctc UL LI{margin:0 0 25px 0;width:100%;font-size:30px;}
}

@media screen and (max-width: 520px) {
	/* -------- Contact -------- */
	SECTION.banner-ctc{padding:200px 0 0 0;}
	SECTION.banner-ctc H1{font-size:40px;}
	
}

@media screen and (max-width: 480px) {
	/* -------- Menu -------- */
	.menu-nav .menu-close{padding:30px 0 0 0;}
	.menu-nav .menu-close .close{margin:30px 0 0 0;}
	NAV.menu-links UL{margin:70px 0 0 0;}
	NAV.menu-links UL LI A{font-size:60px;}
	
	/* -------- Nav -------- */
	NAV.main, NAV.main-white{padding:30px 0;}
	.main-logo A{width:100px;height:91px;}
	.main-menu{margin:30px 0 0 0;}
	
	/* -------- Banner -------- */
	SECTION.banner{padding:200px 0 100px 0;}
	SECTION.banner-white{padding:200px 0 75px 0;}
	SECTION.banner H1, SECTION.banner-white H1{font-size:42px;margin:0 0 100px 0;}
	SECTION.banner-white P.work-p{font-size:32px;}
	SECTION.banner-white P.work-p-sml{font-size:26px;}
	
	/* -------- Intro -------- */
	.intro-desc-left{width:100%;padding:60px 30px 80px 0;}
	.intro H2, .intro-black H2{font-size:38px;}
	.intro H2::after, .intro-black H2::after{bottom:-45px;height:8px;}
	
	/* -------- Featured -------- */
	SECTION.featured{padding:0 0 100px 0;}
	.featured H2{font-size:38px;}
	.featured H2::after{height:8px;}
	.feat-item H3, .work-item H3{padding:0 10px;font-size:32px;}
	.featured P{width:100%;margin:20px 0 0 0;font-size:14px;}
	
	/* -------- About -------- */
	SECTION.about H3{font-size:38px;}
	SECTION.about P{font-size:16px;}
	
	/* -------- Intro About -------- */
	SECTION.intro-about H3{font-size:38px;}
	SECTION.intro-about P{font-size:16px;}
	
	/* -------- Pre-contact -------- */
	SECTION.hi{padding:60px 0 80px 0;}
	SECTION.hi H3{font-size:42px;}
	
	/* -------- Contact -------- */
	DIV.left-ctc, DIV.right-ctc{padding:60px 40px 80px 40px;}
	DIV.left-ctc H2, DIV.right-ctc H2{font-size:42px;}
	DIV.left-ctc P, DIV.right-ctc P{font-size:16px;}
	DIV.right-ctc P{margin:0 0 20px 0;}
	DIV.right-ctc UL LI{margin:0 0 15px 0;width:100%;}
	
	SECTION.banner-ctc{padding:200px 0 0 0;}
	SECTION.banner-ctc H1{font-size:34px;}
	SECTION.banner-ctc UL LI{font-size:26px;}
}

@media screen and (max-width: 380px) {
	/* -------- Global -------- */
	.container{padding:0 30px;}
	
	/* -------- Menu -------- */
	.menu-nav .menu-close{padding:24px 0 0 0;}
	.menu-nav .menu-close .close{margin:16px 0 0 0;}
	NAV.menu-links UL{margin:30px 0 0 0;}
	NAV.menu-links UL LI A{font-size:46px;}
	
	/* -------- Nav -------- */
	NAV.main, NAV.main-white{padding:24px 0 30px 0;}
	.main-logo{left:25px;}
	.main-logo A{width:80px;height:73px;}
	.main-menu{margin:16px 0 0 0;}
	
	/* -------- Banner -------- */
	SECTION.banner{padding:160px 0 100px 0;}
	SECTION.banner-white{padding:160px 0 45px 0;}
	SECTION.banner H1, SECTION.banner-white H1{font-size:34px;margin:0 0 80px 0;}
	SECTION.banner-white P{margin:0 0 30px 0;}
	SECTION.banner-white P.work-p{font-size:30px;margin:0;}
	SECTION.banner-white P.work-p-sml{font-size:22px;margin:0;}
	
	/* -------- Intro -------- */
	SECTION.intro, SECTION.intro-black{margin:0 0 40px 0;}
	.intro-cnt{padding:0 30px;}
	.intro H2, .intro-black H2{font-size:34px;}
	
	/* -------- Featured -------- */
	SECTION.featured{padding:0 0 80px 0;}
	.featured H2{font-size:34px;}
	.work-container{padding:0 30px;}
	.feat-item, .work-item, .work-item-full{margin:0 0 30px 0;}
	
	/* -------- About -------- */
	SECTION.about{padding:50px 30px 80px 30px;}
	SECTION.about H3{font-size:34px;}
	
	/* -------- Intro About -------- */
	SECTION.intro-about{padding:0 30px 80px 30px;}
	SECTION.intro-about H3{font-size:34px;}
	
	/* -------- Pre-contact -------- */
	SECTION.hi H3{font-size:38px;}
	
	/* -------- Contact -------- */
	DIV.left-ctc, DIV.right-ctc{padding:50px 30px 60px 30px;}
	DIV.left-ctc H2, DIV.right-ctc H2{font-size:38px;}
	
	SECTION.banner-ctc{padding:160px 0 0 0;}
	SECTION.banner-ctc H1{font-size:28px;}
	SECTION.banner-ctc UL LI{font-size:24px;}
}