/*dontforgetcolor: #7a86ab;*/
/*RED - #d80000; */
/*GRAY- #999999; */

@font-face {
	font-family: 'Avenir';
	src: url('https://aaronlam.com/common/fonts/Avenir.ttf');
}

	BODY {
		font-family: 'Avenir';
		color: white;
		background-color: black;
		margin: 0;
		padding-top: 0px;
		display: flex;
		width: 100%;
	    min-height: 100%;
	    flex-direction: column;
	    letter-spacing: -.5px;    
	}


	.textbox {
	/*	display:block; */
		width:100%;
		margin: auto;
	}


	.red {
		color: #d80000;
	}
	
	.gray {
		color: #999999;
	}
	
	.italic {
		font-style: italic;
	}

	.title {
		font-weight: 900;
		font-style: italic;
		font-size: 60px;
		padding-top: 30%;
	}

	.definition {
		padding-left: 40px;
		font-family: 'Times';
		font-size: 18px;
		color: white;
	}

	.case {
		padding-left: 20px;
		font-weight: 900;
		font-size: 30px;
		color: white;
	}
	
	.def {
		padding-left: 20px;
		font-style: normal;
		font-weight: 100;		
		font-size: 24px;
		color: #999999;
	}

	.sizzle a {
		color: #d80000;
		text-decoration: none;
		font-weight: 900;
		font-style: italic;
	}

	#back_text {
		position: fixed;
		top: 0;
		right: 0;
		z-index: -1;
		width:100%;
		height:100%;
	}
	
	#front_text {
		position: relative;
		top:100%;
		z-index: 1;
		width:95%;
		height:200%;
	}



/*------------------------RESUME-------------------------*/

		.logo-box {
			display: inline-block;
			width:300px;
			text-align: center;
		}

		.logo {
			width:150px;
			height:auto;
		}

		.tag {
			font-size: 10px;
			color:white;
		}

		.writer{
			font-size: 80px;
			font-weight: 900;
			font-style: italic;
			width: 100%;
			color:#999999;
			text-align: left;
			margin-left: 2%;
		}

		.static-logo {
			position: fixed;
			text-align: right;
			width:100%;

			right:0;
			bottom:0;
			z-index: -1;
		}
		
		.col-logo {
			text-align: right;
			width:100%;
			margin-top: -40px;
		}
		
		.col1 {
			display: inline-block;
			vertical-align: top;	
			text-align: center;
			width: 30%;
			min-width: 200px;
			height: 100%;
			background-color: black;
		}		
		
		.col2 {
			display: inline-block;
			vertical-align: top;	
			text-align: center;
			width: 40%;
			height: 100%;
			color: white;
			margin-left: -4px;
			background-color: black;
		}

		.col3 {
			display: inline-block;
			vertical-align: top;				
			text-align: center;
			width: 30%;
			height: 100%;
			color: white;
			margin-left: -4px;
			background-color: black; 
		}

		.heading {
			font-family: Avenir;
			font-size:32px;
			color: #d80000;
			font-style: italic;
			font-weight: bold;
			text-transform: uppercase;
			display: inline-block;
			width:80%;
		}
		
		.heading.c {
			display: block;
			text-align: center;
		}

		.entry {
			display: inline-block;
			color: white;
			font-size: .8em;
			vertical-align: middle;
		}
		
		.entry.b {
			color:white;
			margin-left: -10px;
		}
		
		.listing-container {
			width: 100%;
			text-align: center;
			padding-bottom: 20px;
		}
		
		.listing {
			margin-left: 40px;
			text-align: left;
		}

		.listing.pad {
			padding: 0 10px 0 20px;
		}
		
		.icon {
			display:inline-block;
			width:60px;
			margin:0 -10px 0 -10px;
			text-align: center;
		}
		
		.fa.w {
			color: white;
			padding: 0 10px 0 20px;
			vertical-align: middle;
		}

		.fa.b {
			color: white;
			padding: 0 10px 0 0;
			vertical-align: middle;
		}

		.projects {
			display:inline-block;
			width: 100%;
			text-align: center;
		
		}
		
		.resume {
			display:inline-block;
			text-align: left;
			padding:10px 20px;
		}
		
		.resume.work {
			width:135px;
		}
		
		.resume.edu {
			
		}
		
		.education {
			border:1px solid blue;
		}

		.sb-row {
			display:inline-block;
			text-align: left;
			padding:0 10px;
		}

		.banner {
			height:130px;
			width:auto;
		}

		.line-ver {
			position:absolute;
			height: 704px;
			width: 4px;
			background-color: white;
			top:32;
			margin: 0 0 0 -37px;
		}

		.line-hor {

			height: 1px;
			width: 100%;
			background-color: #999999;
			margin: -5px 0 5px 0;
			opacity: .4;
		}

		.titles {
			font-size: 12px;
		}

		.titles.b {
			font-weight: bold;
		}

		#circle {
			width: 20px;
			height: 20px;
			background: white;
			-moz-border-radius: 50px;
			-webkit-border-radius: 50px;
			border-radius: 50px;
			display: inline-block;
		}
		
		#circle-sm {
			width: 10px;
			height: 10px;
			background: #d80000;
			-moz-border-radius: 50px;
			-webkit-border-radius: 50px;
			border-radius: 50px;
			display: inline-block;
		}
		
		.circle-container {
			text-align: center;
			margin: -30px 0 10px 0;
		}

		#chevron {
			position: relative;
			text-align: center;
			padding: 12px;
			margin-bottom: 6px;
			height: 70px;
			width: 226px;
			z-index: 0;
		}
		
		#chevron:before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			height: 90%;
			width: 100%;
			-webkit-transform: skew(0deg, 0deg);
			-moz-transform: skew(0deg, 0deg); -ms-transform: skew(0deg, 0deg);
			-o-transform: skew(0deg, 0deg);
			transform: skew(0deg, 0deg);
			z-index: -1;
		}

		#chevron:after {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			height: 120%;
			width: 100%;
			-webkit-transform: skew(0deg, -6deg);
			-moz-transform: skew(0deg, -6deg);
			-ms-transform: skew(0deg, -6deg);
			-o-transform: skew(0deg, -6deg);
			transform: skew(0deg, -6deg);
			z-index: -1;
		}​
		
		
		.thumbs {
			width:300;
			height:174;
			margin:10;
			border:1px solid white;
		}
		.bl {
			text-align: center;
		}
		
		.lb {
			text-align: left;
			width:1050px;
		}
		
		.line {
			border-top:1px solid white;
		}
		
		.en {
			width:333px;
			margin: 0 auto;
			display: inline-block;
			border:1px solid white;
		
		}
		
		.bio-title {
			font-weight: 900;
			font-style: italic;
		}
		
		@media (max-width: 767px) { 
	.col1 { display:none; }
}