@CHARSET "UTF-8";

@font-face {
  font-family: 'latoLG';
  src: local(''), url('../css/Lato-Light.ttf') format('truetype'); }
 
@font-face { 
  font-family: 'latoM';
  src: local(''), url('../css/Lato-Medium.ttf') format('truetype');  } 
  
  
  
body { padding: 0px; margin: 0px; font:normal 16px Georgia, "Times New Roman", Times, serif; background:url('../foto/slide.jpg')  no-repeat left top; }

#page { width: 500px;	}
a { color:#E26A6A; text-decoration: none; }
a:hover { text-decoration: underline; }
a.pn { font:normal 30px Georgia, "Times New Roman", Times, serif; color:#999; text-decoration: none; }
a.pn:hover { color:#f00; text-decoration: none; }
code { color: #0101C8; background-color: #FFF; padding: 20px; display: block; -moz-border-radius: 5px; }
h1 { font:normal 40px 'latoLG',sans-serif;color: #fff; }
h2 { font:normal 22px 'latoLG',sans-serif;color: #fff; }
h3 { padding: 180px 0 0 0; font:normal 18px 'latoM',sans-serif;color: #000; }
.subMenu { clear: both; }
.subMenu a { padding: 5px; color: #3D0017; text-decoration: none; float: left; }
.subMenu a:hover { background-color: #333; }
.dyn { background-color: yellow; }
.comment { color: #808000; }

#doc, #note, #spread, #examples { padding-top: 5px; line-height: 20px; clear: both; }
#head { float: left; width: 1100px; padding: 0 50px; font-size: 16px; }
#head h1 { background: url(jqbargraphlogo.png) no-repeat; font-size: 35px; }
#head h1 small { font-size: 22px; padding-left: 20px; }
#head .download a,
#examples .exampleMenu a { 	-moz-border-radius: 5px; font-style: italic; font-size: 16px; color: white;padding: 5px 10px; width: 1100px; margin: 5px;display: block;}
#head .download a:hover, #examples .exampleMenu a:hover, .exampleActive { background-color: #474747 !important; text-decoration: none; }
#head .headText {  }
#examples #exampleSimple, #examples code, #examples .exampleMenu, #examples #exampleMulti { float: left; }
#examples .exampleMenu { width: 150px; }
#examples .exampleMenu { padding-top: 20px; }
#examples .exampleMenu a { display: block; font-size: 14px; width: 115px; }
#examples code { display: none; width: 1100px; background: none; float: left; }
#examples h2 { padding-bottom: 10px; }

/*--- shared */
#ftHolder {	width: 500px;	float: left;	text-align: center;	}
#example { float: left; }
.ft-title { padding: 10px 10px; width: 500px; text-align: left;position: absolute; left:30px; z-index: 1000; color: #000;  }
/*--- end:shared */

.topbar h2{ font-weight: normal !important }
.topbar a { color: #39c; text-decoration: none; }
.topbar a:hover { text-decoration: underline; }
.ft-prev, .ft-next { background: #ddd; padding: 0 10px; border: thin solid #999; margin:0 20px 0 20px; border-radius:3px;  }
.ft-button-ft-active { color: black;  }