/* Main page content
===================================================================== */
body
{
	margin: 0;
	color: #666666;
	background: url(../Images/General/Page-BgGradient.png) repeat-x;
	position: relative;
	font-family: Tahoma,Arial,Helvetica,sans-serif;
	font-size: 12px;
}

/*
div { text-align:left !important; }
*/

a:link { color:#dd3409;text-decoration:none; }
a:visited { color:#9f301d;text-decoration:none; }
a:visited:hover { color:#9f301d;text-decoration:underline; }
a:hover { color:#dd3409;text-decoration:underline; }
a:active { color:#ff3300;text-decoration:underline; }

/*
	table cell containing the demos -- opens in /common/controls/demo_header.ascx, closes in /common/controls/demo_footer.ascx
	centers the main body content (for pages with no DOCTYPE specified)
*/
#demo-cell { font-size:11px; }


/* Containers */
#body-container { width:980px;margin:0px auto;text-align:left !important; }
#header-container { width:980px;height:64px;background-color:transparent;margin-top:10px; }


/* Header */
#header
{
	width: 980px;
	height: 39px;
	background-image: url(Images/Navigation/background-nav.png);
	background-repeat: no-repeat;
}

#header img.logo { margin:5px 0 0 19px;float:left; }
#header img.logo-active { margin:5px 0 0 19px;float:left;cursor:pointer; }
#header img.divider { margin-top:5px;float:left; }
#header img.demo-title { margin-top:5px;float:left;height:34px; }
#header img.separator { margin-top:5px;float:left;width:359px;height:34px; }
#header img.home { margin-top:5px;float:left;cursor:pointer; }
#header img.home-active { margin-top:5px;float:left;cursor:default; }
#header img.site { margin:5px 0 0 3px;float:left;cursor:pointer; }

/* SubNav */
#subnav
{
	width: 980px;
	height: 25px;
	background-image: url(Images/Navigation/background-subnav.png);
	background-repeat: no-repeat; /*padding:5px 8px 0 12px;*/
	font-size: 9px;
	cursor: default;
}

#subnav #breadcrumbs { width:auto;color:#dd3409;float:left;margin:4px 8px;font-size:9px; }
#subnav #breadcrumbs table#Breadcrumbs { height:13px !important;font-size:9px; }
#subnav #breadcrumbs img { margin-left:5px;margin-right:5px; }
#subnav #breadcrumbs a:link { color:#dd3409;text-decoration:none;font-size:9px; }
#subnav #breadcrumbs a:hover { color:#dd3409;text-decoration:underline;font-size:9px; }
#subnav #breadcrumbs a:visited { color:#dd3409;text-decoration:none;font-size:9px; }
#subnav #breadcrumbs a:visited:hover { color:#dd3409;text-decoration:underline;font-size:9px; }
#subnav #breadcrumbs a:active { color:#ff3300;text-decoration:underline;font-size:9px; }

/* Demo Menu */
#demo-menu { padding-top:6px;margin-bottom:10px; }
#demo-menu div.version { padding-top:6px;padding-right:10px;float:right; }
#demo-menu .menu { cursor:default;border:0; }
#demo-menu .menu img { margin-left:3px; }

/* Integration Menu */
.group-integration { cursor:default; }
.item-integration-top
{
	width: 332px;
	height: 5px;
	background-image: url(Images/Menu/menu-item-integration-top.png);
	background-repeat: no-repeat;
	background-color: transparent;
}
.item-integration-bottom
{
	width: 332px;
	height: 8px;
	background-image: url(Images/Menu/menu-item-integration-bottom.png);
	background-repeat: no-repeat;
	background-color: transparent;
}
.item-integration
{
	width: 332px;
	color: #dd3409;
	text-decoration: none;
	background-image: url(Images/Menu/menu-item-integration.png);
	background-repeat: repeat-y;
	background-color: transparent;
	cursor: pointer;
}

.item-integration-hover {
	width:332px;
	text-decoration:none;
	background-image:url(Images/Menu/menu-item-integration.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:pointer;
}

.item-integration-divider { width:332px;height:20px;background-image:url(Images/Menu/menu-item-integration.png);background-repeat:repeat-y;background-color:transparent;cursor:default; }

div.integration-template { width:332px;height:90px; }
div.integration-template ul { width:301px;height:80px;margin:6px 0 0 31px;padding:0;list-style:none; }
div.integration-template ul li { float:left;display:inline; }
div.integration-template ul li.image { width:145px;margin-right:10px;height:80px; }
div.integration-template ul li.text { margin-top:5px;width:130px;height:70px; }
div.integration-template ul li.text span.description { width:130px;margin-top:4px;display:block;text-align:left; }



/* Controls-Specific Menu */
.group-controls { cursor:default; }
.item-controls-top
{
	width: 153px;
	height: 7px;
	background-image: url(Images/Menu/menu-item-controls-top.png);
	background-repeat: no-repeat;
	background-color: transparent;
}
.item-controls-bottom { width:153px;height:8px;background-image:url(Images/Menu/menu-item-controls-bottom.png);background-repeat:no-repeat;background-color:transparent; }
.item-controls {
	font-size:11px;
	width:153px;
	height:18px;
	color:#dd3409;
	text-decoration:none;
	background-image:url(Images/Menu/menu-item-controls.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:pointer;
}

.item-controls-hover {
	font-size:11px;
	width:153px;
	height:18px;
	color:#dd3409;
	text-decoration:underline !important;
	background-image:url(Images/Menu/menu-item-controls.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:pointer;
}

.item-controls-title {
	font-size:11px;
	width:153px;
	height:19px !important;
	color:#666666;
	font-weight:bold;
	padding-top:3px;
	background-image:url(Images/Menu/menu-item-controls.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:default;
}

.item-controls-spacer { width:153px;height:10px;background-image:url(Images/Menu/menu-item-controls.png);background-repeat:repeat-y;background-color:transparent;cursor:default; }

/* Platform-Specific Menu */
.group-platforms { cursor:default; }
.item-platforms-top { width:255px;height:5px;background-image:url(Images/Menu/menu-item-platforms-top.png);background-repeat:no-repeat;background-color:transparent; }
.item-platforms-bottom { width:255px;height:8px;background-image:url(Images/Menu/menu-item-platforms-bottom.png);background-repeat:no-repeat;background-color:transparent; }
.item-platforms {
	font-size:11px;
	width:255px;
	height:16px;
	color:#dd3409;
	text-decoration:none;
	background-image:url(Images/Menu/menu-item-platforms.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:pointer;
}

.item-platforms-hover {
	font-size:11px;
	width:255px;
	height:16px;
	color:#dd3409;
	text-decoration:underline !important;
	background-image:url(Images/Menu/menu-item-platforms.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:pointer;
}

.item-platforms-title {
	font-size:11px;
	width:255px;
	height:19px !important;
	color:#666666;
	font-weight:bold;
	padding-top:3px;
	background-image:url(Images/Menu/menu-item-platforms.png);
	background-repeat:repeat-y;
	background-color:transparent;
	cursor:default;
}

.item-platforms-spacer { width:255px;height:10px;background-image:url(Images/Menu/menu-item-platforms.png);background-repeat:repeat-y;background-color:transparent;cursor:default; }

/***********************************************/
/* Content */
#content-container
{
	width: 950px;
	height: auto;
	background-image: url(Images/Images/background-content.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-color: transparent;
	margin-top: 10px;
	padding: 10px 15px 0 15px;
	text-align: justify;
}

#content { background-color:transparent;width:950px; }

#content div.title { width:950px;height:25px;padding-top:9px;padding-bottom:9px; }
#content div.title div.img
{
	width: 300px;
	height: 25px;
	float: left;
	vertical-align: middle;
	margin-left: 6px;
	background: url(Images/Specific/titles.png) #fff no-repeat 0px -125px;
}
#content div.title span.version { vertical-align:bottom;float:right;padding-top:3px;padding-right:10px; }

#index
{
	width: 930px;
	height: auto;
	padding: 20px 10px 0 10px;
	background-image: url(Images/Background/background-index.png);
	background-repeat: no-repeat;
}

/* Font styles */
p { margin:0;padding:0; }
.large { font-size:12px;line-height:16px; }
.regular { font-size:11px;line-height:16px; }
.small { font-size:10px;line-height:13px; }
.extra-small { font-size:9px;line-height:13px; }

/* Colors */
.black { color:#000000; }
.red { color:#ff3300; }
.red-orange { color:#dd3409; }
.dark-grey { color:#333333; }
.grey { color:#666666; }
.light-grey { color:#999999; }
.extra-light-grey { color:#dddddd; }

/***********************************************/


/***********************************************/
/* Footer */
#footer-container
{
	width: 980px;
	height: 40px;
	background: url(Images/Images/background-footer.png) #ffffff no-repeat left top;
	margin-top: 30px;
	clear: both;
}
#footer-container .copyright { color:#ffffff;padding-top:7px;text-align:center !important; }
/***********************************************/


/* Demo Area */
#demo-top
{
	width: 950px;
	height: 10px;
	background-image: url(Images/Background/background-demo-top.png);
	background-repeat: no-repeat;
	background-color: #f2f2f2;
}

#demo-container { width:950px;background-color:#f2f2f2;position:relative; }
#demo-container td.nav-cell
{
	background: url(Images/Background/background-nav-cell.png) repeat-y left bottom;
}

#demo-nav {
	width:190px;
	height:435px !important;
	margin-left:10px;
	background-color:#ffffff;
}

#demo-nav .demo-logo { width:190px;height:40px;background-color:#ffffff; }

#demo-nav .demo-nav {
	padding:0 10px 0 10px;
	cursor:default;
}

#demo-nav .NavTopItem
{
	width: 170px;
	height: 26px;
	background-image: url(Images/Navigation/nav-top-item.png);
	background-repeat: no-repeat;
	font-size: 11px;
	font-weight: bold;
	cursor: pointer;
}
#demo-nav .NavTopItemHover { width:170px;height:26px;background-image:url(Images/Navigation/nav-top-item.png);background-repeat:no-repeat;font-size:11px;font-weight:bold;cursor:pointer;color:#dd3409; }
#demo-nav .NavTopItemActive { width:170px;height:26px;background-image:url(Images/Navigation/nav-top-item.png);background-repeat:no-repeat;font-size:11px;font-weight:bold;cursor:pointer;color:#ff3300; }
#demo-nav .NavTopItemExpanded { width:170px;height:26px;background-image:url(Images/Navigation/nav-top-item.png);background-repeat:no-repeat;font-size:11px;font-weight:bold;cursor:pointer; }

#demo-nav .NavLevel2Item { color:#dd3409;cursor:pointer;padding:1px 0 1px 0;font-size:11px; }
#demo-nav .NavLevel2ItemHover { color:#dd3409;text-decoration:underline;cursor:pointer;padding:1px 0 1px 0;font-size:11px; }
#demo-nav .NavLevel2ItemSelected { color:#666666;cursor:default;padding:1px 0 1px 0;font-size:11px; }

#demo-container .button-previous { position:absolute;left:20px;bottom:10px; }
#demo-container .button-next { position:absolute;left:135px;bottom:10px; }

#demo-title { margin-left:10px;padding:0;height:20px;font-size:11px; }
#demo-title img.bullet { display:inline;vertical-align:baseline;margin-right:2px; }
#demo-title img.code { margin-top:-17px;float:right; }

#content div.DemoArea {
	width:740px;
	min-height:395px;
	margin-left:10px;
	font-size:11px;
}

#content div.demo-area { margin-left:10px;margin-right:10px;font-size:11px;text-align:left !important; }
#content div.demo-area a:hover { text-decoration:none !important; }

#demo-bottom
{
	width: 950px;
	height: 10px !important;
	background-image: url(Images/Background/background-demo-bottom.png);
	background-repeat: no-repeat;
	background-color: transparent;
}

#about-container { margin:10px 0 10px 10px; }
#about-container ul
{
	list-style-image: url(Images/General/chevron-small-grey.png);
}
#about-container div.demo-folder { margin:5px 0 0 5px;font-weight:bold;text-align:left; }

.clear-fix { clear:both; }

/* Demo-specific classes */
.MainText { font-size:11px; }
.hint { color:#ff3300; }

.PageBackgroundGradient
{
  background-image: url(../Images/General/Page-BgGradient.png);
  background-repeat: repeat-x;
  height: 170px;
}

.invisible {display:none}

.field { height:25px;padding:10px 20px;margin:0;width:500px;position:relative; vertical-align:middle;}

.field span.lbl { float:left;width:60px;height:25px;line-height:24px;font-size:12px;padding:0 10px 0 0;text-align:right;cursor:default; }

.field span input { width:150px;border:1px solid #000;background:#fff;margin:0;padding:4px 4px 5px 4px;font:12px Tahoma,Verdana,Arial,Helvetica,sans-serif;border:1px solid #666;border-color:#666 #999 #999 #666;vertical-align:middle;}

.field span.empty input { color:#b7b7b7;font-style:italic; }

.field span.focused input { color:#333;font-style:normal; }

.field span.valid input { color:#333;font-style:normal; }

.field span.focused-valid input { color:#0a0;font-style:normal; }

.field span.invalid input { color:#d00;font-style:normal; }

.field span.disabled input { background:#f3f3f3;color:#bbb;font-style:normal;border-color:#bbb #ddd #ddd #bbb; }

.validator_message { position:absolute; left:260px; top:15px;}