.thumbnail:hover {
    position: relative;
    width: 300px;
    max-width: 300px;
    height: auto;
    display: block;
    z-index: 999;
}

.clear {
    clear: left;
}

.tar {
    text-align: right;
}

.tal {
    text-align: left;
}

.dr {
    height: 5px;
    margin: 20px 0px;
    width: 100%;
    clear: left;
    background: url("../img/backgrounds/divider.png") left center repeat-x;
}

.dr span {
    background: url("../img/backgrounds/divider_span.png") center center no-repeat;
    width: 100%;
    height: 5px;
    display: block;
}

.menu .dr {
    float: left;
    margin: 10px 0px;
}

.header {
    display: block;
    height: 30px;
    width: 100%;
    position: absolute;
    z-index: 998;
    background: url("../img/backgrounds/header.jpg") left top repeat-x;
}

.header .logo {
    display: block;
    float: left;
    padding: 3px 3px;
}

.header .header_menu {
    display: block;
    float: right;
    padding: 3px 20px;
    margin: 0px;
    list-style: none;
}

.header .header_menu li {
    display: block;
    float: left;
    padding: 0px;
    margin: 4px 0px;
}

.header .header_menu li a {
    display: block;
    float: left;
    width: 25px;
    height: 25px;
}

.header .header_menu li.list_icon {
    background: url("../img/header_menu_list.png") left top no-repeat;
    display: none;
}

.menu {
    display: block;
    width: 210px;
    position: absolute;
    margin-top: 30px;
    z-index: 999;
    background: url("../img/backgrounds/menu.jpg") left top repeat;
    border-bottom: 1px solid #CCCCCC;

    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;

    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.35);
    border-right
    /*\**/
    : 1px solid #D5D5D5;
}

.menu .breadLine .arrow {
    position: absolute;
    left: 110px;
    top: -12px;
    background: url("../img/menu-arrow-top.png") left top repeat;
    width: 17px;
    height: 12px;
    display: none;
}

/* ~ADMIN~ */
.adminControl {
    padding: 1px 10px 0px;
    float: left;
    font-size: 13px;
    color: #333;
    background: url("../img/arrow_down.png") right center no-repeat;
    width: 185px;
    cursor: pointer;

    text-shadow: 0 1px 0 #FFFFFF;
}

.adminControl.active {
    background: url("../img/arrow_up.png") right center no-repeat;
}

.admin {
    display: none;
    float: left;
    position: relative;
    padding: 5px;
    width: 205px;

    box-shadow: inset 0 0 5px #CCC;
}

.admin .image {
    float: left;
    width: 62px;
    margin-right: 5px;
}

.admin ul.control,
.headInfo ul.control {
    display: block;
    float: left;
    width: 135px;
    list-style: none;
    margin: 0px;
}

.admin ul.control li a,
.headInfo ul.control li a {
    font-size: 12px;
    color: #333;

    text-shadow: 0 1px 0 #FFFFFF;
}

.admin ul.control li .caption {
    display: block;
    float: right;
    font-size: 10px;
    background-color: #333;
    color: #fff;
    padding: 2px 4px 2px 3px;
    line-height: 13px;
    margin: 3px 0px 3px 5px;

    border-radius: 3px;
    text-decoration: none;
    text-shadow: none;
}

.admin ul.control li .caption.red {
    background-color: #a5302c;
}

.admin ul.control li .caption.green {
    background-color: #225B15;
}

.admin ul.control li .caption.yellow {
    background-color: #FBB450;
}

.admin .info {
    float: left;
    padding: 5px;
    font-size: 10px;
    color: #666;
    line-height: 14px;

    text-shadow: 0 1px 0 #FFFFFF;
}

/* ~NAVIGATION~ */
.navigation {
    list-style: none;
    position: relative;
    padding: 0px;
    margin: 0px;
    float: left;
}

.navigation li {
    border-top: 1px solid #335A85;
    border-right: 1px solid #335A85;
    background: url("../img/backgrounds/menu-item.jpg") left top repeat-x;
    padding: 0px;
    margin: 0px;
    display: block;
    float: left;
    width: 210px;
    position: relative;
}

.menu .navigation li:hover,
.menu .navigation li.active {
    border-color: #143D6B;
    background: url("../img/backgrounds/menu-item-active.jpg") left top repeat-x;
}

.navigation li.openable {
    background: url("../img/menu_arrow_down.png") 185px 12px no-repeat, url("../img/backgrounds/menu-item.jpg") left top repeat-x;
}

.navigation li.openable.active {
    background: url("../img/menu_arrow_down.png") 185px 12px no-repeat, url("../img/backgrounds/menu-item-active.jpg") left top repeat-x;
}

.navigation li.openable:hover {
    background: url("../img/menu_arrow_down.png") 185px 12px no-repeat, url("../img/backgrounds/menu-item-active.jpg") left top repeat-x;
}

.navigation li.openable.active {
    background: url("../img/menu_arrow_up.png") 185px 12px no-repeat, url("../img/backgrounds/menu-item-active.jpg") left top repeat-x;
}

.navigation li.openable.sec {
    background: url("../img/arrow_down.png") 185px 12px no-repeat;
}

.navigation li.openable.sec.active {
    background: url("../img/arrow_down.png") 185px 12px no-repeat;
}

.navigation li.openable.sec:hover {
    background: url("../img/arrow_down.png") 185px 12px no-repeat;
}

.navigation li.openable.sec.active {
    background: url("../img/arrow_up.png") 185px 12px no-repeat;
}

.navigation li>a {
    color: #fff;
    text-decoration: none;
    padding: 0px;
    display: block;
    float: left;
    width: 210px;
    position: relative;

    text-shadow: 0 1px 0 #333;
}

.navigation li>a span.text {
    width: 160px;
    padding: 7px 0px;
    display: block;
    margin-left: 10px;
    float: left;
    overflow: hidden;
}

.navigation li.openable>ul {
    padding: 0px;
    margin: 0px;
    float: left;
    width: 210px;
    display: none;
}

.navigation li.active>ul {
    display: block !important;
}

.navigation li>ul>li {
    display: block;
    float: left;
    width: 210px;
    background: #F2F2F2;
    border-top: 1px solid #FCFCFC !important;
    border-bottom: 1px solid #E4E8ED !important;
    border-right-color: #E4E8ED !important;
}

.navigation li>ul>li:hover,
.navigation li>ul>li.active {
    background: #EDEDED !important;
}

.navigation li>ul>li.seprator {
    background: #000000 !important;
    border-bottom: 1px solid #000000 !important;
    border-right-color: #000000 !important;
}

.navigation li>ul>li>a {
    display: block;
    float: left;
    padding-left: 5px;
    width: 205px;
}

.navigation li>ul>li>a span.text {
    color: #333;
    font-size: 13px;
    padding: 6px 0px;
    width: 175px;

    text-shadow: 0 1px 0 #FFFFFF;
}

.navigation li>ul>li>a [class*="icon-"] {
    margin: 9px 0px 7px 5px;
    display: block;
    float: left;
}

.navigation li>ul>li>a.caption {
    float: right;
    width: auto;
    background-color: #143D6B;
    color: #fff;
    text-align: center;
    font-size: 13px;
    height: 18px;
    line-height: 18px;
    padding: 0px 5px;
    margin: 6px 0px;
    margin-right: 5px;
    border: 1px solid #143D6B;
    border-radius: 3px;
    background: linear-gradient(to top, #335A85 0%, #143D6B 100%);
}

.navigation li>ul>li>a.red {
    border: 1px solid #772E2C;

    background: linear-gradient(to top, #c93934 0%, #a5302c 100%);

}

.navigation li>ul>li>a.green {
    border: 1px solid #225B15;

    background: linear-gradient(to top, #55AB2D 0%, #2E801E 100%);

}

.navigation li>ul>li>a.yellow {
    border: 1px solid #AD6704;
    background: linear-gradient(to top, #FBB450 0%, #F89406 100%);
}

/* ~NAVIGATION~ */
.menu .widget,
.menu .widget-fluid {
    display: block;
    float: left;
    width: 200px;
    padding: 0px 10px;
}

.menu .widget-fluid {
    padding: 0px;
    width: 210px;
}

.menu .widget .input-append,
.menu .widget-fluid .input-append {
    margin-bottom: 0px;
}

.menu .popup {
    right: -415px;
}

.popup {
    position: absolute;
    top: 30px !important;
    z-index: 3;
    width: 300px;
    background-color: #FFFFFF;
    box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.35);
    display: none;
}

.popup .head {
    background: url("../img/backgrounds/box-head.jpg") left top repeat-x;
    background-clip: padding-box;
    position: relative;
}

.popup .head .arrow {
    position: absolute;
    left: -12px;
    top: 10px;
    width: 12px;
    height: 17px;
    background: url("../img/arrow.png") left top no-repeat transparent;
}

.popup .head .name {
    font-size: 12px;
    color: #090808;
    float: left;
    display: block;
    padding: 10px;
    line-height: 18px;
    font-weight: bold;
}

.popup .body {
    padding: 10px;
    position: relative;
    border-right
    /*|**/
    : 1px solid #D5D5D5;
    border-left
    /*|**/
    : 1px solid #D5D5D5;
}

.popup .body-fluid {
    position: relative;
    padding: 4px;
    border-right
    /*|**/
    : 1px solid #111010;
    border-left
    /*|**/
    : 1px solid #050101;
    border-bottom: 1px solid black;
}

.popup .messages .item,
.block.messages .item {
    border-bottom: 1px solid #E4E8ED;
    border-top: 1px solid #FFF;
    position: relative;
}

.popup .messages .item .image,
.block.messages .item .image {
    display: inline-block;
    width: 60px;
    padding: 5px 0px 5px 0px;
    position: absolute;
    left: 0px;
    top: 0px;
}

.popup .messages .item .info,
.block.messages .item .info {
    padding: 5px 5px 5px 70px;
    font-size: 14px;
}

.popup .messages .item .info .name,
.block.messages .item .info .name {
    font-size: 14px;
    color: #005580;
    font-weight: bold;
}

.popup .messages .item .info p,
.block.messages .item .info p {
    margin: 0px;
    font-size: 14px;
    color: #333;
    line-height: 17px;
}

.popup .messages .item .info>span,
.block.messages .item .info>span {
    color: #999;
    font-size: 14px;
}

.popup .messages .item:last-child,
.block.messages .item:last-child {
    border-bottom: 0px;
}

.block.messages .item:first-child {
    border-top: 0px;
}

.popup .messages .item:first-child .image,
.block.messages .item:first-child .image,
.popup .messages .item:first-child .info,
.block.messages .item:first-child .info {
    padding-top: 0px;
}

.popup .footer,
.block .footer {
    background-color: #F2F2F2;
    border-top: 1px solid #DAE1E8;
    padding: 8px 5px 7px;
    text-align: right;
}

.popup .footer {
    border-right
    /*|**/
    : 1px solid #D5D5D5;
    border-left
    /*|**/
    : 1px solid #D5D5D5;
    border-bottom
    /*|**/
    : 1px solid #D5D5D5;
}

.popup .search {
    position: relative;
}

.popup .search input[type="text"],
.popup .search input[type="password"],
.popup .search input textarea {
    width: 100%;
    font-size: 14px;
    color: #454545;
    padding: 7px 7px 5px;
    border: 1px solid #D7D7D7;
    box-sizing: border-box;

    display: inline-block;
    background: #FDFDFD;
    height: 26px;
    margin: 0px;
}

/* BLOCK NEWS */
.block.news .item {
    border-bottom: 1px solid #E4E8ED;
    border-top: 1px solid #FFF;
    position: relative;
    padding-bottom: 5px;
}

.block.news .item:first-child {
    border-top: 0px;
}

.block.news .item:last-child {
    border-bottom: 0px;
}

.block.news .item>a {
    font-size: 12px;
    font-weight: bold;
}

.block.news .item>p {
    font-size: 14px;
    color: #333;
    margin: 0px 10px;
}

.block.news .item>span.date {
    font-size: 14px;
    color: #999;
}

.block.news .item .controls {
    position: absolute;
    right: 5px;
    bottom: 5px;
    opacity: 0.5;
}

.block.news .item .controls:hover {
    opacity: 0.8;
}

/* BLOCK NEWS */
.breadLine {
    height: 23px;
    border-bottom: 1px solid #CCC;
    background: url("../img/backgrounds/nav.jpg") left top repeat-x;
    border-bottom: 1px solid #CCC;
}

.breadLine .breadcrumb {
    float: left;
}

.breadLine .breadcrumb,
.breadLine .breadcrumb li,
.breadLine .breadcrumb a {
    font-size: 13px;
}

.breadLine .buttons {
    display: block;
    float: right;
    padding: 0px;
    margin: 0px 20px 0px 0px;
    list-style: none;
    border-right: 1px solid #D5D5D5;
}

.breadLine .buttons li {
    display: block;
    float: left;
    padding: 0px;
    margin: 0px;
    border-left: 1px solid #D5D5D5;
    position: relative;
}

.breadLine .buttons li>a {
    display: block;
    float: left;
    padding: 1px 5px 2px 10px;
    margin: 0px;
    font-size: 14px;
    color: #333;
}

.breadLine .buttons li>a span {
    margin-right: 5px;

    text-shadow: 0 1px 0 #FFFFFF;
}

.breadLine .buttons li>a:hover {
    text-decoration: none;
    background: #E6E6E6;
}

.breadLine .buttons li .popup {
    right: 0px;
    top: 35px;
}

.breadLine .buttons li .popup .head .arrow {
    width: 17px;
    height: 12px;
    left: auto;
    right: 10px !important;
    top: -11px;
    background: url("../img/arrow-top.png") left top no-repeat transparent;
}

.content {
    position: relative;
    margin-left: 210px;
    padding-top: 30px;
}

.content .workplace {
    position: relative;
    padding: 5px;
}

/* ~BOXES~ */
.content .workplace .head {
    background: url("../img/backgrounds/box-head.jpg") left top repeat-x;
    background-clip: padding-box;
    border: 1px solid #335A85;

    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.content .workplace .head h1,
.content .workplace .head h2,
.content .workplace .head h3,
.content .workplace .head h4,
.content .workplace .head h5,
.content .workplace .head h6 {
    font-size: 14px;
    color: #fff;
    line-height: 22px;
    padding: 5px;
    margin: 0px;
    font-weight: bold;
    margin-left: 10px;
    display: block;
    float: left;

    text-shadow: 0 1px 0 #333;
}

.content .workplace .head .buttons {
    float: right;
    background: none;
    position: relative;
    list-style: none;
    margin: 0px;
}

.content .workplace .head .buttons>li {
    display: block;
    float: left;
}

.content .workplace .head .buttons li:active,
.content .workplace .head .buttons li.active {
    background: url('../img/backgrounds/box-head-active.jpg') left center repeat-x;
}

.content .workplace .head .buttons li>a {
    outline: none;
}

.content .workplace .head .buttons [class*="isw-"],
.content .workplace .head .button [class*="isb-"] {
    margin: 0px;
    padding: 8px;
    border-left: 1px solid #335A85;
}

.content .workplace .head .buttons li .dd-list {
    display: none;
    position: absolute;
    z-index: 2;
    right: -1px;
    min-width: 150px;
    list-style: none;
    padding: 0px;
    margin: 0px;
    top: 100%;
    background-color: #395E88;
    border: 1px solid #143D6B;
}

.content .workplace .head .buttons li .dd-list li {
    display: block;
    clear: left;
    border-top: 1px solid #507298;
    border-bottom: 1px solid #143D6B;
}

.content .workplace .head .buttons li .dd-list li:last-child {
    border-bottom: 0px;
}

.content .workplace .head .buttons li .dd-list li a {
    line-height: 38px;
    color: #fff;
    font-size: 13px;
    display: block;
    text-decoration: none;
}

.content .workplace .head .buttons li .dd-list li a:hover {
    background-color: #2C517A;
}

.content .workplace .head .buttons li .dd-list li [class*="isw-"],
.content .workplace .head .button .dd-list li [class*="isb-"] {
    border: 0px;
}

.content .workplace .head .buttons>li.s_loader,
.content .workplace .head .buttons>li.w_loader,
.content .workplace .head .buttons>li.c_loader,
.content .workplace .head .buttons>li.loader {
    border: 0px;
}

.content .workplace .head .buttons>li.s_loader {
    padding: 9px 13px;
}

.content .workplace .head .buttons>li.c_loader {
    padding: 3px 4px 4px 5px;
}

.content .workplace .head .buttons>li.w_loader,
.content .workplace .head .buttons>li.loader {
    padding: 3px 5px;
}

.content .workplace .head .buttons>li.toggle a {
    background: url("../img/menu_arrow_up.png") center center no-repeat;
    display: block;
    float: left;
    width: 30px;
    height: 38px;
    border-left: 1px solid #315680;
}

.content .workplace .head .buttons>li.toggle {
    background: none;
}

.content .workplace .head .buttons>li.toggle.active a {
    background: url("../img/menu_arrow_down.png") center center no-repeat;
}

.content .workplace .headInfo {
    background-color: #F1F1F1;
    border: 1px solid #D5D5D5;
    padding: 5px;
    position: relative;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.content .workplace .headInfo .arrow_down {
    width: 17px;
    height: 12px;
    position: absolute;
    left: 50%;
    margin-left: -9px;
    bottom: -12px;
    background: url('../img/menu-arrow-down.png') left top no-repeat;
    z-index: 1;
}

.content .workplace .headInfo .image {
    margin: 0px 10px 5px 5px;
    float: left;
}

.content .workplace .headInfo .image a {
    display: block;
    font-weight: bold;
    text-align: center;
}

.content .workplace .headInfo .info {
    float: left;
    font-size: 13px;
    color: #333;
}

.content .workplace .headInfo .info address {
    margin-bottom: 0px;
}

.content .workplace .headInfo .input-append {
    text-align: right;
}

.content .workplace .headInfo .input-append,
.content .workplace .headInfo .input-append button {
    margin-bottom: 0px;
}

.content .workplace .headInfo .actions {
    text-align: right;
    margin: 5px 0px 0px;
}

.content .workplace .headInfo .actions .btn-group .btn {
    margin: 0px;
}

.block,
.block-fluid {
    border: 1px solid #ccc;
    border-top: 0px;
    background-color: #F9F9F9;

    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.block-fluid.without-head,
.block.without-head {

    border-radius: 3px;
    border-top: 1px solid #ccc;
}

.block {
    padding: 10px;
}

/* ~Simple table~ */
[class*="block"] .table {
    margin: 0px;
}

[class*="block"] .table tr th {
    padding: 4px 8px;
    font-size: 12px;
    background-color: #F1F1F1;
    color: #666;
}

[class*="block"] .table tr th,
[class*="block"] .table tr td {
    border-right: 1px solid #ddd;
}

[class*="block"] .table tr th:last-child,
[class*="block"] .table tr td:last-child {
    border-right: 0px;
}

[class*="block"] .table tr td {
    background-color: #F9F9F9;
}

[class*="block"] .table tr:nth-child(2n+1) td {
    background-color: #FFF;
}

.table.images td.info>* {
    display: block;
    width: auto;
    clear: both;
}

.table.images td.info>span {
    font-size: 12px;
    color: #999;
}

/* ~Simple table~ */
/* Messaging */
.messaging {
    padding-top: 5px;
}

.messaging .itemIn,
.messaging .itemOut {
    margin: 5px 0px 10px 0px;
    clear: left;
    position: relative;
}

.messaging .itemIn .text,
.messaging .itemOut .text {
    padding: 7px 8px;
    border: 1px solid #d5d5d5;
    background-color: #FFF;
    margin-right: 70px;
    font-size: 14px;
    color: #333;
    line-height: 17px;

    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

.messaging .itemOut .text {
    margin: 0px 0px 0px 70px;
}

.messaging .itemOut .text .info,
.messaging .itemIn .text .info {
    margin-bottom: 5px;
}

.messaging .itemOut .text .info .name,
.messaging .itemIn .text .info .name {
    float: left;
    font-size: 14px;
    color: #005580;
    font-weight: bold;
}

.messaging .itemOut .text .info .name {
    color: #333;
}

.messaging .itemOut .text .info .date,
.messaging .itemIn .text .info .date {
    float: right;
    font-size: 14px;
    color: #999;
}

.messaging .itemIn .image,
.messaging .itemOut .image {
    position: absolute;
    display: block;
    right: 0px;
    top: 0px;
}

.messaging .itemOut .image {
    right: auto;
    left: 0px;
}

.messaging .controls {
    margin-top: 20px;
    text-align: right;
}

.messaging .controls .control {
    padding: 0;
    margin: 0;
    display: block;
    padding-right: 10px;
}

.messaging .controls .control textarea {
    width: 100%;
    padding: 4px;
    font-size: 14px;
}

/* Messaging */
.row-form {
    border-bottom: 1px solid #DDD;
    border-top: 1px solid white;
    padding: 2px 8px;
    vertical-align: middle;
}

.row-form:last-child {
    border-bottom: 0px;
}

.row-form:first-child {
    border-top: 0px;
}

.row-form [class^="span"] {
    line-height: 27px;
}

.row-form input[type="text"],
.row-form input[type="password"],
.row-form textarea {
    width: 100%;
    font-size: 14px;
    color: #454545;
    padding: 0px 7px 0px;
    border: 1px solid #D7D7D7;
    box-sizing: border-box;

    display: inline-block;
    height: 24px;
    margin: 0px;
    line-height: 22px;
}

.row-form input[type="text"].input-mini,
.row-form input[type="password"].input-mini {
    width: 50px;
}

.row-form input[type="text"].input-small,
.row-form input[type="password"].input-small {
    width: 90px;
}

.row-form input[type="text"].input-medium,
.row-form input[type="password"].input-medium {
    width: 150px;
}

.row-form input[type="text"].input-large,
.row-form input[type="password"].input-large {
    width: 210px;
}

.row-form input[type="text"].input-xlarge,
.row-form input[type="password"].input-xlarge {
    width: 270px;
}

.row-form input[type="text"].input-xxlarge,
.row-form input[type="password"].input-xxlarge {
    width: 530px;
}

.row-form textarea {
    min-height: 90px;
}

.row-form select {
    margin: 0;
    font-size: 14px;
    color: #666;
    padding: 0 7px;
    display: inline-block;
    line-height: 11px;
    border: 1px solid #AAAAAA;
    width: 100%;
    max-width: 100%;
    background: #f1f3f4;
    /* Removed gradients and unnecessary vendor prefixes */
}

.row-form select optgroup {
    border-left: 1px solid #AAA;
    border-right: 1px solid #AAA;
}

.row-form select option {
    padding: 3px;
}

.row-form select[multiple] {
    min-height: 100px;
    padding: 0px 0px 0px 5px;
    background: none;
    background-color: #FFF;
}

.row-form .select2-container,
.select2-results {
    font-size: 14px;
    width: 100% !important;
}

.row-form label.inline {
    font-size: 13px;
}

.radio.inline,
.checkbox.inline {
    padding-top: 0px;
}

.row-form span {
    font-size: 14px;
    color: #666;
    vertical-align: middle;
    padding-bottom: 2px;
}

.row-form .dataTables_paginate span {
    font-size: 13px;
    color: #666;
    vertical-align: top;
}

span.highlight {
    font-size: 14px;
    color: #f54646;
    vertical-align: top;
}

.row-form span.highlight {
    font-size: 14px;
    color: #f54646;
    /* vertical-align: middle; */
}

.row-form input[type="checkbox"],
.row-form input[type="radio"] {
    margin-left: 0px;
}

.formErrorContent {
    line-height: 19px !important;
}

.scrollBox {
    padding-right: 0px;
}

.scroll {
    overflow: hidden;
}

/* ~BOXES~ */
/* ~USERS LIST~ */
.users {
    position: relative;
    padding-left: 0px !important;
}

.users .item {
    clear: both;
    border-bottom: 1px solid #E4E8ED;
    padding: 8px 10px;
    position: relative;
    cursor: pointer;
}

.users .item:hover {
    background-color: #EDF1F5;
}

.users .item:last-child {
    border-bottom: 0px;
}

.users .item .image {
    position: absolute;
    left: 10px;
    top: 8px;
}

.users .item .info {
    padding-left: 0px;
    line-height: 32px;
}

.users .item .info a {
    font-size: 14px;
    color: #005580;
    font-weight: bold;
}

.users .item .info span {
    font-size: 14px;
    color: #738392;
    position: absolute;
    top: 8px;
    left: 75%;
}

.users .item .info span.text {
    left: auto;
    right: 10px;
    color: #333;
    font-weight: bold;
}

.users .item .info .controls {
    position: absolute;
    right: 10px;
    top: 10px;
    opacity: 0.5;
}

.users .item .info .controls:hover {
    opacity: 0.8;
}

/* ~USERS LIST~ */
/* ACCORDION */
.ui-accordion .ui-accordion-header {
    background-color: #F2F2F2;
    padding: 8px 10px 8px 30px;
    font-size: 12px;
    color: #005580;
    font-weight: bold;
    border: 0px;
    border-bottom: 1px solid #E4E8ED;
}

.ui-accordion .ui-state-hover {
    background-color: #ededed;
}

.ui-accordion .ui-widget-content:last-child {
    box-shadow: none;
}

.ui-accordion .ui-accordion-header:last-child {
    border-bottom: 0px;
    box-shadow: none;
}

/* DIALOG */
.dialog {
    padding: 10px 0px 10px 10px !important;
}

.dialog .block {
    border: 0px;
    padding: 0px;
    padding-right: 10px;
    background: transparent;
}

.dialog .block input[type="text"],
.dialog .block input[type="password"],
.dialog .block textarea {
    width: 100%;
    font-size: 14px;
    color: #454545;
    padding: 7px 7px 5px;
    border: 1px solid #D7D7D7;
    box-sizing: border-box;

    display: inline-block;
    background: #FDFDFD;
    height: 26px;
    margin: 0px;
}

.dialog .block textarea {
    min-height: 100px;
}

/* SLIDER */
.amount {
    line-height: 17px;
    font-size: 14px;
    color: #5A799C;
}

/* SIMPLE LIST */
.sList {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.sList li {
    display: block;
    padding: 0px 0px 0px;
    background-color: #F2F2F2;
    border-bottom: 1px solid #E4E8ED;
    border-top: 1px solid #FFF;
    cursor: pointer;
}

.sList li:hover {
    background-color: #F9F9F9;
}

.sList .placeholder {
    background-color: #fff8c4;
    height: 20px
}

/* LIST */
.withList {
    padding-top: 5px;
}

ul.list {
    list-style: none;
    padding: 0px;
    margin: 0px;
    position: relative;
}

ul.list li {
    padding: 8px 5px 8px 45px;
    color: #333;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #D9D9D9;
    position: relative;
}

ul.list li:first-child {
    border-top: 0px;
}

ul.list li:last-child {
    border-bottom: 0px;
}

ul.list li span.date {
    font-size: 14px;
    color: #666;
    display: block;
    position: absolute;
    left: 5px;
    top: 5px;
    width: 30px;
    line-height: 12px;
    text-align: center;
}

ul.list li span.date b {
    color: #2E801E;
    display: block;
}

/* LIST */
.block .footer,
.block-fluid .footer {
    background-color: #F2F2F2;
    border-top: 1px solid #DAE1E8;
    padding: 5px 5px 4px;
    text-align: right;
    margin-top: 5px;
}

/* SORTABLE TABLES*/
.dataTable {
    float: left;
}

.table-sorting {
    padding: 0px;
    position: relative;
    font-size: 12px;
    background-color: #FFF;
    min-height: 585px;
}

.table-sorting .dataTables_wrapper {
    float: left;
    width: 100%;
}

.table-sorting .dataTables_length {
    font-size: 14px;
    color: #333;
    line-height: 16px;
    width: 150px;
    float: left;
    padding: 5px;
}

.table-sorting .dataTables_length label,
.table-sorting .dataTables_filter label {
    font-size: 11px;
    color: #333;
    padding: 0px;
    line-height: 16px;
    height: auto;
    margin: 0px;
}

.table-sorting .dataTables_length label select {
    padding: 3px 2px 3px 5px;
    font-size: 14px;
    color: #333;
    width: auto;
    line-height: 16px;
    margin: 0px;
}

.table-sorting .dataTables_filter {
    font-size: 14px;
    color: #333;
    line-height: 16px;
    width: 400px;
    float: right;
    padding: 5px;
    margin-right: 50px;
}

.table-sorting .dataTables_filter label input[type="text"] {
    font-size: 14px;
    padding: 3px 2px 3px 5px;
    color: #333;
    line-height: 14px;
    margin: 0px;
    width: 350px;
    height: 25px;

}

.table-sorting .table {
    border-top: 1px solid #DDD;
    border-bottom: 1px solid #DDD;
}

.table-sorting .table td.dataTables_empty {
    font-size: 12px;
    text-align: center;
    color: #333;
}

.table-sorting .dataTables_info {
    float: left;
    font-size: 12px;
    color: #333;
    padding: 8px 10px;
    line-height: 16px;
    position: absolute;
    bottom: 0;
}

.table-sorting .dataTables_paginate {
    padding: 5px 25px 5px 5px;
    text-align: right;
    position: absolute;
    bottom: 0;
    width: 95%;
    float: right;
}

.table-sorting .dataTables_paginate a.paginate_disabled_previous,
.table-sorting .dataTables_paginate a.paginate_disabled_next,
.table-sorting .dataTables_paginate a.paginate_button,
.table-sorting .paginate_enabled_next,
.table-sorting .paginate_active,
.table-sorting .paginate_enabled_previous {
    padding: 5px;
    margin-left: 3px;
    font-size: 14px;
    color: #333;
    border: 1px solid #DDD;
    background: linear-gradient(to bottom, #F9F9F9 0%, #F1F1F1 100%);
    text-decoration: none;
    cursor: pointer;
}

.table-sorting .paginate_active {
    color: #fff;
    border: 1px solid #bcbfc0;
    background: linear-gradient(to bottom, #d6d7d8 0%, #aeb8c2 100%);
}

.table-sorting .dataTables_paginate .paginate_enabled_next:hover,
.table-sorting .dataTables_paginate a.paginate_button:hover,
.table-sorting .dataTables_paginate .paginate_enabled_previous:hover {
    box-shadow: inset 0 1px 3px #ccc, 0 1px 0 white;
    color: rgb(186, 208, 235);
}

.table-sorting .dataTables_paginate a.paginate_disabled_previous,
.table-sorting .dataTables_paginate a.paginate_button_disabled,
.table-sorting .dataTables_paginate a.paginate_disabled_next {
    cursor: default;
    color: rgb(45, 46, 47);
}

.table-sorting .dataTables_paginate a.paginate_button_disabled:hover {
    box-shadow: none;
    color: rgb(81, 83, 83);
}

.table-sorting .sorting_asc {
    background: url('../img/datatable/sort_asc.png') no-repeat center right;
    cursor: pointer;
}

.table-sorting .sorting_desc {
    background: url('../img/datatable/sort_desc.png') no-repeat center right;
    cursor: pointer;
}

.table-sorting .sorting {
    background: url('../img/datatable/sort_both.png') no-repeat center right;
    cursor: pointer;
}

.table-sorting .sorting_asc_disabled {
    background: url('../img/datatable/sort_asc_disabled.png') no-repeat center right;
}

.table-sorting .sorting_desc_disabled {
    background: url('../img/datatable/sort_desc_disabled.png') no-repeat center right;
}

/* ~GALLERY~ */
.block.gallery a {
    display: inline-block;
}

.block.thumbs .thumbnail {
    width: 210px;
    display: inline-block;
}

/* ~GALLERY~ */
/* ~WIDGETS~ */
.sOrders {
    padding: 0px;
    margin: 0px;
    font-size: 13px;
    position: relative;
    background-color: #F9F9F9;
}

.sOrders tr {
    border-bottom: 1px solid #E4E8ED;
    border-top: 1px solid #FFF;
}

.sOrders .firmBorders tr {
    border-bottom: 2px solid #85898d;
    border-top: 2px solid #85898d;
}

.sOrders tbody tr:nth-child(2n+1) {
    background-color: #FFF;
}

/* .sOrders tbody tr:last-child{border-bottom: 0px;} */
.sOrders tfoot tr {
    border-top: 1px solid #E4E8ED;
}

.sOrders .firmBorders tfoot tr {
    border-top: 2px solid #85898d;
}

.sOrders th {
    padding: 4px;
    font-size: 14px;
    color: #666;
    border-right: 1px solid #E4E8ED;
    text-align: center;
    background-color: #F1F1F1;
    top: 0;
    position: sticky;
}

.sOrders .firmBorders th {
    padding: 4px;
    font-size: 14px;
    color: #666;
    border-right: 2px solid #85898d;
    text-align: center;
    background-color: #F1F1F1;
    top: 0;
    position: sticky;
}

.sOrders td {
    padding: 7px;
    border-right: 1px solid #E4E8ED;
}

.sOrders .firmBorders td {
    padding: 4px;
    border-right: 2px solid #85898d;
}

.sOrders td a {
    color: #005580;
}

.sOrders td span.date {
    color: #2E801E;
    font-weight: bold;
    text-align: center;
}

.sOrders td span.time {
    color: #999;
    text-align: center;
    font-size: 14px;
}

.sOrders td span.price {
    color: #772E2C;
    font-weight: bold;
}

.sOrders th:last-child,
.sOrders td:last-child {
    border-right: 0px;
}

/* ~WIDGETS~ */
/* ~WIDGET BUTTONS ~*/
.widgetButtons {
    border: 0px;
    text-align: center;
    padding: 5px 0px;
}

.widgetButtons .bb {
    border: 1px solid #D5D5D5;
    padding: 5px;
    margin-top: 5px;

    border-radius: 5px;
    margin-left: 5px;
    position: relative;

    box-shadow: inset 0 0 5px #D5D5D5;
    background-color: #FFF;
    display: inline-block;
}

.widgetButtons .bb:first-child {
    margin: 0px;
}

.widgetButtons .bb a span[class^=ibb] {
    opacity: 0.8;
}

.widgetButtons .bb>a {
    display: block;
    float: left;
    padding: 20px;

    border-radius: 5px;
}

.widgetButtons .bb a {
    color: #FFF;
    border: 1px solid #416C9B;
    background: linear-gradient(to bottom, #5B7EA4 0%, #416C9B 100%);
    box-shadow: 0 1px 1px #222, 0px 1px 0 #7797ba inset;
}

.widgetButtons .gray a,
.wBlock.gray {
    color: #333;
    border: 1px solid #D9D9D9;

    background: linear-gradient(to bottom, #F9F9F9 0%, #E5E5E5 100%);

    box-shadow: 0 1px 1px #B5B5B5, 0px 1px 0 #FFF inset;
}

.widgetButtons .yellow a,
.wBlock.yellow {
    border: 1px solid #D6AB00;
    background: linear-gradient(to bottom, #F7CE00 0%, #ECB200 100%);
    box-shadow: 0 1px 1px #D39E00, 0px 1px 0 #FFEB89 inset;
}

.widgetButtons .red a,
.wBlock.red {
    border: 1px solid #AF2D1C;
    background: linear-gradient(to bottom, #D96D3A 0%, #CB2C1A 100%);
    box-shadow: 0 1px 1px #AF2D1C, 0px 1px 0 #FC9E76 inset;
}

.widgetButtons .green a,
.wBlock.green {
    border: 1px solid #677C13;
    background: linear-gradient(to bottom, #ADC800 0%, #829E18 100%);
    box-shadow: 0 1px 1px #677C13, 0px 1px 0 #DEF92F inset;
}

.widgetButtons .blue a,
.wBlock.blue {
    border: 1px solid #7E8FC4;
    background: linear-gradient(to bottom, #90C2EE 0%, #73A4D9 100%);
    box-shadow: 0 1px 1px #7E8FC4, 0px 1px 0 #B2DBFF inset;
}

.widgetButtons .bb a:active {

    box-shadow: 0px 0px 1px #444 inset;
}

.widgetButtons .bb .caption {
    position: absolute;
    right: -5px;
    top: -5px;
    font-size: 14px;
    display: block;
    padding: 2px 2px;
    line-height: 13px;

    border-radius: 3px;
    background-color: #416C9B;
    color: #FFF;
    border: 1px solid #416C9B;
}

.widgetButtons .bb .caption.gray {
    color: #333;
    border: 1px solid #D9D9D9;
    background: #E5E5E5;
}

.widgetButtons .bb .caption.yellow {
    border: 1px solid #D6AB00;
    background: #ECB200;
}

.widgetButtons .bb .caption.red {
    border: 1px solid #AF2D1C;
    background: #CB2C1A;
}

.widgetButtons .bb .caption.green {
    border: 1px solid #677C13;
    background: #829E18;
}

.widgetButtons .bb .caption.blue {
    border: 1px solid #7E8FC4;
    background: #73A4D9;
}

/* ~WIDGET BUTTONS ~*/
/* ~Table users list~ */
.listUsers {
    position: relative;
}

.listUsers .actions {
    margin: 5px 0px 0px 0px;
    text-align: center;
}

.listUsers .user {
    font-weight: bold;
}

.listUsers .about {
    margin: 0px;
}

.listUsers .info {
    margin: 0px;
    font-weight: bold;
}

.listUsers .info .green {
    color: #2E801E;
}

.listUsers .info .grey {
    color: #666;
}

.listUsers .info .red {
    color: #772E2C;
}

/* ~Table users list~ */
/* block widget */
.wBlock {
    position: relative;
    border-radius: 5px;
    margin-bottom: 20px;
    padding: 0px 5px 5px;
    color: #FFF;
    background: linear-gradient(to bottom, #5B7EA4 0%, #416C9B 100%);
    box-shadow: 0 1px 1px #222, 0px 1px 0 #7797ba inset;
}

.wBlock .wSpace {
    background-color: #FFF;
    padding: 0px 5px;
    margin: 5px;

    border-radius: 5px;

    box-shadow: 0px 0px 2px #999 inset;
}

.wBlock .dSpace {
    margin: 5px 0px 0px;
    background-color: #365B85;
    padding: 3px;

    border-radius: 5px;
    float: left;

    box-shadow: 0px 0px 2px #222 inset;
    width: 45%;
    min-width: 82px;
    min-height: 72px;
}

.wBlock .rSpace {
    width: 45%;
    float: right;
    margin: 5px 0px 0px;
}

.menu .wBlock {
    margin-bottom: 0px;
}

.wBlock.auto {
    width: auto;
    margin-right: 20px;
    float: left;
}

.wBlock.auto .dSpace,
.wBlock.auto .rSpace {
    width: auto;
}

.wBlock .dSpace h3,
.wBlock .rSpace h3 {
    margin: 2px 0px;
    padding: 0px;
    font-size: 12px;
    text-align: center;
    color: #c7e3fc;
    font-weight: normal;
    line-height: 14px;

    text-shadow: 0 1px 0 #333;
}

.wBlock .dSpace span,
.wBlock .rSpace span {
    display: block;
    text-align: center;
    color: #FFF;
    font-size: 12px;
    line-height: 16px;

    text-shadow: 0 1px 0 #333;
}

.wBlock .dSpace span.number {
    font-size: 30px;
    color: #FFF;
    font-weight: bold;
    line-height: 32px;
}

.wBlock .dSpace span b,
.wBlock .rSpace span b {
    font-weight: normal;
    color: #c7e3fc;
}

.wBlock .rSpace h3 {
    text-align: left;
}

.wBlock .rSpace span {
    text-align: left;
    margin-top: 2px;
}

.wBlock.gray .dSpace {
    background-color: #555;
}

.wBlock.gray .dSpace h3 {
    color: #F5F5F5;
}

.wBlock.gray .rSpace span,
.wBlock.gray .rSpace span b {
    color: #000;

    text-shadow: 0 1px 0 #FFF;
}

.wBlock.gray .rSpace span b {
    color: #555;
}

.wBlock.green .dSpace {
    background-color: #677C12;
}

.wBlock.yellow .dSpace {
    background-color: #9B7503;
}

.wBlock.red .dSpace {
    background-color: #7F1C0F;
}

.wBlock.blue .dSpace {
    background-color: #4A82BA;
}

.wBlock.green .dSpace h3,
.wBlock.green .rSpace span b {
    color: #FFF;
}

.wBlock.yellow .dSpace h3,
.wBlock.yellow .rSpace span b {
    color: #FFFCD6;
}

.wBlock.red .dSpace h3,
.wBlock.red .rSpace span b {
    color: #FFE3E2;
}

.wBlock.blue .dSpace h3,
.wBlock.blue .rSpace span b {
    color: #FFF;
}

.wBlock.yellow .rSpace span,
.wBlock.green .rSpace span,
.wBlock.red .rSpace span,
.wBlock.blue .rSpace span {
    color: #FFF;
}

/* block widget */
/* ~icons box~ */
.the-icons {
    padding: 0px;
    margin: 0px;
    list-style: none;
}

.the-icons li {
    width: 25%;
    float: left;
    padding: 5px 0px;
}

/* ~icons box~ */
/* ~Uploader~ */
.plupload_header {
    display: none;
}

.plupload_container {
    padding: 0px;
}

.plupload_scroll .plupload_filelist {
    background-color: #F9F9F9;
}

.plupload_filelist_header,
.plupload_filelist_footer {
    background-color: #F1F1F1;
}

/* ~Uploader~ */
/* ~User profile~ */
.ucard {
    border-top: 1px solid #CCC;
    position: relative;
    background: transparent;
    border: 0px;
}

.ucard .left {
    position: absolute;
    left: 10px;
    top: 10px;
    text-align: right;
}

.ucard .left h4 {
    margin-top: 0px;
    font-size: 14px;
    color: #365B85;

    text-shadow: 0 1px 0 #FFFFFF;
}

.ucard .left .image {
    margin-bottom: 10px;
}

.ucard .left .control {
    text-align: left;
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.ucard .left .control li a {
    color: #333;
    font-size: 14px;
}

.ucard .info {
    position: relative;
    margin-left: 0px;
}

ul.rows {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

ul.rows li {
    padding: 8px 0px;
    position: relative;
    border: 1px solid #D9D9D9;
    border-top-color: #FFF;
    background-color: #F9F9F9;
}

ul.rows li:first-child {
    border-top: 0px;
}

ul.rows li:nth-child(2n) {
    background-color: #F2F2F2;
}

ul.rows li.heading {
    background: url("../img/backgrounds/menu-item.jpg") repeat-x scroll left top transparent;
    color: #FFF;
    padding-left: 10px;

    text-shadow: 0 1px 0 #333;
}

ul.rows li .title {
    width: 120px;
    position: absolute;
    left: 10px;
    top: 8px;
    color: #999;
}

ul.rows li .text {
    margin-left: 120px;
}

ul.rows li span[class^='icon'] {
    margin-top: -1px;
}

/* ~User profile~ */
/* ~Stream~ */
.stream {
    position: relative;
}

.stream .item {
    border-bottom: 1px solid #E4E8ED;
    border-top: 1px solid #FFF;
    position: relative;
}

.stream .item .image {
    position: absolute;
    width: 60px;
    padding: 5px 0px 5px 0px;
    left: 0px;
    top: 0px;
}

.stream .item .info {
    margin: 5px 5px 5px 70px;
    font-size: 14px;
}

.stream .item .info .name {
    font-size: 12px;
    font-weight: bold;
}

.stream .item .info .title {
    color: #555;
    margin-bottom: 5px;
}

.stream .item .info .title span {
    margin: 0px !important;
}

.stream .item .info .actions {
    text-align: right;
    margin: 5px 0px 0px;
}

.stream .item .info .actions a {
    color: #333;
    margin-left: 5px;
    opacity: 0.8;
}

.stream .item .info .actions a:hover {
    opacity: 1;
}

.stream .item .info .actions a span {
    margin: 0px !important;
}

.text.gallery a {
    margin: 3px 3px 3px 0px;
}

.text.friends a {
    font-size: 12px;
    font-weight: bold;
    margin: 0px 5px 3px 0px;
}

.stream .answer {
    position: relative;
    padding-bottom: 5px;
}

.stream .answer .arrow {
    background: url('../img/textarea_top_arrow.png') left top no-repeat transparent;
    position: absolute;
    left: 50%;
    top: -9px;
    width: 17px;
    height: 12px;
}

.stream .answer .textarea {
    padding-right: 16px;
}

.stream .answer .textarea textarea {
    font-size: 14px;
    width: 100%;
}

.stream .answer .actions {
    text-align: right;
}

.stream .item:first-child {
    border-top: 0px;
}

.stream .item:last-child {
    border-bottom: 0px;
}

/* ~Stream~ */
/* ~Bootstrap modal~ */
.modal {
    background-color: #F9F9F9;
}

.modal div[class^='block'] {
    background: transparent;
    border: 0px;
}

.modal div[class^='row'] {
    margin: 0px;
}

.modal .dr {
    margin: 5px 0px;
}

.modal .row-form {
    padding: 10px 15px;
}

/* ~Bootstrap modal~ */
/* simple navigation */
.sNavigation {
    position: relative;
    border: 1px solid #D5D5D5;
    margin-bottom: 20px;
}

.sNavigation ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    position: relative;
}

.sNavigation ul li {
    background: #F2F2F2;
    border-top: 1px solid #FCFCFC;
    border-bottom: 1px solid #E4E8ED;
    position: relative;
}

.sNavigation ul li a {
    display: block;
    padding: 8px 10px;
    font-size: 13px;
    color: #333;
    outline: none;
}

.sNavigation ul li span.arrow {
    display: none;
    width: 12px;
    height: 17px;
    background: url('../img/menu-arrow-right.png') left top no-repeat;
    position: absolute;
    right: -12px;
    top: 10px;
}

.sNavigation ul li a span {
    margin: -1px 0px 0px;
}

.sNavigation ul li:hover a,
.sNavigation ul li.active a {
    background: #EDEDED;
    text-decoration: none;
}

.sNavigation ul li.active span.arrow {
    display: block;
}

.sNavigation ul li:first-child {
    border-top: 0px;
}

.sNavigation ul li:last-child {
    border-bottom: 0px;
}

/* simple navigation */
/* Toolbar */
.toolbar {
    padding: 3px 5px 0px;
    position: relative;
    border-bottom: 1px solid #D5D5D5;
}

.toolbar .left {
    float: left;
    display: block;
}

.toolbar .right {
    float: right;
    display: block;
}

.toolbar .pagination {
    margin: 2px 0px 0px;
    line-height: 16px;
}

.nm {
    margin: 0px !important;
}

.bottom-toolbar {
    border-top: 1px solid #D5D5D5;
    border-bottom: 0px;
}

.nopadding-toolbar {
    padding: 0px;
}

.toolbar h4 {
    background-color: #F1F1F1;
    font-size: 12px;
    margin: 0px;
    padding: 8px 10px;
}

.toolbar.clear {
    border: 0px;
}

/* Toolbar */
/* ~Mails~ */
.table .heading {
    background-color: #EDEDED !important;
    text-align: center;
    font-weight: bold;
    color: #333;
}

.table span[class^='icon'] {
    margin-top: -1px;
    padding: 2px
}

.table .mails_container {
    display: none;
}

.table a {
    outline: none;
}

/* ~Mails~ */
/* ~user short info~ */
.ushort {
    text-align: right;
    position: relative;
}

.ushort>* {
    display: block;
    float: right;
    width: 100%;
    margin-bottom: 5px;
}

.ushort a {
    font-size: 14px;
    font-weight: bold;
}

/* ~user short info~ */
/* ~uploads~ */
.block.uploads,
.block-fluid.uploads {
    position: relative;
}

.uploads .item {
    position: relative;
    padding-bottom: 10px;
    border-bottom: 1px solid #D5D5D5;
    border-top: 1px solid #FFF;
}

.uploads .item:first-child {
    border-top: 0px;
}

.uploads .item:last-child {
    border-bottom: 0px;
    padding-bottom: 0px;
}

.uploads .item span[class^='icon'] {
    margin-top: -1px;
}

.uploads .item p {
    margin-bottom: 0px;
}

.uploads .item .controls {
    position: absolute;
    right: 0px;
    top: 0px;
    opacity: 0.8;
}

.uploads .item .controls:hover {
    opacity: 1;
}

/* ~uploads~ */
/* ~Error pages~ */
.errorPage {
    position: absolute;
    left: 50%;
    margin-left: -300px;
    width: 600px;
    text-align: center;
    top: 25%;
}

.errorPage .name {
    font-size: 220px;
    color: #ffffff;
    line-height: 210px;
    color
    /*|**/
    : #666;
    text-shadow: 0px 0px 0 rgb(232, 232, 232), 1px 1px 0 rgb(217, 217, 217), 2px 2px 0 rgb(203, 203, 203), 3px 3px 0 rgb(188, 188, 188), 4px 4px 0 rgb(173, 173, 173), 5px 5px 0 rgb(158, 158, 158), 6px 6px 0 rgb(143, 143, 143), 7px 7px 6px rgba(0, 0, 0, 0.2), 7px 7px 1px rgba(0, 0, 0, 0.5), 0px 0px 6px rgba(0, 0, 0, .2);
}

.errorPage .description {
    font-size: 16px;
    color: #333;
    line-height: 30px;
    font-weight: bold;

    text-shadow: 0 1px 0 #FFFFFF;
}

/* ~Error pages~ */
.propic {
    position: relative;
    width: 150px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.57) 99%, rgba(0, 0, 0, 0.57) 100%);
    height: 75px;
    margin-top: -80px;
    display: none;
}

.propic2:hover .propic {
    display: block;
}

.hindiInstructions {
    font-family: 'Hindi', Arial, sans-serif;
    font-weight: normal;
    font-style: normal;
}

.ac_results ul {
    width: 100%;
    list-style-position: outside;
    list-style: none;
    padding: 0;
    margin: 0;
}

.ac_results li {
    margin: 0px;
    padding: 2px 5px;
    cursor: default;
    display: block;
    color: #fff;
    font-family: verdana;
    /*
	if width will be 100% horizontal scrollbar will apear
	when scroll mode will be used
	*/
    /*width: 100%;*/
    font-size: 12px;
    /*
	it is very important, if line-height not setted or setted
	in relative units scroll will be broken in firefox
	*/
    line-height: 16px;
    overflow: hidden;
}

.ac_loading {
    background: white url('../images/indicator.gif') right center no-repeat;
}

.ac_odd {
    background-color: #84a10b;
    color: #ffffff;
}

.ac_over {
    background-color: #5a6b13;
    color: #ffffff;
}

.input_text {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: 1px solid #84a10b;
    padding: 2px;
    width: 150px;
    color: #000;
    background: white url(../images/search.png) no-repeat 3px 2px;
    padding-left: 17px;
}

.errmsgdiv {
    font-size: 14px;
    width: 100%;
    color: red;
    text-align: center;
}

.sucmsgdiv {
    font-size: 14px;
    width: 100%;
    color: green;
    text-align: center;
}

.disabled {
    pointer-events: none;
    opacity: 0.6;
}

.highlightRow {
    background-color: #ffffa0;
}

.alert {
    color: #F5F5F5;
    text-shadow: 0 1px 0 #d6ab00;
    border: 1px solid #ECB200;
    background: linear-gradient(to bottom, #F7CE00 0%, #ECB200 100%);
}

.alert-success {
    padding: 8px 10px;
    margin-bottom: 10px;
    color: #fff;
    text-shadow: 0 1px 0 #677c13;
    border: 1px solid #829E18;
    background: linear-gradient(to bottom, #ADC800 0%, #829E18 100%);
    border-radius: 4px;
    cursor: pointer;
}

.alert-danger,
.alert-error {
    padding: 8px 10px;
    margin-bottom: 10px;
    color: #fff;
    text-shadow: 0 1px 0 #ad2516;
    border: 1px solid #CB2C1A;
    background: linear-gradient(to bottom, #D96D3A 0%, #CB2C1A 100%);
    border-radius: 4px;
    cursor: pointer;
}

.sOrders input[type="text"],
.sOrders input[type="password"],
.sOrders textarea {
    width: 100%;
    font-size: 14px;
    color: #454545;
    padding: 0px 7px 0px;
    border: 1px solid #D7D7D7;
    box-sizing: border-box;

    -ms-box-sizing: border-box;
    display: inline-block;
    height: 24px;
    margin: 0px;
    line-height: 22px;
}

.sOrders input[type="text"].input-mini,
.sOrders input[type="password"].input-mini {
    width: 50px;
}

.sOrders input[type="text"].input-small,
.sOrders input[type="password"].input-small {
    width: 90px;
}

.sOrders input[type="text"].input-medium,
.sOrders input[type="password"].input-medium {
    width: 150px;
}

.sOrders input[type="text"].input-large,
.sOrders input[type="password"].input-large {
    width: 210px;
}

.sOrders input[type="text"].input-xlarge,
.sOrders input[type="password"].input-xlarge {
    width: 270px;
}

.sOrders input[type="text"].input-xxlarge,
.sOrders input[type="password"].input-xxlarge {
    width: 530px;
}

.sOrders textarea {
    min-height: 90px;
}

.sOrders select {
    margin: 0px;
    font-size: 14px;
    color: #666;
    padding: 0px 7px 0px;
    display: inline-block;
    line-height: 11px;
    border: 1px solid #AAAAAA;
    max-width: 100%;
    width: 100%;
    background: #f1f3f4;

    /* Optional: If you still want a gradient, use modern syntax like this: */
    /* background: linear-gradient(to top, #EEE 0%, #FFF 50%); */
}

.sOrders select optgroup {
    border-left: 1px solid #AAA;
    border-right: 1px solid #AAA;
}

.sOrders select option {
    padding: 3px;
}

.sOrders select[multiple] {
    min-height: 100px;
    padding: 0px 0px 0px 5px;
    background: none;
    background-color: #FFF;
}

.sOrders .select2-container,
.select2-results {
    font-size: 14px;
    width: 100% !important;
}

.sOrders label.inline {
    font-size: 13px;
}

.ui-widget {
    font-size: 14px;
}

.ui-widget .ui-widget {
    font-size: 14px;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
    font-size: 14px;
}

.searchbox {
    border-color: blue !important;
    box-shadow: 2px 2px 2px 0 #e7dbf2 !important;

}

.v-text {
    transform: rotate(-90deg);
    /* transform-origin: left bottom 0; */
    height: 150px;
    width: 20px;

}

.loading {
    background: url('../img/loaders/loader.gif') no-repeat right center;
    background-size: 16px 16px;
    /* Adjust size of the spinner */
}

.modal-header {
    height: 25px;
}

input[type="date"] {
    max-width: 120px;
}

.savebtn {
    font-size: large;
    font-weight: bolder;
    margin-top: 5px;
}

/* Default info message */
.info-message {
    background-color: #c3ddea;
    color: #1f4456;
    padding: 10px;
    border: 1px solid #bce8f1;
    border-radius: 5px;
    margin-top: 10px;
    font-weight: bolder;
}

/* Success message */
.success-message {
    background-color: #c3ecb2;
    color: #1e401f;
    padding: 10px;
    border: 1px solid #d6e9c6;
    border-radius: 5px;
    margin-top: 10px;
    font-weight: bolder;
}

/* Error message */
.error-message {
    background-color: #d7a7a7;
    color: #421e1e;
    padding: 10px;
    border: 1px solid #ebccd1;
    border-radius: 5px;
    margin-top: 10px;
    font-weight: bolder;
}

/* Warning message */
.warning-message {
    background-color: #e4daa8;
    color: #513f21;
    padding: 10px;
    border: 1px solid #faebcc;
    border-radius: 5px;
    margin-top: 10px;
    font-weight: bolder;
}

#overlay {
    position: fixed;
    /* Ensure it covers the entire screen */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    /* Semi-transparent black */
    z-index: 1200;
    /* Ensure it stays on top */
    display: flex;
    /* Flexbox for centering */
    justify-content: center;
    /* Center horizontally */
    align-items: center;
    /* Center vertically */
}

#overlay img {
    max-width: 100px;
    /* Optional: Loader max width */
    max-height: 100px;
    /* Optional: Loader max height */
    margin: 0;
    /* Remove default margin */
}

/* Optional smoother fade-in and fade-out animations */
.fade-in {
    animation: fadeIn 0.3s ease-in-out forwards;
}

.fade-out {
    animation: fadeOut 0.3s ease-in-out forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.loader {
    width: 150px;
    /* Adjust width based on your design */
    height: 30px;
    position: relative;
    animation: l4-0 1s linear infinite alternate;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: Arial, sans-serif;
    font-size: 20px;
    color: #000;
    /* Text color */
    text-align: center;
    white-space: nowrap;
}

/* Add dots to the "Loading" text */
.loader .text::after {
    content: "";
    animation: loadingText 1.5s steps(7) infinite;
}

@keyframes loadingText {
    0% {
        content: "Loading";
    }

    15% {
        content: "Loading ple";
    }

    30% {
        content: "Loading please";
    }

    45% {
        content: "Loading please w";
    }

    60% {
        content: "Loading please wai";
    }

    75% {
        content: "Loading please wait";
    }

    90% {
        content: "Loading please wait . . ";
    }

    100% {
        content: "Loading please wait . . .";
    }
}

/* Loader dots animation (move them) */
.loader:before {
    content: "";
    position: absolute;
    width: 8px;
    height: 12px;
    background: #000;
    left: 0;
    top: 0;
    animation: l4-1 1s linear infinite alternate, l4-2 0.5s cubic-bezier(0, 200, .8, 200) infinite;
}

/* Loader keyframes for dot movement */
@keyframes l4-0 {
    0% {
        background-position: 0 100%, 50% 0, 100% 0;
    }

    8%,
    42% {
        background-position: 0 0, 50% 0, 100% 0;
    }

    50% {
        background-position: 0 0, 50% 100%, 100% 0;
    }

    58%,
    92% {
        background-position: 0 0, 50% 0, 100% 0;
    }

    100% {
        background-position: 0 0, 50% 0, 100% 100%;
    }
}

@keyframes l4-1 {
    100% {
        left: calc(100% - 8px);
    }
}

@keyframes l4-2 {
    100% {
        top: -0.1px;
    }
}

/* Animate the "Loading" text itself (scale, change color, etc.) */
@keyframes loadingTextAnimate {
    0% {
        transform: scale(1);
        color: #000;
    }

    50% {
        transform: scale(1.2);
        color: #677C12;
        /* Change color on halfway */
    }

    100% {
        transform: scale(1);
        color: #000;
    }
}

.loader .text {
    position: relative;
    z-index: 1;
    animation: loadingTextAnimate 1.5s ease-in-out infinite;
}

.btn .caret {
    margin-top: 5px;
    margin-left: 5px;
    width: 3px;

}

.btn [class*="isw-"],
.btn [class*="isb-"] {
    width: 12px;
    height: 12px;
}

.fixed-button {
    position: fixed;
    bottom: 20px;
    left: calc(50% + 125px);
    transform: translateX(-50%);
    padding: 10px 20px;
    cursor: pointer;
    z-index: 1000;
    /* Ensure it's above other elements */
}

/* Global Dropdown Styles */
.global-dropdown {
    position: absolute;
    background: white;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    display: none;
    min-width: 200px;
    /* Ensures a good width */
    max-height: 250px;
    /* Prevents overflow */
    overflow-y: auto;
    /* Adds scroll if too many items */
    z-index: 9999;
    /* Ensures it's always on top */
    font-family: Arial, sans-serif;
    font-size: 14px;
}

/* Dropdown items */
.global-dropdown .dropdown-item {
    padding: 8px 12px;
    cursor: pointer;
    transition: background 0.2s;
}

/* Hover effect */
.global-dropdown .dropdown-item:hover,
.global-dropdown .dropdown-item.active {
    background: #007bff;
    color: white;
}

/* Empty dropdown message */
.global-dropdown .dropdown-item:empty {
    color: #999;
    font-style: italic;
}

.FormErrorMessage {

    font-size: 14px;
    margin-top: 5px;
    background-color: #f29b9b;
    padding-left: 10px;
    /* border: 1px solid #ebccd1; */
    border-radius: 5px;
    font-weight: bold;
    /* color: white !important; */
}

/* Alert Box Styles */
.custom-alert {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    min-width: 300px;
    text-align: center;
    font-size: 16px;
    font-family: Arial, sans-serif;
    border-radius: 8px;
    color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    display: none;
    z-index: 1000;
    font-style: italic;
}

.custom-alert.error {
    background-color: #f44336;
    /* Red */
}

.custom-alert.success {
    background-color: #4CAF50;
    /* Green */
}

.custom-alert.normal {
    background-color: white;
    color: black;
    /* Green */
}

.custom-alert button {
    margin-top: 15px;
    padding: 8px 15px;
    border: 1px solid black;
    cursor: pointer;
    font-size: 14px;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.custom-alert button.ok {
    background-color: white;
    color: black;
    min-width: 75px;
    line-height: 15px;
    font-weight: inherit;
}

thead tr th {
    position: sticky;
    top: 0;
    background: #f8f8f8 !important;
    /* Ensure background stays */
    z-index: 20;
    border-bottom: 2px solid #ddd;
}

/* Ensure the table remains properly styled */
.table thead th {
    background: #cce5ff !important;
    /* Light blue header background */
}

/* Fix DataTables Header Issue */
table.dataTable thead {
    background-color: #cce5ff !important;
}