/**
*************************************************
* AUTHOR : NCodeArt
* PROJECT : NC
*************************************************
*/

/**
*****************************************************************
* This file is licensed to NCodeArt.
* it's not allowed to copy or reuse it Copyright NCodeArt 2015
*****************************************************************
*/


/**
*******************************************************************
* DESKTOP LAYOUT 
*******************************************************************
*/

@media (min-width: 1200px) { }
@media (min-width: 1200px) and (max-width: 1280px) {
	
	.content-area .container { width: 90%; }
	.intro-section-1 .text-animation .sub-text { width: 80%; }
	.item-section-1 .features-list .list-1 { width: 48%; }
}
@media (min-width: 992px) and (max-width: 1199px) {
	.intro-section-1 .text-animation .hd-text { font-size: 28px; }
	.intro-section-1 .text-animation .main-text { font-size: 60px; }
	.intro-section-1 .text-animation .sub-text { width: 90%; font-size: 22px; }
}

@media (min-width: 992px) {
	
}

/**
*******************************************************************
* MOBILE & TABLET COMMON
*******************************************************************
*/
@media (min-width: 200px) and (max-width: 991px) {

	/*----------  TYPOGRAPHY  ----------*/
	h1, .hd-1 { font-size: 40px; margin-bottom: 30px; }
	h2, .hd-2 { font-size: 30px; margin-bottom: 20px; }
	h3, .hd-3 { font-size: 20px; margin-bottom: 15px; }
	h4, .hd-4 { font-size: 18px; margin-bottom: 15px; }
	h5, .hd-5 { font-size: 16px; margin-bottom: 15px; }
	h6, .hd-6 { font-size: 14px; margin-bottom: 10px; }

	.item-section { height: auto !important; }
	.intro-section-1 .overlay { z-index: 1; }
	.intro-section-1 .bounce { height: 60px; }

}

/**
*******************************************************************
* TABLET
*******************************************************************
*/
@media (min-width: 768px) and (max-width: 991px) {
	.intro-section-1 .overlay { z-index: 1; }
	.intro-section-1 .bounce { height: 60px; }

	.content-area .container { width: 90%; }
	.intro-section-1 .text-animation .hd-text { font-size: 26px; }
	.intro-section-1 .text-animation .main-text { font-size: 50px; }
	.intro-section-1 .text-animation .sub-text { width: 90%; font-size: 20px; }

	.footer-section-1 .logo{ width: 80px; margin: auto; }
	.footer-section-1 img { height: auto; }
	.footer-section-1 .logo img{ width: 100%; }
	.footer-section-1 .social-links-2 a{
		width: 100px;
		height: 100px;
	}
}

/**
*******************************************************************
* MOBILE
*******************************************************************
*/
@media (min-width: 200px) and (max-width: 767px) {
	.item-section-1 .features-list .list-1 { width: 100%; }
	.item-section { height: auto !important; }
	.intro-section-1 .overlay { z-index: 1; }
	.intro-section-1 .bounce { height: 60px; }
}
@media (min-width: 600px) and (max-width: 767px) {

	.content-area .container { width: 90%; }
	.intro-section-1 .text-animation .hd-text { font-size: 26px; }
	.intro-section-1 .text-animation .main-text { font-size: 50px; }
	.intro-section-1 .text-animation .sub-text { width: 90%; font-size: 20px; }

	.footer-section-1 .logo{ width: 80px; margin: auto; }
	.footer-section-1 img { height: auto; }
	.footer-section-1 .logo img{ width: 100%; }
	.footer-section-1 .social-links-2 a{
		width: 40px;
		height: 40px;
		font-size: 16px;
	}

}
@media (min-width: 480px) and (max-width: 599px) {

	.popup-block { min-width: 100%; width: 100%; }

	.content-area .container { width: 90%; }
	.intro-section-1 .logo { width: 120px; }
	.intro-section-1 .text-animation { margin-bottom: 43px; }
	.intro-section-1 .text-animation .hd-text { font-size: 20px; }
	.intro-section-1 .text-animation .main-text { font-size: 36px; }
	.intro-section-1 .text-animation .sub-text { width: 90%; font-size: 18px; }

	.footer-section-1 .logo{ width: 80px; margin: auto; }
	.footer-section-1 .logo img{ width: 100%; }
	.footer-section-1 .social-links-1 a{
		width: 40px;
		height: 40px;
		font-size: 16px;
	}

	.footer-section-1 .logo{ width: 80px; margin: auto; }
	.footer-section-1 img { height: auto; }
	.footer-section-1 .logo img{ width: 100%; }
	.footer-section-1 .social-links-2 a{
		width: 40px;
		height: 40px;
		font-size: 16px;
	}

}
@media (min-width: 200px) and (max-width: 479px) {

	.popup-block { min-width: 100%; width: 100%; padding: 30px; }

	/*----------  TYPOGRAPHY  ----------*/
	h1, .hd-1 { font-size: 36px; margin-bottom: 30px; }
	h2, .hd-2 { font-size: 26px; margin-bottom: 20px; }
	h3, .hd-3 { font-size: 18px; margin-bottom: 15px; }
	h4, .hd-4 { font-size: 16px; margin-bottom: 15px; }
	h5, .hd-5 { font-size: 14px; margin-bottom: 15px; }
	h6, .hd-6 { font-size: 12px; margin-bottom: 10px; }
	
	.title-wrapper .sub-title { font-size: 16px; }
	.intro-section-1 .logo { width: 100px; }
	.intro-section-1 .text-animation { margin-bottom: 33px; }

	.content-area .container { width: 95%; }
	.intro-section-1 .text-animation .hd-text { font-size: 18px; }
	.intro-section-1 .text-animation .main-text { font-size: 30px; }
	.intro-section-1 .text-animation .sub-text { width: 95%; font-size: 16px; }

	.footer-section-1 .logo{ width: 80px; margin: auto; }
	.footer-section-1 img { height: auto; }
	.footer-section-1 .logo img{ width: 100%; }
	.footer-section-1 .social-links-2 a{
		width: 40px;
		height: 40px;
		font-size: 16px;
	}
	
}