/*-- ruzoo stylesheet v1 --*/

html, body
{
  background:       #202020 url('../images/background.jpg') repeat-x;
  color:            #9e9e9e;
  font-family:      Arial, "Times New Roman", sans-serif;
  font-size:        12px;
  margin:           0;
  padding:          0;
  text-align:       center;
}

* { text-align: left; }
img { border: 0; }
a { color: #BFE2F5; cursor: pointer; }
fieldset { border: 1px solid #c7c7c7; padding: 20px; }
fieldset  legend { color: #a44532; font-size: 18px; font-weight: bold; }
.clear { clear: both; }

div#ruzoo
{
  margin:           0 auto;
  width:            1040px;
}

div#topbar
{
  height: 30px;
  background: #292728 url('../images/top_bar.jpg') repeat-x;
  padding: 9px 16px;
}

div#topbar a:link, div#topbar a:active, div#topbar a:visited
{
	text-decoration: none;
}

div#topbar a:hover
{
	text-decoration: underline;
}

div#topbar .left
{
	float: left;
	width: 25%;
	margin: 8px auto;
}

div#topbar .right
{
	float: right;
	width: 25%;
	text-align: right;
}

div#header
{
  height:           100px;
  width:            100%;
}

div#headerLeft
{
  float:            left;
  height:           100%;
  text-align:       center;
  width:            440px;
}

div#headerLeft img { margin-top: 40px; }

div#headerRight
{
  float:            left;
  height:           100%;
  width:            600px;
}

ul#navigation
{
  list-style:       none;
  margin:           0;
  margin-left:      130px;
  margin-top:       50px;
  padding:          0;
}

ul#navigation li
{
  background:       url('../images/nav_divider.png') repeat-y top right;
  color:            #fff;
  float:            left;
  font-size:        14px;
  padding:          0px 10px;
}

ul#navigation li.no-bg { background: none; }

ul#navigation li a
{
  color:            #fff;
  text-decoration:  none;
}

ul#navigation li a:hover { text-decoration: underline; }

div#main
{
  background:       url('../images/main_bg.png') no-repeat;
  clear:            both;
  height:           312px;
  width:            100%;
}

div#mainText
{
  padding-left:     330px;
  padding-top:      90px;
}

div#mainText p
{
  background:       url('../images/main_text_bg.png') repeat;
  color:            #fff;
  height:           32px;
  line-height:      32px;
  margin:           0;
  margin-top:       4px;
  padding:          0px 8px;
  vertical-align:   middle;
  width:            245px;
}

div#slideshow
{
  padding-left:     656px;
  padding-top:      32px;
}

div#mainContent
{
  background:       url('../images/main_content_bg.jpg') no-repeat;
  height:           170px;
  margin-left:      22px;
  width:            982px;
}

div#mainContent h1 { color: #2a2a2a; font-size: 16px; margin-top: 0px; }

div#mainContent a { color: red; cursor: crosshair; }

div#container { width: 100%; }

div#graphicDesign
{
  color:            #666;
  float:            left;
  font-size:        10px;
  height:           160px;
  line-height:      18px;
  margin-left:      25px;
  width:            500px;
}

div#graphicDesign img { float: left; margin-right: 5px; }

div#clientFile
{
  color:            #666;
  float:            left;
  font-size:        10px;
  height:           160px;
  line-height:      18px;
  margin-left:      25px;
  width:            280px;
}

div#clientFile input.clientInput { border: 1px solid #d4d4d4; color: #878787; font-family: Arial, "Times New Roman", sans-serif; font-size: 12px; padding: 6px; width: 200px; }

div#webDevelopment
{
  color:            #666;
  float:            left;
  font-size:        10px;
  height:           160px;
  line-height:      18px;
  margin-left:      25px;
  width:            430px;
}

div#webDevelopment img { float: left; margin-right: 5px; }

div#contact
{
  background:       #2b2b2b;
  border:           5px solid #242424;
  height:           245px;
  margin-left:      22px;
  margin-top:       5px;
  width:            972px;
}

div#contactContainer
{
  background:       url('../images/contact_divider.jpg') no-repeat top right;
  float:            left;
  height:           225px;
  padding:          10px;
  width:            630px;
}

div#contactContainer h1
{
  color:            #bfe2f5;
  font-size:        20px;
  margin:           0;
  padding-left:     7px;
}

table#contactForm { margin-top: 10px; }

table#contactForm tr
{
  height:           30px;
}

table#contactForm tr td input.field
{
  background:       #363636;
  border:           0;
  color:            #a3a3a3;
  height:           14px;
  padding:          8px;
  vertical-align:   middle;
  width:            215px;
}

table#contactForm tr td.left { width: 215px; }
table#contactForm tr td.right { text-align: right; }

table#contactForm textarea
{
  background:       #363636;
  border:           0;
  color:            #a3a3a3;
  font-family:      Arial, Verdana, sans-serif;
  font-size:        12px;
  height:           108px;
  padding:          4px;
  width:            367px;
}

div.clientsSay
{
  float:            left;
  height:           225px;
  margin-left:      3px;
  padding:          10px;
  width:            290px;
  position:relative; 
  left: 12px;
}

div.clientsSay h1
{
  color:            #bfe2f5;
  font-size:        20px;
  margin:           0;
  padding:          0;
}

div.clientsSay p
{
  color:            #9e9e9e;
  height:           140px;
  line-height:      20px;
}

div.clientsSay p.quotee
{
  color:            #fff;
  height:           auto;
  text-align:       right;
  width:            280px;
} 

div#footer
{
  height:           50px;
  width:            100%;
}

div#footer ul { list-style: none; margin: 12px 24px; padding: 0; }
div#footer ul li#twitter { float: left; width: 200px; }
div#footer ul li#copyright { color: #686868; float: left; font-size: 11px; height: 30px; line-height: 30px; text-align: center; vertical-align: middle; width: 572px; }
div#footer ul li#copyright a { color: #686868; text-decoration: none; }
div#footer ul li#copyright a:hover { text-decoration: underline; }
div#footer ul li#creditCards { float: left; text-align: right; width: 200px; }


/*-- portfolio --*/
div#portfolioContainer { background: #fff; margin-left: 22px; width: 982px; }
table.portfolioTable td { background: #e2e2e2; vertical-align: top; }
table.portfolioTable td h1 { padding-left: 2px; color: #a44532; font-size: 18px; font-weight: bold; margin: 0; padding: 4px; }
table.portfolioTable td h1 a { padding-left: 2px; color: #a44532; font-size: 18px; font-weight: bold; text-decoration: none; }
table.portfolioTable td h1 a:hover { padding-left: 2px; color: #373838; }
table.portfolioTable td img { cursor: pointer; }
table.portfolioTable td p { color: #4f4f4f; line-height: 24px; padding: 4px; margin-top: 0px; }
div.portfolioBorder { background: url('../images/portfolio_bg.jpg') no-repeat; height: 195px; padding: 12px; width: 297px; }
div.portfolioScreenShot { height: 193px; width: 296px; }
p.portfolioDivider { background: url('../images/portfolio_div.jpg') no-repeat; height: 1px; margin: 5px 0px; padding: 0; width: 100%; }

/*-- case study --*/
div#caseStudy { background: #fff url('../images/casestudy_bg.jpg') no-repeat; margin-left: 22px; padding-bottom: 2px; width: 982px; }
div#caseStudyLeft { float: left; width: 686px; }
div#caseStudyRight { float: left; width: 296px; }
div#caseStudyImage { background: url('../images/casestudy_img.png') no-repeat; height: 460px; width: 689px; }
div#caseStudyImage img { margin-top: 19px; margin-left: 13px; }
div#caseStudyRight h1 { color: #a44532; font-size: 16px; margin-bottom: 0px; }
div#caseStudyRight h1 a { color: #a44532; font-size: 16px; margin-bottom: 0px; }
div#caseStudyRight h2 { color: #a44532; font-size: 14px; }
div#caseStudyRight h3 { color: #b0b0b0; font-size: 12px; margin-top: 0px; }
div#caseStudyRight p { color: #616161; line-height: 18px; }
div#caseStudyInfo { margin-right: 5px; padding: 7px; }
div#caseStudyInfo ul { list-style-image: url('../images/bullet_go.png'); padding-left: 24px; }

/*-- contact --*/
div#contactLarge { background: #fff url('../images/casestudy_bg.jpg') no-repeat; margin-left: 22px; padding-bottom: 2px; width: 982px; }
div#contactLarge h1 { color: #4b4b4b; font-size: 24px; margin: 0; text-align: center; width: 100%; }
div.contactFloat { float: left; padding: 25px; width: 441px; }
div.contactFloat input.contactInput { background: #ebf2f5; border: 1px solid #ccdde6; color: #5f6163; font-size: 13px; padding: 12px; width: 370px; }
div.contactFloat select { background: #ebf2f5; border: 1px solid #ccdde6; color: #5f6163; font-size: 13px; padding: 12px; width: 350px; }
div.contactFloat textarea { background: #ebf2f5; border: 1px solid #ccdde6; color: #5f6163; font-family: Arial, "Times New Roman", sans-serif; font-size: 12px; height: 150px; padding: 12px; width: 370px; }
p.submit { text-align: right; width: 100%; }

/*-- footer --*/
#clienth1{color: #bfe2f5;font-size: 20px;margin: 0;padding: 0;margin-top: 10px;position:relative;left:12px;}

/*-- about --*/
.about-p {color: #696969;line-height: 24px;}
.nopadding {color: #696969;line-height: 24px;margin:0;padding:0;}
.topbox {margin-left: 20px; margin-right: 20px;}
.middlebox {margin-left: 20px; margin-right: 20px; margin-top:10px; margin-bottom: 10px;}
.bottombox {margin-left: 20px; margin-right: 20px;margin-bottom:10px;}