/*  
Theme Name: Beveled
Theme URI: http://www.woothemes.com/
Version: 1.0.12
Description: Designed by <a href="http://www.jepson.no">Magnus Jepson</a>.
Author: WooThemes
Author URI: http://www.woothemes.com
Tags: woothemes

	Copyright: (c) 2009-2011 WooThemes.
	License: GNU General Public License v2.0
	License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/

/* 

WARNING! DO NOT EDIT THIS FILE!

To make it easy to update your theme, you should not edit the styles in this file. Instead use 
the custom.css file to add your styles. You can copy a style from this file and paste it in 
custom.css and it will override the style in this file. You have been warned! :)

*/
/*-------------------------------------------------------------------------------------------

INDEX:

0. RESET

1. SETUP
-1.1 Defaults
-1.2 Hyperlinks

2. SITE STRUCTURE & APPEARANCE
-2.1 Containers & Columns
-2.2 Navigation
  -2.2.1 Drop-down menus
  -2.2.2 Top Navigation (optional)
-2.3 Header
-2.4 Content
  -2.4.1 Featured
  -2.4.2 Portfolio Item
  -2.4.3 Single Portfolio
  -2.4.4 Portfolio Gallery
-2.5 Sidebar
-2.6 Footer
-2.7 Breadcrumbs

3. POSTS
-3.1 Images
-3.2 Typographic Elements
-3.3 Pagination / WP-Pagenavi / Woo-Pagination
-3.4 Single Post Author
-3.5 Entry Tables
-3.6 Subscribe & Connect

4. WIDGETS
-4.1 Generic Widgets
-4.2 Specific Widgets

5. COMMENTS
-5.1 Comments
-5.2 Comments Form
-5.3 Pingbacks / Trackbacks

6. PAGE TEMPLATES
-6.1 Timeline Page Template
-6.2 Contact Form
-6.3 Image gallery

7. MISC
-7.1 Buttons
-7.2 Gravity forms
-7.3 IE specific styling 

-------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------*/
/* RESET - http://meyerweb.com/eric/tools/css/reset/ | v2.0 | 20110126 */
/*-------------------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; } 
/* Bicubic resizing for non-native sized IMG: code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }
/* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */
textarea { overflow: auto; }
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }
/* Make buttons play nice in IE: www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button {  width: auto; overflow: visible; }
/* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; background: @bg_light; border: 1px solid @border_main; font-size: 12px; padding: 10px; margin-bottom: 20px; } 
/* Normalize monospace sizing: en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, @serif; }
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }
/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* Floating & Alignment  */
.fl{float:left;}
.fr{float:right;}
.ac{text-align:center;}
.ar{text-align:right;}

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements.
   j.mp/bestclearfix */
.fix:before, .fix:after, .col-full:before, .col-full:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.fix:after, .col-full:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.fix, .col-full { zoom: 1; }

/*-------------------------------------------------------------------------------------------*/
/* IMPORTS */
/*-------------------------------------------------------------------------------------------*/

@import url(css/mixins.less);

/*-------------------------------------------------------------------------------------------*/
/* 1. SETUP */
/*-------------------------------------------------------------------------------------------*/

/* 1.1 Defaults */
body  { 
	font-size: 12px;
	line-height: 1.5;
	color: @color_body;
	background: url(images/bg-body.jpg) repeat;

	font-family: @sans_google;
	.text_shadow(0, 1px, 0);
	-webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6  {
	margin: 0; font-family: @serif; color: darken(@color_body, 10%); font-weight:normal;
	a {
		text-decoration: none;
		&:hover { text-decoration: underline; }
	}
}

h1  {font-size: 2em } h2  {font-size: 1.8em;} h3  {font-size: 1.6em;} h4  {font-size: 1.2em;} h5  {font-size: 1em;} h6  {font-size: 0.8em;}
p { margin: 0; }
img  { vertical-align: bottom; }
hr { background-color: @border_main; border:0; height: 1px; margin-bottom: 20px; }
input, textarea { padding: 5px; border-color: darken(@border_main, 8%) @border_main @border_main darken(@border_main, 8%); border-width:1px; border-style:solid; .border_radius(3px); color: @color_body; }

/* 1.2 Hyperlinks */

a { 
	color: @color_links; 
	text-decoration:none;
	outline:none;
	
	&:hover {
		color: @color_links - #222;
		text-decoration: underline;
	}
}



/*-------------------------------------------------------------------------------------------*/
/* 2. SITE STRUCTURE & APPEARANCE */
/*-------------------------------------------------------------------------------------------*/

/* 2.1 Containers & Columns */

#header-wrap, 
#content-wrap, 
#footer-wrap { margin: 0 -20px; padding:0 20px; }

#content-wrap { 
	padding-top: 3em; 
	border-bottom: 1px solid darken(@border_main, 10%);
	border-top: 1px solid #fff;
}
#footer-wrap { 
	background: url(images/bg-footer.png) repeat; 
	border-bottom: 1px solid darken(@border_main, 10%);
	border-top: 1px solid @color_shadow;	
}

/* 2.2 Navigation */
#navigation{ 
	margin-top: 1em;
	font: bold 1.1em/1 @sans; 
}

.rss {
	float:right;
	background:url(images/ico-rss.png) no-repeat right 44%;
	margin:21px 0 0 10px; 
	line-height: 1;
	display: inline-block; 
	position: relative;
	height:20px;
	width:21px;
	.opacity;
	&:hover { .opacity(1); }
}

.nav {
	z-index:99; 
	margin:0; 
	padding:0; 
	list-style:none; 
	line-height:1;
	a {
		position:relative; 
		color: lighten(@color_body, 20%); 
		display:block; 
		z-index:100; 
		padding:9px 15px; 
		line-height: 1.2; 
		text-decoration:none; 
		text-shadow:0 1px 0 @color_shadow;
		border-color: transparent darken(@border_main, 5%) transparent #fff;		
		&:hover { color: darken(@color_body, 15%); }
	}
	li {
		float: left;
		width:auto;
		a.sf-with-ul { padding-right:22px; }
		&.current_page_item, &.current_page_parent, &.current-menu-ancestor, &.current-cat, &.li.current-menu-item, &.sfHover {
			a { color: darken(@color_body, 15%); }
		}
	}
}

/* Optional Styling */
#navigation { 
	border:1px solid darken(@border_main, 5%); 
	.border_radius(4px);
	.vertical_gradient(#ffffff,#f5f5f5);
	.box_shadow(0,2px,2px,0,rgba(0,0,0,0.03));
	.nav {
		.sf-sub-indicator { background:	url(images/arrow-superfish.png) no-repeat; position:absolute; display:block; right:0.6em; top:40%; width:10px; height:10px; text-indent:-999em; overflow:hidden; }
	}
}

/* 2.2.1 Drop-down menus */

.nav li ul  { position: absolute; left: -999em;  }
	
.nav li:hover,.nav li.hover  { position:static; }
.nav li:hover ul ul, .nav li.sfhover ul ul,
.nav li:hover ul ul ul, .nav li.sfhover ul ul ul,
.nav li:hover ul ul ul ul, .nav li.sfhover ul ul ul ul { left:-999em; }
.nav li:hover ul, .nav li.sfhover ul,
.nav li li:hover ul, .nav li li.sfhover ul,
.nav li li li:hover ul, .nav li li li.sfhover ul,
.nav li li li li:hover ul, .nav li li li li.sfhover ul  { left:auto; }

#navigation .nav li ul { background: @bg_light; border-color: darken(@border_main, 5%) }
#navigation .nav li ul li a { color: lighten(@color_body, 20%); }
#navigation .nav li ul li a:hover { color: darken(@color_body, 20%); }
		
@media only screen and (max-width: 767px)  {
	/* iPhone landscape & down */
	#navigation  {
		clear:both;
		.nav  {
			float: none;
			li  {
				float: none;
				a  {
					border: none!important;
				}
				ul  {
					position: relative;
					li  { padding-left: 10px; }
					a {
						color: lighten(@color_body, 20%);
						&:hover { text-decoration:underline; }
					}
				}
			}
		}
		ul  { width:100%; }
	}
	.rss  { background: url(images/ico-rss.png) no-repeat; display:block; float: right; padding: 0 0 0 10px; width: 20px; height:21px; }
}
	
/* 2.2.2 Top Navigation (optional) */
#top {
	select { margin: 20px 0 0; width:100%; }
	#top-nav { display: none; }	
}
	
/* 2.3 Header */
#header-wrap { 
	background: url(images/bg-top.png) repeat; 
	border-bottom: 1px solid darken(@border_main, 10%);
	border-top: 3px solid @border_top;
	.inset_box_shadow(0px, -10px, 20px, 5px, rgba(0,0,0,.03));
}
	
#header {
	padding:3em 0 2em;
	clear: both;
	position: relative;
	#logo, hgroup { float: left; margin:5px 0 1.5em; }
	.site-title, .site-description {
	    font-family: @serif_heading;
	    display: none;
	    a {
	    	color: darken(@color_body, 20%);
	    	text-transform: none;
	    	font-weight: normal;
	    	text-decoration: none;
	    	&:hover { text-decoration: underline; }
	    }
	}
	.site-description { color: lighten(@color_body, 10%); font-family: @serif_heading; font-style: italic; }
}

/* 2.4 Content */
#content { 
	padding:0 0 2em; 
	
	#intro { 
		margin:0 0 3em;
		text-align:center;
		padding: 0 0 3em; 
		border-bottom: 1px solid @border_main;
		.box_shadow(0,1px,0,0,@color_shadow);
		h1 { font-family: @serif_heading; font-size: 2.5em; line-height:1.2em; padding:0.5em 0; }
		p { font: normal 1.5em/1.2em @serif; color: lighten(@color_body, 10%); }
	}
	
	/* 2.4.1 Featured */
	.slider-container {
		position:relative;
		margin:0 0 3em;
		padding: 0 0 3em;
		border-bottom: 1px solid @border_main;
		.box_shadow(0,1px,0,0,#fff);
	
		#featured {
			position: relative; 
			li {
				display:none;
				position:relative;				
			}
		}
		
		.flex-direction-nav {
			.prev, .next {
				display: block;
				height: 0;
				opacity: 0.8;
				overflow: hidden;
				padding-top: 22px;
				position: absolute;
				width: 14px;
				.opacity;
				.transition(0.1s, ease-out);
				&:hover { .opacity(1); .transition(0.1s, ease-in); }
			}
			.prev { background: url("images/ico-featured-prev.png") no-repeat; bottom:10px; left: 10px;}
			.next { background: url("images/ico-featured-next.png") no-repeat; bottom:10px; right: 10px;}
		}

		.flex-control-nav {
			bottom: 0;
			display: block;
			margin: 0 auto 10px;
			padding: 0;
			position: absolute;
			text-align: center;
			width: 100%;
			z-index: 9999;
			li {
				display: inline;
				list-style: none outside none;
				margin: 0 5px;
				a {
					background: none repeat scroll 0 0 #919191;
					border-radius: 10px 10px 10px 10px;
					cursor: pointer;
					display: inline-block;
					height: 0;
					overflow: hidden;
					padding-top: 8px;
					width: 8px;
					&:hover, &.active {
					  	background: #222222;
					}			
				}			
			}
		}		

	}	

	/* 2.4.2 Portfolio Item */
	.portfolio-item {
		position:relative;
		display: inline-block;
		margin: 1em 0 1em;
		a {
			&.item { 
				position:relative;
				padding:4px; 
				border:1px solid darken(@bg_light,10%); 
				display: inline-block;
				background:@bg_light;
				.border_radius(3px); 
				&:hover { .opacity(1); border: 1px solid darken(@bg_light,20%);  }
				img { max-width: 100%; margin:0; padding:0; border:none; background:none; .box_shadow(0,0,0,0); .border_radius(0); }
				.plus {
					background: url(images/ico-plus.png) no-repeat;
					width:27px;
					height:26px;
					display:block;
					position:absolute;
					right:-6px;
					top:-6px;
					.opacity(0);
				}
				&:hover .plus { .opacity(1); .transition(100ms, ease-in);  }
				.mask {
					width: 97%;
					height: 95%;
					position:absolute;
					top:4px;
					left:4px;
					background: #fff;
					background: rgba(255,255,255,.8); 
					.opacity(0);
					.content { 
						font-family: @sans_google;
						padding:10px 15px; 
						 position:absolute; top:0; left: 0; 
						h2 {  font-size:1.4em; font-weight:bold;text-decoration:none; }
						p.date { font-size:1em; color: lighten(@color_body, 20%); font-family: @serif; font-style:italic; }
					}
				}
				&:hover .mask { display: block; .opacity(1); .transition(50ms, ease-in); }				
				&:hover { text-decoration:none; }
			}
		}
		.post-bot {
			background-image: url(images/bg-featured-portfolio.png);
			background-repeat: no-repeat;
			height:9px;
			display: block;
		}
	}
	
	/* 2.4.3 Single Portfolio */
	&.single-portfolio {
		margin-bottom:2em; 
		.single-portfolio-image {
			margin:0 0 1em !important; 
			display:inline;
			img { max-width:100%; }
		}
		.portfolio {
			float:none;
			width:auto;
		}
	
	}
	
	/* 2.4.4 Portfolio Gallery */
	#portfolio-gallery {
		.page {
			background:none;
			padding:0;
			margin:0;
			border:none;
			position:relative;
		}
		.portfolio-items {
			margin-bottom:2em;
		}
		.port-tags {
			font-weight:bold;
			margin:0 0 2em;
			a {
				font-weight: normal;
				.vertical_gradient( lighten(@button,5%), darken(@button,5%);			
				font-size:0.9em;
				padding: 4px 8px;
				margin-left:5px;
				.text_shadow(0,1px,0,rgba(0,0,0,.5)); 
				.border_radius;
				.vertical_gradient( lighten(@button_grey,5%), darken(@button_grey,5%) );
				.inset_box_shadow(0,0px,0px,1px,rgba(255,255,255,.5);
				border: 1px solid darken(@border_main,40%);
				color: #fff;
				.opacity;
				font-family: @sans;
				&.current { .vertical_gradient( lighten(@button,5%), darken(@button,5%) ); }
			}
		}
	}
	
}



/* 2.5 Sidebar */
#sidebar{
	margin-top: 30px;
	overflow:hidden;
	.secondary {
		float: left;
		margin-right:20px;
		&.last { margin:0; }
	}
}

/* 2.6 Footer */
#footer{
	padding: 20px 0 30px;
	color: lighten(@color_body, 10%);
	font-family: @serif_heading;
	#credit {
		img { vertical-align: middle; margin: 0 0 0 5px; }
		span { display: none; }
	}
	p { font-size:1.1em; color: lighten(@color_body,20%); }
}

#footer-widgets { 
	padding:3em 0 0em; 
	border-bottom: 1px solid darken(@border_main, 10%); 
	.box_shadow(0,1px,0,0,@color_shadow);
}

/* 2.7 Breadcrumbs */
#breadcrumbs { 
	font-size:1.1em; margin-bottom: 2em; padding-bottom:1em; border-bottom:1px solid @border_main; .box_shadow(0,1px,0,0,@color_shadow); 
	.trail-before { font-weight:bold; }
}

/*-------------------------------------------------------------------------------------------*/
/* 3. POSTS */
/*-------------------------------------------------------------------------------------------*/
#breadcrumb, .post .video { margin-bottom:1.5em; }
.archive_header {
	display: block; 
	float: left; 
	width: 100%; 
	margin:0 0 30px; 
	padding:0 0 10px; 
	font-size: 1.2em; 
	font-weight: bold; 
	border-bottom:@border_main 1px solid;
	.box_shadow(0,1px,0,0,@color_shadow);	
	.catrss {
		a { font-size: 0.9em; text-decoration: none; line-height: 2.2; }
	}
}

.post, .type-page, .portfolio {
	background: @bg_light;
	border: 1px solid @border_main;
	padding: 1.5em 20px;
	margin:0 0 3em;

	header h1 {
		font-family: @serif_heading;
		line-height: 1.3;
		position:relative; 
		margin: 0.2em 0 0.8em;
		a:link, a:visited { color: darken(@color_body, 10%); }
	}

	.post-meta {
		margin:0 0 0.5em 0;
		li  { 
			display: inline-block;
			float:left;
			margin: 0 0.5em 0.5em 0;
			&.post-comments a, &.post-date a { 
				font-size:0.9em;
				padding: 4px 8px;
				.text_shadow(0,1px,0,rgba(0,0,0,.5)); 
				.border_radius;
				.vertical_gradient( lighten(@button_grey,5%), darken(@button_grey,5%) );
				.inset_box_shadow(0,0px,0px,1px,rgba(255,255,255,.5);
				border: 1px solid darken(@border_main,40%);
				color: #fff !important;
				.opacity;
				cursor: default;
				font-family: @sans;
			} 
			&.post-date { 
				a {
					span { 
						background: url(images/ico-btn-date.png) no-repeat left center; 
						padding-left:15px;
					}
					&:hover { text-decoration:none; }
				}
			}
			&.post-comments { 
				a { .vertical_gradient( lighten(@button,5%), darken(@button,5%) ); 
					span { 
						background: url(images/ico-btn-comments.png) no-repeat left center; 
						padding-left:15px;
						cursor:pointer;
					}
					&:hover { text-decoration:none; .opacity(1); }
				}
			}
		}
	}
	
	header .post-meta { 
		color: lighten(@color_body, 30%); font: italic 1em @serif; margin: -1em 0 1.5em;
		a { color: lighten(@color_body, 30%) }
	}

	.post-more { clear: both; margin:2em 0; }

	/* 3.1 Images */
	img, img.woo-image {
		margin-bottom:15px; max-width: 100%; padding:4px; border:1px solid darken(@bg_light,10%); background:@bg_light; .box_shadow(0,1px,2px,0,rgba(0,0,0,.2)); .border_radius(3px); 
		&:hover { border: 1px solid darken(@bg_light,20%); .box_shadow(0,1px,4px,0px,rgba(0,0,0,.2));}
	}
	img.wp-smiley { padding:0; border: 0; }
	.alignleft { float: left; margin:0 20px 10px 0; }
	.alignright { float: right; margin:0 0 10px 20px; }
	.aligncenter { display: block; text-align: center; margin-bottom:15px; margin:0 auto 15px; }
	.wp-caption {
		padding:1px;
		text-align: center;
		background: darken(@bg_light, 1%);
		border: 1px solid @border_main;
		.border_radius(4px);
		img { margin:0; padding:4px 0; background: none; border: 0; .border_radius(0); .box_shadow(0,0,0,0); }
	}
	.wp-caption-text { margin:0; padding:0; font-size:0.9em; text-align: center; }
	
	&.format-audio .audio { margin-bottom: 1em; }
	
	&.format-link { 
		.title a { color: @color_links; }
	}

	.quote { 
		margin-bottom: 2em;
		blockquote {
			font-family: @serif;
			font-style:italic;
			font-size: 1.4em;
			color: lighten( @color_body, 30% );
			background: none;
			padding: 5px;
			&:before { content: '" '; font-size:1.4em; line-height:1; }
		}
		cite {
			color: lighten( @color_body, 30% );
		    display: block;
		    text-align: left;
		    margin-left:20px;
			&:before { content: "~ "; }
		}
	}
}

.post, .portfolio {
	p.tags { 
		background:url(images/ico-tag.png) no-repeat center left; 
		padding-left:25px; 
		width:100%; 
		clear:both; 
		margin:1.5em 0 0; 
		font-family: @sans_google; 
		
		text-transform: uppercase; 
		a:link, a:visited { 
			text-decoration: none; 
			color: lighten(@color_body, 10%);
			&:hover { color: ligthen(@color_body, 30%); text-decoration: underline; }
		}
	}

	.post-bot { background: url(images/bg-post.png) no-repeat center; height:15px; margin: 0 -20px -33px; }
	
	.post-icon {		
		a { 
			background: url(images/ico-post-icons.png) no-repeat !important; 
			left: -55px !important;
			top: 20px !important;
			padding-top: 37px !important;
			width: 38px !important;
		}
		&.quote a { background-position: 0 0 !important; }
		&.link a { background-position: 0 -37px !important; }
		&.article a { background-position: 0 -74px !important; }
		&.image a { background-position: 0 -111px !important; }
		&.video a { background-position: 0 -148px !important; }
		&.audio a { background-position: 0 -185px !important; }
	}
	
}

.layout-right-content .post .post-icon a { right: -55px !important; left: auto !important; }


/* 3.2 Typographic Elements */
.entry {
	font-size: 1.1em;
	line-height: 1.5;
	font-family: @sans_google;
	margin: 0 0 1.5em;
	h1, h2, h3, h4, h5, h6 { font-family: @serif_heading; margin: 0 0 .5em; line-height: 1.5; }
	p { margin-bottom:1.2em; }
	blockquote {
		background:url(images/blockquote.png) no-repeat 0 12px; 
		padding: 10px 20px 10px 50px; 
		color: darken(@color_body, 15%);
		p { font-style: italic; }
	}
	ul, ol {
		margin-bottom:1.5em;
		padding:0 0 0 30px;
		li { list-style-type: disc; }
		ul {
			margin:0;
			li  { list-style-type: circle; }
		}
	}
	ol {	
		li { list-style-type: decimal; }
		ol {
			margin:0;
			li { list-style-type: lower-latin; }
		}
	}
}

/* 3.3 Pagination / WP-Pagenavi / Woo-Pagination */
.nav-entries, .wp-pagenavi, .woo-pagination { padding:0 15px 2em; }
.nav-entries {
	margin:0 auto; width: 80px;
	a {
		display: block;
		color: @color_body;
		text-decoration: none;
		&:hover { text-decoration: underline; }
		.nav-prev { 
			background: url(images/ico-nav-left.png) no-repeat; height:34px; width:35px; .opacity(0.6); .transition(0.1s, ease-out);

			&:hover { .opacity(1); .transition(0.1s, ease-in); }
		}
		.nav-next { 
			background: url(images/ico-nav-right.png) no-repeat; height:34px; width:35px; .opacity(0.6); .transition(0.1s, ease-out);
			&:hover { .opacity(1); .transition(0.1s, ease-in);}
		}
	}
}
.woo-pagination {
	text-align: center;
	margin:0 10px;	
	.page-numbers {
		display: inline;
		text-decoration: none;
		color: lighten(@color_body, 20%);
		padding:4px 9px;
		font-weight: bold;
		border:1px solid darken(@border_main, 5%); 
		.border_radius(4px);
		.vertical_gradient(#ffffff,#f5f5f5);
		.box_shadow(0,2px,2px,0,rgba(0,0,0,0.03));
		font-family: @sans;		
		&:hover { border-color: darken(@border_main, 10%); color: @color_body; }
		&.current  { background: lighten(@color_body,10%); border-color: @color_body; color: #fff; .text_shadow(0px,1px,0px,darken(@color_body,30%)); }
	}
}

/* 3.4 Single Post Author */
#post-author { 
	background: @bg_light; 
	margin:0 0 1.5em; 
	padding:15px; 
	border:1px solid @border_main; 
	border-width:1px 0 1px; 
	clear:both;
	.title { margin-bottom:10px; }
	.profile-image { float: left; margin:0 15px 5px 0; padding:5px; border:1px solid @border_main; background: rgba(255,255,255,0.7); }
}

/* 3.5 Entry Tables */
.entry {
	table {
		width:100%;
		border:1px solid @border_main;
		margin-bottom:1.2em;		
		tr.alt-table-row { background: darken(@bg_light, 2%); }
		th { padding:6px 0 3px 0; background: #eee; border: 1px solid @border_main; text-shadow: 1px 1px #fff; .inset_box_shadow(0 0 1px 0 #fff); }
		td { padding:6px 0 3px 10px; border:1px solid @border_main; }
	}
}

/* 3.6 Connect */
#connect { 
	background: @bg_light; 
	margin:0 0 1.5em; 
	padding:15px; 
	border:1px solid @border_main; 
	border-width:1px 0 1px; 
	clear:both;
	h3 { margin-bottom:15px; }
	p { margin: 0 0 1em;}
	.newsletter-form {
		margin:0 0 1em;
		.email { width:140px; }
		.submit { cursor: pointer; .border_radius(3px); }
	}
	.social {
		a {
			.opacity(0.8);		
			&:hover { .opacity(1); }
		}
	}
	.related-posts {
		border-left:1px solid @border_main;
		padding-left:15px;
		ul { list-style: outside disc; margin:5px 0 5px 15px; }
	}
	.social  {
		a { display:inline-block; height:28px; width: 32px; background-image: url(images/ico-subscribe-social.png); background-repeat:no-repeat; }
		a.subscribe { background-position: 0px 0;  }
		a.twitter { background-position: -30px 0;  }
		a.facebook { background-position: -60px 0;  }
		a.youtube { background-position: -90px 0;  }
		a.flickr { background-position: -120px 0;  }
		a.linkedin { background-position: -150px 0;  }
		a.delicious { background-position: -180px 0;  }
		a.googleplus { background-position: -210px 0;  }
	}
}

.widget #connect {
	.fl, .fr { float: none; }
}

#main #connect {
	.col-left, .col-right { width:48%; }
}

/*-------------------------------------------------------------------------------------------*/
/* 4. WIDGETS */
/*-------------------------------------------------------------------------------------------*/

/* 4.1 Generic Widgets */
.widget  { 
	margin-bottom: 3em;
	font-family: @sans_google;
	h3 { font-family: @sans_google; font-size:1.4em; line-height:1.6em; letter-spacing:-1px; margin: 0 0 1em 0;padding:0; color:@color_body; text-transform: uppercase; }
	p { margin-bottom:1em; }
	ul {
		clear: both;
		padding-left:10px;
		list-style-position: inside;
		list-style-type: disc;
		list-style-image: url(images/ico-bullet.png);
		li {
			a {
				padding:0 0 0 5px; 
				line-height: 1.9;
				text-decoration: none;
				&:hover { text-decoration: underline; }
			}
		}
		ul { padding:0 0 0 15px; border-top:0; }
	}
}

/* 4.2 Specific Widgets */
/* SEARCH FORM */
.searchform  { 
	width: 99%;
	overflow:hidden; 
	position: relative; 
	border-color: darken(@border_main, 10%); 
	.inset_box_shadow(0,1px,2px,1px,rgba(0,0,0,.07);	
	border-width:1px; 
	border-style:solid; 
	background: @bg_light;
	input.s { background: url(images/ico-search.png) no-repeat 10px center; padding:8px 8px 8px 30px; width:60%; float:left; margin:0; border:0; color: @color_body; font-size:12px !important; }
	input.button { 
		float:right;
		margin: -1px -1px 0 0;
		height:32px;
		width:23%;
		.border_radius(0); 
		border: 1px solid @button - #111;
		border-bottom-color: @button - #222;
		padding: 7px;
		font-size:12px !important;
 }
}

/* FLICKR */
.widget.widget_woo_flickr {
	h3 {
		background: url(images/ico-widget-flickr.png) no-repeat left center; padding-left:40px; height: 29px;
		span {
			color:#0051d8;
			span { color:#ff1183; }
		}
	}
	.flickr_badge_image { float: left; margin:5px; }
	.wrap { position: relative; margin-bottom:20px; padding:0; }
	a {
		img { float: left; display: block; border: 1px solid @border_main; padding:3px; }
		&:hover {
			img { border-color: darken(@border_main, 10%); }
		}
	}
}

/* CALENDAR */
#wp-calendar{
	width:95%;
	margin-bottom:15px;
	clear:both;
	padding:0;	
	caption { padding:10px; }
	th, td { text-align: center; background: darken(@bg_light, 10%); padding:3px 0; }
	td { background: transparent; color: lighten(@color_body, 10%); }
}

/* SUBSCRIBE */
.widget.widget_woo_subscribe {
	h3 { background: url(images/ico-widget-subscribe.png) no-repeat left center; padding-left:40px; height: 29px;}
	#connect { background: none; padding:0; border:none;
		div { padding:15px; background: darken(@bg_light, 1%); .border_radius(3px); border: 1px solid @border_main; 
			.social { padding: 0; background: none; border:none; }
		}
	 }
}
#footer-widgets {
	.widget_woo_subscribe {
		#connect {
			div { padding:0px; background: none; border:none; 
			}
		}		
	}
}

/* BLOG AUTHOR */
.widget.widget_woo_blogauthorinfo {
	h3 { background: url(images/ico-widget-about.png) no-repeat left center; padding-left:40px; height: 29px;}
	.avatar { padding: 3px; border: 1px solid @border_main; }
	.left { float: left; margin:0 15px 5px 0; }
	.right { float: right; margin:0 5px 10px; }
}

/* TWITTER */
.widget.widget_woo_twitter {
	.back { padding:10px; background: darken(@bg_light, 1%); .border_radius(3px); border: 1px solid @border_main; }
	h3 { 
		border-bottom:0; padding:0; margin:0; padding-bottom:15px;	background: url(images/ico-widget-twitter.png) no-repeat left top; padding-left:40px; height: 29px;
		&.tlogo { background:none; padding-left: 0; height: auto; }
	}
	ul { 
		background: #fff;
		padding-left:0;
		border:1px solid @border_main;
		li {
			border-bottom:1px solid @border_main;
			padding:15px;
			list-style: none;
			&:last-child { border: none; }
			a { padding:0; }
			.time { color: lighten(@color_body, 30%); }
			.content { font-size: 1.2em; font-family: @serif;	}
		}
	}
	p {
		padding:10px 0 0 5px;
		font-weight: bold;
		color: lighten(@color_body, 10%);
		a { color: darken(@color_body, 20%); }
	}
}

/* WOOTABS */
#tabs {	
	height:auto; display: block;
	ul.wooTabs {
		padding:0;
		li {
			float: left;
			display: inline;
			color: #fff;
			margin:0;
			cursor: pointer;
			.vertical_gradient(#ffffff, #f5f5f5);
			a {
				color: lighten(@color_body, 10%);
				display: block;
				float: left;
				padding:5px 10px;
				text-transform:none;
				font-weight: bold;
				border:1px solid @border_main;
				border-left:0;
				font-family: @sans;
				&.selected { padding-bottom:6px; }
				&.selected, &:hover { background: #fff; text-decoration: none; border-width:1px 1px 0 0;}
			}
			&:first-child a { border-width:1px 1px 0 1px; border-left:1px solid @border_main; }
		}
	}
	.inside {
		background: #fff;
		border:1px solid @border_main;
		margin-top:-1px;
		ul, #tab-tags { margin:0; padding:0; display: none; }
		ul {
			list-style: none;
			&:first-child { display: inline; }
		}
		#tab-tags {
			border-width: 1px;
			padding:10px;
			a {
				padding:2px 4px;
				margin:3px 1px;
				display: inline-block;
				background: darken(@bg_light, 5%);
				.border_radius(3px);
				&:hover { background: darken(@bg_light, 10%); text-decoration: none; }
			}
		}
		li {
			border-bottom:1px solid @border_main;
			padding:15px;
			list-style: none;
			a { color: @color_body; font-weight: bold; padding:0; font-family: @serif; }
			span.meta { display: block; font-family: @serif; font-style: italic; text-transform: none; color: lighten(@color_body, 30%); }
			img.avatar, img.woo-image {
				border:1px solid @border_main;
				padding:2px;
				background: #fff;
				float: left;
				margin:0 10px 0 0;
				&:hover { border-color: darken(@border_main, 10%); }
			}
		}
	}	
}

/*-------------------------------------------------------------------------------------------*/
/* 5. COMMENTS */
/*-------------------------------------------------------------------------------------------*/

/* 5.1 Comments */
#comments {
	position:relative;
	margin:2em 0 0;
	padding:2em 0 0 0; 
	border-top:1px solid @border_main;
	h3 { font-weight: normal; margin-bottom:20px; }
	.comment { width:100%; list-style: none;
		&.thread-even { background: @bg_light; border-bottom:1px solid @border_main; }
		&.bypostauthor { background: #fef7d2; border-bottom:1px solid #efe3ae; }
		.comment-container { position: relative; padding:20px; }
		.comment-head {
			margin:0 0 15px 0;
			.name { margin:0; font-weight: bold; font-size: 1.3em; }
			.date, .edit, .perma { font-size: 0.9em; }
		}
		.avatar {
			float: left;
			margin:0 15px 10px 0;
			img { margin:0; vertical-align: middle; border:1px solid @border_main; padding:3px; background: #fff; }
		}
		.comment-entry {
			p { margin:0 0 10px 0; }
		}
		.reply {
			padding-top:10px;	
			a {
				font-size: 0.9em;
				background: darken(@bg_light, 2%);
				border-color: darken(@border_main, 7%);
				color: @color_body!important;
				text-shadow: none;
				margin:0;
				&:hover { background: @border_main; }
			}
		}
	}
	
	ul.children {
		margin:10px 0 0 25px;
		padding:0;
		li { border-top:1px solid @border_main; }
		.cancel-comment-reply { margin: 10px 0; }
	}
	.navigation {
		a { display: block; margin:15px 0 0 0; text-decoration: none; }
	}
	h3#pings { margin-top:25px; }
	.pingbacks {
		li.pingback {
			margin:10px 0;
			.reply { display: none; }
		}
	}
	.nocomments { font-weight: bold; font-size: 1.2em; }
}

/* 5.2 Comments Form */
#respond  { 
	margin: 2em 0 0; 
	h3 { font-weight: bold; margin-bottom:20px; }
	.left { float: left; width:200px; margin-right:15px; }
	.right { float: left; width:380px; }
	label { font-size: 0.9em; color: lighten(@color_body, 10%); }
	#reply-title {
		small { display: block; margin:10px 0; font-size: 0.6em; }
	}
	#commentform  {	
		margin: 15px 0 0 0;
		label { position: relative; display: inline-block; vertical-align: top; margin-top:5px; }
		input.txt, textarea { font-size: 1.2em; font-family: @sans; border-color: darken(@border_main, 8%) @border_main @border_main darken(@border_main, 8%); border-width: 1px; border-style: solid; color: @color_body; background: @bg_light; padding:5px 7px; }
		input.txt { width:170px; margin:0 5px 10px 0; }
		textarea { width:95%; }
		.comment-form-comment {
			label { display: none; }
		}
		#submit { margin:15px 0 0 0; cursor: pointer; }
	}
}

/* 5.3 Pingbacks / Trackbacks */
h3#pings  { margin: 25px 0 10px 0; }
.pinglist {
	li {
		margin: 0 0 0 20px;
		list-style-type: decimal;
		.author { font-weight: bold; font-size: 1.3em; }
		.date { font-size: 0.9em; }
		.pingcontent { display: block; margin:10px 0; }
	}
}

/*-------------------------------------------------------------------------------------------*/
/* 6. PAGE TEMPLATES */
/*-------------------------------------------------------------------------------------------*/

/* 6.1 Timeline Page Template */
#archives { 
	padding: 10px 0 0; 
	a { font-style: italic; }
	.archives_list {
		border-left:1px solid @border_main;
		list-style: none;
		margin:0 0 15px 15px;
		li { clear: left; padding-left:24px; font-size: 0.9em; font-style: normal; list-style: none; }
		.date { color: lighten(@color_body, 10%); width:100px; font-style: italic; display: inline-block; vertical-align: top; }
		.linked { width:270px; display: inline-block; vertical-align: top; }
		.comments {
			width:100px;
			display: inline-block;
			vertical-align: top;
			a {
				color: lighten(@color_body, 15%);
				font-size: 0.9em;
				font-style: italic;
				text-decoration: underline;
				padding-left:13px;
				&:hover { text-decoration: none; }
			}
		}
	}
}
h3.archive_year { font-family: @sans; font-weight: bold; font-size: 1.4em; color: @color_body; margin-top:0; }

/* 6.2 Contact Form */
#contact-page {
	.screenReader { left: -9999px; position: absolute; top: -9999px; }
	ol.forms {
		float: left;
		list-style: none;
		width:100%;
		margin:10px 0 0;
		li {
			clear: both;
			float: left;
			margin-bottom:18px;
			position: relative;
			width:100%;
			.error { font-size: 0.9em; display: block; color: red; }
			&.textarea {
				.error { display: block; }
			}
			&.screenReader { margin-bottom:0; }
			&.buttons {
				.submit { margin:5px 0 0; cursor: pointer; }
			}
			&.inline {
				input { width:auto; }
				label { display: inline; float: none; width:auto; }
			}
		}
		label { cursor: pointer; display: block; font-weight:700; margin:0 0 10px; } 
		input.txt { width:50%; }
		input#sendCopy { border: none; margin-right:10px; }
		textarea { height:300px; width:97%; }
	}
} 
.entry #contact-page ol.forms li { list-style: none; }

/* 6.3 Image Gallery */
.image-gallery-item img {
	max-width: 100%; padding:3px; margin: 0 10px 10px 0; border:1px solid darken(@bg_light,10%); background:@bg_light; .border_radius(3px); 
	&:hover { border: 1px solid darken(@bg_light,20%); .box_shadow(0,1px,4px,0px,rgba(0,0,0,.2));}
}

/*-------------------------------------------------------------------------------------------*/
/* 7. MISC */
/*-------------------------------------------------------------------------------------------*/

div.ppt { text-shadow: none; }

/* 7.1 Buttons */
a.button, 
a.comment-reply-link, 
#commentform #submit,
.submit,
input[type=submit],
input.button,
button.button {
	display: inline-block;
	margin: 5px;
	padding: 3px 6px;
	border: 1px solid @button - #333;
	border-bottom-color: @button - #444;
	color: white !important;
	text-align: center;
	text-shadow: 0 1px 0 hsla(0,0%,0%,.3);
	text-decoration: none;
	font-size: 1em; /* Make inputs the same size as anchors */
	font-family: @sans; /* Make inputs use the correct typeface instead of the browser default */
	cursor: pointer; /* Inputs need pointers! */
	
	.border_radius();	
	.vertical_gradient( lighten(@button,5%), darken(@button,5%) );
	.inset_box_shadow(0,1px,0px,0px,rgba(255,255,255,.4);
	
	
	&.large { padding:6px 16px; }
	&.small { padding:0 10px; } 
	&:hover { text-decoration: none; .vertical_gradient(lighten(@button,5%) + #111,darken(@button,5%) - #111); }
	&:active {
		border-color: @button - #555;
		-webkit-box-shadow: inset 0 0 7px hsla(0,0%,0%,.3),
						0 1px 0 hsla(0, 100%, 100%, 1);
		-moz-box-shadow: inset 0 0 7px hsla(0,0%,0%,.3),
						0 1px 0 hsla(0, 100%, 100%, 1);
		box-shadow: inset 0 0 7px hsla(0,0%,0%,.3),
					0 1px 0 hsla(0, 100%, 100%, 1);
	}
}


/* 7.2 Gravity forms */
.gfield {  margin-bottom: 10px; }
.gform_wrapper {
	.top_label {
		.gfield_label { display: block;  padding-right:20px; width:100px; margin:5px 0 4px; }
		input.large, select.large, textarea.textarea { width:400px !important; padding:7px 3px !important; }
		.clear-multi { clear: none !important; }
	}
	input.button { padding:5px 10px 6px !important; }
	input { padding:7px 3px !important; }
	.entry img, img.thumbnail { padding:0 !important; border:0 !important; }
	.gfield_checkbox, .gfield_radio { margin-left:120px !important; }
}

img.ui-datepicker-trigger { border: 0; padding:0; } 

/* 7.3 IE specific styling */
.ie {
	#content .portfolio-item a .mask { display:none; }
	#content .portfolio-item a .plus { display:none; }
}
.ie6 {
	.nav {
		.sf-sub-indicator { display: none; }
		li a {
			&:hover { text-decoration: none; }
			&.sf-with-ul { padding-right:10px; }
			}
	}
	.button, .button:visited { margin: 0; color: @color_body !important; font-weight: normal; }
	.reply {
		a { color: @color_body!important; }
	}
}
.ie7 {
	.nav li a { _height:0; zoom:1; }
	.button, .button:visited { padding:7px 6px; margin:0; }
	.widget ul { list-style-image: none; }
	#tabs .inside { clear: both; }
	.post-bot { display:none; }
	#content.single-portfolio .single-portfolio-image { display:inline; }
	#header { position:relative; z-index:9999; }
}
.ie8 {
	.button, .button:visited { padding:10px 15px; margin: 0; }
	#content .portfolio-item a { width:200px; } 	
	#content .portfolio-item a .mask { display:none; }
	#content.single-portfolio .single-portfolio-image img { max-width: none; }
}