@charset "UTF-8";
/* --------------- */
/* MAIN NAVIGATION */
/* --------------- */
@media screen and (max-width: 780px) {
	.js #menu {
		display: none;
	}
	.js .slicknav_menu {
		display: block;
	}
	.container {
		width: 94%;
	}
	.header-top ul {
		height: 80px;
	}
	.rwd-benefits > .container > img {
		display: none
	}
	.rwd-benefits {
		background: #000;
	}
	.rwd-benefits > .container {
		background: url('../images/backgrounds/rwd-bg-small.fw.png') no-repeat center;
	}
	.contact {
		margin: 20px auto;
		width: 98%;
	}
	.contact h1 {
		clear: both;
		margin: 10px auto;
	}
	#contact-form-details, #contact-form-message {
		clear: both;
		width: 100%;

	}
	.caption-gallery {
		margin: 5px auto;
		width: 50%;
	}
	.caption-gallery > .thumb {
		margin: 10px auto;
	}
	.facebook-widget, .twitter-feed {
		display: none;
	}
	.service-box {
		clear: both;
		margin: 20px auto;
	}
	.boxes {
		width: 25%;
	}
	.cbp-qtrotator {
		width: 90%;
	}
	.all-services .one-service {
		width: 22%;
		clear: both;
	}
	.ongoing-services li {
		width: 40%;
		height: 275px;
	}
	.gallery-box {
		float: none;
	}
	.imgHover {
		margin-left: 0;
	}
	#project-info {
		clear: both;
	}
	.cta {
		margin: 25px 0;
		padding: 10px 30px;
		text-transform: capitalize;
		clear: both;
		font-size: 0.8em;
	}
	#webdesign-menu {
		width: 80px;
	}
	#content {
		margin-left: 80px;
	}
	#process-banner {
		display: none;
	}
}

@media screen and (max-width: 30.6em) { 

	.cbp-qtrotator {
		font-size: 70%;
	}
	.cbp-qtrotator img {
		width: 80px;
	}

}
@media screen and (max-width: 300px) {
	.tab-link {
		font-size: 0.8em;
		padding: 12px 10px;
	{
}
@media screen and (max-width: 500px) {
	#webdesign-menu {
		width: 50px
	}
	#content {
		margin-left: 50px;
	}
	#webdesign-menu li a h3 {
		display: none;
	}
}
@media screen and (max-width : 800px) {
	
}

@media screen and (max-width: 420px) {
	.footer-copyright {
		clear: both;
		margin: 5px;
		text-align: center;
	}
	.footer-socials {
		clear: both;
	}
	ul.footer-socials {
		text-align: center;
		padding: 10px 0;
	}
	.all-services .one-service {
	width: 15%;
	}
	.ongoing-services li {
		width: 50%
	}
}



@media screen and (max-width: 640px) {
	/* change logo to portrait for mobiles */
	.header-logo img.logo-landscape {
		display: none;
	}
	.header-logo img.logo-portrait {
		display: block;
		clear: both;
		margin: 10px auto;
	}
	.header-top {
		display: block;
		clear: both;
	}
	.facebook-widget, .twitter-feed, .footer-sitemap, footer h4 {
	 display: none;
	}
	.footer-logo {
		clear: both;
		margin: 10px auto;
	}

}

@media screen and (min-width: 768px) {
	.container {
		width: 750px;
	}
}
@media screen and (min-width: 992px) {
	.container {
		width: 970px;
  }
}

@media screen and (min-width: 800px) and (max-width: 991px) {
	.header-top ul {
		float: none;
	}
	.ongoing-services li {
		width: 20%
	}
}

/* Smartphones (portrait and landscape) ———– */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ———– */
@media only screen
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ———– */
@media only screen
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ———– */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
}

/* iPad 3 */
@media
only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media
only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

/* Desktops and laptops ———– */
@media only screen
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ———– */
@media only screen
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ———– */
@media
only screen
and (min-device-width : 320px)
and (max-device-width : 480px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media
only screen
and (min-device-width : 320px)
and (max-device-width : 480px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

/*
@media (min-width: 768px) {
	.container {
		width: 750px;
  }
}
@media (min-width: 992px) {
	.container {
		width: 970px;
  }
}
*/

/* IPAD PORTRAIT */ 
@media only screen and (min-width: 768px) and (max-width: 995px) 
{ 

} 
/* SAMSUNG PORTRAIT */ 
@media only screen and (min-width: 360px) and (max-width: 700px) 
{ 

} 
/* IPHONE PORTRAIT */ 
@media only screen and (min-width: 320px) and (max-width: 340px) 
{ 

}