@charset "UTF-8";
/* CSS Document */

body{
	background-color: #3D464D;
	font-family: Roboto, sans-serif;
	color: #fff;
	margin: 0 auto;
	padding: 0 auto;
}

canvas{
	display:block;
	position: absolute;
	top: 0;
}

#container{
	width: 100%;
	height: 100%;
}

ul{
	list-style-type: disc;
}

/*COMMON............STARTS..........................*/

.shadow{
	box-shadow: 0 4px 12px 0 rgba(0,0,0, 0.6);
}

.float-right{
	float: right;
}

.float-left{
	float: left;
}

.global{
		margin: 20.5px;
	}

.exphr-img{
			display: none;
		}

.Ai-persona-small{
		display: none;
	}

	/*SCROLL ANIMATION...............................................*/
	.scroll-text{
		width: 64px;
		display: block;
	}

	.mouse{
		margin: 8px 16px;
		width: 32px;
	}


	/*BUTTON OUTLINE.................................*/

	.profile{
		font-family: Roboto, sans-serif;
		border-radius: 4px;
		background-color: rgba(0,0,0, 0);
		border: 1.5px solid #41B3FF;
		color: #fff;
		font-weight: 300;
		font-size: 14px;
		cursor: pointer;
		margin-top: 24px;
		line-height: 40px;
		text-align: center;
		display: inline-block;
		width: 160px;
	}

	.profile:hover{
		background-color: #41B3FF;
		font-weight: 500;
	}


/*NAVIGATION BACK............STARTS..........................*/
	.menu {
		width: 100%;
		height: 64px;
		background-color: #131D25;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		z-index: 900;
		float: left;
	}

	.logo{
		width: 56px;
		height: 72px;
		opacity: 1;
		background-color: #41b3ff;
		margin:0px 0px 0 40px;
		float: left;
		text-align: center;
		display: table;
		font-size: 24px;
	}
	
	.logo-text{
		width: 40px;
		margin-top: 16px;
		display: inline-block!important;
		}

	.share{
		width: 64px;
		height: 64px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
	}

	#menu-center {
		height: 64px;
		float: left;
		background-color: #0A161E;
		margin-left: 0px;
	}

	.back-icon{
		font-size: 24px !important;
		float: left;
		margin-right: 16px;
	}

	.back{
		padding: 20px 40px 21px 24px;
		float: left;
	}

	.back-label{
		line-height: 24px;
		float: left;
		font-style: normal;
	}

	a {
		color: rgba(216,216,216, 1);
		text-decoration: none;
		font-weight: 300;
	}

	a[href^="tel"] {
	  color: inherit; /* Inherit text color of parent element. */
	  text-decoration: none; /* Remove underline. */
	  /* Additional css `propery: value;` pairs here */
	}

/* NEW FOOTER............STARTS..........................*/
.footer{
	width: 100vw;
	background-color: rgba(0,0,0,1);
	z-index: 900;
	text-align: center;
	font-size: 14px;
	display: inline-block;
	padding: 40px;
	box-sizing: border-box;
	color: rgba(255,255,255,0.9);
	}

.footer-contents{
	max-width: 360px;
}

.footer-contents-1{
	float: left;
	display: inline-block;
	text-align: left;
	margin: 0 0 40px 0;
}

.footer-contents-2{
	display: inline-block;
	text-align: left;
	float: left;
	margin: 0 0 40px 0;
}

.footer-header{
	font-size: 30px;
	font-weight: 700;
	margin: 0px 0 16px 0;
	letter-spacing: 2px;
}

.footer-text{
	margin: 0 0 0px 0;
	line-height: 20px;
	font-weight: 300;
}

.footer-message{
		padding: 80px 0 24px 0;
	}

.copy {
    font-size: 16px!important;
    align-self: center;
    margin-right: 2px;
	}

.copy-right{
		font-weight: 300;
		line-height: 24px;
		margin: 0px 0 10px 0;
		display: inline-flex;
		font-size: 14px;
	}

.footer-links{
	display: inline-block;
	margin: 20px 0 0px 0;
}

.footer-icons{
	height: 24px;
	width: 24px;
	float: left;
	margin: 0 8px 0 0;
}

/*.......................................DEVICE 320PX - 460PX......................*/
@media (min-width: 320px) and (max-width: 475.9px){	
	
	.menu {
		width: 100%;
		height: 56px;
		background-color: #131D25;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		z-index: 900;
		float: left;
	}

	.logo{
		height: 64px;
		margin: 0 0 0 16px;
	}
	
	.logo-text{
		width: 32px;
		margin-top: 14px;
		vertical-align: middle;
		font-size: 24px;
	}

	.share{
		width: 56px;
		height: 56px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
	}

	.contact{
		width: 56px;
		height: 56px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
	}

	#menu-center {
		height: 56px;
		float: left;
		background-color: #0A161E;
		margin-left: 0px;
	}

	.back-icon{
		font-size: 24px !important;
		float: left;
		margin-right: 16px;
	}

	.back{
		padding: 16px 40px 16px 24px;
		float: left;
	}

	.back-label{
		line-height: 24px;
		float: left;
		font-style: normal;
	}
	
	.global{
		margin: 16px;
	}
	
	/*HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/MAX-Images/Bitmap.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-x:64%;
		z-index: -1;
	}
	
	.project-bg{
		float: left;
		display: inline-block;
		width: 100%;
		max-width: 320px;
	}

	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:120px 32px 60px 40px;
		z-index: 1;
		display: inline-block;
		height: 100vh;
	}

	.hero-header{
		font-size: 40px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 8px 0 32px 0;
		height: 180px;
		float: left;
		max-width: 320px;
	}

	.hero-label{
		width: 132px;
		font-size: 14px;
		float: left;
		margin-bottom: 24px;
		clear: left;
	}

	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}

	#scroll{
		display: inline-block;
		position: fixed;
		z-index: 600;
		bottom: 0;
		left: 49%;
	}

	.scroll-text{
		width: 64px;
		display: block;
	}

	.mouse{
		margin: 8px 16px;
		width: 32px;
	}
	
	/*SUMMARY............STARTS.................*/
	/*.summary{
		font-family: Roboto condensed, sans-serif;
		font-size: 48px;
		line-height: 100px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 16%;
		float: left;
		display: inline-block;
	}*/

	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 24px 32px 0 40px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 18px;
		font-weight: 700;
		margin: 0px 0 16px 0;
		display: inline-block;
		max-width: 560px;
	}

	.project-description{
		font-size: 14px;
		font-weight: 300;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:40px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.reduce-height{
		padding: 104px 0 0 0;
	}
	
	.section-header-line{
		width: 24px;
		line-height: 24px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 18.5px;
	}
	
	.manage-summary-height{
		padding: 16px 0 0 0;
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 24px 32px 0 40px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 100%;
		vertical-align: top;
		position: relative;
		/*left: -3.6%;*/
		z-index: -1;
		display: inline-block;
	}
	
	.extra-height{margin-top: 16px !important;}
	.extra-height-2{margin-top: 24px !important;}
	.extra-height-3{margin-top: 0px !important;}

	.activity-description{
		font-size: 14px;
		font-weight: 300;
		display: inline-block;
		max-width: 360px;
		width: 100%;
		margin: 0 0 16px 0;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/
	

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 32px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
		max-width: 460px;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		max-width: 580px;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.video-container{margin-top: 16px!important;}
	
	.project-image-one{
		width: 100%;
		max-width: 360px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-small{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-right{
		width: 100%;
		float: right;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.res-container{
	}

	.image-overlap{
		position: absolute;
		top: 64px;
		left: 32px;
	}
	
	.overlapping-image{
		width: 88%;
		float: left;
	}
	
	.research-one{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}

	.research-two{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-three{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-four{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.vd{display: none;}
	.vd-3{ display: none;}
	
	.vd-2{
		display: none;
	}
	
	.vd-1{
		width: 100%;
		max-width: 440px;
		margin: 0px 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.vd-2-2{
		display: none;
	}
	
	.vd-1-2{
		width: 100%;
		max-width: 320px;
		margin: 0px 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.Ai-persona{
		display: none!important;
	}
	
	.Ai-persona-small{
		display: block!important;
	}
	
	.focus-area{
		background-color: rgba(0,0,0, 0.6);
		padding: 20px;
		width: 100%;
		max-width: 420px;
		box-sizing: border-box;
	}
	
	.focus-area-1{display: none;}
	
	.project-video{
		width: 100%;
		margin: 0px 0 0px 0;
		border-radius: 1.5px;
		max-width: 740px;
	}
	
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 24px 0px;
		max-width: 360px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 24px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0px;
	}


	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	
	/*EXPERIENCE DESIGN............STARTS........*/
	.exp-bundle{
		box-sizing: border-box;
		/*background-color: rgba(0,0,0, 0.6);*/
		display: inline-block;
		display: inline-grid;
		padding: 32px 24px 0 24px;
	}

	.exp{
		float: left;
		display: inline-block;
		vertical-align: middle;
		padding: 0px 0 32px 0;
		width: 180px;
	}

	.exp-right{
		display: inline-block;
		vertical-align: middle;
		width: 180px;
		padding: 0px 0 32px 0;
		float: none;
	}

	.exp-icon{
		float: left;
		display: inline-block;
		width: 40px;

	}

	.exp-name{
		display: inline-block;
		height: 40px;
		vertical-align: middle;
		margin: 0px;
		padding: 4px 0 0 16px;
		width: 90px;
		font-size: 14px;
	}
	
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		box-sizing: border-box;
		padding: 40px 40px 30px 32px;
		margin: 20px 0 0px 0;
		font-size: 14px;
	}
	
	.impact-caption{
		font-size: 12px;
		float: right;
		position: relative;
		top: 16px;
		font-style: normal;
		font-weight: 300;
	}
	
	.imc{
		padding: 00px 0px 0px 0px;
		box-sizing: border-box;
		width: 100%;
		max-width: 320px;
		display:inline-block;
	}

	.impact{
		font-size: 20px;
		font-weight: 700;
		font-style: normal;
		display: block;
		align-content: center;
	}

	/*---------------FOOTER CUSTOM-------------*/
	.footer-contents-2{
		display: inline-block;
		text-align: left;
		float: left;
		margin: 0 0 30px 0;
	}
	
	.footer-header{
		font-size: 24px;
		font-weight: 700;
		margin: 0px 0 10px 0;
		letter-spacing: 2px;
		}
}

/*.......................................DEVICE 476PX-575PX......................*/
@media (min-width: 476px) and (max-width: 575.9px){	
	
	.menu {
		width: 100%;
		height: 56px;
		background-color: #131D25;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		z-index: 900;
		float: left;
	}

	.logo{
		height: 64px;
		margin: 0 0 0 24px;
	}
	
	.logo-text{
		width: 32px;
		margin-top: 14px;
		vertical-align: middle;
		font-size: 24px;
	}

	.share{
		width: 56px;
		height: 56px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
		margin-right: 1px;
	}

	.contact{
		width: 56px;
		height: 56px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
	}

	#menu-center {
		height: 56px;
		float: left;
		background-color: #0A161E;
		margin-left: 0px;
	}

	.back-icon{
		font-size: 24px !important;
		float: left;
		margin-right: 16px;
	}

	.back{
		padding: 16px 40px 16px 24px;
		float: left;
	}

	.back-label{
		line-height: 24px;
		float: left;
		font-style: normal;
	}
	
	.global{
		margin: 16px;
	}
	
	/*HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/MAX-Images/Bitmap.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-x:64%;
		z-index: -1;
	}
	
	.project-bg{
		float: left;
		display: inline-block;
		width: 100%;
		max-width: 360px;
	}

	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:128px 40px 60px 48px;
		z-index: 1;
		display: inline-block;
		height: 100vh;
	}

	.hero-header{
		font-size: 40px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 8px 0 32px 0;
		height: 160px;
		float: left;
		max-width: 360px;
	}

	.hero-label{
		width: 132px;
		font-size: 16px;
		float: left;
		margin-bottom: 24px;
		clear: left;
	}

	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}

	#scroll{
		display: inline-block;
		position: fixed;
		z-index: 600;
		bottom: 0;
		left: 49%;
	}

	.scroll-text{
		width: 64px;
		display: block;
	}

	.mouse{
		margin: 8px 16px;
		width: 32px;
	}
	
	/*SUMMARY............STARTS.................*/
	/*.summary{
		font-family: Roboto condensed, sans-serif;
		font-size: 48px;
		line-height: 100px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 16%;
		float: left;
		display: inline-block;
	}*/

	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 24px 40px 0 48px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 20px;
		font-weight: 700;
		margin: 0px 0 16px 0;
		display: inline-block;
		max-width: 460px;
	}
	
	.float-right{float: none !important;}

	.project-description{
		font-size: 14px;
		font-weight: 300;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:40px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 32px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 18.5px;
	}
	
	.reduce-height{
		padding: 120px 0 0 0;
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 24px 32px 0 48px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 100%;
		vertical-align: top;
		position: relative;
		/*left: -3.6%;*/
		z-index: -1;
		display: inline-block;
	}
	
	.extra-height{margin-top: 16px;}
	.extra-height-2{margin-top: 20px !important;}

	.activity-description{
		font-size: 14px;
		font-weight: 300;
		display: inline-block;
		max-width: 460px;
		width: 100%;
		margin: 0 0 24px 0;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/
	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
		max-width: 460px;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		max-width: 580px;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.video-container{margin-top: 16px!important;}
	
	.project-image-one{
		width: 100%;
		max-width: 420px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-small{
		width: 100%;
		max-width: 420px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-right{
		width: 88%;
		float: right;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.res-container{
	}

	.image-overlap{
		position: absolute;
		top: 80px;
		left: 40px;
	}
	
	.overlapping-image{
		width: 88%;
		float: left;
	}
	
	.research-one{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 12px 16px 0px;
	}

	.research-two{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 16px 0px;
	}
	
	.research-three{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-four{
		width: 100%;
		max-width: 360px;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.vd{display: none;}
	.vd-3{ display: none;}
	
	.vd-2{
		display: none;
	}
	
	.vd-1{
		width: 100%;
		max-width: 480px;
		margin: 0px 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.vd-2-2{
		display: none;
	}
	
	.vd-1-2{
		width: 100%;
		max-width: 360px;
		margin: 0px 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.Ai-persona{
		display: none!important;
	}
	
	.Ai-persona-small{
		display: block!important;
	}
	
	.focus-area{
		background-color: rgba(0,0,0, 0.6);
		padding: 20px;
		width: 100%;
		max-width: 360px;
		box-sizing: border-box;
	}	
	
	.focus-area-1{display: none;}
	
	.project-video{
		width: 100%;
		margin: 0px 0 0px 0;
		float: left;
	}
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 16px 0px;
		position: relative;
		top: -8px;
		max-width: 360px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 40px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0px;
	}

	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		box-sizing: border-box;
		padding: 40px 32px 30px 48px;
		margin: 24px 0 0px 0;
		font-size: 14px;
	}
	
	.imc{max-width: 320px;}

	.impact-caption{
		font-size: 12px;
		font-style: normal;
		font-weight: 300;
		position: relative;
		top: 16px;
		float: right;
	
	}
	
	/*-----------------CUSTOMR FOOTER -------------*/
	.footer-contents-2{
		display: inline-block;
		text-align: left;
		float: left;
		margin: 0 0 30px 0;
	}
	
	.footer-header{
		font-size: 26px;
		font-weight: 700;
		margin: 0px 0 10px 0;
		letter-spacing: 2px;
	}
}

/*.......................................DEVICE 576PX-767.9PX......................*/
@media (min-width: 576px) and (max-width: 767.9px){	
	
	.menu {
		width: 100%;
		height: 56px;
		background-color: #131D25;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
		z-index: 900;
		float: left;
	}

	.logo{
		height: 64px;
		margin: 0 0 0 24px;
	}
	
	.logo-text{
		width: 32px;
		margin-top: 14px;
		vertical-align: middle;
		font-size: 24px;
	}

	.share{
		width: 56px;
		height: 56px;
		background-color: #41b3ff;
		display: inline-block;
		float: right;
	}

	#menu-center {
		height: 56px;
		float: left;
		background-color: #0A161E;
		margin-left: 0px;
	}

	.back-icon{
		font-size: 24px !important;
		float: left;
		margin-right: 16px;
	}

	.back{
		padding: 16px 40px 16px 24px;
		float: left;
	}

	.back-label{
		line-height: 24px;
		float: left;
		font-style: normal;
	}
	
	.global{
		margin: 16px;
	}
	
	/*HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/MAX-Images/Bitmap.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-x:48%;
		z-index: -1;
	}
	
	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:56px 32px 16px 32px;
		z-index: 1;
		display: block;
		width: 460px;
		position: relative;
		top: 128px;
		left: 32px;	
	}

	.hero-header{
		font-size: 40px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 8px 0 32px 0;
		height: 150px;
		max-width: 412px;
	}

	.hero-label{
		width: 170px;
		font-size: 16px;
		margin-bottom: 24px;
		clear: left;
		float: left;
	}
	
	.project-bg{
		display: inline-block;
		width: 100%;
		max-width: 412px;
	}


	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}

	#scroll{
		display: inline-block;
		position: fixed;
		z-index: 600;
		bottom: 0;
		left: 49%;
	}

	.scroll-text{
		width: 64px;
		display: block;
	}

	.mouse{
		margin: 8px 16px;
		width: 32px;
	}
	
	/*SUMMARY............STARTS.................*/
	/*.summary{
		font-family: Roboto condensed, sans-serif;
		font-size: 48px;
		line-height: 100px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 16%;
		float: left;
		display: inline-block;
	}*/

	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 24px 40px 0 56px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 20px;
		font-weight: 700;
		margin: 0px 0 16px 0;
		display: inline-block;
		max-width: 560px;
	}

	.project-description{
		font-size: 14px;
		font-weight: 300;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:48px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 40px;
		line-height: 24px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 18.5px;
	}
	
	.reduce-height{
		padding: 136px 0 0 0;
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 24px 40px 0 56px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 100%;
		vertical-align: top;
		max-width: 640px;
		z-index: -1;
		display: inline-block;
	}
	
	.extra-height{margin-top: 24px !important;}
	.extra-height-2{margin-top: 24px !important;}

	.activity-description{
		font-size: 14px;
		font-weight: 300;
		display: inline-block;
		max-width: 560px;
		width: 100%;
		margin: 0 0 24px 0;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
		max-width: 460px;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		line-height: 24px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		max-width: 580px;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.video-container{
		margin-top: 16px !important;
		text-align: center;
	}
	
	.project-image-one{
		width: 88%;
		max-width: 560px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-small{
		width: 80%;
		max-width: 460px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-right{
		width: 80%;
		float: right;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		vertical-align: top;
	}
	
	.res-container{
	}

	.image-overlap{
		position: absolute;
		top: 96px;
		left: 40px;
	}	
	
	.overlapping-image{
		width: 80%;
		float: left;
	}
	
	.research-one{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 16px 20px 0px;
	}

	.research-two{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}

	.research-three{
		width: 44%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-four{
		width: 55%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
	}
	
	
	.vd{display: none;}
	.vd-3{ display: none;}
	
	.vd-1{
		display: none;
	}
	
	.vd-2{ 
		width: 96%;
		max-width: 740px;
		margin: 0px 0 16px 0;
	}
	
	.vd-1-2{
		display: none;
	}
	
	.vd-2-2{ 
		width: 96%;
		max-width: 740px;
		margin: 0px 0 16px 0;
	}
	
	.Ai-persona{
		display: none!important;
	}
	
	.Ai-persona-small{
		display: inline-block!important;
	}
	
	.focus-area{
		background-color: rgba(0,0,0, 0.6);
		padding: 20px;
		width: 64%;
		max-width: 360px;
		box-sizing: border-box;
	}
	
	.focus-area-1{display: none;}
	
	.project-video{
		width: 100%;
		margin: 16px 0 0px 0;
		border-radius: 2px;
		max-width: 620px;
	}
	
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 16px 0px;
		position: relative;
		top: -8px;
		max-width: 360px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 48px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0px;
	}


	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	

	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		box-sizing: border-box;
		padding: 40px 40px 30px 56px;
		margin: 16 0 0px 0;
		font-size: 14px;
	}
	
	.imc{
		max-width: 620px;
	}
	
	.impact-caption{
		font-size: 12px;
		font-weight: 300;
		float: right;
		position: relative;
		top: 16px;
	}

}

/*.......................................DEVICE 768-1199......................*/
@media (min-width: 768px) and (max-width: 991.9px){		
/*.............CUSTOM COMMON....................*/
	.logo{
		margin-left: 24px;
	}
	
/*.............HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/MAX-Images/Bitmap.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-x:48%;
		z-index: -1;
	}
	
	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:56px 32px 16px 32px;
		z-index: 1;
		display: block;
		width: 460px;
		position: relative;
		top: 128px;
		left: 32px;	
	}

	.hero-header{
		font-size: 48px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 0px 0 32px 0;
		height: 180px;
		width: 412px;
	}

	.hero-label{
		width: 180px;
		font-size: 16px;
		margin-bottom: 24px;
		clear: left;
		float: left;
	}
	
	.project-bg{
		display: inline-block;
		width: 100%;
		max-width: 412px;
	}


	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}
	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 16px 40px 0 56px;
		display: inline-block;
		letter-spacing: 0.25px;
		text-align: center;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		font-weight: 700;
		margin: 0px 40px 16px 0;
		display: inline-block;
		width: 46%;
		max-width: 560px;
		text-align: left;
		vertical-align: top;
	}

	.project-description{
		font-size: 15px;
		font-weight: 300;
		text-align: left;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:64px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 40px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 22.5px;
	}
	
	.reduce-height{
		padding: 152px 0 0 0;
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 32px 40px 0 56px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 100%;
		vertical-align: top;
		position: relative;
		/*left: -3.6%;*/
		z-index: -1;
		display: inline-block;
		max-width: 680px;
	}

	.extra-height{margin-top: 24px !important;}
	.extra-height-2{margin-top: 72px !important;}
	.extra-height-3{margin-top: 0px !important;}
	
	.activity-description{
		font-weight: 300;
		display: inline-block;
		max-width: 740px;
		width: 100%;
		margin: 0 0 24px 0;
		font-size: 15px;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 48px;
		line-height: 48px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 32px;
		line-height: 32px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
		max-width: 560px;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 32px;
		line-height: 32px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		max-width: 560px;
		text-align: left;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.video-container{
		margin-top: 40px!important;
		text-align: center;}
	
	.res-container{
		width: 100% !important;
		max-width: 640px;
	}
	
	.project-image-one{
		width: 88%;
		max-width: 640px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-small{
		width: 100%;
		max-width: 640px;
		margin: 0 0 24px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-right{
		position: relative;
		top: 40px;
		width: 50%;
		left: -4%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		vertical-align: top;
	}

	.image-overlap{
		position: absolute;
		top: 104px;
		left: 64px;
	}
	
	.overlapping-image{
		width: 47%;
		vertical-align: top;
	}
	
	.research-one{
		width: 40%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 16px 20px 0px;
	}

	.research-two{
		width: 40%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-three{
		width: 44%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-four{
		width: 55%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
	}
	
	.vd{display: none;}
	.vd-3{ display: none;}
	
	.vd-1{
		display: none;
	}
	
	.vd-2{ 
		width: 100%;
		max-width: 620px;
		margin: 0px 0 24px 0;
	}
	
	.vd-1-2{
		display: none;
	}
	
	.vd-2-2{ 
		width: 88%;
		max-width: 740px;
		margin: 0px 0 24px 0;
	}
	
	.Ai-persona{
		display: none!important;
	}
	
	.Ai-persona-small{
		display: inline-block!important;
	}
	
	.project-video{
		width: 100%;
		margin: 16px 0 0px 0;
		border-radius: 2px;
		max-width: 740px;
	}
	
	.focus-area{
		display: none;
	}
	
	.focus-area-1{
		background-color: rgba(0,0,0, 0.6);
		width: 80%;
		max-width: 560px;
		box-sizing: border-box;
		padding: 24px;
	}
	
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 24px 0px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 32px;
	}
	
	.count-3{
		padding: 0 32px 0 32px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0px;
	}

	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		margin: 0 0 0px 0;
		padding: 40px 40px 30px 56px;
		box-sizing: border-box;
	}
	
	.imc{
		
	}

	.impact-caption{
		font-size: 12px;
		font-weight: 300;
		float: right;
		position: relative;
		top: 16px;
		right: 40px;
	}
	
/* CUSTOM FOOTER............STARTS..........................*/
	.footer-contents{
		width: 100%;
		display: inline-block;
		max-width: 800px;
	}

	.footer-contents-1{
		margin: 0 0 30px 16px;
		max-width: 320px;
	}

	.footer-contents-2{
		float: right;
		margin: 0 0 0px 0;
	}

	.footer-links{
		display: inline-block;
		margin: 30px 0 0px 0;
	}
}

/*................................DEVICE 992 - 1199................................*/
@media (min-width: 992px) and (max-width: 1199.9px){		

	.logo{margin-left: 32px;}
	/*.............HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/MAX-Images/Bitmap.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-x: 48%;
		z-index: -1;
	}
	
	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:64px 32px 16px 32px;
		z-index: 1;
		display: block;
		width: 480px;
		position: relative;
		top: 128px;
		left: 40px;	
	}

	.hero-header{
		font-size: 56px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 0px 0 32px 0;
		height: 208px;
		width: 416px;
	}

	.hero-label{
		width: 180px;
		font-size: 16px;
		margin-bottom: 24px;
		clear: left;
		float: left;
	}
	
	.project-bg{
		display: inline-block;
		width: 100%;
		max-width: 416px;
	}


	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}
	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 16px 80px 0 80px;
		display: inline-block;
		letter-spacing: 0.25px;
		text-align: center;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		font-weight: 700;
		margin: 0px 40px 16px 0;
		display: inline-block;
		width: 46%;
		max-width: 560px;
		text-align: left;
		vertical-align: top;
	}

	.project-description{
		font-size: 15px;
		font-weight: 300;
		text-align: left;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:64px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 56px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 26.5px;
	}
	
	.reduce-height{
		padding-top: 96px;
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 32px 72px 0 72px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 41%;
		vertical-align: top;
		position: relative;
		/*left: -3.6%;*/
		z-index: -1;
		display: inline-block;
	}
	
	.pa-full{
		width: 100% !important;
		max-width: 1024px;
	}

	.extra-height{margin-top: 24px;}
	.extra-height-2{margin-top: 80px !important;}
	.extra-height-3{margin-top: 80px !important;}
	
	.activity-description{
		font-weight: 300;
		display: inline-block;
		max-width: 680px;
		width: 100%;
		margin: 0 0 15px 0;
		font-size: 15px;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 56px;
		line-height: 56px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 36px;
		line-height: 36px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 36px;
		line-height: 36px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		text-align: left;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.res-container{
		width: 56% !important;
		margin-right: 24px;
		max-width: 560px;
	}
	
	.res-container-2{
		float: left;
		width: 41%;
		clear: left
	}
	
	.res-container-3{
		float:none!important;
		width: 55%;
		margin: 24px 0 0 32px;
	}
	
	.project-image-one{
		width: 100%;
		max-width: 560px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-small{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		max-width: 960px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.overlapping-image{ 
		width: 47% !important;
		max-width: 480px;
		vertical-align: top;
	}
	
	.project-image-right{
		position: relative;
		top: 48px;
		left: -4%;
		width: 50%;
		max-width: 500px;
		margin: 0 0 0px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		vertical-align: top;
	}

	.image-overlap{
		position: absolute;
		top: 88px;
		left: 48px;
	}
	
	.research-one{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 16px 20px 0px;
	}

	.research-two{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-three{
		width: 44%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-four{
		width: 55%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
	}
	
	.vd{
		width: 100%;
		max-width: 920px;
		margin: 8px 0 24px 0px;
	}
	
	.vd-1{ 
		display: none;
	}
	
	.vd-2{ 
		display: none;
	}
	
	.vd-1-2{ 
		display: none;
	}
	
	.vd-2-2{ 
		display: none;
	}
	
	.vd-3{ 
		width: 100%;
		max-width: 920px;
		margin: 24px 0 16px 0px;
	}
	
	.video-container{ text-align: center; margin-top: 64px;}
	
	.project-video{
		width: 100%;
		margin: 24px 0 0px 0;
		border-radius: 2px;
		max-width: 800px;
	}
	
	.focus-area{
		display: none;
	}
	
	.focus-area-1{
		background-color: rgba(0,0,0, 0.6);
		width: 100%;
		max-width: 560px;
		box-sizing: border-box;
		padding: 24px;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin-top: 4px;
	}
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 24px 0px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 40px;
	}
	
	.count-3{
		padding: 0 40px 0 0px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0px;
	}

	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		margin: 40px 0 0px 0;
		padding: 40px 72px 30px 72px;
		box-sizing: border-box;
	}
	
	.imc{
		max-width: 1080px;
	}

	.impact-caption{
		font-size: 12px;
		font-weight: 300;
		float: right;
		position: relative;
		top: 16px;
		right: 16px;
	}
	
	/* CUSTOM FOOTER............STARTS..........................*/
	.footer-contents{
		width: 88%;
		max-width: 960px;
		display: inline-block;
	}

	.footer-contents-1{
		margin: 0 0 30px 0;
		max-width: 460px;
	}

	.footer-contents-2{
		float: right;
		margin: 0 0 0px 0;
	}

	.footer-links{
		display: inline-block;
		margin: 30px 0 0px 0;
	}
}

/*................................DEVICE 1200 - 1466 ................................*/
@media (min-width: 1200px) and (max-width: 1466.9px){		
	.logo{margin-left: 32px;}
/*.............HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/AI-images/Ai-hero-image.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-y: bottom;
		z-index: -1;
	}
	
	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:64px 32px 8px 32px;
		z-index: 1;
		display: block;
		width: 480px;
		position: relative;
		top: 120px;
		left: 56px;	
	}

	.hero-header{
		font-size: 56px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 0px 0 32px 0;
		height: 208px;
		width: 416px;
	}

	.hero-label{
		width: 180px;
		font-size: 16px;
		margin-bottom: 20px;
		clear: left;
		float: left;
	}
	
	.project-bg{
		display: inline-block;
		width: 100%;
		max-width: 416px;
	}


	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}
	
	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 16px 80px 0 80px;
		display: inline-block;
		letter-spacing: 0.25px;
		text-align: center;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		font-weight: 700;
		margin: 0px 40px 16px 0;
		display: inline-block;
		width: 46%;
		text-align: left;
		vertical-align: top;
	}

	.project-description{
		font-size: 16px;
		font-weight: 300;
		text-align: left;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:64px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 64px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 30.5px;
	}
	
	.reduce-height{
		
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 32px 80px 0 80px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 41%;
		max-width: 580px;
		vertical-align: top;
		z-index: -1;
		display: inline-block;
		clear: right;
	}
	
	.pa-full{
		width: 100% !important;
		max-width: 800px;
		display: inline-block;
	}

	.extra-height{margin-top: 24px !important;}
	.extra-height-2{margin-top: 96px !important;}
	.extra-height-3{margin-top: 96px !important;}
	
	.activity-description{
		font-weight: 300;
		display: inline-block;
		width: 100%;
		margin: 0 0 16px 0;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 64px;
		line-height: 64px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 16px 0px;
		display: block;
		z-index: -1;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		text-align: left;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.res-container{
		width: 56% !important;
		max-width: 640px;
		margin-right: 30px;
	}
	
	.res-container-2{
		float: left;
		width: 41%;
		clear: left
	}
	
	.res-container-3{
		float:none!important;
		width: 55%;
		margin: 24px 0 0 40px;
	}
	
	.project-image-one{
		width: 80%;
		max-width: 960px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.image-overlap{
		position: absolute;
		top: 88px;
		left: 48px;
	}
	
	.project-image-small{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		max-width: 960px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.overlapping-image{ 
		width: 47% !important;
		max-width: 560px;
		margin-top: 16px;
		vertical-align: top;
	}
	
	.project-image-right{
		position: relative;
		top: 64px;
		left: -4%;
		width: 50%;
		max-width: 600px;
		margin: 0 0 0px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		vertical-align: top;
	}
	
	.research-one{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 16px 20px 0px;
	}

	.research-two{
		width: 48.2%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-three{
		width: 44.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-four{
		width: 55.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
	}
	
	.research-five{
		width: 55.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-six{
		width: 44.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
		z-index: -1;
	}
	
	.vd-1{
		display: none;
	}
	
	.vd-2{ 
		display: none;
	}
	
	.vd{ 
		width: 100%;
		max-width: 960px;
		margin: 0px 0 24px 0px;
	}
	
	.vd-1-2{ 
		display: none;
	}
	
	.vd-2-2{ 
		display: none;
	}
	
	.vd-3{ 
		width: 100%;
		max-width: 960px;
		margin: 24px 0 16px 0px;
	}
	
	.ia-1{
		width: 88%;
		max-width: 960px;
		margin: 0px 0 24px 0px;
	}
	
	.ia-2{
		display: none;
	}
	
	.video-container{ text-align: center; margin-top: 112px;}
	
	.project-video{
		width: 100%;
		margin: 0px 0 0px 0;
		border-radius: 2px;
		max-width: 960px;
	}
	
	.focus-area{
		display: none;
	}
	
	.focus-area-1{
		background-color: rgba(0,0,0, 0.6);
		width: 100%;
		max-width: 560px;
		box-sizing: border-box;
		padding: 24px;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin-top: 16px;
	}

	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 24px 0px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 48px;
	}
	
	.count-3{
		padding: 0 48px 0 0px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0 48px 0px 0;
	}

	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
		width: 100%;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	
	/*EXPERIENCE DESIGN............STARTS........*/
	.exp-bundle{
		box-sizing: border-box;
		/*background-color: rgba(0,0,0, 0.6);*/
		display: inline-block;
		display: inline-grid;
		padding: 32px 24px 0 24px;
	}

	.exp{
		float: left;
		display: inline-block;
		vertical-align: middle;
		padding: 0px 0 32px 0;
		width: 180px;
	}

	.exp-right{
		display: inline-block;
		vertical-align: middle;
		width: 180px;
		padding: 0px 0 32px 0;
		float: none;
	}

	.exp-icon{
		float: left;
		display: inline-block;
		width: 40px;

	}

	.exp-name{
		display: inline-block;
		height: 40px;
		vertical-align: middle;
		margin: 0px;
		padding: 4px 0 0 16px;
		width: 90px;
		font-size: 14px;
	}
	
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		margin: 40px 0 0px 0!important;
		padding: 40px 80px 30px 80px;
		box-sizing: border-box;
		text-align: center;
	}
	
	.imc{
		width: 100%;
		display: inline-block;
	}

	.impact-caption{
		font-size: 12px;
		font-weight: 300;
		float: right;
		position: relative;
		top: 10px;
		right: 4%;
	}
	
/* CUSTOM FOOTER............STARTS..........................*/
	.footer-contents{
		width: 88%;
		max-width: 960px;
		display: inline-block;
	}

	.footer-contents-1{
		margin: 0 0 30px 0;
		max-width: 460px;
	}

	.footer-contents-2{
		float: right;
		margin: 0 0 0px 0;
	}

	.footer-links{
		display: inline-block;
		margin: 30px 0 0px 0;
	}
}

/*................................DEVICE 1467 UP................................*/
@media (min-width: 1467px){
/*.............HERO............STARTS....................*/
	#hero {
		height: 100vh;
		width: 100vw;
		position: relative;
		background-image: url( ../assets/AI-images/Ai-hero-image.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position-y: 40px;
		z-index: -1;
	}
	
	.hero-bg{
		background-color: rgba(0,0,0,0.7);
		box-sizing: border-box;
		padding:64px 32px 16px 32px;
		z-index: 1;
		display: block;
		width: 480px;
		position: relative;
		top: 128px;
		left: 56px;	
	}

	.hero-header{
		font-size: 64px;
		font-family: Roboto Condensed, sans-serif;
		font-weight: 700;
		margin: 0px 0 32px 0;
		height: 300px;
		width: 416px;
	}

	.hero-label{
		width: 180px;
		font-size: 16px;
		margin-bottom: 24px;
		clear: left;
		float: left;
	}
	
	.project-bg{
		display: inline-block;
		width: 100%;
		max-width: 416px;
	}


	.hero-head{
		font-weight: 500;
		margin: 0 0 4px 0;
	}

	.hero-content{
		font-weight: 300;
		margin: 0;
	}

	.hero-left{
		float: right;
		clear: right;
	}

	.profile-text{
		width: 32%;
		float: right;
		position: absolute;
		top: 32%;
		right: 5%;
	}
	
	.project-summary{
		width: 100%;
		box-sizing: border-box;
		padding: 16px 80px 0 80px;
		display: inline-block;
		letter-spacing: 0.25px;
		text-align: center;
	}

	.project-tagline{
		font-family: Roboto condensed, sans-serif;
		font-size: 24px;
		font-weight: 700;
		margin: 0px 40px 16px 0;
		display: inline-block;
		width: 46%;
		text-align: left;
		vertical-align: top;
	}

	.project-description{
		font-size: 16px;
		font-weight: 300;
		text-align: left;
	}
	
	/*STYLES USED ACROSS SECTIONS........STARTS.........*/
	.section-header {
		width: 100vw;
		box-sizing: border-box;
		padding:64px 0 0 0;
		margin: 0;
		display: inline-block;
	}
	
	.section-header-line{
		width: 64px;
		border: 1.5px solid #41b3ff;
		float: left;
		margin-top: 30.5px;
	}
	
	.reduce-height{
		
	}
	
	.project-summary-left{
		width: 100%;
		clear: left;
		box-sizing: border-box;
		padding: 32px 80px 0 80px;
		display: inline-block;
		letter-spacing: 0.25px;
	}

	.project-summary-two{
		padding-top: 24px;
	}

	.project-activity{
		width: 41%;
		max-width: 780px;
		vertical-align: top;
		z-index: -1;
		display: inline-block;
		clear: right;
	}
	
	.pa-full{
		width: 100% !important;
		max-width: 1080px;
		display: inline-block;
	}

	.extra-height{margin-top: 24px !important;}
	.extra-height-2{margin-top: 120px !important;}
	.extra-height-3{margin-top: 120px !important;}
	
	.activity-description{
		font-weight: 300;
		display: inline-block;
		width: 100%;
		margin: 0 0 16px 0;
		max-width: 920px;
	}

	.activity-image{
		margin: 0px 0 0 0px;
	}
	
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	
	/*.............ALL HEADERS....................*/

	.header-one{
		font-family: Roboto condensed, sans-serif;
		font-size: 64px;
		line-height: 64px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.40);
		margin: 0 0 0 8px;
		float: left;
		display: inline-block;
	}
	
	.header-two{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.3);
		margin: 0 0 12px 0px;
		display: block;
		z-index: -1;
	}
	
	.header-three{
		font-family: Roboto condensed, sans-serif;
		font-size: 40px;
		line-height: 40px;
		vertical-align: middle;
		font-weight: 700;
		color: rgba(255,255,255, 0.2);
		margin: 0 0 16px 0;
		display: block;
		z-index: -1;
		text-align: left;
	}
	
	
	/*.............ALL IMAGES....................*/
	.project-image-container{
		width: 100%;
		float: left;
		margin: 0;
		padding: 0;
		display: inline-block;
		position: relative;
	}
	
	.res-container{
		width: 56% !important;
		max-width: 840px;
		margin-right: 30px;
	}
	
	.res-container-2{
		float: left;
		width: 41%;
		clear: left
	}
	
	.res-container-3{
		float:none!important;
		width: 55%;
		margin: 24px 0 0 40px;
	}
	
	.project-image-one{
		width: 91%;
		max-width: 580px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.image-overlap{
		position: absolute;
		top: 88px;
		left: 48px;
	}
	
	.project-image-small{
		width: 100%;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.project-image-big{
		width: 100%;
		max-width: 1080px;
		margin: 0 0 16px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
	}
	
	.overlapping-image{ 
		width: 47% !important;
		max-width: 740px;
		margin-top: 16px;
		vertical-align: top;
	}
	
	.project-image-right{
		position: relative;
		top: 64px;
		left: -4%;
		width: 50%;
		max-width: 780px;
		margin: 0 0 0px 0;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		vertical-align: top;
	}
	
	.research-one{
		width: 47%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 16px 20px 0px;
	}

	.research-two{
		width: 48.2%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
	}
	
	.research-three{
		width: 44.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative
	}
	
	.research-four{
		width: 55.1%;
		vertical-align: middle; 
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin: 0px 0px 20px 0px;
		position: relative;
		left: -1%;
	}
	
	.vd-1{
		display: none;
	}
	
	.vd-2{ 
		display: none;
	}
	
	.vd{ 
		width: 88%;
		max-width: 960px;
		margin: 0px 0 24px 0px;
	}
	
	.vd-1-2{ 
		display: none;
	}
	
	.vd-2-2{ 
		display: none;
	}
	
	.vd-3{ 
		width: 100%;
		max-width: 740px;
		margin: 24px 0 16px 0px;
	}
	
	.video-container{ text-align: center; margin-top: 112px;}
	
	.project-video{
		width: 100%;
		margin: 8px 0 0px 0;
		border-radius: 2px;
		max-width: 960px;
	}
	
	.focus-area{
		display: none;
	}
	
	.focus-area-1{
		background-color: rgba(0,0,0, 0.6);
		width: 100%;
		max-width: 560px;
		box-sizing: border-box;
		padding: 24px;
		box-shadow: 0 4px 12px 0 rgba(0,0,0,0.6);
		margin-top: 16px;
	}
	/*.............BULLET POINTS HEADERS....................*/
	
	.activity-count{
		margin:0 0 24px 0px;
		width: 100%;
	}
	
	.count-container-left{
		display: inline-block;
		box-sizing: border-box;
		padding-right: 48px;
	}
	
	.count-3{
		padding: 0 48px 0 0px;
	}
	
	.count-container-right{
		display: inline-block;
		box-sizing: border-box;
		padding:0 48px 0px 0;
	}

	.count{
		font-size: 40px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}
	.activity-name{
		font-size: 14px;
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 80px;
		display: inline-block;
	}
	
	.vertical-count{
		display: inline-block;
		float: left;
		width: 100%;
	}

	.v-count{
		font-size: 48px;
		line-height: 60px;
		font-family: Roboto condensed, sans-serif;
		font-weight: 700;
		font-style: normal;
	}


	.vc-bundle-left{
		margin: 0 24px 24px 0;;
		float: left;
	}
	
	.vc-bundle-right{
		margin: 0 0 24px 0px;
		float: left;
	}

	.vc-name{
		margin: 0 0px 0 8px;
		font-style: normal;
		width: 88px;
		display: inline-block;
	}
	
	
	/*EXPERIENCE DESIGN............STARTS........*/
	.exp-bundle{
		box-sizing: border-box;
		/*background-color: rgba(0,0,0, 0.6);*/
		display: inline-block;
		display: inline-grid;
		padding: 32px 24px 0 24px;
	}

	.exp{
		float: left;
		display: inline-block;
		vertical-align: middle;
		padding: 0px 0 32px 0;
		width: 180px;
	}

	.exp-right{
		display: inline-block;
		vertical-align: middle;
		width: 180px;
		padding: 0px 0 32px 0;
		float: none;
	}

	.exp-icon{
		float: left;
		display: inline-block;
		width: 40px;

	}

	.exp-name{
		display: inline-block;
		height: 40px;
		vertical-align: middle;
		margin: 0px;
		padding: 4px 0 0 16px;
		width: 90px;
		font-size: 14px;
	}
	
	
	/*........................IMPACT.................*/
	.impact-container{
		width: 100%;
		background-color: #2F81FF;
		float: left;
		margin: 40px 0 0px 0!important;
		padding: 40px 80px 30px 80px;
		box-sizing: border-box;
		text-align: center;
	}
	
	.imc{
		width: 100%;
		display: inline-block;
	}

	.impact-caption{
		font-size: 12px;
		font-weight: 300;
		float: right;
		position: relative;
		top: 12px;
		right: 12%;
	}

	/* CUSTOM FOOTER............STARTS..........................*/
	.footer-contents{
		width: 88%;
		max-width: 960px;
		display: inline-block;
	}

	.footer-contents-1{
		margin: 0 0 30px 0;
		max-width: 460px;
	}

	.footer-contents-2{
		float: right;
		margin: 0 0 0px 0;
	}

	.footer-links{
		display: inline-block;
		margin: 30px 0 0px 0;
	}

}