@media (min-width: 992px) and (max-width: 1199px) {

	.services-box .services-box-icon { width: 60px; height: 60px; font-size: 32px; line-height: 60px; border-radius: 22px; }
	
	.about-us-box-text { padding-right: 0; }
	
}

@media (min-width: 768px) and (max-width: 991px) {
	
	.navbar-expand-md .navbar-nav .nav-link { padding-left: 0.6rem; padding-right: 0.6rem; }
	
	.top-content { padding: 180px 0; }

	.section-description p { padding: 0; }
	
	.services-box .services-box-icon { width: 50px; height: 50px; font-size: 26px; line-height: 50px; border-radius: 18px; }

	.about-us-box { margin-top: 80px; }
	.about-us-box:last-child { margin-top: 50px; }
	.about-us-box-text { padding-right: 0; text-align: center; }
	
	.more-services-box .more-services-box-icon { width: 50px; height: 50px; font-size: 26px; line-height: 50px; border-radius: 18px; }
	
	.portfolio-box h3:hover i { padding-left: 10px; }
	
	.blog-box h3:hover i { padding-left: 10px; }

}

@media (max-width: 767px) {
	
	.navbar.navbar-no-bg { background: #444; }
	.navbar-dark .navbar-toggler { border-color: #444; }
	.navbar-dark .navbar-toggler:focus { background: #333; outline: 0; }
	.navbar-expand-md .navbar-nav .nav-link { padding-top: 0.3rem; padding-bottom: 0.3rem; }

	.top-content { padding: 140px 0; }
	.top-content .top-big-link { margin-top: 25px; }
	.top-content .top-big-link a.btn { margin-top: 10px; }
	
	.section-description p { padding: 0; }
	
	.services-container { padding-bottom: 60px; }
	.services-box { text-align: center; }
	.services-box h3 { margin-top: 20px; padding-top: 10px; }
	
	.about-us-box { margin-top: 80px; }
	.about-us-box:last-child { margin-top: 50px; }
	.about-us-box-text { padding-right: 0; text-align: center; }
	
	.more-services-box { text-align: center; }
	.more-services-box h3 { margin-top: 20px; padding-top: 10px; }
	
	.portfolio-box { text-align: center; }
	.portfolio-box-image { max-width: 540px; margin: 0 auto; }
	
	.blog-box { text-align: center; }
	.blog-box-image { max-width: 540px; margin: 0 auto; }
	.blog-box h3 { margin-top: 30px; }
	
	footer { text-align: center; }
	.footer-right { padding-top: 10px; text-align: center; }
	.footer-bottom { padding-top: 20px; }
	
	/* Web Apps section mobile fixes */
	.webapp-box { margin-bottom: 30px; padding: 20px; }
	.webapp-box h3 { font-size: 20px; }
	.webapp-box ul { font-size: 14px; }
	
	/* Web App buttons mobile fix - more contrast and visibility */
	.webapp-box .btn-link-2 { 
		background: #9b59b6; 
		background: rgba(155, 89, 182, 0.9);
		color: #fff;
		width: 100%;
		max-width: 200px;
		font-size: 14px;
		padding: 0 20px;
		height: 44px;
		line-height: 42px;
	}
	.webapp-box .btn-link-2:hover {
		background: #9b59b6;
		background: rgba(155, 89, 182, 1);
	}
	
	/* Team section mobile fix */
	.blog-box-image img { max-width: 200px; margin: 0 auto; display: block; }
	
	/* Map mobile fix */
	.gmap-wrapper iframe { width: 100% !important; height: 300px !important; }
	
	/* Container padding fix */
	.section-container { padding-left: 15px; padding-right: 15px; }
	
	/* Navigation text wrapping */
	.navbar-nav { text-align: center; }
	.navbar-nav .nav-link { font-size: 14px; }
	
	/* Better button spacing */
	.btn-link-1, .btn-link-2 { margin-bottom: 10px; width: 100%; max-width: 280px; }
	
	/* Form mobile fix */
	.hdcf.boxed { max-width: 100%; min-width: auto; }
	
}

@media (max-width: 415px) {
	
	h1, h2 { font-size: 28px; line-height: 36px; }
	h3 { font-size: 20px; }
	
	/* Very small screens fixes */
	.top-content { padding: 120px 0; }
	.top-content h1 { font-size: 24px; line-height: 32px; }
	
	/* Web apps on very small screens */
	.webapp-box { padding: 15px; }
	.webapp-box h3 { font-size: 18px; }
	.webapp-icon i { font-size: 36px !important; }
	.webapp-box .btn-link-2 {
		max-width: 180px;
		font-size: 13px;
		height: 40px;
		line-height: 38px;
	}
	
	/* Better text wrapping */
	body { font-size: 14px; line-height: 24px; }
	
	/* Form adjustments */
	.hdcf section { margin-bottom: 15px; }
	.hdcf input, .hdcf textarea { font-size: 16px; }
	
	/* iOS Safari form fix - make columns stack */
	.hdcf .col-33,
	.hdcf .col-50,
	.hdcf .col-66,
	.hdcf .col-25,
	.hdcf .col-75 {
		width: 100% !important;
		float: none !important;
		clear: both !important;
		padding-left: 10px !important;
		padding-right: 10px !important;
		display: block !important;
	}
	
	.hdcf .row {
		margin: 0 !important;
	}
	
	.hdcf {
		padding: 15px !important;
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}
	
	.hdcf header {
		margin: -15px -15px 15px !important;
		padding: 10px 15px !important;
		font-size: 18px !important;
	}
	
	.hdcf label {
		height: auto !important;
		overflow: visible !important;
		white-space: normal !important;
		line-height: 1.4 !important;
	}
	
}

/* Extra small devices */
@media (max-width: 320px) {
	h1, h2 { font-size: 24px; }
	.navbar-brand { width: 200px; height: 50px; background-size: contain; }
}

/* Mobile logo fix */
@media (max-width: 767px) {
	.navbar-brand {
		width: 160px;
		height: 50px;
		background-size: contain;
		background-position: center center;
		background-repeat: no-repeat;
		background-color: transparent !important;
		text-indent: -99999px !important;
		overflow: hidden;
		color: transparent !important;
		font-size: 0;
		-webkit-background-size: contain;
		-moz-background-size: contain;
		-o-background-size: contain;
	}
}

/* Landscape orientation for all mobile browsers */
@media (min-width: 768px) and (max-width: 950px) and (orientation: landscape) {
	.navbar-brand {
		width: 160px !important;
		height: 50px !important;
		background-size: contain !important;
		-webkit-background-size: contain !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
	}
	
	/* Fix webapp boxes in landscape */
	.webapp-box {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		padding: 15px !important;
	}
	
	/* Fix buttons in webapp boxes - purple color */
	.webapp-box .btn-link-2 {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		background: #9b59b6 !important;
		background: rgba(155, 89, 182, 0.9) !important;
		color: #fff !important;
	}
}

/* iOS Safari specific fix */
@supports (-webkit-touch-callout: none) {
	@media (max-width: 767px) {
		/* Fix logo cropping */
		.navbar-brand {
			width: 160px !important;
			height: 50px !important;
			background-size: contain !important;
			-webkit-background-size: contain !important;
			background-position: center center !important;
			background-repeat: no-repeat !important;
		}
	}
	
	/* Landscape orientation fix for iPhone */
	@media (min-width: 768px) and (max-width: 900px) and (orientation: landscape) {
		.navbar-brand {
			width: 160px !important;
			height: 50px !important;
			background-size: contain !important;
			-webkit-background-size: contain !important;
			background-position: center center !important;
			background-repeat: no-repeat !important;
		}
		
		/* Fix container overflow in landscape */
		.container {
			max-width: 100% !important;
			padding-left: 15px !important;
			padding-right: 15px !important;
			box-sizing: border-box !important;
		}
	}
	
	@media (max-width: 767px) {
		/* Fix container overflow */
		.container {
			max-width: 100% !important;
			padding-left: 15px !important;
			padding-right: 15px !important;
			box-sizing: border-box !important;
		}
		
		/* Fix webapp boxes */
		.webapp-box {
			width: 100% !important;
			max-width: 100% !important;
			box-sizing: border-box !important;
			padding: 15px !important;
			word-wrap: break-word !important;
			overflow-wrap: break-word !important;
		}
		
		/* Fix buttons in webapp boxes */
		.webapp-box .btn-link-2 {
			width: 100% !important;
			max-width: 100% !important;
			box-sizing: border-box !important;
			margin-left: 0 !important;
			margin-right: 0 !important;
		}
		
		/* Fix form container */
		.hdcf.boxed {
			width: 100% !important;
			max-width: 100% !important;
			box-sizing: border-box !important;
		}
		
		/* Fix all columns */
		.col-md-4, .col-md-6, .col-md-8, .col-md-12,
		.col-sm-4, .col-sm-6, .col-sm-8, .col-sm-12,
		.col-12, .col-6 {
			max-width: 100% !important;
			box-sizing: border-box !important;
		}
	}
}


/* Retina-ize images/icons - Desktop only */

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 768px),
only screen and (   min--moz-device-pixel-ratio: 2) and (min-width: 768px),
only screen and (     -o-min-device-pixel-ratio: 2/1) and (min-width: 768px),
only screen and (        min-device-pixel-ratio: 2) and (min-width: 768px),
only screen and (                min-resolution: 192dpi) and (min-width: 768px),
only screen and (                min-resolution: 2dppx) and (min-width: 768px) {
	
	/* logo - desktop retina only */
    .navbar-brand {
    	background-image: url(../img/logo@2x.png) !important; background-repeat: no-repeat !important; background-size: 136px 39px !important;
    }
	
}