#dashboard {
   padding-top: 20px;
   background-color: #F8F8F8;
}

#dashboard > .tabs
{
   margin-bottom: 15px;
   display: flex;
}

#dashboard > .tabs > li {
   margin-right: 8px;
}

#dashboard > .tabs > li > a {
   display: block;
   background-color: #eee;
   color: #444;
   padding: 11px 15px;
   /*border: 1px solid #ccc;*/
   border-bottom: none;
   text-decoration: none;
}

#dashboard > .tabs > li:hover > a {
   color: #000;
   background-color: #ddd;

}

#dashboard > .tabs > li:hover > a .svg-icon {
   background-color: var(--color-dark);
}

#dashboard > .tabs > li > a.current {
   color: #000;
   background-color: #fff;
   margin-bottom: -1px;
}

#dashboard > .tabs > li > a[href="#new"] {
   font-weight: bold;
}

#dashboard > .panes {
   background-color: #FFFFFF;
}

#dashboard > .panes > div {
   min-height: 222px;
   margin-bottom: 30px;
   background: #f8f8f8;
}

#dashboard > .menu {
   text-align: right;
   float: right;
   padding-right: 10px;
}

#dashboard > .menu > li {
   float: left;
   margin-left: 5px;
   position: relative;
}

#dashboard > .menu .dropdown_menu {
   width: 150px;
   right: 0;
}

#dashboard > .menu > li > a {
   background-position: right center;
   background-repeat: no-repeat;
   color: #6F7170;
   text-decoration: none;
   padding-right: 20px;
}

#dashboard > .menu > li > a:hover {
   background-color: #fff;
}

#dashboard > .menu > li >a[rel="#gadgets_directory"] {
   background-image: url("/images/backend/beta/icons/22x22/add.png");
}

#dashboard > .menu > .config > a {
   background-image: url("/images/backend/beta/icons/22x22/config.png");
}

#dashboard .dropdown_menu {
   display: none;
   text-align: right;
   position: absolute;
   background-color: #fff;
   width: 170px;
   box-shadow: 0px 0px 5px rgb(0 0 0 / 15%);
   z-index: 1000;
   right: 0;
}

#dashboard li:hover > .dropdown_menu {
   display: block;
}

#dashboard .column {
   min-height: 222px;
   background-color: #fff;
   background-clip: content-box;
}

#dashboard .gadget:hover {
   /*-moz-box-shadow: 5px 5px 3px #888;
   -webkit-box-shadow: 5px 5px 3px #888;
   box-shadow: 2px 2px 3px 0px #CCCCCC;*/
}

#dashboard .gadget {
   padding-bottom: 10px;
   background: #fff;
   padding-left: 20px;
   padding-right: 20px;
   position: relative;
}

#dashboard .gadget .moveable {
   cursor: move;
}

#dashboard .gadget h2
{
   margin: 0;
   font-size: 17px;
   font-weight: 400;
   padding: 21px 0px 15px 3px;
   color: #000;
}

#dashboard .gadget h2 a {
   display: inline-block;
}

#dashboard .gadget .menu {
   display: none;
   position: absolute;
   right: 20px;
   top: 20px;
}

#dashboard .gadget:hover .menu {
   display: block;
}

#dashboard .gadget .menu > li {
   float: left;
   margin-left: 5px;
   position: relative;
}

#dashboard .gadget .admin_form .row>label, 
#dashboard .gadget  .admin_form .row>.label {
   min-width: 140px;
}

#dashboard .gadget .config {
   padding-right: 2px;

   padding-left: 2px;

   padding-bottom: 2px;
}

#gadgets_configuration {
   width: 500px;
}

#gadgets_configuration > .content {
   padding: 10px;
}

#gadgets_configuration .colors li {
   float: left;
   margin-right: 5px;
   border: 1px solid #bababa;
}

#gadgets_configuration .colors li.current,
#gadgets_configurationn .colors li:hover {
   border-color: #424242;
}

#gadgets_configuration .colors a {
   display: block;
   width: 15px;
   height: 15px;
   border: 1px solid #fff;
}

#dashboard .gadget > .content {
   min-height: 100px;
   padding-top: 5px;
}

#dashboard .gadget > .content iframe {
   overflow: auto;
}

#dashboard .gadget > .minimized {
   display: none;
}

#dashboard .column .add-gadget-placeholder,
#dashboard .column .placeholder {
   background-color: #fff;
   /*border: 1px dashed #ccc;*/
   padding-bottom: 10px;
   /*margin-left: 10px;
   margin-right: 10px;*/
}

#dashboard .column .add-gadget-placeholder {
    font-size: 16px;
    padding: 10px;
    text-align: left;
}


#dashboard .admin_actions,
#dashboard_configuration admin_actions {
   float: left;
}

#dashboard_configuration {
   width: 530px;
}

#dashboard_configuration .content {
   background-color: #fff;
   padding: 10px;
}
#dashboard_configuration .layouts {
   max-width: 250px;
}

#dashboard_configuration .layouts a {
   border: 1px solid #ccc;
   display: block;
   padding: 2px;
   display: inline-block;
}

#dashboard_configuration .layouts a img {
   display: block;
}

#dashboard_configuration .layouts li.current a,
#dashboard_configuration .layouts a:hover {
   border-color: #444;
}

#dashboard_configuration .layouts li {
   float: left;
   margin-right: 5px;
   margin-bottom: 5px;
}

/*
#dashboard_navbar {
   border-top: 1px solid #ccc;
   background-color: #eee;
   position: fixed;
   bottom: 0px;
   width: 100%;
   opacity: 0.8;
}

#dashboard_navbar > .menu {
   line-height: 0px;
   float: right;
   padding:10px;
}

#dashboard_navbar > .menu li {
   display: inline;
   padding-left: 5px;
}

#dashboard_navbar > .menu li.clr {
   padding: 0;
}

#dashboard_navbar > .menu a {
   opacity: 0.6;
}

#dashboard_navbar .menu a:hover {
   opacity: 1;
}
*/

#gadgets_directory {
   max-width: 800px;
   min-height: 500px;
   width: 100%;
   min-width: 250px;
}

#gadgets_directory.preloader_160x24 {
   background-color: #fff;
   display: none;
}

#gadgets_directory > .content {
   background-color: #fff;
   clear: left;
   max-height: 650px;
   overflow-y: auto;
}

#gadgets_directory .gadget:nth-child(even) {
   background-color: var(--color-super-light);
}

#gadgets_directory .gadget h3 {
   font-size: 17px;
   font-weight: 400;
   color: #000;
}

#gadgets_directory .gadget:hover {
   background-color: var(--highlight-color) !important;
}

#gadgets_directory .gadget:hover a.button {
   border: 1px solid var(--color-light-hover);
}


#gadgets_directory a.button:hover .svg-icon {
   /*background-color: #fff;*/
}