
.csTabbedTitle {
	margin: 15px 0 20px 15px;	
	font: 14px arial,sans-serif;
}

.csTabbedMode {
	margin: 0 0 20px 15px;
	font: 12px arial,sans-serif;	
}

.csTabbedInstanceID {
	margin: 0 0 20px 15px;
	font: 12px arial,sans-serif;	
}

.csTabbedRowButtons {
	width: 98%;
	border-top: 1px solid #CCCCCC;
	background-color: #E8E8E8;
	margin: 0 0 0 10px;
}

.csTabbedCellTitle {
	float: left; 
	width: 180px; 
	padding: 10px 0 0 10px;	
	font: 12px arial,sans-serif;
}

.csTabbedCell {
    background-color: #FFFFFF;
    float: left;
    margin: 0;
    padding: 10px 0 10px 10px;
    width: 50%;	
}

.csTabbedMessage {
	float: left; 
	width: 600px; 
	margin: 10px 0 3px 0; 
	color: blue; 
	font: 16px arial,sans-serif;	
}

.csTabbedConfigExplanation,
.csTabbedConfigExternalExplanation,
.csTabbedConfigIntroExplanation {
	font: 12px arial, helvetica, sans-serif;
	padding: 5px 0 10px 15px;
	width: 100%;
	border: 1px solid #CCCCCC;
	margin: 0 0 10px 10px;	
}

.csTabbedConfigExplanation {
	display: none;
}

.csTabbedConfigExplanation li,
.csTabbedConfigExternalExplanation li,
.csTabbedConfigIntroExplanation li {
	margin: 5px 0 5px 0;	
}

.csTabbedConfigExplanationExternal {
	font: 12px arial, helvetica, sans-serif;
	padding: 5px 0 10px 5px;
	width: 98%;
	margin: 0 0 0 10px;
}

/* ---------- Portlet Menu ---------- */

.editContentTabbed {
	background: #FFFFFF url("../images/application_edit.png") no-repeat center center;
	position: absolute;
	top: 2px;
	right: 2px;
	height: 18px;
	width: 28px;	
	cursor: pointer;
	z-index: 100;
	border: 1px solid #FFFFFF;
	border-top-left-radius: 5px 5px;
	-moz-border-top-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;		
	-moz-border-top-right-radius: 5px 5px;		
	border-bottom-left-radius: 5px 5px;		
	-moz-border-bottom-left-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	-moz-border-bottom-right-radius: 5px 5px;	
}

.tabbedContainer {
	margin: 20px 10px 20px 10px;
}

.tabbedSelection {
	float: left;
	width: 19%;
	margin: 20px 0 0 0;
	overflow-x: hidden;
	overflow-y: auto;
}

.tabbedSelectionList {
	padding: 0;
	margin: 0;
}

.tabbedEditor {
	float: left;
	width: 75%;
	margin: 20px 0 0 5px;
	padding: 0 20px 0 20px;
	border: 1px solid #CCCCCC;
	border-top-left-radius: 5px 5px;
	-moz-border-top-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;		
	-moz-border-top-right-radius: 5px 5px;		
	border-bottom-left-radius: 5px 5px;		
	-moz-border-bottom-left-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	-moz-border-bottom-right-radius: 5px 5px;	
	overflow: auto;
}

.tabbedSaveSortOrderLabel {
	width: 22%;
	margin: -15px 0 0 13px;
}

.tabbedCancel,
.tabbedSave,
.tabbedSetup,
.tabbedBack, 
.topNavBackButton, 
.csTabbedSave {
	padding: 4px 5px 0 5px;
	font: bold 12px arial,sans-serif;
	cursor: pointer;
	background-color: #EEE;
	border: 1px solid #CCC;
	height: 20px;
	padding: 5px;
	margin: 0 10px 0 5px;
	float: right;
}

.tabbedSave,
.tabbedBack {
	background-color: #C9D6E6;
}

.tabbedCancel {
	background-color: #FFFFFF;
}

.tabbedCancel,
.tabbedSave {
	display: none;
}

.tabbedEditLabel {
	font: 12px arial, helvetica, sans-serif;
	float: left;
	width: 15%;
	padding: 9px 0 0 0;
	margin: 10px 0 5px 0;
}

.tabbedEditValue {
	float: left;
	width: 75%;	
	margin: 10px 0 5px 0;
}

.tabbedEditTitle {
	float: left;
	width: 40%;
}

.tabbedEditDescription {
	float: left;
	width: 65%;	
}

.selectionContentContainer {
	border: 1px solid #CCCCCC;
	border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;	
}

.selectionItem,
.editSelectionItem {
	font: 14px arial,helvetica,sans-serif;		;
	padding: 10px;
	margin: 0 10px 10px 10px;
	cursor: pointer;
	border-top-left-radius: 5px 5px;
	-moz-border-top-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;		
	-moz-border-top-right-radius: 5px 5px;		
	border-bottom-left-radius: 5px 5px;		
	-moz-border-bottom-left-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	-moz-border-bottom-right-radius: 5px 5px;	
	text-align: center;			
}

.selectionItem,
.editSelectionItem {
	border: 1px solid #CCCCCC;
}

.editSelectionItem {
	list-style-type: none;
}

.notActive {
	border: 1px solid #DDDDDD;
	color: #CCCCCC;
}

.sortIcon {
	background: #FFFFFF url("../images/sortable.png") no-repeat left center;
}

.modifiedIcon {
	background: #FFFFFF url("../images/modified.png") no-repeat left center;
}

.modifiedNotActiveIcon {
	background: #FFFFFF url("../images/modified_notActive.png") no-repeat left center;
}

.editSelectionItemPlaceholder {		
	height: 20px;
	width: 200px;
	padding: 9px 0 5px 20px;
	margin: 0 0 6px 0;
	border: 1px solid #EEEEEE;
	list-style-type: none;	
	background-color: #EEEEEE;
	border-top-left-radius: 5px 5px;
	-moz-border-top-left-radius: 5px 5px;
	border-top-right-radius: 5px 5px;		
	-moz-border-top-right-radius: 5px 5px;		
	border-bottom-left-radius: 5px 5px;		
	-moz-border-bottom-left-radius: 5px 5px;
	border-bottom-right-radius: 5px 5px;
	-moz-border-bottom-right-radius: 5px 5px;		
}

.editSelectionItemCheckbox {
    left: 87%;
    margin: -18px 0 0;
    position: relative;
    text-align: right;
    top: 0;
    width: 30px;
}

.selectionItem:hover {
	background-color: #C9D6E6;
}

.activeSelectionItem {
	background-color: #C9D6E6;
}

.activeSelectionItemNotActive {
	color: #CCCCCC;
}

.selectionContent {
	font: 14px arial,helvetica,sans-serif;
	display: none;
	margin: 0 20px 20px 20px;
}

.selectionContent h4 {
	margin: 20px 0 20px 0;
}

.selectionContentTitle {
	display: none;	
}

/* ---------- Editor (jwysiwyg) ---------- */

.theContentIFrame {
	width: 95%;
}

/* ---------- Common ---------- */

.clearBoth {
	clear: both;
}

.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

.topNavOptions {
	width: 98%;
	margin: 0 0 10px 10px;
}

.topNavOption {
	float: left;
	padding: 0 0 0 10px;
	height: 24px;
	width: 90%;
	background-color: #EEEEEE;	
	border: 1px solid #CCCCCC;	
}

.configurationOptions {
	font: 12px arial, helvetica, sans-serif;
	border: 1px solid #CCCCCC;
	padding: 0;
	margin: 2px 0 0 0;	
}

.topNavBackButton {
	float: right;
	padding: 4px 5px 0 5px;
	font: bold 12px arial,sans-serif;
	cursor: pointer;
	background-color: #EEEEEE;	
	border: 1px solid #CCCCCC;
	height: 20px;
}

.cornerRadiusCell {
	float: left; 
	width: 50%; 
	margin: 8px 0 8px 10px;
	padding: 5px 5px 5px 50px;
}

.cornerRadiusLabel {
	float: left; 
	width: 80px; 
	margin: 2px 0 2px 0;
	padding: 5px 0 0 0;
}

.cornerRadiusInput {
	float: left; 
	width: 40px; 
	margin: 2px 0 2px 0;
}

.showIntroExplanation {
	font: 12px arial, helvetica, sans-serif;
	padding: 10px 0 10px 15px;
	width: 100%;
	border: 1px solid #CCCCCC;
	margin: 0 0 10px 10px;		
}
