/* Меню на самый передний план */
.sm {
    z-index: 1000;
    text-align: center;
}

/* Прибитая панелька админа и редактора */
#editpanel {
    position: fixed;
    left: 0;
    bottom: 120px;
    z-index: 100;
}
#editpanel div {
    display: table;
    padding: 5px 7px 5px 5px;
    margin-bottom: 5px;
    background: #ffc;
    border: 1px solid #333;
    border-radius: 0 5px 5px 0;
    border-left-style: none;
}
#editpanel a {
    font-size: 24px;
}
#editpanel a.disabled {
    color: grey;
    pointer-events: none;
    cursor: default;
}

/* Прибитая кнопка ВВЕРХ */
#upbutton {
    position: fixed;
    right: 20px;
    bottom: 20px;
    font-size: 40px;
    opacity: 50%;
    z-index: 100;
}

/* Коллекции ссылок */
.url_collection {
    max-width: 1200px;
    text-align: center;
    margin: auto;
}
.url_collection_item {
    display: inline-block;
    vertical-align: middle;
    padding-right: 20px;
}
.url_collection_image {
    display: inline-block;
    vertical-align: middle;
}
.url_collection_item:hover img {
    transform: scale(1.2);
    filter: invert(70%) sepia(100%) hue-rotate(330deg) saturate(50);
}
.url_collection_image img {
    display: inline-block;
    padding-right: 14px;
    min-width: 32px;
}
.url_collection_link {
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
}

/* системные сообщения */
#wrapper-messages #messages .info,
#wrapper-messages #messages .warning,
#wrapper-messages #messages .error,
#wrapper-messages #messages .system {
    font-size: 10px;
    color: #ffffff;
    margin: 1px;
    padding: 3px 5px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 5px;
}
#messages .info {
    background-color: #009933;
}
#messages .warning {
    background-color: #ff9900;
}
#messages .error {
    background-color: #ff3300;
}
#messages .system {
    background-color: #9933ff;
}

/* таблицы */
TABLE {
    width: 100%;
    /* border-collapse: collapse; */
    border-spacing: 1px;
}
TABLE caption {
    padding: 15px 0 5px;
    font-size: 18px;
    color: grey;
}
TABLE A {
    color: green;
}

TABLE A, TABLE A:hover {
    text-decoration: none;
}

TR.odd TD, TR.even TD {
    border: 1px solid #c3c3c3;
    padding: 4px;
    margin: 0;
}

TR.even {
    background: none repeat scroll 0 0 #ffffff;
}

TR.odd {
    background: none repeat scroll 0 0 #f3f3f3;
}

THEAD {
    background: linear-gradient(#6694ff, #0249a2);
    border-left: 1px solid #0249a2;
    border-right: 1px solid #0249a2;
}

TH {
    padding: 5px 2px;
    /* border-right: 1px solid white;
    border-left: 1px solid white; */
    text-align: center;
    color: white;
}

TH:first-child {
    border-left: none;
}

TH:last-child {
    border-right: none;
}

TH a {
    color: yellow;
}

TH a:hover, TH a:active {
    color: #c2ff6a !important;
}

TD.subcaption {
    padding: 4px;
    background-color: #dfd;
    border: 1px #c3c3c3 solid;
    font-weight: bolder;
    text-align: left;
    text-indent: 5%;
    color: #3c3c3c;
}

TD.summary {
    padding: 4px;
    background-color: lightyellow;
    border: 1px #c3c3c3 solid;
    font-weight: bolder;
    text-align: right;
    padding-right: 5%;
    color: #3c3c3c;
}

/* иконки разные, tooltips */
a.aweicon {
    font-size: 24px;
    padding: 4px 8px 8px 0;
    color: green;
    text-shadow: 1px 1px 2px lightgrey;
    display: inline-block;
}
a.aweicon:hover {
    color: #E0202E;
    text-shadow: 2px 2px 4px #a0a0a0;
}

TR a:hover {
    color: #E0202E;
}

/* второстепенное меню на строке с основными инструментами */
.second_menu {
    display: inline-block;
    position: relative;
    font-size: 16px;
    color: black;
    padding-bottom: 4px;
}
.second_menu a {
    color: black;
}
.second_menu a.current {
    color: red;
}
.second_menu a:hover, .second_menu a:active {
    color: red;
}

/* меню в виде строки */
.linemenu {
    padding: 4px 0;
    margin: 0;
}
.linemenu li {
    display: inline;
}
.linemenu li a {
    text-decoration: none;
    padding: 4px;
    color: black;
}
.linemenu li a:hover {
    color: #CC3333;
}

/* pager */
ul.pager {
    text-align: center;
    margin: 0;
    padding: 10px;
}
ul.pager li {
    display: inline;
    padding: 0;
    margin: 0 2px;
}
ul.pager li a {
    color: white;
    padding: 2px 6px;
    background-color: #05a742;
    border-radius: 4px;
}
ul.pager li a:hover {
    background-color: #CC3333;
}
ul.pager li.current, ul.pager li.disabled {
    padding: 2px 6px;
    background-color: #ccc;
    border-radius: 4px;
}
ul.pager li.current {
    font-weight: bold;
}

/* Мозаика */
div.tvframe {
    display: inline-block;
    background-repeat: no-repeat;

}
div.tvframe .tvframe_main {
    width: 172px;
    height: 96px;
    cursor: pointer;
    border-radius: 10px;
    border: solid 1px #a0a0a0;
    margin: 2px;
}
div.tvframe .tvframe_main:hover {
    border-color: red;
    border-width: 2px;
    border-style: solid;
    margin: 1px;
}
div.tvframe .tvframe_title {
    height: 10px;
    font-size: 10px;
    color: black;
    padding-bottom: 6px;
}
div.tvframe.active .tvframe_title {

}
div.tvframe.inactive .tvframe_title a {
    color: red;
}
div.tvframe.inactive {
    background-blend-mode: darken;
}
div.tvframe .tvframe_title a {
    color: black;
    text-decoration: none;
}
div.tvframe .tvframe_title a:hover {
    font-size: 11px;
    text-decoration: none;
}

/* Переключатель населенных пунктов */
#city-switch {
    text-align: right;
}
#city-switch ul li {
    display: inline;
}
#city-switch ul {
    margin: 0;
    padding: 0;
}
#city-switch ul li a {
    padding-right: 5px;
    color: gray;
}
#city-switch ul li a:hover {
    color: red;
}

/* Коллекция (панель) инструментов */
.tools_collection {
    white-space: nowrap;
}
.tools_collection_item {
    display: inline-block;
    padding: 0 3px;
}
.tools_collection_item:hover {
    transform: scale(1.2);
}

/* поля форм */
.field {
    padding: 10px 5px;
    box-sizing: border-box;
}

.field .fieldinput input {
    border: solid 1px #00B2FF;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 4px;
    min-width: 100px;
}

.field .fieldinput select, .field .fieldinput textarea {
    border: solid 1px #00B2FF;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 4px;
}

.field .fieldinput select {
    background-color: #fff3de;
}

.field label {
    background-color: #eee;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #0073aa;
    padding: 3px 8px 4px;
    border: solid 1px #00B2FF;
    border-bottom: none;
    position: relative;
    top: -3px;
    font-style: oblique;
    white-space: nowrap;
}

.field.checkbox label {
    border-radius: 3px;
    background-color: white;
}

.field button {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-start: 1px solid transparent;
    -moz-border-top-colors: none;
    -moz-margin-start: -1px;
    background: linear-gradient(hsla(0, 0%, 100%, 0.8), hsla(0, 0%, 100%, 0.1)) repeat scroll 0 0 padding-box rgba(0, 0, 0, 0);
    border-color: hsla(210, 54%, 20%, 0.15) hsla(210, 54%, 20%, 0.17) hsla(210, 54%, 20%, 0.2);
    border-image: none;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 0 2px hsla(0, 0%, 100%, 0.5) inset, 0 1px 0 hsla(0, 0%, 100%, 0.2);
    transition-duration: 150ms;
    transition-property: background-color, border-color, box-shadow;
    text-decoration: none;
    font-size: 14px;
    color: #00354D;
    padding: 4px 10px;
    margin-top: 16px;
}
.field button:hover {
    background-image: linear-gradient(#555, #777);
    box-shadow: 0 1px 0 hsla(0, 0%, 100%, 0.2) inset, 0 0 0 1px hsla(0, 0%, 100%, 0.1) inset, 0 1px 0 hsla(210, 54%, 20%, 0.03), 0 0 4px hsla(206, 100%, 20%, 0.2);
    color: white;
    text-decoration: none;
    border-radius: 4px;
}

.field.button, .field.submit, .fieldbutton {
    display: inline;
}

.field .fieldfile input {
    display: none;
}
div.left .field {
    float: left;
}
div.right .field {
    float: right;
}

div.field .fieldfile button {
    margin-top: 4px;
}
div.field.file label {
    border-bottom: solid 1px #00B2FF;
    border-radius: 3px;
}

/* Кнопки выбора города на карте */
a.leaflet-city, a.leaflet-city:visited, a.leaflet-city:active {
    font-size: 10px;
    text-decoration: none;
    color: green;
    font-weight: bold;
}
a.leaflet-button, a.leaflet-button:visited, a.leaflet-button:active {
    font-size: 20px;
    text-decoration: none;
    color: #555;
}

/* Вторичный заголовок для таблиц */
.second_title {
    text-align: center;
    background-color: #518DEE;
    padding: 3px;
    border: 1px solid gray;
    margin: 10px auto;
    border-radius: 5px;
    color: white;
}

/* вид оборудования в пути до ЦМ */
.path_comm {
    width: 400px;
    height: 20px;
    border: solid 1px grey;
    text-align: center;
}
.path_comm_inactive {
    background-color: #ffe0e0;
}
.path_port {
    display: inline-block;
    width: 199px;
    height: 37px;
    text-align: center;
    border: solid 1px grey;
    padding-top: 7px;
    border-top: 0;
    background-color: #ceffce;
}
.path_clear {
    clear: both;
    height: 10px;
}

/* разные твики */
ul.sm a.disabled {
    pointer-events: none;
}
hr {
    border: 0;
    border-top: 1px solid #bbb;
}

#panel_ports .tools_collection_item {
    display: block;
}
/* минимальная высота редактора CKeditor */
.ck-editor__editable_inline {
    min-height: 500px;
}

div.porttest div.object div.links,
div.porttest div.object div.info {
    height: 96px;
    display: inline-block;
}
div.porttest div.object {
    border-top: 1px dashed grey;
    height: 96px;
}
div.porttest div.object:last-child {
    border-bottom: 1px dashed grey;
}
div.porttest div.object div.links div.link {
    height: 48px;
    width: 48px;
}
div.porttest div.object div.links div.link.top_on {
    background-image: url(/images/port/link_top_on.png);
}
div.porttest div.object div.links div.link.top_off {
    background-image: url(/images/port/link_top_off.png);
}
div.porttest div.object div.links div.link.bottom_on {
    background-image: url(/images/port/link_bottom_on.png);
}
div.porttest div.object div.links div.link.bottom_off {
    background-image: url(/images/port/link_bottom_off.png);
}
div.porttest div.object div.info {
    vertical-align: top;
    padding-left: 20px;
}

.traf_wrapper {
}

.traf_column {
    display: table-cell;
    height: 270px;
    vertical-align: bottom;
    width: 40px;
    border-right: 1px lightgray solid;
    border-top: 1px dashed red;
}
.traf_column:last-child {
    border-right: none;
}
.traf_title {
    text-align: center;
}
.traf_column_in {
    display: inline-block;
    background-color: green;
    width: 20px;
}
.traf_column_in:hover {
    background-color: #009933;
    cursor: pointer;
}
.traf_column_out {
    display: inline-block;
    background-color: red;
    width: 10px;
}
.traf_column_out:hover {
    background-color: #E0202E;
    cursor: pointer;
}