/* Inizio sezione reset ed inizializzazione */

/* CSS Reset */
html, body {
	margin: 0;
	padding: 0;
}

/* Da' al browser la direttiva di renderizzare ciascun elemento HTML 5 come blocco */
header, footer, aside, nav, article, section {
	display: block;
}

/* imposta margini, ampiezza, colore di sfondo e fonts del documento html */
body {
	margin: 0 auto;
	width: 940px;
	font: 13px/22px Helvetica, Arial, sans-serif;
	background: #f0f0f0;
}

h2 {
	font-size: 28px;
	line-height: 44px;
	padding: 22px 0;
}

h3 {
	font-size: 18px;
	line-height: 22px;
	padding: 11px 0;
}

p {
	padding-bottom: 22px;
}

/* Fine sezione reset ed inizializzazione */


/* Inizio sezione navigazione */

nav {
	position: absolute;
	left: 0px;
	right: 0px;
	margin: 0 auto;
	width: 1024px;
	background: url("../images/nav_background.png");
}

nav ul {
	margin: 0 auto;
	width: 940px;
	list-style: none;
}

nav ul li {
	float: left;
}

	nav ul li a {
		display: block;
		margin-right: 20px;
		width: 140px;
		font-size: 14px;
		line-height: 44px;
		text-align: center;
		text-decoration: none;
		color: #777;
	}

		nav ul li a:hover {
			color: #fff;
		}

		nav ul li.selected a {
			color: #fff;
		}

		nav ul li.subscribe a {
			margin-left: 22px;
			padding-left: 33px;
			text-align: left;
			background: url("../images/rss_piccolo.png") left center no-repeat;
		}

/* Fine sezione navigazione */

/* Inizio sezione intro */

#intro {
	margin-top: 76px;
	height: 100%;
	background: url("../images/intro_background.png") repeat-x right;

	/* background-size: 44% 100%, 100%; */

	/* Background-size not implemented yet */
	/* -webkit-background-size: 44% 100%, 100%; */   /* Google Chrome e Safari */
	/* -o-background-size: 44% 100%, 100%;      */   /* Opera                  */
	/* -khtml-background-size: 44% 100%, 100%;  */   /* Konqueror              */
	/* -moz-background-size: 44% 100%, 100%;    */   /* Mozilla Firefox        */

	border-radius: 22px;

	/* Border-radius not implemented yet */
 	-moz-border-radius: 22px;
	-webkit-border-radius: 22px;
}

#intro h2 {
	width: 300px;
	padding: 10px 10px 0 20px;
	font-weight: normal;
	color: #fff;
}

#intro p {
	padding: 0px 0px 10px 20px;
	color: #d9f499;
	width: 430px;
	text-align:justify;
}

#imgIntro {
  /* position:relative; */
  float:right;
  top: 15px;
  right: 34px;
  /* width: 413px; */
  /* height: 220px; */
  width: 413px;
  height: 220px;
  z-index:2;
  background: url("../images/intro_car.png") top right no-repeat;

  border-radius: 22px;

  /* Border-radius not implemented yet */
  -moz-border-radius: 22px;
  -webkit-border-radius: 22px;
}

/* Fine sezione intro */


/* Inizio sezione contenuti */

#content {
	display: table;
}

	#mainContent {
		display: table-cell;
		width: 620px;
		padding-right: 22px;
	}

/* Inizio sezione blogPosts */

    #blogPosts article p {
	   text-align:justify;
    }

    #blogPosts p {
	   text-align:justify;
    }

.blogPost {
	column-count: 2;
  column-rule: 1px solid DarkGray;
	column-gap: 22px;

	/* Column-count not implemented yet */
	-moz-column-count: 2;
	-webkit-column-count: 2;

	/* Column-rule not implemented yet */
	-moz-column-rule: 1px solid DarkGray;
	-webkit-column-rule: 1px solid DarkGray;

	/* Column-gap not implemented yet */
	-moz-column-gap: 22px;
	-webkit-column-gap: 22px;
}

	.blogPost header {
		column-span: all;

		/* Column-span not implemented yet */
		-moz-column-span: all;
		-webkit-column-span: all;
	}

		.blogPost header p, .blogPost header p a {
			font-size: 14px;
			font-style: italic;
			color: #777;
		}

	.blogPost img {
		/* margin: 22px 0; */
		display: block;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:22px;
		width:280px;
		box-shadow: 3px 3px 7px #777;

		/* box-shadow not implemented yet */
		-moz-box-shadow: 3px 3px 7px #777;
		-webkit-box-shadow: 3px 3px 7px #777;

	}

/* Fine sezione blogPosts */

/* Inizio sezione commenti */

#comments {
	margin-top: 21px;
	padding-top: 22px;
	border-top: 1px solid #d7d7d7;
}

	#comments article {
		display: table;
		padding: 22px;
		border: 1px solid #d7d7d7;

		border-radius: 11px;

		/* Border-radius not implemented yet */
		-moz-border-radius: 11px;
		-webkit-border-radius: 11px;
	}

	#comments article:nth-child(2n+1) {
		padding: 21px;
		background: #E3E3E3;
		border: 1px solid #d7d7d7;

		border-radius: 11px;

		/* Border-radius not implemented yet */
		-moz-border-radius: 11px;
		-webkit-border-radius: 11px;
	}

		#comments article header {
			display: table-cell;
			width: 220px;
			padding-right: 22px;
		}

			#comments article header a {
				display: block;
				font-weight: bold;
				color: #000;
			}

				#comments article header a:hover {
					text-decoration: none;
				}

		#comments article p {
			padding: 0;
			text-align:justify;
		}

/* Fine sezione commenti */

/* Inizio sezione Form Inserimento Commento */

form {
	margin-top: 21px;
	padding-top: 22px;
	border-top: 1px solid #d7d7d7;
}

	form p {
		display: table;
		margin-bottom: 22px;
		padding: 0 22px;
	}

	form label {
		display: table-cell;
		width: 140px;
		padding-right: 20px;
		text-align: right;
		font-weight: bold;
		vertical-align: top;
	}

	form input[type="text"], form input[type="email"], form input[type="url"] {
		display: table-cell;
		width: 300px;
		height: 20px;
		border: 1px solid #d7d7d7;
	}

	form textarea {
		width: 300px;
		height: 100px;
		border: 1px solid #d7d7d7;
	}

	form input[type="submit"] {
		margin-left: 162px;
	}

/* Fine sezione Form Inserimento Commento */

/* Inizio sezione Barra Navigazione Laterale */

	aside {
		display: table-cell;
		width: 300px;
		background: url('../images/sidebar_background.png') left top;
		vertical-align:top; /* necessario per Firefox */
	}

    aside section {
      display:block;
    	margin: 22px 0 0 22px;
    	padding: 11px 22px;
    	background: url("../images/sidebar_section_background.png") repeat-x;

      border-radius: 11px;

    	/* Border-radius not implemented yet */
    	-moz-border-radius: 11px;
    	-webkit-border-radius: 11px;
    }
    
    	aside section ul {
    		margin: 0 0 0 -20px;
    		list-style: none;
    	}
    
    		aside section ul li a {
    			display: block;
    			text-decoration: none;
    			color: #000;
    		}
    
    			aside section ul li a:hover {
    				text-decoration: underline;
    			}

/* Fine sezione Barra Navigazione Laterale */

/* Fine sezione contenuti */

/* Inizio sezione Footer */

footer {
	position: absolute;
	left: 0px;
	right: 0px;
	margin: 0 auto;
	width: 1024px;
	background: #222;
}

	footer #mainFooterArea {
		display: table;
		margin: 0 auto;
		width: 940px;
		color: #777;
	}

		footer #mainFooterArea #popular, footer #mainFooterArea #about, footer #mainFooterArea #blogroll {
			display: table-cell;
			width: 260px;
		}

    footer #mainFooterArea #popular, footer #mainFooterArea #blogroll {
			padding-left:20px;
    }

	footer #mainFooterArea section header h3 {
		color: #FFF;
	}

  footer #mainFooterArea #about p {
    text-align:justify;
  }

	footer #mainFooterArea #popular header h3, footer #mainFooterArea #blogroll header h3 {
	  padding-left:10px;
	}

	footer #mainFooterArea section a {
		color: #999;
	}

		footer #mainFooterArea section a:hover {
			color: #FFF;
			text-decoration: none;
		}

	footer #mainFooterArea section ul {
		margin: 0 0 0 0px;
		list-style: square;
		color: #565656;
	}

		footer #mainFooterArea section ul li a {
			display: block;
		}

/* Fine sezione Footer */