html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*begin styles*/
		ol, div, a, img{
			border: none;
			margin: 0;
			padding: 0;
		}
		html, body, #main{
			width: 100%;
			height: 100%;
			margin: 0px;
			font-family: "Raleway";
			/*letter-spacing: 0.5em;*/
			
			font-size: 62.5%;
			overflow: hidden;
/*			font-size:100%;*/
		}
		
		a, a:hover, a:visited{
			text-decoration: none;
			display:block;
		}

		body{
			background-size: 100%;
			
			/*background:#FF6600;*/
		}
		canvas{
			background: #000;
		}
		.copy{
			padding: 2% 2% 2% 2%;
		}

		.fix{
			position: fixed !important;
		}
		.left{
			top:50%;
			left:0;
		}
		.right{
			top:50%;
			right:0;
		}
		
		.column{
			
			position: relative;
			width: 33%;
			top: 50%;
			left: 12%;
			font-size: 180%;
			margin-bottom: 2%;
			background: #EB5C16;
		}
	
		.column .text{
			font-size: 150%;
			font-family: Lato;
			letter-spacing: 0.1em;
			line-height: 152%;

		}

		.fullcolumn{
			
			position: relative;
			width: 88%;
			top: 50%;
			left: 12%;
			font-size: 180%;
			margin-bottom: 2%;
			background: #EB5C16;
		}
		
		.fullcolumn .text{
		    display:inline-block;
		    width:45%;
		    font-size: 180%;
		    margin-right:5%;
		    line-height:130%;
		        vertical-align: top;
		}
		
		.fullcolumn .text.right{
		    width:40%;
		}
		
		.profile{
		    display:block;
		    clear:both;
		    margin-bottom:5%;
		}
		
		.profile b {
        font-weight: bold;
        letter-spacing: 0.05em;
        }
		
		.profile-image{
		    width:20%;
		    float:left;
		    border-radius:100%;
		    margin-right:3%;
		    margin-bottom:3%;
		}
		
		.arrow{
			font-family: 'Arrow', sans-serif;
/*			font-family: 'Monofett', cursive;*/
			font-size: 200px;
			display:block;
			color: #EC008C;
			margin-top: -100px;
			padding: 0px 2%;
			
		}
		.wbmctheme-light{
			color: #fff;
		}
		.wbmctheme-dark{
			color: #000000;
		}
		.wbmctheme-pink{
			color: #EC008C;
		}
		.wbmctheme-orange{
			color: #eb5c16;
		}
		
		
		#projectID{
		    display:none;
			font-family: 'Monoton', cursive;
			font-size: 2500%;

			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
   			 filter: alpha(opacity=50);
    		-khtml-opacity: 0.5;
    		-moz-opacity: 0.5;
    		opacity: 0.5;
			position: fixed;
			right: 1.2%;
			bottom: -2.2%;
			color: #fff;
			line-height: 1em;
			padding-bottom: 1.2%;
		}
		#layer1, #layer2, #layer3,  #layer4, #layer5{
			display: block;
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
		}
		#layer1{
			z-index: 1;
		}
		#layer2{
			z-index: 2;
		} 
		#layer3{
			z-index: 3;
		}
		#layer4{
			display: none;
			z-index: 4;
		}
		#layer5{
			z-index: 5;
		}		
		#holder{
			/*display: none;*/
			/*z-index: 40;*/
			

		}
		#info{
			background: #00A000;
			display: none;
		}
		#info-button{
			padding: 1% 0 0 1%;
		}
		.text-node, .test-node{
			
			font-family: "Helvetica";
			color: #fff;
			font-weight:bold;
			display: block;
			/*border: 2px #C65D09 solid;  */
			margin:0;
			width:auto;
			height:auto;
			/*background: #888;*/
			position: fixed;
			padding: 5px;
		}
		#logo, #logoColor{
			position: absolute;
			width:115px;
			height: 50px;
			display:block;
			bottom: 0;
			right:0;
/*			background-image: url("images/wbmcwm.png");
			background-repeat:no-repeat;*/
			padding: 1.2%  1.5% 0 0;
		}
		#logo{
			display: none;
		}

		#hud{
			position: absolute;
			display: none;
			width: 100%;
			top:0;
			left:0;
			z-index: 4;
			
		}		
		
		#logo img, #logoColor img{
			width: 100%;
			height: 100%;
			position: relative;
			
		}
		
		
		
		#menuBTN, #infoBTN, #resetBTN{

			width:50px;
			height: 50px;
			display:block;
			top: 0;
		}
		.padder{
			left:80px;
			padding: 1.2% 0 0 1.5%;
			float:left;	
		}
		
		
		#infoBTN img, #menuBTN img, #resetBTN img{
			width: 100%;
			height: 100%;
			position: relative;
			
		}
		#main-nav{
			background: url('images/bg2.jpg');
			background-size: cover;
			width: 100%;
			height: 100%;
			z-index: 2;
			position: absolute;
		}
		
		#infoHolder{
			background: #EB5C16;
			width: 100%;
			height: 100%;
		}
		
		.bgimage{
			position: relative;
			
		}
		
		.bgimage-container{
			width: 100%;
			height: 100%;
			position: absolute;		
			overflow: hidden;	
		}
		

		.debug{
			margin: 10px 0;
		}
		.type0{
			color: #fff;
/*			font-family: 'Just Me Again Down Here', cursive;*/
			/*background: #fff;*/
		}		
		.type1{
			color: #EC008C;
			/*font-family: 'Bangers', cursive;*/

			/*background: #fff;*/
		}
		.type2{
			color: #fff200;			/*background: #fff;*/
/*			font-family: 'Quicksand', sans-serif;*/
		}
		
		.priority1{
			font-size:15px;
			line-height: 15px;
			opacity: 0.5;
		}
		.priority2{
			font-size: 15px;
			line-height: 15px;
			opacity: 0.75;
		}
		.priority3{
			font-size: 15px;
			line-height: 15px;
		}
		.priority4{
			font-size: 20px;
			line-height: 15px;
		}
		.priority5{
			font-size: 30px;
			line-height: 25px;
		}
		.priority6{
			font-size: 50px;
			line-height: 40px;
		}
		.priority7{
			font-size: 70px;
			line-height:60px;
		}
		.priority8{
			font-size: 100px;
			line-height: 90px;
		}
		.priority9{
			font-size: 120px;
			line-height: 115px;
		}
		
		.playground{
			background: #777777;
			display: block;
			position: absolute;
			z-index: 4;
		}
			
		.tabStyle-1{
			border-color: #EC008C;
		}
		.tabStyle-2{
			border-color: #fff200;			
		}
		.tabStyle-3{
			border-color: #fff;
		}
			
		ul, .pSelector { margin: 0; padding: 0; list-style: none; }
			
			.carousel-tabs { clear: both; }
			.carousel-active-tab { 
				background-color: #EB5C16;
				border: none; 
			}	
			.carousel-disabled,
			.mr-rotato-disabled { color: #aaa; }

			.projectSlider .carousel-tabs, .pSelector {
				padding: 0;
				margin: 1em 0;
				clear: both;
			}
			.projectSlider .carousel-tabs a, .pSelector a{

			    display: inline-block;
			    width: 32px;
			    height: 18px;
			    text-indent: -9999px;
			    border: 2px #EB5C16 solid;
			    background: url('empty.png');
			}
			.projectSlider .carousel-tabs li, .pSelector li{
			    display: inline-block; 
			    padding: 0 2px;
			}
			
			.projectSlider{
				position: relative;
			}
			.slide, .project, .projectSlider, .slider{
				
				width: 100%;
				height: 100%;
				background-position: center center;
			}
			.carousel-tabs, .pSelector{
				position: absolute;
				display: block;
				margin: 0px;
			
			}
			
			.pSelector{
				position: fixed;
				bottom: 0;
				padding-bottom: 1.2%;
			}
			
			.project-logos, .project-logos img{
				width: 100%;
			}
			
			#debug{
				width: 100%;
				height: 40px;
				background: #EC008C;
				top: 0px;
				position: fixed;
				display: block;
				overflow: scroll;
				opacity: 0.5;
				color: #FF0000;
				font-size: 2em;
			}
			
			.debug-open{
				height: 200px !important;
				color: #fff !important;
				opacity: 1 !important;
			}
			.no-overflow{
				overflow: hidden;
			}
			.links{
				height: 15%;
				padding: 3% 0;
				color: #000;
			}
			.links a{
				display: inline-block;
				text-transform: capitalize;
				color: #000;
				font-size: 130%;
			}
			.bullet{
				padding: 0 0.6em
			}
			h1{
				font-size: 6.3em;	
				padding: 0;
				margin: 0;
			}
			
			
			#loader{
				width: 100%;
				height:100%;
				background: #EB5C16;
				z-index: 3;
				position: absolute;
				
			}
			#loader h1{
				color: #fff;
				font-size: 4em;
				position: relative;	
				width: 100%;
				text-align: center;
				top: 69%;		
			}
			
			/*hide at load*/
			#hud, #overlay{
				display: none;
			}
			.padder span{
				height: 0px;
				width: 0px;
				margin: none;
				padding: none;
				border:  none;
			}