/* Site   -------------------------------- */
html {
	overflow-y: scroll;
	background: #5f5f5f url('../images/html_bg.png') repeat-x scroll;
}
body {
	margin: 0;
	padding: 0 0 20px;
	background: transparent url('../images/body_bg.jpg') no-repeat center top;
	min-height: 100%;
	/* font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; */
	font-family: "Arial", "Helvetica", "Verdana", "sans-serif";
	font-size: 10px;
}
#wrapper {
	margin: 0 auto;
	width: 956px;
	position: relative;
	/*
	background: url('../images/body_footer_bg.jpg') no-repeat center bottom;
	padding-bottom: 365px;
	 */
}
#banner {
	height: 125px;
}
#content .bg {
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
}
table.layout-grid a.disabled, table.layout-grid a.disabled:hover {
	color: #aaa;
	cursor: default;
	text-decoration: line-through;
}
div.notice {
	background: #FFF1AF;
	padding: 3px;
	margin-bottom: 5px;
	font-size: 12px;
	border: 1px solid #EFD500;
}

/* Logo   -------------------------------- */
h1.logo {
	position: absolute;
	top: 10px;
	left: 28px;
	margin: 0;
}
h1.logo,
h1.logo a {
	width: 150px;
	height: 120px;
}
h1.logo a {
	display: block;
	background: url('../images/logo_royal.jpg') no-repeat;
}
h1.logo a span {
	display: none;
}

/* Dock   -------------------------------- */
#dock {
	height: 25px;
	float: left;
	position: absolute;
	top: 0;
	right: 2px;
}
#dock .left {
	float: left;
	width: 3px;
	height: 25px;
	background: url('../images/dock.png') no-repeat left top;
}
#dock .right {
	float: left;
	width: 3px;
	height: 25px;
	background: url('../images/dock.png') no-repeat right top;
}
#dock ul,
#dock ul li {
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#dock ul {
	padding: 0 6px;
	height: 25px;
	background-color: #000;
}
#dock ul li {
	padding: 0 6px;
	position: relative;
}
#dock ul li a {
	float: left;
	display: block;
	padding: 0 5px;
	color: #ccc;
	text-decoration: none;
	font-size: 12px;
	line-height: 22px;
}
#dock ul li a:hover,
#dock ul li.selected a {
	color: #fff;
	border-bottom: 2px solid #ff9c08;
}
#dock ul li.selected a {
	font-weight: bold;
}

/* Navigation   -------------------------------- */
#navigation {
	height: 41px;
	float: left;
	position: absolute;
	top: 62px;
	right: 0px;
}
#navigation .left {
	float: left;
	width: 5px;
	height: 41px;
	/* background: url('../images/navigation.png') no-repeat left top; */
	background: url('../images/navigation_l.png') no-repeat left top;
}
#ie6 #navigation .left {
	background: transparent none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/navigation_l.png', sizingMethod='scale');
	zoom: 1;
}
#navigation .right {
	float: left;
	width: 3px;
	height: 41px;
	background: url('../images/navigation.png') no-repeat right top;
}
#navigation ul,
#navigation ul li {
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 38px;
}
#navigation ul {
	height: 41px;
	background: url('../images/navigation.png') repeat-x 0 -41px;
}
#navigation ul li a {
	float: left;
	display: block;
	height: 41px;
	padding: 0 18px;
	color: #ccc;
	text-decoration: none;
	background: url('../images/navigation_s.png') no-repeat right top;
}
#navigation ul li.selected a {
	color: #fff;
	font-weight: bold;
	border-bottom: 1px solid #ff9c08;
}
#navigation ul li.last a{
	background-image: none;
}
#navigation ul li a:hover {
	color: #fff;
}

/* Content
   -------------------------------- */
#content-wrapper {
	background: #FFF url('../images/content_bg.png') repeat-y 0 0;
}
#content {
	background: url('../images/content_body_bg.png') no-repeat 0 13px;
	zoom: 1;
}
.content-top {
	font-size: 1px;
	height: 13px;
	background: url('../images/content_top_bg.png');
}
.content {
	padding: 0 3px 0 3px;
	overflow: hidden;
}
#content .content {
	min-height: 380px;
/* background: url('../images/dot.png') repeat-y 203px 0; */
}
#home #content .content,
#download #content .content,
#demos #content .content,
#docs #content .content,
#support #content .content,
#development #content .content,
#about #content .content {
	background: none;
}

#ie6 #content .content {
	height: 380px;
	overflow-y: visible;
}

/* Layout */

.content-head {
	height: 74px;
	border-bottom: 1px solid #ccc;
	background-color: #fff;
}

.content-head h2 {
	float: left;
	margin: 0;
	padding: 20px 0 20px 24px;
	color: #ff9c08;
	font: normal 29px/30px "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
}

.content-head h2 span {
	padding-right: 16px;
	border-right: 1px solid #ccc;
}

.content-head p {
	margin: 0;
	padding: 28px 0 0 12px;
	float: left;
	font: bold 15px "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
}


/* Layout
   -------------------------------- */

.layout-grid {
	width: 100%;
}

.layout-grid td {
	vertical-align: top;
}

.layout-grid td.left-nav {
	width: 200px;
}

.layout-grid td.normal {
	border-left: 1px solid #eee;
	padding: 20px 24px;
	font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
}


/* Side Menu
   -------------------------------- */

.section {
	padding: 24px 23px 8px 22px;
	border-bottom: 1px dashed #ccc;
}



ul.side-menu,
ul.side-menu li,
p.side-menu-title {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.side-menu li a {
	font: normal 11px 'Arial', 'Helvetica', sans-serif;
	text-decoration: none;
	color: #000;
}

ul.side-menu li a:hover {
	color: #e87b10;
}

p.side-menu-title {
	font: bold 15px 'Arial', 'Helvetica', sans-serif;
	color: #e87b10;
}

ul.side-menu {
	padding: 5px 2px 0;
}


/* Normal
   -------------------------------- */

h3,
h4 {
	margin: 0;
	font-weight: normal;
}

h3 {
	padding: 0 0 9px;
}

h4 {
	padding-bottom: 21px;
	border-bottom: 1px dashed #999;
	font-size: 12px;
	font-weight: bold;
}
.pull-quote {
	padding: 6px 0;
	line-height: 20px;
	text-transform: uppercase;
	font-size: 12px;
}
p {
	font-size: 12px;
}


/* Footer  -------------------------------- */
#footer {
	height: 45px;
	padding: 10px 0;
	position: relative;
}

#footer .inner {
	position: relative;
	z-index: 2;
}

#ie6 #footer .inner {
	zoom: 1;
}

#footer .bg {
	background: url('../images/footer_bg.png') no-repeat left top;
	width: 100%;
	height: 65px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

#ie6 #footer .bg {
	background: transparent none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/footer_bg.png', sizingMethod='scale');
	zoom: 1;
}

#footer p {
	margin: 0;
	padding: 0;
	color: #5e5e5e;
	font: normal 9px 'Arial', 'Helvetica', sans-serif;
	text-transform: uppercase;
}

#footer p a {
	color: #bbb;
}

#footer span.first {
	display: block;
	float: left;
	padding: 6px 0 0 16px;
}

#footer .block {
	display: block;
	float: left;
}

#footer .block span,
#footer span.empty {
	display: none;
}

#footer .liferay {
	margin: 3px 10px 0px 10px;
	background: url('../images/icon_liferay.gif');
	width: 98px;
	height: 22px;
	border: 0;
}
#footer .filamentgroup {
background:  url('../images/icon_filamentgroup.gif');
width: 180px;
height: 28px;
border: 0;
margin: 3px 22px 0px 3px;
}

.demoflow div img {
	height: 100%;
	width: 100%;
}

.demoflow div.shadow {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: black;
}

.ie .demoflow div.shadow {
	display: none;
}


/* top-level static pages (Support, Dev Center) */

#top-static  { font-size:10px; padding:10px 30px 20px; }
#top-static * { font-family: "Trebuchet MS", Verdana, sans-serif; margin:0; padding:0; border:0; color:#222; text-transform: none; }

#top-static ul { list-style-type:none; }
#top-static h1 { font-size:2.7em; margin:0.6em 0 .5em; }
#top-static h2 { font-size:1.5em; color:#e6820E; margin:1.2em 0 .3em; }
#top-static h3 { font-size:1.3em; font-weight:bold; color:#000; margin:1.5em 0 .3em; }
#top-static #top-static-sidebar h2 { color:#333; margin-bottom:.7em; }
#top-static #top-static-sidebar h2 span { display:block; font-size:.75em; }

#top-static h4.last-update { color:#888; font-size:1.2em; padding:0 0 1em; text-transform:none; }

#top-static h4 { font-size:1em; color:#333; text-transform: uppercase; margin:0 0 .2em; }
#top-static p, #top-static li { font-size:1.2em; line-height:1.3; }
#top-static p.intro { font-size:1.5em; color:#666; line-height:1.4; }
#top-static p.overview { font-size:1.3em; line-height:1.4; }
#top-static p.list { width:80%; }
#top-static #top-static-sidebar p { color:#666; }
#top-static p#suggest-link { margin-top:50px; font-size:1.1em; }

#top-static ul, #top-static p { margin:0 0 1em; }
#top-static ul.inline-list { margin:-1em 0 1.5em; width:80%; }
#top-static ul.inline-list li { display:inline; padding:0 1em 0 0; }
#top-static ul.bullets { list-style-type:disc; margin-left:20px; }
#top-static ul.bullets li { padding:0 0 .5em; }

#top-static a:link,
#top-static a:visited { color:#1b75bb; text-decoration:none; }
#top-static a:hover,
#top-static a:active { color:#0b559b; text-decoration: underline; }

#top-static-header .sidenote { float:right; width:260px; padding-right:20px; }
#top-static-header .sidenote h4 { text-transform:none; color:#e6820E; font-size:1.2em; margin:0 0 .5em; }
#top-static #top-static-header .sidenote p { margin:0 0 .5em; }
#top-static #top-static-header .sidenote p.fineprint { margin-top:2em; font-size:1.1em; color:#666; }

#top-static-main { float:left; padding:0 60px 50px 0; width:490px; }
#top-static p.intro { float:left; width:550px; }
#top-static-main { border-top:2px solid #fcd79f; }
#top-static-sidebar { border-top:2px solid #e4e4e4; float:right; width:255px; padding:0 20px 20px 15px; background: url(../images/bg-top-static-sidebar.gif) repeat-y right top; }

#top-static-main .ticket-block { float:left; width:33%; margin:0 0 20px; }
#top-static #top-static-main .ticket-block p { font-size:1.1em; }
#top-static-main .ticket-block.sml { width:25%; margin-left:8%; }
#top-static-main .ticket-block.last { float:none; }

#top-static a.read-more { display:none; }

#top-static .ui-icon.ui-icon-newwin { display:inline; width:1px; padding-right:15px; zoom: 1; background-image: url(../images/ui-icons_1b75bb_256x240.png); background-position: -50px -80px; opacity: .60; filter:Alpha(Opacity=60); }


/* ---------------------------------------------------------------
Clearfix
--------------------------------------------------------------- */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */