body {
    font-family: arial, serif;
    text-align: center;
    color: #404040;
}
.italic {
    font-style: italic
}
a {
    color: #444;
}
h1 {
    border-bottom: 3px solid #454545;
    display: block;
    width: 800px;
    margin-left: auto;
    margin-right: auto;
    color: #454545
}
h2 {
    text-align: center;
}
.noticeWidgetContent {
    border: 1px solid silver;
    margin: 1em 0
}
.noticeWidgetContent .message {
    background: #afa;
    padding: 0.5em 0;
    font-size: 16px;
    color: black
}
.noticeWidgetContent .warning {
    background: #f88;
    padding: 0.5em 0;
    font-size: 16px;
    color: black
}
.top-menu {
    margin-bottom: 1em
}
.top-menu a {
    display: inline-block;
    margin-left: 10px;
    padding: 3px 7px;
    border-radius: 5px;
    color: #404040;
    text-decoration: none;
}
.top-menu a:hover {
    background: #aeaeae;
    color: white
}
.top-menu a.selected {
    background: #404040;
    color: white
}
.yiiPager {
    list-style: none;
    font-size: 16px;
}
.yiiPager li {
    display: inline-block;
}
.yiiPager .hidden, .yiiPager .first, .yiiPager .last {
    display: none;
}
.yiiPager .page a {
    text-decoration: none;
    padding: 1px 4px;
    display: inline-block;
    min-width: 1em;
    color: #525252;
    font-weight: normal;
}
.yiiPager .page:hover {
    background: #9b9b9b;
    color: white
}
.yiiPager .page {
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: center;
    border-radius: 5px;
}
.yiiPager .page.selected {
    background: #525252;
}
.yiiPager .page.selected a {
    color: white;
}
.rect {
    margin-right: 10px;
    text-decoration: none;
    border: 0;
}
input.rect {
    cursor: pointer;
}
a.rect {
    display: inline-block;
}
.rect.gray {
    background: #8f8f8f;
    color: white
}
.rect.gray:hover, .rect.gray.selected {
    background: #4c4c4c;
    color: white
}
.rect.green {
    background: #044c00;
    color: white
}
.rect.green:hover, .rect.green.selected {
    background: #068800;
    color: white
}
.rect.blue {
    background: #0e509e;
    color: white
}
.rect.blue:hover, .rect.blue.selected {
    background: #0e509e;
    color: white
}
.rect.red {
    background: #9e0000;
    color: white
}
.rect.red:hover, .rect.red.selected {
    background: #d00000;
    color: white
}
.rect.purple {
    background: #810043;
    color: white
}
.rect.purple:hover, .rect.purple.selected {
    background: #a60056;
    color: white
}
.rect {
    padding: 3px 10px;
    font-size: 120%;
}
.banlist-content .rect, .feedback-content .rect, .rect.larger, .chatlist-content .rect {
    padding: 5px 10px;
    font-size: 16px
}
.banlist-content, .chatlist-content, .feedback-content, .suspicious-content, .promo-content, .promo-url-list, .thread-content {
    margin-left: auto;
    margin-right: auto;
    width: 85%;
    margin-top: 1em
}
.thread-content {
    width: 95%;
}
.banlist-content th, .chatlist-content th, .feedback-content th, .suspicious-content th, .thread-content th {
    text-align: left;
    padding-bottom: 3px;
    font-size: 11px;
    color: #444;
    font-weight: bold
}
.promo-content th, .promo-url-list th {
    padding-bottom: 3px;
    padding-right: 15px;
    font-size: 11px;
    color: #444;
    font-weight: bold
}
.banlist-content th a, .chatlist-content th a, .feedback-content th a, .suspicious-content th a, .thread-content th a {
    font-size: 11px;
    color: #444;
    font-weight: bold
}
th a.sortDesc {
    padding-right: 15px;
    background: url('/i/sort-up.jpg') center right no-repeat
}
th a.sortAsc {
    padding-right: 15px;
    background: url('/i/sort-down.jpg') center right no-repeat
}
.banlist-content td, .chatlist-content td, .feedback-content td, .thread-content td {
    font-style: italic;
}
.banlist-content td.date {
    width: 90px
}
.banlist-content td.tel {
    width: 120px;
}
.banlist-content td.nick {
    width: 150px;
}
.banlist-content td.banned-until {
    width: 100px;
}
.banlist-content td.actions {
    width: 120px;
}
.banlist-content, .chatlist-content, .suspicious-content, .extraMsisdnList-content, .feedback-content {
    border-spacing: 10px;
}
table .bordered {
    border: 1px solid silver;
}
.banlist-content td .ban-to-date {
    text-align: right;
    font-size: 12px
}
table td div.subtext {
    color: gray;
    font-size: 0.9em;
    text-align: right;
    font-style: italic;
    padding-right: 15px;
    margin-bottom: 5px
}
.chatlist-content td.first {
    width: 650px;
}
.chatlist-content td.second {
    width: 150px;
}
.chatlist-content .spanbutton {
    width: 150px;
    display: inline-block;
}
.form-wrapper {
    padding: 20px 130px;
    border-radius: 10px;
    background: #5e5e5e;
    width: 550px;
    /*display: inline-block;*/
    margin-left: auto;
    margin-right: auto;
    color: white;
    text-align: center;
}
.form-wrapper td {
    color: white;
    font-size: 14px;
}
.form-wrapper h3 {
    font-weight: normal;
    padding: 0;
    margin: 0;
    font-size: 14px;
}
.form-wrapper h3 {
    margin-bottom: 5px
}
.form-wrapper .block {
    float: left;
    text-align: left;
    margin-right: 15px;
    margin-bottom: 1em
}
.form-wrapper .block.full-width {
    width: 100%
}
/*
.form-wrapper .block.right {float:right; margin-right: 0px}
.form-wrapper .block.right { text-align:right; }
.form-wrapper .block.right .WPageSize a { margin-right:0; margin-left:5px; }
*/
.form-wrapper .block input {
    margin: 0
}
.form-wrapper .WPageSize {
    font-size: 16px;
}
.form-wrapper .WPageSize .ref-container {
    padding-top: 3px;
    font-size: 18px
}
.form-wrapper .WPageSize a {
    text-decoration: none;
    font-weight: normal;
    padding: 1px 4px;
    display: inline-block;
    min-width: 1em;
    color: white;
    margin-right: 14px;
    border-radius: 5px
}
.form-wrapper .WPageSize a:hover {
    background: #a8a8a8
}
.form-wrapper .WPageSize a.selected {
    background: #f8f8f8;
    color: #6c6c6c
}
.banlistItemFormWrapper {
    text-align: left
}
.banlistItemFormWrapper textarea, .banlistItemFormWrapper .tel, .banlistItemFormWrapper .date {
    width: 100%
}
.extraMsisdnList-content, .feedback-content {
    margin-left: auto;
    margin-right: auto;
    width: 85%
}
.extraMsisdnList-content th {
    text-align: left;
    padding-bottom: 3px;
    font-size: 11px;
    color: #444;
    font-weight: bold
}
.extraMsisdnList-content td {
    font-style: italic;
}
.feedback-content .actionSetProcessed img,
.feedback-content .actionRemove img {
    opacity: 0.3
}
.feedback-content .actionSetProcessed:hover img,
.feedback-content .actionRemove:hover img {
    opacity: 1
}
@media (max-width: 1600px) {
    .feedback-content, .banlist-content {
        width: 95%;
    }
    .chatlist-content {
        width: 850px;
    }
}
.feedback-content .replyContainer, .feedback-content .replyForm {
    width: 100%;
    padding: 0;
    margin: 0;
}
.feedback-content .replyContainer > a {
    text-decoration: none;
}
.feedback-content .replyContainer > a h3 {
    margin: 0.2em
}
.feedback-content .replyContainer {
    color: gray;
    font-size: 14px;
    font-style: italic;
    float: none;
    text-align: right;
    width: 100%;
    display: block
}
.feedback-content .replyForm textarea {
    width: 100%;
    text-align: left;
}
.feedback-content .replyForm h3 {
    margin: 0;
    padding: 0
}
.feedback-content .replyForm, .feedback-content .replyForm textarea {
    margin: 0;
}
.feedback-content .replyForm input.rect {
    font-size: 14px;
    margin: 0.5em 0 0 0;
}
.extraMsisdnList-content .actionEdit img,
.extraMsisdnList-content .actionRemove img {
    opacity: 0.3
}
.extraMsisdnList-content .actionEdit:hover img,
.extraMsisdnList-content .actionRemove:hover img {
    opacity: 1
}
.photo-content .rotator-wrapper {
    position: absolute;
    bottom: 0px;
    text-align: center;
    width: 100%;
}
.photo-content .photo-container {
    position: relative;
}
.photo-content .rotate-cw img,
.photo-content .rotate-ccw img {
    height: 45px
}
.photo-content .photo-container {
    width: 200px;
    text-align: center
}
.photo-content .cell-description {
    font-size: 14px;
    padding-left: 1em
}
.actions h3 {
    display: inline-block;
    margin: 0;
    font-weight: normal;
    color: white
}
.actions > div {
    float: left
}
.photo-content .actions {
    margin: 1em 0 0 0
}
.suspicious-content .messageCount {
    width: 50px
}
.login-form-wrapper {
    border-radius: 15px;
    background: silver;
    /*display: inline-block;*/
    margin-left: auto;
    margin-right: auto;
    padding: 2em 4em;
    text-align: left;
    width: 250px
}
.login-form-wrapper h3 {
    margin: 1em 0 0.1em 0
}
.login-form-wrapper button {
    border: 1px solid gray;
    background: green;
    padding: 2px 1em;
    color: white;
    font-size: 16px;
    font-weight: bold;
    width: 100%;
    cursor: hand
}
.login-form-wrapper input {
    width: 100%
}
.wrapped-text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100px
}
.text-container {
    position: relative;
    word-break: break-all;
}
table sup {
    color: #8b8b8b;
    font-size: 11px;
    font-style: italic;
    float: right;
}
.larger {
    padding: 4px 0.5em;
    font-size: 16px;
    min-height: 20px;
}
.saveDialogChoises h3 {
    margin: 0;
    font-weight: normal
}
/**
 * Редактирование пользователя
 */
.userEditFormWrapper {
    width: 850px;
    margin-left: auto;
    margin-right: auto;
}
.userEditForm h3 {
    display: block;
    text-align: left
}
.userEditForm .editFieldContainer {
    display: block;
    width: 100%;
    box-sizing: border-box
}
.userEditForm .editFieldContainer input[type='text'] {
    width: 100%;
    text-align: right;
    padding-right: 10px
}
.userEditForm .inline-radio {
    text-align: left
}
.userEditForm .inline-radio label {
    display: inline-block;
    min-width: 21%;
    margin: 0;
    box-sizing: border-box;
}
.userEditForm .inline-radio input {
    display: inline-block;
    min-width: 3%;
    margin: 0;
    box-sizing: border-box;
}
.userEditForm .inline-radio br {
    display: none
}
.userEditForm, .userEditForm td {
    color: #4f4f4f;
    font-size: 14px;
}
.userEditForm .larger {
    font-size: 18px
}
.ui-widget li a {
    font-size: 0.7em;
    text-align: left
}
.userEditForm .basic-info td {
    padding-right: 20px;
}
.userEditForm h3 {
    font-size: 18px;
    margin-bottom: 10px
}
.userEditForm .form-birthday input[type='text'] {
    display: inline-block;
    width: 60px;
    text-align: center;
}
.userEditForm .form-birthday .day input[type='text'], .userEditForm .form-birthday .month input[type='text'] {
    width: 35px;
    text-align: center;
}
.userEditForm input {
    font-style: italic;
    padding-left: 5px;
    padding-right: 5px
}
.editFieldContainer.city {
    float: right;
    display: block;
    width: 80%;
    margin-top: -30px;
}
.editFieldContainer textarea {
    width: 100%;
    box-sizing: border-box;
    height: 4.2em;
    font-style: italic;
    padding: 5px;
}
.appearance {
    text-align: left
}
.appearance h4 {
    width: 50px;
    display: inline-block
}
.appearance .editFieldContainer {
    width: 100px;
    display: inline-block;
    margin-right: 50px;
}
.editFieldContainer span {
    display: block;
    margin-top: 10px;
    margin-bottom: 3px;
}
.editFieldContainer.password {
    float: right;
    width: 80%;
    margin-top: -30px;
}
.userEditForm .errorMessage {
    border: 1px solid silver;
    margin: 0.2em 0;
    background: #f88;
    padding: 0.5em 2em;
    font-size: 16px;
    color: black;
    position: relative;
    top: -0.4em;
}
/*Banner stat*/

#manageBanner .bannerList {
    width: 100%;
}
#manageBanner .bannerList select {
    width: 100%;
}
#manageBanner .bannerList .source, #manageBanner .bannerList .dest {
    width: 45%;
}
.slider {
    border-bottom: dashed 1px white;
    width: 100%;
}
#manageBanner {
    width: 600px;
}
#reportdata .table table {
    text-align: center;
    display: inline-block;
    /*width: 555px;*/
    padding: 0;
    border-spacing: 0;
}
#reportdata .table td {
    text-align: center;
    /*border-bottom: 1px solid #f0efef;*/
    border: 1px solid #f0efef;
}
#reportdata .table th {
    background-color: #5e5e5e;
    color: white;
    text-align: center;
    font-size: 12px;
}
#reportdata .table .thbannerName, #reportdata .table .thbannerUrl {
    width: 100px;
}
#reportdata .table th.hour, #reportdata .table th.thnumber {
    width: 30px;
}
#reportdata .table tr.even {
    background-color: #f0efef;
}
#reportdata .table td.even {
    background-color: #f0efef;
    border: solid 1px #d3d3d3;
}
.chart svg {
    height: 500px;
    margin: 10px;
    min-width: 100px;
    min-height: 100px;
    /*
      Minimum height and width is a good idea to prevent negative SVG dimensions...
      For example width should be =< margin.left + margin.right + 1,
      of course 1 pixel for the entire chart would not be very useful, BUT should not have errors
    */
}
.chart {
    width: 100%;
    display : inline-block;
}
.jqplot-yaxis {
    margin-right: 10px;
}
div.banner-mts.trig-go {
    background-color: #2932ab;
    margin: 0;
    padding: 7px 0;
    /*border: none;*/
    border-radius: 20px;
    position: relative;
    margin: 4px auto;
    width: 308px;
    height: 50px;
}
div.banner-mts.trig-go img {
    margin: 0 10px 0 10px;
    float: left;
    vertical-align: middle;
}
.trig-go a {
    text-decoration: none;
    font-size: 12px;
    display: block;
    height: 100%;
    padding: 10px;
}
.block.right {
    float: right
}
.taRight {
    text-align: right
}
.taJustify {
    text-align: justify;
}
.taLeft {
    text-align: left
}
ul#nav {
    /*список ul элемента (нашего div) с идентификатором nav*/
    list-style-type: none; /*задаем стиль отображения маркеров или нумерации для элементов списка - отобразить без маркера*/
    margin: 0; /*внешние отступы все 0*/
    padding: 0; /*внутренние отступы все 0*/
}
#nav {
    /*элемент (наш div) с идентификатором nav*/
    /*float:left; /*выравниваем по левой стороне, остальные элементы обтекают справа*/
    width: 550px; /*ширина 100%*/
    height: 75px; /* Высота всего меню (и верхнего уровня и нижнего, все вместе) */
    position: relative; /*элемент (наш div) с идентификатором nav*/
    margin: 0px 0 40px; /*внешние отступы - сверху, справа-слева, снизу*/
}
#nav .select, #nav .current {
    /*элемент (наш div) с классом select и current*/
    margin: 0; /*внешние отступы все 0*/
    padding: 0; /*внутренние отступы все 0*/
    list-style: none; /*задаем стиль отображения маркеров или нумерации для элементов списка - отобразить без маркера*/
    display: block; /*блочный элемент - элементы начинаются с новой строки. После элемента также добавляется перенос строки*/
}
#nav li {
    /*элемент li элемента с идентификатором nav*/
    font-family: Arial; /*шрифт меню*/
    display: inline; /*элемент ведет себя как строчный*/
    margin: 0; /*внешние отступы все 0*/
    padding: 0; /*внутренние отступы все 0*/
    height: auto; /*высота зависит от содержимого элемента т.е. по высоте*/
}
#nav .select a, #nav .current a {
    /*ссылки элемента li элемента с идентификатором nav*/
    display: block; /*блочный элемент - элементы начинаются с новой строки. После элемента также добавляется перенос строки*/
    height: 40px; /* высота (для верхнего уровня) */
    float: left; /*выравниваем по левой стороне, остальные элементы обтекают справа*/
    padding: 0 0 0 0px; /*внутренние отступы слева, справа, сверху, снизу*/
    text-decoration: none; /*подчеркивание отсутствует*/
    font-size: 14px; /* размер шрифта верхнего уровня */
    line-height: 40px; /* задаем высоту линии (интерлиньяж, межстрочный интервал) текста*/
    white-space: nowrap; /* указываем как отображать пробелы - автоматический перевод игнорируется, текст отображается одной строкой*/
    margin-right: 2px; /*внешний отступ справа для пунктов верхнего уровня*/
    position: relative; /* устанавливаем способ позиционирования элемента на веб странице - обычное положение элемента. Дочерние элементы с абсолютным позиционированием будут позиционироваться относительно границ родителя*/
    z-index: 500; /*задаем положение на z-оси, т.е. какой из элементов будет виден, если они наложатся друг на друга - целое число, чем больше число, тем «выше» элемент по z-оси*/
}
#nav .select a b, #nav .current a b {
    /*теги a и b элемента (наш div) с классом select и current элемента с идентификатором nav*/
    font-weight: normal;
    height: 100%; /* Высота 100%*/
    display: block; /*блочный элемент - элементы начинаются с новой строки. После элемента также добавляется перенос строки*/
    padding: 0 20px 0 20px; /*внутренние отступы сверху, справа, снизу, слева*/
    color: #606060; /* цвет (для ссылок верхнего уровня, они ведь заключены в теги a и b)*/
}
#nav .select a:hover, #nav .select li:hover a {
    /*ссылки и элементы li элемента с идентификатором nav и классом select при наведении курсора*/
    background-position: 0 -50px; /*задаем позицию фонового изображения относительно элемента, для которого указан*/
    cursor: pointer; /*задает тип курсора, который будет отображаться при наведении на элемент здесь в виде руки (обычный)*/
}
#nav .select a:hover b, #nav .select li:hover a b {; /*ссылки и элементы li при наведении курсора элемента с идентификатором nav и классом select*/
    background-position: 100% -50px; /*задаем позицию фонового изображения относительно элемента, для которого указан*/
    color: #000; /* цвет для них*/
}
#nav .sub {
    /*класс sub элемента с идентификатором nav*/
    display: none; /*"удаляем" элемент со страницы вместе с содержимым - элемент не видим*/
}
#nav .current a {
    /*класс current ссылки элемента с идентификатором nav*/
    background-position: 0 -50px; /*задаем позицию фонового изображения относительно элемента, для которого указан*/
    border-color: #046; /*цвет границы*/
}
#nav .current a b {
    /*класс current элемента с идентификатором nav тегов a и b*/
    background-position: 100% -50px; /*задаем позицию фонового изображения относительно элемента, для которого указан*/
    color: #000; /* цвет для них*/
    font-weight: bold;
}
#nav .sub li a:hover, #nav .select a:hover .sub li a:hover, #nav .select li:hover .sub li a:hover, #nav .sub_active .current_sub a, #nav .sub_active a:hover {
    /*класс current, sub элемента li и ссылок при наведении в элементе с идентификатором nav (т.е. вид текста при наведении на ссылки нижнего меню)*/
    border-radius: 5px;
    color: #fff; /* цвет для них (активного)*/
    color: #404040;
    text-decoration: underline; /*подчеркивание есть*/
}
#nav .sub_active .current_sub a {
    /*класс current, sub элемента li и ссылок при наведении в элементе с идентификатором nav (т.е. вид текста при наведении на ссылки нижнего меню)*/
    border-radius: 5px;
    color: #fff; /* цвет для них (активного)*/
    background: #404040;
    text-decoration: underline; /*подчеркивание есть*/
}
#nav .select li a:hover .sub, #nav .select li:hover .sub, #nav .sub_active {
    /*ссылки, элементы li при наведении курсора с классом sub в классе select элемента с идентификатором nav, класс sub_active элемента с идентификатором nav*/
    display: block; /*блочный элемент - элементы начинаются с новой строки. После элемента также добавляется перенос строки*/
    position: absolute; /*устанавливаем способ позиционирования элемента на веб странице - абсолютное позиционирование элемента, относительно окна браузера или блока-родителя со свойствами position: absolute или position: relative (в данном случае относительно элемента (наш div) с идентификатором nav)*/
    width: 100%; /* ширина - на всю ширину*/
    height: 35px; /* высота*/
    top: 40px; /* задаем позицию верхнего края элемента относительно верхней стороны родителя - т.е. со смещением 40px*/
    left: 0; /*задаем расстояние от левого края родителя*/
    background: #fff; /*фон нижнего уровня */
    border: 5px;
    padding: 0; /*внутренние отступы все 0*/
    z-index: 100; /*задаем положение на z-оси, т.е. какой из элементов будет виден, если они наложатся друг на друга - целое число, чем больше число, тем «выше» элемент по z-оси - здесь элемент при наведении курсора будет выше*/
}
#nav .sub_active {
    /*класс sub_active элемента с идентификатором nav*/
    z-index: 10; /*задаем положение на z-оси, т.е. какой из элементов будет виден, если они наложатся друг на друга - целое число, чем больше число, тем «выше» элемент по z-оси*/
}
#nav .sub, #nav .sub_active {
    /*класс sub и sub_active элемента с идентификатором nav*/
    margin: 0; /*внешние отступы все 0*/
    padding: 0; /*внутренние отступы все 0*/
    list-style: none; /*задаем стиль отображения маркеров или нумерации для элементов списка - отобразить без маркера*/
}
* html #nav .sub_active, * html #nav .select a:hover .sub {
    z-index: -1; /*задаем положение на z-оси, т.е. какой из элементов будет виден, если они наложатся друг на друга*/
    margin-top: 0; /*внешние отступы сверху*/
    margin-top: 1px; /*внешние отступы сверху*/
}
#nav .sub_active a {
    /*класс sub_active элемента с идентификатором nav (для нижнего уровня)*/
    height: 25px; /*высота*/
    float: left; /*выравниваем по левой стороне, остальные элементы обтекают справа*/
    text-decoration: none; /*подчеркивание отсутствует*/
    line-height: 24px; /* задаем высоту линии (интерлиньяж, межстрочный интервал) текста*/
    white-space: nowrap; /* указываем как отображать пробелы - автоматический перевод игнорируется, текст отображается одной строкой*/
    font-weight: normal; /* задает насыщенность шрифта, нормальное начертание шрифта (значение = 400)*/
}
#nav .sub_active a, #nav .select a:hover .sub li a, #nav .select li:hover .sub li a {
    /*класс sub_active элемента с идентификатором nav (для нижнего уровня), а так же ссылки при наведении курсора и элементы li в нижнем уровне*/
    display: inline; /*элемент ведет себя как строчный*/
    background: none; /*фоновое изображение отсутствует*/
    padding: 0 10px; /*внутренние отступы сверху-снизу, слева-справа*/
    margin: 0; /*внешние отступы сверху*/
    font-size: 13px; /* Размер шрифта нижнего уровня */
    width: auto; /* задаем ширину - на всю ширину (ширина зависит от содержимого элемента)*/
    white-space: nowrap; /* указываем как отображать пробелы - автоматический перевод игнорируется, текст отображается одной строкой*/
    font-weight: normal; /* задает насыщенность шрифта, нормальное начертание шрифта (значение = 400)*/
    border: 0; /*граница - отсутствует (толщина 0)*/
    color: #000; /* Цвет шрифта нижнего уровня */
    height: 35px; /*высота*/
    line-height: 35px; /* задаем высоту линии (интерлиньяж, межстрочный интервал) текста*/
}
#navi {
    text-align: center;
    width: 100%;
    overflow: hidden;
    height: 5.5em;
    margin-bottom: -1.2em
}
#navi ul {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative
}
#navi li {
    display: inline-block;
    margin: 0;
    position: relative;
    height: 40px;
}
#navi li a {
    padding: 10px;
    background-color: white;
    display: inline-block
}
#navi > ul > li {
}
#navi ul .sub {
    position: absolute;
    left: -1000px;
    right: -1000px;
    margin: auto;
    top: 100%;
    white-space: nowrap;
    display: none
}
#navi ul ul {
    background: #f0f0f0;
    border: 1px solid silver
}
#navi > ul.current .sub {
    display: block;
}
#navi:hover > ul.current .sub {
    display: none;
}
#navi:hover > ul.current li:hover .sub {
    display: block;
}
#navi li:hover .sub {
    display: block
}
#navi a {
    text-decoration: none
}
#navi a:hover {
    text-decoration: underline
}
#navi li.current_sub a {
    font-weight: bold
}
.jqplot-highlighter-tooltip, .jqplot-canvasOverlay-tooltip {
    background: rgba(248, 248, 248, 0.9) !important;
    color: #222 !important;
    padding: 4px !important;
}
.tariffication.form-wrapper select,
.tariffication.form-wrapper input {
    margin: 0;
    padding: 3px;
}
.userEditForm h4 {
    font-size: 13px;
    margin-bottom: 10px;
    display: block;
    text-align: left;
}
.inlineEditorForm textarea {
    width: 100%;
    min-height: 6em;
    box-sizing: border-box
}
.inlineEditorForm input {
    box-sizing: border-box;
    display: block;
    width: 100%
}
/*
Toplist user style
*/

table.toplist {
    border-spacing: 0px;
}
.toplist tr {
    border-bottom: 1px solid #cccccc;
    border-spacing: 0px;
}
.toplist td {
    border-bottom: 1px solid #cccccc;
    border-spacing: 0px;
}
.toplist a {
    text-decoration: none;
}
.landmania.questions {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.form-fields {
    padding: 15px;
    text-align: left;
    width: 70%;
    margin: 15px 25% 15px 15%;
}
.form-field {
    border-bottom: 1px dotted #d9d9d9;
    margin-bottom: 10px;
    padding: 5px 5px 10px 5px;
}
.form-field input, .form-field select {
    float: right;
    padding: 5px;
    min-width: 50%;
}
.form-field input.large, .form-field select.large {
    float: right;
    padding: 5px;
    min-width: 75%;
}
.submit-class {
    padding: 10px 20px;
    float: right;
    margin-top: 30px;
    background: #7daf8d;
    cursor: pointer;
}
.submit-class:hover {
    padding: 10px 20px;
    float: right;
    margin-top: 30px;
    background: rgba(93, 214, 43, 0.54);;
    cursor: pointer;
    color: #1D3371;
}
.bg-grey {
    background: rgb(226, 226, 226);
}
.error-msg {
    color: #cc0000;
}
.row {
    text-align: left;
    width: auto;
    display: block;
}
.row-center {
    width: 70%;
    margin: 20px 15%;
}
.blockquote {
    padding: 5px 10px;
    font-size: 0.8em;
    font-style: italic;
    border-left: 5px solid #eee;
}
.date {
    padding: 5px;
    font-family: arial;
}
#myTable {
    width: 100%;
    border: 1px solid #B1B1B1;
    border-collapse: collapse;
    font-size: 11px
}
#myTable td {
    padding: 3px;
    border: 1px solid #B1B1B1;
    text-align: left;
}
#myTable th {
    border: 1px solid #B1B1B1;
    font-weight: 700
}
#myForm {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px
}
#myForm td {
    padding: 0.8em;
    border-bottom: 1px dotted #d9d9d9;
}
#myForm td:first-child {
    width: 20%;
}
#myForm td label {
    font-size: 1.5em;
}
#myForm td input, select {
    /*width: 100%;*/
    padding: 3px;
}
#myForm th {
    font-weight: 700
}
.as_button {
    display: inline-block;
    width: 215px;
    height: 25px;
    background: #7daf8d;
    padding: 5px;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
    margin-bottom: 10px;
}
.as_button:hover {
    background: rgb(150, 207, 165);
}
.left {
    text-align: left
}
.ad_list {
    margin: 0px;
}
.ad_list li {
    cursor: pointer;
    float: left;
    margin-right: 5px;
    padding: 3px;
    list-style-type: none;
}
.ad_list input, .ad_list label {
    cursor: pointer
}
.grn, .ad_list li:hover {
    background-color: rgba(142, 189, 160, .39)
}
.list_label {
    margin: 10px 0 0 40px;
    cursor: pointer;
    display: inline-block;
}
.list_label:hover {
    background-color: rgba(142, 189, 160, .39);
}
.darkred {
    color: #8b0000
}
.darkred-bg {
    background-color: rgba(255, 0, 0, .21)
}
.comment_title {
    border-bottom: 1px #333 dotted
}
.orange {
    color: rgb(245, 121, 0);
}
.red {
    color: red;
}
.green {
    color: green;
}
.left {
    float: left;
}
.right {
    float: right;
}
.grey {
    color: grey;
}
.info {
    color: dodgerblue;
}
.info-grey {
    color: grey;
    font-size: 0.8em;
}
.little-grey {
    color: grey;
    font-size: 0.6em;
}
.td-report {
    vertical-align: top;
    width: 50%;
}
.tick {
    font-size: 0.8em;
}
#toggle_1, #toggle_2, #toggle_3, #toggle_4 {
    margin: 3px;
}
.font-large {
    font-size: 1.2em;
}
.td-el {
    display: block;
    padding: 5px 0;
}

#menu_block {
    text-align: center;
}
ul.menu {
    text-align: left;
    display: inline;
    margin: 1px;
    padding: 7px 4px 7px 0;
    list-style: none;
    -webkit-box-shadow: 4px 4px 4px -2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 4px 4px 4px -2px rgba(0, 0, 0, 0.15);
    box-shadow: 4px 4px 4px -2px rgba(0, 0, 0, 0.15);;
}
ul.menu li {
    font: bold 12px/18px sans-serif;
    display: inline-block;
    margin-right: -4px;
    position: relative;
    /*padding: 15px 20px 15px 5px;*/
    background: #fff;
    cursor: pointer;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}
#menu_block > ul.select.menu.current > li > a {
    background: #EFEEEE;
}
ul.menu li:hover {
    background: #EFEEEE;
}
ul.menu li > a {
    padding: 7px 10px;
    display: block;
    text-decoration: none;
}
ul.menu li ul {
    padding: 0;
    position: absolute;
    top: 28px;
    left: 0;
    width: 300px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    display: none;
    opacity: 0;
    visibility: hidden;
    -webkit-transiton: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    -ms-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    -transition: opacity 0.2s;
}
ul.menu li ul li {
    display: block;
    border: 1px solid #EFEEEE;
    z-index: 100;
}
ul.menu li ul li:hover {
    background: #EFEEEE;
}
ul.menu li:hover ul {
    display: block;
    opacity: 1;
    visibility: visible;
}
.form {
    margin-left: 10%;
}

#ad_stats_table {
    width: 100%;
    border: 1px solid #3e3e3e;
    border-collapse: collapse;
    font-size: 11px
}
#ad_stats_table td {
    padding: 3px;
    border: 1px solid #3e3e3e
}
#ad_stats_table th {
    border: 1px solid #3e3e3e;
    font-weight: 700
}
td.link-edit {
    padding: 0px;
}
.link-edit a {
    padding: 3px;
    height: 100%;
    display: block;
}
.link-edit a:hover {
    background-color: #7daf8d;
    color: #fff;
}
td.link-delete {
    padding: 0px;
}
.link-delete a {
    padding: 3px;
    height: 100%;
    display: block;
}
.link-delete a:hover {
    background-color: darkred;
    color: #fff;
}
.yiiLog {
    text-align: left;
}


/* subs_cost */

.countries {
    width: 5%;
    float: left;
}
.operators {
    width:  15%;
    float: left;
    text-align: left;
}
.list li {
    list-style-type: none;
    text-align: left;
    cursor: pointer;
    display: none;
}
.list li:hover {
    /*background-color: rgba(93, 214, 43, 0.2);*/
    background-color: #EFEEEE;
}
.bggreen {
    background-color: rgba(93, 214, 43, 0.35);
}
.label_title {
    border-bottom: 2px dotted white;
    cursor: pointer;
}
.label_title:hover {
    border-bottom: 1px dotted grey;
}

.dividers-menu div {
    float: left;
    margin-top: 10px;
}
.dividers-menu ul.list > li > label {
    cursor: pointer;
}
.submit-btn {
    padding: 5px 10px;
    float: right;
    cursor: pointer;
    width: 150%;
}
.submit-btn:hover {
    padding: 5px 10px;
    float: right;
    cursor: pointer;
    width: 150%;
}
/* #subs_cost */

.code {
    border-left: 3px solid rgba(128, 128, 128, 0.39);;
    text-align: left;
    padding-left: 10px;
    margin-bottom: 20px;
    font-size: 0.75em;
    color: grey;
    font-family: Consolas;
}
.note {
    text-align: left;
    color: grey;
    font-size: 0.9em;
}


.service-alarm_table {
    border-spacing: 10px;
    margin: 1em auto;
}

.service-alarm_table td {
    border: 1px solid silver;
    padding: 2px 5px;
}

.service-alarm_table td a {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    text-align: center;
    white-space: nowrap;
    vertical-align: middle;

    -webkit-box-shadow: none;
    box-shadow: none;
    display: inline-block;
    padding: 1px 5px;
    line-height: 1.5;
    margin-bottom: 0;
}


.icon-logout {
    /*background-image: url("/i/logout.svg");*/
    background-image: url("/i/exit.svg");
    width: 0.75em;
    height: 0.75em;
    background-repeat: no-repeat;
    display: inline-block;
    margin-top: 0.2em;
    float: right;
}
.small {
    font-size: .8em;
}

.photo-rules {
    font-size: 12px;
    margin: 0 auto 10px;
    text-align: left;
    max-width: 800px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.photo-rules__list {
    visibility: hidden;
    display: none;
    margin: 0;
    opacity: 0;
    transition: visibility 0.5s, opacity .5s ease-in-out;
}

.photo-rules__list li {
    line-height: 1;
    margin-bottom: 5px;
}

.photo-rules__list--active {
    visibility: visible;
    display: block;
    opacity: 1;
    transition: opacity .5s ease-in-out;
}

.photo-rules__spoiler {
    display: none;
    margin-bottom: 20px;
}

.photo-rules__spoiler--active {
    display: block;
}

.photo-rules__title {
    font-size: 1.1em;
    font-weight: 700;
    text-align: left;
    user-select: none;
}

.photo-rules__title--big {
    font-size: 1.4em;
    text-align: center;
    margin: 0 auto 15px;
    text-decoration: underline;
    cursor: pointer;
}

.photo-rules__title--clickable {
    position: relative;
    cursor: pointer;
}

/*.photo-rules__title--clickable::after {*/
    /*cursor: pointer;*/
    /*content: "";*/
    /*position: absolute;*/
    /*width: 24px;*/
    /*height: 24px;*/
    /*background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT4yOUM1MUVDNS01MjYwLTRCNEItQjU4OC1EQkQ1NDRBRjAwM0I8L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggc2tldGNodG9vbC48L2Rlc2M+ICAgIDxnIGlkPSJTeW1ib2xzIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJpY29uL2V4cGFuZCI+ICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZS00IiB4PSIwIiB5PSIwIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiPjwvcmVjdD4gICAgICAgICAgICA8cG9seWdvbiBpZD0iUGF0aC03IiBmaWxsLW9wYWNpdHk9IjAuNDAyNDI4NjY4IiBmaWxsPSIjMDAwMDAwIiBwb2ludHM9IjEyIDEzLjU4NTc4NjQgMTguMjkyODkzMiA3LjI5Mjg5MzIyIDE5LjcwNzEwNjggOC43MDcxMDY3OCAxMiAxNi40MTQyMTM2IDQuMjkyODkzMjIgOC43MDcxMDY3OCA1LjcwNzEwNjc4IDcuMjkyODkzMjIiPjwvcG9seWdvbj4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==);*/
    /*background-position: 50%;*/
    /*background-size: initial;*/
    /*background-repeat: no-repeat;*/
    /*right: -35px;*/
    /*top: 50%;*/
    /*-webkit-transform: translateY(-50%);*/
    /*transform: translateY(-50%);*/
    /*transition: all .5s ease;*/
/*}*/

/*.photo-rules__title--clickable::before {*/
    /*cursor: pointer;*/
    /*position: absolute;*/
    /*right: -110px;*/
    /*top: 55%;*/
    /*-webkit-transform: translateY(-50%);*/
    /*transform: translateY(-50%);*/
    /*content: "Показать все";*/
    /*font-size: 12px;*/
    /*font-weight: 400;*/
/*}*/

.photo-rules__title--active::after {
    transform: translateY(-50%) rotate(180deg);
    transition: all .5s ease;
}

.photo-rules__spoiler-placeholder {
    display: block;
    text-decoration: underline;
    cursor: pointer;
    max-width: 240px;
    font-weight: 700;
    font-size: 1.1em;
}

.photo-rules__spoiler-placeholder--hidden {
    display: none;
}


.grid-view table {

}

.grid-view table.items th, .grid-view table.items td {
    font-size: 0.95em !important;
}

.bold_style {
    font-weight: bold;
}

.action-btn {
    margin-right: 10px;
    padding:3px;
    color: honeydew;
}

.action-btn.larger {
    padding:4%;
}

.action-btn.green {
    background: #044c00;
}

.action-btn.red {
    background: rgba(177, 55, 56, 0.79);
}

.action-btn.grey {
    background: grey;
}

#adjustmentsTable {
    width: 100%;
    border: 1px solid #B1B1B1;
    border-collapse: collapse;
    font-size: 11px
}
#adjustmentsTable td {
    padding: 3px;
    border: 1px solid #B1B1B1;
    text-align: left;
}
#adjustmentsTable th {
    border: 1px solid #B1B1B1;
    font-weight: 700
}

.input-container {
    position: relative;
}

.icon-container {
    position: absolute;
    right: 10px;
    top: calc(50% - 10px);
}
.loader {
    position: relative;
    height: 20px;
    width: 20px;
    display: inline-block;
    animation: around 5.4s infinite;
}

@keyframes around {
    0% {
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

.loader::after, .loader::before {
    content: "";
    background: white;
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    border-width: 2px;
    border-color: #333 #333 transparent transparent;
    border-style: solid;
    border-radius: 20px;
    box-sizing: border-box;
    top: 0;
    left: 0;
    animation: around 0.7s ease-in-out infinite;
}

.loader::after {
    animation: around 0.7s ease-in-out 0.1s infinite;
    background: transparent;
}

#tarifficationSummary {
    width: 100% !important;
    border: 0;
    border-top: 1px #0c0a08 solid;
    border-collapse: collapse;
    font-size: 15px;
    margin-bottom: 20px;

}


#tarifficationSummary td {
    padding: 10px;
    border: 0;
    text-align: left;
}
#tarifficationSummary th {
    border: 0;
    font-weight: 700
}
table.subs td {
    border-bottom: 1px solid black;
}

.w3-border {
    margin-top: 20px;
    border: 1px solid #EFEEEE !important;
}

.w3-light-grey, .w3-hover-light-grey:hover, .w3-light-gray, .w3-hover-light-gray:hover {
    color: #000 !important;
    background-color: #f1f1f1 !important;
}

.w3-border-bottom {
    border-bottom: 1px solid #EFEEEE !important;
}


a.w3-bar-item:hover {
    background-color: #5e5e5e !important;
    cursor: pointer;
    color: #fff;
}

.w3-bar {
    width: 100%;
    overflow: hidden;
}

*, *:before, *:after {
    box-sizing: inherit;
}

.w3-bar .w3-button {
    white-space: normal;
}

.w3-bar .w3-bar-item {
    padding: 8px 16px;
    float: left;
    width: auto;
    border: 1px #f1f1f1 solid;
    display: block;
    outline: 0;
}

.w3-dark-grey {
    color: #fff !important;
    background-color: #5e5e5e !important;
}

.w3-dark-grey:hover {
    opacity: 0.7;
    border: 1px #fff solid;
}

h1 {
    margin-bottom: 1.25em;
}

.grid-view table.items th {
    background: #5e5e5e !important;
}


ul.yiiPager .page a {
    border: solid 1px #5e5e5e !important;
    color: #5e5e5e !important;
    padding: 10px !important;
}

ul.yiiPager .page a:hover {
    color: #fff !important;
    background: #5e5e5e !important;
}

ul.yiiPager .next a {
    border: solid 1px #5e5e5e !important;
    color: #5e5e5e !important;
    padding: 10px !important;
}

ul.yiiPager .next a:hover {
    color: #fff !important;
    background: #5e5e5e !important;
}

ul.yiiPager .previous a {
    border: solid 1px #5e5e5e !important;
    color: #5e5e5e !important;
    padding: 10px !important;
}

ul.yiiPager .previous a:hover {
    color: #fff !important;
    background: #5e5e5e !important;
}

ul.yiiPager .selected a {
    color: #fff !important;
    background: #5e5e5e !important;
}

.grid-view table.items th, .grid-view table.items td {
    font-size: 0.9em !important;
    border: 1px white solid !important;
    padding: 0.3em !important;
}

#SimplifiedAjax_loaderCover {
    position: fixed;
    z-index: 999999;
    background: rgba(120, 120, 120, 0.3);
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0
}

#SimplifiedAjax_loaderCover img {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 50%;
    margin-top: -220px;
    display: inline-block
}