/*
 * Fonts
 */
@font-face {
    font-family: 'TeXGyreAdventorRegular';
    src: url('/fonts/texgyreadventor-regular-webfont.eot');
    src: url('/fonts/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/texgyreadventor-regular-webfont.woff') format('woff'),
         url('/fonts/texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('/fonts/texgyreadventor-regular-webfont.svg#TeXGyreAdventorRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorItalic';
    src: url('/fonts/texgyreadventor-italic-webfont.eot');
    src: url('/fonts/texgyreadventor-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/texgyreadventor-italic-webfont.woff') format('woff'),
         url('/fonts/texgyreadventor-italic-webfont.ttf') format('truetype'),
         url('/fonts/texgyreadventor-italic-webfont.svg#TeXGyreAdventorItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorBold';
    src: url('/fonts/texgyreadventor-bold-webfont.eot');
    src: url('/fonts/texgyreadventor-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/texgyreadventor-bold-webfont.woff') format('woff'),
         url('/fonts/texgyreadventor-bold-webfont.ttf') format('truetype'),
         url('/fonts/texgyreadventor-bold-webfont.svg#TeXGyreAdventorBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'TeXGyreAdventorBoldItalic';
    src: url('/fonts/texgyreadventor-bolditalic-webfont.eot');
    src: url('/fonts/texgyreadventor-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/texgyreadventor-bolditalic-webfont.woff') format('woff'),
         url('/fonts/texgyreadventor-bolditalic-webfont.ttf') format('truetype'),
         url('/fonts/texgyreadventor-bolditalic-webfont.svg#TeXGyreAdventorBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

.adventor_bold, .adventor_bold:hover {
	color:#fff;
	text-transform:none;
	font-family:TeXGyreAdventorBold,Helvetica,sans-serif;
	text-decoration:none;
	font-weight:normal;
}

.adventor_regular, .adventor_regular:hover {
	color:#fff;
	text-transform:none;
	font-family:TeXGyreAdventorRegular,Helvetica,sans-serif;
	text-decoration:none;
	font-weight:normal;
}


/*
 * Styles
 */
html {
height:100%;
overflow-x:hidden;
overflow-y:scroll;
}

body {
height:100%;
margin:0px;
font:12px/14px Arial, Helvetica, sans-serif;
color:#959595;
background-color:#1b1b1b;
}

img {
border:none;
}

h1, h2, h3, h4 {
margin:0px;
color:#ffffff;
}

h1 {
position:absolute;
top:45px;
left:15px;
width:150px;
height:30px;
margin:0px;
font-size:15px;
line-height:15px;
text-transform:uppercase;
color:#0093d0;
overflow:hidden;
}

h2 {
margin-bottom:27px;
font-size:18px;
line-height:20px;
font-family:"Century Gothic", Helvetica, Arial, sans-serif;
}

h3, h4 {
margin-bottom:15px;
font-size:12px;
line-height:14px;
}

h3 a {
color:#ffffff;
}

p, ul {
margin:0px;
margin-bottom:15px;
}

ul {
padding:0px;
margin-left:15px;
list-style-type:disc;
}

li {
margin:4px 0px;
}

a {
text-decoration:none;
color:#0093d0;
}

a:hover {
text-decoration:underline;
}

a.fade:hover {
opacity:0.8;
filter:alpha(opacity=80);
}

a.fade_inverse {
opacity:0.8;
filter:alpha(opacity=80);
}

a.fade_inverse:hover {
opacity:1;
}

a.image {
display:block;
}

form {
margin:0px;
}

input, textarea {
float:left;
width:339px;
padding:2px;
border:1px solid #cccccc;
margin:0px;
margin-top:2px;
font:12px/14px Arial, Helvetica, sans-serif;
color:#636363;
background-color:#ffffff;
}

input {
height:14px;
margin-bottom:10px;
}

a.button {
display:block;
float:right;
height:30px;
padding:0px 10px;
border:1px solid #363636;
border-top:0px;
line-height:29px;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
color:#959595;
}

a.button:hover {
color:#ffffff;
}

form a.button {
border-color:#cccccc;
background-color:#ececec;
color:#636363;
}

form a.button:hover {
color:#1b1b1b;
}

a.arrow {
font-size:11px;
line-height:13px;
font-weight:bold;
color:#ffffff;
}

p.blurb {
margin-top:-8px;
margin-bottom:10px;
font-size:14px;
line-height:18px;
color:#acacac;
}

*.left {
float:left;
}

*.right {
float:right;
}

*.clear {
clear:both;
}

#wrapper {
position:relative;
float:left;
width:100%;
min-width:100%;
min-height:100%;
background:180px top no-repeat;
}

#container {
float:left;
width:100%;
min-width:1000px;
min-height:800px;
}

#header {
float:left;
width:165px;
padding-left:15px;
background-color:#ffffff;
position:fixed;
top:0px;
left:0px;
height:100%;
z-index:2;
}

#logo {
position:relative;
float:left;
margin-top:45px;
}

#menu {
clear:both;
float:left;
width:170px;
margin-top:15px;
margin-left:-5px;
}

#menu a {
display:block;
clear:both;
float:left;
width:160px;
height:20px;
padding:0px 5px;
margin-bottom:1px;
line-height:19px;
font-weight:bold;
text-decoration:none;
color:#acacac;
}

#menu a:hover {
color:#1b1b1b;
}

#menu a.active {
color:#ffffff;
background-color:#1b1b1b;
}

#content {
float:left;
margin-left:180px;
}

.content_circle {
position:absolute;
background-color:transparent;
background-position:top left;
background-repeat:no-repeat;
}

.content_circle > div {
position:absolute;
line-height:18px;
text-align:center;
color:#9a9a9a;
}

.content_circle > div:first-child {
color:#767676;
}

.content_circle h2 {
margin-bottom:20px;
font-size:24px;
line-height:24px;
color:#0093d0!important;
}

.content_circle a.image {
display:inline;
font-size:14px;
}

.content_circle > div:first-child a.image {
color:#000000;
}

#web_design h2, #web_design p {
margin-bottom:15px;
color:#ffffff!important;
}

#web_design a.image {
color:#ffffff!important;
}

#home_intro {
margin-bottom:50px;
}

#home_intro .tagline {
display:block;
margin-bottom:18px;
}

#home_intro p {
font-size:14px;
line-height:16px;
width:515px;
color:#fff;
}

#home_blocks {
width:527px;
}

#home_blocks .label_ourwork {
float:left;
margin-bottom:10px;
}

#home_blocks .block {
width:175px;
float:left;
margin-right:1px;
background-color:#fff;
height:200px;
font-size:11px;
position:relative;
}

#home_blocks .block.first {
clear:both;
margin-right:1px;
}

#home_blocks .block.last {
margin-right:0;
}

#home_blocks .block p {
color:#606060;
padding:10px 7px 0 7px;
}

#blurb {
clear:both;
float:left;
width:525px;
}

#team {
clear:both;
float:left;
width:525px;
margin-top:20px;
}

div.team {
clear:both;
float:left;
width:525px;
margin-bottom:1px;
}

div.team img {
float:left;
margin-right:1px;
}

div.team div {
float:left;
width:390px;
height:126px;
padding:15px;
color:#636363;
background-color:#ffffff;
}

div.team h3 {
color:#363636;
}

div.team p {
margin:0px;
}

div.panel {
clear:both;
float:left;
width:722px;
height:321px;
margin-top:20px;
}

div.panel div {
float:left;
width:210px;
height:291px;
padding:15px;
background-color:#000000;
}

div.panel h3 {
font-size:18px;
line-height:18px;
}

div.panel img {
float:left;
margin-left:1px;
margin-bottom:1px;
}

#diagram {
clear:both;
float:left;
width:747px;
margin-top:20px;
}

div.column {
position:relative;
float:left;
width:112px;
margin-left:15px;
}

div.column:first-child {
margin-left:0px;
}

div.column img.arrow {
position:absolute;
top:11px;
left:112px;
z-index:1;
}

div.column div {
clear:both;
float:left;
width:92px;
height:92px;
padding:10px;
margin-bottom:1px;
text-align:center;
color:#acacac;
background-color:#363636;
}

div.column table {
float:left;
width:100%;
height:100%;
}

div.column div:first-child {
font:14px/14px "Century Gothic", Helvetica, Arial, sans-serif;
font-weight:bold;
text-transform:uppercase;
text-align:left;
color:#ffffff;
}

#filters {
position:absolute;
top:0px;
right:0px;
float:right;
width:140px;
height:100%;
padding:0px 15px;
background-color:#000000;
z-index:2;
/* fixed */
/*position:fixed;*/
/* */
}

#filters div.filters a {
color:#959595;
font-size:11px;
line-height:20px;
font-weight:bold;
text-decoration:none;
}

#filters div.filters a:hover, #filters div.filters a.active {
color:#ffffff;
}

#filters div {
clear:both;
float:left;
width:140px;
margin-bottom:20px;
}

#filters div:first-child {
margin-top:45px;
}

#filters div.filters a {
display:block;
clear:both;
float:right;
width:102px;
height:30px;
padding-left:38px;
margin-bottom:10px;
font-size:12px;
line-height:29px;
background:left no-repeat;
}

#filters h4 {
margin-top:10px;
margin-bottom:0px;
line-height:20px;
cursor:pointer;
}

#filters h4 + span {
display:none;
}

#blog {
position:relative;
float:left;
width:600px;
}

div.blog {
clear:both;
float:left;
width:600px;
margin-top:25px;
}

div.blog:first-child {
margin-top:0px;
}

div.blog > div {
float:right;
width:542px;
margin-top:-1px;
margin-right:-1px;
}

/*
div.blog div img {
float:left;
border:1px solid #363636;
}
*/

div.blog > div > *:first-child {
width:540px;
height:360px;
float:left;
border:1px solid #363636;
}

div.blog p.date {
float:left;
margin-top:18px;
margin-bottom:2px;
font-weight:bold;
}

div.blog div.buttons ~ p.date {
clear:both;
margin-top:25px;
}

div.blog h3 {
clear:both;
font-size:18px;
line-height:20px;
}

img.icon {
float:left;
margin-bottom:10px;
}

#paging {
clear:both;
float:right;
width:542px;
margin:15px 0px;
}

#categories {
position:absolute;
top:0px;
left:0px;
float:left;
width:100%;
height:45px;
background:#565656 url(/images/categories.gif) top repeat-x;
overflow:hidden;
z-index:1;
/* fixed */
position:fixed;
/* */
}

#categories a {
display:block;
float:left;
height:45px;
padding:0px 10px;
padding-left:42px;
line-height:44px;
font-weight:bold;
text-decoration:none;
color:#ffffff;
background:10px no-repeat;
}

#categories a:first-child {
margin-left:205px;
}

#categories a:hover, #categories a.active {
background-color:#363636;
}

#tiles {
/*
float:left;
min-width:772px;
*/
margin-top:45px;
}

div.tile {
float:left;
width:192px;
height:214px;
margin-right:1px;
margin-bottom:1px;
background-color:#000000;
cursor:pointer;
}

div.tile img {
float:left;
}

div.tile div {
clear:both;
float:left;
width:172px;
height:50px;
padding:10px;
}

div.tile h3 {
margin-bottom:2px;
font-weight:bold;
color:#ffffff;
}

div.tile p {
font-size:11px;
line-height:13px;
}

/* dim */

div.tile {
margin:0px;
border:1px solid #1b1b1b;
border-width:0px 1px 1px 0px;
}

#tiles:hover div.tile img, #tiles:hover div.tile div {
opacity:0.5;
filter:alpha(opacity=50);
}

#tiles:hover div.tile:hover img, #tiles:hover div.tile:hover div {
opacity:1;
filter:none;
}

/* */

#portfolio {
position:relative;
float:left;
width:770px;
margin-top:45px;
}

div.portfolio {
clear:both;
float:left;
width:770px;
margin-top:25px;
}

/* dim */

div.portfolio {
opacity:0.5;
filter:alpha(opacity=50);
}

/*
#portfolio div.portfolio:hover {
opacity:1;
filter:none;
}
*/

#portfolio div.active, #portfolio.mobile div.portfolio {
opacity:1;
filter:none;
}

/* */

div.portfolio:first-child {
margin-top:0px;
}

div.portfolio a.anchor {
display:block;
/*
position:relative;
bottom:70px;
*/
clear:both;
float:left;
width:770px;
height:0px;
}

/* IE7 */

div.portfolio {
position:relative;
}

div.portfolio a.anchor {
position:absolute;
top:-70px;
height:1px;
}

/* */

div.portfolio div.content {
float:left;
width:175px;
height:330px;
padding:15px;
background-color:#000000;
}

div.portfolio h3 {
font-size:18px;
line-height:20px;
color:#959595;
}

div.portfolio div.images {
float:right;
width:542px;
margin-top:-1px;
margin-right:-1px;
}

div.portfolio img {
float:left;
border:1px solid #363636;
}

div.buttons {
float:left;
border:1px solid #363636;
border-width:0px 0px 1px 1px;
}

div.buttons a {
float:left;
width:30px;
height:30px;
border-right:1px solid #363636;
font-size:14px;
line-height:29px;
font-weight:bold;
text-align:center;
text-decoration:none;
color:#959595;
}

div.buttons a:hover, div.buttons a.active {
color:#ffffff;
}

div.copy {
clear:both;
float:left;
width:542px;
margin-top:25px;
}

#portfolio #paging {
margin-bottom:35px;
}

#reader {
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background-image:url(/images/fader.png);
z-index:6;
}

#fader {
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
/*
background-color:#000000;
opacity:0.75;
filter:alpha(opacity=75);
*/
}

#holder {
width:540px;
padding:45px;
margin:0px auto;
}

#copy {
position:relative;
width:490px;
padding:25px;
padding-bottom:10px;
color:#636363;
background-color:#ffffff;
}

#copy h3 {
font-size:18px;
line-height:20px;
color:#acacac;
}

#copy h4 {
color:#363636;
}

#contact {
clear:both;
float:left;
width:345px;
min-height:126px;
padding:15px;
color:#636363;
background-color:#ffffff;
}

#panel {
width:440px;
height:100%;
top:0px;
right:-440px; /* must be hidden by position at start, do not hide with display:none! */
float:left;
background-color:#000000;
z-index:4;
position:fixed;
}

#panel > img {
position:absolute;
top:45px;
cursor:pointer;
}

#panel > a {
position:absolute;
display:block;
right:0px;
float:left;
width:440px;
height:40px;
background:#000000 center no-repeat;
z-index:5;
}

#panel.open > a {
cursor:pointer;
}

#panel.open > a:hover {
background-color:#1b1b1b;
}

#panel > a.up {
top:0;
background-image:url(/images/arrows/up.png);
}

#panel > a.down {
bottom:0;
background-image:url(/images/arrows/down.png);
}

#panel .scroller {
overflow:hidden;
height:100%;
}

#panel .scroller div.entry {
/*clear:both;*/
float:left;
width:400px;
height:160px;
padding:20px;
}

#panel.open .scroller div.entry {
cursor:pointer;
}

#panel.open .scroller div.entry:hover {
background-color:#1b1b1b;
}

#panel .scroller div.entry img {
float:left;
border:1px solid #363636;
margin-top:-1px;
margin-left:-1px;
}

#panel .scroller div.entry div {
float:right;
width:140px;
height:160px;
font-size:11px;
line-height:13px;
}

#panel .scroller div.entry p.date {
margin-bottom:2px;
font-weight:bold;
}

#panel .scroller div.entry h3 {
font-size:14px;
line-height:16px;
}

/* dim */

#panel .scroller:hover div.entry img, #panel .scroller:hover div.entry div {
opacity:0.5;
filter:alpha(opacity=50);
}

#panel.open .scroller div.entry:hover img, #panel.open .scroller div.entry:hover div {
opacity:1;
filter:none;
}

#footer {
position:absolute;
bottom:0px;
left:0px;
clear:both;
float:left;
width:100%;
padding:30px 0 0 0;
font-size:11px;
line-height:13px;
color:#636363;
background-color:#000000;
overflow:hidden;
z-index:3;
}

#footer_links {
float:left;
width:800px;
margin:0 0 30px 180px;
}

#footer h3, #filters h3 {
font:14px/14px TeXGyreAdventorBold,Helvetica,sans-serif;
text-transform:uppercase;
color:#1591cd;
}

#footer_links p, #footer_links div.block {
float:left;
width:185px;
margin-bottom:0px;
}

#footer_links div.block {
margin-left:20px;
}

#footer_links div.block:first-child {
margin-left:0px;
}

#footer_links .block > img {
display:block;
margin-bottom:16px;
}

#footer_links .block a {
display:block;
clear:both;
float:left;
text-decoration:none;
}

#footer_links .block a.image.social {
clear:none;
margin:10px 5px 0 0;
}

#footer a {
color:#7d7d7d;
text-decoration:underline;
}

#footer a:hover {
color:#ffffff;
}

#seo_box {
float:left;
width:100%;
background-color:#1b1b1b;
padding:30px 0px;
}

#seo_box .label {
clear:both;
width:75px;
float:left;
height:14px;
padding:2px 5px;
padding-left:15px;
margin-right:85px;
text-align:left;
background-color:#000000;
overflow:hidden;
color:#5d5d5d;
}

#seo_box .block {
float:left;
width:800px;
}

#seo_box .block p {
float:left;
width:185px;
margin:0 0 0 20px;
}

#seo_box .block p:first-child {
margin-left:0;
}

#seo_box div.seo + div {
margin-bottom:30px;
}

/* addthis */

#at20mc form {
float:none;
}

#at20mc input, #at20mc textarea, #at20mc select {
float:none;
height:auto;
}

/* twitter */

#twitter_widget_embed {
margin-bottom:15px;
}

#twitter_widget_embed ul {
margin:0px;
list-style-type:none;
}

#twitter_widget_embed li {
margin:0px;
margin-bottom:15px;
font-size:11px;
line-height:14px;
}

#twitter_widget_embed span.tweet_time {
display: block;
font-style:italic;
}

#twitter_widget_embed span.tweet_time a {
color:#959595;
}

#fb-root {
display:none;
}

@media screen and (max-device-width: 1024px) {
#categories a {
padding-left:35px;
padding-right:7px;
background-position:7px 50%;
}
}