@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'TeXGyreAdventorRegular';
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.eot');
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.woff') format('woff'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.ttf') format('truetype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.svg#TeXGyreAdventorRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TeXGyreAdventorItalic';
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-italic-webfont.eot');
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-italic-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-italic-webfont.woff') format('woff'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-italic-webfont.ttf') format('truetype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-italic-webfont.svg#TeXGyreAdventorItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'TeXGyreAdventorBold';
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-bold-webfont.eot');
    src: url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-bold-webfont.woff') format('woff'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-bold-webfont.ttf') format('truetype'),
url('../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-bold-webfont.svg#TeXGyreAdventorBold') format('svg');
    font-weight: normal;
    font-style: normal;
}
h1 {
	font-family: 'TeXGyreAdventorBold';
	font-size: 24px;
	font-weight: normal;
	line-height: 20px;
	color: #f7941d;
	margin-top: 10px;
	margin-bottom: 10px;
}
h2 {
	font-family: 'TeXGyreAdventorBold';
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 2px;
	color:#6d6e70;
	margin-bottom: 10px;
}
h3 {
	font-family: 'TeXGyreAdventorRegular';
	font-size: 16px;
	font-weight: normal;
	color: #ffffff;
}
h4 {
	font-family: 'TeXGyreAdventorBold';
	font-size: 16px;
	font-weight: normal;
	color: #6d6e70;
}
h5 {
	font-family: 'TeXGyreAdventorBold';
	font-size: 18px;
	font-weight: normal;
	color: #6d6e70;
}
p {
	font-size: 16px;
	line-height: 24px;
	text-align: justify;
	margin-bottom: 16px;
	color: #6d6e70;
}
ul {
	list-style-type: square;
	font-size: 15px;
	line-height: 19px;
	color: #6d6e70;
	margin-left: 20px;
	margin-bottom: 10px;
}
label, input, select, textarea {
	font-size: 15px;
}
input, textarea {
	background-color: #f7f7f7;
}
label {
	font-family: 'TeXGyreAdventorBold';
	font-weight: normal;
}
textarea {
	overflow: hidden;
}
strong {
	font-family: 'TeXGyreAdventorBold';
	font-weight: normal;
}
em {
	font-family: 'TeXGyreAdventorItalic';
	font-style: normal;
}
.regular {
	font-family: 'TeXGyreAdventorRegular';
	font-style: normal;
}
body {
	background-color: #7f7f7f;
	margin-left: 0px;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
}
a:link {
	color: #f7941d;/*#6d6e70;*/
	text-decoration: none;
}
a:visited {
	color: #f7941d;/*#6d6e70;*/
	text-decoration: none;
}
a:hover {
	color: #f7941d;
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
a.watch-button, a.sidebar_button {
	color: #ffffff;
	text-decoration: none;
}

/* CSS for color bars spanning the web site background */
#bar_header_white {
	height: 90px;
	top: 0px;
	left: 0px;
	background-color: #ffffff;
}
#bar_header_orange {
	height: 10px;
	top: 0px;
	left: 0px;
	background-color: #f7941d;
	box-shadow: 0px 2px 2px 2px #bfbfbf;
}
#bar_body {
	height: auto;
	top: 0px;
	left: 0px;
	background-image: url(../images/common/background.jpg);
	background-position: 50% 0;
	background-repeat: repeat;
	background-attachment: fixed;
	background-color: #d4d4d4;
}
#bar_footer {
	height: 100px;
	top: 0px;
	left: 0px;
	background-color: #7f7f7f;
}

/* CSS for wrappers used to center the site content */
#wrapper_header {
	height: 90px;
	width: 960px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	position: relative;
	left: 0px;
	top: 0px;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
}
#wrapper_body {
	width: 960px;
	height: auto;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 80px;
	padding-bottom: 40px;
	position: relative;
	left: 0px;
	top: 0px;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
}
#wrapper_footer {
	height: 30px;
	width: 960px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	position: relative;
	left: 0px;
	top: 0px;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
}

/* CSS for Header */
header {
	position:absolute;
	left:0px;
	top:0px;
	width:960px;
	height:90px;
	z-index:1;
	border-radius: 0px;
}
#logo_pixelplex {
	position:absolute;
	left:0px;
	top:0px;
	width:220px;
	height:90px;
}
#header_links_social {
	display:block;
	position:absolute;
	right:-10px;
	top:20px;
	width:360px;
	height:20px;
}
#header_links_main {
	position:absolute;
	right:0px;
	bottom:0px;
	width:480px;
	height:30px;
}
#header_orange_bar {
	position:absolute;
	left:0px;
	bottom:0px;
	width:960px;
	height:10px;
	background-color: #f7941d;
}
.header_nav_social {
	float:right;
	margin-right:10px;
}
.header_nav_main {
	font-size: 16px;
	text-align: right;
}
.header_nav_main a:link {
	color: #6d6e70;
	text-decoration: none;
}
.header_nav_main a:visited {
	color: #6d6e70;
	text-decoration: none;
}
.header_nav_main a:hover {
	color: #f7941d;
	text-decoration: none;
}
.header_nav_main a:active {
	text-decoration: none;
}
body#index a#index-nav,
body#about a#about-nav,
body#work a#work-nav,
body#tutorials a#tutorials-nav,
body#blog a#blog-nav,
body#contact a#contact-nav,
body#processForm a#contact-nav {
	color: #f7941d;
}

.section-title {
	display:block;
	width:950px;
	height:30px;
	padding-left:10px;
	margin-bottom:20px;
	border-top-style:solid;
	border-bottom-style:solid;
	border-width:2px;
	border-color:#7f7f7f; /*#5f5f5f;*/
	font-family:'TeXGyreAdventorBold', sans-serif;
	font-size:17px;
	color:#5f5f5f;
}

/* CSS for the sidebar */
aside {
	display: block;
	position: relative;
	float: left;
	width: 225px;	/* Sized for index.html */
	height: auto;
	margin-right: 10px;
	margin-bottom: 40px;
}
.sidebar_button {
	display:block;
	float:left;
	margin-left:11px;
	margin-right:11px;
	width:45px;
	height:25px;
	background-color: #f7941d;
	font-family: 'TeXGyreAdventorRegular', sans-serif;
	font-size: 14px;
	color: #ffffff;
	text-align:center;
	cursor:pointer;
}
.sidebar_button:hover {
	color: #ffffff;
	background-color: #ffb121;
	text-decoration: none;
}
.social_nav_horizontal {
	display: block;
	float: left;
	width: auto;
	height: 20px;
	margin-top: 5px;
	margin-right: 10px;
}
.social_nav_vertical {
	display: block;
	float: left;
	width: 60px;
	height: 60px;
	margin-right: 1px;
}

/* CSS for article tag */
article {
	display: inline-block;
	height: auto;
	position: relative;
	float: left;
	margin-bottom: 40px;
	color: #6d6e70;
	background-color: #ffffff;
	box-shadow: 0px 0px 2px 2px #bfbfbf;
}
.article_1x_left {
	width: 225px;
	margin-right: 10px;
}
.article_2x_left {
	width: 470px;
	margin-right: 10px;
}
.article_2x_right {
	width: 470px;
	margin-left: 10px;
}
.article_3x_left {
	width: 715px;
	margin-right: 10px;
}
.article_3x_right {
	width: 715px;
	margin-left: 10px;
}
.article_4x {
	width: 960px;
}
.article_border_top {
	border-top: 5px solid #f7941d;
}
.article_body {
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
}
/*.article_body a.selected {
	color: #ffffff;
	background-color: #f7941d;
}*/

/* CSS for slidesjs */
figure {
	display: block;
	position:relative;
	float: left;
	width:715px;	/* Sized for index.html */
	height:400px;	/* Sized for index.html */

	margin-bottom: 80px;

	box-shadow: 0px 0px 2px 2px #bfbfbf;
	overflow:visible;
}
.figure_left {
	margin-right: 10px;
}
.figure_right {
	margin-left: 10px;
}
#slides, #slides2 {
	display:none;
}
#slides .slidesjs-navigation, #slides2 .slidesjs-navigation {
	margin-top:3px;
}
#slides .slidesjs-previous, #slides2 .slidesjs-previous {
	margin-right: 5px;
	float: left;
}
#slides .slidesjs-next, #slides2 .slidesjs-next {
	margin-right: 5px;
	float: left;
}
.slidesjs-pagination {
	margin: 10px 0 0;
	float: left;
	list-style: none;
}
.slidesjs-pagination li {
	float: left;
	margin: 0 1px;
}
.slidesjs-pagination li a {
	display: block;
	width: 13px;
	height: 0;
	padding-top: 13px;
	background-image: url(../images/common/pagination.png);
	background-position: 0 0;
	float: left;
	overflow: hidden;
}
.slidesjs-pagination li a.active, .slidesjs-pagination li a:hover.active {
	background-position: 0 -13px
}
.slidesjs-pagination li a:hover {
	background-position: 0 -26px
}
#slides a:link, #slides a:visited, #slides2 a:link, #slides2 a:visited {
	color: #333
}
#slides a:hover, #slides a:active, #slides2 a:hover, #slides2 a:active {
	color: #9e2020
}
.navbar {
	overflow: hidden
}

/* CSS for Video Links and HTML Links*/
a.vimeoLink, a.youtubeLink, a.websiteLink, a.htmlLink, a.htmlLink_347, a.vimeoLink_306, a.vimeoLink_347, a.youtubeLink_347, a.vimeoLink_470, a.vimeoLink_494, a.youtubeLink_470, a.htmlLink_470, a.photoLink, a.photoLink_470 {
	display: block;
	float: left;
	padding: 0px;
	height: 157px;
	width: 225px;
	box-shadow: 0px 0px 2px 2px #bfbfbf;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	cursor: pointer;
}
a.photoLink, a.photoLink_470 {
	box-shadow:none;
}
a.vimeoLink_306 {
	height: 202px;
	width: 306px;
	margin-right: 21px
}
a.vimeoLink_347, a.youtubeLink_347, a.htmlLink_347 {
	height: 225px;
	width: 347px
}
/*a.vimeoLink-450 {
	height: 253px;
	width: 450px
}*/
a.vimeoLink_470, a.youtubeLink_470, a.htmlLink_470, a.photoLink_470 {
	height: 294px;
	width: 470px
}
a.vimeoLink_494 {
	height: 308px;
	width: 494px
}
/*a.vimeoLinkLg {
	display: block;
	float: left;
	padding: 0px;
	height: 225px;
	width: 347px;
	box-shadow: 0px 0px 2px 2px #bfbfbf;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	cursor: pointer;
}*/
/*a.vimeoLinkXLg {
	display: block;
	float: left;
	padding: 0px;
	height: 253px;
	width: 450px;
	box-shadow: 0px 0px 2px 2px #bfbfbf;
	position: relative;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	cursor: pointer;
}*/
a.vimeoLink img.play, a.youtubeLink img.play, a.websiteLink img.play, a.photoLink img.play {
	position: absolute;
	left: 92px;
	top: 72px;
}
a.vimeoLink_306 img.play {
	position: absolute;
	left: 133px;
	top: 96px;
}
a.vimeoLink_347 img.play, a.youtubeLink_347 img.play, a.htmlLink_347 img.play {
	position: absolute;
	left: 154px;
	top: 108px;
}
a.vimeoLink_470 img.play, a.youtubeLink_470 img.play, a.htmlLink_470 img.play, a.photoLink_470 img.play {
	position: absolute;
	left: 205px;
	top: 140px;
}
a.vimeoLink_494 img.play {
	position: absolute;
	left: 215px;
	top: 142px;
}
/*a.vimeoLink:hover, a.vimeoLink_347:hover, a.vimeoLink_470:hover, a.websiteLink, a.htmlLink:hover, div.photoLink_470:hover {*/
a:hover {
	text-decoration: none;
}
#videos-about, #videos-work {
	display: block;
	position: relative;
	height: auto;
	overflow:visible;
}
#videos-about {
	width: 735px;
}
#videos-work {
	width: 980px;
}
.videoThumb, .videoThumb_306, .videoThumb_347, .videoThumb_470, .videoThumb_494 {
	display: block;
	float: left;
	height: 157px;
	width: 225px;
	margin-right: 20px;
	margin-bottom: 40px;
	position: relative;
	overflow:visible;
}
.videoThumb_306 {
	height: 202px;
	width: 306px;
	margin-right: 21px;
}
.videoThumb_347 {
	height: 225px;
	width: 347px;
}
.videoThumb_470 {
	height: 294px;
	width: 470px;
}
.videoThumb_494 {
	height: 308px;
	width: 470px;
}
/*.videoThumb_347 {
	display: block;
	float: left;
	height: 245px;
	width: 347px;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	overflow:visible;
}*/
/*.videoThumbXLg {
	display: block;
	float: left;
	height: 283px;
	width: 450px;
	margin-right: 20px;
	margin-bottom: 20px;
	position: relative;
	overflow:visible;
}*/
.fancybox-title {
	font-size: 12px;
	padding: 2px 10px;
}
.fancybox-nav span {
	visibility:visible;
}
.project_info {
	display: none;
}
.project_info_body {
	font-family: 'TeXGyreAdventorRegular';
	padding: 10px;	
}

/* CSS for HTML and Video links above the Footer */
#body_links {
	display: block;
	float: left;
	position: relative;
	width: 980px;
	height: auto;/*157px;*/
	overflow: visible;
}
#body_links a {
	display: block;
	float: left;
	height: 112px; /*129px;*/
	width: 145px; /*176px;*/
	margin-right: 18px; /*20px;*/
	margin-bottom: 40px;
	box-shadow: 0px 0px 2px 2px #bfbfbf;
	cursor: pointer;
}

/* CSS for Title Bars */
.title_bar_1x {
	display:block;
	position: relative;
	width:215px;
	height:30px;
	background-color: #f7941d;
	padding-left:10px;
	text-align: left;
}
.title_bar_1xMd {
	display:block;
	position: relative;
	width:296px;
	height:30px;
	background-color: #f7941d;
	padding-left:10px;
	text-align: left;
}
.title_bar_1xLg {
	display:block;
	position: relative;
	width:337px;
	height:30px;
	background-color: #f7941d;
	padding-left:10px;
	text-align: left;
}
.title_bar_1xXLg {
	display:block;
	position: relative;
	width:460px;
	height:30px;
	background-color: #f7941d;
	padding-left:10px;
	text-align: left;
}
.title_bar_1xSm {
	display:block;
	position: relative;
	width:135px; /*166px;*/
	height:30px;
	background-color: #f7941d;
	padding-left:10px;
	text-align: left;
}

/* CSS for Footer */
footer {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 960px;
	height: 25px;
	border-radius: 0px;
	padding-top: 5px;
	font-size: 14px;
	color: #ffffff;
	text-align: right;
}
.clear_both {
	clear: both;
}