@charset 'UTF-8';
/*
 * CREAM Client-side behavior (visual / action) phyical styles.
 *
 * Copyright 2012 Nicosys Co. Ltd.
 */

/*
 * Buttons
 */

a.cream-button-wide {
	width: 160px;
}

button.cream-button-wide {
	width: 186px;
}

/* 
 * Cream responsive forms
 *	
 * Large display:             Horizontal-form layout with multiple columns 
 * default, Portrait tablets: Stacked layout with multiple columns.
 * Phones to tablets:         Horizontal-form layout.
 * Phones:                    Stacked layout.
 *
 * based on form-horizontal
 */

/* Default */

.cream-role-form.form-horizontal .control-label {
	float: none;
	width: auto;
	padding-top: 0;
	text-align: left;
}

.cream-role-form.form-horizontal .controls {
	margin-left: 0;
}
.cream-role-form.form-horizontal .control-list {
	padding-top: 0;
}
.cream-role-form.form-horizontal .form-actions {
	padding-left: 10px;
	padding-right: 10px;
}

/* large display */
@media (min-width: 1200px) {

	/* shrink label area: 180px -> 150px */

	.cream-role-form.form-horizontal .control-label {
		float: left;
		width: 130px;
		padding-top: 5px;
		text-align: right;
	}
	.cream-role-form.form-horizontal .controls {
		margin-left: 150px;
		*margin-left: 0;
	}
	.cream-role-form.form-horizontal .controls:first-child {
		*padding-left: 150px;
	}
	
	.cream-role-form.form-horizontal .form-actions {
		padding-left: 150px;
	}
	
}

/* Landscape phone to portrait tablet  */
@media (min-width: 481px) and (max-width: 767px) {

	.cream-role-form.form-horizontal .control-label {
		float: left;
		width: 130px;
		padding-top: 5px;
		text-align: right;
	}
	.cream-role-form.form-horizontal .controls {
		margin-left: 150px;
		*margin-left: 0;
	}
	.cream-role-form.form-horizontal .controls:first-child {
		*padding-left: 150px;
	}
	
	.cream-role-form.form-horizontal .form-actions {
		padding-left: 150px;
	}
	
}

/* Landscape phones and down */
@media (max-width: 480px) {

}

.cream-form-bordered .row {
	border-top: 1px solid #dddddd;
}

.cream-form-bordered .row .control-group {
	margin-top: 10px;
	margin-bottom: 10px;
}

/*
 * multi column specific
 */

/* Default */

.cream-role-form-doublecol textarea.cream-form-input-spanned,
.cream-role-form-doublecol input.cream-form-input-spanned,
.cream-role-form-doublecol .uneditable-input.cream-form-input-spanned {
	width: 686px;
}
.cream-role-form-triplecol select.cream-form-input-spanned {
	width: 700px;
}

/* large display */
@media (min-width: 1200px) {
	.cream-role-form-doublecol textarea.cream-form-input-spanned,
	.cream-role-form-doublecol input.cream-form-input-spanned,
	.cream-role-form-doublecol textarea.cream-form-input-spanned,
	.cream-role-form-doublecol .uneditable-input.cream-form-input-spanned {
		width: 806px;
	}
	.cream-role-form-triplecol select.cream-form-input-spanned {
		width: 820px;
	}
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	.cream-role-form-doublecol textarea.cream-form-input-spanned,
	.cream-role-form-doublecol input.cream-form-input-spanned,
	.cream-role-form-doublecol .uneditable-input.cream-form-input-spanned {
		width: 578px;
	}
	.cream-role-form-triplecol select.cream-form-input-spanned {
		width: 592px;
	}
}

/* Landscape phones and down / Landscape phone to portrait tablet  */
@media (max-width: 767px) {

	.cream-role-form-doublecol textarea.cream-form-input-spanned,
	.cream-role-form-doublecol input.cream-form-input-spanned,
	.cream-role-form-doublecol .uneditable-input.cream-form-input-spanned {
		width: 206px;
	}
	.cream-role-form-triplecol select.cream-form-input-spanned {
		width: 220px;
	}
	
	.cream-role-form-doublecol.cream-form-bordered .row .span6 {
		border-top: 1px solid #dddddd;
		padding-top: 10px;
	}
	.cream-role-form-doublecol.cream-form-bordered .row .span6:first-child {
		border-top: 0;
		padding-top: 0;
	}

}

/*
 * Expander
 */

/* Auto collapse */

.cream-expander-toggle-icon {

	margin: 4px;
	vertical-align: middle;
	
	background-color: #fff;
	border: 1px solid #bbb;
	border: 1px solid rgba(0, 0, 0, 0.3);
	
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/*
 * Tables
 */

/* Stack table cell to vertical for small screens */

@media (max-width: 480px) {
	
	table.table {
		display: block;
	}
	
	table.table tr, table.table thead, table.table tbody, table.table tfoot, table.table td, table.table th {
		display: block;
		width: auto !important; 
	}

	table.table td, table.table th {
		text-align: left; /* override .number style */
		padding: 0;
		border-top: 0px none;
		border-bottom: 0px none;
		max-width: 470px !important; 
	}

	table.table td .input-block-level, table.table th .input-block-level {
		width: 80%;
	}

	table.table tr {
		padding: 4px 0;
		border-top: 1px solid rgb(221, 221, 221);
	}

	table.table th {
		line-height: inherit;
	}
	
	table.table td {
		min-height: 20px;
	}

	.table caption + tbody tr:first-child,
	.table colgroup + tbody tr:first-child,
	.table tbody:first-child tr:first-child {
		border-top: 0px none;
	}

	/* expand multi-columns */
	.table caption + tbody tr:first-child td ~ th,
	.table colgroup + tbody tr:first-child td ~ th,
	.table tbody:first-child tr:first-child td ~ th,
	.table td ~ th {
		margin-top: 4px;
		padding-top: 4px;
		border-top: 1px solid rgb(221, 221, 221);
	}

	table.table-bordered td, table.table-bordered th {
		padding-left: 4px;
		border-left: 0px none;
	}

	table.table-bordered tr {
		border-left: 1px solid rgb(221, 221, 221);
	}
	
	table.table-striped tbody > tr:nth-child(odd) {
		background-color:#f9f9f9;
	}

}
