/* switcher controls */
.cpswitcher
{
	/* width is in iotbs stylesheet */
	float:right;
	font:normal normal normal 0.8em "trebuchet ms",sans-serif;
	text-align:right;
	margin:0 0 0.5em 0;
}

.cpswitcher div
{
	border:1px solid #f90;
	border-color:#eef #99a #99a #eef;
	background:#f7f7f7;
	float:right;
	/* fixes opera 8 but breaks opera 7 ...
	width:100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	*/
}

.cpswitcher div div
{
	border:none;
	float:none;
}

.cpswitcher form
{
	padding:0.55em 0.5em 0.3em 0;
	float:right;
}






/* groupings of fieldsets */
.fieldgroup  
{
	/* width is in iotbs stylesheet */
}

.cpgroup { float:right; }
.navgroup { float:left; }





/* fieldsets and legends */
fieldset 
{
	font:normal normal normal 0.8em "trebuchet ms",sans-serif;
	border:1px solid #b60;
	border-width:0 0 0 1px;
	padding:0 0.5em;
	background:#fec;
	margin:0 0 0.5em 0;
	line-height:170%;
	height:auto;
}

fieldset.cpanel
{
	border-color:#4a4;
	background:#efe;
}

fieldset div.expando
{
	padding:0.5em 0;
	width:100%;
}

legend 
{
	border:1px solid #b60;
	border-width:0 0 0 1px;
	background:#fc8;
	color:#950;
	position:relative;
	padding:0.15em 0 0.25em 0.5em;
	left:-1.4em; 
	margin:0 0 0 -0.6em; 
	top:0;
	font-weight:bold;
	cursor:default;
	line-height:140%;
}

div.fieldgroup legend span
{
	color:#950;
	border:none;
}

fieldset.cpanel legend, div.fieldgroup fieldset.cpanel legend span
{
	color:#474;
	border-color:#4a4;
	background:#cec;
}

.cpswitcher fieldset
{
	font-size:100%;
	border:none;
	padding:0;
	margin:0;
	position:static;
	display:inline;
	background:transparent;
}

/* moz, safari/konqueror tweaks */
div[class*="fieldgroup"] legend 
{
	margin:0 -0.45em 0 0.85em; 
}
div[class*="fieldgroup"] legend span
{
	top:auto;
}
/* negate some safari/konqueror tweaks for moz */
div[class*="fieldgroup"]:lang(en) legend 
{
	margin-left:-0.6em; 
}







/* fieldset corners */
div[class~="fieldgroup"] fieldset
{
	background:url(/images/corner-fieldset-orange.gif) #fec no-repeat right top;
}
div[class~="fieldgroup"] legend .help:after
{
	content:'';
	background:url(/images/corner-legend-orange.gif) no-repeat 0 0;
	display:block;
	width:10px;
	height:10px;
	margin:-1.55em 0 0 3.2em;
}
div[class~="fieldgroup"] fieldset.cpanel
{
	background:url(/images/corner-fieldset-green.gif) #efe no-repeat right top;
}
div[class~="fieldgroup"] fieldset.cpanel legend .help:after
{
	background-image:url(/images/corner-legend-green.gif);
}

/* moz, safari/konqueror tweaks */
div[class*="fieldgroup"] legend .help:after 
{
	width:11px;
	background-position:1px 0; 
}




/* legend help icons */
legend .help
{
	display:block;
	height:18px;
	width:4em;
	/* margin is in itobs stylesheet */
}

legend .help a, legend .help a:visited
{
	background:url(/images/help-orange.gif) no-repeat right top;
	color:#fc8;
	display:block;
	float:left;
	position:relative;
	left:6px;
	top:1px;
	height:18px;
	width:1.8em;
	cursor:pointer;
}

fieldset.cpanel legend .help a, fieldset.cpanel legend .help a:visited
{
	color:#cec;
	background-image:url(/images/help-green.gif);
}

legend .help a.openclose, legend .help a.openclose:visited
{
	background:url(/images/open-orange.gif) no-repeat 0 -30px;
	color:#fc8;
	cursor:pointer;
	display:block;
	visibility:hidden;
	float:left;
	position:relative;
	left:14px;
	top:1px;
	height:18px;
	width:1.8em;
}

fieldset.cpanel legend a.openclose, fieldset.cpanel legend a.openclose:visited
{
	color:#cec;
	background-image:url(/images/open-green.gif);
}







/* labels */
label
{
	color:#950;
	display:block;
}

label.inline 
{
	display:inline;
	margin:0;
}

fieldset.cpanel label
{
	color:#474;
}

.cpswitcher label
{
	color:#556;
}








/* radio controls and checkboxes */
input.radio, input.checkbox
{
	margin:0;
	padding:0;
	background:#fffff7;
}







/* text inputs and selectors */
input.text, select 
{
	border:1px solid #f90;
	border-color:#b60 #fc9 #fc9 #b60;
	padding:0 0.3em;
	font:normal normal normal 1em "lucida sans console", "courier new", monospace;
	background:#fffff7;
	min-width:2em;
}

select
{
	font-size:0.9em;
}

.chars2 { width:10%; }
.chars3 { width:15%; }
.chars4 { width:20%; }
.chars5 { width:25%; }
.chars6 { width:30%; }
.chars8 { width:40%; }
.chars10 { width:50%; }
.chars11 { width:55%; }
.chars12 { width:60%; }

select
{
	padding:0;
}

fieldset.cpanel input.text, fieldset.cpanel select
{
	border:1px solid #999;
	border-color:#4a4 #beb #beb #4a4;
}

.cpswitcher fieldset select  
{
	border:1px solid #f90;
	border-color:#99a #eef #eef #99a;
	font-size:0.9em;
}

#codeconf
{
	max-width:11em;
}








/* don't display js-dependent cp-actions */
label.codeonchange, label.codevalidate, label.codesplit, 
#cp-colors, .cpswitcher, #colortools, #fonttools
{
	display:none;
}









/* textareas */
textarea 
{
	width:99%;
	margin:0;
	background:#fffff7;
	border:1px solid #999;
	border-color:#4a4 #beb #beb #4a4;
	font:normal normal normal 0.9em "lucida sans console", "courier new", monospace;
}

#codeinput
{
	margin:0 0 0.5em 0;
	display:block;
}









/* buttons 
   the rest of the button styles are in main.css */
input.codeload
{
	font-size:0.75em;
	padding:0.05em 2px;
}

input[class~="codeload"]:active
{
	padding:0.05em 1px 0.05em 3px;
}










/* errors strip 
   the rest of the errors strip styles are in main.css */
#errors dl, #errors dt, #errors dd
{
	margin:0;
	padding:0;
	border:none;
	background:#fff7f7;
}

#errors dl
{
	font:normal normal normal 70% verdana, sans-serif;
	padding:0.2em 11px;
}

#errors dt, #errors dd
{
	line-height:170%;
}

#errors dt
{
	margin:0 0.5em 0 0;
	text-transform:none;
	font-weight:normal;
	float:left;
}









/* color tools */
fieldset.cpanel#colortools input.text
{
	margin-top:1px;
}

.swatch
{
	line-height:0;
	margin:4px 0 5px 1px;
	padding:1px 0 0 1px;
	display:none;
}

.swatch a, .swatch a:visited
{
	font:normal normal normal 0.85em courier,monospace;
	letter-spacing:2.25px;
	overflow:hidden;
	display:inline-block;
	cursor:crosshair;
	border-style:solid;
	border-color:#beb #4a4 #4a4 #beb;
	border-width:0 1px 1px 0;
	margin:-1px 0 0 -1px;
}

.plate
{
	display:block;
	border:1px solid #beb;
	background:#fff;
	border-color:#beb #4a4 #4a4 #beb;
	height:36px;
	margin:3px 0 0 0;
	width:95%;
}
.saveplate
{
	border-color:#4a4 #beb #beb #4a4;
	width:2.3em;
	height:22px;
	cursor:crosshair;
}

#memplate0 { margin:-26px 13px 0 8.65em; }
#memplate1 { margin:-24px 13px 0 11.4em; }
#memplate2 { margin:-24px 13px 0 14.1em; }

/* moz tweaks (compared with opera) */
fieldset.cpanel#colortools input[class^="text"]
{
	padding:0.1em 0.3em;
}
*[class*="swatch"]
{
	padding:0 0 1px 1px;
}
*[class*="plate"]
{
	margin:3px 0 0 0;
	width:93.5%;
}
*[class*="saveplate"].saveplate
{
	width:1.8em !important;
	height:17px;
}
*[class*="saveplate"]#memplate0 { margin:-21px 13px 0 10.2em; }
*[class*="saveplate"]#memplate1 { margin:-21px 13px 0 12.45em; }
*[class*="saveplate"]#memplate2 { margin:-21px 13px 0 14.7em; }




				








/* font tools */
#fonttools label.inline
{
	display:inline !important;
}
label[for="codefontbold"]
{
	font-weight:bold;
}
label[for="codefontitalic"]
{
	font-style:italic;
}
select#codefontdecoration
{
	width:6.6em;
}

#charmap
{
	display:block;
	font:normal normal normal 1.15em arial,sans-serif;
	margin:2px 0 0 0;
	padding:0.4em 0 0.55em 0;
	background:#fffff7;
	border:1px solid #beb;
	text-align:center;
	line-height:110%;
}
#charmap span, #charmap h4, #charmap p
{
	color:#555;
}
#charmap span
{
	font-size:0.95em;
	display:inline-block;
	padding:0 2% 0 2%;
}
#charmap h4
{
	margin:0.5em 0 0.5em -0.5em;
	padding:0;
	font:inherit;
}
#charmap p
{
	margin:0.3em 0 0 1.45em;
	padding:0;
	font:inherit;
	font-size:1em;
	width:80%;
}

/* moz tweaks */
map[id^="charmap"]#charmap span
{
	padding:0 0.85% 0 0.85%;
}
select[id^="codefontselect"]
{
	height:1.55em;
	font-size:1em;
}

select[id^="codefontselect"] optgroup
{
	font-family:"trebuchet ms",sans-serif;
	font-size:1.1em;
	background:#cec;
	color:#474;
}
select[id^="codefontselect"] optgroup option
{
	font-size:0.9em;
	background:#fffff7;
	color:#000;
}
select[id^="codefontselect"] optgroup.generic option
{
	font-size:1.1em;
}








/* ie hacks */
* html input.button
{
	padding:0;
}

* html input.radio, * html input.checkbox 
{
	background:transparent;
}

@media screen, projection
{
	* html fieldset
	{
		position:relative;
		padding-top:1.5em;
		margin-top:0.5em;
	}
	* html fieldset.demo-actions, * html fieldset.output-actions
	{
		padding-top:0;
		margin-top:0;
	}

	* html legend
	{
		position:absolute;
		left:2px;
	}
}