/* HTML5 : CSS3 stylesheet; v1.01.1a */
/* Copyright Lee Owen February 2010 */

/* So IE can render new HTML5 tags correctly  */
article, aside, dialog, figure, footer, header,
  hgroup, menu, nav, section { display: block; }

/* Now using Modernizr */

/* Browser Reset Based on Eric Meyer's reset css
http://meyerweb.com/eric/tools/css/reset/ 
----------------------------------------------------------------------------------------- */
 
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, font, 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 {
margin : 0; padding : 0; border : 0; outline : 0; font-size : 100%; vertical-align : baseline; background : transparent; }
body { line-height : 1; }
ol, ul { list-style-type : none; }
/* blockquote, q { quotes : none; } */
/* blockquote:before, blockquote:after, q:before, q:after { content : ''; content : none; } */
:focus { outline : 0; }
ins { text-decoration : none; }
del { text-decoration : line-through; }
 
/* Modified from: http://code.google.com/p/blueprintcss/
Thanks to Andy Clarke http://www.forabeautifulweb.com/
----------------------------------------------------------------------------------------- */
body { font : 14px/1.5 "Trebuchet MS", Trebuchet, Arial, sans-serif; }
h1, h2, h3, h4 { font-weight : normal; }
p { margin-bottom : 1em; }
ul, ol { margin : 1.5em 0; }
ul { list-style-type : none; list-style-position : inside; }
ol { list-style-type : decimal; list-style-position : inside; }
abbr, acronym { border-bottom-width : 0; }
strong { font-weight : bold; }
em { font-style : italic; }

/* =fonts */

@font-face {
	font-family: 'PTSansRegular';
	src: url('../fonts/PT_Sans.eot');
	src: local('PT Sans Regular'), local('PTSans-Regular'), url('../fonts/PT_Sans.ttf') format('truetype');
}

@font-face {
	font-family: 'PTSansItalic';
	src: url('../fonts/PT_Sans_Italic.eot');
	src: local('PT Sans Italic'), local('PTSans-Italic'), url('../fonts/PT_Sans_Italic.ttf') format('truetype');
}



/* =general */

a {
	outline: none;
	font-family: 'PTSansRegular';
	letter-spacing: 0.1em;
	color: #880000;
}

p {
	font-family: 'PTSansRegular';
	letter-spacing: 0.1em;
}

h2 a {
	letter-spacing: -0.1em;
}
img {
	border: none;
}
ul {

}
ul li {

}
ol {
	overflow: hidden;
}

ol li {
	overflow: hidden;
}
form {

}
small {
	font-size: 90%;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'PTSansRegular';
	color: #222;
	text-shadow: 1px 1px 2px #ffe;
}

h1 { font-size: 9em; letter-spacing: -0.1em; opacity: 0.1; padding: 0; margin: 0; line-height: 1em;
}
h2 { font-size: 4em; line-height: 1em; margin: 0; padding: 0; letter-spacing: -0.1em;
}
h3 { font-size: 2em; line-height: 2.1em; margin: 0; text-shadow: 1px 1px 2px #ffe;}
h4 { font-size: 1.0em; }
h5 { font-size: 0.9em; }
h6 { font-size: 0.8em; }

dt {

}
dd {

}
pre, code {
	font-family:Monaco,"Courier New",Courier,monospace;
	font-size:12px;
	background:#fde;
	overflow:auto;
}
code {

}
pre {

}
blockquote {
	border:none !important;
}
blockquote p {

}

form {
	
}

label {
	display: block;
	margin-bottom: 2px;
}

input {
	
}

hr {
	background-color: #fff;
	border-style: solid;
	border-width: 1px;
	border-top-color: #a29282;
	border-right-color: #f2f2f2;
	border-bottom-color: #f2f2f2;
	border-left-color: #a29282;
}

/* =selectors */

html {
	font-family: "Lucida Grande", Lucida, Trebuchet, Arial, sans-serif;
	font-size: 14px;
	background: url("../images/bg-tex.png") center center repeat fixed;
}

body {
	background: url("../images/bg-bigflee.png") 200px 150px no-repeat fixed;
	min-height: 600px;
	min-width: 200px;
	margin: 0 10% 0 200px;
	padding: 120px 0 0 0;
}

header {
	background: url("../images/bg-pulldown.png") 0 0 no-repeat;
	position: fixed;
	top: 0;
	left: 16%;
	width: 908px;
	height: 159px;
	z-index: 99;
}

header img {
	position: absolute;
	top: 20px;
	left: 30px;
}

header h1 {
	font-size: 20px;
	text-indent: -9999px;
}

header nav {
	position: absolute;
	top: 10px;
	left: 300px;
}

header nav li {
	float: left;
}

header nav li a {
	display: block;
	width: 135px;
	height: 55px;
	line-height: 57px;
	text-align: center;
	color: #000000;
	text-decoration: none;
	background: transparent url("../images/button.png") 0 0 no-repeat;
	opacity: 0.9;
}

header nav li a:visited {
	color: #432;
}

header nav li a:hover {
	opacity: 1;
	color: #880000;
	border-bottom: none;
}

/* =rgba, borderradius etc. --------/

.rgba header nav li a {}

.no-rgba header nav li a {}

.borderradius header nav li a {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

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

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

a:visited {
	color: #660000;
}

a:hover {
	text-decoration: underline;
}

section.blog {
	padding: 1em;
	overflow: hidden;
	min-width: 300px;
}

#detail section.blog, #home section.blog {
}

#home section.blog {
	padding-top: 30px;
}

.col1 {
	margin-left: 100px;
}

.col2 {
	margin-left: 225px;
}

.col3 {
	margin-left: 5%;
}

#detail section.col3, #home section.col3 {
	margin-left: 35%;
}

#blog section.blog article a img, #about section.blog article img, #contact section.blog article img {
	position: relative;	
	float: left;
	height: 60px;
	padding: 3px;
	margin: 5px 10px 10px 0;
	background-color: #fff;
	border: 1px solid #987;
	-webkit-box-shadow: 0 0 5px #333;
	-moz-box-shadow: 0 0 5px #333;
	box-shadow: 0 0 5px #333;
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
}

#blog section.blog article a:hover img, #home section.blog article a:hover img {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	
}


#detail section.blog article a.detail-pic-link, #home section.blog article a.detail-pic-link {
	position: fixed;
	float: none;
	top: 200px;
	right: 70%;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
}

#detail section.blog article a img, #home section.blog article a img {
	height: 300px;
	padding: 10px;
	margin: 0;
	background: #efefef;
	border: 1px solid #999;
	-webkit-box-shadow: 0 0 10px #333;
	-moz-box-shadow: 0 0 10px #333;
	box-shadow: 0 0 10px #333;
	
}

#detail section.blog article a.detail-pic-link:hover, #home section.blog article a.detail-pic-link:hover {
	-webkit-transform: rotate(0deg) translate(-200px) scale(3);
	-moz-transform: rotate(0deg) translate(-200px) scale(3);
	-o-transform: rotate(0deg) translate(-200px) scale(3);
}

#portfolio section.portfolio {
	padding: 100px;
}

#portfolio section.portfolio #portfolio-container{
	position: relative;
}

#portfolio section.portfolio #portfolio-container img {
	position: relative;
	margin: 0;
	width: 100px;
}

#portfolio section.portfolio #portfolio-container a {
	overflow: hidden;
	width: 100px;
	float: left;
	display: inline;
	border: 1px solid #999;
	background: #eee;
	-webkit-box-shadow: 0 0 5px #999;
	padding: 5px 5px 10px 5px;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	position: relative;
	z-index: 1;
}

#portfolio section.portfolio #portfolio-container a.pic-a {
	-webkit-transform: rotate(10deg) translate(10px, -10px);
	-moz-transform: rotate(10deg) translate(10px, -10px);
	-o-transform: rotate(10deg) translate(10px, -10px);
	z-index: 40;
}
#portfolio section.portfolio #portfolio-container a.pic-b {
	-webkit-transform: rotate(-20deg) translate(-20px, 20px);
	-moz-transform: rotate(-20deg) translate(-20px, 20px);
	-o-transform: rotate(-20deg) translate(-20px, 20px);
	z-index: 20;
}
#portfolio section.portfolio #portfolio-container a.pic-c {
	-webkit-transform: rotate(40deg) translate(-40px, -10px);
	-moz-transform: rotate(40deg) translate(-40px, -10px);
	-o-transform: rotate(40deg) translate(-40px, -10px);
	z-index: 10;
}
#portfolio section.portfolio #portfolio-container a.pic-d {
	-webkit-transform: rotate(-30deg) translate(30px, 30px);
	-moz-transform: rotate(-30deg) translate(30px, 30px);
	-o-transform: rotate(-30deg) translate(30px, 30px);
	z-index: 30;
}

#portfolio section.portfolio #portfolio-container a:hover {
	border: 1px solid #fff;
	z-index: 99;
	-webkit-transform: rotate(0deg) translate(5px) scale(3);
	-moz-transform: rotate(0deg) translate(5px) scale(3);
	-o-transform: rotate(0deg) translate(5px) scale(3);	
}

section.blog h2 {
	color: #000;
	border-bottom: 1px dashed #000;
}

section.blog article {
	margin: 0.5em 0 2em 0;
	overflow: hidden;
	padding: 10px;
	padding-bottom: 50px;
	background: url(../images/separator.png) center bottom no-repeat;
}

/* =comments */

#comments, #comments-form {
	background: #e2d2c2;
	padding: 10px;
	margin: 0.5em 0 0 0;
}

#comments {
	padding-bottom: 50px;
	background: url(../images/separator.png) bottom center no-repeat;
}

.rgba section.blog article, .rgba #comments, .rgba #comments-form {
	background-color: rgba(225,211,185,0.8);
}

#blog section.blog article {
	background-color: transparent;
}

article h2, article h3 {
	color: #000;
	line-height: 1.1em;
}

article h4 {
	border-bottom: 1px dashed #999;
}

article p {
	color: #000;
	line-height: 1.5em;
	padding: 0.2em;
	margin: 10px 0;
}

article h2 a:visited:after {
	content: url(../images/tick.png);
}

article ul {
	list-style-type: disc;
	margin-left: 3em;
}

.breadcrumb {
	padding: 0.5em;
	background: #e2d2c2;	
}
.rgba .breadcrumb {
	background: rgba(225,211,185,0.8);
}

.comment-count {
	float: right;
	display: inline;
	padding-right: 30px;
	height: 30px;
	background: url(../images/comment.png) right center no-repeat;
}

/* =background color on individual eelements

#detail article p, #detail article h2, #detail article h3, #home article p, #home article h2, #home article h3, .breadcrumb {
	background: rgb(220,210,180);
}

.rgba #detail article h2, .rgba #detail article h3, .rgba #detail article p, .rgba .breadcrumb {
	background: rgba(220,210,180,0.75);
}

.rgba #home article h2, .rgba #home article h3, .rgba #home article p {
	background: rgba(220,210,180,0.75);
}
*/
section.blog article h2 {
	color: #880000;
	border: none;
}

article h3 {
	color: #000;
	text-shadow: 1px 1px 1px #ffe;
	border-bottom: 1px dashed #666;
}

article p {
	text-indent: 1em;
}

#paginate {
	float: right;
	background: rgba(225,211,185,0.8);
	font-size: 0.9em;
}

.summary p {
	font-size: 1.2em;
	font-family: 'PTSansItalic';
	margin-top: 1em;
}

aside {
	position: fixed;
	top: 185px;
	left: 20px;
	background: #e4d4b4;
}

aside h2 {
	font-size: 2.5em;
	padding-bottom: 0.1em;
	border-bottom: 1px dashed #987;
	margin-bottom: 20px;
}

aside img {
	display: inline;
	float: none;
	vertical-align: middle;
}

footer {
	float: right;
	clear: both;
}

footer p {
	text-align: right;
	font-size: 0.75em;
	line-height: 1em;
	color: #000;
	padding: 0.1em;
	margin: 0;
}

.rgba #detail footer p, .rgba #home footer p {
}

/* =classes */

/* =id's */

/* =forms */

#comments-form {
	
}

#comments-form input[type="text"] {
	width: 200px;
	padding: 5px;
	background: #fff;
	border: solid 1px #a29282;
	opacity: 0.5;
}

#comments-form textarea {
	padding: 5px;
	background: #fff;
	border: solid 1px #a29282;
	opacity: 0.5;
}

#comments-form input[type="text"]:hover, #comments-form textarea:hover {
	opacity: 0.8;
}