/* -------------------------------------------------------------- Auguste Blog + Portfolio http://templates.carlofranco.ca/auguste Version: 1.0 Color Scheme: Classic Red Author: Carlo Franco Question/Comments: hello@carlofranco.ca -------------------------------------------------------------- */ /* 1. RESET ------------------------------------- */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;} table {border-collapse:collapse;border-spacing:0;} fieldset,img {border:0;} ol,ul {list-style:none;} caption,th {text-align:left;} h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;} q:before,q:after {content:'';} abbr,acronym {border:0;} .hide {display:none;} .clear {clear:both;} .clearfix {display:block;} .clearfix:after {content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0;} * html .clearfix {height:1%;} html[xmlns] .clearfix {display:block;} /* 2. CORE STYLES ------------------------------------- */ html,body {overflow-x:hidden;} body {background:#f0f0f0; color:#3B3B3B; font-size:16px; font-family:Georgia,"Times New Roman",serif; line-height:1.5; } a:link,a:visited {color:#DA1A0B; text-decoration:none;} a:hover {color:#2B2B2B;} a:active {color:#2B2B2B;} em {font-style:italic;} h1,h2,h3,h4,h5,h6 {color:#1b1b1b; letter-spacing:normal; line-height:normal; text-transform:none; padding-bottom:24px; } h1 {font-size:32px;} h2 {font-size:28px;} h3 {font-size:24px;} h4 {font-size:20px;} h5 {font-size:18px;} h6 {font-size:14px;} hr {background-color:#ccc; height:1px; margin: 20px 0; border:0;} label {cursor:pointer;} p {padding-bottom:24px;} code, pre {color:#606060; font-family:Monaco,Consolas,"Courier New",monospace; background-color:#F1F1F1;} pre { background-image: url(images/pre_bg.gif); padding: 21px; margin-bottom:24px; border: 1px solid #bbb;} pre code { font-size:14px; background:none;} strong {font-weight:bold;} small {font-size: 11px;} span.fancy {font-family:"Hoefler Text",Baskerville,Garamond,"Palatino Linotype",Georgia,"Times New Roman", serif; text-transform: none; font-style:italic; font-weight:normal;} .alignleft {margin:10px 20px 10px 0; float:left;} .alignright {margin:10px 0 10px 20px; float:right;} .aligncenter {padding-bottom:20px; margin:0 auto; display:block;} .button {background:url(images/ui_button_white.png) left top repeat-x; color:#181818; font:normal 10px Arial, Helvetica, sans-serif; text-transform:uppercase; line-height:1.3; padding:7px 10px; border:1px solid #a3a3a3; border-bottom:1px solid #505050; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -khtml-border-radius:4px; border-radius:4px; cursor:pointer; display:inline-block;} .button:hover{ background-position:left -30px; text-decoration:none;} .button:focus {outline:0;} .button:active {position:relative; top:1px;} .button:link,.button:visited {color:#2d3133;} .btn-more:link,.btn-more:visited {background-color:#DA1A0B; color:#fff; font-size:10px; font-style:italic; line-height:normal; padding:3px 6px; margin:0; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; position:absolute; right:30px; top:30px;} .btn-more:hover {background-color:#DF5D53} .btn-more:active {background-color:#282828;} #translate-this .translate-this-button { /* width: 50px !important;*/ height: 98px !important; } .dropcap {color:#E30000; font-size:76px; line-height:0.9; text-transform:capitalize; padding:0.045em 14px 0 0; float:left;} .dropcap_sm {color:#E30000; font-size:47px; line-height:0.9; text-transform:capitalize; padding:0.1em 11px 0 0; float:left;} .section-title {font-size:17px; font-family:Georgia,"Times New Roman", serif; padding-bottom:24px;} .uppercase-title {font-size:12px; font-family:Georgia,"Times New Roman", serif; text-transform: uppercase; letter-spacing: 1px; padding-bottom:24px;} .small-title {color:#808080; font-size:11px; font-family: Helvetica,Arial,sans-serif; font-weight:normal; line-height:normal; text-transform:uppercase; padding:0 0 5px 0; display:block;} /* 3. CORE ELEMENTS ------------------------------------- */ #header-wrapper {background-color:#D52316; width:100%; height:100px; border-bottom:1px solid #a7170c; position:relative; z-index:1000; top:0;} #header {width:940px; margin:0 auto; position:relative; height:100px;} #header h1 a#logo{ color:#fff; font-size:24px; font-weight:normal; text-shadow:2px 2px 0 #A7170C; position:absolute; top:0px; left:10px;} #header h1 a#logo:hover {color:#000;} #nav {position:absolute; right:0; top:0; height:100px;} /* Top level */ #nav ul {} #nav ul li {float:left; height:100px; position:relative;} #nav ul li a.home { border-left:1px dotted #A7170C; text-indent:-9999px; background:url(images/ui_nav_home.png) center no-repeat; width:30px; } #nav ul li a:link,#nav ul li a:visited {color:#ffe4e2; font-family:Helvetica, Arial, sans-serif; font-size:14px; line-height:103px; text-decoration:none; height:100px; padding:0 13px; border-right:1px dotted #A7170C; display:block; outline:none;} #nav ul li:hover a, #nav ul li a.current {background-color:#CF1A0C; color:#fff; line-height:99px; height:97px; border-top:3px solid #A7170C; } #nav ul li a:active, #nav ul li a:focus {background-color:#A7170C; border-color:#8d1309;} #nav li.submenu:hover a {background-image:url(images/ui_dropdown_toparrow.png); background-position: center bottom; background-repeat:no-repeat;} #nav li.submenu ul.dropdown a {background-image:none;} /* Dropdown styles */ #nav ul.dropdown {border: 1px solid #2a2f33; width:180px; position:absolute; top:-999em; box-shadow:0 3px 8px rgba(0,0,0,0.6); -moz-box-shadow:0 3px 8px rgba(0,0,0,0.6); -webkit-box-shadow:0 3px 8px rgba(0,0,0,0.6);} /* Reset Dropdown list styles */ #nav ul.dropdown li {height:auto; padding:0; margin:0; float:none; position:relative; /*lte ie7 */ *display:inline-block; *margin-top:-1px;} /* Dropdown list anchor styles */ #nav ul.dropdown li a:link,#nav ul li ul li a:visited {background:#3F4147; color:#c7ced8; font:normal 12px/1 Helvetica, Arial, sans-serif; text-transform:none; padding:11px 15px; border:0; border-bottom:1px solid #494c53; display:block; height:1%;} #nav ul.dropdown li:first-child a {border-top: 3px solid #393a40;} /* Dropdown list anchor hover styles */ #nav ul.dropdown li a:hover, #nav ul li ul.dropdown li:hover a, #nav ul li ul li.submenu ul.dropdown li a:hover {background:#2d3337; color:#FFF;} #nav ul.dropdown li.submenu ul.dropdown li a {background:#3F4147;color:#c7ced8;} /* Tier 3 Dropdown Positioning*/ #nav ul.dropdown li.submenu ul.dropdown {left:180px; top:-999em;} /* CSS Dropdown Magic */ #nav li.submenu:hover ul.dropdown {top:70px;} #nav li.submenu ul.dropdown li.submenu:hover ul.dropdown {top:0;} #content-wrapper {width:942px; margin:0 auto 60px; position:relative;} #main-container {background:#fff url(images/ui_contentbg.gif) repeat-y; width:940px; position:relative; z-index:500; box-shadow:0 0 2px rgba(0,0,0,0.5); -moz-box-shadow:0 0 2px rgba(0,0,0,0.5); -webkit-box-shadow:0 0 2px rgba(0,0,0,0.5);} #breadcrumb {font-family:Georgia,"Times New Roman", serif; font-style:italic; line-height:normal; letter-spacing:-.025em; padding:25px 0;} #search legend {display:none;} #search input {background:#e3e3e3 url(images/ui_search_bg.gif) repeat-x; color:#9e9e9e; font:normal 16px Georgia, "Times New Roman", serif; width:242px; padding:8px; border:1px solid #aaa;} #search input:focus, #search input:active {color:#5B5B5B;} #content {width:620px; float:left;} .section {padding:30px; border-top:1px solid #ccc; overflow:hidden;} .two-columns { background:url(images/dotted_2col.gif) center top repeat-y; padding:0;} .two-columns, .three-columns, .four-columns {display:inline-block;} #content .col {font-size:14px; width:250px; padding:30px; float:left; } #content .col ul li:first-child {border-top:0;} #content .col ul li {background:none; padding:3px 0; list-style:none; border-top: 1px dotted #bbb;} #content .col ul div.announcement-list{background:none; padding:3px 0; list-style:none; border-top: 1px dotted #bbb;} #content .col ul div.announcement-list:first-child{display:none;} #content form p {padding:0 0 12px;} #content form .half-input {float:left; width:50%;} #content form .half-input .input { width:92%; } #content form .left .input { width:85%;} #content form label {font-size:14px;} #content form .input, #content textarea {background:url(images/ui_input_inner_shadow.gif) left top repeat-x; color:#808080; font:normal 16px Georgia, "Times New Roman", serif; width:96%; padding:8px; margin-top:5px; border:1px solid #aaa; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px;} #content form .input:focus, #content form textarea:focus {color:#000; border:1px solid #282828;} #content form .error {background: #fff0f0; border:1px dashed #eb5550;} #content form .error:focus {border-color: #DA1A0B;} #content form input[type=checkbox] {margin-right:5px;} #sidebar {font-size:13px; width:320px; height:100%; float:left;} #sidebar p {font-size:12px; font-family:Helvetica,Arial,sans-serif; padding-bottom:18px;} #sidebar ol {list-style-type:decimal; list-style-position:outside; padding-left:20px;} #sidebar ul li, #sidebar ol li {padding:3px 0; border-top:1px solid #ddd;} #sidebar ul li:first-child, #sidebar ol li:first-child {padding-top:0; border-top:0;} #sidebar .section {background:url(images/ui_inner_shadow.png) left top repeat-x; padding:30px; border-bottom:1px solid white;} #sidebar .section:last-of-type {border-bottom:0;} #sidebar .section:first-of-type {background:0; border-top:0;} #sidebar #ads {padding-bottom:20px; overflow:hidden;} #sidebar #ads a img {padding-bottom:10px; float:left;} #sidebar #ads .odd img {padding-right:10px;} #twitter-feed .section-title {padding:0;} #twitter-feed #twitter-id {padding-bottom:20px; display:inline-block;} #twitter-feed ul {padding-bottom:5px;} #twitter-feed ul li {padding:8px 0;} #twitter-feed ul li img.alignleft {margin:0 15px 10px 0;} #twitter-feed ul li span {padding:0; font-size:12px; font-family:Helvetica,Arial,sans-serif; padding-bottom:18px;} #twitter-feed ul li span a {padding:0; font-size:12px; font-family:Helvetica,Arial,sans-serif; padding-bottom:18px; color:#F00; } #twitter-feed ul li a{color:#91989f; font-size:11px; display:block; height:30px; } #sidebar .tabnav {padding-bottom:1px; display:inline-block;} #sidebar .tabnav li {border-top:0; display:inline; line-height:1;} #sidebar .tabnav li a {background:#EAECEF; color:#808080; font-size:11px; font-style:normal; font-family: Helvetica,Arial,sans-serif; text-transform:uppercase; padding:9px; border:1px solid #ccc; border-left:0; margin-bottom:-2px; display:block; float: left;} #sidebar .tabnav li.ui-state-active a {background-color:#fff; color:#000; outline:none; border-bottom:1px solid #fff;} #sidebar .tabnav li a:hover, #sidebar .tabnav li a:active {color:#000; text-decoration:none;} #sidebar .tab-content {background-color:#fff; padding:30px; border-top:1px solid #ccc; border-bottom: 1px solid transparent; } #sidebar .tab-content li {font-style:normal; padding:4px 0;} #sidebar .tab-content li:first-child {padding-top:4px;} .ui-tabs .ui-tabs-hide {display:none;} #sidebar #blog-stats { padding: 30px 30px 30px 30px; border-bottom:0; overflow:hidden; position:relative;} #sidebar #blog-stats a.stat:link,#sidebar #blog-stats a.stat:visited {color:#202020; font-size:12px; font-style:italic; line-height:1.3; display:block; float:left; margin-right:20px;} #sidebar #blog-stats a span {font-family:Helvetica, Arial, sans-serif; font-size:20px; color:#aaa; } #sidebar #blog-stats a:hover span {color:#202020;} #sidebar #update-icons {position:absolute; right:30px; top:36px; padding:5px; background:#e2e5eb; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; border:1px solid #ccc;} #sidebar #update-icons:hover {border-color:#aaa;} #sidebar #update-icons li:first-child {border:0;} #sidebar #update-icons li:last-child {padding:0;} #sidebar #update-icons li { padding:0 3px 0 0; border:0; float:left; } #sidebar #update-icons li a { display: block; width:16px; height:16px; text-indent:-9999px; overflow:hidden;} #sidebar #update-icons li.rss a {background:url(images/icons/ico_rss_sm.png) no-repeat; } #sidebar #update-icons li.twitter a {background:url(images/icons/ico_twitter_sm.png) no-repeat;} #sidebar #update-icons li.fb a {background:url(images/icons/ico_fb_sm.png) no-repeat;} #sidebar #update-icons li.email a {background:url(images/icons/ico_email_sm.png) no-repeat;} #sidebar #popular-tags ul li {border:0; padding:0; display:inline;} #sidebar #popular-tags ul li a {background:#e2e5eb; color:#999da3; font-size:12px; font-style:italic; line-height:1; padding:6px 8px; display:inline-block; margin: 0 8px 8px 0; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; -khtml-border-radius:3px; } #sidebar #popular-tags ul li a:hover {background:#DA1A0B; color:#fff;} #sidebar #popular-tags ul li a:active,#sidebar #popular-tags ul li a:focus {background:#282828; color:#fff;} #footer-wrapper {border-top:5px solid #ccc; background-color:#202020;font-family:Helvetica,Arial,sans-serif; position:relative; z-index:1000;} #footer {color:#848484; font-size:12px; width:940px; padding:40px 0; margin:0 auto; overflow:hidden;} #footer .section-title {color:#eee; text-transform: uppercase; font-size: 12px; letter-spacing:1px; } #footer a:link,#footer a:visited {color: #bbb;} #footer a:hover {color:#fff;} #footer p, #footer ul {padding-bottom:24px;} #footer .col {width:280px; margin-right:50px; float:left;} #footer .last {margin-right:0;} #footer .two-columns .left {float: left; width:125px; padding-right: 30px;} #socialize li {display:inline;} #socialize li a {float:left; margin-right:5px; display:block; } #flickr {padding-bottom: 20px;} #flickr a:hover img {filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity:0.7; opacity:0.7; } #flickr a img {margin:0 6px 6px 0; -moz-box-shadow:0 0 3px rgba(0,0,0,1); -webkit-box-shadow:0 0 3px rgba(0,0,0,1);} #colophon {color:#606060; font-size:11px;} #colophon a:link, #colophon a:visited {color:#808080;} #colophon a:hover {color:#fff;} #colophon small {font-size:12px; font-style:italic; font-family:"Hoefler Text",Baskerville,Garamond,"Palatino Linotype",Georgia,"Times New Roman", serif;} #quick-contact {padding-bottom:30px;} #quick-contact li{padding-bottom:10px; } #quick-contact legend{display:none; } #quick-contact label{font-size:11px; text-transform:uppercase; padding-bottom:3px; display:block;} #quick-contact .input ,#quick-contact textarea{color:#494949; font-size:13px; font-family:Helvetica,Arial,sans-serif; width:266px; padding:8px 6px; border:1px solid white; -moz-border-radius:2px; -webkit-border-radius:2px; } #quick-contact .input {width:} #quick-contact textarea{height:98px; } #quick-contact #qc-submit{background-image:url(images/ui_darkbutton_bg.png); color:#c5cacc; border-color:#181818; } #quick-contact #catwebformbutton{background-image:url(images/ui_darkbutton_bg.png); color:#c5cacc; border-color:#181818; } #quick-contact #qc-submit:hover{background-position:left -33px; } #quick-contact #catwebformbutton:hover{background-position:left -33px; } #quick-contact .error {background: #ffe1e4; border:1px dashed red;} #quick-contact .req{color:#DA1A0B; vertical-align:top; font-size:8px;} #subForm {padding-bottom:30px;padding-left:10px;} #subForm li{padding-bottom:10px; list-style:none; } #subForm legend{display:none; } #subForm label{font-size:11px; text-transform:uppercase; padding-bottom:3px; display:block;} #subForm .input ,#subForm textarea{color:#494949; font-size:13px; font-family:Helvetica,Arial,sans-serif; width:210px; padding:8px 6px; border:1px solid white; -moz-border-radius:2px; -webkit-border-radius:2px; margin-bottom:15px; } #subForm textarea{height:98px; } #subForm #qc-submit{background-image:url(images/ui_darkbutton_bg.png); color:#c5cacc; border-color:#181818; } #subForm #qc-submit:hover{background-position:left -33px; } #subForm .error {background: #ffe1e4; border:1px dashed red;} p#qc-thanks { display:none;} p#qc-thanks strong { font-size:14px;} /* 4. HOME ------------------------------------- */ body.home #content-wrapper {padding-top:380px;} body.home #main-container {border-top:0;} #featured-post p {padding-bottom:0;} #slider {width:1920px; position:absolute; z-index:100; left:-490px; top:0;} #slider #slide-buttons {position:absolute; right:15px; top:15px;} #slider #slide-buttons a {background:url(images/ui_slider_buttons.png) no-repeat; text-indent:-9999px; width:31px; height:25px; display:block; overflow:hidden; outline:none;} #slider #slide-buttons a.prev:link, #slider #slide-buttons a.prev:visited {background-position:left top; margin-bottom:5px;} #slider #slide-buttons a.prev:hover {background-position:left center;} #slider #slide-buttons a.prev:active {background-position:left bottom;} #slider #slide-buttons a.next:link, #slider #slide-buttons a.next:visited {background-position:right top;} #slider #slide-buttons a.next:hover {background-position:right center;} #slider #slide-buttons a.next:active {background-position:right bottom;} #slider .slides {position:relative;} #slider .slides li {width:1920px; overflow:hidden; text-align:center; position:absolute; display:none;} #slider .slides li:first-child {display:block;} #slider #panel-wrapper {background:url(images/transparent.gif) repeat; /*required for mouseenter jquery in IE */ ;width:940px; height:380px; position: absolute; left:490px; top:0; z-index: 250; overflow:hidden;} #slider #panel {background:rgb(40,40,40); background:rgba(0,0,0,0.8); width:940px; position:absolute; top:378px; height:84px; z-index:500; overflow:hidden; display:none;} #slider .captions {width:600px; padding:15px;} #slider .captions li {display:none;} #slider .captions li:first-child {display:block;} #slider .captions h3 {color:#FFF; font-family:Helvetica,Arial,sans-serif; font-size:12px; font-weight:bold; text-decoration:none; padding-bottom:5px;} #slider .captions h3 a {color:#FFF;} #slider .captions p {color:#919DA1; font-size:12px; font-family:Helvetica,Arial,sans-serif; padding:0;} #recent-posts {} #recent-posts ul {overflow:hidden;} #recent-posts .post .small-title {padding-bottom:3px;} #recent-posts .post {float:left; width:250px; padding:10px 0; } #recent-posts .post .post-meta {font-size:11.5px;} #recent-posts .odd {padding-right:30px; clear:left;} #recent-posts .even {padding-left:30px;} #recent-posts .post p {padding-bottom:15px; font-size:14px;} #recent-posts .post-title a { font-size:24px; font-weight: normal; } #recent-posts .post-meta {line-height: normal; } #popular-posts {} #content #popular-posts ul li {padding:8px 0; } #content #popular-posts ul li:hover {background-color:#f9f9f9;} #content #popular-posts .post-title a {font-size:20px; font-weight:normal;} #content #popular-posts small {display:block; padding: 3px 0;} #recent-comments {} #content #recent-comments ul li {padding: 10px 0; } #content #recent-comments ul li:hover {background-color:#f9f9f9;} #content #recent-comments ul li img {float:left; padding-right:10px; width: 36px; height: 36px;} #content #recent-comments ul li p {font-size:14px; font-style: italic; padding:0;} #content #recent-comments ul li small {display:block; padding: 3px 0;} #selected-work {position:relative; padding-bottom:20px; } #selected-work ul li {padding:0; border:0; display:inline;} #selected-work ul li a {color:#fff; width:125px; height:115px; margin-bottom:10px; position:relative; display:block; float:left; overflow:hidden;} #selected-work ul li.odd a {margin-right:10px;} #selected-work ul li a span {background:rgb(0,0,0); background:rgba(0,0,0,0.75); color:#fff; font-size:12px; font-style:italic; width:95px; height:85px; padding:10px; border:5px solid #000; display:block; position:absolute; left:0; top:125px;} #selected-work ul li a:hover span {top:0;} #selected-work ul li a:hover {-moz-box-shadow:0 0 4px rgba(0,0,0,0.4); -webkit-box-shadow:0 0 4px rgba(0,0,0,0.4);} .sectionSelected {padding:30px 10px 30px 30px; border-top:1px solid #ccc; overflow:hidden;} #selected-work .section { border-top:1px solid #ccc; overflow:hidden;} #selected-work .project {position:relative; width:125px; height:125px; margin-right:10px; margin-bottom:10px;} #selected-work .project a img {width:125px; float:left;} #selected-work .project .caption p{display:none;} #selected-work .project .caption span{display:none;} #selected-work .project .caption h3{background:rgb(0,0,0); background:rgba(0,0,0,0.75); color:#fff; font-size:12px; font-style:italic; width:95px; height:95px; padding:10px; border:5px solid #000; display:block; position:absolute; left:0; top:125px; } #selected-work .project .caption:hover h3{top:0px;} #latest-news {} #latest-news ul li {padding:16px 0;} #latest-news ul li h3 {padding-bottom:15px;} #latest-news ul li p { padding:0;} /* 5. BLOG / PAGES ------------------------------------- */ #blog-top {font-size: 14px; height:24px; line-height: 24px; font-style: italic; margin: 30px 30px 0 30px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 6px 0; overflow: hidden;} #blog-top p { padding: 0; } #blog-top .pagination a.next, #blog-top .pagination a.prev { display:inline-block; padding:0 10px;} #blog-top .pagination a.prev {padding-left:0;} #blog-top .pagination span {font-weight:bold; } a.BlogTagCloud-XX-Small { -moz-border-radius:3px 3px 3px 3px; background:none repeat scroll 0 0 #E2E5EB; color:#999DA3; display:inline-block; font-size:12px; font-style:italic; line-height:1; margin:0 8px 8px 0; padding:6px 8px; } #change-view {float:right; } #change-view a {background:url(images/ui_changeview_spr.gif) no-repeat; text-indent:-9999px; width:24px; height:24px; margin-left: 5px; display:inline-block; outline:none;} #change-view #grid-view:hover {background-position:left bottom;} #change-view #list-view {background-position:-24px top;} #change-view #list-view:hover {background-position: -24px bottom;} #blog-posts {padding:30px; background:none;} #blog-posts .first {padding-top:0; border-top:0;} #blog-posts .post p:last-of-type {padding-bottom:0;} .post {padding:30px; overflow:hidden; } .post-title {font-weight:normal; font-family:Georgia,"Times New Roman",serif; font-size:34px; letter-spacing:-0.025em; padding:0;} .post-title a:link, .post-title a:visited {color:#003040; display:block;} .post-title a:hover {color:#DA1A0B;} .post-title a:active {color:#000;} .post .post-meta {font-size:12px; text-transform:uppercase; padding:2px 0 6px; margin:0 0 15px; border-top:0; border-bottom:1px dotted #bbb;} .post .post-meta span {margin-right:5px;} .post .post-meta span img {margin-right:5px; position:relative; top:2px;} .post h5, .post h6 {text-transform:uppercase; letter-spacing: 1px; } .post p.lead { font-size:20px; color:#808080; } .post ol li,.post ul li {padding:5px;} .post ol {margin-left:20px; padding-bottom:20px;} .post ol li {list-style-type:decimal; list-style-position:outside;} .post ol ol,.post ul ul {padding:5px 0 0; margin-bottom:-5px;} .post ol ol li {list-style-type:lower-alpha;} .post ol ol ol li {list-style-type:lower-roman;} .post ul {padding-bottom:20px;} .post ul li {list-style-position:outside; background:transparent url(images/ul_li_square.gif) no-repeat 0 14px; padding-left:18px;} .post ul li li {background:transparent url(images/ul_li_subarrow.gif) no-repeat 0 13px;} .post big {font-size:20px;} .post blockquote {color:#606060; font-style:italic; padding:30px;} .post .pullquote {background:url(images/quotes_left.gif) left 20px no-repeat; width:220px; padding:20px 0 20px 30px; margin:10px 20px 10px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; float:left;} .post .pullquote p {/* background:url(images/right_quote.gif) right bottom no-repeat; */ font-size:16px; font-style:italic; padding:0 20px 0 0;} .post .darkblock {font-style:italic; color:#fff; background:#282828; width: 200px; padding:30px 30px 2px 30px; font-size:15px; text-align:right;} .post .darkblock p a {color:#ffffff;} .post .darkblock p a:hover {color:#DA1A0B;} .post img.alignleft {padding:5px 5px 5px 0; margin:0 16px 8px 0; float:left;} .post img.alignright {padding:5px 0 5px 5px; margin:0 0 8px 16px; float:right;} body.single-post .post h1.post-title {font-size:42px;padding-bottom:24px;} body.page .post h1.post-title {font-size:42px; padding-bottom:20px;} body.archive .post {border-bottom:4px solid #f4f4f4; padding:20px 0;} body.archive .list .post {padding:15px 0; border-top:1px dotted #bbb;} body.archive #blog-posts.list .first {padding-top:12px;} body.archive .list .post:hover {background-color:#f9f9f9;} .list .post-title a {font-size:28px;} .list .post .post-meta {border-bottom:0; margin:0;} .list .post .post-image, .list .post p {display:none;} .related-posts { background-color:#f9f9f9; margin-right:1px;} .related-posts ol { list-style-type: decimal; margin-left:24px; } .related-posts ol li {border-bottom:1px dotted #bbb;} .related-posts ol li:first-child {border-top:1px dotted #ccc;} .related-posts ol li a {padding: 5px 0; display:block; } .related-posts ol li a:hover {background:#eee;} .nextprev {font-size:16px; font-style:italic; border-top: 1px solid #ddd; margin: 0 30px 30px;} .nextprev a {display:block; width:50%; padding:10px 0;} .nextprev a.next {text-align:right; float:right;} .nextprev a.prev {float:left;} .nextprev a span {color:#808080; font-family:Helvetica,Arial,sans-serif; font-size:12px;} .nextprev a:hover span {color:#2B2B2B;} .nextprev a:hover {background:#f9f9f9;} #comments {} #comments h3 {color:#003040; font-size:32px; font-weight:400; letter-spacing:-.025em; padding:0 0 20px;} #comments #num-responses { float: right; } #comments #num-responses img { position:relative; top:10px; margin-right:6px;} #commentslist {border-top:1px dotted #bbb; padding-top:15px;} #commentslist li {display:inline-block;} #commentslist li .avatar { background:#fff; width:42px; height:42px; padding:3px; margin:0 20px 0 0; border:1px solid #ddd; float:left;} #commentslist li .comment-wrap {margin-bottom:15px; border-bottom:1px dotted #bbb;} #commentslist li .comment-author {padding-top:3px;} #commentslist li .comment-author cite {font-weight:bold;} #commentslist li .comment-meta {margin-bottom:20px;} #commentslist li .comment-meta abbr.comment-time {color:#909090;font-size:12px; font-family:Helvetica,Arial,sans-serif;} #commentslist li p {font-size:14px; padding-bottom:20px; line-height:1.6;} #commentslist li blockquote {font-style:italic; padding-left:20px;} .comment-reply-link:link,.comment-reply-link:visited {background:url(images/icons/ico_reply.png) left 3px no-repeat; font-size:14px; padding-left:22px; margin-bottom:15px; display:inline-block;} /* Threaded Comment Styles */ #commentslist ul.children {margin-left:20px;} #commentslist ul.children ul.children {margin-left:0;} #commentslist li ul li .comment-wrap {background-color:#f9f9f9; border:1px dotted #bbb; padding:20px 20px 0 20px;} #commentslist li ul li .avatar img {width:36px; height:36px;} #respond {} #comment-form label span {color:#909090; font-family:Helvetica,Arial,sans-serif; font-size:12px;} #comment-form textarea {height:150px;} #comment-form input#submit-comment {margin-top:0;} #sidebar #author-details {} #sidebar #author-details p.author-description {padding-bottom:36px;} #sidebar #author-details img {margin-top:5px;} #sidebar #author-posts {padding-bottom:0;} #sidebar #side-nextprev {padding:20px 30px; overflow:hidden; *height:1%;} /* Arrow Styles */ span.arrow-prev, span.arrow-next {width:0; height:0; border-style:solid; border-width:5px; border-color:#d52316 #A7170C #d52316 transparent; margin:0 10px 0 0; position: relative; top: 1px; display:inline-block; } span.arrow-next {border-color:#D52316 transparent #D52316 #A7170C; margin:0 0 0 10px;} /* Button Styles */ a.btn-next, .grey-next {float:right;} a.btn-prev, .grey-prev {float:left;} a.btn-prev, a.btn-next, .grey-prev, .grey-next {background:#D52316; color:#fff; font-family:Helvetica,Arial,sans-serif; text-align:center; line-height:1; width:48%; padding:9px 0; display:block; -moz-border-radius:3px; -webkit-border-radius:3px;} a.btn-prev:hover, a.btn-next:hover {background:#DF5D53;} /* Arrows on Hover */ a.btn-prev:hover span.arrow-prev {border-color:#DF5D53 #A7170C #DF5D53 transparent;} a.btn-next:hover span.arrow-next {border-color:#DF5D53 transparent #DF5D53 #A7170C;} /* Arrows on Click */ a.btn-prev:active, a.btn-next:active {background-color:#282828;} a.btn-prev:active span.arrow-prev {border-color:#282828 #fff #282828 transparent;} a.btn-next:active span.arrow-next {border-color:#282828 transparent #282828 #fff;} /* Inactive Button Arrows */ .grey-prev, .grey-next {background-color:#E2E5EB; color:#999DA3;} .grey-prev span.arrow-prev {border-color:#E2E5EB #999DA3 #E2E5EB transparent;} .grey-next span.arrow-next {border-color:#E2E5EB transparent #E2E5EB #999DA3;} /* 6. FULL WIDTH ------------------------------------- */ body.full-width #main-container {background:#fff;} body.full-width #content {width:auto; float:none;} body.full-width #content .post .sidenote {color:#808080; font-family:Helvetica,Arial,sans-serif; width:130px; font-size:12px; line-height:2;} body.full-width #content .post .darkblock { width: 220px;} body.full-width #content .post .col {padding:15px 0; margin-right:20px;} body.full-width #content .post .end {margin-right:0;} body.full-width #content .post .two-columns {background:none;} body.full-width #content .post .two-columns .col {font-size:16px; width:430px;} body.full-width #content .post .three-columns .col {font-size:14px; width:280px;} body.full-width #content .post .four-columns .col {font-size:14px; width:205px;} body.full-width #content .post .space3left {margin-left: 450px;} body.full-width #content .post .space2left {margin-left: 300px;} body.full-width #content .post .space1left {margin-left: 150px;} body.full-width #content .post .space1right {margin-right: 150px;} body.full-width #content .post .space2right {margin-right: 300px;} body.full-width #content .post .space3right {margin-right: 450px;} body.full-width #content .post .pull1left {margin-left: -150px; float:left;} body.full-width #content .post .pull2left {margin-left: -300px; float:left;} body.full-width #content .post .pull3left {margin-left: -450px; float:left;} body.full-width #content .post .pull1right {margin-right: -150px; float:right;} body.full-width #content .post .pull2right {margin-right: -300px; float:right;} body.full-width #content .post .pull3right {margin-left: -450px; float:right;} body.full-width #content .post .right {margin-top: 5px; margin-bottom:10px; margin-left:20px;} body.full-width #content .post .left {margin-top:5px; margin-right:20px; margin-bottom:10px;} body.full-width #content .post .one {width:130px;} body.full-width #content .post .two {width:280px;} body.full-width #content .post .three {width:430px;} body.full-width #content .post .four {width:580px;} body.full-width #content .post .five {width:730px;} /* 7. PORTFOLIO ------------------------------------- */ body.portfolio #change-view {line-height:24px; float:none; margin-bottom:30px;} body.portfolio #change-view {font-style:italic; padding:5px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } body.portfolio #change-view a#full-view { background-position: -48px top;} body.portfolio #change-view a#full-view:hover { background-position: -48px bottom;} body.portfolio #change-view a#thumb-view { background-position: -72px top;} body.portfolio #change-view a#thumb-view:hover { background-position: -72px bottom;} body.portfolio #sidebar { color:#4d4e52; font-size:13px; width:235px; float:left; } body.portfolio #sidebar .section { background:0; border:0; padding-bottom:0; } body.portfolio #sidebar ul li { border-color:#eee;} body.portfolio #sidebar #side-nextprev { padding: 0 0 30px 0;} body.portfolio #main-container {background:#fff url(images/dotted_4col.gif) left top repeat-y;} body.portfolio #content { width:705px; float:left; } #project-list {} .project {background-color:none; font-size:14px; width:235px; height:445px; float:left; position:relative; overflow:hidden} .project a.hover {position:absolute; left:0; top:0; width:100%; height:100%; outline:0; background:url(images/transparent.gif) repeat; /*required for mouseenter jquery in IE */} .project a.hover span {display:none;} .project .caption {min-height:75px; padding:15px; z-index: 200;} .project span {color:#909090; font-size:10px; font-family:Helvetica,Arial,sans-serif; letter-spacing:normal; line-height:1; text-transform:uppercase; padding-bottom:5px; display:block; } .project h3 {color:#DA1A0B; font-size:18px;} .project p {color:#505050; padding-bottom:15px;} .project:hover {background-color:#000;} .project:hover h3 {color:#fff;} .project:hover p {color:#606060;} .thumbs .project {width:235px; height:235px; float:left; margin:0; } .thumbs .project .caption {background:rgb(0,0,0); background:rgba(0,0,0,0.85); width:195px; height:195px; padding:20px; position:absolute; left:0; top:0; cursor:pointer; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0;} .thumbs .project h3 {font-size:32px; text-shadow:1px 1px 0 #000; color:#fff;} .thumbs .project p {display:none;} .thumbs .project a.hover {width:235px; height:235px;} .thumbs .project:hover .caption {filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity:1;} #sidebar #sliding-container {width:175px; padding-bottom:30px; height:auto;} #sidebar #portfolio-cats ul li a.selected { color:#fff; line-height:1; background-color:#DA1A0B; padding:3px 5px; -moz-border-radius: 3px; -webkit-border-radius:3px; border-radius:3px; display:inline-block;} .fixed {position:fixed; top:0;} .pinned {position:absolute; right:0; bottom:0;} body.single-project #content {position: relative; width:auto; min-height:700px; float:none; } body.single-project .hgroup {background:rgb(255,255,255); background:rgba(255,255,255,0.85); font-size:16px; position: absolute; width:410px; margin-top: 35px; padding: 20px 30px; left:0; top:0; z-index:100;} body.single-project .hgroup h1 {padding:0; color:#003040; font-size: 27px; } body.single-project .project-content {font-size:16px; background:#fff; width:410px; padding:30px; position:relative; z-index:50; float: left;} body.single-project #ideasContent{width:644px;} body.single-project .nextprev {margin:0; } body.single-project .section-title {font-size:15px;} body.single-project #project-slider {position:relative; height:300px; width:940px;} body.single-project #project-slider a#lightbox {background:url(images/ui_proj_lightbox.png) no-repeat; width:37px; height:36px; position:absolute; right:10px; top:10px; z-index:100; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0;} body.single-project #project-slider ul li {position:absolute; overflow:hidden; display:none; width:940px; height:300px;} body.single-project #project-slider ul li:first-child {display:block;} body.single-project .project-details, .related-projects {float:left; width:195px; padding:195px; padding:20px;} body.single-project .project-details dl {width:195px; overflow:hidden; padding-bottom:30px;} body.single-project .project-details dl dt {font-size: 12px; color:#808080; text-transform: uppercase; padding-top:5px;} body.single-project .project-details dl dd {font-size: 22px; padding-bottom:5px; border-bottom: 1px solid #eee;} body.single-project .project-details ul.worked-on { list-style-type: square; list-style-position: inside;} body.single-project .project-details ul li {color:#606060; font-size:13px; line-height:1.6; } body.single-project .related-projects ul {border-top:1px solid #eee;} body.single-project .related-projects .project a img {width:40px; height:40px; float:left; margin-right:15px; padding-top:10px; padding-bottom:10px;} body.single-project .related-projects .project {display:block; height:60px; width:200px; border-bottom: 1px solid #eee; overflow:hidden;} body.single-project .related-projects .project .caption {height:10px; min-height:0px;overflow:hidden;} body.single-project .related-projects .project .caption p{display:none;} body.single-project .related-projects .project .caption span{display:none;} body.single-project .related-projects .project .caption h3{font-size: 13px; padding:10px 0; overflow:hidden; } body.single-project .related-projects .project:hover{background-color:#F0f0f0; } body.single-project .related-projects .project:hover h3 {color:#000; } /* 9. CONTACT FORM ------------------------------------- */ div.error {background:#E13629 url(images/icons/ico_alert.png) 10px 10px no-repeat; color:#fff; font-size:14px; font-style:italic; padding:10px; margin-bottom:28px; display:inline-block; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;} div.error p {line-height:22px; padding:0; margin-left:32px;} div.success {background:#c9f661 url(images/icons/ico_check.png) 10px 10px no-repeat; font-size:14px; font-style:italic; padding:10px; margin-bottom:28px; display:inline-block; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;} div.success p {line-height:24px; padding:0; margin-left:36px; } #contact-form{padding-bottom:20px;} #contact-form .req{color:#DA1A0B; vertical-align:top; font-size:10px;} #contact-form legend{display:none;} #contact-form ol{padding:0; margin-left:0;} #contact-form ol li {list-style-type:none; padding:0 0 12px;} #contact-form ol li.screenReader {position:absolute; left:-9999px; top:-9999px;} #contact-form label span.alert {color:#DA1A0B; font-size:12px; font-family:Helvetica,Arial,sans-serif;} #contact-form textarea {height:170px;} /* End of CSS */