/* 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: 2px 2px 2px 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;
}