/*

Ionize Form CSS

Copyright:
	Copyright (c) 2010 Ionize Dev Team.
	
License:
	MIT-style license.

*/



/* Form layout
---------------------------------------------------------------- */
form {
	width: 100%;
}

fieldset {
	border:none;
}


.panel dl.first,
.mocha dl.first {
	margin-top: 10px;
}

.panel dl.compact,
.mocha dl.compact {
	margin:0;
}

.panel dl,
.mocha dl {
	position:relative;
	margin:1px 0 0;
	overflow:hidden;
	margin-bottom:5px;
/*	min-width: 680px;	*/
}
.panel dl.last,
.mocha dl.last {
	padding-bottom:10px;
}
.panel dt,
.mocha dt {
	clear: left;
	float:left;
	margin:0 0 0 0;
	padding: 0;
	text-align:right;
	font-weight: normal;
/*	width:150px;*/
	min-width:130px;
	width:18%;
}
.panel dd,
.mocha dd {
	margin:0;
	margin-left: 22%;
	padding:0;
	width: 78%;
}
.panel dd.nomargin,
.mocha dd.nomargin {
	margin-left: 0;
	width: auto;
}

/* Small DL, used in sidecolun and in some windows */
.panel dl.small,
.mocha dl.small {
	min-width: inherit;
}
.panle dl.small dt,
.mocha dl dt {
	min-width:inherit;
	width:115px;
}
.panel dl.small dd,
.mocha dl.small dd {
	width:auto;
	min-width:inherit;
	margin-left:120px;
}

/* Deprecated, should be replaced in each view by :
	dl class="small"
dt.small {
	width:115px;
}
 */
#sidecolumn dl {
	min-width: inherit;
}
#sidecolumn dl dt {
	min-width:115px;
}
#sidecolumn dl dd {
	width:auto;
	min-width:inherit;
	margin-left:120px;
}
/* End deprecated */


/* Mocha Windows correction */
.mochaContent dd { 
	width: auto;
}
.mochaContent dl {
	min-width: inherit;
}


/* Form Elements
---------------------------------------------------------------- */

/* Standard label */
label {
	font-size: 11px;
	margin: 0 10px;
}
label[for] { cursor: pointer; }
label.required {}
label.help {
	border-bottom: dotted 1px #94aec9;
	background: url(../images/icon_12_label_help.png) no-repeat top right;
	padding-right: 14px;
}
label.toggler {
	display: block;
}
input, textarea, select {
	font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
	font-size:11px;
}
input.required, textarea.required, select.required{
	border-color: #b00;
}
textarea{
	border:1px solid #bbb;
	padding:3px;
}
.select {
	border:1px solid #bbb;
	padding:2px;
}
#options select {
	max-width: 150px;
}
.inputtext {
	border:1px solid #bbb;
	padding:3px;
}
.inputtext:focus,
textarea:focus {
	background-color: #fdfced;
}
input.italic {
	font-style: italic;
}
input.droppable,
textarea.droppable {
	font-style: italic;
	padding:5px;
}
input.droppable.empty,
textarea.droppable.empty {
	background-color:#fff;
	color:#999;
	border: dashed 1px #517798;
	border: dashed 1px #ccc;
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
input.nofocus,
input.droppable.nofocus,
textarea.nofocus,
textarea.droppable.nofocus {
	background-color:#f8f8f8;
}
.focus,
input.focus,
input.droppable.focus,
textarea.focus,
textarea.droppable.focus {
	background-color:#fdfced;
}


input.date {
	float:left;
	margin-right:5px;
}
.inputcheckbox {}
.inputradio {}
.inputicon {
	margin:0 0 0 5px;
}

/* Submit & button */
.button,
.submit {
/*	-moz-border-radius:4px;*/
	font-family:Arial,Helvetica,sans-serif;
	border:1px solid #fff;
	margin:0px;
	color:#FFFFFF;
	cursor:pointer;
	font-size:11px;
	padding:2px 6px;
	height: 24px;
	vertical-align: middle;
}

/* Special form elements */
#maincolumn .inputtext {
	width: 82%;
}



/* Yes button, No button */
.button.yes { background:url(../images/button-yes-bg.jpg) no-repeat 0 50%; }
.button.yes:hover { background:url(../images/button-yes-bg.jpg) no-repeat -200px 50%; }

.button.no { background:url(../images/button-no-bg.jpg) no-repeat 0 50% #bbb;}
.button.no:hover { background:url(../images/button-no-bg.jpg) no-repeat -200px 50%;}

.button.left {float:left;}
.button.right {float:right;}
/*.button {float:right;margin:0 2px;}*/
.button {margin:0 2px;}


/* Standard button and submit button */
.button { background:url(../images/button-bg.jpg) no-repeat 0 50%; }
.button:hover {	background:url(../images/button-bg.jpg) no-repeat -200px 50%; }

.submit { background:url(../images/submit-bg.jpg) no-repeat 0 50%; }
.submit:hover {	background:url(../images/submit-bg.jpg) no-repeat -200px 50%; }


/* Toolbar button */
.toolbar-button {
	-moz-border-radius:4px;
	font-family:Arial,Helvetica,sans-serif;
	border: 1px solid transparent;
	background-color: transparent;
	color:#098ED1;
	margin:0px;
	cursor:pointer;
	font-size:11px;
	padding:2px 6px;
	height: 24px;
	vertical-align: middle;
}
.toolbar-button.plus {
	background:url(../images/icon_16_plus.png) no-repeat 4px 50%;
	padding-left: 24px;
}
.toolbar-button.minus {
	background:url(../images/icon_16_minus.png) no-repeat 4px 50%;
	padding-left: 24px;
}
.toolbar-button:hover {
	border:1px solid #bbb;
}

/* Toolbox inputs */
.toolbox .inputtext, .toolbox .select {
	margin-top:2px;
}
.toolbox label,
.toolbox .icon {
	margin-top:4px;
}

/* IE Mocha form hacks */
* html .toolbox .searchField, * html .toolbox .searchButton { /* IE6 Hack */
	margin-top: -1px;		
}

* html .toolbox .button { /* IE6 Hack */
	vertical-align: top;
	margin-top: 0;			
}

*:first-child+html .toolbox .searchField, *:first-child+html .toolbox .searchButton { /* IE7 Hack */
	margin-top: -1px;	
}

*:first-child+html .toolbox .button { /* IE7 Hack */
	vertical-align: top;
	margin-top: 0;	
}
