@charset "UTF-8"; /* http://www.w3.org/International/questions/qa-css-charset */
/*

	Nuguerrilla.com
	-------------------

	@file 		layout.css
	@version 	1.0.0b
	@date 		2009-11-01 09:36:30 +0100 (Sun, 1 Nov 2009)
	@author 	Casale Francesco <ibook@nuguerrilla.com>

	Copyright (c) 2009 Nuguerrilla <http://www.nuguerrilla.com>

	Hello! I am Francesco Casale and i have 
	created this stylesheet.
	I hope that my comments will be useful for you ^_^.
	By the way I indent the css rules as the html markup,
	so it can be easy for you understand my code
	Be nice with me!
	
	Table of contents

	- Font color palette
	- Reset browsers default styling
	- Generic rules
	- Generic grid rules
	- Selector rules
		- Header
		- Menu
		- Claim
		- Slider
		- Twitter status
		- Coda goodies, Services, Portfolio , Lifestream (General rules)
		- Coda goodies
		- Services & Competences
		- Extended Portfolio
		- Lifestream
		 	- Flickr
		 	- Social
		 	- I heart
		- Footer
		- Inline content (used for prettyphoto)
	- Say hello
		
	
/*	Font color palette
	----------------------------------------------------
	Please refers to typography file typo.css
*/

/*	Reset browsers default styling
	----------------------------------------------------
	Please refer to reset.css
*/

/*	Generic rules
	----------------------------------------------------
*/

body
{
background-color: #000;
}

/*	Generic Grid rules
	----------------------------------------------------
*/

.container_12
{
background: url(../images/layout/nuguerrilla_lens_flare_background.jpg) -130px 0px no-repeat;
height: 500px;
}

/*	Selector rules
	----------------------------------------------------
*/
	
	/*	Menu
	----------------------------------------------------
	*/
	
	ul.menu
	{
	clear:both;
	margin: 26px 0px 0px 26px;
	}
	
	
	ul.menu li
	{
	float:left;
	margin-right: 4px;
	}
	
	ul.menu li.last
	{
	margin-right: 0px;
	}
	
	/* Claim
	----------------------------------------------------
	*/
	
	.claim
	{
	background: url(../images/layout/nuguerrilla_claim.png) 0px 0px no-repeat;
	width: 384px;
	margin-top: 25px;
	}
	
	.claimie
	{
	background: url(../images/layout/sorry.png) 0px 0px no-repeat;
	width: 630px;
	margin-top: 25px;
	height: 300px;
	}
	
	.claim p
	{
	margin-top: 150px;
	}
	
	.claimie p
	{
	margin-top: 170px;
	}
	
	/* Slider
	----------------------------------------------------
	*/
	
	#slider
	{
	margin-left:27px;
	}
	
	#slider ul
	{
	width:510px;
	height:303px;
	}
	
	#slider ul, #slider li
	{
	margin:0;
	padding:0;
	list-style:none;
	}
	
	#slider li
	{  
	width:510px;
	height:303px;
	overflow:hidden; 
	}
	
	#slider li div.sliderItem
	{
	width: 488px;
	height: 266px;
	margin-left: 11px;
	margin-top:10px;
	}
	
	#prevBtn, #nextBtn, #slider1next, #slider1prev
	{ 
	display:none;
	}
			
	.overLayer
	{
	background: url(../images/layout/black.png);
	height: 25px;
	padding-left:10px;
	padding-top:10px;
	}
	
	/* Twitter status
	----------------------------------------------------
	*/
	
	
	.twitter_status
	{
	background: url(../images/layout/nuguerrilla_twitter_status.png) no-repeat;
	height: 70px;
	margin-top: 10px;
	}
	
	.twitter_status a.follow
	{
	position:absolute;
	margin-left: 740px;
	margin-top:55px;
	}
	
	.twitter_text
	{
	margin-left: 150px;
	width:600px;
	margin-top: 20px;
	}
	
	/* Coda goodies, Services, Portfolio , Lifestream (General rules)
	----------------------------------------------------
	*/
	
	.coda_goodies h2, .services h2, .portfolio h2, .flickr h2, .social h2, .heart h2, .deepartweb h2
	{
	display: inline;
	text-indent: -9999px;
	float:left;
	}
	
	.coda_goodies ul, .services ul
	{
	float:right;
	margin-top: 5px;
	}
	
	.coda_goodies ul li, .services ul li
	{
	float:left;
	margin-right: 5px;
	}
	
	.coda_goodies li.last, .services li.last
	{
	margin-right: 0px;
	}
	
	.coda_goodies p, .services p, .portfolio p, .flickr p, .social p, .deepartweb p
	{
	margin-top: 40px;
	line-height: 1.4em;
	color: #f3ecec;
	}
	
	/* Coda goodies
	----------------------------------------------------
	*/
	
	.coda_goodies
	{
	background: url(../images/layout/nuguerrilla_coda_goodies.png) no-repeat;
	margin-top: 20px;
	}
	
	a.plugin
	{
	float:left;
	margin-right: 10px;
	}
	
	form.button
	{
	float:right;
	margin-top: 10px;
	margin-left: 10px;
	}
	
	.button p
	{
	margin:0px;
	padding:0px;
	}
	
	.coda_goodies span
	{
	width:890px;
	display:block;
	/* margin-top:-15px; */
	}
	
	/* Services
	----------------------------------------------------
	*/
	
	.services
	{
	background: url(../images/layout/nuguerrilla_services.png) no-repeat;
	margin-top: 10px;
	}
	
	a.resume
	{
	background: url(../images/layout/nuguerrilla_resume.png) 0px -2px no-repeat;
	height:30px;
	float:left;
	padding-left: 20px;
	}
	
	a.vcard
	{
	background: url(../images/layout/nuguerrilla_vcard.png) 0px -2px no-repeat;
	height:30px;
	float:left;
	padding-left: 20px;
	}
	
	p.competences
	{
	float:right;
	width:540px;
	margin-top: 0px;
	}
	
	p.servicetext
	{
	/* margin-left: -77px; */
	float: left;
	width:380px;
	margin-right: 10px;
	margin-top: 25px;
	}
	
	h2.competences
	{
	background: url(../images/layout/competences.png) no-repeat;
	width: 540px;
	height: 58px;
	float:right;
	margin-top: 5px;
	}
	
	#competences ul
	{
	clear:both;
	margin-top: -10px;
	}
	
	/* Portfolio
	----------------------------------------------------
	*/
	
	.portfolio
	{
	background: url(../images/layout/nuguerrilla_extended_portfolio.png) no-repeat;
	margin-top: 20px;
	}
	
	#portfolioArea
	{
	margin-top: 20px;
	}
	
	.extendedPortfolio
	{
	background-color: #2a2a2a;
	float:left;
	width: 300px;
	margin:0px 10px 10px 0px;
	}
	
	.extendedPortfolio img
	{
	margin:5px;
	}
	
	.extendedPortfolio p
	{
	margin:5px 5px 5px 5px;
	}
	
	.extendedPortfolio p.clientname
	{
	float:left;
	}
	
	.extendedPortfolio p.data
	{
	float:right;
	}
	
	#portfolioArea ul
	{
	width:940px;
	height:300px;
	}
	
	#portfolioArea ul, #portfolioArea li
	{
	margin:0;
	padding:0;
	list-style:none;
	}
	
	#portfolioArea li
	{  
	width:940px;
	height:300px;
	overflow:hidden; 
	}
	
	#prevBtn, #nextBtn, #slider1next, #slider1prev
	{ 
	display:none;
	}
	
	ol#controls
	{
	margin-left: auto;
	margin-right: auto;
	float:left;
	display: inline;
	}
	
	ol#controls li
	{
	list-style:none;
	float:left;
	}
	
	ol#controls li a
	{
	color:#333333;
	padding:0 10px;
	text-decoration:none;
	font-size: 20px;
	}
	
	ol#controls li.current a
	{
	color:#ccc;
	font-weight:bold;
	}
	
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus
	{
	outline:none;
	}
	
	/* DAW
	----------------------------------------------------
	*/
	
	.deepartweb
	{
	background: url(../images/layout/nuguerrilla_deepartweb.png) no-repeat;
	margin-top: 20px;
	}
	
	/* Lifestream
	----------------------------------------------------
	*/
	
		/* Flickr
		----------------------------------------------------
		*/
	
		.flickr
		{
		background: url(../images/layout/nuguerrilla_flickr.png) no-repeat;
		margin-top: 20px;
		}
		
		.flickrGallery
		{
		margin-top:20px;
		}
		
		img.flickrMini
		{
		margin:0px 10px 10px 0px;
		}
		
		/* Social
		----------------------------------------------------
		*/
	
		.social
		{
		background: url(../images/layout/nuguerrilla_social.png) no-repeat;
		margin-top: 21px;
		}
		
		.social ul
		{
		margin-top: 40px;
		}
		
		.social ul li
		{
		padding:10px 0px 10px 0px;
		border-bottom:1px solid #222222;
		margin-bottom: 5px;
		}
		
		.social ul li img
		{
		margin-right: 10px;
		float: left;
		margin-top:-3px;
		}
		
		.social ul li:hover
		{
		/* background-color: #222222; */
		cursor: pointer;
		}
		
		/* Heart
		----------------------------------------------------
		*/
	
		.heart
		{
		background: url(../images/layout/nuguerrilla_heart.png) no-repeat;
		margin-top: 21px;
		}
		
		.heart ul
		{
		margin-top: 40px;
		}
		
		.heart ul li
		{
		padding:5px 0px 5px 0px;
		list-style: url('../images/layout/nuguerrilla_list_arrow.gif') inside;
		}
		
		.heart ul li:hover
		{
		background-color: #222222;
		cursor: pointer;
		}
	
	/* Footer
	----------------------------------------------------
	*/
	
	.footer
	{
	margin-top:20px;
	border-top:1px solid #222222;
	padding-bottom:20px;
	}
	
	.footer img
	{
	margin-top:10px;
	float:left;
	margin-right:15px;
	}
	
	.footer p
	{
	float:left;
	margin-top: 20px;
	}
	
	.footer ol li
	{
	float:left;
	margin:2px;
	}
	
	.footer ol
	{
	float:right;
	margin-top: -40px;
	margin-left: 200px;
	width:247px;
	}
	
	/* Inline content
	----------------------------------------------------
	*/
	
	.hide
	{
	display:none;
	}
	

/*	
	Hello!!!!
	I hope you enojyed that!
	Francesco
*/