/*

	Tieyourlaces.com 
	Created on 4 april 2009
	
*/

/* Handy classes
----------------------------------------------- */	

a:active {
  	outline: none;
	}


.clear {
	clear: both;
	}

.fix {
	border: 1px solid red
	}
	
.static { 
	display: block;
 	z-index: 10;
 	color: #ffffff;
 	overflow-x: hidden;
 	overflow-y: hidden;
 	position: fixed;
	}

.left {
	float: left;
	}
	
.right {
	float: right
	}			

a {
	color: #ee4185;
	text-decoration: none;
	}

a:hover {
	color: #e892b4;
	text-decoration: underline;
	} 	
	
#blog .blog_box_padding a {
	color: #5e5e5e;
	}	
	
/* Layout
----------------------------------------------- */

body, html {
	background: #fff8ee;
	margin:0px; padding:0px;
	background: url(../img/ff_home.png) center top fixed repeat-y #fff8ee;
	}
	
body {
	}	

#container {
	width: 990px;
	margin: 0 auto;
	}
	
#blog {
	width: 960px;
	z-index: 1;
	background: #FFF;
	margin: 122px auto 44px auto
	}

	#blog .first_blog_box {
		float: left;
		width: 320px;
		height: 319px;
		background: #FFF;
		border-bottom: 1px solid #fff8ee
		}	
	
	#blog .blog_box {
		float: left;
		width: 319px;
		height: 319px;
		background: #FFF;
		border-left: 1px solid #fff8ee;
		border-bottom: 1px solid #fff8ee
		}
	
	##blog .blog_box_clear {
		background: #FFF
		}	
	
	#blog .blog_box_padding {
		padding: 22px 22px 22px 22px;
		}
	
	#blog .blog_post_padding {
		padding: 0px 22px 22px 22px;
		}	
	
	#blog .blog_box_padding img {
		margin: 20px 0 10px 0;
		}	
		
	#blog .blog_box_inactive {
		background: #e9f0e5;
		border-left: 1px solid #fff8ee;
		}	
		
	#blog .blog_box_inactive img {
		margin: 0;
		}		
		
	#blog .first_blog_box_inactive {
		float: left;
		background: #e9f0e5;
		}
		
	#blog .first_article_box {
		float: left;
		width: 300px;
		border-right: 1px solid #fff8ee;
		background: #FFF;
		}
	
	#blog .first_article_box img {
		margin: 0; padding: 0;
		}		
		
	#blog .article_box {
		float: left;
		width: 300px;
		background: #FFF;
		border-left: 1px solid #fff8ee;
		}
		
	#blog .article_box_padding {
		padding: 0 21px 0 21px;
		}
		
	#blog .first_article_box_padding {
		padding: 0 21px 0 0;
		}
	
	#blog .article_visual {
		position: relative;
		top: -22px;
		float: right;
		}
			
	#blog .article_visual img {
		margin: 0;
		}					
	
	#blog #blog_comments_box {
		width: 960px;
		background: url(../img/comments_box.jpg) top no-repeat #2cae94;
		display: none;
		}
	
	#blog .blog_comments_box_padding {
		padding: 10px 20px 10px 20px;
		}
		
	#blog .comment_form {
		float: left;
		margin: 0; padding: 0;
		border-right: 1px solid #28a78d
		}	
	
	#blog #comments-navigation {
		position: relative;
		float: right;
		bottom: 40px;
		right: 39px;
		width: 551px;
		clear: both;
		}	
		
	#blog ol.comments-list {
		float: left;
		margin: 0 30px 0 30px; padding: 0;
		width: 550px;
		height: 250px;
		}	
		
	#blog ol.comments-list li.comment-box, li#comment-6 {
		list-style-type: none;
		margin: 0; padding: 0;
		width: auto;
		}
		
	#blog .comment-box {
		margin: 0; padding: 0;
		}
	
	#blog ol.comments-list a {
		color: #FFF
		}	
		
	#blog .blog_comment {
		padding: 5px 20px 5px 0;
		font-size: 10px;
		color: #f3f3f3;
		}
		
	#blog .comment-box-container a {
		color: #FFF;
		}
		
/*
	#blog .comment-box-seperator {
		width: 278px;
		background: url(../img/comments_seperator.png) red;
		height: 5px;
		}	
*/
		
	#blog .comment-box-seperator {
		background: url(../img/seperate_header.png) bottom no-repeat;
		height: 5px;
		width: 278px;
		margin: 3px 0 3px 0
		}	
	
	#blog .comments_created {
		color: #95d4c7
		}			
			
	#blog #comments-navigation-previous {
		float: left;
		background: url(../img/previous-comments.png) left top no-repeat;
		width: auto;
		height: 20px;
		}
		
	#blog #comments-navigation-previous a, #comments-navigation-next a {
		color: #FFF;
		font-weight: bold;
		text-decoration: none;
		}
		
	#blog #comments-navigation-previous a:hover, #comments-navigation-next a:hover {
		color: #d8d8d8;
		}
		
	#blog #comments-navigation-next {
		float: right;
		background: url(../img/next-comments.png) right top no-repeat;
		width: auto;
		height: 20px;
		}
		
	#blog .comments-navigation-padding {
		margin: 0 0 0 25px; 
		}
		
	#blog .comments-navigation-padding-r {
		margin: 0 25px 0 0; 
		}
			
	#blog #all_posts_loaded { 
		height:100px; width:920px;
		background: white;
		border-left: 1px solid lightgrey;
		border-right: 1px solid lightgrey;
		border-top: 1px solid lightgrey;
		/* Transparant */
		filter:alpha(opacity=90);
		-moz-opacity:0.9;
		-khtml-opacity: 0.9;
		opacity: 0.9;
		padding: 20px 20px 0 20px;
		clear: both;
		}
	
	#blog #all_posts_loaded h2 {
		margin: 0 0 10px 0
		} 	
	
	#blog .blog_empty {
		background: #f4f8f1;
		}
	
	#blog .blog_empty_border {
		border-left: 1px solid #e9f0e5;
		border-bottom: 1px solid #e9f0e5;
		}								

#bottom_fade {
	width: 960px;
	height: 22px;
	z-index: 99;
	position: fixed;
	bottom: 44px;
	background: url(../img/bottom-fade.png) bottom center no-repeat;
}	

#top_fade {
	width: 960px;
	height: 22px;
	z-index: 98;
	position: fixed;
	top: 122px;
	background: url(../img/top-fade.png) top center no-repeat;
}

#header {
	top: 0px; 
	background: url(../img/header.jpg) no-repeat;  
	width: 990px; 
	height: 122px;
	z-index: 102
	}

#footer {
	bottom: 0px; 
	background: url(../img/footer.jpg) no-repeat; 
	width: 990px; 
	height: 44px;
	}		
		
/* Typography
----------------------------------------------- */

body {
	font: 11px/1.6em "Lucida Sans", "Verdana", sans-serif;
	}

.articlebox h3 {
	margin: 5px 0 5px 0;
	}
#blog h1 {
	font-size: 20px;
	}

#blog h2 {
	font-size: 20px;
	font-weight: bold;
	}

#blog h3 {
	font-size: 17px;
	}		

/* Coloring
----------------------------------------------- */

.lightblue {
	color: #e4f4f1
	}
	
.green {
	color: #2bae93
	}

#blog h1.green a, #blog h2.green a {
	color: #2bae93
	} 	
	
.orange {
	color: #ffa930
	}

#blog h1.orange a, #blog h2.orange a {
	color: #ffa930
	} 

.rose {
	color: #ee4185
	}

#blog h1.rose a,#blog h2.rose a {
	color: #ee4185
	}
	
.blog_box_padding h3 {
	color: #2bae93
	}
	
#blog ol.comments-list {
	color: #fff8ee
	}		 

/* Buttons
----------------------------------------------- */

a.read_button {
    background: url(../img/read_button.jpg) no-repeat top right;
    display: block;
    float: left;
    height: 25px;
    width: 278px;
    margin: 19px 0 0 0 
}

a.read_button:hover {
    background-position: 0 -25px;
	}

a.read_button span {
	display: none;
	}
	
a.follow_us {
    position: relative;
    float: right;
    top: 89px;
    right: 36px;
    background: url(../img/follow_us.jpg) no-repeat scroll top right;
    display: block;
    height: 16px;
    width: 74px;
	}	

a.follow_us:hover {
    background-position: 0 -16px;
	}

a.follow_us span {
	display: none;
	}
	
a.tweet_us {
    position: relative;
    float: right;
    top: 89px;
    right: 48px;
    background: url(../img/tweet_us.jpg) no-repeat scroll top right;
    display: block;
    height: 15px;
    width: 67px;
	}	

a.tweet_us:hover {
    background-position: 0 -15px;
	}

a.tweet_us span {
	display: none;
	}	
	
a.delicious_us {
    position: relative;
    float: right;
    top: 91px;
    right: 60px;
    background: url(../img/delicious_us.jpg) no-repeat scroll top right;
    display: block;
    height: 13px;
    width: 83px;
	}	

a.delicious_us:hover {
    background-position: 0 -13px;
	}

a.delicious_us span {
	display: none;
	}
	
a.home {
	float: left;
	display: block;
	width: 381px;
	height: 100px;
	}	
	
a.home span {
	display: none;
	}
	
a.footer {
	float: left;
	display: block;
	width: 463px;
	height: 44px;
	}	
	
a.footer span {
	display: none;
	}
	
a#link-woodenshoes {
	float: left;
	width: 293px;
	height: 44px;
	}
	
a#link-email {
	float: right;
	width: 178px;
	height: 44px;
	margin: 0 30px 0 0;
	}
	
a#link-woodenshoes span {
	display: none;
	}
	
a#link-email span {
	display: none;
	}	
	
a#btn-slide-a {
	position: relative;
	display: block;
	left: 285px;
	width: 34px;
	height: 35px;
	text-align: center;
	line-height: 47px;	
	color: #FFF; text-decoration: none;
	background: url(../img/comments_count.png) no-repeat #2bae93;
	font-weight: bold;
	clear: both;
	z-index: 101;
	}
	
a#btn-slide-a:hover, a#btn-slide:hover {
	color: #e1e1e1;
	}					

/* Forms
----------------------------------------------- */

form {
	width: 320px;
	}
	
label{
	float:left;
	display:block;
	text-align:left;
	margin: 0 0 5px 0;
	width:250px;
	color: #b3d9d1;
	}
	
form textarea {
	clear: both;
	width: 250px
	}	
	
textarea#WildCommentContent {
	width: 266px;
	background: #2cae94;
	border: 1px solid #29a088;
	padding: 5px;
	}	
	
input {
	float:left;
	font-size:11px;
	padding:7px 0 0 5px;
	color: #fff8ee;
	height: 27px;
	width:278px;
	border: none;
	background: url(../img/input.jpg) no-repeat;
	}

.submit input { 
	background: url(../img/submit.png) no-repeat;
	display: block;
	float: left;
	text-align: left;
	width: 71px;
	height: 31px;
	padding: 0;
	margin: 5px 0 10px 0;
	}

.submit input value {
	display: none
	}

/* Hacks, yeah yeah, nobody likes hacks
----------------------------------------------- */		
	
	/*\*/
	html>body*#blog #blog_comments_box {
	width: 960px;
	background-color: #00a483;
	display: none;
	}
	/**/	
	
	/*\*/
	html>body*input {
	padding: 0 0 0 7px;
	}
	/**/