/* =============================================================================
   GENERAL LAYOUT
   ========================================================================== */

	body{
		opacity: 0;
		margin: 0; padding: 0;
		
		font-family: 'helvetica neue', 'helvetica', arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		color: #000;
		
		background: #f4f4f4; background-image: url("img/bg-white-noise.jpg");
		background-attachment: fixed;
		
		-webkit-text-size-adjust: none;
	}
#sitescroll #page-about .pagepadding p a {
}
	
	::-moz-selection { background: #ccc; color: #000; text-shadow: none; }
	::selection { background: #ccc; color: #000; text-shadow: none; }
	
	#loading{
		display: none;
		position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9000;
		background: #f0f0f0; background-image: url("img/loading.gif");
		background-repeat: no-repeat; background-position: center center;
	}
	
	.smbr{
		display: none;
	}
	
	#fullprojectinfo-content a{
		color: #000;
	}
	#fullprojectinfo-content a:hover{
		text-decoration: none;
	}
	.gplus{
		display: none;
	}

/* =============================================================================
   VIDEO EMBEDDING
   ========================================================================== */

	.embed-container {
	    position: relative;
	    padding-bottom: 56.25%; /* 16/9 ratio */
	    padding-top: 30px; /* IE6 workaround*/
	    height: 0;
	    overflow: hidden;
	    margin: 0 auto;
	    max-width: 1600px;
	}
	
	.embed-container iframe,
	.embed-container object,
	.embed-container embed {
	    position: absolute;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    max-width: 1600px;
	}

/* =============================================================================
   PAGE: OPEN PROJECT
   ========================================================================== */
   
	#openproject{
		position: fixed; top: 0; left: 0;
		display: none; z-index: 5000;
		width: 100%; height: 100%;
		overflow-x: hidden; overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
		background: #f4f4f4; background-image: url("img/bg-white-noise.jpg");
	}
	#openproject-images{
		text-align: center;
	}
	#openproject-images img{
		width: 100%;
		max-width: 1600px;
		cursor: url('img/close-cursor.png'), e-resize;
	}
	.openproject-images-0{
		opacity: 0;
		-webkit-transition: all 0.2s ease-out; 
		-moz-transition: all 0.2s ease-out;
		-o-transition: all 0.2s ease-out;
	}
	.openproject-images-70{
		opacity: 0.7;
		-webkit-transition: all 0.2s ease-out; 
		-moz-transition: all 0.2s ease-out;
		-o-transition: all 0.2s ease-out;
	}
	.openproject-images-100{
		opacity: 1;
		-webkit-transition: all 0.2s ease-out; 
		-moz-transition: all 0.2s ease-out;
		-o-transition: all 0.2s ease-out;
	}
	#projecttitle{
		top: 180px; left: 55px;
		position: fixed;
		z-index: 6000;
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
		display: inline;
	}
	.projecttitle-hide{
		-webkit-transition: all 0.2s ease-out; 
		-moz-transition: all 0.2s ease-out;
		-o-transition: all 0.2s ease-out;
		margin-left: -2000px;
	}
	.projecttitle-show{
		-webkit-transition: all 0.2s ease-out; 
		-moz-transition: all 0.2s ease-out;
		-o-transition: all 0.2s ease-out;
		margin-left: 0px;
	}
	
	#backtothumbs{
	width: 0px;
	height: 0px;
	position: fixed;
	left: 90px;
	bottom: 55px;
	z-index: 6000;
	cursor: pointer;
	}
	#backtothumbs img{
		width: 100%;
	}
	
	#moreinfo{
		width: 30px; height: 29px;
		position: fixed; left: 55px; bottom: 55px;
		z-index: 6000; cursor: pointer;
	}
	#moreinfo img{
		width: 100%;
	}
	
	#fullprojectinfo{
		display: none;
		position: fixed; 
		bottom: 95px; left: 55px;
		z-index: 6000;
	}
	
	#fullprojectinfo-title{
		display: inline-block;
		font-size: 36px; line-height: 45px; font-weight: bold;
		padding: 10px 15px 0px 15px; background: #fff;
	}
	#fullprojectinfo-tags{
		display: inline-block;
		font-size: 11px; line-height: 14px;
		padding: 10px 15px 10px 15px; background: #fff;
	}
	
	#fullprojectinfo-content{
		max-width: 600px;
	}
	#fullprojectinfo-content p{
		margin-top: 6px;
		margin-bottom: 0px;
	}
	#fullprojectinfo-content p{
		display: inline-block;
		font-size: 14px; line-height: 18px;
		padding: 10px 15px 10px 15px; background: #fff;
	}

/* =============================================================================
   PAGE: MENU
   ========================================================================== */

	#menucontainer{
		display: none; opacity: 0;
		position: fixed;
		top: 0; left: 0; width: 100%; height: 100%;
		overflow: hidden; z-index: 90000;
		background: #f4f4f4; background-image: url("img/bg-black-noise.jpg");
		
		-webkit-transition: all 0.6s ease-out; 
		-moz-transition: all 0.6s ease-out;
		-o-transition: all 0.6s ease-out;
	}
	
	ul#menu{
		padding: 0; margin: 160px 0 0 0;
		list-style: none;
		font-weight: bold; font-size: 110px; line-height: 110px;
		color: #fff;
	}
	ul#menu li{
		padding: 10px 0 10px 60px;
		overflow: auto;
		position: relative;
		cursor: pointer;
	}
	
	.menuhover{
		position: absolute; top: 0; left: 0;
		width: 100%; height: 100%;
		background: #fff; z-index: -10;
		opacity: 0;
		
		-webkit-transition: all 0.3s ease-out; 
		-moz-transition: all 0.3s ease-out;
		-o-transition: all 0.3s ease-out;
	}

/* =============================================================================
   FIXED ELEMENTS
   ========================================================================== */

	#rad-logo{
	width: 92px;
	position: fixed;
	top: 55px;
	left: 55px;
	cursor: pointer;
	z-index: 95000;
	opacity: 1;		/* -webkit-transition: all 0.15s ease-out; 
		-moz-transition: all 0.15s ease-out;
		-o-transition: all 0.15s ease-out; */
	}
	#rad-logo:hover{
		opacity: 0.7;
		
		-webkit-transition: all 0.15s ease-out; 
		-moz-transition: all 0.15s ease-out;
		-o-transition: all 0.15s ease-out;
	}
	#rad-logo:active{
		opacity: 1;
		
		-webkit-transition: all 0.15s ease-out; 
		-moz-transition: all 0.15s ease-out;
		-o-transition: all 0.15s ease-out;
	}
	#rad-logo img{
	width: 92px;
	height: 62px;
	}
	
	#activetext{
		top: 180px; left: 55px;
		position: fixed;
		z-index: 2000;
	}
	.activetext-page-start{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
	}
	.activetext-page-work{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
	}
	.activetext-page-clients{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
	}
	.activetext-page-awards{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
	}
	.activetext-page-people{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		white-space: nowrap; pointer-events: none;
	}
	.activetext-page-manifesto1, .activetext-page-manifesto2, .activetext-page-manifesto3, .activetext-page-manifesto4, .activetext-page-manifesto5, .activetext-page-manifesto6, .activetext-page-manifesto7, .activetext-page-manifesto8, .activetext-page-manifesto9, .activetext-page-manifesto10{
		font-size: 90px; line-height: 100px;
		font-weight: bold; letter-spacing: -1px;
		pointer-events: none;
	}
	.activeline{
		vertical-align: middle;
		width: 160px;
	}
	
	ul#socialmedia{
	margin: 0;
	padding: 0;
	position: fixed;
	bottom: 35px;
	left: 0;
	font-size: 10px;
	line-height: 10px;
	font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
	list-style: none;
	z-index: 2000;
	right: 35px;
	text-align: right;
	text-decoration: none;
	}
	ul#socialmedia li{
	display: inline;
	margin-top: 0;
	margin-right: 0px;
	margin-left: 10px;
	margin-bottom: 0;
	text-decoration: none;
	}
	ul#socialmedia li img{
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 0;
	vertical-align: middle;
	background-position: right 0%;
	text-decoration: none;
	}
	ul#socialmedia a{
	padding-bottom: 2px;
	text-decoration: none;
	}
	.socialmedia-blacklink{
	text-indent: 120px;
	text-decoration: none;
	vertical-align: bottom;
	border-bottom-style: none;
	margin-top: 0px;
	padding-top: 10px;
}
	.socialmedia-blacklink:hover{
	color: #000;
	border: 0;
	text-decoration: none;
	vertical-align: middle;
}
	.socialmedia-whitelink{
	color: #fff;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}
	.socialmedia-whitelink:hover{
	color: #fff;
	border: 0;
	text-decoration: none;
}
	
	#designleader{
		width: 90px; height: 69px; margin-bottom: 20px; margin-left: -6px;
		background-image: url("img/designleader.png");
		z-index: 2000;
	}

	#contact-iphone{
	position: absolute;
	left: 15px;
	font-size: 10px;
	display: none;
	bottom: 0px;
	}
	
	#contact-iphone img{
		width: 8px;
	}
	
	#contact-iphone a {
		color: #000;
	}
	
	#contact{
		position: fixed;
		bottom: 55px; right: 55px;
		font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
		font-size: 11px; line-height: 14px;
		z-index: 2000;
	}
	#contact a{
		color: #000;
	}
	.contactlink-black{
		text-decoration: none; color: #000;
	}
	.contactlink-black:hover{
		text-decoration: underline; color: #000;
	}
	
	#scrolldown{
	position: fixed;
	bottom: 35px;
	left: 0;
	width: 75%;
	height: 28px;
	background-image: url(img/arrow-down-black.png);
	background-repeat: no-repeat;
	background-position: 55px center;
	z-index: 650;
	cursor: pointer;
	z-index: 2000;
	background-size: 50%
% auto;
	background-size: 46px 28px;
	}
	#scrollup{
		display: none;
	}
	
	#handwriting-menu{
		opacity: 0;
		position: fixed; top: 35px; left: 10px;
		width: 280px;
		z-index: -10; pointer-events: none;
	}
	#handwriting-menu img{
		width: 100%;
	}
	#handwriting-scroll{
		opacity: 0;
		position: fixed; bottom: 27px; left: 50%; margin-left: -42px;
		width: 205px; height: 157px;
		z-index: -10; pointer-events: none;
	}
	#handwriting-scroll img{
		width: 202px;
	}
	
	.arrowflip{
		transform:rotate(90deg);
		-ms-transform:rotate(180deg);
		-moz-transform:rotate(180deg);
		-webkit-transform:rotate(180deg);
		-o-transform:rotate(180deg);
	}

/* =============================================================================
   EACH PAGE SETTINGS
   ========================================================================== */

	.eachpage{
		
	}
	.pagepadding{
		padding: 265px 55px 55px 55px;	
	}
	.pagepadding-work{
		padding: 265px 55px 55px 55px;	
	}
	
	.activetext-content{
		display: none;
	}
	
	.page-color{
		display: none;
	}

/* =============================================================================
   PAGE: START
   ========================================================================== */

	#page-start p{
		font-weight: bold; font-size: 25px;
		display: none;
	}
	
	/* =============================================================================
	   PAGE: ABOUT
	   ========================================================================== */
	
	#page-about p{
		width: 1100px;
		font-size: 50px; font-weight: bold;
		margin-bottom: 0;
	}

/* =============================================================================
   PAGE: WORK
   ========================================================================== */

	#workwrap{
		padding-top: 100px;
		overflow: auto;
	}
	
	.workcontainer{
		margin-right: 5px; margin-bottom: 15px;
		float: left;
		width: 284px; height: 340px;
		cursor: pointer;
		overflow: hidden;
		opacity: 0.7;
	
		-webkit-transition: all 0.4s ease-out; 
		-moz-transition: all 0.4s ease-out;
		-o-transition: all 0.4s ease-out;
	}
	
	.workcontainer img{
		width: 100%;
	}
	
	.workcontainer xmp{
		display: none;
	}
	
	.workcontainer:hover{
		opacity: 1;
		-webkit-transition: all 0.4s ease-out; 
		-moz-transition: all 0.4s ease-out;
		-o-transition: all 0.4s ease-out;
	}
	
	.workcontainer a{
		color: #000; text-decoration: none;
	}
	
	.workcontainer-info{
		margin-top: 12px;
		font-size: 11px;
	}
	
	.workcontent{
		visibility: hidden;
	}

/* =============================================================================
   PAGE: CLIENTS
   ========================================================================== */

   .clientstitle-ios{
	   display: none;
	   font-size: 30px; font-weight: bold;
	   margin: 100px 0 25px 25px;
   }

	ul#clients{
		width:  890px;
		font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
		font-size: 16px; line-height: 16px;
		list-style: none; padding: 0; margin: 330px 0 0 80px;
		overflow: auto;
	}
	ul#clients li{
		float: left; width: 280px;
		margin: 0 0 13px 0;
	}

/* =============================================================================
   PAGE: AWARDS
   ========================================================================== */
	
	ul#awards{
		width:  100%;
		font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
		font-size: 16px; line-height: 16px;
		list-style: none; padding: 0; margin: 0; margin-top: 330px;
		overflow: auto;
	}
	ul#awards li{
		overflow: auto; width: 1120px;
		padding-bottom: 8px; margin-bottom: 8px;
		border-bottom: 1px solid #d7d7d7;
	}
	.award-year{
		margin-left: 90px;
		width: 100px; float: left;
	}
	.award-award{
		float: left; width: 110px;
	}
	.award-contest{
		float: left; width: 230px;
	}
	.award-project{
		float: left; width: 290px;
	}
	.award-client{
		float: left; width: 260px;
	}

/* =============================================================================
   PAGE: PEOPLE
   ========================================================================== */

   .peopletitle-ios{
	   display: none;
	   font-size: 30px; font-weight: bold;
	   margin: 25px 0 15px 0px;
   }

	ul#people{
		list-style: none; padding: 0; margin: 0 0 0 5px;
		font-size: 14px;
	}
	ul#people li{
		padding: 8px 5px 8px 80px;
		overflow: auto;
		-webkit-transition: all 0.5s ease-out; 
		-moz-transition: all 0.5s ease-out;
		-o-transition: all 0.5s ease-out;
		cursor: default;
	}
	ul#people li:hover{
		background: #000; color: #fff;
		-webkit-transition: all 0.5s ease-out; 
		-moz-transition: all 0.5s ease-out;
		-o-transition: all 0.5s ease-out;
	}
	ul#people li a{
		color: #fff;
		text-decoration: none;
		cursor: pointer;
	}
	ul#people li a:hover{
		text-decoration: underline;
	}
	.people-name{
		font-weight: bold;
		margin-right: 10px;
	}
	.people-title{
		font-style: italic;
	}
	.people-sep{
		margin: 0 20px 0 20px;
		opacity: 0;
	}
	.people-mail{
		opacity: 0;
	}
	.people-phone{
		opacity: 0;
	}

/* =============================================================================
   PAGE: MANIFESTO
   ========================================================================== */

	.manifestowrap{
		width: 1300px;
		overflow: auto;
	}
	.manifestonumber{
		width: 100px;
		margin-right: 20px;
		margin-top: -16px;
		font-size: 50px;
		float: left;
	}
	.manifestoquote{
		width: 1100px;
		float: left;
	}
	.manifestoquote p{
		font-size: 40px; line-height: 55px;
	}
	
	.manifesto-scroll{
		margin-top: 180px;
		width: 100%; height: 130px;
		overflow: auto;
	}
	.manifesto-scroll img{
		width: 5px;
	}
	.mscroll-left{
		width: 50%;
		float: left;
	}
	.mscroll-right{
		width: 50%;
		float: left;
	}
#sitescroll #page-about .pagepadding p a {
}

/* =============================================================================
 	IF MINIMUM HEIGHT IS 5 PX
   ========================================================================== */

	@media only screen and (min-height: 5px) {
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 35px; line-height: 35px;
			color: #fff;
		}
		#rad-logo{
	width: 70px;
	position: fixed;
	top: 15px;
	left: 15px;
	cursor: pointer;
	z-index: 95000;
	opacity: 1;			/* -webkit-transition: all 0.15s ease-out; 
			-moz-transition: all 0.15s ease-out;
			-o-transition: all 0.15s ease-out; */
		}
	}

	@media only screen and (min-height: 190px) {
		ul#menu{
			padding: 0; margin: 80px 0 0 -42px;
			list-style: none;
			font-weight: bold; font-size: 10px; line-height: 5px;
			color: #fff;
		}
	}

	@media only screen and (min-height: 320px) {
		ul#menu{
			padding: 0; margin: 90px 0 0 -42px;
			list-style: none;
			font-weight: bold; font-size: 40px; line-height: 35px;
			color: #fff;
		}
		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 4px; left: -20px;
			width: 198px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}
	}
	
	@media only screen and (min-height: 600px) {
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 50px; line-height: 50px;
			color: #fff;
		}
		#rad-logo{
	width: 92px;
	position: fixed;
	top: 55px;
	left: 55px;
	cursor: pointer;
	z-index: 95000;
	opacity: 1;			/* -webkit-transition: all 0.15s ease-out; 
			-moz-transition: all 0.15s ease-out;
			-o-transition: all 0.15s ease-out; */
		}
	#handwriting-menu{
		opacity: 0;
		position: fixed; top: 35px; left: 10px;
		width: 280px;
		z-index: -10; pointer-events: none;
	}
	#handwriting-menu img{
		width: 100%;
	}

	}
	
	@media only screen and (min-height: 700px) {
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 65px; line-height: 65px;
			color: #fff;
		}
		#rad-logo{
			width: 34px; height: 84px;
			position: fixed; top: 55px; left: 55px;
			cursor: pointer;
			z-index: 95000; opacity: 1;
			
			/* -webkit-transition: all 0.15s ease-out; 
			-moz-transition: all 0.15s ease-out;
			-o-transition: all 0.15s ease-out; */
		}
	}
	
	@media only screen and (min-height: 800px) {
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 85px; line-height: 85px;
			color: #fff;
		}
	}
	
	@media only screen and (min-height: 950px) {
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 110px; line-height: 110px;
			color: #fff;
		}
	}
	
	@media only screen and (min-height: 1300px) {
	
		ul#menu{
			padding: 0; margin: 160px 0 0 0;
			list-style: none;
			font-weight: bold; font-size: 140px; line-height: 140px;
			color: #fff;
		}

	}
	
	@media only screen and (max-width: 1500px) {
		#page-about p{
			width: 850px;
			font-size: 40px; font-weight: bold;
			margin-bottom: 0;
		}
		
		ul#awards{
			width:  100%;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 16px; line-height: 16px;
			list-style: none; padding: 0; margin: 0; margin-top: 330px;
			overflow: auto;
		}
		ul#awards li{
			overflow: auto; width: 1000px;
			padding-bottom: 8px; margin-bottom: 8px;
			border-bottom: 1px solid #d7d7d7;
		}
		.award-year{
			margin-left: 0px;
			width: 100px; float: left;
		}
		.award-award{
			float: left; width: 110px;
		}
		.award-contest{
			float: left; width: 230px;
		}
		.award-project{
			float: left; width: 290px;
		}
		.award-client{
			float: left; width: 200px;
		}

		#activetext{
			top: 180px; left: 55px;
			position: fixed;
			z-index: 2000;
		}
		.activetext-page-start{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-work{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-clients{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-awards{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-people{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activeline{
			vertical-align: middle;
			width: 90px;
		}

		.activetext-page-manifesto1, .activetext-page-manifesto2, .activetext-page-manifesto3, .activetext-page-manifesto4, .activetext-page-manifesto5, .activetext-page-manifesto6, .activetext-page-manifesto7, .activetext-page-manifesto8, .activetext-page-manifesto9, .activetext-page-manifesto10{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			pointer-events: none;
		}
		
		.manifestowrap{
			width: 1000px;
			overflow: auto;
		}
		.manifestonumber{
			width: 80px;
			margin-right: 20px;
			margin-top: -11px;
			font-size: 36px;
			float: left;
		}
		.manifestoquote{
			width: 800px;
			float: left;
		}
		.manifestoquote p{
			font-size: 20px; line-height: 35px;
		}
		
		.manifesto-scroll{
			margin-top: 180px;
			width: 100%; height: 130px;
			overflow: auto;
		}

	}
	
	@media only screen and (max-width: 1500px) {

		.activetext-page-start{
			font-size: 270px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-work{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-clients{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-awards{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-people{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activeline{
			vertical-align: middle;
			width: 90px;
		}
	
	}
	
	@media only screen and (max-width: 1499px) {

		#activetext{
			top: 165px; left: 55px;
			position: fixed;
			z-index: 2000;
		}

		#rad-logo img{
	width: 92px;
		}

		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 35px; left: 10px;
			width: 270px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}

		.activetext-page-start{
			font-size: 70px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-work{
			font-size: 70px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-clients{
			font-size: 70px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-awards{
			font-size: 70px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-people{
			font-size: 70px; line-height: 80px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activeline{
			vertical-align: middle;
			width: 90px;
		}
	
	}
	
	@media only screen and (max-width: 1024px) {

		#activetext{
			top: 150px; left: 55px;
			position: fixed;
			z-index: 2000;
		}

		#rad-logo img{
	width: 70px;
	height: 47px;
		}

		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 35px; left: 10px;
			width: 250px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}

		.activetext-page-start{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-work{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-clients{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-awards{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-people{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activeline{
			vertical-align: middle;
			width: 90px;
		}

		.eachpage{
			
		}
		.pagepadding{
			padding: 100px 55px 55px 55px;	
		}
		
		.activetext-content{
			display: none;
		}
		
		.page-color{
			display: none;
		}

		.pagepadding-work{
			padding: 0px 0px 55px 0px;	
		}

		#page-about p{
			width: auto;
			font-size: 30px; font-weight: bold;
			margin-bottom: 0;
		}

		.eachpage{
			
		}
		
		.activetext-content{
			display: none;
		}
		
		.page-color{
			display: none;
		}

		#workwrap{
			padding-top: 0px;
			overflow: auto;
		}
		
		.workcontainer{
			margin-right: 0px; margin-bottom: 0px;
			float: left; height: auto;
			width: 25%;
			cursor: pointer;
			overflow: hidden;
			opacity: 0.7;
		
			-webkit-transition: all 0.4s ease-out; 
			-moz-transition: all 0.4s ease-out;
			-o-transition: all 0.4s ease-out;
		}
		
		.workcontainer-info{
			display: none;
			margin-top: 12px;
			font-size: 11px;
		}
		
		ul#socialmedia{
	margin: 0;
	padding: 0;
	position: fixed;
	bottom: 35px;
	left: 0px;
	font-size: 10px;
	line-height: 10px;
	font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
	list-style: none;
	z-index: 2000;
	right: 35px;
	text-align: right;
	text-decoration: none;
		}
		
		ul#awards{
			width:  100%;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 11px; line-height: 16px;
			list-style: none; padding: 0; margin: 0; margin-top: 330px;
			overflow: auto;
		}
		ul#awards li{
			overflow: auto; width: 650px;
			padding-bottom: 8px; margin-bottom: 8px;
			border-bottom: 1px solid #d7d7d7;
		}
		.award-year{
			margin-left: 0px;
			width: 60px; float: left;
		}
		.award-award{
			float: left; width: 90px;
		}
		.award-contest{
			float: left; width: 150px;
		}
		.award-project{
			float: left; width: 180px;
		}
		.award-client{
			float: left; width: 120px;
		}
		
		#page-start p{
			margin-top: 70px;
			font-weight: bold; font-size: 60px;
			display: none;
		}
		
	   .clientstitle-ios{
		   display: none;
		   font-size: 60px; font-weight: bold;
		   margin: 100px 0 25px 52px;
	   }
	
		ul#clients{
			width:  auto;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 16px; line-height: 16px;
			list-style: none; padding: 0; margin: 50px 0 0 55px;
			overflow: auto;
		}
		ul#clients li{
			float: left; width: 280px;
			margin: 0 0 13px 0;
		}
		
	   .peopletitle-ios{
		   display: none;
		   font-size: 60px; font-weight: bold;
		   margin: 25px 0 15px 0px;
	   }

		ul#people{
			list-style: none; padding: 0; margin: 0 0 0 5px;
			font-size: 14px;
		}
		ul#people li{
			padding: 8px 5px 8px 0px;
			overflow: auto;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
			cursor: default;
		}
		ul#people li:hover{
			background: transparent; color: #000;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
		}
		
		ul#people li a{
			color: #000;
			text-decoration: none;
			cursor: pointer;
		}
		ul#people li a:hover{
			text-decoration: underline;
		}
		.people-name{
			display: block;
			font-weight: bold;
			margin-right: 10px;
		}
		.people-title{
			display: block;
			font-style: italic;
		}
		.people-sep{
			display: none;
			margin: 0 5px 0 5px;
			opacity: 1;
		}
		.people-mail{
			opacity: 1;
		}
		.people-phone{
			opacity: 1;
		}
		
		.smbr{
			display: block;
		}
		
		#projecttitle{
			top: 150px; left: 55px;
			position: fixed;
			z-index: 6000;
			font-size: 65px; line-height: 100px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
			display: inline;
		}
		
		.activetext-page-manifesto1, .activetext-page-manifesto2, .activetext-page-manifesto3, .activetext-page-manifesto4, .activetext-page-manifesto5, .activetext-page-manifesto6, .activetext-page-manifesto7, .activetext-page-manifesto8, .activetext-page-manifesto9, .activetext-page-manifesto10{
			font-size: 50px; line-height: 60px;
			font-weight: bold; letter-spacing: -1px;
			pointer-events: none;
		}
		
		.manifestowrap{
			width: 1000px;
			overflow: auto;
		}
		.manifestonumber{
			width: 80px;
			margin-right: 20px;
			margin-top: -8px;
			font-size: 40px;
			float: left;
		}
		.manifestoquote{
			width: 500px;
			float: left;
		}
		.manifestoquote p{
			font-size: 20px; line-height: 35px;
		}
		
		.manifesto-scroll{
			margin-top: 180px;
			width: 100%; height: 130px;
			overflow: auto;
		}
		
	}

	
	@media only screen and (max-width: 799px) {

		#rad-logo{
	top: 15px;
	left: 15px;
	width: 92px;
		}

		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 4px; left: -20px;
			width: 230px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}

		#activetext{
			top: 130px; left: 15px;
			position: fixed;
			z-index: 2000;
		}

		.eachpage{
			
		}
		.pagepadding{
			padding: 100px 55px 55px 55px;	
		}
		
		.activetext-content{
			display: none;
		}
		
		.page-color{
			display: none;
		}

		.pagepadding-work{
			padding: 0px 0px 55px 0px;	
		}

		#page-about p{
	width: auto;
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 0;
		}

		.eachpage{
			
		}
		
		.activetext-content{
			display: none;
		}
		
		.page-color{
			display: none;
		}

		#workwrap{
			padding-top: 0px;
			overflow: auto;
		}
		
		.workcontainer{
			margin-right: 0px; margin-bottom: 0px;
			float: left; height: auto;
			width: 50%;
			cursor: pointer;
			overflow: hidden;
			opacity: 0.7;
		
			-webkit-transition: all 0.4s ease-out; 
			-moz-transition: all 0.4s ease-out;
			-o-transition: all 0.4s ease-out;
		}
		
		.workcontainer-info{
			display: none;
			margin-top: 12px;
			font-size: 11px;
		}
		
		ul#socialmedia{
	margin: 0;
	padding: 0;
	position: fixed;
	bottom: 55px;
	font-size: 10px;
	line-height: 10px;
	font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
	list-style: none;
	z-index: 2000;
	right: 35px;
	text-align: right;
	text-decoration: none;
		}
		
		ul#awards{
			width:  100%;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 11px; line-height: 16px;
			list-style: none; padding: 0; margin: 0; margin-top: 330px;
			overflow: auto;
		}
		ul#awards li{
			overflow: auto; width: 650px;
			padding-bottom: 8px; margin-bottom: 8px;
			border-bottom: 1px solid #d7d7d7;
		}
		.award-year{
			margin-left: 0px;
			width: 60px; float: left;
		}
		.award-award{
			float: left; width: 90px;
		}
		.award-contest{
			float: left; width: 150px;
		}
		.award-project{
			float: left; width: 180px;
		}
		.award-client{
			float: left; width: 120px;
		}
		
		#page-start p{
			margin-top: 70px;
			font-weight: bold; font-size: 60px;
			display: none;
		}
		
	   .clientstitle-ios{
		   display: none;
		   font-size: 60px; font-weight: bold;
		   margin: 100px 0 25px 52px;
	   }
	
		ul#clients{
			width:  auto;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 16px; line-height: 16px;
			list-style: none; padding: 0; margin: 50px 0 0 55px;
			overflow: auto;
		}
		ul#clients li{
			float: left; width: 280px;
			margin: 0 0 13px 0;
		}
		
	   .peopletitle-ios{
		   display: none;
		   font-size: 60px; font-weight: bold;
		   margin: 25px 0 15px 0px;
	   }

		ul#people{
			list-style: none; padding: 0; margin: 0 0 0 5px;
			font-size: 14px;
		}
		ul#people li{
			padding: 8px 5px 8px 0px;
			overflow: auto;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
			cursor: default;
		}
		ul#people li:hover{
			background: transparent; color: #000;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
		}
		
		ul#people li a{
			color: #000;
			text-decoration: none;
			cursor: pointer;
		}
		ul#people li a:hover{
			text-decoration: underline;
		}
		.people-name{
			display: block;
			font-weight: bold;
			margin-right: 10px;
		}
		.people-title{
			display: block;
			font-style: italic;
		}
		.people-sep{
			display: none;
			margin: 0 5px 0 5px;
			opacity: 1;
		}
		.people-mail{
			opacity: 1;
		}
		.people-phone{
			opacity: 1;
		}
		
		.smbr{
			display: block;
		}
	
		#projecttitle{
			top: 150px; left: 55px;
			position: fixed;
			z-index: 6000;
			font-size: 65px; line-height: 100px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
			display: inline;
		}
		
	}

	@media only screen and (max-width: 480px) {

		ul#socialmedia{
	margin: 0;
	padding: 0;
	position: fixed;
	bottom: 15px;
	left: 15px;
	font-size: 10px;
	line-height: 10px;
	font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
	list-style: none;
	z-index: 2000;
	text-decoration: none;
		}

		#activetext{
			top: 130px; left: 15px;
			position: fixed;
			z-index: 2000;
		}
		.activetext-page-start{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-work{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-clients{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-awards{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-people{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
		}
		.activetext-page-manifesto1, .activetext-page-manifesto2, .activetext-page-manifesto3, .activetext-page-manifesto4, .activetext-page-manifesto5, .activetext-page-manifesto6, .activetext-page-manifesto7, .activetext-page-manifesto8, .activetext-page-manifesto9, .activetext-page-manifesto10{
			font-size: 60px; line-height: 70px;
			font-weight: bold; letter-spacing: -1px;
			pointer-events: none;
		}
		.activeline{
			vertical-align: middle;
			width: 80px;
		}

		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 4px; left: -20px;
			width: 198px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}
		#handwriting-scroll{
			display: none;
			opacity: 0;
			position: fixed; bottom: 27px; left: 50%; margin-left: -42px;
			width: 205px; height: 157px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-scroll img{
			width: 202px;
		}

		#page-about p{
			width: 350px;
			font-size: 15px; font-weight: bold;
			margin-bottom: 0;
		}
		#page-about p:first-child{
			margin-top: -20px;
		}

		#workwrap{
			padding-top: 100px;
			overflow: auto;
		}
		
		.workcontainer{
			margin-right: 0px; margin-bottom: 0px;
			float: left; height: auto;
			width: 25%;
			cursor: pointer;
			overflow: hidden;
			opacity: 0.7;
		
			-webkit-transition: all 0.4s ease-out; 
			-moz-transition: all 0.4s ease-out;
			-o-transition: all 0.4s ease-out;
		}
		
		.workcontainer-info{
			display: none;
			margin-top: 12px;
			font-size: 11px;
		}
		
		.pagepadding-work{
			padding: 0;
		}
		
		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 4px; left: -20px;
			width: 198px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}
		#handwriting-scroll{
			display: none;
			opacity: 0;
			position: fixed; bottom: 27px; left: 50%; margin-left: -42px;
			width: 205px; height: 157px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-scroll img{
			width: 202px;
		}
		
	   .clientstitle-ios{
		   display: none;
		   font-size: 30px; font-weight: bold;
		   margin: 100px 0 15px 15px;
	   }
	
		ul#clients{
			width: 320px;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 10px; line-height: 16px;
			list-style: none; padding: 0; margin: 0px 0 0 15px;
			overflow: auto;
		}
		ul#clients li{
			float: left; width: 160px;
			margin: 0 0 8px 0;
		}
		
	   .peopletitle-ios{
		   display: none;
		   font-size: 30px; font-weight: bold;
		   margin: 25px 0 15px 0px;
	   }
	
		ul#people{
			list-style: none; padding: 0; margin: 0 0 0 5px;
			font-size: 9px;
		}
		ul#people li{
			padding: 8px 5px 8px 0px;
			overflow: auto;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
			cursor: default;
		}
		ul#people li:hover{
			background: transparent; color: #000;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
		}
		
		ul#people li a{
			color: #000;
			text-decoration: none;
			cursor: pointer;
		}
		ul#people li a:hover{
			text-decoration: underline;
		}
		.people-name{
			display: block;
			font-weight: bold;
			margin-right: 10px;
		}
		.people-title{
			display: block;
			font-style: italic;
		}
		.people-sep{
			display: none;
			margin: 0 5px 0 5px;
			opacity: 1;
		}
		.people-mail{
			opacity: 1;
		}
		.people-phone{
			opacity: 1;
		}
		
		#rad-logo{
	width: 92px;
	height: 62px;
	position: fixed;
	top: 15px;
	left: 15px;
	cursor: pointer;
	z-index: 95000;
	opacity: 1;			
			/* -webkit-transition: all 0.15s ease-out; 
			-moz-transition: all 0.15s ease-out;
			-o-transition: all 0.15s ease-out; */
		}
		
		.pagepadding{
			padding: 80px 15px 55px 15px;	
		}
		.pagepadding-work{
			padding: 80px 0px 55px 0px;	
		}
		
		#page-start p{
			margin-top: 10px;
			font-weight: bold; font-size: 25px;
			display: none;
		}
		
		#backtothumbs{
			width: 30px; height: 29px;
			position: fixed; left: 50px; bottom: 15px;
			z-index: 6000; cursor: pointer;
		}
		#backtothumbs img{
			width: 100%;
		}
		
		#moreinfo{
			width: 30px; height: 29px;
			position: fixed; left: 15px; bottom: 15px;
			z-index: 6000; cursor: pointer;
		}
		#moreinfo img{
			width: 100%;
		}

		#projecttitle{
			top: 60px; left: 15px;
			position: fixed;
			z-index: 6000;
			font-size: 30px; line-height: 100px;
			font-weight: bold; letter-spacing: -1px;
			white-space: nowrap; pointer-events: none;
			display: inline;
		}
		
		#fullprojectinfo{
			display: none;
			position: fixed; 
			bottom: 60px; left: 20px;
			z-index: 6000;
			color: #000;
		}
		
		#fullprojectinfo-title{
			display: inline-block;
			font-size: 20px; line-height: 25px; font-weight: bold;
			padding: 10px 15px 0px 15px; background: #fff;
			color: #000;
		}
		#fullprojectinfo-tags{
			display: inline-block;
			font-size: 9px; line-height: 11px;
			padding: 10px 15px 10px 15px; background: #fff;
			color: #000;
		}
		
		#fullprojectinfo-content{
			max-width: 280px;
			color: #000;
		}
		#fullprojectinfo-content p{
			margin-top: 6px;
			margin-bottom: 0px;
		}
		#fullprojectinfo-content p{
			display: inline-block;
			font-size: 9px; line-height: 12px;
			padding: 10px 15px 10px 15px; background: #fff;
		}
		
		#fullprojectinfo-arrow img{
			width: 40px;
		}
		
	}

	@media only screen and (max-width: 320px) {

		#page-about p{
			width: 250px;
			font-size: 15px; font-weight: bold;
			margin-bottom: 0;
		}
		#page-about p:first-child{
			margin-top: -20px;
		}

		#workwrap{
			padding-top: 100px;
			overflow: auto;
		}
		
		.workcontainer{
			margin-right: 0px; margin-bottom: 0px;
			float: left; height: auto;
			width: 50%;
			cursor: pointer;
			overflow: hidden;
			opacity: 0.7;
		
			-webkit-transition: all 0.4s ease-out; 
			-moz-transition: all 0.4s ease-out;
			-o-transition: all 0.4s ease-out;
		}
		
		.workcontainer-info{
			display: none;
			margin-top: 12px;
			font-size: 11px;
		}
		
		.pagepadding-work{
			padding: 0;
		}
		
		#handwriting-menu{
			opacity: 0;
			position: fixed; top: 4px; left: -20px;
			width: 198px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-menu img{
			width: 100%;
		}
		#handwriting-scroll{
			display: none;
			opacity: 0;
			position: fixed; bottom: 27px; left: 50%; margin-left: -42px;
			width: 205px; height: 157px;
			z-index: -10; pointer-events: none;
		}
		#handwriting-scroll img{
			width: 202px;
		}
		
	   .clientstitle-ios{
		   display: none;
		   font-size: 30px; font-weight: bold;
		   margin: 100px 0 15px 15px;
	   }
	
		ul#clients{
			width: 280px;
			font-family: 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
			font-size: 10px; line-height: 16px;
			list-style: none; padding: 0; margin: 0px 0 0 15px;
			overflow: auto;
		}
		ul#clients li{
			float: left; width: 140px;
			margin: 0 0 8px 0;
		}
		
	   .peopletitle-ios{
		   display: none;
		   font-size: 30px; font-weight: bold;
		   margin: 25px 0 15px 0px;
	   }
	
	   ul#people{
			list-style: none; padding: 0; margin: 0 0 0 5px;
			font-size: 9px;
		}
		ul#people li{
			padding: 8px 5px 8px 0px;
			overflow: auto;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
			cursor: default;
		}
		ul#people li:hover{
			background: transparent; color: #000;
			-webkit-transition: all 0.5s ease-out; 
			-moz-transition: all 0.5s ease-out;
			-o-transition: all 0.5s ease-out;
		}
		
		ul#people li a{
			color: #000;
			text-decoration: none;
			cursor: pointer;
		}
		ul#people li a:hover{
			text-decoration: underline;
		}
		.people-name{
			display: block;
			font-weight: bold;
			margin-right: 10px;
		}
		.people-title{
			display: block;
			font-style: italic;
		}
		.people-sep{
			display: none;
			margin: 0 5px 0 5px;
			opacity: 1;
		}
		.people-mail{
			opacity: 1;
		}
		.people-phone{
			opacity: 1;
		}
		
		.smbr{
			display: block;
		}
		
	}