/*   
Theme Name: Purple Frog
Theme URI: 
Description: Bronwyn's custom portfolio theme, spring 2010
Author: Bronwyn Boltwood
Author URI: http://bronwynboltwood.com/
Template: thematic
Version: 1.0
Tags: Thematic
.
Thematic is © Ian Stewart http://themeshaper.com/
.
*/

/* Reset browser defaults */
@import url('../thematic/library/styles/reset.css');
/* Apply basic typography styles, then get fancy fonts */
@import url('../thematic/library/styles/typography.css');
@import url('fonts/fancyfonts-bronwyn.css');
/* Prepare theme for plugins */
@import url('../thematic/library/styles/plugins.css');


/* =FONTS
-------------------------------------------------------------- */
/* =Images
------------------------------ */
.wp-caption-text, 
.gallery-caption {
    font-size: 0.75em;
	font-style: italic;
    line-height: 1.2em;
	text-align: center;
	}

/* =Global Elements
------------------------------ */
body { 
	line-height: 1.4em;
	}
body, 
input, 
textarea, 
input#s, 
#searchsubmit { 
	font-size: 100%;
	font-family: delicious, "lucida sans", lucida, corbel, calibri, segoe, "lucida sans unicode", "lucida grande", helvetica, "helvetica neue", univers, arial, sans-serif;
	}
#branding, 
h1, h2, h3, h4, h5, h6 {
	font-family: juergenitalic, "hoefler text", baskerville, garamond, palatino, "palatino linotype", georgia, serif;
	font-weight: normal;
	line-height: 120%;	
	}
pre, code {
	font:80% Menlo, Consolas, "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Lucida Console", "Nimbus Mono L", Monaco, Courier, "Courier New", monospace;
	line-height:1.2em;
	}
blockquote {
	font-style:italic;
	font-size: 85%;
	}
caption {
	text-align:left;
	}
table {
	font-size:90%;
	text-align:left;
	}
h3.showcase-header a, 
#footer a {
	text-decoration: none;
	}

/* =Header
------------------------------ */
#blog-title {
	font-size: 4em;
	line-height:100%;
	}
#blog-title a {
	text-decoration:none;
	font-weight: normal;
	}
#blog-title a:active,
#blog-title a:focus,
#blog-title a:hover {
	text-decoration: underline;
	}
#blog-description {
	font-style:italic;
	}
#access, 
#searchsubmit {
	font-size:0.85em;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	}
.skip-link a, 
.skip-link a:focus, 
skip-link a:active {
	font-weight: bold;
	}

/* =Menu
------------------------------ */
/* centering method from http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support */
#access .menu ul {
	text-align:center;
	}
#access .menu ul li a {
	font-weight: bold;
	text-decoration:none;
	line-height:1em;
	}
#access .menu ul li a.active,
#access .menu ul li a.active:hover {
	font-weight:bold;
	}

/* =Content
------------------------------ */
.entry-content a:link, 
.entry-content a:hover, 
.entry-content a:focus, 
.entry-content a:active {
        font-weight: bold;
        }
#content h1 a,  
#content h2 a,  
#content h3 a,  
#content h4 a,  
#content h5 a,  
#content h6 a {
	font-weight: normal;
	}
div#content .entry-title a:link, 
div#content .entry-title a:visited {
	text-decoration: none;
	} 
div#content .entry-title a:hover, 
div#content .entry-title a:focus, 
div#content .entry-title a:active {
	text-decoration: underline;
	} 
h1.entry-title,
h1.page-title {
	font-size:2.8em; 
	}
body.archive #content h1.page-title {
	font-family: delicious, "lucida sans", lucida, corbel, calibri, segoe, "lucida sans unicode", "lucida grande", helvetica, "helvetica neue", univers, arial, sans-serif;
	font-size: 85%;
	text-transform: uppercase;
	}
body.archive h1.page-title span {
	font-family: juergenitalic, "hoefler text", baskerville, garamond, palatino, "palatino linotype", georgia, serif;
	font-size: 3.3em;
	text-transform: none;
	}
div#content h2, 
h2.entry-title {
	font-size:2.2em; 
	}
div#content h3 {
	font-size:1.8em; 
	}
div#content h4 {
	font-size:1.5em; 
	}
div#content h5 {
	font-size:1.25em; 
	}
.entry-meta {
	text-transform: lowercase;
	}
.entry-meta a {
    font-weight: normal !important;
	}
.entry-meta p {
	font-size: 0.9em;
	font-style: italic;
	}
.entry-meta span.label {
	font-weight: bold;
	font-style: normal;
	}
.entry-meta abbr {
	font-style:normal;
	cursor:text;
	}

/* =Content -- Showcases
------------------------------ */
.excerpt-tile {
	line-height: 110%;
	}
#content .excerpt-tile h4, 
.related-tile h4 {
	font-family: delicious, "lucida sans", lucida, corbel, calibri, segoe, "lucida sans unicode", "lucida grande", helvetica, "helvetica neue", univers, arial, sans-serif;
	font-size: 92%;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	}
.related-tile h4 {
	font-size: 100% !important;
	}
#content div.excerpt-tile h4 a, 
.related-tile h4 a {
	font-weight: bold;
	}
.excerpt-tile .published {
	font-weight: bold;
	font-size: 75%;
	text-transform: lowercase;
	text-align: right;
	}
.excerpt-tile .excerpt, 
.related-tile .excerpt {
	font-size: 85%;
	}

/* =Content -- Front Page
------------------------------ */
body.home h3.showcase-header, 
body.home #content .excerpt-tile h4 {
	font-family: delicious, "lucida sans", lucida, corbel, calibri, segoe, "lucida sans unicode", "lucida grande", helvetica, "helvetica neue", univers, arial, sans-serif;
	}
body.home #content h3.showcase-header {
	font-size: 120%;
	font-style: italic;
	}

/* =Content -- Resume
------------------------------ */
body.pageid-657 #content {
	font-size: 90%;
	line-height: 120%;
	} 
body.pageid-657 #content h1.entry-title {
	font-size: 3em;	
	}
body.pageid-657 #content h3, 
body.pageid-657 #content h4 {
	font-family: delicious, "lucida sans", lucida, corbel, calibri, segoe, "lucida sans unicode", "lucida grande", helvetica, "helvetica neue", univers, arial, sans-serif;
	}
body.pageid-657 #content h3 {
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-weight: bold;
	font-size: 100%;
	}
body.pageid-657 #content h4 {
	font-size: 100%;
	font-style: italic;
	letter-spacing: 0.035em;
	}

/* =Navigation
------------------------------ */
.navigation {
	font-size:90%;
	}
.navigation a {
	font-style:italic;
	text-decoration:none;
	}
.navigation .meta-nav {
	font-style:normal;
	}
.nav-next {
	text-align:right;
	}

/* =Footer
------------------------------ */
#footer {
    font-size:0.9em;
	line-height:1.2em;
	}
#siteinfo {
	text-align: center;
	}
.aside h3 {
	font-size:1.5em;
	}


/* =COLOURS
-------------------------------------------------------------- */
/* =Images
------------------------------ */
img.mascot {
	border: 15px solid #000; /* px because IE messes up ems */
	}
div.wp-caption img {
	border: 0 none;
	}
.wp-caption-text, 
.gallery-caption {
	color: #444;
	}

/* =Global Elements
------------------------------ */
body { 
    background: #DBD0D8;   
	}
a:link, 
h3.showcase-header a:link, 
h3.showcase-header a:visited, 
#footer a:link, 
#footer a:visited {
	color:#681E4D;
	}
a:visited {
	color:#BD6707;
	}
a:active,
a:focus, 
a:hover {
        color: #8F1964;
        background: #F5E5C0;
	}
/* navigation links common features */
h3.showcase-header a:link, 
h3.showcase-header a:visited, 
#footer a:link, 
#footer a:visited {
	color:#681E4D;
	}
h3.showcase-header a:active, 
h3.showcase-header a:focus, 
h3.showcase-header a:hover,
#footer a:active,
#footer a:focus, 
#footer a:hover {
    color: #EB0085;
	}

blockquote {
	color:#666;
	}
table {
	border:1px solid #ccc;
	}
tr {
	border-bottom:1px solid #ccc;
	}
hr {
	background-color:#ccc;
	border:0;
	color:#ccc;
	}

/* =Header
------------------------------ */
#header {
    background: #310023;
	}
#header a {
	color: #DBD0D8;
	}
#blog-title a:active,
#blog-title a:focus,
#blog-title a:hover {
	color: #fff;
	background: none;
	}
#blog-description {
	color:#666;
	}
#access {
    background: #681E4D;
	}
#searchsubmit, input#s {
    color: #DBD0D8;
	background: #411333;
	border: 1px solid #532746;
	}
.skip-link a, 
.skip-link a:focus, 
skip-link a:active {
	background: #333;
	color: #fff;
	border: 2px solid #ccc;
	}

/* =Menu
------------------------------ */
/* centering method from http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support */
#access .menu ul li a {
	color:#DBD0D8;
	}
#access .menu ul li a:hover, 
#access .menu ul li a:focus {
	background:#310023;
	color:#fff;
	}
#access .menu ul li a.active,
#access .menu ul li a.active:hover {
	color:#fff;
	background:#160211;
	}

/* =Content
------------------------------ */
#main {
	background: url("images/lotusfrog_300w_purple50pc_smush.jpg") no-repeat left bottom;
	}
#container {
	border-left: 2em solid #310023;
	border-right: 2em solid #310023;
	border-bottom: 3px solid #310023;
	background: #fff;
	}
#content {
    color: #222;
	background: url("images/lotusfrog_600w_purple8pc_smush.jpg") #fff no-repeat top right;
	}
div#content .entry-title a:link, 
div#content .entry-title a:visited {
	color: #222;
	background: none;
	} 
div#content .entry-title a:hover, 
div#content .entry-title a:focus, 
div#content .entry-title a:active {
	color: #681E4D;
	background: none;
	} 
#content hr.post-divider {
	border-top: 1px solid #986589;
	}
.entry-meta abbr {
	border:none;
	}
.home #content .sticky {
	border:1px solid #ccc;
	}

/* =Content -- Showcases
------------------------------ */
h3.showcase-header {
	border-bottom: 1px solid #986589;
	}
h3.showcase-header a {
	background: none;
	}
.excerpt-tile .published {
	color: #000;
	}

/* =Content -- Front Page
------------------------------ */
body.home #main {background-image: none;} /* remove broken background */
body.home #content div.doublepage h2 {
	background: url("images/lotusfrog_150w_homepage_headers_smush.jpg") #CDB1C4 no-repeat right center;
	border: 1px solid #986589;
	border-top: 0.4em solid #986589;
	}
body.home #content h3.showcase-header {
	border: none;
	}
body.home {
	background-color: #fff;
	}
body.home #container {
	border: none;
	}
body.home #last {
	background: url("images/lotusfrog_400w_purple25pc_smush.jpg") no-repeat left bottom;
	}
/* double column layout from http://matthewjamestaylor.com/blog/perfect-2-column-double-page.htm */
body.home #content {
	background-color: transparent;
	}
/* .doublepage {} right column background colour */
/* .colleft {}	left column background colour */

/* =Navigation
------------------------------ */
.navigation, 
.navigation a {
	color:#555;
	}
.navigation a:active,
.navigation a:focus,
.navigation a:hover {
    color: #8F1964;
    background: #F5E5C0;
	}

/* =Footer
------------------------------ */
#footer {
	background: #F8F2F5;
    border: 3px solid #681E4D;
    border-top: 2em solid #681E4D;
	}
#footer a:active,
#footer a:focus, 
#footer a:hover 
	{
    background: #fff;
	}
#siteinfo {
	border-top: 1px solid #986589;
	}


/* =LAYOUT
-------------------------------------------------------------- */
/* =Images
------------------------------ */
img.mascot {
	margin: 0 2em 1em -35%;
	display: block;
	float: left;
	}
.selfclear { 
	overflow:auto;
	}
.alignleft {
	margin: 0 1em 1em 0;
	float: left;
	clear: left;
	}
.aligncenter {
	margin: 1em auto;
	display: block;
	}
.alignright {
	margin: 0 0 1em 1em;
	float: right;
	clear: right;
	}
.aligngroup {
	margin: 1em 0.5em;
	display: inline-block;
	}
.aligngroup img {
	display: inline-block;
	}
div.wp-caption img {
	margin: 0 auto;
	display: block; 
	}
div.wp-caption p.wp-caption-text {
	margin: 1em auto 0.5em auto;
	}
.gallery img {
	margin:0;
	}
.wp-smiley { /* Prevent the smileys from breaking line-height */
	margin:0 !important;
	max-height:12px;
	}

/* =Global Elements
------------------------------ */
body { 
	min-width: 700px;
	}
p, ul, ol, dd, pre {
	margin-bottom:1em;
	}
blockquote {
	padding: 1em;
	}
table {
	margin:0 0 22px 0;
	}
th, td {
	padding: .5em 1em;
	}
hr {
	margin-bottom:22px;
	height:1px;
	}

/* =Header
------------------------------ */
#header {
	z-index:2;
	}
#blog-title {
	padding:0.35em; 
	}
#access, 
#searchsubmit {
	overflow:visible;
	z-index:100;
	}
#access {
	height:2em;
	}
#access-search {
	position: absolute;
	top: 1em;
	right: 1em;
	}
#searchsubmit, input#s {
	padding: 0.25em 0.5em;
	}
#searchsubmit {
	padding: 0.3em 0.5em;
	}
.skip-link {
	position: absolute;
	left: -9000px;
	top: -9000px;
	z-index: 9;
	}
.skip-link a, 
.skip-link a:focus, 
skip-link a:active {
	/* position: absolute;   breaks nav links */
	padding: 5px;
	width: 10em;
	z-index: 9;
	}

/* =Menu
------------------------------ */
/* centering method from http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support */
#access .menu, 
#access .menu ul, 
#access .menu ul li {
	position:relative;
	}
#access .menu {
	float:left;
	width:100%;
	}
#access .menu ul, 
#access .menu ul li {
	margin:0;
	padding:0;
	list-style:none;
	}
#access .menu ul {
	right:50%;
	clear:left;
	float:right;
	}
#access .menu ul li {
	left:50%;
	display:block;
	float:left;
	}
#access .menu ul li a {
	padding:0.5em 1.5em;
	display:block;
	}

/* =Content
------------------------------ */
#main {
	padding-bottom: 4em;
	}
#container {
	margin: 0 5% 0 20%;
	min-width: 30em;
	max-width: 42em;
	}
#content {
	padding: 1.5em;
	}
body.archive h1.page-title span {
	margin: 0.5em 0 0.75em 0;
	display: block;
	}
div#content h2, 
h2.entry-title, 
div#content h3, 
div#content h4 {
	margin-top:0.75em;
	}
#content h5 {
	margin-top: 0.5em;
	}
div#content .page h1.entry-title {
	margin-bottom:0.4em;
	}
#content hr.post-divider {
	margin: 2em auto;
	width: 75%;
	height: 0px;
	clear: both;
	}
.entry-meta {
	padding: 0.5em 0.75em 0.5em 0;
	}
.entry-meta p {
	margin: 0;
	padding-left: 4em;
	}
.entry-meta span.label {
	margin-left: -4em;
	display:block;
	width: 4em;
	float:left;
	}
.home #content .sticky {
	margin:0 0 2em 0;
	padding:1.25em;
	}
ul#links-page,
ul#archives-page {
	margin-left:0;
	list-style:none;
	overflow:hidden;
	}
li.content-column {
	margin-right:1.5em;
	float:left;
	width:45%;
	}
.gallery {
	padding:0 0 1.5em 0;
	}
#author-info {
	margin:0 0 2em 0;
	overflow:hidden;
	}
#author-info .avatar {
	margin:.3em 1em 0 0;
	float:left;
	}

/* =Content -- Showcases
------------------------------ */
h3.showcase-header {
	margin: 0.75em 0;
	}
h3.showcase-header a {
	margin-bottom: -0.28em;
	display: block;
	}
.excerpt-tile {
	margin: 0 0 1.5em 0;
	height: 90px;
	max-height: 5.25em;
	overflow:hidden; /* self-clear trick from http://dtott.com/thoughts/2009/01/06/clear-your-floats-even-easier/ */
	}
.excerpt-tile a.postthumb {
	margin-right: 15px;
	float: left;
	display: block;
	}
#content .excerpt-tile h4 {
	padding: 0;
	margin: -0.22em 0 0 90px; /* margin beside floated thumbnail must be in px to work in Safari */
	clear: none;
	}
.excerpt-tile .excerpt {
	margin-top: 0.25em;
	}

/* =Content -- Related Items
------------------------------ */
.related-tile {
	clear: both;
	margin: 0.75em 0;
	overflow:hidden; /* self-clear trick from http://dtott.com/thoughts/2009/01/06/clear-your-floats-even-easier/ */
}
.related-tile a.tt-flickr {
	margin-right: 15px;
	float: left;
	display: block;
	}
.related-tile h4 {
	padding: 0;
	margin: 0;
	clear: none;
	}

/* =Content -- Front Page
------------------------------ */
body.home #content div.doublepage h2 {
	margin-bottom: 0.75em;
	padding: 0.4em;
	padding-bottom: 0;
	}
body.home #wrapper,
body.home #container,
body.home #content {
	padding: 0;
	}
body.home #container {
	margin: 0;
	width: 100%;
	min-width: 960px;
	max-width: 100%;
	}
body.home #about {
	padding: 0 4%;
	}

/* double column layout from http://matthewjamestaylor.com/blog/perfect-2-column-double-page.htm */
body.home #content {
	float: left;
	padding: 0;
	}
/* column container */
.colmask {
	clear:both;
	float:left;
	width:100%;			/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
	}
/* common column settings */
.colleft {
	float:left;
	width:100%; 
	position:relative;
	}
.col1,
.col2 {
	float:left;
	position:relative;
	padding:0 0 1em 0;
	overflow:hidden;
	}
.colleft {
	right:50%;			/* right column width */
	}
/* column width - 2x desired padding */	
.doublepage.col1, 
.doublepage.col2 {
	width:42%;
	}
.doublepage.col1 {
/* 50+4 = 54  right column width plus left column left padding */
	left:54%;			
	}
.doublepage.col2 {
/* 50+4+4+4 = 62  (right column width) plus (left column left and right padding) plus (right column left padding) */
	left:62%;			
	}

/* =Content -- Resume
------------------------------ */
body.pageid-657 #content h1.entry-title {
	margin-bottom: 0;	
	}
body.pageid-657 #content h2 {
	margin: 1em 0 0em 0;
	}
body.pageid-657 #content h2#first {
	margin: 0.25em 0;	
	}
body.pageid-657 #content h4 {
	margin:0;
	}
body.pageid-657 #content ul, 
body.pageid-657 #content ol {
	margin: 0.25em 0 1em 0;
	padding: 0;
	}
body.pageid-657 #content li {
	margin: 0 0 0 1em;
	padding: 0 0 0 0.75em;
	}

/* =Attachments
------------------------------ */
.attachment-jpeg #container,
.attachment-png #container {
	width:100%;
	}
.attachment-jpeg #content,
.attachment-png #content {
	width:930px;
	}
.attachment-jpeg #comments,
.attachment-png #comments {
	width:540px;
	overflow:hidden;
	}
.attachment-jpeg .main-aside,
.attachment-png .main-aside {
	display:none;    
	}

/* =Navigation
------------------------------ */
.navigation {
	margin:0 0 1.5em 0;
	overflow:hidden;
	}
.nav-previous {
	float: left;
	width:50%;
	}
.nav-next {
	float: right;
	width:50%;
	}
#nav-above,#nav-below {
	width: 100%;
	}
#nav-above {
	display:none;
	}
.paged #nav-above {
	display:block;
	}
#nav-below {
	padding-top:1.5em !important;
	clear: both;
	}

/* =Footer
------------------------------ */
#footer {
	padding:1.25em;
	margin:0 3em 1.5em 3em;
	clear: both;
	}
#footer #subsidiary div {
	padding-bottom: 1em;
	float: left;
	}
#footer #subsidiary #first {
	width: 37%;
	}
#footer #subsidiary #second {
	width: 40%;
	}
#footer #subsidiary #third {
	width: 23%;
	}
#siteinfo {
	padding-top: 1.25em;
	clear: both;
	}
.aside p,
.aside ul,
.aside ol,
.aside dd,
.aside pre {
	margin-bottom:1em;
	}
.aside h3 {
	margin-bottom:0.25em;
	}
.aside ul {
	margin-left:0;
	list-style:none;
	}