html *{
    margin:0;
    padding:0;
}

body {
	background: white url(images/bg.png) repeat;
	font: 11px verdana, sans-serif;
}

img { border:0; }

h1 {
    width:auto;
}

h2 {
	padding-top: 2px;
	margin-bottom: 10px;
    padding-left: 10px;
	font: italic 20px Arial, Helvetica, sans-serif;
	color:white;
    background: gray;
	
	border-bottom: solid 1px #757575;
}

h2 b {
	color:white;
    text-decoration: italic;
}

a {
	color: red;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: blue;
	text-decoration: none;
}

/**************************************************************************
    GENERIC
**************************************************************************/

.clear {
	clear: both;
}

/**************************************************************************
    HEADER
**************************************************************************/

.header{
	position:fixed;
    top:0;
    left:0;
    right:0;
    height:60px;
	background:url(images/top-bar.png) repeat-x 0 0;
	z-index: 1000;
}

.header .logo { float:left; background:url(images/logo.png) no-repeat; width:200px; height:40px;}


/**************************************************************************
    CONTACTS
**************************************************************************/

.contacts { 
    background:url(images/contact-bg.png) no-repeat;
    position:fixed; 
	width:75px;
    height:412px;
    margin:150px 40px 40px 0px;
    padding:10px 0px 0px 10px;
}
.contacts a { width:50px; height:50px; display:inline-block; margin-top:5px;}
.contacts .email{ background:url(images/email.png) no-repeat; }
.contacts .youtube{ background:url(images/youtube.png) no-repeat; }
.contacts .twitter{ background:url(images/twitter.png) no-repeat; }
.contacts .facebook{ background:url(images/facebook.png) no-repeat; }
.contacts .linkedin{ background:url(images/linkedin.png) no-repeat; }
.contacts .google{ background:url(images/google.png) no-repeat; }
.contacts .lastfm{ background:url(images/lastfm.png) no-repeat; }

/**************************************************************************
    CONTENT
**************************************************************************/

.content {
    background:url(images/main-bg.png) repeat-y;
	width:724px;
    margin: 0px 0px 0px 20px;
	padding: 60px 80px 30px 80px;
}

.content_footer {
	background-image:url(images/bottom-bg.png);
    width:884px;
    height:50px;
    text-align:center;
    margin: 0px 0px 0px 20px;
}

/********************************************************
    ARTICLE
********************************************************/
.content .article {
    padding: 20px 0;
}

.article h2 {
    margin-bottom: 15px;
}

.article h2 a {
    margin-bottom: 15px;
	font: 9px verdana, sans-serif;
	color: white;
	font-weight: bold;
	text-decoration: none;
    text-align: right;
}

.article p {
    text-align: justify;
}

.article ul {
    
}

/******************************************
    NAV
******************************************/

.article .nav {
    float:left;
    width:100px;
}

.nav .logo {    
    width:100px;
    height:100px;
    margin-bottom: 10px;
}

.nav ul
{
    list-style:none;
}

/******************************************
    SUMMARY
******************************************/
.article .summary {
    width:604px;
    float:left;
    padding-left: 20px;
}

.summary .demo { 
    float:right;     
    margin-left:10px;
}

.summary p { }

.summary ul {
     list-style-type:square;
     color: #757575;
     margin: 5px 0 5px 30px;
 }