/****************************************/
/*                 Nav                  */
/****************************************/	
@media only screen and (max-width: 1200px) {
	#mainNav { display: none; }	
	#trigger-overlay { display: block }
}

/****************************************/
/*                 Hero                 */
/****************************************/		
@media only screen and (max-width: 1200px) {
	img.hero { display: none; }
	img.heroMedium { display: block; }
}

@media only screen and (max-width: 1024px)  {
	.hero video { display: none; }
}

@media only screen and (max-width: 770px) {
	div.hero { height: 400px; }
	img.heroMedium { display: none; }
	img.heroSmall { display: block; }
	.heroText { margin-top: 200px; }
	h1.heroTitle { font-size: 35px; font-size: 3.5rem; line-height: 40px; line-height: 4rem; margin-bottom: 15px; }
	.heroText hr { width: 125px;}
	p.heroDesc { font-size: 14px; font-size: 1.4rem; }
}

@media only screen and (max-width: 500px) {
	a.logo-codesigned { display: none; }
	a.logo-codesigned-donut { display: block; }

	a.logo-codesigned-donut { left: 12%; }
	.heroText { width: 100%; margin-left: 22%; }
	h1.heroTitle { font-size: 28px; font-size: 2.8rem; line-height: 33px; line-height: 3.3rem; margin-bottom: 15px; }
}

/****************************************/
/*           Small Banners              */
/****************************************/
@media only screen and (max-width: 1400px) {
	img.banner { margin-left: -250px; }
}	

@media only screen and (max-width: 1200px) {
	img.banner { margin-left: -500px }
}	

@media only screen and (max-width: 1024px) {
	img.banner { margin-left: -700px; }
}	

@media only screen and (max-width: 420px) {
	img.banner { display: none; }	
	img.bannerSmall { display: block; }	
}

/****************************************/
/*               Footer                 */
/****************************************/	
@media only screen and (max-width: 1200px) {
	.footerInfo p, .footerInfo a { font-size: 1.2rem; }
	.icon-social { width: 25px; height: 25px; margin-right: 15px; margin-top: 62px; }
	.footerSocial a:nth-child(3) { margin-right: 15px; }
	.btn-contact { padding-left: 40px; }
	.icon-contact { width: 40px; height: 30px; }
}

@media only screen and (max-width: 1024px) {
	footer { height: 75px; }
	.footerLeft { margin: 0 0 0 25px; }
	.logo-partner { display: none; }
	.footerInfo { margin: 0; margin-top: 28px; bottom: 0; }
	.footerInfo p, .footerInfo a { font-size: 12px; font-size: 1.2rem; }
	.footerRight { margin: 0 30px 0 0; }
	.footerSocial { margin-top: -8px; }
	.icon-social { margin-top: 0; }
	.btn-contact { margin-top: 30px; padding-left: 20px }
}

@media only screen and (max-width: 770px) {
	.footerInfo a[href^="mailto"] { display: none; }
	.footerInfo p:nth-of-type(2) { display: none; }
}

@media only screen and (max-width: 500px) {
	.footerInfo { display: none; }
	.icon-phone { display: inline-block; }
}

/****************************************/
/*                404                   */
/****************************************/
@media only screen and (max-width: 1024px) {
	.fourText { width: 350px; margin-left: -175px; }
	.four h2 { font-size: 34px; font-size: 3.4rem; }
	.four p { font-size: 18px; font-size: 1.8rem; }
}

@media only screen and (max-width: 900px) {
	.four h2 { font-size: 30px; font-size: 3rem; }
	.four p { font-size: 14px; font-size: 1.4rem; }
	.fourButton div { width: 125px; height: 45px; font-size: 14px; font-size: 1.4rem; line-height: 45px; }
	.fourButton div:hover { line-height: 42px; }
}

@media only screen and (max-width: 500px) {
	.four h2 { font-size: 26px; font-size: 2.6rem; }
	.four p { font-size: 12px; font-size: 1.2rem; }
}


/****************************************/
/*                 Home                 */
/****************************************/	
@media only screen and (max-width: 1400px) {
	.homeAboutText.column.half { width: 40%; }
	.homeAboutText { padding: 200px 75px 0 75px; }
}

@media only screen and (max-width: 1300px) {
	.clientLogos img:nth-child(2) { margin-left: 19%; }
	.clientLogos img:nth-child(3) { margin-left: 19%; }
}

@media only screen and (max-width: 1200px) {
	.icon-intro { width: 80px; height: 80px; }
	p.introDesc { font-size: 16px; font-size: 1.6rem; line-height: 22px; line-height: 2.2rem; }
	
	.homeAbout { margin-left: -175px; }
	.homeAboutText.column.half { width: 35%; }
	.homeAboutText { padding: 200px 50px 0 0; }
	
	.homeClients { height: 150px; }
	.clientLogos { line-height: 150px; }
	.homeClients .inner-container { width: 80%; }
	.clientLogos { margin-left: 10%; }
	.logo-clients { width: 18%; }

}

@media only screen and (max-width: 1024px) {
	.homeIntro .inner-container { width: 80%; }
	
	.homeAbout { margin-left: 0; background-image: none !important; background: #fff; }
	.homeAboutText.column.half { width: 50%; margin: 0 auto;}
	.homeAboutText { padding: 0; padding-top: 225px; float: none; max-width: 100%; }
	h2.homeAboutTitle { font-size: 30px; font-size: 3rem; }
	p.homeAboutDesc { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }
	a.aboutLink { font-size: 14px; font-size: 1.4rem; }
	
	.clientLogos { margin-left: 4%; }
	.logo-clients { width: 19%; } 
}

@media only screen and (max-width: 900px) {
	.homeBlog .inner-container { width: 80%; }
	.homeBlogText { max-width: 80%; }
}

@media only screen and (max-width: 770px) {
	a.logo-codesigned { width: 18%; min-width: 200px;}
	
	h3.introTitle { font-size: 24px; font-size: 2.4rem; line-height: 36px; line-height: 3.6rem; padding: 90px 0 90px 0; }
	
	.homeAbout { height: 400px; }
	.homeAboutText.column.half { width: 78%; }
	.homeAboutText { padding-top: 75px; }
	
	.clientLogos .logo-wellstar, .clientLogos .logo-mckenna { margin-left: 10%; }
	.logo-clients { width: 25%; }
	
	.homeProduct { margin-left: -250px; }
	.homeProductLink { margin-left: 61%; }
}

@media only screen and (max-width: 700px) {
	.homeIntro { height: 650px; }
	h3.introTitle { padding: 50px 0 60px 0; }
	.homeIntro .column.fourth { width: 50%; }
	.icon-intro { margin-top: 25px;}
	p.introDesc { margin-bottom: 35px; }
		
	.homeClients .inner-container { width: 100%; }
		
	h3.homeBlogTitle { font-size: 20px; font-size: 2rem; line-height: 28px; line-height: 2.8rem; }
	h4.homeBlogSub { font-size: 16px; font-size: 1.6rem; line-height: 28px; line-height: 2.8rem; }
	.homeBlogDate { font-size: 12px; font-size: 1.2rem; line-height: 18px; line-height: 1.8rem; }
	p.homeBlogDesc { font-size: 14px; font-size: 1.4rem; line-height: 28px; line-height: 2.8rem; }
	.homeBlog a { font-size: 12px; font-size: 1.2rem;}
}

@media only screen and (max-width: 500px) {
	.homeIntro { height: 700px; }
	
	p.introDesc { font-size: 12px; font-size: 1.2rem; }
	
	.homeAboutText.column.half { width: 90%; }
	.homeAboutText { padding-top: 35px; }

	.homeBlog .inner-container { width: 90%; }
	.homeBlogText { padding: 150px 0 150px 0; }
}

/****************************************/
/*              About                   */
/****************************************/

@media only screen and (max-width: 1250px) {
	.team.column.fourth:nth-of-type(4n+1) { clear:none;}
	.team.column.fourth:nth-of-type(3n+1) {margin:0; clear:left;}
	.team.column.fourth { width:32.95%; }
	.leadership .inner-container,.aboutStory .inner-container { width:80%; }
}

@media only screen and (max-width: 900px) {
	.leadership .inner-container,.aboutStory .inner-container { width:80%; }
	.team .inner-container { width: 80%; }
	.employeeBio { display: none; }
}

@media only screen and (max-width: 950px) {
	.aboutStory .inner-container { width:80%; }
	.aboutTitle p { font-size: 14px; font-size: 1.4rem; }
}


@media only screen and (max-width: 700px) {
	.team.column.fourth:nth-of-type(3n+1) { clear:none;}
	.team.column.fourth:nth-of-type(2n+1) {margin:0; clear:left;}
	.team.column.fourth { width:50%; }
	.team.inner-container { width:85%; }
}

@media only screen and (max-width: 550px) {
	.leadership.column.half { width:100%; float:none; }
	.aboutStory .inner-container { width:95%; }
	.aboutTitle p { font-size:14px; font-size:1.4rem; }
	#aboutLink p { font-size: 13px; font-size: 1.3rem; margin: 35px 20px 0 0; }

}


@media only screen and (max-width: 500px) {
	p.teamTitle {font-size:10px; font-size:1.0rem; margin: 0;}
	.team.inner-container { width:85%; }
}

/****************************************/
/*              Services                */
/****************************************/	

@media only screen and (max-width: 1600px) {
	.servicesDesign .inner-container { width: 90%; }
	.processImage { background-position: 95%; }
}

@media only screen and (max-width: 1500px) {
	div.hostingText { padding: 150px 0 150px 0; max-width: 85%;}
	
	.servicesHosting .inner-container { width: 75%; }
}

@media only screen and (max-width: 1300px){
	p.servicesDesc { font-size: 16px; font-size: 1.6rem; margin-left: 15px; }
	
	.servicesDesign hr { height: 300px; }
	
	div.developmentText { margin-top: 40%; }
	div.processText { margin-top: 40%; }
	div.nintexText { margin-top: 40%; }
}

@media only screen and (max-width: 1200px) {
	.servicesOverview { margin-left: 10%;}
	
	.servicesDesign hr { }
	
	.hostingIcon { width: 12%; }
}

@media only screen and (max-width: 1024px) {
	.servicesOverview { margin-left: 10%;}
	
	.servicesTitle hr { width: 300px; }
	
	.servicesDesign { height: 1400px; }
	h2.designWireframes, h2.designWeb { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.designWireframes, p.designWeb { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
	
	.servicesDevelopment { height: 700px; }
	h2.developmentText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.developmentText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
	.developmentLink { margin-top: 275px; }
		
	.servicesHosting .inner-container { width: 80%; }
	div.hostingText { padding: 100px 0 100px 0; }
	h2.hostingText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.hostingText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }
	.hostingLink { font-size: 14px; font-size: 1.4rem; }
	.hostingOptions a:nth-child(2), .hostingOptions a:nth-child(3) { margin-left: 8%; }	
	
	.servicesProcess { height: 700px; }
	h2.processText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.processText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
	.processLink { margin-top: 275px; }
	
	.servicesNintex { height: 700px; }
	h2.nintexText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.nintexText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
	.nintexLink { margin-top: 275px; }	

}

@media only screen and (max-width: 900px) {
	div.servicesTitle { margin-top: 75px; }
	.servicesOverview { text-align: center; margin-top: 80px; margin-left: 0; }
	.servicesOverview div { margin-bottom: 20px; }
	img.icon-services { display: block; float: none; clear: none; margin: 0 auto; }
	p.servicesDesc { font-size: 14px; font-size: 1.4rem; margin-left: 0; display: block; }
	
	.servicesDesign hr { height: 270px; }
	
	.developmentDesc.column.half{ width: 100%; }
	.developmentImage { display: none; }
	div.developmentText { margin-top: 25%; }
	div.developmentText a { display: block; }
	
	div.hostingText { max-width: 100%; }
	
	.processDesc.column.half{ width: 100%; }
	.processImage { display: none; }
	div.processText { margin-top: 25%; }
	.processText a { display: block; }
	
	.nintexDesc.column.half{ width: 100%; }
	.nintexImage { display: none; }
	div.nintexText { margin-top: 25%; }
	.nintexText a { display: block; }

}

@media only screen and (max-width: 770px) {
	.servicesDesign { height: 950px; }
	.designText { margin: 50px 0 50px 0; }
	.designWireframes.column.half, .designWeb.column.half { width: 100%; }
	div.designWireframes, div.designWeb { max-width: 100%; float: none; margin: 0 auto; }
	div.designWireframes { margin-bottom: 50px; }
	.servicesDesign hr { display: none !important; }
	.twentytwenty-wrapper { top: 50px;}
	
	div.developmentText { width: 75%; margin-top: 31%; }
	
	.hostingIcon { width: 14%; }	
	a.logo-hosting img { max-width: 300px; margin: 0 auto; margin-top: 7%; display: block; }
	
	div.processText { width: 75%; margin-top: 31%; }
	
	div.nintexText { width: 75%; margin-top: 31%; }
}

@media only screen and (max-width: 500px) {
	.servicesTitle hr { width: 200px; }

	h1.servicesTitle { font-size: 28px; font-size: 2.8rem; line-height: 36px; line-height: 3.6rem; }
	p.servicesDesc { font-size: 12px; font-size: 1.2rem; }
	
	div.developmentText { margin-top: 41%; }
	
	.hostingIcon { width: 16%; }
	a.logo-hosting img { margin-top: 5%; }
	
	div.processText { margin-top: 41%; }
	
	div.nintexText { margin-top: 41%; }
}

/****************************************/
/*                 Work                 */
/****************************************/
@media only screen and (max-width: 1300px){
	#workClients .inner-container, #workVideos .inner-container { width: 75%; }
}

@media only screen and (max-width: 1100px){
	.workIntro .inner-container { width: 90%; }
	div.workIntroText { padding: 125px 0 50px; }
	h2.workIntroText { font-size: 32px; font-size: 3.2rem; line-height: 32px; line-height: 3.2rem; }
	p.workIntroText { font-size: 22px; font-size: 2.2rem; line-height: 26px; line-height: 2.6rem; }

}

@media only screen and (max-width: 1024px) {
	#workVideos { margin: 100px 0 100px 0; }
	.videoContainer { margin-bottom: 50px; }
	h2.videoInfo { font-size: 34px; font-size: 3.4rem; line-height: 38px; line-height: 3.8rem; }
	p.videoInfo { font-size: 16px; font-size: 1.6rem; line-height: 28px; line-height: 2.8rem; }
	.clients { margin: 50px 0 75px 0 }
	h3.clientName{ font-size: 16px; font-size: 1.6rem; }
	p.clientDesc { font-size: 14px; font-size: 1.4rem; }
}

@media only screen and (max-width: 900px) {
	.videoContainer { max-width: 100%; }
	div.videoInfo { max-width: 100%; }
}

@media only screen and (max-width: 770px) {
	div.workIntroText { padding: 100px 0 30px; }
	p.workIntroText { font-size: 18px; font-size: 1.8rem; line-height: 22px; line-height: 2.2rem; }
}

@media only screen and (max-width: 780px) {
	#workVideos { margin: 75px 0 50px 0; }
	#workClients hr { margin-bottom: 50px; }
	.clients { margin: 0 0 25px 0; }
	img.logo-clients { padding-right: 3%;}
	h3.clientName, 	p.clientDesc { display: none; }
}

@media only screen and (max-width: 600px) {
	#workClients .inner-container, #workVideos .inner-container { width: 90%; }
	#workVideos { margin: 50px 0 50px 0; }
}

@media only screen and (max-width: 500px) {
	h2.workIntroText { font-size: 26px; font-size: 2.6rem; line-height: 30px; line-height: 3rem; margin-bottom: 10px; }
	p.workIntroText { font-size: 16px; font-size: 1.6rem; line-height: 18px; line-height: 1.8rem; }

	#workClients hr { margin-bottom: 25px; }
	.clients { margin: 0 0 5px 0; }
}

/****************************************/
/*              Products                */
/****************************************/	
@media only screen and (max-width: 1024px) {
	.listCollabLogo { margin-top: 180px; }
	.listCollab img { width: 200px; height: 200px; }
	.listCollab h2 { font-size: 34px; font-size: 3.4rem; margin-top: 15px; }
	.listCollab hr { margin-top: -172px }


	.listHostingLogo { margin-top: 180px; }
	.listHostingLogo img { width: 200px; height: 200px; }
	.listHostingLogo h2 { font-size: 34px; font-size: 3.4rem; margin-top: 15px; }
	.listHostingLogo hr { margin-top: -172px }
	
	.listSeperator { left: 48%; }
}

@media only screen and (max-width: 900px) {
	.productList { height: 400px; }


	.listCollab.column.half { width: 100%; }
	.listCollabLogo { margin-top: 75px; }
	.listCollab hr { display: none; }
	
	.listHosting.column.half { width: 100%; }
	.listHostingLogo { margin-top: 75px; }
	.listHosting hr { display: none; }
	
	.listSeperator { top: 1022px; }	
}

@media only screen and (max-width: 770px) {
	.listSeperator { top: 772px; left: 46%; }	
}

@media only screen and (max-width: 600px) {
	.listCollabLogo { margin-top: 115px; }
	.listCollab img { width: 150px; height: 150px; }
	.listCollab h2 { font-size: 30px; font-size: 3rem; margin-top: 10px; }

	.listHostingLogo { margin-top: 115px; }
	.listHostingLogo img { width: 150px; height: 150px; }
	.listHostingLogo h2 { font-size: 30px; font-size: 3rem; margin-top: 10px; }

	.listSeperator { left: 43.5%; }	
}

/****************************************/
/*            Collaboration             */
/****************************************/
@media only screen and (max-width: 1600px){
	.productText.column.third { width: 40%; }
	div.productText { padding: 450px 0 300px 0; } 
	.productImage img { top: 50%; }
	
	.collabSlider .inner-container { margin-left: 6%; }
	.collabSlide img { width: 40%; }
	.sliderText { margin-top: 0; }
	.collabSlide h2 { font-size: 32px; font-size: 3.2rem; }
	.collabSlide p { font-size: 16px; font-size: 1.6rem; }
}

@media only screen and (max-width: 1500px){
	.collabProduct .inner-container { width: 80%; }
	h2.productText { font-size: 34px; font-size: 3.4rem; }
	p.productText { font-size: 16px; font-size: 1.6rem; }
	
	.collabLaptop img { width: 69%; top: 31%; left: 16%; }
}

@media only screen and (max-width: 1400px){
	h2.productText { font-size: 34px; font-size: 3.4rem; }
	p.productText { font-size: 16px; font-size: 1.6rem; }
	.productImage img { width: 86%; top: 46%; left: 34%; }
}

@media only screen and (max-width: 1320px){	
	.collabProduct .inner-container { width: 90%; }
	
	.collabSlide img { width: 45%; }
	.collabSlide h2 { font-size: 28px; font-size: 2.8rem; }
	.collabSlide p { font-size: 14px; font-size: 1.4rem; }
	
	.collabContact .inner-container { width: 90%; }
	h2.contactText { font-size: 32px; font-size: 3.2rem; line-height: 32px; line-height: 3.2rem; }
	p.contactText { font-size: 22px; font-size: 2.2rem; line-height: 28px; line-height: 2.8rem; }
	.contactButtons div { width: 175px; height: 50px; font-size: 16px; font-size: 1.6rem; line-height: 50px; }
	.contactButtons div:hover { line-height: 47px; }
}


@media only screen and (max-width: 1200px){
	.introButtons { padding-bottom: 250px; }
	
	.collabLaptop img { width: 70%; top: 31%; left: 15%; }
	
	.productText.column.third { width: 45%; }
	.productImage img { top: 46%; }
	
	.collabSlide { padding-left: 8%; }
}
	
@media only screen and (max-width: 1100px){
	.collabIntro .inner-container { width: 90%; }
	div.introText { padding: 125px 0 50px; }
	h2.introText { font-size: 30px; font-size: 3rem; line-height: 32px; line-height: 3.2rem; }
	p.introText { font-size: 20px; font-size: 2rem; line-height: 26px; line-height: 2.6rem; }
	div.introText h2 + p { font-size: 22px; font-size: 2.2rem; }
	
	.collabLaptop img { width: 70%; top: 30%; left: 15%; }
	
	div.productText { padding: 450px 0 300px 0;}
	.productImage img { top: 47%; }
		
	.collabSlide { padding-left: 5%; }
}

@media only screen and (max-width: 1024px){
	.productImage img { width: 88%; top: 50%; left: 40%; }
	div.productText { padding: 400px 0 300px 0;}
	
	.collabLaptop img { width: 70%; top: 31%; left: 15%; }
	
	.collabSlide img { display: none; }
	.sliderText {  margin-left: 9%; width: 80%; }
	
	.collabLink { height: 75px; }
	.collabLink p { font-size: 14px; font-size: 1.4rem; margin: 25px 25px 0 0; }
}

@media only screen and (max-width: 900px) {
	.collabLaptop img { width: 78%; top: 31%; left: 12%; }
	
	.collabProduct .inner-container { width: 80%; }
	.productText.column.third { width: 100%; }
	div.productText { padding: 250px 0 500px 0; }
	.productImage img { width: 88%; top: 52%; left: 6%; }
	
	#collabSlides { width: 88%; }
	.sliderText {  margin-left: 7%; width: 80%; }
}

@media only screen and (max-width: 770px) {
	div.introText { padding: 100px 0 30px; }
	p.introText { font-size: 16px; font-size: 1.6rem; line-height: 22px; line-height: 2.2rem; }
	div.introText h2 + p { font-size: 20px; font-size: 2rem; }
	.introButtons { padding-bottom: 250px; }
	.introButtons div { width: 150px; height: 45px; font-size: 14px; font-size: 1.4rem; line-height: 45px; }
	.introButtons div:hover { line-height: 41px; }
	
	.collabLaptop img { width: 78%; top: 33%; left: 11%; }
	
	div.productText { padding: 150px 0 350px 0; }
	.productImage img { width: 66%; top: 61%; left: 15%; }
	
	.collabSlider { display: none; }
	
	div.contactText { padding-top: 90px; }
	h2.contactText { font-size: 30px; font-size: 3rem; }
	p.contactText { font-size: 20px; font-size: 2rem; line-height: 26px; line-height: 2.6rem; }
	.contactButtons { padding-bottom: 80px; }

}

@media only screen and (max-width: 600px) {
	.collabLaptop img { top: 34%; }
	.productImage img { width: 75%; top: 62%; }
}

@media only screen and (max-width: 500px) {
	.introButtons { padding-bottom: 150px; }
	.introButtons div { width: 140px; height: 45px; font-size: 14px; font-size: 1.4rem; line-height: 45px; }
	
	.collabLaptop img { width: 82%; top: 37%; left: 8%; }
	
	div.productText { padding: 200px 0 100px 0; }
	.productImage img { display: none; }
}


/****************************************/
/*               Hosting                */
/****************************************/
@media only screen and (max-width: 1600px){
	.premisesImage img { margin-top: 17%; }
	div.cloudText { margin-top: 30%; }
	.cloudImage img { margin-top: 37%; }
	div.hybridText { margin-top: 40%; }
	.hybridImage img { margin-top: 29%; }
}

@media only screen and (max-width: 1300px){
	.premisesImage img { margin-top: 26%; }
	div.premisesText { margin-top: 40%; }
	.cloudImage img { margin-top: 48%; }
	div.cloudText { margin-top: 40%; }
	.hybridImage img { margin-top: 35%; }
	div.hybridText { margin-top: 47%; }
}


@media only screen and (max-width: 1200px){
	.premisesImage img { margin-top: 26%; width: 85%; }
	div.premisesText { margin-top: 40%; }
	.cloudImage img { margin-top: 50%; }
	div.cloudText { margin-top: 33%; }
	.hybridImage img { margin-top: 44%; }
	div.hybridText { margin-top: 50%; }
}


@media only screen and (max-width: 1100px){
	.hostingIntro .inner-container { width: 90%; }
	div.hostingIntroText { padding: 125px 0 50px; }
	h2.hostingIntroText { font-size: 30px; font-size: 3rem; line-height: 32px; line-height: 3.2rem; }
	p.hostingIntroText { font-size: 20px; font-size: 2rem; line-height: 26px; line-height: 2.6rem; }
	div.hostingIntroText h2 + p { font-size: 22px; font-size: 2.2rem; }
	
	.premisesImage img { margin-top: 26%; width: 85%; }
	div.premisesText { margin-top: 40%; }
	.cloudImage img { margin-top: 48%; }
	div.cloudText { margin-top: 35%; }
	.hybridImage img { margin-top: 44%; }
	div.hybridText { margin-top: 51%; }

}

@media only screen and (max-width: 1024px){	
	.hostingContact .inner-container { width: 90%; }
	h2.hostingContactText { font-size: 32px; font-size: 3.2rem; line-height: 32px; line-height: 3.2rem; }
	p.hostingContactText { font-size: 22px; font-size: 2.2rem; line-height: 28px; line-height: 2.8rem; }
	.hostingContacttButtons div { width: 175px; height: 50px; font-size: 16px; font-size: 1.6rem; line-height: 50px; }
	.hostingContactButtons div:hover { line-height: 47px; }
	
	.premisesImage img { margin-top: 25%; width: 85%; }
	div.premisesText { margin-top: 37%; }
	.cloudImage img { margin-top: 49%; }
	div.cloudText { margin-top: 30%; }
	.hybridImage img { margin-top: 44%; }
	div.hybridText { margin-top: 52%; }

	
	.hostingPremises { height: 700px; }
	h2.premisesText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.premisesText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
		
	.hostingCloud { height: 700px; }
	h2.cloudText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.cloudText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
	
	.hostingHybrid { height: 700px; }
	h2.hybridText { font-size: 30px; font-size: 3rem; line-height: 34px; line-height: 3.4rem; }
	p.hybridText { font-size: 14px; font-size: 1.4rem; line-height: 26px; line-height: 2.6rem; }	
}

@media only screen and (max-width: 1024px){	
	.hostingLink { height: 75px; }
	.hostingLink p { font-size: 14px; font-size: 1.4rem; margin: 25px 25px 0 0; }
}

@media only screen and (max-width: 900px) {
	.hostingPremises { height: 600px; }
	.premisesDesc.column.half{ width: 100%; }
	.premisesImage { display: none; }
	div.premisesText { margin-top: 25%; }
	
	.hostingCloud { height: 600px; }
	.cloudDesc.column.half{ width: 100%; }
	.cloudImage { display: none; }
	div.cloudText { margin-top: 22%; }
	
	.hostingHybrid { height: 600px; }
	.hybridDesc.column.half{ width: 100%; }
	.hybridImage { display: none; }
	div.hybridText { margin-top: 28%; }

}

@media only screen and (max-width: 770px) {
	div.hostingIntroText { padding: 100px 0 30px; }
	p.hostingIntroText { font-size: 16px; font-size: 1.6rem; line-height: 22px; line-height: 2.2rem; }
	div.hostingIntroText h2 + p { font-size: 20px; font-size: 2rem; }
	.hostingIntroButtons { padding-bottom: 100px; }
	.hostingIntroButtons div { width: 150px; height: 45px; font-size: 14px; font-size: 1.4rem; line-height: 45px; }
	.hostingIntroButtons div:hover { line-height: 41px; }
		
	div.premisesText { width: 75%; margin-top: 28%; }
	
	div.cloudText { width: 75%; margin-top: 26%; }
	
	div.hybridText { width: 75%; margin-top: 31%; }	
		
	div.hostingContactText { padding-top: 90px; }
	h2.hostingContactText { font-size: 30px; font-size: 3rem; }
	p.hostingContactText { font-size: 20px; font-size: 2rem; line-height: 26px; line-height: 2.6rem; }
	.hostingContacButtons { padding-bottom: 80px; }

}

@media only screen and (max-width: 500px) {
	.hostinIntroButtons div { width: 140px; height: 45px; font-size: 14px; font-size: 1.4rem; line-height: 45px; }
	
	div.premisesText { margin-top: 31%; }
	
	div.cloudText { margin-top: 21%; }
	
	div.hybridText { margin-top: 41%; }
}



/****************************************/
/*              Blog List               */
/****************************************/
@media only screen and (max-width: 1024px) {
	img.authorImage { display: none; }
	.blogInfo p { margin-top: 0; }
}

@media only screen and (max-width: 900px) {
	#blogList .inner-container { width: 80%; }
}

@media only screen and (max-width: 600px) {
	p.blogDate { display: none; }
}

@media only screen and (max-width: 500px){
	#blogList { margin-top: 50px; }
	h3.blogTitle { font-size: 20px; font-size: 2rem; line-height: 28px; line-height: 2.8rem; text-align: left;  }
	h4.blogSub { text-align: left; }
	p.blogLead { font-size: 14px; font-size: 1.4rem; line-height: 22px; line-height: 2.2rem; text-align: justify; margin-bottom: 15px; }
	.blogInfo { margin-bottom: 100px; }
	.blogInfo p { font-size: 12px; font-size: 1.2rem; margin-top: -8px; }

}
/****************************************/
/*               Blog Posts             */
/****************************************/
@media only screen and (max-width: 1700px) {
	.authorPhoto.column.fourth { width: 15%; }
	p.authorBio { max-width: 60%; }
}

@media only screen and (max-width: 1300px) {
	#blogPost .inner-container { width: 60%; }
	#blogPost p { text-align: justify; }
	#blogPostAuthor .inner-container { width: 60%; }
	.authorPhoto.column.fourth { width: 17%; }
	p.authorBio { max-width: 70%; }
}

@media only screen and (max-width: 1100px) {
	.authorPhoto.column.fourth { width: 19%; }
	p.authorBio { max-width: 80%; }
}

@media only screen and (max-width: 900px) {
	.blogHero .inner-container { width: 90%; left: -4%;}
	#blogPost .inner-container { width: 80%; }
	#blogPostAuthor .inner-container { width: 80%; }
	.authorPhoto.column.fourth { width: 20%; }
	p.authorBio { max-width: 90%; }
}

@media only screen and (max-width: 770px) {
	.blogHero { height: 400px; }
	.postText { margin-top: 200px; }
	h1.postTitle { font-size: 28px; font-size: 2.8rem; line-height: 32px; line-height: 3.2rem; margin-bottom: 15px; }
	h2.postSub { font-size: 18px; font-size: 1.8rem; line-height: 20px; line-height: 2rem; }
	.postText hr { width: 125px;}
	#blogPrevious, #blogNext { top: 200px; }
	#blogPrevious, #blogNext, img.previousArrow, img.nextArrow { width: 60px; height: 50px;}
	
	.postInfo { margin-top: 0px; }
	
	#blogPost { margin: 75px 0 75px 0; }
	#blogPost h2 { font-size: 24px; font-size: 2.4rem; line-height: 30px; line-height: 3rem; }
	#blogPost p { font-size: 16px; font-size: 1.6rem; line-height: 28px; line-height: 2.8rem; }
	#blogPost ul, #blogPost ol { margin-left: 40px; }
	
	.authorPhoto.column.fourth { width: 22%; }
	p.authorBio { max-width: 100%; }
}
@media only screen and (max-width: 600px) {	
	.blogHero .inner-container { width: 80%; left: -4%;}
	.postText { width: 100%; margin-left: 22%; }
	
	img.authorImage { display: none; }
	.postInfo p { margin-top: 5px; }
	#blogPrevious, #blogNext { display: none !important; } 
	
	.authorPhoto.column.fourth { width: 25%; }
	.authorBio { margin: 50px 0 50px 15px;}
}

@media only screen and (max-width: 500px) {
	h1.postTitle { font-size: 24px; font-size: 2.4rem; line-height: 28px; line-height: 2.8rem; margin-bottom: 10px; }
	h2.postSub { font-size: 14px; font-size: 1.4rem; line-height: 16px; line-height: 1.6rem; }

	#blogPost { margin: 30px 0 30px 0; }
	#blogPost .inner-container { width: 90%; }
	#blogPostAuthor .inner-container { width: 90%; }
	#blogPost ul, #blogPost ol { margin-left: 20px; }
	
	.authorPhoto.column.fourth { width: 28%; }
	p.authorBio { font-size: 12px; font-size: 1.2rem; }
}

/****************************************/
/*               Careers                */
/****************************************/
@media only screen and (max-width: 1650px) {
	#careersInfo .inner-container { width: 68%; }
}

@media only screen and (max-width: 1600px) {
	.cultureQuote { max-width: 85%; }
}

@media only screen and (max-width: 1450px) {
	#careersInfo .inner-container { width: 73%; }
}

@media only screen and (max-width: 1400px) {
	.cultureQuote { margin-top: 50px; padding-bottom: 100px; }
	p.quoteQuote { margin-top: 50px; }
	
	#careersInfo .inner-container { width: 75%; }
	p.careerDesc { font-size: 12px; font-size: 1.2rem; }
	
	#contact .inner-container { width: 70%; }
	div.contactTitle { margin-top: 100px; }
	#form { padding-bottom: 650px; }
}

@media only screen and (max-width: 1024px) {
	#careersCulture .inner-container, #aboutCulture .inner-container { width: 75%; }
	
	#careersInfo .inner-container { width: 85%; }
	
	#contact .inner-container { width: 80%; }
	div.contactTitle { margin-top: 100px; }
	#form { padding-bottom: 650px; }
}

@media only screen and (max-width: 900px) {
	.careers.column.fourth { width: 50%; }
	img.icon-careers { width: 85%; }
	p.careerDesc { height: 50px; }
}

@media only screen and (max-width: 800px) {
	div.cultureTitle { padding-top: 50px; margin-bottom: 50px }
	
	#form .column.half { width: 100%; padding: 0; }
	#contact input { height: 50px; margin-bottom: 15px; }
	#contact input[placeholder] { font-size: 14px; font-size: 1.4rem; }
	#contact textarea[placeholder] { font-size: 14px; font-size: 1.4rem; }
}

@media only screen and (max-width: 700px) {
	#careersCulture .inner-container, #aboutCulture .inner-container { width: 90%; }
	h1.cultureTitle { font-size: 36px; font-size: 3.6rem; }
	.cultureQuote { max-width: 90%; padding-bottom: 75px; }
	
	#contact .inner-container { width: 90%; }
	div.contactTitle { margin-top: 50px; }

}

@media only screen and (max-width: 600px) {
	div.cultureTitle { margin-bottom: 25px }
	h1.cultureTitle { text-align: left; margin-bottom: 5px; }
	#careersCulture hr, #aboutCulture hr { margin: 0;  width: 50px; }
	.cultureQuote { max-width: 100%; text-align: justify; margin-top: 25px; }
	p.quoteQuote { margin-top: 25px; }
	h3.quoteName { margin-top: 25px; }
	
	#careersInfo .inner-container { width: 90%; }
	img.icon-careers { width: 95% }
	h3.careerTitle { font-weight: 200; color: #2d2d2d; text-align: center; margin-left: -5px; margin-bottom: 40px; margin-top: 5px; }
	p.careerDesc { display: none; }
	#careersInfo hr { display: none; }
	
	
	h1.contactTitle { font-size: 36px; font-size: 3.6rem; line-height: 40px; line-height: 4rem; text-align: left; }
	#contact hr { width: 50px; margin: 0; margin-bottom: 50px; }
	#careersLink p { margin: 35px 33px 0 0; }
}