style.css

<style type='text/css'>
body { 
  font-size: 16px; 
  margin-left: 0px; 
  background: #EFFAFE url('http://l.yimg.com/a/i/us/pps/yql_blue_grad.jpg') repeat-x bottom;
  background: #EFFAFE url('http://l.yimg.com/a/i/us/pps/yql_blue_grad.jpg') repeat-y bottom;
}
#main{
  height: 900px;
  width: 1200px;
  margin-left: 15%;
}
#topDropMaxCont {
  background: url('http://l.yimg.com/a/i/ydn/header-shadow-bkg.gif') repeat-x;
  height: 1.5em;
  margin-bottom: 2em;
  width: 84.5%;
  width: 1011.8px;
}
#topDropContainer {
  margin-left: 0px;
  width: 74.8em;
  width: 1010px;
}
#topDropIntCont {
  text-align: left;
}
#breadcrumbs {
  font-size: 80%;
  height: 1.0em;
  margin-left: 0;
  padding-top: 6px;
  padding-bottom: 6px;
  position: absolute;
  text-decoration: none;
  top: 3.2em;
  width: 1010px;
  text-indent: 2px;
  clear: left;
  background-color: white;
  border-left: 1px solid #999; 
  border-right: 1px solid #999; 
}
#breadcrumbs a {
  color: #2288bb;
  text-decoration: none;
}
#breadcrumbs a:hover {
  float: left;
  height: 2em;
  text-decoration: underline;
}
.bcSep {
  float:left;
  width:1.5em;
  height:1.5em;
  background:url('http://l.yimg.com/a/i/ydn/bcsep.gif') no-repeat top left;
  position:relative;
  bottom:3px;
  margin-right:.5em;
}
.bcString {
  float:left; 
  margin-right: 0.5em; 
}
#breadcrumbs a.bcOn {
    color: #888;
}
hr { width: 75%; margin-left: 0; }
h2 { font-size: 24px; }
h2,h3 { color: purple; }
h4 { color: #000030; font-size: 16px;}
h4 a { text-decoration: none; }
h4 a, b a { text-decoration: none; font-size: 16px; color: #000030; }
li { margin-left: -10px; }
pre {
  white-space: pre-wrap; /* css-3 */
  white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
  white-space: -pre-wrap; /* Opera 4-6 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* Internet Explorer 5.5+ */
  font-size: 12px;
  font-family: monospace;
}
#about, #singleton, #about_api_explorer{ 
  font-size: 18px; 
  color: #333366; 
  padding: 10px;
  font-family: Times; 
  background-color: white; 
  border: 1px solid #999; 
  margin-top: 0%; 
  padding-bottom: 5px; 
  height: 400px;
  overflow: auto;
}
#about_api_explorer p{
  margin-bottom: 0px;
  padding-top: 10px;
}
#about h3 { 
  font-size: 24px; 
  color: #000030; 
  margin-top: -.05%; 
  font-family: Arial; 
}
#about h4 { 
  font-size: 20px; 
  color: #623D71; 
  border-bottom: 1px solid #999; 
  font-family: Arial; 
}
#about_api_explorer b{
  font-weight: 700;
  font-size: 95%;
} 
#about_api_explorer h4 {
  font-size: 20px; 
  border-bottom: 1px solid #999; 
  font-family: Arial; 
}
#about_api_explorer li{
 padding-bottom: 15px;
 list-style-type: none;
 margin-left: 3px;
}
#about_api_explorer ol { 
  margin-left: 0%;
  padding-left: 10px;
}
#about_api_explorer ol h5 {
  font-size: 18px; 
  color: #623D71; 
  margin-top: -.05%; 
  padding-bottom: 4px;
  font-family: Arial; 
}
#about .padding { padding-top: 8px; }
#about code { 
  font-size: 90%; 
  font-family: Courier, "Courier New", "Andale Mono",monospace; 
}
#about_api_explorer code{
  font-size: 90%; 
  font-family: Courier, "Courier New", "Andale Mono",monospace; 
}
#about code.uri { color: #303030; }
#about border{ bottom-padding: 2px; }
#about p li { font-family: Times; }

#singleton h3 { 
  font-size: 24px; 
  color: #000030; 
  margin-top: -.05%; 
}
#singleton li { 
  font-size: 15px; 
  margin-left: 10px; 
  padding-top: 2px; 
  padding-bottom: 2px; 
}

#results { 
  width: 84.3%; 
  height: 200px;
}
#results pre { 
  font-size: 90%; 
  font-family: Courier, "Courier New", "Andale Mono", monspace; 
}
input { 
  background-color: #eeeeee; 
  margin-bottom: 10px; 
}
.submit_button {
  background: #325281 url('http://l.yimg.com/a/i/us/pps/yql_blue_button.jpg') repeat-x scroll 0 0;
  color: #fff;
  font-weight: bold;
  padding: 1px;
}
#api_container{
  margin-top: -25.2px;
}
#api_container a:hover{
 text-decoration: underline;
}
#profiles{ 
  float: left; 
  padding-top: 5px; 
  text-indent: 4px; 
  border: 1px solid #999; 
  height: 27%; 
  background-color: white;
}
#contacts{ 
  float: left; 
  padding-top: 5px; 
  text-indent: 4px; 
  border: 1px solid #999; 
  height: 27%; 
  background-color: white;
}
#connections{ 
  float: left; 
  padding-top: 5px; 
  text-indent: 4px; 
  border: 1px solid #999; 
  height: 27%; 
  background-color: white;
}
#status{ 
  float: left; 
  padding-top: 5px; 
  text-indent: 4px; 
  border: 1px solid #999; 
  height: 27%; 
  background-color: white;
}
#updates{ 
  float: left; 
  padding-top: 5px; 
  text-indent: 4px; 
  border: 1px solid #999; 
  height: 27%; 
  background-color: white;
}
#profiles a { color:#1671AA; }
#contacts a { color:#1671AA; }
#connections a { color:#1671AA; }
#status a { color:#1671AA; }
#updates a { color:#1671AA; }

#profiles h4 a { color: #000030; font-size: 18px;}
#contacts h4 a { color: #000030; font-size: 18px;}
#connections h4 a { color: #000030; font-size: 18px;}
#status h4 a { color: #000030; font-size: 18px;}
#updates h4 a { color: #000030; font-size: 18px;}

#profiles { width: 16%; }
#status { width: 10%; }
#contacts { width: 18.5%; }
#connections { width: 19%; }
#updates { width: 20%; }
textarea { 
  border: 1px groove black; 
  background-color: #CCCCCC; 
  font-size: 14px; 
}
#response_header {
  float: right; 
  margin-right: 25%; 
  width: 35%; 
}
#request_header { 
  float: left; 
  clear: left; 
  margin-left: 0px; 
  width: 40%; 
} 
#xml,#json,#request,#response { 
  background-color: white; 
  border: 1px solid #999; 
  padding: 10px;
  height: 400px;
  overflow: auto;
}
#xml_response, #json_response { 
  display: block; 
  clear: left; 
  padding-top: 5px; 
  clear: right; 
  display: none; 
}
.explorer_heading { 
   background: #156ea8 url('http://l.yimg.com/a/i/us/pps/yap-header-bkg-lg.jpg') repeat-x top left;
   margin-top: -1%; 
   width: 83.5%; 
   padding: 5px; 
   color: white; 
  letter-spacing: .15em;
}
p.explorer_heading { 
  margin-top: -50px;
  font-size: 11px;
  font-family: Ariel, Verdana;
  margin-bottom: 0px;
  letter-spacing: 0em;
}
#enter_api {
  margin-top: 15.5%; 
  height: 10%; 
  clear: left; 
  background-color: white; 
  border: 1px solid #999;
  text-indent: 5px;
  width: 84.1%;
  padding-top: 10px;
}
#enter_api a:hover {
 text-decoration: underline;
}
.about_explorer{
  margin-top: -4%; 
  font-size: 12px; 
  padding-right: 10px;
  color:#1671AA; 
}
a.about_explorer{
  color:#1671AA; 
}
p.enter_api{
 margin-top: -5px;
}
#enter_api input { 
  font-size: 13px;
}
#intro, #code {
  display: inline;
  float: left;
}
#intro {
  color: blue;
  font-size: 115%%;
  padding-left: 32px;
  padding-right: 23px;
  padding-bottom: 10px;
  width: 650px;
  background-color: #CCCCCC;
  border: 2px dashed blue; 
}
#intro h1 {
  background-position: bottom;
  background-repeat: repeat-x;
  color: white;
  font-size: 240%;
  margin: 0;
  margin-bottom: .5em;
  padding: 0;
  padding-top: 4px;
  padding-bottom: 4px;
}
#intro p {
  line-height: 150%;
  margin-top: 0;
  margin-bottom: 1em;
}
.link {
  color:#1671AA; 
}
</style>