/* ################################################################################################
###   LAUNCHER ICONS
################################################################################################ */
.launcher-about {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') 0 0;
}

.launcher-commentreview {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -64px 0;
}

.launcher-contactinformation {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -96px 0;
}

.launcher-dashboardadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -160px 0;
}

.launcher-euadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -192px 0;
}

.launcher-expressionadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -224px 0;
}

.launcher-groupadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -288px 0;
}

.launcher-mde {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -320px 0;
}

.launcher-notificationtemplateadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -384px 0;
}

.launcher-preferences {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -416px 0;
}

.launcher-organizationadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -448px 0;
}

.launcher-reportadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -480px 0;
}

.launcher-templateadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -544px 0;
}

.launcher-useradmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -576px 0;
}

.launcher-home {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -608px 0;
}

.launcher-adhoctrend {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -640px 0;
}

.launcher-daterange {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -672px 0;
}

.launcher-filter {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -704px 0;
}

.launcher-error {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -736px 0;
}

.launcher-termsandconditions {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -768px 0;
}

.launcher-filedownload {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -800px 0;
}

.launcher-reportdashboard {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -832px 0;
}

.launcher-hierarchyadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -896px 0;
}

.launcher-imagemanager {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -544px 0;
}
.launcher-templatepropertyadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -928px 0;
}

.launcher-dataimportadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -960px 0;
}

.launcher-dataexportadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -992px 0;
}

.launcher-elementadmin {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -1024px 0;
}

/* This one must be last so all the ones above can count upwards in position nicely.  Don't believe me?  Try it... ' */

.launcher-alwaysleavemelast {
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') 0;
}

/* ################################################################################################
###   LIBRARY ICONS
################################################################################################ */

.library-chart-cusum {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') 0 0;
}

.library-chart-histogram {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -32px 0;
}

.library-chart-line {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -64px 0;
}

.library-chart-movingavg {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -96px 0;
}

.library-chart-processcapability {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -128px 0;
}

.library-chart-scatter {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -160px 0;
}

.library-chart-statusdoughnut {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -192px 0;
}

.library-chart-xbar {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -224px 0;
}

.library-container-blind {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -256px 0;
}

.library-container-simple {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -288px 0;
}

.library-container-repeater {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -864px 0;
}

.library-container-grid {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -896px 0;
}

.library-datasource {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -320px 0;
}

.library-other-status {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -1088px 0;
}

.library-other-statistics {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -384px 0;
}

.library-other-daterange {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -416px 0;
}

.library-other-filedownload {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -448px 0;
}

.library-other-grid {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -480px 0;
}

.library-other-horizontalline {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -512px 0;
}

.library-other-image {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -544px 0;
}

.library-other-kpi {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -576px 0;
}

.library-other-guage {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -928px 0;
}

.library-other-value {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -608px 0;
}

.library-other-processvaluelist {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -640px 0;
}

.library-other-property {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -672px 0;
}

.library-other-propertygrid {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -704px 0;
}

.library-datasource-template {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -736px 0;
}

.library-other-pagenumberer {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -768px 0;
}

.library-other-grid-alt1 {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -832px 0;
}

.library-other-comment {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-launcher.png') -64px 0;
}

.library-other-label {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -800px 0;
}

.library-page-repeating {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -960px 0;
}

.library-page-title {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -992px 0;
}

.library-other-weather {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -1024px 0;
}

.library-other-assetmap {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -1056px 0;
}

.library-other-tank {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -1120px 0;
}

.library-other-tote {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') -1152px 0;
}

/* This one must be last so all the ones above can count upwards in position nicely.  Don't believe me?  Try it... ' */

.library-alwaysleavemelast {
   margin-left: 15px;
   width: 32px;
   height: 32px;
   background: url('../appicons/sprite-library.png') 0 0;
}

/* ############################################################################
### TAB ICONS
############################################################################ */

.tab-euadministrator {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') 0 0 !important;
}

.tab-expressionmanagement {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -14px 0 !important;
}

.tab-templateadministrator {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -28px 0 !important;
}

.tab-organizationadministrator {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -42px 0 !important;
}

.tab-process-value-high {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -56px 0 !important;
}

.tab-process-value-warning {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -70px 0 !important;
}

.tab-process-value-low {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -84px 0 !important;
}

.tab-process-value-unconfigured {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -98px 0 !important;
}

.tab-process-value-bad {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -112px 0 !important;
}

.tab-dashboardadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -140px 0 !important;
}

.tab-dashboarddesigner {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -154px 0 !important;
}

.tab-commentreview {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -196px 0 !important;
}

.tab-groupadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -224px 0 !important;
}

.tab-homepage {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -238px 0 !important;
}

.tab-imagemanager {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -420px 0 !important;
}

.tab-manualdataentry {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -252px 0 !important;
}

.tab-reportadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -266px 0 !important;
}

.tab-useradmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -280px 0 !important;
}

.tab-notificationtemplateadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -308px 0 !important;
}

.tab-adhoctrend {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -322px 0 !important;
}

.tab-hierarchyadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -336px 0 !important;
}

.tab-templatepropertyadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -350px 0 !important;
}

.tab-dataimportadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -364px 0 !important;
}

.tab-dataexportadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -378px 0 !important;
}

.tab-elementadmin {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -392px 0 !important;
}

.tab-presentationtemplate {
   width: 14px !important;
   height: 14px !important;
   background: url('../appicons/sprite-tab.png') -406px 0 !important;
}

/* This one must be last so all the ones above can count upwards in position nicely.  Don't believe me?  Try it... ' */

.tab-alwaysleavemelast {
   width: 14px;
   height: 14px;
   background: url('../appicons/sprite-tab.png') 0 0;
}

/* ############################################################################
### BUTTON ICONS
############################################################################ */

.button-tohierarchy {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') 0 0 !important;
}

.button-adhoc {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') -16px 0 !important;
}

.button-manualdataentry {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') -32px 0 !important;
}

.button-setlimits {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') -48px 0 !important;
}

.button-datavalidation {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') -80px 0 !important;
}

/* This one must be last so all the ones above can count upwards in position nicely.  Don't believe me?  Try it... ' */

.button-alwaysleavemelast {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-button.png') 0 0;
}

/* ############################################################################
### TOOLBAR ICONS
############################################################################ */

.toolbar-daterange {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') 0 0 !important;
}

.toolbar-add {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -16px 0 !important;
}

.toolbar-properties {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -32px 0 !important;
}

.toolbar-remove {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -48px 0 !important;
}

.toolbar-acknowledge {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -64px 0 !important;
}

.toolbar-comment {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -80px 0 !important;
}

.toolbar-filter {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -96px 0 !important;
}

.toolbar-refresh {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -112px 0 !important;
}

.toolbar-revert {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -128px 0 !important;
}

.toolbar-view {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -144px 0 !important;
}

.toolbar-approve {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -160px 0 !important;
}

.toolbar-deny {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -176px 0 !important;
}

.toolbar-manage-conversions {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -192px 0 !important;
}

.toolbar-componentlist {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -208px 0 !important;
}

.toolbar-select-all {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -224px 0 !important;
}

.toolbar-select-none {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -240px 0 !important;
}

.toolbar-switch {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -256px 0 !important;
}

.toolbar-impersonate-user {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -272px 0 !important;
}

.toolbar-export {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -288px 0 !important;
}

.toolbar-design {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -304px 0 !important;
}

.toolbar-quickview {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -320px 0 !important;
}

.toolbar-options {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -336px 0 !important;
}

.toolbar-singlecolumn {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -352px 0 !important;
}

.toolbar-dualcolumn {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -368px 0 !important;
}

.toolbar-markread {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -384px 0 !important;
}

.toolbar-pivot {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -400px 0 !important;
}

.toolbar-printer {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -416px 0 !important;
}

.toolbar-upload {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -432px 0 !important;
}

.toolbar-grid {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -448px 0 !important;
}

.toolbar-copy {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') -464px 0 !important;
}

/* This one must be last so all the ones above can count upwards in position nicely.  Don't believe me?  Try it... ' */

.toolbar-alwaysleavemelast {
   width: 16px;
   height: 16px;
   background: url('../appicons/sprite-toolbar.png') 0 0;
}

/* ############################################################################
### TREE ICONS
############################################################################ */

.x-tree-icon {
   background: transparent url(../appicons/folder.png) no-repeat scroll 50% 50% !important;
}

.x-grid-tree-node-expanded .x-tree-icon {
   background: transparent url(../appicons/folder_open.png) no-repeat scroll 50% 50% !important;
}

.x-tree-noicon .x-tree-icon,
.x-tree-noicon .x-tree-icon-parent,
.customer-error .x-tree-icon,
.country-error .x-tree-icon,
.facility-error .x-tree-icon,
.unitoperation-error .x-tree-icon,
.coolingtower-error .x-tree-icon,
.boiler-error .x-tree-icon,
.device-error .x-tree-icon,
.datapoint-error .x-tree-icon {
   background: transparent url(../appicons/transparent.png) no-repeat scroll 50% 50% !important;
}

.dem-parent .x-tree-icon,
.dim-parent .x-tree-icon-parent {
   background-image: url('../appicons/folder.png') !important;
}

.dim-parent .x-tree-icon,
.dim-parent .x-tree-icon-parent {
   background-image: url('../appicons/tags.png') !important;
}

.dim-child .x-tree-icon,
.dim-child .x-tree-icon-parent {
   background-image: url('../appicons/tag.png') !important;
}

.no-renderer {
   color: #252525 !important;
}
.no-renderer:hover {
   text-decoration: none !important;
}

.renderer {
   color: #3E9BD5;
   text-decoration: none;
   cursor: pointer;
}

.renderer:hover {
    color: #3E9BD5;
    text-decoration: underline;
    cursor: pointer;
}

.state .x-tree-icon,
.state .x-tree-icon-parent {
   background: transparent url(../../localresources/icons/state@14x14.png) no-repeat scroll 50% 50% !important;
}

.city .x-tree-icon,
.city .x-tree-icon-parent {
   background: transparent url(../../localresources/icons/city@14x14.png) no-repeat scroll 50% 50% !important;
}

.process .x-tree-icon,
.process .x-tree-icon-parent {
   background: transparent url(../../localresources/icons/process@16x16.png) no-repeat scroll 50% 50% !important;
}

.customer .x-tree-icon,
.customer .x-tree-icon-parent {
   background-image: url(../../localresources/icons/customer@16x16.png) !important;
}

.country .x-tree-icon,
.country .x-tree-icon-parent {
   background-image: url('../../localresources/icons/country@16x16.png') !important;
}

.facility .x-tree-icon,
.facility .x-tree-icon-parent {
   background-image: url(../../localresources/icons/facility@16x16.png) !important;
}

.unitoperation .x-tree-icon,
.unitoperation .x-tree-icon-parent {
   background-image: url(../../localresources/icons/unitoperation@16x16.png) !important;
}

/*.coolingtower .x-tree-icon, .coolingtower .x-tree-icon-parent { background-image:url(../../localresources/icons/coolingtower@16x16.png) !important; }*/

.coolingtower .x-tree-icon,
.coolingtower .x-tree-icon-parent {
   background: transparent url(../../localresources/icons/coolingtower@16x16.png) no-repeat scroll 50% 50% !important;
}

.boiler .x-tree-icon,
.boiler .x-tree-icon-parent {
   background-image: url(../../localresources/icons/boiler@16x16.png) !important;
}

.device .x-tree-icon-parent {
   background-image: url(../../localresources/icons/device@16x16.png) !important;
}

.expander .x-tree-icon,
.expander .x-tree-icon-parent {
   background-image: url('../images/nav_right_14x14.png') !important;
}

.datapoint .x-tree-icon,
.datapoint .x-tree-icon-parent {
   background-image: url(../../localresources/icons/datapoint@16x16.png) !important;
}

/*Solar Tree Icons*/

.array .x-tree-icon,
.array .x-tree-icon-parent {
   background-image: url('../../localresources/icons/array@16x16.png') !important;
}

.inverter .x-tree-icon,
.inverter .x-tree-icon-parent {
   background-image: url('../../localresources/icons/device@16x16.png') !important;
}

.site .x-tree-icon,
.site .x-tree-icon-parent {
   background-image: url('../../localresources/icons/facility@16x16.png') !important;
}

.fund .x-tree-icon,
.fund .x-tree-icon-parent {
   background-image: url('../../localresources/icons/customer@16x16.png') !important;
}

.portfolio .x-tree-icon,
.portfolio .x-tree-icon-parent {
   background-image: url('../../localresources/icons/customer@16x16.png') !important;
}

.metstationhierarchy .x-tree-icon,
.metstationhierarchy .x-tree-icon-parent {
   background-image: url('../../localresources/icons/metstation@16x16.png') !important;
}

/* ############################################################################
### FAVORITE ICONS
############################################################################ */

.fav-city {
   background: transparent url(../../localresources/icons/city@14x14.png) no-repeat scroll 50% 50% !important;
}

.fav-facility {
   background: transparent url(../../localresources/icons/facility@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-unitoperation {
   background: transparent url(../../localresources/icons/unitoperation@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-coolingtower {
   background: transparent url(../../localresources/icons/coolingtower@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-boiler {
   background: transparent url(../../localresources/icons/boiler@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-metre {
   background: transparent url(../images/icons/hardware-hard-disk-3-Grey-16x16@14.png) no-repeat scroll 50% 50% !important;
}

.fav-customer {
   background: transparent url(../../localresources/icons/customer@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-process {
   background: transparent url(../images/icons/91-beaker-2-16x16@14.png) no-repeat scroll 50% 50% !important;
}

.fav-datapoint {
   background: transparent url(../../localresources/icons/datapoint@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-device,
.fav-deviceflowcal {
   background: transparent url(../../localresources/icons/device@16x16.png) no-repeat scroll 50% 50% !important;
}

.fav-text {
   text-decoration: none;
   color: #252525;
}

   .fav-text:hover {
      text-decoration: underline;
   }

/*Solar FAVORITE ICONS Icons*/

.fav-array {
   background: transparent url('../../localresources/icons/array@16x16.png') no-repeat scroll 50% 50% !important;
}

.fav-inverter {
   background: transparent url('../../localresources/icons/device@16x16.png') no-repeat scroll 50% 50% !important;
}

.fav-site {
   background: transparent url('../../localresources/icons/facility@16x16.png') no-repeat scroll 50% 50% !important;
}

.fav-fund {
   background: transparent url('../../localresources/icons/customer@16x16.png') no-repeat scroll 50% 50% !important;
}

.fav-portfolio {
   background: transparent url('../../localresources/icons/customer@16x16.png') no-repeat scroll 50% 50% !important;
}

.d-form-cb-label-after {
   float: right;
}

@-webkit-keyframes spin {
   from {
      -webkit-transform: rotate(0deg);
   }

   to {
      -webkit-transform: rotate(360deg);
   }
}

@-moz-keyframes spin {
   from {
      -moz-transform: rotate(0deg);
   }

   to {
      -moz-transform: rotate(360deg);
   }
}

@-ms-keyframes spin {
   from {
      -ms-transform: rotate(0deg);
   }

   to {
      -ms-transform: rotate(360deg);
   }
}

.spin {
   -webkit-animation-name: spin;
   -webkit-animation-duration: 1500ms; /* 10 seconds */
   -webkit-animation-iteration-count: infinite;
   -webkit-animation-timing-function: linear;
   -moz-animation-name: spin;
   -moz-animation-duration: 1500ms; /* 10 seconds */
   -moz-animation-iteration-count: infinite;
   -moz-animation-timing-function: linear;
   -ms-animation-name: spin;
   -ms-animation-duration: 1500ms; /* 10 seconds */
   -ms-animation-iteration-count: infinite;
   -ms-animation-timing-function: linear;
}

/* ############################################################################
### COMPONENT STYLES - STIE SUMMARY
############################################################################ */

.d-sitesummary-with-darker-row-lines .x-grid-cell {
   border-bottom-color: #D0D0D0;
   border-top-color: #FAFAFA;
   border-width: 1px 0;
}

.d-sitesummary-cell-inner-padding div {
   padding: 0px;
}

/* ############################################################################
### COMPONENT STYLES - LEVEL
############################################################################ */

.d-level-verticalprogress-normalpriority {
   background-color: #CCFFCC !important;
   border-color: #007F00 !important;
   border-width: 1px !important;
   width: 20px !important;
}

   .d-level-verticalprogress-normalpriority .x-verticalprogress-bar {
      background-image: -webkit-linear-gradient(left, #7FFF7F, #66E566 50%, #4CCC4C 51%, #33B233) !important;
      background-image: -moz-linear-gradient(left, #7FFF7F, #66E566 50%, #4CCC4C 51%, #33B233) !important;
      background-image: -o-linear-gradient(left, #7FFF7F, #66E566 50%, #4CCC4C 51%, #33B233) !important;
      background-image: -ms-linear-gradient(left, #7FFF7F, #66E566 50%, #4CCC4C 51%, #33B233) !important;
      background-image: linear-gradient(left, #7FFF7F, #66E566 50%, #4CCC4C 51%, #33B233) !important;
      border-top-color: #007F00 !important;
   }

.d-level-verticalprogress-mediumpriority {
   background-color: #FFF3CC !important;
   border-color: #B29533 !important;
   border-width: 1px !important;
   width: 20px !important;
}

   .d-level-verticalprogress-mediumpriority .x-verticalprogress-bar {
      background-image: -webkit-linear-gradient(left, #FFD64C, #E5BD33 50%, #CCA319 51%, #B28A00) !important;
      background-image: -moz-linear-gradient(left, #FFD64C, #E5BD33 50%, #CCA319 51%, #B28A00) !important;
      background-image: -o-linear-gradient(left, #FFD64C, #E5BD33 50%, #CCA319 51%, #B28A00) !important;
      background-image: -ms-linear-gradient(left, #FFD64C, #E5BD33 50%, #CCA319 51%, #B28A00) !important;
      background-image: linear-gradient(left, #FFD64C, #E5BD33 50%, #CCA319 51%, #B28A00) !important;
      border-top-color: #B29533 !important;
   }

.d-level-verticalprogress-highpriority {
   background-color: #FFCCCC !important;
   border-color: #990000 !important;
   border-width: 1px !important;
   width: 20px !important;
}

   .d-level-verticalprogress-highpriority .x-verticalprogress-bar {
      background-image: -webkit-linear-gradient(left, #FF4C4C, #E53333 50%, #CC1919 51%, #B20000) !important;
      background-image: -moz-linear-gradient(left, #FF4C4C, #E53333 50%, #CC1919 51%, #B20000) !important;
      background-image: -o-linear-gradient(left, #FF4C4C, #E53333 50%, #CC1919 51%, #B20000) !important;
      background-image: -ms-linear-gradient(left, #FF4C4C, #E53333 50%, #CC1919 51%, #B20000) !important;
      background-image: linear-gradient(left, #FF4C4C, #E53333 50%, #CC1919 51%, #B20000) !important;
      border-top-color: #990000 !important;
   }

.d-level-verticalprogress-unconfiguredpriority {
   background-color: #E5E5E5 !important;
   border-color: #666666 !important;
   border-width: 1px !important;
   width: 20px !important;
}

   .d-level-verticalprogress-unconfiguredpriority .x-verticalprogress-bar {
      background-image: -webkit-linear-gradient(left, #CCCCCC, #B2B2B2 50%, #999999 51%, #7F7F7F) !important;
      background-image: -moz-linear-gradient(left, #CCCCCC, #B2B2B2 50%, #999999 51%, #7F7F7F) !important;
      background-image: -o-linear-gradient(left, #CCCCCC, #B2B2B2 50%, #999999 51%, #7F7F7F) !important;
      background-image: -ms-linear-gradient(left, #CCCCCC, #B2B2B2 50%, #999999 51%, #7F7F7F) !important;
      background-image: linear-gradient(left, #CCCCCC, #B2B2B2 50%, #999999 51%, #7F7F7F) !important;
      border-top-color: #666666 !important;
   }

.d-level-verticalprogress-badpriority {
   background-color: #E5E5E5 !important;
   border-color: #000000 !important;
   border-width: 1px !important;
   width: 20px !important;
}

   .d-level-verticalprogress-badpriority .x-verticalprogress-bar {
      background-image: -webkit-linear-gradient(left, #4C4C4C, #333333 50%, #191919 51%, #000000) !important;
      background-image: -moz-linear-gradient(left, #4C4C4C, #333333 50%, #191919 51%, #000000) !important;
      background-image: -o-linear-gradient(left, #4C4C4C, #333333 50%, #191919 51%, #000000) !important;
      background-image: -ms-linear-gradient(left, #4C4C4C, #333333 50%, #191919 51%, #000000) !important;
      background-image: linear-gradient(left, #4C4C4C, #333333 50%, #191919 51%, #000000) !important;
      border-top-color: #000000 !important;
   }

.appheader .x-toolbar-default {
   background-image: none !important;
}

.appheader .x-panel-body-default {
   border: none !important;
}

.appheader .x-btn-default-toolbar-small .x-btn-inner {
   color: #ffffff;
}

.appheader .x-toolbar-text {
   color: #ffffff !important;
}

.schedule-recurence-1 div {
}

.schedule-recurence-2 div {
}

.schedule-recurence-3 div {
   padding: 0px;
}

.x-tool-move {
   background-position: 0 -360px;
}

.x-tool-over .x-tool-move {
   background-position: -15px -360px;
   border: 1px solid gray;
}

.d-context-wrap {
   overflow: hidden;
   border: 1px solid white;
}

.d-context-wrap-selected {
   background-color: lightblue;
   border: 1px solid gray !important;
}

.d-container-page-repeating {
   top: 5px;
   left: 5px;
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
   opacity: 0.5;
}

.d-actioncolumn {
   cursor: pointer !important;
}

.d-component-propertygrid {
   padding: 5px;
   background: -moz-linear-gradient(top, #fff 0%, #f1f1f1) !important;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1)) !important;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
   border: 1px solid #b9b9b9;
}

   .d-component-propertygrid div div div div {
      background: none repeat scroll 0 0 transparent;
   }

.d-tree-scroll-fix {
   overflow: auto;
}

.panelOverflowOverride .x-panel-body,
.panelOverflowOverride .x-panel,
.panelOverflowOverride .highcharts-container,
.panelOverflowOverride {
   overflow: visible !important;
}

.d-tree-scroll-fix table {
   width: auto !important;
   padding-right: 5px !important;
}

.d-action-col-icon {
   margin-right: 5px;
   cursor: hand;
}

.d-action-col-icon-PDF {
   background: transparent url(../../resources/images/PDF-icon.gif) no-repeat !important;
}

.d-action-col-icon-DOC {
   background: transparent url(../../resources/images/Word-icon.png) no-repeat !important;
}

.d-action-col-icon-XLS {
   background: transparent url(../../resources/images/Excel-icon.png) no-repeat !important;
}

.d-chart-toolbar {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
   opacity: 0.7;
}

.d-component-preview div {
   border-color: transparent;
   background-color: transparent;
   background-image: none;
}

.d-component-flagged {
   border-color: red;
   background-color: pink;
   border-width: 1px !important;
}

.x-toolbar-item .x-form-trigger {
   height: 22px;
}

.x-grid-checkcolumn-notset {
   background-position: 0 -39px;
}

input.tristate-checkbox {
   position: absolute;
   overflow: hidden;
   clip: rect(0 0 0 0);
   height: 1px;
   width: 1px;
   margin: -1px;
   padding: 0;
   border: 0;
}

   input.tristate-checkbox + label.tristate-checkbox-label {
      padding-left: 14px;
      height: 14px;
      display: inline-block;
      line-height: 14px;
      background-repeat: no-repeat;
      background-position: 0 0;
      font-size: 14px;
      vertical-align: middle;
      cursor: pointer;
   }

.tristate-checkbox + label.tristate-checkbox-label {
   background-image: url('../images/tristate-checkbox/checkbox_sprite.gif');
   background-repeat: no-repeat;
}

input.tristate-checkbox + label.tristate-checkbox-label {
   background-position: 0 -14px;
}

   input.tristate-checkbox + label.tristate-checkbox-label:hover {
      background-position: 0 -28px;
   }

input.tristate-checkbox[checked] + label.tristate-checkbox-label {
   background-position: 0 -56px;
}

   input.tristate-checkbox[checked] + label.tristate-checkbox-label:hover {
      background-position: 0 -70px;
   }

input.tristate-checkbox[partial][checked] + label.tristate-checkbox-label {
   background-position: 0 -98px;
}

   input.tristate-checkbox[partial][checked] + label.tristate-checkbox-label:hover {
      background-position: 0 -112px;
   }

input.tristate-checkbox[disabled] + label.tristate-checkbox-label {
   background-position: 0 0;
}

input.tristate-checkbox[disabled][checked] + label.tristate-checkbox-label {
   background-position: 0 -42px;
}

input.tristate-checkbox[disabled][partial][checked] + label.tristate-checkbox-label {
   background-position: 0 -84px;
}

.x-mask-msg-large {
   -moz-border-radius: 0px;
   border-radius: 0;
   background: transparent;
   border: 0 solid #A49696;
}

   .x-mask-msg-large div {
      background: url("../../localresources/Loading-Page.png") no-repeat scroll 50% 50% white;
      border: 0 solid #A49696;
      color: #252525;
      font-size: 14px;
      font-weight: bold;
      height: 182px;
      padding: 15px 10px 5px 20px;
      width: 500px;
      text-align: center;
   }

.x-mask-loading-position {
   top: 100px;
   left: -125px;
   position: absolute;
}

.x-mask {
   background-color: #fff;
   height: 100%;
   left: 0;
   opacity: 0.5;
   position: absolute;
   top: 0;
   width: 100%;
}

.x-mask-msg {
   z-index: 999999 !important;
}

.topBannerPreLoad {
   background: #fff;
   display: none;
}

.topBannerPostLoad {
   position: absolute;
   top: 0;
   width: 100%;
   height: 75px;
   background-color: #CCC;
   z-index: -1;
   -moz-box-shadow: 0 5px 5px rgb(150, 150, 150);
   -webkit-box-shadow: 0px 5px 5px rgb(150, 150, 150);
   box-shadow: 0 5px 5px rgb(150, 150, 150);
}

.loadingDiv {
   background: url("../../localresources/Loading-Page.png") no-repeat scroll 0px 0px;
   width: 500px;
   height: 182px;
   position: absolute;
   left: 50%;
   top: 50%;
   margin: -75px 0 0 -135px;
}

.d-edit-bold {
   background-position: 0 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-italic {
   background-position: -16px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-underline {
   background-position: -32px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-left-align {
   background-position: -112px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-center-align {
   background-position: -128px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-right-align {
   background-position: -144px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.d-edit-color {
   background-position: -176px 0;
   background-image: url('//cdnjs.cloudflare.com/ajax/libs/extjs/4.2.1/resources/themes/images/default/editor/tb-sprite.gif');
}

.viewport {
   background-color: transparent;
   -webkit-transform: translate3D(0, 0, 0);
}

.d-grid-nolines .x-grid-body .x-grid-view .x-grid-table tbody .x-grid-row .x-grid-cell {
   border-style: none;
}

.mainview,
.mainview-body {
   background-color: #fff;
}

.x-tab-adhoc {
   z-index: 101;
   position: absolute;
   box-shadow: 0 0 5px rgba(0, 0, 255, 1);
   -webkit-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
   -moz-box-shadow: 0 0 5px rgba(0, 0, 255, 1);
   -ms-filter: "progid:DXImageTransform.Microsoft.glow(color=blue,strength=3)";
   border: solid 1px #0000ff !important;
   border-top: none !important;
}

.status-bar {
   border-top: solid 1px #D0D0D0 !important;
}

.header-form {
   background-color: rgba(0, 0, 0, 0.2);
   height: 50px !important;
}

.launcher {
   border: 1px solid #d9d9d9;
   border-radius: 3px;
   cursor: pointer !important;
   background: -moz-linear-gradient(top, #fff 0, #f1f1f1) !important;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f1f1f1)) !important;
   background: -ms-linear-gradient(top, #fff 0, #f1f1f1 100%) !important;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   -moz-box-shadow: 0 1px 3px rgba(143, 143, 143, 0.5), inset 0 0 2px rgba(253, 253, 253, 1);
   -webkit-box-shadow: 0px 1px 3px rgba(143, 143, 143, 0.5), inset 0 0 2px rgba(253, 253, 253, 1);
   box-shadow: 0 1px 3px rgba(143, 143, 143, 0.5), inset 0 0 2px rgba(253, 253, 253, 1);
   padding: 5px;
}

   .launcher:hover {
      border: 1px solid #b9b9b9;
      background: -moz-linear-gradient(top, #f1f1f1 0, #E1E1E1) !important;
      background: -webkit-gradient(linear, left top, left bottom, from(#f1f1f1), to(#E1E1E1)) !important;
      background: -ms-linear-gradient(top, #f1f1f1 0, #E1E1E1 100%) !important;
   }

   .launcher:active {
      border: 1px solid #b9b9b9;
      background: -moz-linear-gradient(top, #E1E1E1 0, #f1f1f1) !important;
      background: -webkit-gradient(linear, left top, left bottom, from(#E1E1E1), to(#f1f1f1)) !important;
      background: -ms-linear-gradient(top, #E1E1E1 0, #f1f1f1 100%) !important;
   }

   .launcher label {
      cursor: pointer;
   }

.launcher-pressed {
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c1c1c1', endColorstr='#d1d1d1') !important;
   background: -webkit-gradient(linear, left top, left bottom, from(#c1c1c1), to(#d1d1d1)) !important;
   background: -moz-linear-gradient(top, #c1c1c1 0, #d1d1d1) !important;
   cursor: pointer !important;
   border: 1px solid #a39695;
}

.language-label {
   width: 120px;
   float: left;
   margin-top: 10px;
   border: none;
   background-image: none;
   background-color: transparent;
   border-radius: 0px;
   border-bottom: solid 3px transparent;
}

.language-label:hover {
   margin-top: 10px;
   border: none;
   background-image: none;
   background-color: transparent;
   border-bottom: solid 3px #00BAFF;
   border-radius: 0;
}

.launcherTitle {
   font-weight: bold;
   color: #252525;
   text-shadow: 1px 1px 2px #DDD;
}

.statusbarLight {
   font-weight: lighter;
   font-style: italic;
   color: Gray;
}

.launcherSubTitle {
   font-weight: lighter;
   font-style: italic;
   font-size: 10px;
   color: Gray;
}

.postbit {
   border: 1px solid #D7D7D7;
   clear: both;
   color: #3E3E3E;
   display: block;
   float: left;
   position: relative;
   width: 100%;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
}

   .postbit .posthead {
      background: none repeat scroll 0 0 #E0E0E0;
      border-bottom: 1px solid #D7D7D7;
      clear: both;
      color: #777777;
      display: block;
      float: left;
      padding: 4px 0;
      width: 100%;
   }

   .postbit .postdetails {
      background: none repeat scroll 0 0 #F3F3F3;
      float: left;
      width: 100%;
   }

   .postbit .posthead .postdate {
      background: url("../images/icons/08-chat.png") no-repeat scroll left center transparent;
      height: 30px;
      margin-left: 10px;
      padding-left: 30px;
      padding-top: 0;
      color: #018BB6;
   }

      .postbit .posthead .postdate p {
         margin: 0;
      }

   .postbit .postrow {
      padding: 10px;
      background-color: #FFF;
      white-space: normal;
   }

   .postbit:hover .postfoot {
      visibility: visible;
   }

   .postbit .postfoot {
      background: none repeat scroll 0 0 transparent;
      clear: both;
      display: block;
      float: left;
      position: relative;
      right: 0;
      width: 100%;
      border-bottom-right-radius: 4px;
      border-bottom-left-radius: 4px;
      visibility: hidden;
   }

      .postbit .postfoot .postcontrols {
         float: right;
         padding-right: 10px;
         text-align: right;
         width: 50%;
      }

span.postcontrols {
   opacity: 0.35;
}

.postbit .postrow ul li {
   list-style: disc;
}

.postbit .postrow ol li {
   list-style: decimal;
}

.postbit .postrow ul {
   padding-left: 30px;
}

.postbit .postrow ol {
   padding-left: 25px;
}

.d-grid-row-hidden {
   display: none;
}

.d-grid-row-disabled {
   color: gray;
}

/*
.d-grid-row-mde-due
{
   color:#FF7000;
}

.d-grid-row-mde-overdue
{
   color:#FF0000;
}
*/

.d-grid-row-FF0000 {
   color: #FF0000;
}

.d-grid-row-FFC000 {
   color: #FFC000;
}

.d-grid-row-FFFF00 {
   color: #FFFF00;
}

.d-grid-row-92D050 {
   color: #92D050;
}

.d-grid-row-00B050 {
   color: #00B050;
}

.d-grid-row-00B0F0 {
   color: #00B0F0;
}

.d-grid-row-0070C0 {
   color: #0070C0;
}

.d-grid-row-002060 {
   color: #002060;
}

.d-grid-row-7030A0 {
   color: #7030A0;
}

.d-grid-row-FF00FF {
   color: #FF00FF;
}

.d-grid-row-4F81BD {
   color: #4F81BD;
}

.d-grid-row-C0504D {
   color: #C0504D;
}

.d-grid-row-9BBB59 {
   color: #9BBB59;
}

.d-grid-row-8064A2 {
   color: #8064A2;
}

.d-grid-row-4BACC6 {
   color: #4BACC6;
}

.d-grid-row-F79646 {
   color: #F79646;
}

.d-grid-row-italic td div {
   font-style: italic;
}

.d-grid-row-bold td div {
   font-weight: bold;
}

.d-grid-row-disabled td {
   font-style: italic !important;
}

td.cell-disabled {
   color: gray;
   font-style:italic;
}

.panel-userimpersonation {
   border: 1px solid #D7D7A1;
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
   border-radius: 2px;
   background-color: #FFFFDD;
   -moz-box-shadow: 0 0 3px 0 rgba(190, 190, 190, 0.6);
   -webkit-box-shadow: 0 0 3px 0 rgba(190, 190, 190, 0.6);
   box-shadow: 0 0 3px 0 rgba(190, 190, 190, 0.6);
}

.x-toolbar-notification {
   font-size: 11px;
   border: 1px solid #D0D0D0;
   background-color: #FED557 !important;
   background-image: none !important;
   box-shadow: 1px 3px 3px 0 #888888;
}

/* ############################################################################
### MENU ICONS
############################################################################ */

.dmenu-desigerpage {
   background-image: url(../images/icons/iconic/document_stroke_16x16.png) !important;
}

.dmenu-component-moveup {
   background-image: url(../images/icons/iconic/arrow_up_16x16.png) !important;
}

.dmenu-component-movedown {
   background-image: url(../images/icons/iconic/arrow_down_16x16.png) !important;
}

.x-sheet {
   -moz-box-shadow: 1px 1px 3px 2px #888;
   -webkit-box-shadow: 1px 1px 3px 2px #888;
   box-shadow: 1px 1px 3px 2px #888;
   /*-webkit-border-image: -webkit-gradient(linear, top, bottom, from(#00abeb), to(white), color-stop(0.5, white), color-stop(0.5, #66cc00)) 25 25 25 25 repeat repeat;*/
}

/* line 24, ../sass/ext-all.scss */

.x-floating {
   -moz-border-radius: 5px;
   border-radius: 5px;
}

/* line 29, ../sass/ext-all.scss */

.x-panel-default-framed {
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
   -o-border-radius: 4px;
   -ms-border-radius: 4px;
   -khtml-border-radius: 4px;
   border-radius: 4px;
   padding: 4px 4px 4px 4px;
   border-width: 1px;
   border-style: solid;
   background-color: #b3b3b3;
}

/*.x-grid-tree-node-expanded .x-tree-icon-parent
{
}*/

.x-tab button {
   overflow: hidden;
}

.export-image {
   max-width: 775px;
   /* Resize the image for IE6 */
   width: expression(this.width>775?775:true);
   border: none;
}

.x-fieldset-header-text,
legend {
   font: 10pt/14px bold helveticaneue, helvetica, arial, clean, sans-serif !important;
   color: #3E9BD5 !important;
   padding: 1px 0;
   font-weight: bold !important;
}

.x-header {
   border: 1px solid #CCCCCC;
   background: -webkit-gradient(linear, left top, left bottom, from(#F7F7F7), to(#CCCCCC));
   background: -moz-linear-gradient(top, #F7F7F7, #CCCCCC);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffdddddd');
   background-image: -ms-linear-gradient(top, #F7F7F7 0%, #CCCCCC 100%);
   -moz-box-shadow: 1px 1px 3px 2px #888;
   -webkit-box-shadow: 1px 1px 3px 2px #888;
   box-shadow: 1px 1px 3px 2px #888;
}

.x-toolbar-docked-top {
   -moz-box-shadow: 0 2px 3px #888;
   -webkit-box-shadow: 0 2px 3px #888;
   box-shadow: 0 2px 3px #888;
}

.dialog-header h1,
.dialog-header h2,
.dialog-header span {
   font-family: HelveticaNeue, helvetica, arial, clean, sans-serif !important;
   font-weight: normal !important;
}

.dialog-header img,
.dialog-header div {
   float: left;
   /*padding-left: 7px;*/
}

.dialog-header .title {
   color: #444;
   font-size: 16px !important;
   font-weight: bold !important;
   padding-left: 7px;
   text-shadow: 1px 1px 2px #AAA;
   margin: 0;
}

.dialog-header .subtitle {
   color: #666;
   font-size: 12px !important;
   line-height: 20px;
   padding-left: 7px;
   overflow: hidden;
   text-overflow: ellipsis;
   -o-text-overflow: ellipsis;
   white-space: nowrap;
   margin: 0;
}

.treesearch-result {
   border-color: #BFBFBF;
   border-style: solid;
   border-width: 0 0 1px;
   color: #605F5F;
   cursor: pointer;
   display: block;
   overflow: hidden;
   padding: 5px 5px 5px 30px;
   position: relative;
}

   .treesearch-result:hover {
      background-color: #DEECFD;
      border-color: #BFBFBF;
      border-style: solid;
      border-width: 0 0 1px;
      color: #605F5F;
      cursor: pointer;
      display: block;
      overflow: hidden;
      padding: 5px 5px 5px 30px;
      position: relative;
   }

   .treesearch-result .icon {
      float: left;
      height: 18px;
      left: 8px;
      position: absolute;
      top: 8px;
      width: 18px;
   }

   .treesearch-result .title {
      color: #444;
      font-weight: bold;
      overflow: hidden;
      text-overflow: ellipsis;
   }

   .treesearch-result .description {
      color: #666;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
   }

.x-tab-default-reverse {
   -moz-border-radius-topleft: 0;
   -webkit-border-top-left-radius: 0;
   -o-border-top-left-radius: 0;
   -ms-border-top-left-radius: 0;
   -khtml-border-top-left-radius: 0;
   border-top-left-radius: 0;
   -moz-border-radius-topright: 0;
   -webkit-border-top-right-radius: 0;
   -o-border-top-right-radius: 0;
   -ms-border-top-right-radius: 0;
   -khtml-border-top-right-radius: 0;
   border-top-right-radius: 0;
   -moz-border-radius-bottomright: 4px;
   -webkit-border-bottom-right-radius: 4px;
   -o-border-bottom-right-radius: 4px;
   -ms-border-bottom-right-radius: 4px;
   -khtml-border-bottom-right-radius: 4px;
   border-bottom-right-radius: 4px;
   -moz-border-radius-bottomleft: 4px;
   -webkit-border-bottom-left-radius: 4px;
   -o-border-bottom-left-radius: 4px;
   -ms-border-bottom-left-radius: 4px;
   -khtml-border-bottom-left-radius: 4px;
   border-bottom-left-radius: 4px;
}

.x-panel-body-default-framed {
   background: none repeat scroll 0 0 #FFFFFF;
   border: 0 solid #A49696;
   color: black;
}

.process-value-status {
   width: 16px;
   height: 16px;
   background-image: url(../images/transparent-circle.png);
}

.process-value-disabled td {
   font-style: italic !important;
   color: #808080;
}

.process-value-view {
   background-image: url('../images/nav_right_14x14.png');
   width: 14px;
   height: 14px;
   background-position: 50% 50%;
}

.process-value-hide {
   background-image: none;
   width: 0;
   height: 0;
}

.component-container {
   border: 1px solid #CCCCCC;
   background-color: #EEEEEE !important;
   border-radius: 10px;
}

   .component-container .component-container-title {
      text-align: center;
      font-weight: bold;
      display: block;
   }

.component-container-body {
   border-color: white;
   background-color: white;
   border-radius: 10px;
}

.property-value-header label {
   font-size: 14px !important;
   font-weight: bold;
   line-height: 24px;
}

.property-value .key,
.property-value-header .key {
   font-size: 11px;
   white-space: nowrap;
   float: left;
}

.property-value .value,
.property-value-header .value {
   font-size: 11px;
   color: #555555;
   white-space: nowrap;
   float: right;
   text-align: right;
   text-overflow: ellipsis;
   overflow: hidden;
}

.alternate-row {
   background-color: #F4F4F4;
}

/*
   This is similar to launcher above, so may want to merge
   To note there is an extra section for .launcher in localresources/main.css (for the border)
*/

.statistics {
   background: #F0F0F0 none;
   border: 1px solid #dddddd;
}

   .statistics .x-panel-header {
      background: #F0F0F0 none;
      border-color: #dddddd;
      text-align: center;
   }

   .statistics .x-form-display-field {
      color: #555;
      text-align: right;
      width: 80px;
   }

   .statistics label {
      color: #000;
      text-align: left;
      padding-left: 5px;
   }

.kpi .x-panel-body {
   border-color: #dddddd;
}

.kpi .x-panel-header {
   background: #F0F0F0 none;
   border-color: #dddddd;
}

.kpi .x-panel-body .reading {
   font-size: 16px;
   font-weight: bold;
}

.kpi .x-panel-body .subtitle {
   color: #999999;
   font-size: 10px;
}

.kpi-icon-metre {
   background-image: url('../images/kpi-dashboard-icon.png');
}

.kpi-disabled .x-panel-body {
   border: 2px dashed #CCCCCC;
   background-color: #ffffff;
   border-radius: 5px;
}

.kpi .kpi-reading {
   width: 100%;
}

   .kpi .kpi-reading td {
      /*margin-right: 20px;*/
      width: 50%;
   }

      .kpi .kpi-reading td:first-child {
         white-space: nowrap;
      }

      .kpi .kpi-reading td:last-child {
         text-align: right;
      }

.x-fieldset-body {
   padding-top: 10px;
}

.datapoint {
   /*text-decoration: underline;*/
   color: #3E9BD5;
   text-decoration: none;
}

   .datapoint:hover {
      /*text-decoration: underline;*/
      color: #508BB6;
      text-decoration: underline;
   }

.datalink {
   text-decoration: underline;
   color: #0000ff;
   cursor: pointer;
}

.fav-country {
   background: transparent url(../images/icons/193-locatino-arrow16x16@14.png) no-repeat scroll 50% 50% !important;
}

.fav-state {
   background: transparent url(../images/icons/28-star16x16@14.png) no-repeat scroll 50% 50% !important;
}

.dashboard-value {
   color: #555555;
}

.no-icon-menu {
   display: none;
}

.dashboard-font-small {
   font-size: 11px;
}

.x-grid-row-summary td {
   border-top: 1px solid #CCCCCC;
}

.x-form-date-trigger {
   background: top left no-repeat;
   background-image: url(../images/icons/83-calendar16x16w14x15.png) !important;
   background-position: 0 0 !important;
   border-bottom: 0 !important;
}

.batch-selection:hover {
   background-color: #EEEEEE;
}

.batch-selection {
   padding: 10px;
   background-color: transparent;
   border-radius: 10px;
}

.x-btn-link {
   display: inline;
   position: relative;
   white-space: nowrap;
   background: none;
}

   .x-btn-link * {
      cursor: pointer;
      /*cursor:hand;*/
   }

   .x-btn-link .x-btn-link-inner {
      color: #018BB6 !important;
      text-decoration: underline !important;
      /*vertical-align: text-top;
   text-transform: none;
   background: none;
   display: block;*/
      white-space: nowrap;
      font-size: 11px;
   }

   .x-btn-link button {
      margin: 0;
      padding: 0;
      border: none;
      width: auto;
      background: none;
   }

.x-toolbar-sessionTimeout {
   color: #005F00;
   font-size: 11px;
   border: 1px solid #9FCF9F;
   background-color: #DFFFDF !important;
   background-image: none !important;
   box-shadow: 1px 3px 3px 0 #888888;
}

.x-btn .x-btn-inner {
   text-transform: none;
}

.system-message,
.sessionTimeout-message {
   border-bottom: 2px solid #D7D7A1 !important;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   background-color: #FFFFDD !important;
   padding-left: 10px;
}

.sessionTimeout-message {
   border-bottom: 2px solid #9FCF9F !important;
   background-color: #DFFFDF !important;
}

   .system-message img,
   .sessionTimeout-message img {
      top: 4px !important;
   }

.daedalus-breadcrumb {
   font-size: 11px;
   background: #d0d0d0 url('../appicons/bg-breadcrumb.png') no-repeat 7px 50% !important;
}

   .daedalus-breadcrumb div {
      padding-left: 15px;
      padding-top: 1px;
      /*border-bottom: 2px solid #74777A;*/
      background: transparent !important;
      text-overflow: ellipsis;
      width: 690px;
      white-space: nowrap;
   }

.hide-tooltip {
   visibility: hidden;
}

.d-tooltip-status {
   height: 20px;
   display: inline-block;
   background-position: 0px 0px !important;
   font-weight: bold;
}

.d-grid-cell-variables-highstatus {
   color: #FE2E2E !important;
}

.d-grid-cell-variables-mediumhighstatus {
   color: #FACC2E !important;
   font-weight: bold !important;
}

.d-grid-cell-variables-mediumstatus {
   color: #FACC2E !important;
}

.d-grid-cell-variables-lowstatus {
   color: #01DF01 !important;
}

.d-grid-cell-variables-unconfiguredstatus {
   color: #A4A4A4 !important;
}

.d-grid-cell-variables-badstatus {
   color: #000000 !important;
}

.d-grid-cell-highstatus {
   background-image: url(../images/process-value-high@16x16.png);
   background-repeat: no-repeat;
   background-position: 4px 3px;
   padding-left: 18px;
}

.d-grid-cell-mediumstatus {
   background-image: url(../images/process-value-warning@16x16.png);
   background-repeat: no-repeat;
   background-position: 4px 3px;
   padding-left: 18px;
}

.d-grid-cell-lowstatus {
   background-image: url(../images/process-value-low@16x16.png);
   background-repeat: no-repeat;
   background-position: 4px 3px;
   padding-left: 18px;
}

.d-grid-cell-unconfiguredstatus {
   background-image: url(../images/process-value-unconfigured@16x16.png);
   background-repeat: no-repeat;
   background-position: 4px 3px;
   padding-left: 18px;
}

.d-grid-cell-badstatus {
   background-image: url(../images/process-value-bad@16x16.png);
   background-repeat: no-repeat;
   background-position: 4px 3px;
   padding-left: 18px;
}

.d-grid-row-disabled td {
   font-style: italic !important;
}

.d-grid-row-strike {
   text-decoration: line-through;
}

.d-grid-row-compare-modified td {
   background-color: #FFFF00 !important;
}

.d-grid-row-compare-unmodified td {
   background-color: #ffffff !important;
}

.d-grid-row-compare-removed td {
   background-color: #ff0000 !important;
}

.d-grid-row-compare-added td {
   background-color: #9BBB59 !important;
}

.d-span-mde-overdue {
   color: #FF0000;
   font-weight: bold;
}

.daedalus-designer {
   background-color: #AAA;
}

.daedalus-designerLibrary {
   overflow-y: scroll;
   overflow-x: hidden;
}

/* ################################################################################################
###   DEFAULT HTML4 STYLE RESET FOR TARGETED MARKETING ITEMS
################################################################################################ */

.daedalus-targetedmarketing h1 {
   font-size: 2em !important;
   margin: .67em 0 !important;
}

.daedalus-targetedmarketing h2 {
   font-size: 1.5em !important;
   margin: .75em 0 !important;
}

.daedalus-targetedmarketing h3 {
   font-size: 1.17em !important;
   margin: .83em 0 !important;
}

.daedalus-targetedmarketing h4,
.daedalus-targetedmarketing p,
.daedalus-targetedmarketing blockquote,
.daedalus-targetedmarketing ul,
.daedalus-targetedmarketing ol {
   margin: 1.12em 0 !important;
}

.daedalus-targetedmarketing h5 {
   font-size: .83em !important;
   margin: 1.5em 0 !important;
}

.daedalus-targetedmarketing h6 {
   font-size: .75em !important;
   margin: 1.67em 0 !important;
}

.daedalus-targetedmarketing h1,
.daedalus-targetedmarketing h2,
.daedalus-targetedmarketing h3,
.daedalus-targetedmarketing h4,
.daedalus-targetedmarketing h5,
.daedalus-targetedmarketing h6,
.daedalus-targetedmarketing b,
.daedalus-targetedmarketing strong {
   font-weight: bolder !important;
}

.daedalus-targetedmarketing blockquote {
   margin-left: 40px !important;
   margin-right: 40px !important;
}

.daedalus-targetedmarketing ol,
.daedalus-targetedmarketing ul {
   margin-left: 40px !important;
}

.daedalus-targetedmarketing ol {
   list-style-type: decimal !important;
}

   .daedalus-targetedmarketing ol ul,
   .daedalus-targetedmarketing ul ol,
   .daedalus-targetedmarketing ul ul,
   .daedalus-targetedmarketing ol ol {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
   }

.x-print-dashboard {
   height: auto;
   overflow: visible;
}

/* Wysiwyg reset */

#homepage-body div,
#homepage-body span,
#homepage-body applet,
#homepage-body object,
#homepage-body iframe,
#homepage-body h1,
#homepage-body h2,
#homepage-body h3,
#homepage-body h4,
#homepage-body h5,
#homepage-body h6,
#homepage-body p,
#homepage-body blockquote,
#homepage-body pre,
#homepage-body a,
#homepage-body abbr,
#homepage-body acronym,
#homepage-body address,
#homepage-body big,
#homepage-body cite,
#homepage-body code,
#homepage-body del,
#homepage-body dfn,
#homepage-body em,
#homepage-body img,
#homepage-body ins,
#homepage-body kbd,
#homepage-body q,
#homepage-body s,
#homepage-body samp,
#homepage-body small,
#homepage-body strike,
#homepage-body strong,
#homepage-body sub,
#homepage-body sup,
#homepage-body tt,
#homepage-body var,
#homepage-body b,
#homepage-body u,
#homepage-body i,
#homepage-body center,
#homepage-body dl,
#homepage-body dt,
#homepage-body dd,
#homepage-body ol,
#homepage-body ul,
#homepage-body li,
#homepage-body fieldset,
#homepage-body form,
#homepage-body label,
#homepage-body legend,
#homepage-body table,
#homepage-body caption,
#homepage-body tbody,
#homepage-body tfoot,
#homepage-body thead,
#homepage-body tr,
#homepage-body th,
#homepage-body td,
#homepage-body article,
#homepage-body aside,
#homepage-body canvas,
#homepage-body details,
#homepage-body embed,
#homepage-body figure,
#homepage-body figcaption,
#homepage-body footer,
#homepage-body header,
#homepage-body hgroup,
#homepage-body menu,
#homepage-body nav,
#homepage-body output,
#homepage-body ruby,
#homepage-body section,
#homepage-body summary,
#homepage-body time,
#homepage-body mark,
#homepage-body audio,
#homepage-body video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

#homepage-body article,
#homepage-body aside,
#homepage-body details,
#homepage-body figcaption,
#homepage-body figure,
#homepage-body footer,
#homepage-body header,
#homepage-body hgroup,
#homepage-body menu,
#homepage-body nav,
#homepage-body section {
   display: block;
}

#homepage-body ol,
#homepage-body ul {
   list-style: none;
}

   #homepage-body ul li {
      list-style: disc;
   }

   #homepage-body ol li {
      list-style: decimal;
   }

#homepage-body i {
   font-style: italic;
}

#homepage-body blockquote,
#homepage-body q {
   quotes: none;
}

   #homepage-body blockquote:before,
   #homepage-body blockquote:after,
   #homepage-body q:before,
   #homepage-body q:after {
      content: '';
      content: none;
   }

#homepage-body table {
   border-collapse: collapse;
   border-spacing: 0;
}

#help {
   background-color: white;
   color: rgb(102, 102, 102);
   font-family: HelveticaNeue, helvetica, arial, clean, sans-serif;
   font-size: 12px;
   font-weight: normal;
   line-height: 20px;
   padding-left: 7px;
}

   #help h2 {
      color: rgb(68, 68, 68);
      font-size: 16px;
      font-weight: bold;
      padding-left: 7px;
      text-shadow: rgb(170, 170, 170) 1px 1px 2px;
   }

   #help a {
      color: rgb(0, 0, 255);
      text-decoration: underline;
   }

   #help #quicktip {
      float: left;
      padding: 5px;
      border: 2px solid #FDBF3B;
      background-color: #FFEBC1;
      margin: 7px;
      box-shadow: rgb(150, 150, 150) 3px 3px 3px 0px;
      -webkit-box-shadow: rgb(150, 150, 150) 3px 3px 3px 0px;
      border-bottom-left-radius: 4px;
      border-bottom-right-radius: 4px;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      width: 200px;
   }

/* ################################################################################################
###   EXTJS OVERRIDES
################################################################################################ */

.x-tip {
   width: auto !important;
}

.x-tip-body {
   width: auto !important;
}

   .x-tip-body span {
      width: auto !important;
   }

.x-header {
   border-bottom: 1px solid #AAA !important;
}

.x-accordion-hd {
   cursor: pointer !important;
}

   .x-accordion-hd:hover {
      background-color: #ccc !important;
   }

.x-btn-default-small-submit {
   border-color: #0690B0 #0690B0 #035366;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   -o-border-radius: 3px;
   -ms-border-radius: 3px;
   -khtml-border-radius: 3px;
   border-radius: 3px;
   padding: 2px 2px 2px 2px;
   border-width: 1px;
   border-style: solid;
   background-image: none;
   background-color: white;
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#65CBE2), to(#0690B0));
   background-image: -moz-linear-gradient(top, #65CBE2, #0690B0);
   background-image: -o-linear-gradient(top, #65CBE2, #0690B0);
   background-image: -ms-linear-gradient(top, #65CBE2 0, #0690B0 100%) !important;
}

   .x-btn-default-small-submit:hover {
      border-color: #2A798C #2A798C #194651;
      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0B8DAB), to(#2A798C));
      background-image: -moz-linear-gradient(top, #0B8DAB, #2A798C);
      background-image: -o-linear-gradient(top, #0B8DAB, #2A798C);
      background-image: -ms-linear-gradient(top, #0B8DAB 0, #2A798C 100%);
   }

   .x-btn-default-small-submit span {
      color: white !important;
      color: #333333 \9 !important; /*This is a hack for IE9 specifically, allowing IE 9 to have it's specific color for these cases. http://mynthon.net/howto/-/webdev/CSS-big-list-of-css-hacks.txt RM #6202'*/
   }

.x-btn-default-small-submit-disabled {
   border-color: #E6E6E6 #E6E6E6 silver;
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF), to(#E6E6E6));
   background-image: -moz-linear-gradient(top, #FFF, #E6E6E6);
   background-image: -o-linear-gradient(top, #FFF, #E6E6E6);
   background-image: -ms-linear-gradient(top, #FFF 0, #E6E6E6 100%);
}

   .x-btn-default-small-submit-disabled:hover {
      border-color: #E6E6E6 #E6E6E6 silver;
      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF), to(#E6E6E6));
      background-image: -moz-linear-gradient(top, #FFF, #E6E6E6);
      background-image: -o-linear-gradient(top, #FFF, #E6E6E6);
      background-image: -ms-linear-gradient(top, #FFF 0, #E6E6E6 100%);
   }

   .x-btn-default-small-submit-disabled span {
      color: #666 !important;
   }

.x-btn-login,
.x-btn-login .x-btn-button {
    border-color: #00303D;
    border-width: 1px;
    border-style: solid;
    background-color: #00303D;
}
    .x-btn-login .x-btn-button .x-btn-inner {
        color: #ffffff;
    }

    .x-btn-login:hover,
    .x-btn-login .x-btn-button:hover {
        background-color: #F68D2E;
        border-color: #F68D2E;
        border-width: 1px;
        border-style: solid;
    }
    .x-btn-login .x-btn-button .x-btn-inner:hover {
        color: #333333 !important;
    }
    /* line 45, ../ext/resources/themes/stylesheets/ext4/default/widgets/_progress-bar.scss */
    .x-strict .x-progress {
        width: 18px;
    }

/* KPIGauge */

.gaugeLabelOverride {
   top: 58px !important;
}

.gaugeValueOverride {
   top: 77px !important;
}

.gaugeLabelBlockColorRED {
   background-color: #D22A26 !important;
}

.gaugeLabelBlockColorYELLOW {
   background-color: #D2B626 !important;
}

.gaugeLabelBlockColorGREEN {
   background-color: #1EA927 !important;
}

.gaugeLabelBlockColorGRAY {
   background-color: #ABADAF !important;
}

.x-tip-default {
   background-color: white;
   border: 1px solid #3E9BD5;
}

.x-tip-body-default {
   color: #252525;
}

.x-item-disabled .d-form-cb-label-after {
   filter: alpha(opacity=30);
   opacity: .3;
}

/*##############################################################
    ###  Sparkline specific needed for tooltips
    #######################################################################*/

.jqstooltip2 {
   position: absolute;
   left: 0;
   top: 0;
   visibility: hidden;
   background: transparent;
   background-color: rgba(0, 0, 0, 0.6);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
   -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
   color: white;
   font: 10px arial, san serif;
   text-align: left;
   white-space: nowrap;
   padding: 5px;
   border: 1px solid white;
   z-index: 10000;
   height: 30px;
}

.jqsfield {
   color: white;
   font: 10px arial, san serif;
   text-align: left;
}

.multi-line-header .x-column-header-inner .x-column-header-text {
   white-space: normal;
}

.multi-line-header .x-column-header-inner {
   line-height: normal;
   padding-top: 3px !important;
   padding-bottom: 3px !important;
   text-align: left;
}

.x-nlg .x-panel-header-default-top {
   background-size: contain;
   background-repeat: repeat-x;
}

.x-header {
   filter: none;
}

.home-favorite.x-btn {
   height: 50px;
   width: 300px;
   margin-right: 5px;
}