/* CSS Document */

html, body {
margin: 0; padding: 0;  }

body { padding: 50px 0 0 0; }

html {
background-color: #cac8c6;
background-image: url(../../images/JN-pagetile.jpg);
background-repeat: repeat;
background-attachment: fixed;
font-family: 'PT Sans', sans-serif;
font-size: 13px; }

h1 { font-size: 15px; margin: 0; padding: 0; font-weight: 400; line-height: 20px; }

#welcome {
width: 960px; height: 400px;
margin: 0 auto; padding: 0;
background-image: url(../../images/JN-welcome.png);
background-position: bottom center;
background-color: transparent;
background-repeat: no-repeat; }
#welcome a { width:960px; height: 400px; display: block; }

#home {
width: 960px; height: 400px;
margin: 0 auto; padding: 0;
background-image: url(../../images/JN-home.png);
background-position: bottom center;
background-color: transparent;
background-repeat: no-repeat; }

#edge {
width: 960px; height: 400px;
margin: 0 auto; padding: 0;
background-image: url(../../images/JN-edge.png);
background-position: bottom center;
background-color: transparent;
background-repeat: no-repeat; }
#edge a { width:960px; height: 400px; display: block; }

#topbar {
position: fixed; top: 0; 
width: 100%; height: 50px;
margin: 0; padding: 0;
z-index: 30; border-bottom: 1px #afafaf solid;
background-image: url(../../images/JN-infotile.png); }

#info {
position: relative;
width: 960px; height: 50px;
margin: 0 auto; padding: 0; }

	#info #titletop { width: 575px; height: 50px; background-image: url(../../images/JN-title.png); }
	#info #twitter,
	#info #facebook,
	#info #payonline,
	#info #sendfile,
	#info #email { position: absolute; top: 7px; right: 0; width: 35px; height: 35px; }
	#info #twitter a,
	#info #facebook a,
	#info #payonline a,
	#info #sendfile a,
	#info #email a { display: block;  width: 35px; height: 35px; }
		#info #email { right: 190px;  background-image: url(../../images/JN-email.png); }
		#info #twitter { right: 145px; background-image: url(../../images/JN-twitter.png); }
		#info #facebook { right: 100px; background-image: url(../../images/JN-facebook.png); }
		#info #payonline { right: 55px; background-image: url(../../images/JN-payonline.png); }
		#info #sendfile { right: 10px; background-image: url(../../images/JN-upload.png); }

#wrap {
	position: relative;
	width: 960px; height: auto;
	margin: 0 auto; padding: 0;
	z-index: 1; }

#header {
	position: fixed;
	top:55px; margin-left: -100px;
	width: 80px; height: 630px;
	background-image: url(../../images/JN-header.png);
	z-index: 25; }
	
.portfolio { width: 960px; display: block; margin: 0 auto 10px auto; z-index: 1; color: #6b6b6b; }

.thumb { position: relative; width: 675px; float: left; }

	.T-web, .T-logo, .T-design, .T-cards { position: absolute; left: 4px; width: 40px; height: 115px; }
	.T-web { background-image: url(../../images/JN-website.png); }
	.T-logo { background-image:url(../../images/JN-logo.png); }
	.T-design { background-image: url(../../images/JN-graphics.png); }
	.T-cards { background-image:url(../../images/JN-buscard.png); }
	
	.S-edge, .S-twh, .S-vcom { position: absolute; bottom: 2px; right: 20px; width: 46px; height: 46px; }
	.S-edge a, .S-twh a, .S-vcom a { display: block; width:46px; height:46px; margin: 0; padding: 0; }
	.S-edge { background-image:url(../../images/JN-edge.png); }
	.S-vcom { background-image:url(../../images/JN-vcom.png); }
	.S-twh { background-image: url(../../images/JN-twh.png); bottom: 0; right: 18px; }

.caption { position: relative; width: 280px; padding: 15px 0; float: left; }
.caption h1 span { font-size: 12px; }

#project .thumb {
	opacity:0.5;
	filter:alpha(opacity=50); /* For IE8 and earlier */
}