@-webkit-keyframes fade-in {
	0% {
		opacity: 0;
		transform: translateY(5%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@-moz-keyframes fade-in {
	0% {
		opacity: 0;
		transform: translateY(5%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@-o-keyframes fade-in {
	0% {
		opacity: 0;
		transform: translateY(5%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@keyframes fade-in {
	0% {
		opacity: 0;
		transform: translateY(5%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@-webkit-keyframes fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(30%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@-moz-keyframes fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(30%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@-o-keyframes fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(30%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
@keyframes fade-in-up {
	0% {
		opacity: 0;
		transform: translateY(30%)
	}
	100% {
		opacity: 1;
		transform: translateX(0)
	}
}
body {
	/*padding-top: 80px*/
}
#intro {
	padding: 90px 0 0
}
#intro h1 {
	margin: 0 0 30px
}
#block-typog .wrap .block-one {
	width: 60%;
	height: auto;
	display: block;
	float: right;
	margin: 60px -12% 0 0
}
#block-typog .wrap .block-one .block-image {
	width: 100%;
	height: 500px;
	display: block;
	margin: 0
}
#block-typog .wrap .block-one.founder .block-image {
	background-position: 0 0
}
#block-typog .wrap .block-one.author .block-image {
	background-position: -1000px 0
}
#block-typog .wrap .block-one.leader .block-image {
	background-position: -500px 0
}
#block-typog .wrap .block-text {
	width: 42%;
	padding: 120px 0 0
}
#block-typog .block-two {
	width: 20px;
	height: 435px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: auto;
	bottom: auto;
	z-index: 10000
}
#block-typog .block-two.founder {
	background-position: -210px 0
}
#clients {
	padding: 60px 0 180px
}
#clients .logos {
	display: inherit
}
#clients .logos h2 {
	font-family: overpass, helvetica, arial, sans-serif;
	font-weight: 600;
	font-display: swap;
	font-style: normal;
	font-size: 3em;
	line-height: 40px;
	margin-bottom: 40px
}
@media only screen and (min-width:1100px) {
	#clients .logos h2 {
		font-size: 3.6em;
		line-height: 46px
	}
}
#clients .logos ul {
	margin-bottom: 40px
}
#clients .logos ul li {
	background-image: url(../images/logos.png);
	background-size: 858px 190px;
	max-width: 141px;
	width: 24.7%;
	height: 80px;
	display: block;
	display: inline-flex!important;
	margin-bottom: 20px;
	text-indent: -9999px
}
#clients .logos ul li.logo-nike {
	background-position: 0 0
}
#clients .logos ul li.logo-behance {
	background-position: -143px 0
}
#clients .logos ul li.logo-red {
	background-position: -286px 0
}
#clients .logos ul li.logo-mars {
	background-position: -429px 0
}
#clients .logos ul li.logo-adobe {
	background-position: -572px 0
}
#clients .logos ul li.logo-aos {
	background-position: -715px 0
}
#clients .logos ul li.logo-hn {
	background-position: 0 -110px
}
#clients .logos ul li.logo-mtv {
	background-position: -143px -110px
}
#clients .logos ul li.logo-foursquare {
	background-position: -286px -110px
}
#clients .logos ul li.logo-nasa {
	background-position: -429px -110px
}
#clients .logos ul li.logo-wework {
	background-position: -572px -110px
}
#clients .logos ul li.logo-sas {
	background-position: -715px -110px
}
#clients p {
	padding-right: 11%
}
#portfolio {
	width: auto;
	float: none;
	background-image: url(../images/paint-top.png), url(../images/halftone.png);
	background-size: 1800px 130px, 300px 300px;
	background-repeat: repeat-x, repeat;
	background-position: 0 0;
	padding-top: 120px
}
#portfolio .wrap {
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	-webkit-column-width: 260px;
	-moz-column-width: 260px;
	column-width: 260px;
	-webkit-column-gap: 30px;
	-moz-column-gap: 30px;
	column-gap: 30px;
	padding-top: 0;
	margin-top: 90px
}
#portfolio.related, #portfolio.writing, #portfolio.archive {
	padding: 90px 0
}
.card {
	display: block;
	cursor: pointer
}
.card .card-text h3 {
	padding: 15px 0 60px
}
.card .card-text .card-date {
	position: absolute;
	top: auto;
	left: 25px;
	right: auto;
	bottom: 25px
}
.card.article .card-text h3 {
	padding: 20px 0 0
}
.card.article .card-text .card-date {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
	padding: 40px 0 0
}
#portfolio.related .card {
	min-height: 490px!important
}
#bio h1 {
	margin: 90px 0 60px
}
#bio h2 {
	margin: 60px 0 15px
}
#bio h3 {
	margin: 60px 0;
	min-height: 238px
}
#awards h2, #honours h2 {
	margin: 90px 0 60px
}
#awards h3, #honours h3 {
	margin: 0 0 15px
}
#awards ul, #honours ul {
	margin: 0 0 40px
}
#honours {
	padding: 220px 0 130px
}
#honours h2 {
	margin-top: 0!important
}
#case-study h2, #case-study h3, #case-study h4, #project-header h2, #project-header h3, #project-header h4 {
	margin-bottom: 15px
}
#case-study h3, #project-header h3 {
	padding-top: 20px
}
#project-header {
	padding: 90px 0 0
}
#project-header .feature-image {
	padding-top: 60px
}
#project-header .feature-image img {
	float: left
}
#project-header .feature-image.new-feature {
	background-image: url(../images/paint-top.png), url(../images/halftone.png);
	background-size: 1800px 130px, 300px 300px;
	background-repeat: repeat-x, repeat;
	background-position: 0 0;
	padding-top: 0!important;
	margin-top: 60px
}
#project-header .project-left {
	padding: 90px 0 0
}
#case-study h3, #case-study h4 {
	padding-top: 30px
}
#contact {
	padding: 0 0 70px
}
#contact h2 {
	margin: 60px 0 0
}
#primary {
	display: inherit;
	width: 100%;
	float: left;
	clear: both;
	position: fixed;
	top: 0;
	left: 0;
	right: auto;
	bottom: auto;
	height: 80px;
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid #eee;
	z-index: 9999;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	-webkit-animation-delay: all .3s ease;
	-moz-animation-delay: all .3s ease;
	-o-animation-delay: all .3s ease;
	animation-delay: all .3s ease
}
#primary.nav-up {
	top: -80px
}
#primary li {
	float: left;
	margin-right: 30px;
	font-family: courier new, courier, monospace;
	font-weight: 400;
	font-display: swap;
	-webkit-font-smoothing: subpixel-antialiased;
	font-size: 1.5em;
	line-height: 25px;
	line-height: 81px!important;
	cursor: default
}
@media only screen and (min-width:1100px) {
	#primary li {
		font-size: 1.6em;
		line-height: 26px
	}
}
#primary li.me a {
	color: #212b3b;
	font-family: 'Caveat', cursive;
	font-size: 25px;
	font-style: italic
}
#primary li.me a:hover {
	
}
#primary li.me a:after {
	border-color: #212b3b
}
#primary li.portfolio {
	display: none
}
#primary li:last-child {
	float: right;
	margin-right: 0
}
#primary li a {
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
	position: relative
}
#primary li a:hover {
	text-decoration: none
}
#primary li a:after {
	content: '';
	position: absolute;
	top: auto;
	left: 0;
	right: auto;
	bottom: 0;
	width: 0;
	border-bottom: 1px solid rgba(0,201,255,1);
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease
}
#primary li a:hover:after {
	width: 100%
}
#primary li a.active {
	color: #212b3b;
	font-weight: 700
}
.navi-link {
	display: none
}
.block-one .block-one-letters.vineel .letter.a {
	top: 122px;
	left: -27px;
	right: auto
}
.block-one .block-one-letters.vineel .letter.n {
	top: 262px;
	left: 58px;
	right: auto
}
.block-one .block-one-letters.vineel .letter.d {
	top: 262px;
	left: 153px;
	right: auto
}
.block-one .block-one-letters.vineel .letter.r, .block-one .block-one-letters.vineel .letter.e, .block-one .block-one-letters.vineel .letter.w {
	display: inherit
}
.block-one .block-one-letters.vineel .letter.r {
	top: 262px;
	left: 300px;
	right: auto
}
.block-one .block-one-letters.vineel .letter.e {
	top: 402px;
	left: 230px;
	right: auto
}
.block-one .block-one-letters.vineel .letter.w {
	top: 402px;
	left: auto;
	right: 0
}
#bio h3 .letter {
	background-size: 700px 800px!important
}
#bio h3 .letter.s {
	top: 0;
	left: 0;
	opacity: 1;
	right: auto;
}
#bio h3 .letter.ss {
	top: 0;
	left: 86px;
	right: auto;
	opacity: 1
}
#bio h3 .letter.u {
	top: 140px;
	left: 121px;
	right: auto;
	width: 74px;
	height: 101px;
	background-size: 74px 101px;
	background-position: -600px -200px
}
#bio h3 .letter.p {
	top: 140px;
	left: 229px;
	right: auto;
	width: 72px;
	height: 98px;
	background-size: 72px 98px;
	background-position: -200px -200px
}
#clients h2, #clients li, #clients p {
	opacity: 0
}
.in-view#clients h2 {
	-webkit-animation-delay: .5s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: .5s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: .5s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: .5s;
	animation-duration: .5s;
	animation-name: fade-in;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(1) {
	-webkit-animation-delay: .6s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: .6s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: .6s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: .6s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(2) {
	-webkit-animation-delay: .7s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: .7s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: .7s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: .7s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(3) {
	-webkit-animation-delay: .8s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: .8s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: .8s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: .8s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(4) {
	-webkit-animation-delay: .9s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: .9s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: .9s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: .9s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(5) {
	-webkit-animation-delay: 1s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(6) {
	-webkit-animation-delay: 1.1s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.1s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.1s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.1s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(7) {
	-webkit-animation-delay: 1.2s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.2s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.2s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.2s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(8) {
	-webkit-animation-delay: 1.3s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.3s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.3s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.3s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(9) {
	-webkit-animation-delay: 1.4s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.4s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.4s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.4s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(10) {
	-webkit-animation-delay: 1.5s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.5s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.5s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.5s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(11) {
	-webkit-animation-delay: 1.6s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.6s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.6s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.6s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients li:nth-child(12) {
	-webkit-animation-delay: 1.7s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 1.7s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 1.7s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 1.7s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}
.in-view#clients p {
	-webkit-animation-delay: 2s;
	-webkit-animation-duration: .5s;
	-webkit-animation-name: fade-in-up;
	-webkit-animation-fill-mode: both;
	-webkit-animation-timing-function: ease;
	-moz-animation-delay: 2s;
	-moz-animation-duration: .5s;
	-moz-animation-name: fade-in-up;
	-moz-animation-fill-mode: both;
	-moz-animation-timing-function: ease;
	-o-animation-delay: 2s;
	-o-animation-duration: .5s;
	-o-animation-name: fade-in-up;
	-o-animation-fill-mode: both;
	-o-animation-timing-function: ease;
	animation-delay: 2s;
	animation-duration: .5s;
	animation-name: fade-in-up;
	animation-fill-mode: both;
	animation-timing-function: ease
}