@width_main: 850px;

@text_orange_dark: #231605;
@text_orange: #ff9200;

@text_blue_black: #151520;
@text_blue_dark: #1e1e25;
@text_blue_light: #c7c6fb;

body {
	font-family: "Arial", sans-serif;
	color: @text_blue_light;
	font-size: 13pt;
	background-color: #424242;
	background-image: url('../img/bg2.jpg');
	background-position-x: center;
}

#wrap {
	position: relative;
	width: @width_main;
	margin: 0px auto;
	background: url('../img/bg2_top.jpg') no-repeat;
	/*background:rgba(255,255,255,0.2);*/
}

h1, h2, h3, h4 {
	text-shadow: 0px 1px 5px @text_blue_dark;
}

	h1, h2 {
		margin-top: 40px;
		font-size: 26pt;
	}
	
	h3 {
		margin-top: 45px;
		font-size: 21pt;
		margin-bottom: -10px;
	}
	
	h4 {
		margin-top: 25px;
		font-size: 18pt;
	}

blockquote {
	font-style: italic;
	margin-left: 11px;
	padding-left: 11px;
	border-left: 1px solid rgba(30,30,38,0.5);
	font-size: 90%;
}

a {
	color: #c7c6fb;
	text-shadow: 0px 1px 3px #231605;
	font-weight: bold;
}

	a:hover {
		color: #ff9200;
		text-shadow: 0px 1px 3px #231605;
	}

em {
	color: #ff9200;
	font-style: inherit;
	text-shadow: 0px 1px 3px #231605;
}

	h1 em,
	h2 em,
	h3 em {
		text-shadow: 0px 1px 5px #231605;
	}

small {
	font-size: 90%;
}

p,
blockquote,
iframe,
.p-like {
	margin-top: 30px;
	margin-bottom: 30px;
	line-height: 150%;
	text-shadow: 0px 1px 3px #1e1e25;
}
	
	p img {
		margin-top: 7px;
		margin-bottom: 7px;
	}
	
	.source {
		margin: -30px 0px 30px 0px;
		font-size: 90%;
		font-style: italic;
	}

	.quote_source {
		margin-top: -20px;
		margin-left: 23px;
		font-style: normal;
	}
	
li {
	margin-top: 10px;
	margin-bottom: 10px;
}

.plate {
	color: #1e1e25;
	background-color: #d3cffe;
	background-image: url('../img/bg_grad_wide.png');
	border-radius: 7px 7px 7px 7px;
	text-decoration: none;
	text-shadow: 0px 1px 0px white;
	-webkit-box-shadow: 0px 1px 12px #1e1e25;
	-moz-box-shadow: 0px 1px 12px #1e1e25;
	box-shadow: 0px 1px 12px #1e1e25;
	
	* {
		text-shadow:inherit;
	}
	
	a {
		color:inherit;
	
		&:hover {
			color: #ff6400;
			text-shadow: inherit;
		}
	}
	
	em {
		color: #ff6400;
	}
}

a.plate:hover {
	/*background-color:#ff9200;
	background-image:url('../img/bg_grad_active.png');*/
	-webkit-box-shadow:0px 1px 12px #231605;
	-moz-box-shadow:0px 1px 12px #231605;
	box-shadow: 0px 1px 12px #231605;
}

.darkplate {
	/*color:#c7c6fb;*/
	color: #d3cffe;
	text-shadow: 0px 0px 4px black;
	background-color: #1e1e25;
	background-image: url('../img/bg_grad_wide_dark.png');

	a {
		color: inherit;
		
		&:hover {
			color: #ff9200;
		}
	}
}

.darktext {
	color: @text_blue_black;
	text-decoration: none;
	text-shadow: 0px 1px 0px #626262;
	
	a {
		color: inherit;
		text-shadow: inherit;
		
		&:hover {
			color: @text_orange;
			text-shadow: 0px -1px 0px black;
		}
	}
}

	a.darktext:hover {
		color: @text_orange;
		text-shadow: 0px 1px 1px @text_orange_dark, 0px -1px 1px @text_orange_dark;
	}

.boxshadow {
	border-radius: 3px;
	-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.5);
	
	iframe {
		margin: 0px;
	}
}

/* H E A D E R */

#header {
	position: relative;
	height: 175px;
	
	#raquo {
		display: inline-block;
		position: absolute;
			left: -60px;
			top: 32px;
		margin-left: 50%;
		width: 120px;
		height: 120px;
		background: url('../img/raquo.png');
		z-index: 2;
	}
	
		#raquo:hover {
			background: url('../img/raquo_active.png');
		}
	
	#header_plate {
		position: absolute;
			top: 63px;
			left: -1px;
		width: @width_main + 2px;
		height: 54px;
		background-color: #1e1e25;
		background-image: url('../img/bg_grad_wide_dark.png');
	}
	
	.header_side {
		display: inline-block;
		position: absolute;
			top: 56px;
		width: 340px;
		font-size: 13.5pt;
	}
		
		#header_left {
			left: -10px;
			text-align:right;
		}
		
		#header_right {
			right: -10px;
			padding-left: 40px; /* solely to aid email selection */
		}
		
		.header_side a {
			display: inline-block;
			position: relative;
			padding: 24px 4px;
			margin: 0px 10px;
			text-decoration: none;
		}
}



/* FOOTER */

#footer {
	margin: 45px 0px 35px 0px;
	text-align: center;
	font-weight: bold;
	
	h2 {
		margin-top: 0px;
		text-shadow: inherit;
	}
}



/* HOME */

.home {
	margin-top: 10px;
	
	h1 {
		margin: 0px 0px 30px 0px;
		text-align: center;
	}
	
	h2 {
		margin: 15px 0px 30px 0px;
		text-align: center;
	}
	
	.text {
		margin: -10px 0px 45px 0px;
		font-size: 16pt;
	
		p {
			margin: 15px 0px;
			text-align: justify;
			/*text-shadow:0px 0px 10px black;*/
		
			em {
				font-size: 110%;
			}
		}
	}
	
}
		
.thumb_gallery {
	margin: 0px -50px 0px 0px;

	.thumb {
		float:left;
		display: inline-block;
		margin-right: 50px;
		margin-bottom: 45px;
		text-decoration: none;
		font-size: 13pt;
		font-weight: bold;
		background-image: url('../img/bg_grad_dark.png');
		text-shadow: 0px 0px 4px black;
		
		.image {
			display: block;
			border-radius: 7px 7px 0px 0px;
			height: 180px;
			width: 250px;
		}
		
		.label {
			display: block;
			padding: 9px 0px 6px 0px;
			border-radius: 0px 0px 7px 7px;
			margin-bottom: 0px;
			text-align: center;
			/*color: #ff9200;*/
		}
		
		&:hover .label {
			color: #231605;
			text-shadow: 0px 1px 0px rgba(255,255,255,0.6);
			background-color: #ff9200;
			background-image: url('../img/bg_grad_active.png');
		}
	}
}

#previously {
	margin-left: 75px;
	font-size: 15pt;
	
	strong {
		display: inline-block;
		margin-bottom: 2px;
		font-size: 16pt;
		
		small {
			font-size: 13pt;
			font-weight: normal;
			font-style: italic;
		}
	}
}



/* PROJECT */

.content {
	background: transparent;
	text-shadow: 0px 1px 0px white !important;
	
	.head {
		background-color: #1e1e25;
		background-image: url('../img/bg_grad_wide_dark.png');
		padding: 30px 50px 30px 50px;
		border-radius: 7px 7px 0px 0px;
	}
	
	.body {
		background-color: #d3cffe;
		background-image: url('../img/bg_grad_wide.png');
		padding: 20px 50px 20px 50px;
		border-radius: 0px 0px 7px 7px;
	}
	
	.title {
		float: left;
		margin: 0px 0px 0px 0px;
		text-align: center;
		color: #c7c6fb;
		text-shadow: 0px 0px 8px black;
	}
	
	.sections {
		position: relative;
			top: 5px;
		float: right;
		text-align: right;
		margin: 0px;
	
		li {
			display: inline;
			
			a {
				display: inline-block;
				padding: 6px 10px 4px 10px;
				color: #c7c6fb;
				text-shadow: 0px 0px 4px black;
				font-weight: bold;
				text-decoration: none;
				border-radius: 5px;
			
				&:hover {
					background: url('../img/bg_grad_active.png') 120px 0px;
					color: inherit;
					text-shadow: 0px 1px 0px rgba(255,255,255,0.6);
				}
				
				&.selected,
				&.selected:hover {
					background: url('../img/bg_grad.png') 0px -2px;
					background-color: #c7c6fb; 
					color: #1e1e25;
					text-shadow: 0px 1px 0px rgba(255,255,255,0.6);
					box-shadow: inset 0px 1px 4px #1e1e25;
				}
			}
		}
	}
	
		
	.description {
		margin: -20px -50px 20px -50px;
		padding: 20px 50px 20px 50px;
		line-height: 170%;
		background: rgba(255,255,255,0.5);
	
		.link {
			font-weight: bold;
			font-size: 110%;
			
			.icon {
				position: relative;
					top: 2px;
				margin-right: 2px;
				width: 16px;
				height: 16px;
			}
		}
		
		.task {
			position: relative;
			padding-left: 70px;
			font-size: 90%;
			font-style: italic;
			
			span {
				position: absolute;
					top: 0px;
					left: 23px;
				font-weight: bold;
				font-style: normal;
			}
		}
	}
	
	&.notes {
		
		.description {
			margin-top: 20px;
			margin-bottom: -20px;
			border-radius: 0px 0px 7px 7px;
		}
		
		p {
			margin-top: 20px;
			margin-bottom: 20px;
		}
		
		.note_link {
			display: inline-block;
			margin: 10px 0px;
			font-size: 120%;
		}
	}
}