body{
  font-family: Arial, Helvetica, Verdana, sans-serif;
  line-height: 1.5;
  font-size: 14px;
  color: #555;
  background-color: #efefef;
  margin: 0;
  padding: 0;
}


.button {
  display: inline-block;
  zoom: 1;
  vertical-align: baseline;
  margin: 0px 2px;
  outline: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font: 14px;
  font-weight: bold;
  padding: 6px 15px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
  -webkit-border-radius: .5em;
  -moz-border-radius: .5em;
  border-radius: .5em;
  background: #fff;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

.download{
    float: right;
    margin-top: 8px;
}

.download img{
  margin: 3px 3px 0px 0px;
  padding: 0;
  float: left;
}

.green {
	color: #e8f0de;
	border: solid 1px #538312;
	background: #64991e;
	background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
	background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.green:hover {
	background: #538018;
	background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
	background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.green:active {
	color: #a9c08c;
	background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
	background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

.green img{
  border: none;
}

a{
  color: #649ddc;
  text-decoration: none;
}

a:hover{
  text-decoration: underline;
}

h1{
  font-size: 24px;
  color: #555;
  margin: 0;
  padding: 5px;
  font-weight: bold;
}

h2{
  margin: 20px 0px 10px 0px;
  font-size: 20px;
  color: #555;
  font-weight: normal;
}

h3{
  color: #555;
}

h4{
  margin: 0;
  padding: 3px;
  background: #777;
  color: #fff;
  text-align: center;
  border: 1px #333 solid;
  -webkit-border-radius: 4px 4px 0px 0px;
  -moz-border-radius: 4px 4px 0px 0px;
  border-radius: 4px 4px 0px 0px;
}

ul{
  margin: 0px 0px 0px 20px;
  padding: 0;
}

pre{
  border: 1px #eee solid;
  margin: 0;
  padding: 0;
  background: #fbfbfb;
}

table{
  width: 100%;
  border-spacing: 0px;
  border-collapse: collapse;
}

th{
  text-align: left;
  border: 1px #eee solid;
  border-bottom: 1px #ddd solid;
  padding: 5px 10px;
  background: -moz-linear-gradient(top,#F9F9f9 0%,#EFEFEF 100%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#F9F9F9),color-stop(100%,#EFEFEF));
}

td{
  border: 1px #eee solid;
  padding: 10px;
  color: #777;
}

td:first-child{
  color: #333;
}


#page{
  background-color: #fff;
  width: 960px;
  margin: 0px auto;
  border-left: 1px #aaa solid;
  border-right: 1px #aaa solid;
  border-bottom: 1px #aaa solid;
  padding: 10px 30px 100px 30px;
  margin-bottom: 50px;
  box-shadow:         0px 0px 40px rgba(0,0,0,.25);
  -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,.25);
  -moz-box-shadow:    0px 0px 40px rgba(0,0,0,.25);
}

ul#menu{
  margin: 0 0px 20px 0px;
  padding: 0px 0px 10px 0px;
  list-style-type: none;
  border-bottom: 1px #eee solid;
}

ul#menu li{
  color: #999;
  margin-right: 5px;
  padding: 0;
  float: left;
  font-size: 14px;
}

ul#menu li#fork-me{
  float: right;
  margin-right: 9px;
  font-size: 13px;
  font-style: italic;
}

ul#menu li a{
  text-decoration: none;
}

ul#menu li a:hover, ul#menu li.active a{
  text-decoration: underline;
}

#demo{
  margin-right: -30px;
  float: right;
  background: #eee;
  padding: 40px 40px;
  border-radius:         4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  -moz-border-radius:    4px 0px 0px 4px;
  -khtml-border-radius:  4px 0px 0px 4px;
  border: 1px #ddd solid;
}

ul#features{
  list-style-image: url('../img/check.gif');
  margin: 30px 0px 40px 20px;
}

ul#features li{
  margin-top: 5px;
}


#demos-container{
}

ul#menu:after,
#demos-content:after,
#demos-container:after{ content: "."; display: block; height: 0; line-height: 0; font-size: 0; clear: both; min-height: 0; visibility: hidden; }

ul#demos-menu{
  width: 130px;
  float: left;
  margin: 10px 0;
  padding: 0;
  list-style-type: none;
}

ul#demos-menu li{
  padding: 3px 10px;
  border-radius:         4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  -moz-border-radius:    4px 0px 0px 4px;
  -khtml-border-radius:  4px 0px 0px 4px;
  color: #777;
}

ul#demos-menu li.active, ul#demos-menu li.active:hover{
  background: #999;
  color: #fff;
}


ul#demos-menu li:hover{
  background: #bbb;
  color: #fff;
  cursor: pointer;
}

#demos-content{
  float: right;
  width: 788px;
  min-height: 400px;
  padding: 20px;
  border: 1px #ddd solid;
  background: #eee;
  border-radius:         4px;
  -webkit-border-radius: 4px;
  -moz-border-radius:    4px;
  -khtml-border-radius:  4px;
}

form{
  width: 398px;
  float: left;
  margin: 20px 0px;
}