/* =Elements
   ----------------------------------*/
	html { background:#0066FF; margin:0; padding:0; }
   body {  color:#FFF; font: 100%/100% TREBUCHET MS, verdana,arial; margin:0; padding:0; }
   
   a { color:#ffff00; text-decoration:none; text-decoration:underline;}
	a:hover { color:#fff; text-decoration:underline; }
	
	
	blockquote { color:#402020; font-style:italic; margin:15px 0; }
	cite { color:#1a1a1a; font-style:normal; }
	
	dl { margin:0; }
	dt { color:#ffff00; font-weight:bold; font-variant:small-caps; }
	dd { margin:0 0 10px; }
	
	fieldset {  border:none; height:320px;}
	fieldset dt { width:100px; float:left; }
   
	h1,h2,h3,h4 { color:#000; font: 1.4em TREBUCHET MS, verdana,arial; }
	h1 { float:left; background:url(../images/logo.jpg) no-repeat; width: 176px; height: 49px; position: relative; top: -14px; left: 20px;border:0; text-indent:-99999px; overflow:hidden; }
	h2,h3,h4 { margin:40px 0 20px; }
	
	hr { background:url(../images/hr.gif) no-repeat; border:0; height:19px; }
	
	img { border:none; }
	
	ul.lista  { list-style:none; }
	ul.lista  li { background:url(../images/bullet.gif) no-repeat 0 0.5em; list-style:none; margin-left:-20px ;  padding: 5px 0 5px 25px; }
	
   p { margin:15px 0; }
	
/* =Layout
   ----------------------------------*/
   #outer { width: 815px; margin:0 auto;}
   #topbanner { background:url(../images/header.png) no-repeat; width: 830px; height: 70px; margin:0 auto; position: fixed; z-index: 10;}
   #container { background:url(../images/bg.jpg) no-repeat; font-size:.9em; line-height:1.5em; width:815px; margin:0 0 0 12px; padding:80px 0 0; position: relative; top:0;}
   #header { margin:0 0 10px; padding-top: 20px; height: 200px;clear:both; }
    #about, #contact { margin:0 0 10px; padding-top: 30px;clear:both; }
  #recent-work { margin:50px 0 10px; padding-top: 30px;clear:both; }
   .left-div { background:url(../images/vertical_rule1.gif) no-repeat top right; width:525px; float:left; padding-right:20px; }
	.right-div { width:260px; float:right; }
	#footer {  width:100%; margin: 0 0 60px; padding:0 0 20px; }

/* =Menu
   ----------------------------------*/
	#menu {float:left; position: relative; top: 16px; left: 400px;}
	#menu ul {  height:29px; margin:0 auto; padding: 0; list-style-type: none;}
	#menu ul {  background-image: none ; margin:0 ; padding: 0; list-style-type: none;}
	#menu li {float: left; display: inline;}
	#menu a {float: left; display: inline; text-decoration: none;}
	#menu span{display:none;}
	#menu a.work {width: 68px; height: 29px; background:url(../images/menu.jpg) -239px 0px no-repeat;}
	#menu a.work:hover {background:url(../images/menu.jpg) 0px 0px no-repeat;}
	#menu a.about {width: 68px; height: 29px; background:url(../images/menu.jpg) -316px 0px no-repeat;}
	#menu a.about:hover {background:url(../images/menu.jpg) -77px 0px no-repeat;}
	#menu a.contact {width: 85px; height: 29px; background:url(../images/menu.jpg) -393px 0px no-repeat;}
	#menu a.contact:hover {background:url(../images/menu.jpg) -154px 0px no-repeat;}

	
/* =Header
   ----------------------------------*/
   .welcome { color:#402020; font-size:1.5em; font-style:italic; line-height:1.5em; margin-bottom:30px; }
	.left { width:460px; float:left; }
	.right { width:140px; height :80px;float:right; margin-right: 45px; text-indent: -9000em;}
	.right a { display: block; width:140px; height:80px;}
   
/* =Recent Work
   ----------------------------------*/
	.work img { background: #fff; border:1px solid #ccc; margin-bottom:10px; padding:4px; float:left; }
	.work-details { background:url(../images/vertical_rule.gif) repeat-y left; width:230px; height: 264px; margin-left:30px; padding-left:29px; float:left;}
	.work-details h3 { margin-top:0; }
	.work-details dl {width: 210px;}
	.small-thumbs { clear:both; }
	.small-thumbs img { border:1px solid #a65353; margin:5px 10px 10px 0; }
	.workh2 {  background:url(../images/workbg.gif) no-repeat; width: 127px; height: 37px; position: relative; top: 0px; left:0px;border:0; text-indent:-99999px; overflow:hidden; }
	.abouth2 {  background:url(../images/about.gif) no-repeat; width: 127px; height: 37px; position: relative; top: 0px; left:0px;border:0; text-indent:-99999px; overflow:hidden; }
	.contacth2 { background:url(../images/contact.gif) no-repeat; width: 127px; height: 37px; position: relative; top: 0px; left:0px;border:0; text-indent:-99999px; overflow:hidden; }
	/* =Coda Slider
		----------------------------------*/
		.stripViewer .panelContainer .panel ul { text-align: left; margin:0; }
			
		.slider-wrap { 
		/* This div isn't entirely necessary but good for getting the side arrows vertically centered */
		margin:0; position: relative; width: 100%; }
	
		/* These 2 lines specify style applied while slider is loading */
		.csw { width: 100%; height: 350px; overflow:auto; }
		.csw .loading {margin: 200px 0 300px 0; text-align: center}
	
		.stripViewer { 
		/* This is the viewing window */
		position:relative; overflow:hidden; 
		/* this is the border. should have the same value for the links */
		margin:auto; width:760px; /* Also specified in  .stripViewer .panelContainer .panel  below */
		height:350px; clear:both; }
			
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
		position:relative; left:0; top:0; width:100%; list-style-type:none;
		/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */ }
			
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
		float:left; height: 100%; position:relative; width:760px; /* Also specified in  .stripViewer  above */ }
			
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
		padding:0; }
		
		.wrapper { margin-left:15px; }
			
		.stripNavL , .stripNavR{ /* The left and right arrows */ position: absolute; top: 140px; text-indent: -9000em;  outline: none;}
		
		.stripNavL a, .stripNavR a { display: block; width:40px; height:40px; outline: none;}
			
		.stripNavL { left: -10px; }
		.stripNavR { right: 0; }
			
		.stripNavL { background: url("../images/arrow_left.gif") no-repeat center; }	
		.stripNavR { background: url("../images/arrow_right.gif") no-repeat center; }
	
/* =About
   ----------------------------------*/
	.author-pic {background: #fff; border:1px solid #ccc; margin:10px 15px 15px 15px; padding:5px; float:left; }
	
/* =Contact
   ----------------------------------*/
	/* Form */
	fieldset { border:none; height:320px; margin:0 0 20px; padding:10px 0 0 10px; }
	fieldset dt { width:100px; float:left; }
	fieldset input { background-color:#fff; border:1px solid #CCC; }
	fieldset textarea { background-color:#fff; border:1px solid #CCC; }
	.button-replace { background:url(../images/send.gif) no-repeat; border:0; text-indent:-99999px; overflow:hidden; cursor: pointer; width:77px; height:45px; margin:0 0 0 99px; padding:85px 0 0; }
	
/* =Footer
   ----------------------------------*/
	.footer-text { font-size:.8em; width:815px; margin:0 auto; text-align: center; }
	
/* =Misc
   ----------------------------------*/
	.backtotop { clear:both; }
	.right-div h3 { margin-top:0; }
	
	label { display:block; }
	input.text,textarea { width:300px;font:12px/12px 'courier new',courier,monospace;color:#333;padding:3px;margin:1px 0;border:1px solid #ccc; }
	input.submit { padding:2px 5px;font:bold 12px/12px verdana,arial,sans-serif; }