/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
	color: #222;
}

body {
	font-size: 1em;
	line-height: 1.4;
}

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

img {
	vertical-align: middle;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

textarea {
	resize: vertical;
}

.chromeframe {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}


/* ==========================================================================
   Web Fonts
   ========================================================================== */

/*	db   d8b   db d88888b d8888b.   d88888b  .d88b.  d8b   db d888888b .d8888. */
/*	88   I8I   88 88'     88  `8D   88'     .8P  Y8. 888o  88 `~~88~~' 88'  YP */
/*	88   I8I   88 88ooooo 88oooY'   88ooo   88    88 88V8o 88    88    `8bo.   */
/*	Y8   I8I   88 88~~~~~ 88~~~b.   88~~~   88    88 88 V8o88    88      `Y8b. */
/*	`8b d8'8b d8' 88.     88   8D   88      `8b  d8' 88  V888    88    db   8D */
/*	 `8b8' `8d8'  Y88888P Y8888P'   YP       `Y88P'  VP   V8P    YP    `8888Y' */
/*	                                                                           */
/*	                                                                           */
/*
@font-face {
    font-family: 'Alef';
    src: url('Alef/Alef-bold.eot');
    src: url('Alef/Alef-bold.eot?#iefix') format('embedded-opentype'),
         url('Alef/Alef-bold.woff') format('woff'),
         url('Alef/Alef-bold.ttf') format('truetype'),
         url('Alef/Alef-bold.svg#alefbold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'Alef';
    src: url('Alef/Alef-regular.eot');
    src: url('Alef/Alef-regular.eot?#iefix') format('embedded-opentype'),
         url('Alef/Alef-regular.woff') format('woff'),
         url('Alef/Alef-regular.ttf') format('truetype'),
         url('Alef/Alef-regular.svg#alefregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/*	.88b  d88.  .d8b.  d888888b d8b   db */
/*	88'YbdP`88 d8' `8b   `88'   888o  88 */
/*	88  88  88 88ooo88    88    88V8o 88 */
/*	88  88  88 88~~~88    88    88 V8o88 */
/*	88  88  88 88   88   .88.   88  V888 */
/*	YP  YP  YP YP   YP Y888888P VP   V8P */
/*	                                     */
/*	                                     */

body {
	font-family: "proxima-nova", sans-serif;
	font-weight: 300;
	background: #FFF;
	border-top: 3px solid #222;
}

body.dark {
	border-top: 3px solid #DDD;
	background: #111;
	color: #DDD;
}


footer.main {
	padding: 20px;
	text-align: center;
	font-size: 75%;
}


a {
	color: #888;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}


/* ==========================================================================
   Main Header
   ========================================================================== */

/*	.88b  d88.  .d8b.  d888888b d8b   db   db   db d88888b  .d8b.  d8888b. d88888b d8888b. */
/*	88'YbdP`88 d8' `8b   `88'   888o  88   88   88 88'     d8' `8b 88  `8D 88'     88  `8D */
/*	88  88  88 88ooo88    88    88V8o 88   88ooo88 88ooooo 88ooo88 88   88 88ooooo 88oobY' */
/*	88  88  88 88~~~88    88    88 V8o88   88~~~88 88~~~~~ 88~~~88 88   88 88~~~~~ 88`8b   */
/*	88  88  88 88   88   .88.   88  V888   88   88 88.     88   88 88  .8D 88.     88 `88. */
/*	YP  YP  YP YP   YP Y888888P VP   V8P   YP   YP Y88888P YP   YP Y8888D' Y88888P 88   YD */
/*	                                                                                       */
/*	                                                                                       */

header.main {
	max-width: 1024px;
	margin: 0 auto;
}


header.main nav ul { text-align: center; padding: 0; /*background: #333;*/
/*            box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);
	   -mov-box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);
	-webkit-box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);*/
}
header.main nav ul li { display: inline; }
header.main nav ul li a { display: inline; text-decoration: none; color: #222; margin: 10px 25px;
/*            transition: all .2s;
	   -moz-transition: all .2s;
	-webkit-transition: all .2s;
		 -o-transition: all .2s;*/
}
header.main nav ul li a:hover { text-decoration: underline;
	/*background: #FFF; text-decoration: none; color: #FFF; text-shadow: 0px 2px 2px rgba(0,0,0,0.5);*/
/*            box-shadow: inset 0px -100px 100px -100px rgba(0,0,0,0.5);
	   -mov-box-shadow: inset 0px -100px 100px -100px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 0px -100px 100px -100px rgba(0,0,0,0.5);*/
}

body.dark header.main nav ul li a { color: #DDD; }



/* ==========================================================================
   Portfolio Navigation
   ========================================================================== */

/*	d8888b.  .d88b.  d8888b. d888888b d88888b  .d88b.  db      d888888b  .d88b.    d8b   db  .d8b.  db    db */
/*	88  `8D .8P  Y8. 88  `8D `~~88~~' 88'     .8P  Y8. 88        `88'   .8P  Y8.   888o  88 d8' `8b 88    88 */
/*	88oodD' 88    88 88oobY'    88    88ooo   88    88 88         88    88    88   88V8o 88 88ooo88 Y8    8P */
/*	88~~~   88    88 88`8b      88    88~~~   88    88 88         88    88    88   88 V8o88 88~~~88 `8b  d8' */
/*	88      `8b  d8' 88 `88.    88    88      `8b  d8' 88booo.   .88.   `8b  d8'   88  V888 88   88  `8bd8'  */
/*	88       `Y88P'  88   YD    YP    YP       `Y88P'  Y88888P Y888888P  `Y88P'    VP   V8P YP   YP    YP    */
/*	                                                                                                         */
/*	                                                                                                         */

nav.projects h1 {
	text-align: center;
	/*display: inline-block;*/
	/*background-repeat: no-repeat;*/
	/*background-image: url('/img/symbol.gif');*/
	/*background-size: 100%;*/
	/*min-width: 160px;*/
	/*max-width: 1280px;*/
	width: 100%;
	/*height: 160px;*/
	margin: 50px auto 25px auto;
	/*padding: 60px 0px 0px 160px;*/
	/*padding-left 160px;*/
	/*text-align: */
	/*position: fixed;*/
	/*top: 5px;*/
	/*left: 5px;*/
	/*float: left;*/
	/*margin: ;*/
	/*padding: 0;*/
			transition: margin .3s;
	-webkit-transition: margin .3s;
	   -moz-transition: margin .3s;
	    -ms-transition: margin .3s;
		 -o-transition: margin .3s;
}
nav.projects h1 img.svg {
	/*height: 100%;*/
	position: relative;
}

nav.projects h1 img.svg { width: 78px; height: 78px; margin: 7px; }
nav.projects h1 img.gif { width: 120px; }

nav.projects h1 img { /*width: 15%; min-width: 160px; max-*/ filter: alpha(opacity=30); opacity: 0.3; 
			transition: all .3s;
	   -moz-transition: all .3s;
	-webkit-transition: all .3s;
		 -o-transition: all .3s;
}
nav.projects h1 a:hover img { filter: alpha(opacity=100); opacity: 1; }
nav.projects h1 img.leafy { width: 52.5%; max-width: 560px; }
nav.projects h1 a { color: #FFFFFF; text-decoration: none; line-height: 0px; font-weight: 300; font-size: 50%;
			transition: all .3s;
	   -moz-transition: all .3s;
	-webkit-transition: all .3s;
		 -o-transition: all .3s;
}
nav.projects h1 a:hover { color: #000000; text-decoration: none; line-height: 50px; font-size: 100%; }
body.dark nav.projects h1 a { color: #111; }
body.dark nav.projects h1 a:hover { color: #FFF; }
body.dark nav.projects h1 img { filter: alpha(opacity=30); opacity: 0.3; }
body.dark nav.projects h1 a:hover img { filter: alpha(opacity=100); opacity: 1; }

nav.projects { /*background: #FFF;*/
	max-width: 1280px; margin: 0 auto; 
/*            box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);
	   -mov-box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);
	-webkit-box-shadow: inset 0px 15px 15px -15px rgba(0,0,0,1);*/
}

nav.projects ul { padding: 0px 0 20px 0; }
nav.projects ul li.SquareThumb { display: inline-block; float: left; width: 31.3333%; margin: 1%; 
			transition: all .3s;
	   -moz-transition: all .3s;
	-webkit-transition: all .3s;
		 -o-transition: all .3s;
}
nav.projects ul li.BannerThumb { display: block; width: 98%; margin: 1%; }
nav.projects ul li article {
	position: relative;
	top: 0;
	width: 100%;
	overflow: hidden;
	border-radius: 20px;
/*            box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
	   -mov-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);*/
}
nav.projects ul li article div { width: 100%; height: 100%; }
nav.projects ul li article img { width: 100%; border-radius: 20px; }
body.dark nav.projects ul li article img { filter: alpha(opacity=75); opacity: 0.75; }
nav.projects ul li.BannerThumb article img {  }
/*nav.projects ul li article a {
	position: absolute; 
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
}*/
nav.projects ul li article a h2 {
	background: rgba(255,255,255,.75);
	position: absolute; 
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	color: #333;
	font-size: 100%;
	margin: 0;
	padding: 10px;
	opacity: 0;
	border-radius: 20px;
	font-weight: 300;
			transition: opacity .3s;
	   -moz-transition: opacity .3s;
	-webkit-transition: opacity .3s;
		 -o-transition: opacity .3s;
}
.no-rgba nav.projects ul li article a h2 { background: url('rgba.php?r=255&g=255&b=255&a=75'); }
.no-opacity nav.projects ul li article a h2 { display: none; }
body.dark nav.projects ul li article a h2 {
	color: #DDD; 
	background: rgba(17,17,17,.75); 
}
.no-rgba body.dark nav.projects ul li article a h2 { background: url('rgba.php?r=17&g=17&b=17&a=75'); }
.no-opacity nav.projects ul li article a:hover h2 { display: block; }
nav.projects ul li article a:hover h2 { opacity: 1; }


/* ==========================================================================
   Pages & Portfolio Project
   ========================================================================== */

/*	d8888b. d8888b.  .d88b.     d88b d88888b  .o88b. d888888b */
/*	88  `8D 88  `8D .8P  Y8.    `8P' 88'     d8P  Y8 `~~88~~' */
/*	88oodD' 88oobY' 88    88     88  88ooooo 8P         88    */
/*	88~~~   88`8b   88    88     88  88~~~~~ 8b         88    */
/*	88      88 `88. `8b  d8' db. 88  88.     Y8b  d8    88    */
/*	88      88   YD  `Y88P'  Y8888P  Y88888P  `Y88P'    YP    */
/*	                                                          */
/*	                                                          */

article.page, article.project {
	max-width: 1280px;
	margin: 0 auto;
	padding: 1%;
}

/*article.project { background: #111; color: #DDD; }*/

article.page footer, article.project footer { margin: 20px 0; font-size: 90%; }
article.page footer .tags, article.project footer .tags { color: #666; }
article.page footer .tags a, article.project footer .tags a { color: inherit; text-decoration: none; }
article.page footer .tags a:hover, article.project footer .tags a:hover { text-decoration: underline; }

.iframewrapper { position: relative; }
.iframewrapper .ratio { display: block; width: 100%; height: auto; }
.iframewrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

dl.credits { clear: both; margin: 0 0; }
dl.credits dt { display: inline; font-weight: bold; }
dl.credits dd { display: inline; margin: 0; }


/* ==========================================================================
   Slideshow
   ========================================================================== */

/*	.d8888. db      d888888b d8888b. d88888b .d8888. db   db  .d88b.  db   d8b   db */
/*	88'  YP 88        `88'   88  `8D 88'     88'  YP 88   88 .8P  Y8. 88   I8I   88 */
/*	`8bo.   88         88    88   88 88ooooo `8bo.   88ooo88 88    88 88   I8I   88 */
/*	  `Y8b. 88         88    88   88 88~~~~~   `Y8b. 88~~~88 88    88 Y8   I8I   88 */
/*	db   8D 88booo.   .88.   88  .8D 88.     db   8D 88   88 `8b  d8' `8b d8'8b d8' */
/*	`8888Y' Y88888P Y888888P Y8888D' Y88888P `8888Y' YP   YP  `Y88P'   `8b8' `8d8'  */
/*	                                                                                */
/*	                                                                                */

div.slideshow { position: relative;  width: 83.333%; margin: 0 auto; 
-webkit-transition: width 0.3s;
   -moz-transition: width 0.3s;
	-ms-transition: width 0.3s;
	 -o-transition: width 0.3s;
		transition: width 0.3s;
}
div.slideshow div.slides { overflow: hidden; width: 100%; position: relative; }
div.slideshow .ratio { display: block; width: 100%; height: auto; visibility: hidden; }
div.slideshow div.slide { position: absolute; top: 0; width: 100%; bottom: 10px; }
div.slideshow div.slide img { width: 100%; height: auto; }
div.slideshow a.prev,
div.slideshow a.next { 
	cursor: pointer;
	position: absolute; top: 0; bottom: 10px; width: 60%; background: transparent; overflow: hidden;
/*			transition: left .3s, right .3s, opacity .5s;
	   -moz-transition: left .3s, right .3s, opacity .5s;
	-webkit-transition: left .3s, right .3s, opacity .5s;
		 -o-transition: left .3s, right .3s, opacity .5s;*/
;}
div.slideshow a.prev       { left:  -10%; filter: alpha(opacity=50); opacity: .5; }
div.slideshow a.next       { right: -10%; filter: alpha(opacity=50); opacity: .5; }
div.slideshow a.prev:hover { /*left:    0;*/  filter: alpha(opacity=100); opacity: 1; }
div.slideshow a.next:hover { /*right:   0;*/  filter: alpha(opacity=100); opacity: 1; }
div.slideshow a.prev div,
div.slideshow a.next div {
	position: absolute;
	width: 50%;
	top: 50%;
	font-size: 175%;
	/*text-align: center;*/
	/*color: #FFFFFF;*/
	line-height: 0px; 
-webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
	 -moz-user-select: none;
	  -ms-user-select: none;
		  user-select: none;
}
div.slideshow a.prev div { left: 8.333%; text-align: left; /*padding-left: 4.17%;*/ }
div.slideshow a.next div { right: 8.333%; text-align: right; /*padding-right: 4.17%;*/ }

div.slideshow div.slidecircles { text-align: center; }
div.slideshow div.slidecircles div { cursor: pointer; border: 1px solid #999999; background: transparent; border-radius: 10px; width: 10px; height: 10px; display: inline-block; margin: 1px 2px; }

div.slideshow div.slidecircles div.selected { background: #999999; }
div.slideshow div.slidecircles div:hover { border: 1px solid #999999; background: #999999; border-radius: 10px; width: 10px; height: 10px; display: inline-block; margin: 1px 2px; }


/* ==========================================================================
   Media Queries
   ========================================================================== */

/*	.88b  d88. d88888b d8888b. d888888b  .d8b.     .d88b.  db    db d88888b d8888b. d888888b d88888b .d8888. */
/*	88'YbdP`88 88'     88  `8D   `88'   d8' `8b   .8P  Y8. 88    88 88'     88  `8D   `88'   88'     88'  YP */
/*	88  88  88 88ooooo 88   88    88    88ooo88   88    88 88    88 88ooooo 88oobY'    88    88ooooo `8bo.   */
/*	88  88  88 88~~~~~ 88   88    88    88~~~88   88    88 88    88 88~~~~~ 88`8b      88    88~~~~~   `Y8b. */
/*	88  88  88 88.     88  .8D   .88.   88   88   `8P  d8' 88b  d88 88.     88 `88.   .88.   88.     db   8D */
/*	YP  YP  YP Y88888P Y8888D' Y888888P YP   YP    `Y88'Y8 ~Y8888P' Y88888P 88   YD Y888888P Y88888P `8888Y' */
/*	                                                                                                         */
/*	                                                                                                         */

@media only screen and (min-width: 768px) {

	nav.projects ul li.SquareThumb { display: inline-block; float: left; width: 23%; margin: 1%; }

	nav.projects h1 { margin: 75px auto 50px auto; }

	nav.projects h1 img.svg { width: 91px; height: 92px; margin: 8px; }
	nav.projects h1 img { width: 140px; }
	
	div.slideshow a.prev div,
	div.slideshow a.next div { font-size: 300%; }

	
}

@media only screen and (min-width: 1024px) {

	nav.projects ul li.SquareThumb { display: inline-block; float: left; width: 18%; margin: 1%; }

	nav.projects h1 { margin: 100px auto 50px auto; }

	nav.projects h1 img.svg { width: 105px; height: 105px; margin: 10px; }
	nav.projects h1 img { width: 160px; }

	div.slideshow a.prev div,
	div.slideshow a.next div { font-size: 300%; }


}

@media only screen and (min-width: 1536px) {

	div.slideshow { width: 100%; }

}

@media print,
	   (-o-min-device-pixel-ratio: 5/4),
	   (-webkit-min-device-pixel-ratio: 1.25),
	   (min-resolution: 120dpi) {

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*	db   db d88888b db      d8888b. d88888b d8888b. .d8888. */
/*	88   88 88'     88      88  `8D 88'     88  `8D 88'  YP */
/*	88ooo88 88ooooo 88      88oodD' 88ooooo 88oobY' `8bo.   */
/*	88~~~88 88~~~~~ 88      88~~~   88~~~~~ 88`8b     `Y8b. */
/*	88   88 88.     88booo. 88      88.     88 `88. db   8D */
/*	YP   YP Y88888P Y88888P 88      Y88888P 88   YD `8888Y' */
/*	                                                        */
/*	                                                        */

.ir {
	background-color: transparent;
	border: 0;
	overflow: hidden;
	*text-indent: -9999px;
}

.ir:before {
	content: "";
	display: block;
	width: 0;
	height: 150%;
}

.hidden {
	display: none !important;
	visibility: hidden;
}

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

.invisible {
	visibility: hidden;
}

.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

/*	d8888b. d8888b. d888888b d8b   db d888888b */
/*	88  `8D 88  `8D   `88'   888o  88 `~~88~~' */
/*	88oodD' 88oobY'    88    88V8o 88    88    */
/*	88~~~   88`8b      88    88 V8o88    88    */
/*	88      88 `88.   .88.   88  V888    88    */
/*	88      88   YD Y888888P VP   V8P    YP    */
/*	                                           */
/*	                                           */

@media print {
	* {
		background: transparent !important;
		color: #000 !important; /* Black prints faster: h5bp.com/s */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links for images, or javascript/internal links
	 */

	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead {
		display: table-header-group; /* h5bp.com/t */
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	@page {
		margin: 0.5cm;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}