html, body {margin:0; padding:0; border:0; height:100%;}
body {position:relative; color:#333333; font-size:14px; background-color:#fff; width:100%;font-family:Tahoma, Arial, Helvetica, sans-serif;}
body:after {background: url(https://surokgeo.polymetal.ru/images/surokgeo_bg.jpg) fixed no-repeat center top; content: ""; opacity: 0.1; position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: -1;}
/* Основные тэги по-умолчаию */
div, img, h1, h2, h3, h4, h5, h6, p, form {margin:0; padding:0; border:0;}
dl {padding:0; margin:0;}
dt {padding-top:7px;font-weight:bold;font-size:14px; color:#555; text-shadow: 2px 2px 3px rgba(153,153,153,.3);}
p, dd {text-align:justify;}
table {border-collapse: collapse; table-layout: fixed;}
ul {margin:0; padding:0 0 0 35px;}
a {color:#933;}
a:hover {color:#f00;}
a.revers {color:#333333;}
a.revers:hover {color:#f00;}
a.nolink, a.nolink * {color:#333333; text-decoration:none;}

#main {position:relative; overflow:auto; min-width:1900px; min-height:100%; height:auto; margin: 0; padding-bottom:40px; box-sizing:border-box;}
/* Шапка */
#head {height:80px; margin:0 15px 15px; padding:10px 0; border-width:0; box-shadow: 0 5px 5px rgba(153,153,153,0.7); }
a.tLogo {display:block; width:137px; height:80px; float:left; padding:0; background: url(https://surokgeo.polymetal.ru/images/surokgeo.jpg) no-repeat center top;}
/* Авторизация, кабинет*/
div.tAuth {padding:20px; position:relative; text-align:center;}
   #LoginForm {position:relative; display:inline-block;overflow:auto; margin:0 auto;}
   #LoginForm input[type="text"], #LoginForm input[type="password"], #LoginForm button {width:250px; font-size:140%; font-family:Tahoma, Arial, Helvetica, sans-serif; border:2px solid #a0a0a0; color:#575756; outline:none; box-sizing:border-box; -moz-box-sizing:border-box;}

/* Отсечка и подвал */
#footer {clear:both; padding:10px 0; bottom:0; width:100%; position:absolute;}
  #addr {text-align:center;}
  #addr * {font-size:80%; font-style:italic; color:#333; text-decoration:none; text-align:center;}

/* Заголовки страницы */
.title {color:#f66; padding:7px 20px; border-bottom:2px dotted #999; text-shadow: 1px 1px 4px rgba(200,200,0,0.5), 3px 3px 3px rgba(0,0,0,.3);}
   .title a {color:#f66; text-decoration:none;}
h1 {font-size:24px;}
h2 {font-size:18px;}

/* Центральная колонка */
#content {padding:7px 10px; position:relative; overflow:auto; }
   .sideOffset {margin-left:250px;}
  #content p {padding:3px 0; text-indent:25px;}
  #content ul.body li {color:#f90; text-align: justify; padding:3px 0; list-style-position: inside;}
  #content ul.body li span {color:#333;}
div.defc {padding:7px 0;}
   .defc ul {text-align: justify; padding:3px 0;}
   pre {padding:3px 20px; font-family:monospace; max-height:300px; overflow-y:auto; background-color:#f0f0f0; border:1px solid #a0a0a0;}
   div.pCode {padding:3px 0 7px 40px; font-family:monospace; font-size:110%;}
   div.epigraf {padding:3px 0 7px 40%; font-style:italic; font-size:12px; text-align:right; }
   .defc table.colOE tr:nth-child(even) {background-color:#fafafa;}
   .defc th {text-align:center;background-color:#efefef;}

/* Общие элементы */
div.boxError {margin:7px 10px; padding:10px; background-color:#fff0f0; border-radius:3px; border:1px dotted #daa;}
   div.boxError h2.subt {color:#f00;margin-top:0;}
div.boxInfo {margin:7px 10px; padding:10px; background-color:#f0fff0; border-radius:3px; border:1px dotted #ada;}
   div.boxInfo h2.subt {margin-top:0;}
.subt {padding:0; font-size:120%;}
.subt, .subt a {text-decoration: none; color:#e80;text-shadow: 2px 2px 2px rgba(153,153,153,.3);}
h2.subt {margin:14px 25px 3px; clear:both;}
h3.subt {margin:0 25px 5px;}
h4.subt {font-size:14px;margin:0 25px;}
div.cblock {padding:7px 10px; border-bottom:1px dotted #999; overflow:auto;}
p.annonce {margin:10px; text-indent:25px;}
p.annonce a.head {font-size:14px; color:#333;} p.annonce a.head:hover {font-size:14px; color:#FF0000;}
div.scroll-x {position:relative; width:100%; overflow-x:auto;}

/* Меню навигации*/
#menu {margin-left:150px;}
   #menu a {text-decoration:none; text-align:center; color:#333333; background-color:#f0f0f0; border:1px solid #a0a0a0; font-size:140%; text-shadow: 2px 2px 3px rgba(0,0,0,.1);  font-weight:bold; display:inline-block; padding:7px 10px; margin-left:10px; height: 40px; min-width:150px; box-sizing:border-box; overflow:hidden;}
   #menu a:hover,  #menu a.select {color:#f00; background-color:#DDDDFF;}
/* Боковое меню */
#sidemenu {float:left;width:240px;padding:20px 10px;}
#sidemenu * {margin:0; padding:0;}
#sidemenu>ul>li{padding:1px 0; margin-bottom: 4px; border-bottom:1px dotted #999;}
#sidemenu ul ul {margin-left:15px;}
#sidemenu li {list-style:none;}
#sidemenu a {display:block; padding:8px 4px; font-weight:normal; font-size:120%; color:#333333; text-decoration:none; text-shadow: 1px 1px 2px rgba(0,0,0,0.3);}
#sidemenu a:hover, #sidemenu a.select {color:#f00; background-color:#DDDDFF; }
/* Элементы заполнения форм */
.f100p textarea, .f100p input, .f100p select {width:100%; max-width:500px;}
.wAuto textarea, .wAuto input, .wAuto select {width:auto;}
table.form-box, table.DocTree, table.wBalance {font-size:14px; border:1px solid #cccccc; margin:10px; font-family:Tahoma, Arial, Helvetica, sans-serif;}
table.tSmall, table.tSmall td, table.tSmall th {font-size:80%;}
table.DocTree, table.wBalance {margin:0; width:100%; text-align:left; }
   .form-box td, .form-box th, .DocTree td, .wBalance td {border:1px solid #cccccc; padding:4px 6px;}
   .form-box tr, .DocTree tr {vertical-align:top;}
   .form-head {text-align:center; font-size:100%; font-weight:bold; padding:5px; background-color:#efefef ;}
   td.form-foot {text-align:center;}
table.brd0, .brd0 td {border:0;}
   .form-inf {text-align:right;}
   .form-cnt {text-align:right; color:red;}
   input.form-button {font-size:14px; text-align:center; background-color:transparent; border-width:3px; border-style:solid; border-color:#C0C0C0 #606060 #606060 #C0C0C0;}
   .must {color:#ff0000;}
input[type="text"], input[type="email"], input[type="password"], select, textarea {font-size:14px; font-family:Tahoma, Arial, Helvetica, sans-serif; border:1px solid #a0a0a0; color:#575756; outline:none; box-sizing:border-box; -moz-box-sizing:border-box;}
input.DateCal {text-align:center; width:75px !important;}
.liner td, td.liner {font-size:1px; background-color:#9f9;}
button {background-color:#aaffaa; border:1px solid #808080;}
   button.drop {background-color:#faa;}
.ButtonImg {cursor:pointer; display:inline-block; padding:0 !important; margin:0 5px; width:22px; height:22px; background: transparent url(https://surokgeo.polymetal.ru/images/icons_surok.png) left top no-repeat; -webkit-background-size:cover; background-size:cover;}
.TreeImg {float:left; cursor:pointer; display:inline-block; padding:0; margin:0; width:24px; height:12px; background: transparent url(https://surokgeo.polymetal.ru/images/icons_surok_tree.png) left top no-repeat; -webkit-background-size:cover; background-size:cover;}
.TreeImg.fldClose {background-position:-24px top;}
.TreeImg.fldOpen {background-position:-48px top;}
.TreeImg.fldDoc {background-position:-96px top;}

/* Фильтры */
fieldset {border:1px solid #a0a0a0; margin:0 10px 10px; padding:7px; position:relative;}
   legend {font-size:80%; color:#933; cursor:pointer;}
   fieldset>div {position:relative; padding:3px 0; margin:3px 0; }
   fieldset div div {display:inline-block; margin-right:20px; vertical-align:top;}
   fieldset div div.fInfo {width:150px;}
   fieldset div div:last-child {margin:0;}
   fieldset fieldset {margin:0;}
   fieldset div code {display:block; width:100%;  padding:3px 15px; margin-bottom:15px; font-family:Tahoma, Arial, Helvetica, sans-serif; box-sizing:border-box;}


#stdHight>div {margin:7px 0; border-bottom:1px dotted #999;}
#stdHight code {max-height:100px; overflow:auto; background-color:#f0f0f0;}

/* Навигация постраничного вывода */
div.multip {padding:5px;overflow:auto;}
   .mp_head {float:left; margin:2px; padding:3px;}
   .multip * {font-size:80%;}
   .multip a {display:block; float:left; margin:1px; padding:2px;}
   .multip a.mp_sel {font-weight:bold; color:#333;}

/* Фотогалерея в документе */
#GalLst {display:flex; flex-flow: row wrap; justify-content: space-between;}
   #GalLst div {width:20%;}

/* Тул-типы */
a.tooltipInfo {cursor:pointer; display:inline-block; float:right; width:14px; height:14px; background: transparent url(https://surokgeo.polymetal.ru/images/icons_surok.png) left top no-repeat; background-position:-252px top; -webkit-background-size:cover; background-size:cover;}
div.ovTip {display:inline-block; float:right; margin-left:5px; width:14px; height:14px; overflow:auto;}
div.sTTip {display:none; position:absolute; z-index:200; left:0; top:0; background-color:#f0f0f0; padding:5px; border:1px solid #cccccc; border-radius:5px; max-width:300px;}
   div.sTTip p {font-size:14px;}
   div.sTTip div.arrow {width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;}
   div.sTTip div.arrow span {display:block; width:0; height:0; position:absolute; top:13px;}
   div.sTTip div.arrow span:first-child {border-top:8px solid transparent !important; border-bottom:8px solid transparent !important; border-right:11px solid #cccccc; margin-top:-8px; left:-11px;}
   div.sTTip div.arrow span:last-child {border-top:7px solid transparent !important; border-bottom:7px solid transparent !important; border-right:10px solid #ffffff; margin-top:-7px; left:-10px;}


/* Расположение картинок в тексте */
div.imL {float:left; text-align:left; padding:0 10px 5px 0;}
div.imR {float:right; text-align:right; padding:0 0 5px 10px;}
div.imC {clear:both; text-align:center; padding:0 0 5px;}

/* Позиционирование */
.floL {float:left;}
.floR {float:right;}
.clean {clear:both;}

/* Отступы */
.wib60 {display:inline-block; width:60px;}
.wib70 {display:inline-block; width:70px;}
.wib200 {display:inline-block; width:200px;}
.w100p {width:100%;}
.w80 {width:80px;}
.w100 {width:100px;}
.w150 {width:150px;}
.w200 {width:200px;}
.w240 {width:240px;}
.w300 {width:300px;}
.w450 {width:450px;}
.w500s {width:500px; overflow-x:auto;}
.w640y {width:640px; background-color:#FFFF99;}
.wH3butt {width:72px;}

div.h30 {height:30px; clear:both;}
div.h50 {height:50px; clear:both;}

.pad0 {padding:0;}
.pad10 {padding:10px;}
.ptb3 {padding:3px 0;}
.ptb7 {padding:7px 0;}
.pl15 {padding-left:15px;}
.pl30 {padding-left:30px;}
.pl45 {padding-left:45px;}
.m0 {margin:0 !important;}
.mr7 {margin-right:7px;}
.mlr10 {margin-right:10px;margin-left:10px;}
.marg0 {margin:0 !important;}
p.ind25 {text-indent:25px;}
div.qrImage {padding:10px; text-align:center;}
   div.qrImage img {max-height:250px;}
/* Фон, цвет, размер, оформление и выравнивание элементов */
.bgl {background-color:#f0f0f0;}
.bgd {background-color:#b7b7b7;}
.lock, .sun {background-color:#f99;}
.new, .sat, .presun {background-color:#ff9;}
.good {background-color:#9f9;}
.cyan {background-color:#9ff;}

.red {color:red;}
.csel {color:#e80;}
.white {color:#ffffff;}

.tiny {font-size:80%;}
.small {font-size:80%;}
.normal {font-size:14px;}
.large {font-size:120%;}
.bold, .bold * {font-weight:bold;}
.nobold {font-weight:normal;}
.left {text-align:left;}
.right {text-align:right;}
.center {text-align:center;}
.xross {text-decoration:line-through;}
.nobr {white-space:nowrap;}
.std {font-size:14px !important; font-weight:normal !important;}
.hidden {display:none;}

/* Всплывающее окно, Галерея картинок */
#GaleryLoad {position: fixed; display:none; height:13px; width:208px; z-index:103; top: 50%; left: 50%; margin: -6px 0 0 -104px;}
#OverLay, #GalOver {position:fixed; z-index:200; top:0; left:0; height:100%; width:100%; background-color:#000; opacity: 0.7;}
/*   #OverLayWin, #GalWin {box-sizing:border-box; display:none; position:fixed; background-color:#fff; z-index:202; border:7px solid #cccccc; border-radius:1px; top:50%; left:50%; width:800px; margin: -20% 0 0 -400px; padding:7px; }*/
   #OverLayWin, #GalWin {box-sizing:border-box; display:none; position:fixed; left: 0; right: 0; bottom: 0; top: 0; background-color:#ffffff; border:7px solid #cccccc; border-radius:1px; z-index:202; max-height: 60vh; width:50%; max-width: 80vw; padding:0; margin:auto;}
   #OverLayText {overflow-y:auto; box-sizing:border-box; max-height:100%;}
   #OverLayWin>div {clear:both; padding:20px; font-size:120%;}
   #OverLayWin h2 {padding-bottom:7px;}
   #OverLayWin p {text-indent:25px; padding:5px 0; text-align:justify;}
   #OverLayWin li {padding:5px 0; text-align:justify;}
   #OverLayWin p.OvlErr {color:red;text-align:center;text-indent:0;font-size:140%;}
#OverLayClose, #GaleryClose {display:block; position:absolute; width:20px; height:19px; line-height:19px; text-align:center; font-size:14px; font-weight:bold; top:-16px; right:-16px; background-color:#f0f0f0; border:1px solid #cccccc; border-radius:1px; cursor:pointer;}
#jOverBox {display:none; position:fixed; height:100%; width:100%; left:0; top:0; z-index:1000;}
   #jOverBoxBg {position:fixed; height:100%; width:100%; left:0; top:0; z-index:1000; background-color:#000;opacity:0.7;}
   #jLoader {background-color:#ffffff; padding:25px 75px; position:fixed; left:50%; margin-left:-111px; top:30%; z-index:2000; border:3px solid transparent; border-radius:1px; text-align:center; }
#tOvl2Form {overflow-x:hidden; position:relative;}
#tOvlForm {max-height:600px; overflow-y:auto; overflow-x:hidden; position:relative;}
   #tOvlForm table.form-box, #tOvl2Form table.form-box {margin:0 auto;}
/*   #tOvlForm td:first-child {width:25%;}*/
   #tOvlForm div input[type="text"], #tOvlForm div textarea {width:100%;}
   #tOvlForm div input.wTiny {width:50px;}
   #tOvlForm label {display:block; padding:3px 0;}
img.GalImage {cursor: pointer;}
#GalWin {padding:7px 27px;}
   #ImageFull {display:block; padding:7px; border:none;}
   #GalFoot {text-align:center; padding:7px 40px; font-size:14px; border:none;}
   #GalNext, #GalPrev {box-sizing:border-box; font-size:1px; text-align:center; cursor: pointer; display:block; background-color:transparent; position:absolute; top:45%; width:20px; height:40px; overflow:hidden;}
   #GalNext {right:3px; border-left:20px solid #b7b7b7; border-top:20px solid transparent; border-right:0 solid transparent; border-bottom:20px solid transparent;}
   #GalPrev {left:3px; border-left:0 solid transparent; border-top:20px solid transparent; border-right:20px solid #b7b7b7; border-bottom:20px solid transparent;}

/* Календарь */
#BH_calendar td {font-size:13px; padding:3px; width:18px; text-align:right;}
#BH_calendar caption {font-size:120%; padding:7px; font-weight:bold;}

/* СУРОК-Гео */
div.Legend {float:right;}
   div.Legend a {display:inline-block; padding:2px 8px; margin:0 5px; text-decoration:none; font-size:14px; color:#333333; border:1px dotted #b7b7b7;}
#AxisSectList, #AxisSectInfo {float:left; height:720px; overflow-y:scroll; box-sizing:border-box;}
#AxisSectList {width:200px; margin:0 20px 0 10px; overflow-y:scroll;}
   #AxisSectList a {display:block; padding:8px 20px; margin:1px 0; text-decoration:none; font-size:120%; color:#333333; border:1px dotted #b7b7b7; border-width:1px 0;}
   #AxisSectList a.nodeLevel2 {padding:4px 20px; margin-left:15px; font-size:14px;}
   #AxisSectList a:hover {background-color:#f0f0f0;}
   .axStateN {background-color:#FFFF99;}
   .axStateP {background-color:#ccffcc;}
   .axStateA {background-color:#aaeeff;}
   .axStateX {background-color:#b7b7b7;}
   .axnStateNew {background-color:#FFFF99;}
   .axnStatePick, .axnStateDry, .axnStateCrop, .axnStateRFA {background-color:#aaeeff;}
   .axnStateRnd {background-color:#aaeeff;}
   .axnStateClose {background-color:#b7b7b7;}
   .axnStateSkip, .axnStateFault {background-color:#ffcccc;}
   a.axSelect, #AxisSectList a.axSelect:hover {background-color:#DDDDFF;}
#AxisSectInfo, #NodesInfo {width:1640px; padding-left:20px;}
#AxisSectInfo div.lineInfo {font-size:120%;}
   div.lineInfo div {display:inline-block; margin-right:20px; vertical-align:top;}
   div.lineInfo span {font-size:14px;}
   #AxisSectInfo h2 {margin-top:20px; font-size:140%;}
   #AxisSectInfo table {font-size:120%;}
   #AxisSectInfo table.normal {font-size:14px;}
   #AxisSectInfo table.numR td:first-child {text-align:right;}
#MapSUROK {margin-top:14px;height: 700px;}
#NodesInfo table td {padding:10px 5px; font-size:120%; font-weight:bold; vertical-align:top;}
   #NodesInfo table tr td:first-child {width:250px; font-size:14px; font-weight:normal; atext-align:left;}
   #NodesInfo table td.std {font-size:14px; font-weight:normal;}
.axFList {text-align:center;}
   .axFList a {display:block; margin: 5px 0; text-align:center;}
#UserAxSect {display:block; padding-left:110px;}
div.ReadyState {position: relative;}
   div.ReadyState div {display:inline-block; box-sizing:border-box; padding:7px 0; text-align: center; font-weight:bold; overflow: hidden; border: 1px solid #999;}
div.ReadyStateUser {position: relative;}
   div.ReadyStateUser div {display:inline-block; box-sizing:border-box; padding:7px 0; text-align: center; font-weight:bold; overflow: hidden;}
   .ReadyStateUserData {position: relative;}
.JobInfo span {display:inline-block; width:100px;}
#whoami {position: absolute; left:0; top:60px; font-size:90%; text-align:right; color:#f66;text-shadow: 1px 1px 2px rgba(200,200,0,0.5), 1px 1px 1px rgba(0,0,0,.3);}
.nodeImage {max-width:300px;}
.nodeImage.swWidth {max-width:800px;}

/* Browser size */
@media (max-width: 1680px) {
   #main {min-width:1660px;}
   #AxisSectInfo, #NodesInfo {width:1400px;}
   #AxisSectList, #AxisSectInfo {height:680px;}
   #MapSUROK {height: 660px;}
}
@media (max-width: 1440px) {
   #main {min-width:1420px;}
   #AxisSectInfo, #NodesInfo {width:1160px;}
   #AxisSectList, #AxisSectInfo {height:520px;}
   #MapSUROK {height: 500px;}
}