/**
 * =Basics
 */
html, body { 
  margin:					      0; 
  padding:					    0; 
}
body {
  background-color:     #fff;
  font-size:					  120%;
  font-family:				  "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color:						    #222;
  min-width:					  600px;
  max-width:            45em;
}
img, a img {
  border:               0;
}
a {
  color:                #348DED;  
}
a:link:visited {
  color:                #9CC3ED;
}
a:link:hover {
  color:                #FF8618;  
}
a:link:active:hover {
  color:                #fc0;  
}


/**
 * =Opening
 */
 
#opening {
  margin:               0;
  margin-top:           0.7em;
  padding:              0;
}
 

/**
 * =Navigation
 */
 
#navigation {
  font-size:            0.8em;
  background-color:     #DEF;
  padding:              0.7em 0 0.7em 6em;
  _padding:             0.8em 0 0.8em 6em; /* Fix IE */
  margin:               0;
  line-height:          1.0em;
}
#navigation ul {
  list-style:           none;
  margin:					      0 0 0 -0.7em; 
  padding:					    0; 
}
#navigation ul li {
  display:              inline;
  padding:              0;
  margin:               0 1em 0 0;
}
#navigation ul li.current a:link, #navigation ul li.current a:visited {
  color:                #348DED;  
  border-color:         #fff;
  background-color:     #fff;  
}
#navigation ul li a:link, #navigation ul li a:visited {
  color:                #9CC3ED;
  padding:              0.7em 0;
  border-left:          0.7em solid #def;
  border-right:         0.7em solid #def;
  -moz-border-radius:   0.5em;
  text-decoration:      none;
}
#navigation ul li a:hover {
  color:                #f0f;  
  border-color:         #fff;
  background-color:     #fff;  
  text-decoration:      underline;
}


/**
 * =Content
 */
 
#content {
  margin-top:           3em;
  line-height:          125%;
}
/** =current path **/
#content #current-path {
  padding:              0;
  margin:               0;
  font-size:            0.6em;
  margin-top:           -7em;
  list-style:           none;
  position:             absolute;
}
#content #current-path li {
  padding:              0;
  margin:               0;
  display:              inline;
}
#content #current-path li a {
  text-decoration:      none;
  color:                #789;
}
#content #current-path li a:hover {
  text-decoration:      underline;
  color:                #888;
}
#content .wrapping-container {
  max-width:            24em;
}
#content h1.intro {
  font-weight:          normal;
  font-size:            1.4em;
  font-family:          "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color:                #348DED;
  line-height:          1.2em;
}
#content h1.page-title {
  font-weight:          normal;
  font-size:            1.4em;
  font-family:          "Helvetica Neue Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height:          1.8em;  
}
#content h1.page-title-withtabs {
  margin-bottom:        0;
  line-height:          1.2em;  
}
#content h2 {
  color:                #8ab34d;
  background-color:     #d8f5bc;
  font-size:            1.2em;
  letter-spacing:       1px;
  font-weight:          normal;
  line-height:          1.3em;
  margin:               2.3em 0 0.2em;
  padding:              0.15em 0.3em 0.1em;
  -moz-border-radius:   0.15em;
}
#content h3 {
  font-size:            1.0em;
  line-height:          1.1em;
  margin:               1em 0 0.2em;
}
#content h4.subtitle {
  margin:               -1.0em 0 0.5em;
  color:                #8b8b8b;
}
#content h4 {
  margin:               0;
  font-size:            0.8em;
}
#content p {
	margin:								0 0 0.8em;
}
#content ul, #content dl, #content ol {
  margin:               0.2em 0 1em;
}
#content .summary {
  max-width:            20em;
  color:                #777;
  font-size:            0.8em
}
#content .supporting-content {
  font-size:            0.8em;
  background-color:     #eee;
  color:                #444;
  padding:              0.7em 1em;
}

/** =launch **/

div.launch dl, div.launch dl dt, div.launch dl dd {
  margin:               0;
  padding:              0;
}
div.launch dl dt {
  width:                7em;
  display:              block;
  padding:              0.3em 0.4em 1em;
  background:           #eee;
  float:                left;
  clear:                left;
}
div.launch dl dt:hover {
  background:           #fce;
}
div.launch dl .launch-container {
  margin:               0;
  padding:              0;
  display:              none;  
  position:             absolute;
  width:                22em;
  margin-left:          7.8em;
  background-color:     blue;
}
div.launch dl dt:hover + .launch-container {
  display:              block;  
}


/** =instructive **/

#content .instructive h3 {
  color:                #FF8000;
}
#content .instructive h3:before {
  content:              "\2192";
  margin:               0 0.2em 0 -1.2em;
}

.more-link {
  text-align:           right;
  font-size:            0.7em;
}


/**
 * =Closing
 */

#closing {
  margin:               7em 0 0;
  background-color:     #F3F3F3;
  padding:              2em 1em 3em 6.4em; /* Left padding 4em * 1.6 to compensate for font size */
  font-size:            0.7em;
  color:                #777;
}
#closing a {
  color:                #454;
  text-decoration:      none;
}
#closing h3 {
  font-size: 1em;
}
#closing .other-sites, #closing .five-ways {
  margin-bottom:        0.5em;
}
#closing .other-sites ul, #closing .five-ways ul {
  list-style:           none;
  margin:					      0 0 0 1em; 
  padding:					    0; 
}
#closing .other-sites ul li, #closing .five-ways ul li {
  margin:               0 0.5em 0 0;
}
#closing .other-sites ul li:after {
  content:              ", ";
}
#closing .five-ways ul li:after {
  content:              " ... ";
  margin-left:          0.5em;
}
#closing .other-sites ul li:last-child:after, #closing .five-ways ul li:last-child:after {
  content:              "";
}
#closing .other-sites ul li a, #closing .five-ways ul li a {
  letter-spacing:       1px;
}
#closing .other-sites ul, #closing .five-ways ul, #closing .other-sites ul li, #closing .five-ways ul li, #closing .other-sites h3, #closing .five-ways h3, #closing .other-sites p, #closing .five-ways p {
  display:              inline;
  font-weight:          normal;
}
#closing .other-sites ul li a, #closing .five-ways ul li a {
  text-decoration:      none;
  color:                #2A8DEC;
}
#closing .other-sites ul li a:hover, #closing .five-ways ul li a:hover {
  text-decoration:      underline;
}
#closing .copyright {
	color:					#bbb;
}


/**
 * =Page specific styles
 */
 
/** =about **/

body.page-about .team {
  padding:              0;
  margin:               0;
  line-height:          90%;
}
body.page-about .team .vcard {
  float:                left;
  list-style:           none;
  margin:               0 1px 1px 0;
  padding:              0;
  height:               128px;
  width:                128px;
  position:             relative;
  z-index:              0;
}
body.page-about .team .vcard .fn {
  display:              none;
}
body.page-about .team .vcard:hover .fn {
  display:              block;
  position:             absolute;
  right:                0;
  bottom:               0;
  z-index:              1;
  padding:              4px;
  background-color:     #456;
}
body.page-about .team .vcard:hover .fn {
  text-decoration:      none;
  color:                #fff;
  font-size:            0.8em;
}

/** =extend **/

#extend-favorites {
  color:                #fff;
  background:           #4db1f3;
  -moz-border-radius:   10px;
  /*padding:              10px 20px 15px;*/
  padding:              10px 12px 15px 24px;
  /*width:                24em;*/
  width:                510px;
  font-size:            12px;
}
#extend-favorites p {
  margin:               0.1em 0 0.3em;
}
#extend-favorites ul, #extend-favorites ul li {
  list-style:           none;
  margin:               0;
  padding:              0;
}
#extend-favorites ul li a, #extend-favorites ul li a:visited {
  text-decoration:      none;
  color:                #fff;
}
#extend-favorites ul li a:hover {
  text-decoration:      underline;
}
#extend-favorites ul li.vextension {
  float:                left;
  width:                128px;
  min-height:           190px;
  background:           url(/images/bg_vextension_fav.png) top left repeat-x;
  margin-right:         12px;
  padding:              10px 15px;
  text-align:           center;
}
#extend-favorites ul li.last {
  margin-right:         0px;
}
body.page-extend .content p, body.page-extend .content ol, body.page-extend .content ul {
  max-width:            20em;
}
body.page-extend .screenshot {
  width:                300px;
  background-color:     #fff;
  border:               1px solid #888;
  float:                right;
} 

/** =download **/

.download-launchpad {
  padding:              1em;
  background-color:     #fff0a2;
  max-width:            20em;
  -moz-border-radius:   10px;
}
.download-launchpad p, .download-launchpad ul {
  margin:               0;
}
.download-launchpad ul {
  margin-top:           0.4em;
}
.download-launchpad ul li span {
  color:                #888;
  font-size:            0.6em;
}
.download-launchpad a {
  font-weight:          bold;
  color:                #966600;
}

/**
 * =Microformats
 */

p address, address.vcard {
  display:              inline;
}
address, p address, address.vcard {
  font-style:           normal; 
}
address.vcard .adr:after {
  content:              ", ";
}


/**
 * =Colors
 */

.logoblue {
  color:						    #348DED;  
}
.pink {
  color:                #f0f;
}
.hotorange {
  color:                #FF8000;	
}
.green { 
  color:                #7cd300; 
}
.orange { 
  color:                #fc0; 
}
.babyblue {
  color:                #9CC3ED;
}
.aside {
  color:                #bbb;
}
.base_font {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: italic; font-weight: bold; color: #FF6600}
.quotes_orange {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: italic; font-weight: normal; color: #FF6600}
.persons_name {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: normal; font-weight: bold; color: #000000}
.quotes_red { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-style: italic; font-weight: normal; color: #CC3300}
.page_font {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px}
.sub_heading {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #CC3300}
.cheah_red {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; color: #CC0033}
.red_persons_name {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #CC3300}
.important {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-style: normal; font-weight: bold; color: #FFFFFF; background-color: #FF0000}
.fire_orange {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #FF6633}
.black_table_text {  font-family: Georgia, "Times New Roman", Times, serif; font-size: 16px; line-height: normal; color: #000000}
.Heading_Table_Orange { font-family: Georgia, "Times New Roman", Times, serif; font-size: 16px; font-style: italic; font-weight: bold; color: #FF0000 }