/* =BODY
----------------------------------------------- */
body { margin: 0; background: #444 url("/images/page-bg.png") repeat-x 0 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 62.1%; line-height: 2; color: #333; }
#container { width: 960px; margin: 0px auto; position: relative; text-align: left; }

/* =HEADER
----------------------------------------------- */
#header { background: #069CCA url('/images/header-background.png') top left repeat-x; color: #fff; height: 140px; position: relative; }
a#logo { position: absolute; top: 30px; left: 30px; }

/* =NAVIGATION
----------------------------------------------- */
#navigation { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 87px; left: 40px; }
#navigation li { margin: 0 3px; padding: 0; float: left; }
#navigation li a { display: block; float: left; height: 69px; overflow: hidden; background-repeat: no-repeat; background-position: 0 0; }
#navigation li a span { display: none; }
#navigation a#nav_overview { width: 79px; background-image: url("/images/nav-overview.png"); }
#navigation a#nav_about { width: 59px; background-image: url("/images/nav-about.png"); }
#navigation a#nav_services { width: 75px; background-image: url("/images/nav-services.png"); }
#navigation a#nav_blog { width: 53px; background-image: url("/images/nav-blog.png"); }
#navigation a#nav_contact { width: 73px; background-image: url("/images/nav-contact.png"); }
#navigation a:hover { background-position: 0 -138px; }
#navigation a.selected { background-position: 0 -69px; }

/* =STRUCTURE
----------------------------------------------- */
#content { width: 960px; padding: 30px 0 10px; background: #fff url('/images/content-background.png') top left repeat-x; text-align: left; }
#main_content { float: left; margin-left: 30px; width: 589px; border-right: 1px solid #ccc; display: inline; min-height: 565px; }
#main_content_padding { padding-right: 10px; }
#secondary_content { float: left; margin-left: 10px; width: 300px; }
p#main_description { padding: 10px; margin-top: 0; font-size: 1.5em; line-height: 2; background-color: #eee; text-shadow: #aaa 2px 2px 2px; }

a.project_banner { display: block; margin-bottom: 20px; text-decoration: none; background-position: 0 0; }
a.project_banner:hover { background-position: 0px -130px; }
a.project_banner span { display: none; }
a#riw_banner { margin-left: -5px; width: 305px; height: 105px; background-image: url(/images/banner-riw.png); background-repeat: no-repeat; }
a#riw_banner+a { margin-top: -5px; }
a#notifly_banner { margin-top: -5px; width: 300px; height: 105px; background-image: url(/images/banner-notifly.png); background-repeat: no-repeat; }
a#eccu_banner { width: 305px; height: 100px; background-image: url(/images/banner-eccu.png); background-repeat: no-repeat; }
a#flixcloud_banner { margin-top: -5px; width: 300px; height: 105px; background-image: url(/images/banner-flixcloud.png); background-repeat: no-repeat; }

/* =FOOTER
----------------------------------------------- */
#footer { clear: both; padding: 50px 0 20px; background: #333333 url('/images/footer-bg.png') top left repeat-x; color: #fff; font-size: 12px; }
#footer h4 { margin: 0 0 8px; text-transform: uppercase; font-size: 14px; line-height: 1.42857; color: #fff; }
#footer a { color: #fff; }
#footer a:visited { color: #ccc; }
#footer a:hover { color: #eee; }
#footer .column { float: left; }
#client_login { width: 228px; margin: 0 20px 0 30px; display: inline;}
#client_login ul { list-style: none; margin: 0; padding: 0; }
#client_login ul li { margin: 0 0 5px; }
#client_login ul input.text { width: 214px; padding: 3px; }
#client_login ul input.submit { width: 80px; }
#client_login a { float: right; font-size: 0.8em; }
#client_login input.blur { color: #aaa; }
#client_login input.focus { color: #069CCA; }
#recent_blog_posts { width: 330px; margin-right: 20px; line-height: 2em; }
#recent_blog_posts em { font-size: 10px; color: #ccc; }
#recent_blog_posts li { font-size: 12px; }
#contact { line-height: 1.5em; background: #2c2c2c; width: 280px; padding: 10px 15px; margin-top: -10px; }
#contact .email { margin-bottom: 15px; }
#sub-footer, #sub-footer a { color: #888; font-size: 12px; margin: 5px 0 20px; }

/* =HEADINGS
----------------------------------------------- */
h2 { font-size: 22px; line-height: 30px; margin-bottom: 10px; color: #069CCA; }
h3 { font-weight: bold; margin-top: 2em; font-size: 1.6em; }

/* =LINKS
----------------------------------------------- */
/* =LISTS
----------------------------------------------- */
ol, li { font-size: 14px; }

/* =TABLES
----------------------------------------------- */
th,td { font-size: 14px; line-height: 20px; vertical-align: top; }
th { text-align: right; }

/* =FORMS
----------------------------------------------- */
#contact_form input.text, #contact_form textarea { width: 300px; }
#contact_form textarea { height: 200px; }

/* =MESSAGES
----------------------------------------------- */
#error_box { color: #900; padding: 10px; border: 2px solid #900; margin-bottom: 20px; }
#error_box div {font-size: 14px;}
#success_box { color: #090; padding: 10px; border: 2px solid #090; margin-bottom: 20px; }
#success_box div { font-size: 14px; }

/* =MISC
----------------------------------------------- */
p, address {font-size: 14px; line-height: 30px; }
#secondary_content h3 { text-transform: uppercase; }
#tab_services #main_content p, #tab_about #main_content p { font-size: 15px; line-height: 30px; margin: 0px 0 20px 0; }
.clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* =ABOUT
----------------------------------------------- */
#team em { color: #888; font-size: .9em; }
#team { margin: 0; padding: 0 0 0 20px; }
#team li { list-style-type: square; margin: 10px 0; line-height: 1.5em; }

/* =BLOG
----------------------------------------------- */
.post h2 { border-bottom: 1px dotted #069CCA; margin-right: 60px; }
.post_date { padding: 10px 5px; font-size: 14px; color: #fff; background: #069CCA; text-transform: uppercase; text-align: center; width: 40px; line-height: 1em; text-shadow: rgba(0,0,0,0.3) 2px 2px 2px; float: right; margin-bottom: 10px; }
.post_date span { display: block; }
.post_date .day { font-size: 22px; }
#posts .post { margin-left: 60px; }
#posts .post h3 a { text-decoration: none; color: #333; font-size: 18px; font-weight: bold; line-height: 1.5em; }
#posts .post .post_date { margin-left: -60px; float: left; }
#posts .post .read_more { font-size: 12px; margin-top: -15px; margin-bottom: 25px; }
.post_author { line-height: 1.5em; }

.UltraViolet pre { border: 8px solid #eee; margin: 0 0 20px; line-height: 1.6em; font-size: 1.3em; padding: 3px 0; overflow: auto; }
.UltraViolet pre .line-numbers { padding: 0.5em 0; }