/*
THEME NAME: Super Copylicious
DESCRIPTION: Bringing out the awesome.
VERSION: 1.6.1
AUTHOR: <a href="http://sjoystudios.com/">Sarah J. Bray</a>
AUTHOR URI: http://sjoystudios.com
*/

/* Colors 
Orange:#f6891f
Blue:#81a1a7
Dark Blue:#384a4c
Green:#d0e287
Black:#3b3e3f */

/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
strong { font-weight: bold }
em { font-style: italic }
a img { border:none } /* Gets rid of IE's blue borders */

/* Overall */
body {
font-family:verdana, helvetica, sans-serif;
font-size:14px;
color:#3b3e3f;
}

a {
color:#f6891f;
}

a:hover {
color:#d0e287;
}

div#wrapper {
width:1110px;
margin:0 auto;
}


/* Header */
/* Logo */
div#header {
z-index:2;
}

div#header img {
padding-top:5px;
float:left;
}

/* Menu */
div#menu {
z-index:1;
}

div#menu ul li {
list-style-type:none;
color:#81a1a7;
font-size:13px;
line-height:1.25em;
padding:3px 0;
}

div#menu ul li a {
color:#81a1a7;
text-decoration:none;
z-index:100;
}

div#menu ul li a:hover {
color:#f6891f;
text-decoration:none;
}

div#menu ul li h2 a {
font-size:20px;
color:#384a4c;
}

div#menu ul li h2 a:hover {
color:#d0e287;
}

div#menu {
padding:20px 0 0 320px;
}

div#menu table tr td {
vertical-align:bottom;
}

td.col-1 {
width:130px;
padding-bottom:10px;
}

td.col-2 {
width:170px;
padding:0 35px 10px 0;
}

td.col-3 {
width:175px;
padding:0 0 10px 0;
}

td.col-4 {
width:145px;
}

ul.menu-1 a img.dots-about, ul.menu-2 a img.dots-find-yourself, ul.menu-3 a img.dots-packages, ul.menu-4 a img.dots-contact {
display:none;
}

ul.menu-1 a:hover img.dots-about {
display:block;
position:absolute;
top:118px;
left:75px;
z-index:-1000;
}

ul.menu-2 a:hover img.dots-find-yourself {
display:block;
position:absolute;
top:118px;
left:73px;
z-index:-2000;
}

ul.menu-3 a:hover img.dots-packages {
display:block;
position:absolute;
top:117px;
left:72px;
z-index:-3000;
}

ul.menu-4 a:hover img.dots-contact {
display:block;
position:absolute;
top:113px;
left:63px;
z-index:-4000;
}

ul.menu-4 { 
min-height:30px;
}

/* Let's Begin */
img#dots-about2 {
position:absolute;
top:-32px;
left:75px;
z-index:-5000;
}

img#dots-find-yourself2 {
position:absolute;
top:-32px;
left:73px;
z-index:-5000;
}

img#dots-packages2 {
position:absolute;
top:-33px;
left:72px;
z-index:-5000;
}

img#dots-contact2 {
position:absolute;
top:-37px;
left:63px;
z-index:-5000;
}

/* Sidebar */
div.sidebar {
width:310px;
padding:150px 0 50px 0;
}

div.sidebar ul li {
list-style-type:none;
}

div.sidebar h3 {
font-size:24px;
font-weight:bold;
}

li#action-items {
font-size:22px;
font-weight:bold;
}

li#action-items li {
padding:5px 0;
}

li#action-items a {
text-decoration:none;
}

li#action-items img, li#categories img, li#projects img {
float:left;
padding-right:8px;
}

img.dots-sidebar {
padding:20px 0 30px 60px;
}

li#testimonials {
font-size:18px;
line-height:1.3em;
padding-left:58px;
}

div.quoted {
font-size:12px;
color:#81a1a7;
line-height:1.2em;
padding:8px 0 16px 0;
}

span.title {
font-style:italic;
}

li#categories ul li, li#projects ul li {
padding:15px 0 0 64px;
font-size:18px;
}

li#categories a {
color:#384a4c;
text-decoration:none;
}

li#categories a:hover {
color:#f6891f;
text-decoration:underline;
}

span.project {
font-size:15px;
color:#81a1a7;
}

/* Content */
div#content {
margin-top:140px;
float:right;
width:790px;
padding:0 0 50px 50px;
z-index:3;
line-height:1.7em;
}

div#content h2 {
font-size:30px;
color:#384a4c;
font-weight:200;
padding:10px 0;
line-height:1.2em;
}

div#content h2 a {
text-decoration:none;
color:#384a4c;
}

div#content h2 a:hover {
color:#f6891f;
}

h2.entry-title {
line-height:1.3em;
padding:0 0 25px 0;
}

div.page-illo {
float:right;
z-index:4;
}

div#content p {
padding:10px 0;
}

div#content h3 {
font-size:26px;
padding:15px 0 15px 0;
font-weight:200;
line-height:1.4em;
}

div#content h4 {
font-size:22px;
padding:25px 0 15px 0;
font-weight:200;
color:#81a1a7;
}

div#content h4.sub-heading {
padding-top:0px;
}

div#content ul {
padding:10px 0;
}

div#content li {
margin:0 50px;
}

div#content .entry-meta {
font-size:12px;
padding-top:12px;
}

img.alignleft {
padding:5px 15px 5px 0;
}

img.alignright {
padding:5px 0 5px 15px;
}

blockquote {
background-color:#e5e1de;
margin:0 50px;
padding:5px 10px;
}

blockquote.even {
background-color:#ffffff;
margin:15px 50px;
padding:5px 10px;
}

div.packages {
padding:15px 0;
}

div.packages img a {
z-index:1;
}

div.pkg {
float:left;
z-index:2;
}

p.pkg-desc {
width:250px;
margin-left:12px;
margin-bottom:20px;
}

div.packages-quote blockquote {
clear:both;
margin:10px 100px;
padding:20px;
}

span.packages-quote-first {
font-size:18px;
}

div.expansion {
margin:40px 0 0 50px;
}

span.read-story {
background-color:#ffffff;
border:1px solid #bdbbb9;
margin-top:10px;
padding:5px;
font-weight:bold;
font-size:18px;
text-decoration:none;
}

a span.read-story {
text-decoration:none;
}

a:hover span.read-story {
color:#ffffff;
text-decoration:none;
}

span.read-story:hover {
color:#ffffff;
background-color:#f6891f;
text-decoration:none;
}

a span.read-story:hover {
color:#ffffff;
background-color:#f6891f;
text-decoration:none;
}

span.read-story a {
text-decoration:none;
}

span.read-story a:hover {
color:#ffffff;
text-decoration:none;
}

span.read-story:hover a {
color:#ffffff;
background-color:#f6891f;
text-decoration:none;
}

div.pkg-detail-illo {
float:right;
}

span.read-story.packages {
font-size:22px;
}

span.read-story.details {
font-size:22px;
}

span.read-story.wilderness {
font-size:22px;
}

div#nav-below {
padding-top:20px;
}

div.nav-previous {
float:left;
} 

div.nav-next {
float:right;
}

div.post {
padding-bottom:40px;
border-bottom:1px dotted #81a1a7;
margin-bottom:40px;
}

div#comments {
clear:both;
}

/* Footer */
div#footer {
background:url(images/dots-footer.png) no-repeat 5px;
width:100%;
clear:both;
text-align:center;
font-size:12px;
color:#f6891f;
margin-bottom:15px;
}

div#footer a {
color:#f6891f;
text-decoration:none;
}

div#footer a:hover {
color:#81a1a7;
text-decoration:underline;
}

span.footer-copy {
background-color:#ffffff;
}

/* These rather presentational classes are generated by WordPress, so it's useful to have some styles for them. Edit as you see fit. More info: http://codex.wordpress.org/CSS */
.aligncenter { display:block; margin:0 auto }
.alignleft { float:left }
.alignright { float:right }
.wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px }

/* You might find the following useful */
br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
div { position:relative } /* This will save you having to declare each div's position as 'relative' and allows you to absolutely position elements inside them */
li#theme-switcher { background:#fff; border:10px solid red; padding:20px; position:fixed; top:0; right:0 } /* Use this if you have the Theme Switcher Reloaded plugin (http://themebot.com/webmaster-tools/1-wordpress-theme-switcher-reloaded) installed and want to make it nice and obvious */
.clear-left {
height:1px;
clear:left;
}

.clear-right {
height:1px;
clear:right;
}

.clear-both {
height:1px;
clear:both;
}