*{
	/* Universal reset: */
	margin:0;
	padding:0;
}

body{
	
	color:#000;
	font-family:Arial, Helvetica, sans-serif;
	
}


/*logo*/


      
#index .logo{background: url(../images/susumilogo_bl.png) no-repeat transparent;
      width:265px;height:124px;margin-bottom:6px;text-indent:-999px;}

#profile .logo{background: url(../images/susumilogo_bl.png) no-repeat transparent;
      width:265px;height:124px;margin-bottom:6px;text-indent:-999px;}      
      
#contact .logo{background: url(../images/susumilogo_bl.png) no-repeat transparent;
     padding-left:100px; width:165px;height:124px;margin-bottom:6px;text-indent:-999px;
		}

/* typography: */

        h1,h2,h3{
	font-family: Helvetica,Arial,Sans-Serif;
	padding-left:10px;
	}

	h1{
	font-size: 1.25em;
	}
	
	h2{margin-top:10px;
        margin-bottom:10px;
	font-size: 95%;
	color:#000;
	text-decoration:none;
	outline:none;
	padding: 3px 2px 2px 4px;
	background-color: #000000;
	color: #ffffff;
	}

	h3{
	font-size:85%;
	color:#000;
	text-decoration:none;
	outline:none;
	padding: 3px 2px 2px 4px;
	background-color: #000000;
	margin: 0px;
	color: #ffffff;
	}
	
	p{
	font-size:0.825em;
	padding-top:5px;
	padding-bottom:5px;
	margin-left:10px;
	margin-right:10px;
	display:block;
	background-color:#fff;
	}
	
	


	
	
	a,a:link, a:visited {
	color:#000;
	text-decoration:none;
	outline:none;
	}
	

	a:hover{
		text-decoration:underline;
	}
	
	
	
	/*container */
	#container {
	margin:0 auto;
	padding:0;
	width:1020px;
        border:10px solid white;
	}
	
	
	#index {background: url("../images/backdrop.png")  repeat top;}
	#profile  {background: url("../images/backdrop.png")  repeat top;}
	#contact {background: url("../images/backdrop.png")  repeat top;}
	
	
	#index #container {background: url("../images/cky.jpg") #fff top right no-repeat;}
	#profile #container {background: url("../images/cky.jpg") #fff no-repeat;}
	#contact #container {background: url("../images/ckyny.jpg") #fff 50% 0% no-repeat;}
	
	#contact #container #nav {background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}
	#profile #container #nav {background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}
        #index #container #nav {background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}

/*nav*/

	#nav {margin:0;padding:0;height:50px;position:relative;width:42%;
		padding-left:36px;background-color:#fff;line-height:50px;}
		

		#nav ul{
		margin:0;
		padding:0;
		}
				
		#nav li{ 
			list-style-type:none;
		         display:block;
				 float:left;
				 padding-right:15px;
			height:28px;
				 }
		#nav a {
	
	color:#000;
	text-decoration:none;
	outline:none;
	padding: 3px 2px 2px 4px;
	background-color: #000000;
	margin: 0px;
	font-size:115%;
	color: #ffffff;
	}
	
	
	#nav a:hover{
		color:#000;
		text-decoration:none;
		padding: 3px 2px 2px 4px;
		background-color: #fff;
	}
	
	#nav #active {color:#000;
	font-weight:bold;
	text-decoration:none;
	background-color: #fff;
	}
	
	
/*content structure*/
#content {
	margin-top:20px;
	margin-bottom:22px;
	/*min-height:730px;*/
		}
		#index #content {min-height:200px;overflow:hidden;}	
#profile #content {clear:both;min-height:200px;overflow:hidden;margin-left:36px;margin-right:36px;}
#contact #content {margin-left:36px;margin-right:36px;min-height:200px;overflow:hidden;}			
		
	
.col_a{float:left;width:546px;padding-left:36px;margin-right:60px;
display:block;}
.col_b{float:left;width:300px;padding-right:36px;float:left;
       display:block;}	

.content_full{padding-left:36px;padding-right:36px;background-color:#fff;}
#contact .content_full{ background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}
       
/*content boxes*/       
.twocolbox{/*background:url("../images/whitebg.png") repeat scroll 0 0 transparent;*/
	background-color:#fff;
	margin-top:10px;
	width:100%;
	height:auto;
overflow:auto;min-height:50px;
	}

.twocolbox .left{float:left;width:350px;padding:10px;}
.twocolbox .right{float:left;width:160px;
height:130px;margin-top:10px;}

#contact .twocolbox {padding:10px;width:700px;
height:auto;
overflow:auto;min-height:50px;
/*background:url("../images/whitebg.png") repeat scroll 0 0 transparent;*/}
#contact .twocolbox .left {width:600px;}
#contact .twocolbox .right {}

#profile .twocolbox {clear:both;padding:10px;height:auto;
overflow:auto;min-height:50px;width:910px;
/*background:url("../images/whitebg.png") repeat scroll 0 0 transparent;*/}

.recentwork {width:310px;height:120px;background-color:#fff;margin-top:60px;padding:10px;
/*background:url("../images/whitebg.png") repeat scroll 0 0 transparent;*/}

.recentwork ul {}
.recentwork ul li {list-style-type:none;margin:0;padding:0;float:left;margin-left: 5px;margin-right: 5px;}
.recentwork div img {height:90px;width:90px;border:1px solid #F2EBFF;margin-top:5px;}

.twitterbox{width:310px;background-color:#fff;padding:10px;margin-top:40px;
background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}


.plaincontentbox{margin-top:20px;float:left;display:block;
background:#fff;width:100%;padding-bottom:40px;
background:url("../images/whitebg.png") repeat scroll 0 0 transparent;}

	
/*footer*/

	#footer {clear:both;display:block;
	       margin-top:50px;
		padding-top:10px;padding-bottom:10px;
                    background-color:#fff;
		    height:40px;
		padding-left:36px;
		}

		#footer a, #footer a:link {color:#fb0183;font-size:100%;font-weight:bold;background-color:#000;padding-top:2px;padding-bottom:2px;padding-left:2px;padding-right:2px;}
		
		#footer a:hover {color:#000;font-size:100%;font-weight:bold;background-color:#fb0183;padding-top:2px;padding-bottom:2px;padding-left:2px;padding-right:2px;}
		
		#footer p{color:#fb0183;font-weight:bold;}

	/*hacks*/
	
       .clear:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}


/*twitter tweeting*/

small {font-style:italic; color:#000; font-weight:bold;display:block;}


#tweets ul li{height:100%;margin-top:5px;margin-bottom:5px;
background-color:#fff;
}

#tweets li {
	display:block;
	font-size:0.825em;
	background:url(images/twitter.png) no-repeat left ;	
	margin-top:8px;
	margin-bottom:8px;
	padding:10px;
	list-style-type:none;
	height:17px;
}



#tweets a, #tweets a:link {display:block;width:150px; line-height:130%;
	text-decoration:none; 
	padding: 3px 2px 2px 4px;
	background-color: #000000;
	margin: 0px;
	color: #ffffff;}
#tweets a:active { text-decoration:none; color:#fff;}
#tweets a:hover { text-decoration:underline; color:#fff;}
#tweets a:visited { text-decoration:none; color:#fff;}

/*resiting of skype*/
.question{float:right;width:420px;margin-left:20px;}


.question, .form {margin-bottom:20px;}
/* Contact form  */


.form {width:500px;background:#fff;float:left;}
p.required{float:right;}
form{clear:both;}

.commentform fieldset {border:0px;}

.commentform em, p.required em {color: red;}

legend{margin-top:10px;
        margin-bottom:10px;
	font-size: 95%;
	color:#000;
	text-decoration:none;
	outline:none;
	padding: 3px 2px 2px 4px;
	background-color: #000000;
color: #ffffff;}

label
{border:1px solid black;
width:8em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block
}
label.error { float: none; color: red; 
padding-left: .5em; vertical-align: top;display:block;}



.commentform p { clear: both;
background-color:transparent;}
.submit { margin-left: 9.3em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }

.submit input
{margin:0;
color: #000;
background: #ffa20f;
border: 2px outset #d7b9c9;
width: 100px;
} 


input, textarea {margin-left:1em;float:left;width:300px;} 
textarea{
height:100px;
}