/*** css © Mediasurface Europe Ltd ***/

* {
	margin: 0;
	padding: 0;
	}

body {
	margin: 0;
	padding: 0;
	font: 8.5pt/14pt 'Trebuchet MS', 'Lucida Grande', Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
	line-height: 1.4em;
	color: #999;
	background: #ccc;
	}

#page {
	margin: 0 auto;
	background: #fff url(page_bkgnd.jpg) repeat-y 0 0;
	width: 1040px;
	min-width: 1040px;
	}

/*** HEAD elements ***/
/*********************/
#head {
	margin: 0 20px;
	background: url(head_gradient.jpg) no-repeat 0 0;
	height: 140px;
}

#head img {
	float: left;
	padding-left: 20px;
	border: none;
	}

#head ul {
	float: right;
	padding: 80px 0 0 10px;
	font-size: 11pt;
	}
		
#head li {
	display: inline;
	padding: 0 25px 0 0;
	color: #266F34;
	}
	
#head li a {
	color: #fff;
	text-decoration: none;
	}

#head li a:hover {
	text-decoration: underline;
	}
	
#footer {
	height: 36px;
	background: url(footer_bottom.png) no-repeat center top;
	padding: 3px 0 0 60px;
	clear: both;
	color: #ccc;
}

#footer a {
	color: #ccc;
	text-decoration: none;
}

#footer a:hover {
	color: #666;
	text-decoration: underline;
}





#wrapper-old	{++++++++++++++++++++
	width: 1000px;
	min-width: 1000px;
	margin: 5px auto;
	text-align: left;
	background-color: #fff;
	padding: 0 20px 20px 20px;
	border: 1px solid #ccc;
	}

/*** HTML Elements ***/
/*-------------------*/
a img {
	border: none;
}

h1 {
	margin: 0 0 10px 0;
	padding: 0;
	font: 2.5em Georgia, "Times New Roman", Times, serif;
	color: #64B261;
	border-bottom: 1px solid #ddd;
}

h1 b {
	font-weight: normal;
}

h1 span {
	color: #000;
	}

h2 {
	margin-top: 2.5em;
	padding: 0;
	font: 1.8em trebuchet, verdana, san-serif;
	color: #000;
	font-weight: normal;
	old-color: #64B261;
}

h2 strong {
	color: #000;
	font-weight: normal;
	}

h2 b {
	color: #000;
	font-weight: normal;
	}

h3 {
	margin: 0;
	padding: 0;
	font: 1.4em Georgia, "Times New Roman", Times, serif;
	color: #64B261;
}

h4 {
	margin: -10px 0 0 0;
	padding: 0;
	font: 1.2em "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #000;
}

h5 {
	font: 1.2em "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #7091AC;
	margin-bottom: 20px;
	}

h5.ts {
	background: url("quotemark_first.gif") no-repeat top left;
	text-indent: 15px;
	}

.quote {
	background: url("quotemark_second.gif") no-repeat top right;
	padding-right: 15px;
	}


/*** Logo ***/
/*----------*/
/*---( Technique as seen on: http://monc.se/kitchen/27/logotype-image-replacement - Thanks ---*/
#logo {
	display: block;
	margin: 0 0 15px 5px;
	padding: 0;
	width: 212px;
	height: 65px;
	background: transparent url("logo_support.gif");
	text-decoration: none;
}

#logo img {
	display; block;
	padding-top: 65px;
	height: 0;
	overflow: hidden;
	font: bold 18pt "lucinda_grande", "Trebuchet", Verdana, Arial, Helvetica, sans-serif;
	color: #2ae;
}
	
.clear
{
    clear: both;
    height: 0;
    font-size: 0px;
}

/* --- search_form ------------------------------------------*/
#search_box {
	float: right;
	margin: 20px 0 20px 0;
	width: 245px;
}

#search_box fieldset {
	border: none; 
}

#search_box input:focus {
	color: #000
}

#search_box input {
        border: 1px solid #999;
        background: #e4e4e4;
        width: 150px;
        font-size: 12px;
}

#search_box button {
        border: 1px solid #666;
        background: #ccc;
        margin-left: 5px;
        color: #666;
        font-size: 12px;
}


/*** Issues Form ***/
/*******************/
form#support_issue fieldset {
background-color: #e7e7e7;
padding: 20px;
margin-bottom: 3px;
border: 1px solid #939393;
}

form#support_issue fieldset#user_details {
background-color: #ccc;
}

form#support_issue input, textarea {
display: block;
margin-bottom: 15px;
}

form#support_issue label {
font-size: 13px;
color: #000;
}

/*** Main Horizontal Navigation ***/
/*--------------------------------*/	
#main_nav {
	background: #fff url("header_bkgnd_left.jpg") no-repeat left top;
	}

ul#nav	{
	margin: 0;
	padding: 2px 0 0 0;
	height: 38px;
	list-style: none;
	width: 100%;
	background: url("header_bkgnd_right.jpg") no-repeat right top;
	}
	
ul#nav li	{
	float: left;
	}
	
ul#nav a	{
	display: block;
	padding: .5em 1.2em;
	background: url("header_divider.gif") repeat-y right center;
	text-decoration: none;
	color: #fff;
	font: 10pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	}
	
ul#nav a.lastitem	{
	background-image: none;
	}
	
ul#nav a:hover	{
	text-decoration: underline;
	}
/*** end of main nav ***/


/*** crumbtrail ***/
/*----------------*/
#crumbtrail_wrapper {
	background: url("xyimgs/crumbtrail_bkgnd_left.png") no-repeat left top;
	margin: 10px 30px;
	}
	
ul#crumbtrail {
	margin: 0;
	padding: 0 0 0 15px;
	height: 23px;
	list-style: none;
	background: url("xyimgs/crumbtrail_bkgnd_right.png") no-repeat right top;
	}

ul#crumbtrail li {
	margin-top: -5px;
	float: left;
	font: 8pt "lucinda_grande", "Trebuchet", Verdana, Arial, Helvetica, sans-serif;
	color: #626469;
	padding-right: 3px;
	}
	
ul#crumbtrail a {
	color: #999;
	text-decoration: none;
	}

#crumbtrail a:hover {
	color: #000;
	text-decoration: underline;
	}
/*** end of crumbtrail ***/

/*** sub navigation ***/
/*--------------------*/	
#sub_nav {
	float: left;
	width: 220px;
	margin-left: 21px;
	margin-bottom: 30px;
	}
	
#sub_nav ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}
	
#sub_nav li {
	margin: 0;
	padding: 0;
	}
	
#sub_nav li a {
	display: block;	
	padding: .3em 0 .3em 1.4em;
	text-decoration: none;
	font: 8pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	border-bottom: 1px solid #ddd;
	}

#sub_nav li a:link {
	color: #666;
	}
	
#sub_nav li a:active {
	text-decoration: none;
	color: #666;
}
	

#sub_nav li a:hover {	
	text-decoration: none;
	color: #000;
	background-old: #dfdfdf url("sub_nav_rollover.jpg") no-repeat left top;
	background-color: #fcfcfc;
	}

#sub_nav li a:visited {
	text-decoration: none;
	color: #666;
	xxxbackground: url("tick.gif") no-repeat 0 0;
	}

/*** content ***/
/*-------------*/	

	
#index_content {
	float: left;
	width: 960px;
	margin: 0 40px;
	}

#primary_content {
	float: right;
	width: 720px;
	margin-right: 45px;
	margin-bottom: 30px;
	}

#primary_content #username {
	text-transform: capitalize;
	}

#primary_content #subject {
	font-weight: normal;
	font-size: 14px;
	color: #000;
	}
	
#left_frame {
	float: left;
	width: 480px;
	width-old: 720px;
	}
ol.code {
	margin-bottom: 15px;
	}

#left_frame h3 {
	clear: both;
	color: #7091AC;
	font-size: 14px;
	}

#left_frame p {
	margin-bottom: 20px;
	}

#left_frame p img {
	float: left;
	padding-right: 30px;
	margin-bottom: 20px;
	}


#left_frame ul, #left_frame ol {
	padding: 0 0 0 30px;
	}
/*
#left_frame ul a {
	display: block;
	margin: 0 140px 10px 0;
	}
*/

#left_frame p img.inline {
	float: none;
	margin: 0;
	padding: 0 2px;
	}

#left_frame a {
	background-color: #E9E9E9;
	padding: 1px 3px;
	color: #333;
	text-decoration: none;
	}

#left_frame a:hover {
	background-color: #aad378;
	color: #000;
	text-decoration: underline;
	}	

#search_results ul {
	list-style-type: none;
	display: inline;
	}

#search_results li {
	padding-bottom: 10px;
	}

#right_frame {
	float: right;
	width: 225px;
	}

#right_frame img {
	margin-bottom: 10px;
	}



	
.index_feature {
	width: 720px;
	margin: 0 15px 20px 0;
	background: url("curved_features_bottom.png") no-repeat bottom center;
	}

.index_feature h1 {
	padding: 15px;
	font: 2em Georgia, "Times New Roman", Times, serif;
	color: #64B261;
	border: none;
	background: url("curved_features_top.png") no-repeat top left;
	}
	
.index_feature ul {
	padding: 0 0 0 26px;
	list-style-type: none;
	}
	
.index_feature li {
	float: left;
	margin-right: 30px;
	padding: 0 40px 15px 0;
	width: 160px;
	border-right: 1px dotted #ECECEC;
	}

.index_feature li.nopadding {
	padding-right: 0;
	border-right: none;
	}

.index_feature hr {
	clear: both;
	visibility: hidden;
	background: url("box_bottom_edge.jpg") no-repeat bottom left;
border: 1px dotted green;
	}


	

/*** More Info Panel ***/
/*---------------------*/
#more_info_panel {
	background: url("side_panel_bkgnd.jpg") repeat-y 0 0;
	}
	
#more_info_panel h2 {
	margin: 0;
	padding: 10px 10px 0 20px;
	font: 1.8em Georgia, "Times New Roman", Times, serif;
	background: url("side_panel_top.jpg") no-repeat 0 0;
	color: #64B261;
xcolor: #ff9900;
	}
	
#more_info_panel h3 {
	background: url("side_panel_top.jpg") no-repeat 0 0;
	padding: 10px 10px 0 10px;
	}
	
#more_info_panel p {
	padding: 0 10px;
	}
	
#more_info_panel hr {
	height: 19px;
	background: url("side_panel_bottom.jpg") no-repeat bottom center;
	border: none;
	margin-bottom: 30px;
	clip: rect(1px 19px 225px 1px);

	}
	
#more_info_panel h4 {
	margin-top: 15px;
	padding: 0 10px;
	}
	
#more_info_panel ul {
	margin: 0;
	padding: 0 10px;
	list-style-type: none;
	}
	
#more_info_panel li {
	margin: 0;
	padding: 3px 0;
	}

#more_info_panel ul.vgs li a {
	margin: 5px;
	padding: 0 0 10px 20px;
	text-decoration: none;
	font: 8pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	background: url("video_guide_icon.gif") no-repeat 0 0	;
	}
	
#more_info_panel ul.vgs li a:hover {
	text-decoration: underline;
	color: #000;
	}
	
#more_info_panel ul.vgs li a:visited {
	text-decoration: underline;
	color: #ccc;
	}
	
#more_info_panel ul.howto li a {
	margin: 5px;
	padding: 0 0 10px 20px;
	text-decoration: none;
	font: 8pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	background: url("step-by-step_icon.gif") no-repeat 0 0;
	}
	
#more_info_panel ul.howto li a:hover {
	text-decoration: underline;
	color: #000;
	}
	
#more_info_panel ul.examples li a {
	margin: 5px;
	padding: 0 0 10px 20px;
	text-decoration: none;
	font: 8pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	background: url("examples_icon.gif") no-repeat 0 0;
	}
	
#more_info_panel ul.examples li a:hover {
	text-decoration: underline;
	color: #000;
	}
	
#more_info_panel ul.refs li a {
	margin: 5px;
	padding: 0 0 10px 20px;
	text-decoration: none;
	font: 8pt "Trebuchet" Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	background: url("tags_icon.gif") no-repeat 0 0;
	}
	
#more_info_panel ul.refs li a:hover {
	text-decoration: underline;
	color: #000;
	}
	
ul.hot_tip {
	background: #7C9FBE url("hot_pepperio_tip_head.jpg") no-repeat 0 0;
	padding: 45px 15px 8px 15px;
	color: #fff;
	margin-bottom: 15px;
	}

ul.hot_tip li {
	display: inline;
}

/*** New Features ***/
/*------------------*/	

ul .new_features_ul {
	margin: 0;
	padding: 0;
}

ul .new_features_ul li {
	display: inline;
}

#more_info_panel ul li h4 {
	background: url("flash2.gif") no-repeat left top;
	padding: 2px 0 0 24px;
	height: 24px;
}

#more_info_panel ul li h5 {
	font-size: 11px;
	padding: 4px 0 0 10px;
}

ul .new_features_ul li a {
	color: #000;
	text-decoration: none;
}

ul .new_features_ul li a:hover {
	color: #999;
	text-decoration: underline;
}


h5 .new_features_ul {
	font-size: 1em;
}


/*** Video Frame ***/
/*-----------------*/	
#video_frame {
	margin-bottom: 10px;
	padding: 15px;
	min-width: 690px;
	background-color: #fcfcfc;
	border: 1px solid #f2f2f2;
	}
	
#video_frame object {
	border: 1px solid #000;
	}

/*** Tables ***/
/*------------*/	
table	{
	margin: 0;
	border-collapse: collapse;
	border: 1px solid #666;
	width: 440px;}
	
th, td	{
	padding: 0.5em 1em;
	font-size: 6.75pt;
	}

table caption	{
	margin-top: 1em;
	margin-left: -1px;
	padding: 0.4em 0 0.3em 0.8em;
	font-size: 1.2em;
	text-align: left;
	background-color: #7091AC;
	border: 1px solid #666;
	color: #fff;
	}
	
table th	{
	background-color: #ABBDD2;
	color: #fff;
	border-bottom: 1px solid #999;
	}
	
table td	{
	background-color: #ededed;
	color: #000;
	vertical-align: top;
	border-bottom: 1px solid #ccc;
	}

table td:hover	{
	background-color: #green;
	}

table p {
	margin-top: 0;
}
	
table .for_instance	{
	font-style: italic;
	color: #333;
	}

table tr:last-child td {
	border-bottom: 1px solid #666;
}


#ms_logo {
	margin: 0;
	padding: 0;
	width: 120px;
	height: 16px;
	background: #fff url("mediasurface_logo.gif") no-repeat 0 0;
	float: right;
	clear: both;
	border: none;
}

span.copyright {
	display: block;
	text-align: right;
	clear: both;
}


/*** Code ***/

pre {
	font-size: 1em;
	color: #000;
	padding: 20px 0 20px 35px;
	width: 440px;
	border: 1px dotted #ABBDD2;
	letter-spacing: 1px;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
	}

.code {
	margin: 0;
	padding: 3px 5px 3px 35px;
	width: 435px;
	border: 1px solid #ABBDD2;
	list-style-type: decimal-leading-zero;
	font-family: Courier;
}

.code pre {
	margin: 0;
	padding: 0;	
	border: none;
	color: #333;
	font: 9px Monaco, "Courier New", Tahoma;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
	}

pre b {
	color: #000;
	letter-spacing: 2px;
	}

.code li {
	margin: 2px 0;
	padding: 0 5px;
	background-old: #D0DAE6;
	background: #ededed;
}

.code em {
	color: #900;
	font-weight: bold;
	font-style: normal;
}

pre i {
	font-size: 1em;
	color: #fff;
	}

body.editorStyle {
	background: #fff;
}




/************ NESTED NAV STYLES ******************/
.menu, .menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

.menu {width:200px;}

.menu li ul {
	margin: 0;
	padding: 0;
	margin-bottom: 1px;
	}

.menu a {
	display: block;
	padding: 2px 5px;
	color: #000;
	text-decoration: none;
	}

.menuxxx a:hover {background:#d9dcb0;}

.menu ul li a {
	text-indent: 10px;
	color: #000;
	}

.menu ul li a:hover {
	background: url("rollover_arrow.gif") no-repeat 15px 5px;
	color: #000;
	text-decoration: underline;
	}

.menu ul li {padding-left:15px;
	color: #000;}
.hidden {display:none;}


.editorstyle {
background-color: #fff;
color: #999;
}