body {
	font: 12px "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.3px;
	color: #444;
	line-height: 1.6em;
	margin: 0 auto;
	text-align: center;
	background-color: #5677A0;
}
h1 {
	color: #333;
	font-size:2.5em;
	font-family: "Times New Roman", "verdana", Times, Serif;
	font-weight: 300;
	letter-spacing: 0.01em;
	padding: 0.2em 0;
	border-bottom: 1px solid #ccc;
	margin:0.8em 0;
	text-shadow: 2px 2px 2px #cccccc;
}
pre {
	color: #930;
	background-color: #fff;
	padding: 0 4px 0 4px;
	border: 1px dashed #bbbbbb;
	margin: 10px 10px 10px 40px;
	font-size: 11px;
	letter-spacing: normal;
	font-weight: bold;
}
p {
	margin: 10px;
}

/* MAIN CONTAINERS */
#wrapper {
	margin: 1em auto;
	width: 910px;
}
#logo { margin-bottom: 0.4em; border: 0; }
.main-nav { text-align: right; font-size: 1.2em; }
#btn-subscribe { margin-top: 1em; border:0 }
#btn-beer { border:none; background-color:#fff; margin:0; padding:0; margin-right: 2px; }
#btn-download { border:0; }
.likes-container { .margin-top: 0.7em; }
#otg-logo { border:1px solid #fff; }
#main {
	padding: 10px 15px;
	/*margin: 1em auto;*/
	margin-left: 20px;
	text-align: left;
	background-color: #fff;
	width: 890px;
	border: 4px solid #91ADD0;
	-moz-border-radius: 6px; 
	border-radius: 6px;
	-moz-box-shadow: 0 0 3px #333;
	-webkit-box-shadow: 0 0 3px#333;
	box-shadow: 0 0 3px #333;
}
#tab1 img, #tab5 img { border: 0; }
#inlineContent, #uploadedFile { display:none; }

.m-top-1.5 { margin-top: 1.5em; }
.m-top-1 { margin-top: 1em; }
.left-2 { text-align: left; float: left; margin-left: 2em; }
.left-5 { text-align: left; float: left; margin-left: 5em; }
.m-left-2 { margin-left: 2em; }
.w45 { width: 45%; }
.w50 { width: 50%; }
.font-16 { font-size: 16px; }
.block { display: block; }
.callback-container { text-align: left; left; margin-left: 2em; margin-top: 1em; width: 330px; float: left; }

#footer { text-align: center; color: #ffffff; margin: 0.5em; }

/* DOCUMENTATION PAGE */
#leftNav {
	float: left; width: 180px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc; 
	list-style-type: none; margin: 0; padding: 0;
}
#leftNav li a {
	display: block; padding: 5px 5px; background: #ccc; border-top: 1px solid #eee; border-bottom: 1px solid #ccc; text-decoration: none; color: #000;
}
#leftNav li a:hover, #leftNav li a.active {
	background: #999; color: #fff !important;
}
#leftNav li ul {
	display: none; list-style-type: none; margin: 0; padding: 0;
}
#leftNav li ul li a {
	padding: 5px 15px; background: #ececec; border-bottom: 1px dotted #ccc;
}
#leftNav li.last {
	padding-bottom: 1px;
	border-bottom: 1px solid #ccc;
}


.rightDocs { margin-left: 20px; width: 640px; }
.rightDocs .title, .leftNav .title {
	display: block;
	color: #485D77;
	font-size:2em;
	font-family: "Times New Roman", "verdana", Times, Serif;
	font-weight: 300;
	font-variant: normal;
	letter-spacing: 0.01em;
	padding: 0.2em 0;
	border-bottom: none;
	margin: 0 0 0.8 0;
	text-shadow: 2px 2px 2px #cccccc;
}
.rightDocs p { margin-left: 0; margin-right: 0; }
.rightDocs blockquote { margin-top: 2em; }
.rightDocs .section {
	background-color: #fff;
	padding: 4px;
	font-weight: bold;
	border-top: 1px dashed #bbbbbb;
	border-bottom: 1px dashed #bbbbbb;
	font-family: "Courier New", Courier, monospace;
	display: block;
	font-size: 1.1em;
}
#docDescriptors, #docViewerOptions, #docTooltips, #docLibrary, #docLanguage, #docLytebox, #docLyteframe, #docLyteshow, #docCallbacks, #docTipText, #docTipOptions { display:none; }
#docOverview li { margin: 6px 0 0; }



.attribute {
	font-family: "Courier New", Courier, monospace;
}
.alert, .img { color: #990099; }
.op { font-weight: bold; }
.str { color: #0000FF; }
.scr { color: #990000; }
.rel, .div, .op { color: #000099; }
.a { color: #006600; }
.txt { color: #000000; }
.int { color: #ff0000; }
.comment { color: #999; }
.step {
	font-weight: bold;
	color: #E78F08;
	font-variant: small-caps;
	text-shadow: 1px 1px 2px #cccccc;
	font-size: 18px;
}
.title {
	font-size: 20px;
	font-weight: bold;
	font-variant: small-caps;
}
.code {
	background-color: #fff;
	padding: 1px 2px 1px 2px;
	font-weight: bold;
	border-top: 1px dashed #bbbbbb;
	border-bottom: 1px dashed #bbbbbb;
}
.tiny {
	font-size: 10px;
	font-weight: normal;
}
.bigger {
	font-size: 16px;
}

ul.customList {margin:0; padding:0; margin-left: 1em;}
li.custom {
	list-style-type: none;
	background-position: left top;
	background-repeat: no-repeat;
	padding-left: 2.5em;
	margin-left: 1.5em;
	margin-top: 0.7em;
	line-height: 24px;
}
li.support { background-image: url('images/support.png'); }
li.configuration { background-image: url('images/configuration.png'); }
li.html { background-image: url('images/html.png'); }
li.iframes { background-image: url('images/iframe.png'); }
li.info { background-image: url('images/info.png'); }
li.ie7 { background-image: url('images/ie7.png'); }
li.ff { background-image: url('images/ff.png'); }
li.opera { background-image: url('images/opera.png'); }
li.chrome { background-image: url('images/chrome.png'); }
li.safari { background-image: url('images/safari.png'); }
li.youtube { background-image: url('images/youtube.png'); }
li.pdf { background-image: url('images/pdf.png'); }
li.quicktime { background-image: url('images/quicktime.png'); }
li.wmp { background-image: url('images/wmp.png'); }
li.dailymotion { background-image: url('images/dailymotion.png'); }
li.flash { background-image: url('images/flash_ico.png'); }
li.classic { background-image: url('images/flash.png'); }
li.help { background-image: url('images/help.png'); }
li.warning { background-image: url('images/warning.png'); }
li.error { background-image: url('images/error.png'); }
li.javascript { background-image: url('images/javascript.png'); }
.view {
	background: url('images/view.png') top left no-repeat;
	padding-left: 1.5em;
}
.download {
	background: url('images/download.png') 3px 3px no-repeat;
	padding-left: 2.4em;
	padding-top: 6px;
	padding-bottom: 6px;
}
a:link, #tabs div a:link, a:visited, #tabs div a:visited {
	color: #666666;
	font-weight: normal;
	margin: 1px;
}
a:hover, #tabs div a:hover, a:active, #tabs div a:active {
	color: #0099FF;
}
a.site_nav:link, a.site_nav:visited {
	color: #666666;
	text-decoration: underline;
	font-weight: normal;
	margin: 0px;
	border-bottom: 0;
	text-shadow: 2px 2px 2px #dddddd;
}
a.site_nav:hover, a.site_nav:active {
	color: #0099FF;
}
a.learnMore {
	color: #ff0000;
}

/* FORMS */
input, textarea, select {
	font: 11px "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
	margin-left: 4px;
	margin-top: 3px;
	border: 1px solid #bbbbbb;
	background-color: #eeeeee;
}

input#submit {
	font: bold 11px "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
	border: 2px solid #bbbbbb;
	background-color: #eeeeee;
	color: black;
}


.mail {
	color: red;
	font-weight: bold;
}
.copy {
	color: #00CC00;
	font-weight: bold;
}
.red { color: red; }
.green { color: green; }
.blue { color: #0000ff; }
.black { color: #0099CC; }
.titlejs { font-size: 14px; color: blue; }
.purple { color: #6565A0; }

#uploadedFile {
	font-weight: bold;
	font-variant: small-caps;
	font-size: 14px;
}

.left { float: left; }
.left-align { text-align: left; }
.right { float: right; }
.clear { clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.indent1 { margin-left: 1em; }
.indent2 { margin-left: 2em; }

.version { font-weight: bold; color: #0000ff; }


/* Button Style */
a.button {
	background: transparent url('images/bg_button_a.gif') no-repeat scroll top right;
	color: #469DF5;
	display: block;
	float: left;
	font: normal 12px arial, sans-serif;
	height: 24px;
	margin: 10px;
	padding-right: 18px; /* sliding doors padding */
	text-decoration: none;
	font-weight: bold;
}
a.button span {
	background: transparent url('images/bg_button_span.gif') no-repeat;
	display: block;
	line-height: 14px;
	padding: 5px 0 5px 18px;
}
a.button:active {
	background-position: bottom right;
	color: #000;
	outline: none; /* hide dotted outline in Firefox */
}		
a.button:active span {
	background-position: bottom left;
	padding: 6px 0 4px 18px; /* push text down 1px */
}


/* Ads and Social Media */
#googContainer {
	clear: both;
	padding: 5px 0 5px 0;
}
#googContainer div { margin: 0.5em 1.5em 1em 1.5em; }
.twitterButtonContainer { float:left; width:140px; }
.facebookButtonContainer { float: left; width: 300px; }
.googleButtonContainer { float: left; width: 120px; }
#lbOverlay { z-index: 9999998; }
#lbMain { z-index: 9999999; }

.twitterButtonContainer { position: absolute; top: 12px; margin-left: -86px; }
.ourThaiGuideContainer { position: absolute; top: 12px; margin-left: 920px; width: 300px; }


/* Table styles */
.box-table {
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
	font-size: 12px;
	margin: 15px 0;
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}
.box-table th {
	font-size: 13px;
	font-weight: normal;
	padding: 6px;
	background: #91ADD0;
	border-top: 4px solid #5677A0;
	border-bottom: 1px solid #fff;
	/*color: #e8edff;*/
	color: #FF0;
}
.box-table th.dataType { width: 70px; }
.box-table td {
	padding: 6px;
	background: #D9DEEB; 
	border-bottom: 1px solid #fff;
	color: #485D8C;
	border-top: 1px solid transparent;
	vertical-align: top;
}
.box-table tr:hover td {
	background: #d0dafd;
	color: #339;
}