/*
//
Look at you! Fiddling with my stylesheet. !!!!!

If you have any questions, let me know. me@leechakov.com
//
*/


/*
//
Global
//
*/
body {
	margin: 0;
	padding: 0;
	color: #000;
	background: #f1f1f1 url(images/body_bg.jpg) repeat-x;
	font: 12px "Lucida Grande", Arial, sans-serif;
	background-attachment:fixed;
	z-index: 
}

p a {
	color: #4c4c4c;
	border-bottom: 1px Solid #c9c9c9;
	text-decoration: none;
}
p a:hover {
	color: #f44e1b;
	border-bottom: 1px Solid #c5370b;
}

img {
	border: 0;
	outline: 0;
}
.clear {
	clear: both;
}

#realbgx {
	position:fixed;
	z-index: 9999;
	overflow:auto;
	height:100%;width:100%;
	background: url('images/raster.png');


}

#gridbox {
background-image: url('images/raster.png'); 
	position: fixed; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%; 
	z-index: -100;


}

#header_wrapper {
	height: 133px;
	width: 100%;
	position:fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	background: url(images/header_bg.png) repeat-x;
}
#header {
	width: 980px;
	margin: auto;
}
#logo {
	margin-right: 71px;
	width: 262px;
	height: 83px;
	float: left;
	background: url(images/logo.png) no-repeat;
}
#logo a {
	display: block;
	outline: 0;
	border: 0;
	width: 300px;
	height: 94px;
}
#nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
}
#nav li {
	float: left;
	margin-right: 25px;
	margin-top: 65px;
	padding: 5px 13px 5px 5px;
}
.selected {
	padding-right: 25px;
	background: transparent url(images/nav_arrow.png) no-repeat center right;
}
#content_home {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	z-index: 9999;
	margin-top:30px;
}

#content {
	width: 980px;
	margin-top: 150px;
	margin-left: auto;
	margin-right: auto;
	z-index: 9999;
}

/*
//
Homepage
//
*/

#welcome_wrapper {
	width:100%;
	background: url(images/welcome_bg.png);
	background-repeat: repeat;
	margin-top: 93px;
}

#welcome_content {
margin-left: auto;
margin-right: auto;
width: 980px;
padding-top: 30px;
padding-bottom: 30px;
}


#welcome {
	margin-bottom: 50px;
	margin-left: -7px;
	margin-top:150px;
}



#project_grid {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 1005px;
}
#project_grid li {
	margin-right: 25px;
	margin-bottom: 48px;
	padding: 0;
	float: left;
	width: 310px;
	height: 215px;
	display: block;
	background-repeat: no-repeat;
}
.overlay {
	display: block;
	z-index: 999999;
	width: 310px;
	height: 175px;
	background: url(images/hover_overlay.png);
}
#project_grid .info {
	padding: 15px;
	color: #808080;
	font: 10px "Lucida Grande", Arial, sans-serif;
	background-color: #fff;
}
#project_grid .name {
	color: #000;
	display: block;
	text-transform: uppercase;
	font: 15px "Lucida Grande", Arial, sans-serif;
}
#project_grid .desc {
	display: block;
	margin-top: 2px;
}
#project_grid .desc a {
	color: #808080;
}
#project_grid a {
	color: #808080;
	text-decoration: none;
}


/*
//
Project Page
//
*/



/* new */

#project {
width: 980px;
background-color: #fff;
z-index: 9999;
}

#project p {
margin-left: 0;
margin-bottom: 20px;
margin-right: 0;
margin-top: 0;
padding: 0;
font-size: 12px;
line-height: 18px;
}



#project_art {
	list-style: none;
	padding: 0;
	width: 645px;
	overflow: hidden;
	margin-left: 338px;


}

#project_art li {
	padding: 0;
	margin-right:0px;
	margin-bottom: 30px;
	position: relative;
	
}

#project_art .first {
margin-right: 25px;
}

#project_art .ipad {
background-image: url(images/ipad.jpg);
background-repeat:no-repeat;
width: 583px;
height: 448px;
padding-top: 56px;
padding-left: 62px;
}


#project_art .iphone {
background-image: url(images/iphone.jpg);
background-repeat:no-repeat;
width: 284px;
height: 498px;
padding-top: 108px;
padding-left: 26px;
	float: left;


}

#project_art .android {
background-image: url(images/android.jpg);
background-repeat:no-repeat;
width: 286px;
height: 580px;
padding-left: 24px;
padding-top: 79px;
	float: left;

}


.cornerimage {
	position: absolute;
	top: -3px;
	left: -3px;
}
#project_art img {
	display: block;
}

#project_art .border img{
	border-left-color: #e5e5e5;
	border-left-style: solid;
	border-left-width: 1px;
	border-bottom-color: #e5e5e5;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

#project_art span {
	padding-top: 8px;
	display: block;
	color: #808080;
	font: 11px "Lucida Grande", Arial, sans-serif;
}
#project_art a {
	text-decoration: none;
	outline: 0;
}
#project_info {
	float: left;
	width: 240px;
	padding:40px;
}
#project h1 {
	font-weight: normal;
	padding: 0;
	margin: 0 0 8px;
	color:#fff;
	font-size: 30px;
	text-transform:uppercase;
}
#project_info h2 {
	color: #4c4c4c;
	padding: 0;
	font: 10px "Lucida Grande", Arial, sans-serif;
	margin: 6px 0 2px;
}
#project_info .info {
	color: #000;
	margin-bottom: 10px;
	display: block;
	font: 11px "Lucida Grande", Arial, sans-serif;
}
#project_info .desc {
	color: #000;
	display: block;
	font: 11px/15px "Lucida Grande", Arial, sans-serif;
}



/*
//
Contact Page
//
*/

#contact {
}

#contact ul {
	list-style: none;
	margin-top:22px;
	padding-top:30px;
	padding-bottom:30px;
	padding-left: 40px;
	padding-right: 0px;
	background-color: #fff;
	display: block;
	overflow: auto;
}
#contact li {
	float: left;
	margin: 0 35px 0 0;
	padding: 0 35px 0 0;
	color: #4c4c4c;
	height: 55px;
}
.border {
	border-right: 1px solid #dbdbdb;
}
#contact h1 {
	font-weight: normal;
	padding: 0;
	margin: 0 0 8px;
	color:#fff;
	font-size: 30px;
	text-transform:uppercase;
}
#contact h2 {
	text-transform: uppercase;
	font-weight: normal;
	color: #000;
	font-size: 16px;
	margin-bottom: -7px;
	margin-top: 0;
	padding: 0;
}


#error h1 {
	font-size: 40px;
	text-transform: uppercase;
	color: #000;
	font-weight: normal;
	margin: 0 0 20px;
}

/*
//
Project Editorial
//
*/




#project_top_wrapper {
	width: 100%;
	margin-top: 93px;

}

#project_top {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	z-index: 999;
	height: 248px;
	background-position: right;
	background-repeat: no-repeat;
	/*background-image embedded as inline style */
	
}

#project_top #name {
width: 440px;
padding-top: 10px;
}


#project_top #name h1 {
font-size: 38px;
color: #000;
text-transform: uppercase;
margin: 0px 0 15px 0px;
padding: 0;
font-weight:bold;
line-height: 30px;
word-wrap: break-word;
}



#project_top #name h2 {
font-size: 18px;
color: #fff;
margin: 59px 0 5px 0;
padding: 0;
text-transform: uppercase;
font-weight: normal;
}

#project_top #hero {
display: block;
float: left;
width: 540px;
}


#project_bottom_wrapper {
width: 100%;
/*background-color: #656565;*/
background-color: #000;
margin-top:-3px;	
}

#project_bottom {
	padding-top: 30px;
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	z-index: 9999;
	position: relative;
}





#project_bottom #info h1 {
font-size: 38px;
color: #fff;
text-transform: uppercase;
margin: 0 0 -10px 0;
padding: 0;
font-weight: bold;
line-height: 30px;
word-wrap: break-word;
}

#project_bottom #info h2 {
font-size: 18px;
color: #b5dddf;
margin: 15px 0 6px 0;
padding: 0;
font-weight: normal;
}

#project_bottom #info p{
margin: 0;
padding: 0;
font-size: 12px;
color: #fff;
line-height: 18px;
}

#project_bottom #info ul {
margin-left: 0px;
padding-left:15px;
}

#project_bottom #info ul li {
color: #fff;
padding-bottom: 4px;
}

#project_bottom #project_art {
float: left;
width: 645px;
}


#pageWrapper {
  position: relative;
  width: 310px;
  margin-left: auto;
  margin-right: auto;
}





#project_bottom #info_wrapper { /* required to avoid jumping */
  left: 0px;
  top:0px;
  position: absolute;
  width: 310px;
}

#project_bottom #info {
  position: absolute;
  top: 40px;
  margin-top: 0px;
  padding-top: 0px;

}

#project_bottom #info.fixed {
  position: fixed;
  top: 130px;
    width:310px;

}


#project_bottom #info .tags a, #project_bottom #info .tags a:hover, #project_bottom #info .tags a:visited{
color: #b5dddf;
text-decoration: none;
}