/*	
	Onirica Template
	File: stylesheet.css
	Stefano Giliberti - kompulsive@gmail.com clickswitch.net		

	Help:
	
	Images that you could change:
		
		Logo										/* Logo (Line 169)
		Background image							/* Main (Line 32)
		Default list background icon				/* Lists (Line 82)
		Inputs background							/* Forms (Line 97)
		Blog tags background icon					/* Blog (Line 409)
		Blog comments background icon				/* Blog (Line 413)
		
	
	Satured elements to change if your main color is different from blue:	
		
		Background color: 							/* Main (Line 32)
		Links:										/* Links (Line 132, 135)
		Promo box text/links						/* Promo box (Line 200, 209)
		.red Services list text color				/* Services list (Line 315)
		.add Services list text color				/* Services list (Line 319)
		.less Services list text color				/* Services list (Line 323)
		Footer text/links							/* Footer (Line 431, 436)

*/

/* Main */
body {
	background: url(../images/background.jpg) top center no-repeat #09101e;
	color: #575a60;
	font: 62.5% Helvetica, Arial, sans-serif;
	line-height: 1.4em;
}
.left {
	float:left;
}
.right {
	float:right;
}
.clear {
	clear:both;
}
.spacer {
	height:30px;
}
hr {
	background:#c1c2c3;
	border: 0;
	color: #c1c2c3;
	height: 1px;
	margin:30px 0 30px 0;
}
.small {
	color:#929396;
	padding:0 0 10px 0;
	font-size:0.9em;
}
blockquote {
	margin:10px 0;
	color:#727478;
}
cite {
	display:block;
	font-size:0.8em;
}
strong {
	font-weight:bold;
}
em {
	font-style:italic;
}
td {
	padding: 10px 10px;
	border-bottom: 1px solid #c1c2c3;
}

/* Lists */
ul.list {
	list-style:url(../images/li.gif);
	margin:10px 10px 10px 40px;
}
	ul.list li {
		line-height:25px;
		padding:0 0 0 10px;
	}

/* Forms */
label {
	display:block;
	margin:10px 0 10px 0;
}
input,
textarea {
	background:url(../images/input-back.gif) repeat-x top;
	border:1px solid #c1c2c3;
	padding:7px;
	margin:0 0 5px 0;
	font-family: Helvetica, Arial, sans-serif;
}
input {
	width:250px;
}
input.smaller {
	width:100px;
}
input.larger {
	width:400px;
}
textarea {
	width:400px;
	height:150px;
	overflow:auto;
}
.submit {
    border:none;
	width:100px;
	height:30px;
	margin:10px 0 0 0;
	color:#fff;
    background:#474747;
}
	.submit:hover {
		background:#525252;
		cursor:pointer;
	}

/* Links */
a,a:active {
	color: #386acd;
}
a:hover {
	color: #575a60;
}

/* Headings */
h1,h2,h3 {
	color:#64666b;
	font-size:1.5em;
	font-weight:normal;
	padding:0 0 10px 0;
}
h2 {
	font-size:1.2em;
}
h3,h4,h5,h6 {
	color:#575a60;
	font-size:1.1em;
	font-weight:bold;
}

/* Header */
#header {
	height:163px;
	margin:0 auto;
	width:940px;
	position: relative;
}
	/* Logo */
	#header h1#logo, #header h1#logo a { 
		display:block;
		height:46px;
		width:239px;
		border:none;
	}
	#header h1#logo { 
		background:url(../images/logo.png) no-repeat;
		height:46px;
		left:49px;
		top:93px;
		margin:0;
		padding:0;
		position:absolute;
		text-indent:-999em;

	}

/* Transparent box */
#wrapper {
	background:url(../images/trans-0.png) repeat;
	margin:0 auto;
	position:relative;
	width:940px;
	padding:20px 0 0 0;
}

	/* Promo box */
	#promo-box,
	#promo-box-small,
	#promo-box-mini {
		background:url(../images/trans-1.png) repeat;
		position:relative;
		height:231px;
		width:900px;
		margin:0 20px;
	}
		#promo-box p,
		#promo-box-small p {
			color:#d3d8e3;
			font-size:1.7em;
			padding:35px 0 0 35px;
			width:435px;
			font-style:italic;
			line-height:1.3em;
		}
		#promo-box p a,
		#promo-box-small p a {
			color:#98b4ec;
		}
	/* Portfolio Promo-box */
	#promo-box-small {
		height:181px;
	}
		#promo-box-small p {
			padding:35px 35px 0 35px;
			width:auto;
		}
	/* Blog Promo-box */
	#promo-box-mini {
		height:50px;
		background:none;
	}
	
		/* Projects slideshow */
		#feat-slides {  
			height:182px;  
			width:315px;  
			position:absolute;  
			right:40px;
			top:23px;
			overflow:hidden;
		} 
			#feat-slides ul li {  
				position:absolute;
				top:0; 
				left:0 
			}
			#feat-slides #current-desc {
				position:absolute;
				right:0;
				bottom:-1px;
				background:url(../images/trans-3.png) repeat;
				z-index:999;
				padding:7px;
				color:white;
				font-size:1.1em;
			}
		
		/* Menu */
		ul#navigation {
			position:absolute;
			bottom:0;
			left:30px;
		}
			ul#navigation li {
				background:url(../images/trans-2.png) repeat;
				float:left;
				margin-right:10px;
			}
				ul#navigation li a {
					color:white;
					text-decoration:none;
					font-size:1.2em;
					padding:13px 20px;
					line-height:40px;
				}
				ul#navigation li a:hover {
					background:white;
					color:#4e5054;
				}
					ul#navigation li a.current {
						background:white;
						color:#4e5054;
					}
			ul#navigation li.current a {
				color:#4e5054;
			}
	
	/* Content */
	#content {
		position:relative;
		background:white;
		width:900px;
		left:20px;
		font-size:1.5em;
		line-height:1.5em;
		padding:0 0 60px 0;
	}
	/* Used in portfolio.html */
	.full-col {
		padding:50px 40px 0 40px;
	}
	/* Left column */
	.med-col {
		width:500px;
		padding:50px 0 0 40px;
	}
	/* Right column */
	.small-col {
		width:243px;
		padding:50px 40px 0 0;
	}
	
		/* Services List */
		ul.services-list {
			margin:5px 0 5px 10px;
		}
			ul.services-list li {
				line-height:35px;
				background:url(../images/32x_yes.gif) left no-repeat;
				padding:0 0 0 45px;
			}
				ul.services-list li.red {
					background:url(../images/32x_stop.gif) left no-repeat;
					color:red;
				}
				ul.services-list li.add {
					background:url(../images/32x_add.gif) left no-repeat;
					color:green;
				}
				ul.services-list li.less {
					background:url(../images/32x_remove.gif) left no-repeat;
					color:red;
				}			
						
		/* Archive list */
		ul.archive-list li a {
			display:block;
			width:100%;
			border-bottom:1px solid #c1c2c3;
			color:#575a60;
			text-decoration:none;
			line-height:30px;
		}
			ul.archive-list li a:hover {
				border-color:#575a60;
			}
		ul.archive-list li strong {
			float:left;
			font-weight:normal;
			width:190px;
		}
		ul.archive-list li span {
			font-size:0.8em;
			text-align:right;
		}
	
	/* Portfolio */
	.proj {
		width:820px;
		height:200px;
		overflow:hidden;
		position:relative;
		margin:0 0 30px 0;
	}
		.proj .proj-desc {
			position:absolute;
			background:url(../images/trans-4.png) repeat;
			top:0;
			right:0;
			width:30%;
			height:200px;
			cursor:help;
		}
			.proj .proj-desc p {
				padding:15px 20px 20px 20px;
				font-size:0.8em;
				color:white;
				line-height:1.5em;
			}
			.proj .proj-desc h1 {
				padding:20px 0 0 25px;
				color:white;
				font-size:1.3em;
			}
			.proj .proj-desc .small {
				padding:0 0 0 25px;
			}
	
	/* Blog */
	.blog-entry {
		border-bottom:1px solid #c1c2c3;
		padding:0 0 20px 0;
		margin:0 0 40px 0;
	}
		.blog-entry img.post-pic {
			float:left;
			width:134px;
			margin:0 25px 0 0;
		}
		.blog-entry .post-meta {
			padding:10px 0 0 0;
			height:120px;
		}
		.blog-entry .post-content {
			padding:25px 0 0 0;
		}
			.blog-entry .post-meta a {
				color:#333;
				font-size:0.9em;
			}
			.blog-entry .post-meta .small a {
				background:#e2e2e2;
				padding:5px;
				text-decoration:none;
			}
			.blog-entry .post-meta .tags {
				background:url(../images/16x_next.gif) left no-repeat;
				padding:0 0 0 25px;
			}
			.blog-entry .post-meta a.comments {
				background:url(../images/16x_add.gif) left no-repeat;
				padding:0 0 0 25px;
				text-decoration:none;
				line-height:32px;
			}
			.blog-entry .post-meta h1 a {
				font-size:1.4em;
				font-weight:bold;
				letter-spacing:-2px;
				text-decoration:none;
			}
		
	/* Footer */
	#footer {
		clear:both;
		position:relative;
		text-align:right;
		line-height:70px;
		color:#2a313f;
		padding:0 60px 0 60px;
		font-size:1.1em;
	}
		#footer a {
			color:#404756;
		}