/**
 *
 * MASHERY SUPPORT THEME
 *
 * If you are trying to create a custom theme, you are better off basing it off of http://mashery.com/public/Mashery/styles/community/mashery-blue.css
 *
 */
body {
  background: #fff;
  color: #666;
  font-family: Arial, Helvetica, sans-serif;
}

blockquote {
  margin: 15px;
  background: #E3E3CA;
  color: #555;
  padding: 10px;
  border: 0;
}

h1 {
  color: #A60004;
  font-size: 28px;
}

a,
a:link {
  color: #0071A6;
}

a:visited {
  color: #026492;
  border-bottom-color: #026492;
}

a:hover,
a:active {
  color: #003D5C;
  text-decoration: underline;
}

ul {
  list-style: square;
}

ul li {
  margin-left: 20px;
}

ol li {
  list-style-type: decimal;
  margin-left: 20px;
}

pre {
  font-size: 110%;
  margin: 15px 0;
  background-color: #fff;
  padding: 10px;
  line-height: 1.2;
}

td {
  padding: 5px;
}

table thead th {
  border-top: 1px solid #777;
  border-bottom: 1px solid #777;
  color: #666;
}

div#page,
div#header,
div#content,
div#local,
div#user,
div#user-menu,
div#footer {
  width: 960px;
}

div#page {
  background-color: #fff;
}

/** 
 *
 * HEADER
 *
 */
div#header {
  color: #fff;
}

div#branding-logo {
  background: transparent url(/public/Mashery/images/masherysupport/logo.gif) no-repeat top left;
  width: 90px;
  height: 72px;
  margin-left: 0;
}

div#branding-mashery {
  display: none;
}

div#search {
  display: block;
  top: 60px;
}

form#search-input input#search-box {
  width: 100px;
}

form#search-input input.search-botton {
  font-size: 11px;
}

div#search select {
  display: none;
}

/* END HEADER */
/**
 *
 * USER 
 *
 * User information and actions
 *
 */
/**
 *
 * USER NAV
 *
 * Login/Register and Status
 *
 */
div#user-nav li {
  border-left: 1px solid #999;
}

div#user-nav li.first {
  border-left: none;
}

div#user-nav a,
div#user-nav a:link,
div#user-nav a:visited {
  font-weight: bold;
}

/* END USER NAV */
/* END USER */
/**
 *
 * LOCAL NAV
 *
 * This is the main navigation bar. You can customize your links in the Settings page.
 *
 * The div#local appears AFTER the content for accessbility reasons. Please see
 * http: //www.contentwithstyle.co.uk/Articles/17/ for details.
 *
 * Because the navigation is placed below the content, you will most likely need
 * to use absolute positioning. Please make sure you understand positioning before
 * trying to customize it!
 *
 */
div#local {
  position: absolute;
  float: none;
  top: -40px;
  left: 140px;
  width: 820px;
}

div#local li {
  margin-right: 0;
}

div#local li a {
  color: #464646;
  border: 1px solid #d4d4d4;
  border-left: 0;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: .1em;
  padding-left: 30px;
  padding-right: 30px;
}

div#local li.first a {
  border-left: 1px solid #d4d4d4;
}

div#local a:hover {
  background: transparent url(/public/Mashery/images/masherysupport/local.gif) repeat-x 0 -32px;
  text-decoration: none;
}

div#local li.active a,
div#local li.active a:hover {
  color: #111;
  background: transparent url(/public/Mashery/images/masherysupport/local.gif) repeat-x 0 0;
}

/* END LOCAL NAV */
/**
 *
 * SUB LOCAL NAVIGATION
 *
 * Options for each page, sometimes these are user actions, in the dashboard they are sub-page navigation.
 *
 */
div#user-menu {
  width: 935px;
  top: 100px;
}

div#user-menu ul li,
div#content-header ul li {
  margin: 0 0 0 15px;
}

/* END SUB LOCAL NAV */
/**
 *
 * CONTENT 
 *
 * This is the content wrapper div, the actual content lives inside the main div.
 *
 */
div#content {
  overflow: visible;
  background: #fff url(/public/Mashery/images/masherysupport/content.gif) no-repeat 0 7px;
}

/* Old fashioned clearfix */
div#content:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/**
 *
 * MAIN 
 *
 * The main section is where the actual content lives.
 *
 */
div#page.no_sub div#main {
  width: 920px;
}

div#page.no_local div#main {
  margin-top: 40px;
}

div#main {
  margin-top: 30px;
  margin-left: 0;
  float: left;
  padding-top: 0;
  width: 670px;
}

div#main p {
  line-height: 1.7;
  word-spacing: .05em;
}

div#main form {
  margin: 10px 0;
}

div#main form fieldset legend {
  color: #343434;
  font-size: 100%;
  margin: 0;
  padding: 3px 5px;
  border: 1px solid #eee;
  background-color: #fefefe;
}

div#main div.comments ol.comments {
  list-style-type: decimal;
  margin: 10px 30px 20px;
}

div#main div.comments ol.comments li {
  font-weight: bold;
  font-size: 150%;
  padding: 5px;
  margin: 9px 0;
  border: 1px solid #999;
}

/* Docs have the lighter background already */
div#main div.comments ol.comments li div.comment-body {
  font-size: 70%;
  font-weight: normal;
  margin: 0 5px .5em;
}

div#main div.comments h3 {
  font-size: 110%;
}

div#main div#paging {
  margin: 15px 0;
}

/**
 *
 * SECTIONS
 *
 * The apps are split into sections. A blog has a section for each post, a wiki has a section for each page,
 * and a forum has a section for each post as well. Each section contains information about it (meta info)
 * and sometimes actions (edit).
 *
 */
div#main div.section h2 a,
div#main div.section h2 a:link,
div#main div.section h2 a:visited {
  color: #111;
  font-size: 90%;
}

div#main div.section h2 a:hover,
div#main div.section h2 a:active {
  color: #000;
}

div#main div.section-meta ul {
  list-style: none;
  color: #555;
}

.moniker {
  font-weight: bold;
}

/* SECTION MENU */
div#main div.section-menu {
  margin-left: 0;
}

div#main div.section-menu ul {
  margin: 10px 0;
}

div#main div.section-menu ul li a,
div#main div.section-menu ul li a:link {
  font-weight: bold;
}

/* END SECTION MENU */
/* TAGS */
div#main div.section div.section-tags h3 {
  color: #555;
}

div#main div.section div.section-tags ul li {
  display: inline;
  margin: 1px 0 0 5px;
  padding: 0;
}

/* END TAGS */
/* END SECTIONS */
/**
 *
 *  BLOG, WIKI, FORUM, and DOCS
 *  
 *  App specific rules. Since the different apps have some common rules, I made this section the place
 *  to combine all of them. In some cases, the apps are different merely to show how you can make each
 *  app look different from each other. This may not be the best way to style your own app, and you may
 *  want to consider making the layout more or less uniform for your different types of pages.
 *
 */
body#page-page div#sub ul li {
  list-style: disc;
  margin-left: 25px;
  margin-bottom: 0.8em;
}

/* BLOG */
body.page-blog div#main div.section-body p {
  margin-left: 0;
  line-height: 1.65;
}

body.page-blog div#main div.section-meta ul {
  font-size: 80%;
  margin-left: 0;
}

body.page-blog div#main div.section div.section-meta li.moniker {
  font-size: 120%;
}

/* END BLOG */
/* FORUM */
/* END FORUM */
/* END BLOG, WIKI, FORUM, and DOCS */
/* END MAIN */
/**
 *
 * SUB
 *
 */
div#sub {
  float: right;
  margin-top: 87px;
  width: 230px;
  margin-left: 0;
  margin-right: 0;
}

body#page-signup div#sub,
div#page.no_sub div#sub {
  display: none;
}

div#page.no_local div#sub {
  margin-top: 40px;
}

div#sub h2 {
  font-size: 130%;
  margin: 15px 10px;
}

div#sub h3 {
  font-size: 120%;
}

div#sub h4 {
  font-size: 100%;
}

div#sub h3,
div#sub h4,
div#sub h5,
div#sub h6 {
  margin-left: 10px;
  margin-right: 10px;
}

div#sub ul li {
  margin-left: 10px;
}

div#sub p {
  margin: 8px 10px;
}

div#sub a.active {
  color: #A60004;
  border: none;
  font-weight: bold;
}

/* END SUB */
/* END CONTENT */
/**
 *
 * FOOTER
 *
 * The siteinfo as well as the footer links.
 *
 */
div#footer {
  border-top: 1px solid #d4d4d4;
  margin-top: 40px;
  padding-top: 15px;
  color: #959595;
}

div#footer ul {
  margin: 0;
}

div#footer li {
  display: inline;
  float: left;
  font-size: 95%;
  line-height: 28px;
  margin: 0 10px 0 0;
}

div#footer a,
div#footer a:link,
div#footer a:visited {
  color: #636363;
}

div#footer a:hover,
div#footer a:active {
  color: #636363;
  text-decoration: underline;
}

/* SITEINFO */
div#siteinfo {
  padding: 0;
}

div#siteinfo p {
  font-size: 90%;
  color: #333;
  margin: 0;
  clear: both;
}

/* END SITEINFO */
/* END FOOTER */
/**
 *
 * MAIN NAV 
 *
 * Directly under the header, has three links.
 *
 * NOTE: This is only for the Mashery page, this is not intended for Vendor sites. The nav is also used for the login window.
 *
 */
body.login div#content:after {
  content: "";
  display: inline;
  height: 0;
  clear: none;
  visibility: hidden;
}

body.login div#content {
  overflow: hidden;
}

div#nav {
  background: #A60004;
}

div#nav h2 {
  text-transform: uppercase;
  color: #fff;
}

div#nav ul {
  margin-left: 7px;
}

div#nav ul li {
  margin: 11px 0 3px 8px;
  padding: 7px 9px 0 0;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 130%;
  font-family: Arial,Verdana,sans-serif;
  border-right: none;
}

body.login div#nav ul li {
  margin-top: 0;
  padding-top: 0;
}

div#nav a,
div#nav a:link,
div#nav a:active,
div#nav a:visited {
  color: #490103;
  padding: 0;
  font-weight: bold;
  background: none;
  text-decoration: none;
  border: 0;
}

div#nav ul li.active a:link,
div#nav ul li.active a:hover,
div#nav ul li.active a:visited,
div#nav ul li.active a:active {
  color: #fff;
}

div#nav ul li a:hover {
  text-decoration: none;
  color: #f00;
}

div#nav ul li a:active {
  color: #fff;
}

/* END MAIN NAV */
/* END MASHERY SUPPORT THEME */