@font-face {font-family:
    'MyLeagueGothic';
    src:
    url("League_Gothic.eot");
    src:
    local("League Gothic"), url("League_Gothic.svg#LeagueGothic") format('svg'), url("League_Gothic.otf") format("opentype");
}

html {
    background: #f5f3f2;
}

body {
    background: #f5f3f2 url(../images/body-top.png) repeat-x left top;
    font: 13px Arial, sans-serif;
    color: #222;
}

.container {
    position: relative;
    width: 930px;
    margin: 0 auto;
    padding: 0 10px;
}

#header{
	background: #000 url(../images/body-top.png) repeat-x left top;
	height:111px;
}

#logo {
    display: block;
    position: absolute;
    left: -5px;
    top: -25px;
    border: none;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

strong {
    font-weight: bold;
}

em {
    font-style: italic;
}

/* LINKS
 * ----------------------------------------- */
a {
    color: #a0301e;
    text-decoration: none;
    border-bottom: 1px solid #dbb1b1;
}

#content a[href^= "http:"]
{
	background:transparent url(../images/ext-a.gif) no-repeat right top;
    padding-right:6px;
}

#flickr a[href^= "http:"]{
	background:none;
	padding:0;
}

a:visited {
    color: #8b2a1a;
}

a:hover, a:focus, #footer a:hover, #feeds a:hover {
    color: #cc3d26;
}

h1 a[href*="category"] {
	text-transform:capitalize;
}

h1 a {
    border: none;
}

/* PARAGRAPHS
 * ----------------------------------------- */
p {
    font: 13px Arial, sans-serif;
    line-height: 1.5;
    margin: 0 0 16px;
    -moz-text-shadow: 0px 1px 0px #fff;
}

p.footNote{
	font-size:11px;
	color:#666;
}

#mainContent p#commentsClosed {
    font: 30px MyLeagueGothic, Arial, sans-serif;
    margin: 0 0 6px;
    color: #000;
}

/* BLOCKQUOTE
 * ----------------------------------------- */
blockquote {
    margin: 0 0 16px 30px;
    font-style: italic;
}

blockquote p {
    font-style: italic;
}

/* HEADINGS
 * ----------------------------------------- */
h1, h2, .Page #mainContent h2, .ServicePage #mainContent h2 {
    font: 30px MyLeagueGothic, Arial, sans-serif;
    margin: 0 0 16px;
    color: #000;
    text-transform: uppercase;
}

h2{
    border-bottom: 4px solid #aaa;
    box-shadow: 0px 1px 0px #777;
    -moz-box-shadow: 0px 1px 0px #777;
    -webkit-box-shadow: 0px 1px 0px #777;
}

#comments h2 {
    border-bottom: 1px solid #aaa;
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    margin-bottom: 12px;
}

#projects h2{ 
	box-shadow:none;
	-moz-box-shadow:none; 
	-webkit-box-shadow:none;
	text-transform:none;
	border:none;
	margin:0;
}


h3 {
    font-size: 20px;
    margin: 0 0 16px;
}

#comments h3 {
    font-size: 18px;
}

h4 {
    font-size: 14px;
    font-weight: bold;
    margin: 0 0 4px;
}

.col-right h3 {
    margin-bottom: 4px;
}

.col-right h4 {
    border-top: 1px solid #fff;
    box-shadow: 0px -1px 0px #c9c9c9;
    -webkit-box-shadow: 0px -1px 0px #c9c9c9;
    -moz-box-shadow: 0px -1px 0px #c9c9c9;
    padding-top: 3px;
}

/* MAIN NAV
 * ------------------------------------------------- */
#mainNav {
    position: absolute;
    right: 0;
    top: 2px;
    overflow: hidden;
}

#mainNav li {
    float: left;
    margin: 0 0 0 1px;
}

#mainNav a {
    float: left;
    padding: 6px 14px 4px;
    text-transform: uppercase;
    font: 30px MyLeagueGothic, Arial, sans-serif;
    color: #fff;
    border: none;
    text-decoration: none;
	height:35px;
}

#mainNav a:hover, #mainNav a:focus {
    background: #ff2400;
}

#mainNav a.section, #mainNav a.current{
	background: #ff2400 url(../images/menu.png) no-repeat right -2px
}
 

/* SUB NAV
 * ------------------------------------------------- */
.subNav {
    margin-bottom: 20px;
}

.subNav li {
    margin-bottom: 1px;
}

.subNav a {
    display: block;
    padding: 4px;
    background: #fff;
    border-top: 1px solid #e8e7e6;
    border-bottom: 1px solid #e8e7e6;
}

.subNav a.current {
    background: #e8e7e6;
}

#content .subNav a:hover {
    background-color: #6b2014;
    color: #fff;
}

.ServicesHolderPage .subNav a {
    background-color: #6b2014;
    color: #fff;
    border: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.ServicesHolderPage .subNav a:hover {
    background-color: #fff;
    color: #a0301e;
}

/* COLUMNS
 * ------------------------------------------------- */
.col {
    float: left;
    margin: 0 25px 0 0;
    position: relative;
}

.Page .col,
.ServicePage .col,
.ProjectPage .col{
	margin: 0 13px 0 12px;
}

.col-right {
    float: right;
    padding-top: 11px;
    position: relative;
}

.Page  #content .col-right,
.ServicePage  #content .col-right{
	margin:0 172px 0 0;
}

.col-1 {
    width: 180px;
}

.col-1.box {
    width: 158px;
}

.col-2 {
    width: 240px;
}

.col-2.box {
    width: 218px;
}

.col-3 {
    width: 320px;
}

.col-3.box {
    width: 298px;
}

.col-4 {
    width: 460px;
}

.col-4.box {
    width: 438px;
}

.col-5 {
    width: 520px;
}

.col-6 {
    width: 665px;
}

.col-6.box {
    width: 643px;
}

/* BOX
 * ------------------------------------------------- */
.box {
    background: #fff url(../images/corner.png) no-repeat right -1px;
    padding: 10px;
    border: 1px solid #e8e7e6;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
	margin-bottom:20px;
}

/* BREADCRUMBS
 * ------------------------------------------------- */
#breadCrumbs{
	position:absolute;
	top:132px;
	z-index:110;
	left:10px;
}

.Page #breadCrumbs,
.ServicePage #breadCrumbs,
.ProjectPage #breadCrumbs{
	left:22px;
}

/* CONTENT
 * ------------------------------------------------- */
#content {
    position: relative;
    padding: 60px 0;
	min-height:400px;
}

#mainContent {
    position: relative;
}

pre {
    background: #e2efff;
    border: 1px solid #d4e0ef;
    padding: 12px;
    margin: 0 0 16px;
    font: 12px Consolas, "Courier New", Courier, monospace;
    box-shadow: 0px 1px 0px #c9c9c9;
    -webkit-box-shadow: 0px 1px 0px #c9c9c9;
    -moz-box-shadow: 0px 1px 0px #c9c9c9;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
	width:420px;
	overflow:auto;
}

.ArticlePage pre{
	width:450px;
}

.col-5 pre{
	width:500px;
}

/* HOMEPAGE
 * ------------------------------------------------- */
.HomePage #content .col-3 {
    min-height: 726px;
}

#work li {
    border: 1px solid #e8e7e6;
    margin-bottom: 10px;
    height: 100px;
    overflow: hidden;
}

/* FLICKR
 * ------------------------------------------------- */
#flickr li {
    float: left;
    margin: 0 5px 5px 0;
}

#flickr a {
    border: none;
    display: block;
    float: left;
}

#flickr img {
    display: block;
}

/* ARTICLES
 * ------------------------------------------------- */
p.date {
    margin: 0;
    font-size: 11px;
    color: #888;
}

li.hentry, #searchResults li {
    border-bottom: 1px solid #e8e7e6;
    margin-bottom: 12px;
}

p.readMore {
    text-align: right;
}

.hentry .date a{
	border:none;
}

/* ARTICLEPAGE
 * ------------------------------------------------- */
.ArticlePage #content {
    padding: 0;
}

.ArticlePage #mainContent {
    background: #fff;
    border-left: 1px solid #e8e7e6;
    border-right: 1px solid #e8e7e6;
    width: 640px;
    padding: 12px 0 0;
}

.ArticlePage #mainContent .typography {
    padding: 0 100px 0 60px;
}

.ArticlePage h1 {
    background: #f5f3f2;
    border: 1px solid #e8e7e6;
    padding: 6px 60px 5px 70px;
    line-height: 1;
    width: 530px;
    margin: 0 0 30px -11px;
}

.ArticlePage p.published{
	background: #f5f3f2;
    border: 1px solid #e8e7e6;
    width: 500px;
	margin: 0 0 12px -11px;
    padding: 3px 90px 3px 70px;
	font-weight:bold;
}

a.totalComments {
    display: block;
    background: url(../images/tot-comments.png);
    width: 50px;
    height: 32px;
    border: none;
    position: absolute;
    top: 58px;
    right: 10px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 1px 0 0;
}

#tags {
    padding: 4px 60px;
    background: #f5f3f2;
    margin: 40px -1px 0;
    border-top: 1px solid #e8e7e6;
    border-bottom: 1px solid #e8e7e6;
}

.ArticlePage #aside {
    margin-top: 12px;
}

a.control {
    position: absolute;
    left: 0;
    top: 0;
    background: #fff url(../images/prev-next.gif) no-repeat left -42px;
    width: 80px;
    height: 31px;
    display: block;
    padding: 11px 5px 0 45px;
    font-weight: bold;
    font-size: 16px;
}

a.control:hover, a.control:focus {
    background: #ff2400 url(../images/prev-next.gif) no-repeat left -126px;
    border-color: #cc3d26;
    color: #fff;
}

#singlePagination .next {
    background-position: right top;
    padding: 10px 45px 0 15px;
    width: 70px;
    left: auto;
    right: 0;
    top: 40px;
}

#singlePagination .next:hover,
#singlePagination .next:focus{
	background-position:right -84px;
}

/*  PAGINATION
 *  -------------------------------------------------- */
ul.pagination {
    position: relative;
    overflow: hidden;
    margin: 0;
}

.pagination li {
    float: left;
    list-style: none;
    margin: 0;
    font-weight: bold;
    font-size: 11px;
    margin: 0 2px;
    line-height: 1.2;
}

.pagination li.noLink {
    padding: 3px 4px;
}

.pagination li.prev {
    margin: 0 16px 0 0;
}

.pagination li.next {
    margin: 0 0 0 16px;
    float: right;
}

ul.pagination a {
    display: block;
    float: left;
    border: 1px solid #d9d9d9;
    padding: 2px 4px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

ul.pagination a:hover, ul.pagination a:focus {
    text-decoration: none;
    background: #cc3d26;
    border-color: #cc3d26;
    color: #fff;
}

/* COMMENTS
 * ------------------------------------------------- */
#comments {
    background: #efedec url(../images/grad.gif) repeat-x left top;
    border-bottom: 1px solid #e8e7e6;
    margin: 0 1px;
    padding: 40px 60px 10px;
    width: 518px;
}

#comments ol {
    margin: 20px 0;
}

#comments ol li {
    position: relative;
    padding: 16px 40px 8px 80px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
	min-height:140px;
}

#comments li.odd {
    background: #fff;
    border-color: #e2e2e2;
}

#comments .photo {
    position: absolute;
    left: 16px;
    top: 18px;
    border: 4px solid #fff;
}

#twitterReplies .photo{
	left:10px;
}

#comments li.odd .photo {
    border-color: #ebebeb;
}

.admin .pos{
	color:#A0301E;
}

#codeHelp {
    margin: 12px 0 0;
}

/* SERVICES
 * ------------------------------------------------- */

.ServicePage #projects{ 
	margin:25px 0; 
}

.ServicePage #projects li{
	padding:0;
}


/* PORTFOLIO
 * ------------------------------------------------- */
#projects{
	margin:0;
	padding:0;
}

#projects li{
	margin:0 25px 25px 0;
	padding:0;
	background:none;
	float: left;
	position:relative;
	list-style:none;
}

#projects li.last{
	margin:0 0 25px;
}

#projects li a{
	border:none;
}

#projects img{
	display:block;
    border: 1px solid #e8e7e6;
}

.PortfolioPage #aside .box{
	margin:0 0 25px;
}

.PortfolioPage .info{
	position:absolute;
	bottom:12px;
	left:0;
}

#projects li .info a{
	display:block;
	padding:4px 4px 4px 20px;
	width:294px;
	background:#f5f3f2;
	border-left: 1px solid #e8e7e6;
	border-right: 1px solid #e8e7e6;
	color:#000;
	font: 22px MyLeagueGothic, Arial, sans-serif;
	text-transform:uppercase;
}

#projects li .hover a{
	background:#000;
	color:#fff;
}

.photo div{ 
	position:relative; 
	width:115px; 
	height:226px; 
	background:url(../images/overlay.png) repeat-x left 113px; 
}

.ProjectPage .col-3 .photo div{ 
	position:relative; 
	width:318px; 
	height:397px; 
	background:url(../images/overlay.png) repeat-x left 200px; 
}

.ProjectPage .photo img{
	border-bottom: 1px solid #e8e7e6;
}

.pos{
	position:absolute;
	font:bold 140px MyLeagueGothic, Arial, sans-serif; 
	line-height:1;
	right:20px;
	bottom:8px;
}

/* CONTACT
 * ------------------------------------------------- */
.ContactPage #content .col-2 {
    margin-left: 60px;
}

.ContactPage #content .col-3 {
    margin: 18px 25px 0 32px;
}

/* FOOTER
 * ------------------------------------------------- */
#footer {
    position: relative;
    background: #383231;
    border-top:1px solid #fff;
	border-bottom:1px solid #584f4e;
}

#footer .container {
    min-height: 100px;
    padding: 20px 0;
}

#footer .col {
    margin: 0;
}

#footer .col-3 {
    padding:0 12px;
}

#footer .col-right, .PortfolioPage .col-right {
    padding: 0;
}

#footer h2 {
    color: #e8e7e6;
    border: none;
    box-shadow: 0px 0px 0px #220a06;
    -moz-box-shadow: 0px 0px 0px #220a06;
    -webkit-box-shadow: 0px 0px 0px #220a06;
    text-shadow: 1px 1px 4px #000;
    -moz-text-shadow: 1px 1px 4px #000;
    -webkit-text-shadow: 1px 1px 4px #000;
}

#footer a {
    border-bottom: 1px solid #fff;
	color: #e8e7e6;
}

#footer li {
    margin: 0 12px 0 0;
}

#footer li a {
    border-bottom:1px solid #4c4443;
    display: block;
    padding: 4px 0;
}

#tweet {
    background: url(../images/tweet.png) no-repeat left top;
    height: 260px;
	word-wrap:break-word;
}

#tweet a {
    font-size: 18px;
    font-weight: bold;
}

#feeds {
    clear: both;
	background:#4c4443;
}

#feeds ul{ 
	padding:8px 12px;
	overflow:hidden;
	position:relative;
}
#feeds li {
    float: left;
    margin: 0;
}

#feeds a {
    padding: 4px 58px 4px 20px;
    background:transparent url(../images/feed-icon.png) no-repeat 0 center;
	border:none;
	color: #e8e7e6;
}

/* FORMS
 * ------------------------------------------------- */
input.text, textarea {
	background: #fff;
    padding: 3px;
    border: 1px solid #c9c9c9;;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    width: 220px;
}

input.action {
    background: #fff url(../images/but-grad.gif) repeat-x left bottom;
    border: 1px solid #c9c9c9;;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 2px 4px;
    color: #333;
    font-size: 11px;
}

input:focus, textarea:focus {
    background: #fefeda;
    border-color: #aaa;
    box-shadow: 0px 0px 8px #66cc33;
    -webkit-box-shadow: 0px 0px 8px #66cc33;
    -moz-box-shadow: 0px 0px 8px #66cc33;
}

input.error:focus, textarea.error:focus {
    box-shadow: 0px 0px 8px #ff2400;
    -webkit-box-shadow: 0px 0px 8px #ff2400;
    -moz-box-shadow: 0px 0px 8px #ff2400;
}

textarea {
    width: 280px;
	height:160px;
}

#comments textarea {
    width: 100%;
    height: 140px;
}

label {
    display: block;
    font-weight: bold;
    margin: 0 0 2px;
}

.required label span{
	font-size:11px;
	font-weight:normal;
}

.checkbox label {
    display: inline;
    margin: 0 0 0 3px;
}

.field {
    margin: 0 0 8px;
}

.message, .error {
    color: #ff2400;
}

legend {
    display: none;
}

/* SEARCHFORM
 * ------------------------------------------------- */
#SearchForm_SearchForm {
    position: absolute;
    top: 67px;
    right: 0;
    width: 240px;
}

#Search.field, #Search .middleColumn {
    float: left;
    margin-right: 4px;
}

#Search input.text {
    padding: 2px;
    width: 160px;
}