/* Style Sheets for EXT */

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BUTTONS*/
.view {
	background-image: url("img/view.gif") !important;
}

.addUser {
	background-image: url("img/add_user.png") !important;
}

.create {
	background-image: url("img/create.gif") !important;
}

.edit {
	background-image: url("img/edit.png") !important;
}

.delete {
	background-image: url("img/delete.png") !important;
}

.save {
	background-image: url("img/save.gif") !important;
}

.cancel {
	background-image: url("img/cancel.gif") !important;
}

.default {
	background-image: url("img/default.png") !important;
}

.clear-form {
	background-image: url("img/clear.gif") !important;
}

.search {
	background-image: url("img/search.gif") !important;
}

.subscribe {
	background-image: url("img/subscribe.gif") !important;
}

.submit {
	background-image: url("img/submit.png") !important;
}

.close {
	background-image: url("img/green tick.png") !important;
}

.category {
	background-image: url("img/category.gif") !important;
	padding: 3px !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Ext Invalid Message */
.x-form-invalid-msg {
	color: #999999;
	padding: 2px 2px 5px 20px;
	margin-bottom: 5px;
	font: normal 11px tahoma, arial, helvetica, sans-serif;
	background: transparent url(img/panel_icon_warning.png) no-repeat 0 2px;
	line-height: 16px;
	width: 100%; /*width: auto;*/
	white-space: normal; /*white-space: nowrap;*/
}

label.x-form-invalid-msg, .x-form-invalid-msg label {
/*if we manually create an error message with a label*/
	padding: 4px 2px 3px 20px !important;
}

.x-form-invalid {
	background: transparent none;
}

textarea.x-form-invalid, input.x-form-invalid {
	background: #ffffff url(img/text-bg.gif) repeat-x scroll 0 0
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Page Number in Paging */
.x-tbar-page-number {
	border: 1px solid #CCCCCC;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Captcha Button */
.captcha-button, .captcha-button button, button.captcha-button {
	margin: 32px 10px 10px 10px;
	padding: 3px 8px 3px 8px;
	cursor: pointer;
	background: transparent url("img/refresh.gif") center center no-repeat;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Title in Edit Screens */
.edit-screen-title {
	padding: 20px 0 30px 50px;
	color: #003399;
	font-size: 14px;
	font-weight: bold;
	margin: 5px;
	border-bottom: 1px solid #009999;
}

div.edit-screen-title, .edit-screen-title div {
	background-color: #ffffcc;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Languages Group Div in Edit Screens */
.languages-group {
	color: #000000 !important;
	border-color: #CCCCCC gray gray #CCCCCC !important;
	border-width: 1px;
	border-style: solid;
	margin: 2px 0 5px -5px;
}

.languages-group, .languages-group label, .languages-group div {
	background-color: #CAC7B8;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The language label in Edit Screens */
span.language-label {
	font-weight: bold;
	padding: 10px 0 3px 18px;
	background: transparent url(img/default.png) left 10px no-repeat;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Border Style and  Background in forms and Panels */

.x-panel-header {
	border: 0;
	border-bottom: 1px solid #604E2A;
	background: transparent none;
}

.x-toolbar {
	background: #a7a18b none;
	border-width: 0 0 0;
}

.x-panel-body {
	background-color: transparent; /*!important;*/
	border: 1px solid #604E2A;
	border-top: 0;
}

.x-panel-tbar .x-toolbar {
	border: 1px solid #604E2A;
}

/*.x-panel-tbar, .x-panel-bbar{*/
/*background-color: #abaa95;    */
/*}*/

.x-panel-bbar .x-toolbar {
	border: 1px solid #604E2A;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ FieldSets */
.x-fieldset {
	border: 1px solid #604E2A;
}

.x-fieldset-header-text {
/*title*/
	color: #604e2a;
}

.x-fieldset-body {
	padding: 2px 0 5px 0;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Tab Panels */
.x-tab-panel-header {
	background-color: transparent;
}

ul.x-tab-strip-top {
/*Transparent Background in tabs*/
	padding-top: 10px;
	background: transparent !important;
}

.x-form-cb-label {
/*white-space: nowrap;*/
	width: 100% !important;
}

.x-tab-panel-header {
	padding-bottom: 0;
}

.x-tab-panel-noborder .x-tab-panel-header-noborder {
	border-bottom-width: 0;
}

ul.x-tab-strip-top {
	border-bottom: 1px solid #604E2A
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Toolbar */
.x-toolbar {
	background: transparent none !important;
	border-top: 0 !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ General Button CSS */

.x-btn {
	border-color: #FFFFFF #666666 #666666 #FFFFFF;
	border-style: solid;
	border-width: 1px;
	background-color: #d3d0c9;
}

.x-btn-left, .x-btn-center, .x-btn-right {
	background: transparent none !important;
}

.x-btn-over {
	background: #FFFFFF none !important;
}

.x-btn-click {
	border-color: #666666 #FFFFFF #FFFFFF #666666;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Ext Windows Layout */

.x-window-mc {
	background-color: #FFFFFF;
	border: 1px solid #604E2A;
}

body.x-body-masked .x-window-mc, body.x-body-masked .x-window-plain .x-window-mc {
/*xtheme-gray.css: line 354*/
	background-color: #FFFFFF;
	border: 1px solid #604E2A !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Mask when modal */
.ext-el-mask {
/*ext-all.css: line 41*/
	background-color: #666600;
	height: 100%;
	left: 0;
	opacity: 0.2;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 100;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Grid Panel Layout */
.x-grid3-header {
	border-top: 1px solid #604E2A;
}

.x-grid3-row-selected {
	background: #abaa95 none repeat scroll 0 0 !important;
	border: 1px solid #604E2A;
}

.x-grid3-row {
	width: 99% !important;
}

.x-grid3-hd-row td.ux-filtered-column {
	font-style: italic;
	font-weight: bold;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Combo List */
.x-combo-list {
	background: #CAC7B8 none;
}

.x-combo-list .x-combo-selected {
	background: #ABAA95 none repeat scroll 0 0;
	border: 1px dotted #CAC7B8 !important;
	color: #FFFFFF;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Display None CSS */

.x-display-none {
	display: none !important;
	height: 0;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Tree Layout */
.x-tree-selected {
	background: #abaa95 none repeat scroll 0 0 !important;
	border: 1px solid #604E2A;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Menus */
.x-menu {
/*ext-all.css (line 3243)*/
	border: 1px solid #000000;
	background: #CAC7B8 none !important;
	z-index: 15000;
	padding: 2px;
}

.x-menu-item-active {
	background: #abaa95 none;
	border: 1px solid #80321B;
	padding: 0;
}

.x-menu-sep {
/*ext-all.css (line 3289)*/
	background-color: #E0E0E0;
	border: 0;
	display: block;
	font-size: 1px;
	line-height: 1px;
	margin: 2px 3px;
	overflow: hidden;
}