/*
	/////////////////////////////////////////////
	karoljaworski.com
	main css
	
	
	////////////////////////////////////////////
	
	by hinok.net
	
*/

@import url(reset.css);


/*
///////////////////////////////
*/
body {background: #110e0f url(images/bg.jpg) no-repeat top left; text-align: left; font: 11px normal Arial, Tahoma, Verdana, sans-serif;}
body.high {background: #110e0f url(images/bg_high.jpg) no-repeat top left; text-align: left; font: 11px normal Arial, Tahoma, Verdana, sans-serif;}
#contact h2, #main h1 a, #main h3, #works h2, #footer p {display: block; text-indent: -9999px;}

/*
///////////////////////////////        HOME PAGE
*/
	.wrap {width: 700px; margin: 50px 0 0 75px;}
		#top {margin-bottom: 40px; overflow: auto;}
			#contact {float: right;}
				#contact h2 {background: transparent url(images/contactme.png) no-repeat; width: 96px; height: 15px; float: left; margin-right: 18px;}
				#contact ul, #contact li {margin: 0; padding: 0;}
				#contact ul {float: left;}
					#contact li { list-style: none; list-style-image: none; color: #fff; margin-bottom: 12px;}
					#contact li a {color: #fff; text-decoration: underline;}
					#contact li a:hover {color: #9f8585; text-decoration: underline;}

			#main h1 a {background: transparent url(images/welcome.png) no-repeat; width: 313px; height: 19px; margin: 0;}
			#main h3 {background: transparent url(images/imfreelance.png) no-repeat; width: 179px; height: 15px; margin-top: 6px;}
/*
///////////////////////////////        WORKS
*/
			
			#works h2 {background: transparent url(images/selectedProjects.png) no-repeat; width: 193px; height: 19px; margin-bottom: 20px;}
			#works ul, #works li {margin: 0; padding: 0;}
				#works li { list-style: none; list-style-image: none;}
				#works ul li {display: block; float: left;}
				#works li a {display: block; width: 103px; height: 103px; margin: 0 12px 15px 0;}
				#works li a:hover {background: transparent url(images/workHover.png) no-repeat; opacity:.50; filter: alpha(opacity=50); -moz-opacity: 0.5;}
				#works li a:hover img {visibility: hidden;}
				
/*
///////////////////////////////        FOOTER
*/	

		#footer {margin: 30px 0 100px 0;}
			#footer p {background: transparent url(images/footer.png) no-repeat; width: 274px; height: 13px;}
			
/*
///////////////////////////////        PAGE
*/

		.opacity {background: transparent url(images/opacity.png) repeat; padding: 12px;}
			.opacity span {color: #fff;}

	#wrapPage {margin: 0 75px 0 75px; position: relative; padding-top: 50px;}
		#target {position: absolute; top: 0; left: 0;}
		#nav {position: absolute; top: 0; left: 550px;}
			#nav a {color: #fff; background: transparent url(images/opacity.png) repeat; padding: 12px;}
			#nav a:hover {background: #000 none;}