div,span.body,input,li,ul,textarea,a,form {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}

html { height: 100%; min-height:100%;   font-family: sans-serif;background: #e9edf0;
}
body {min-height:100%;
    margin: 0;
    background-size: cover;
    background-attachment: fixed;
}

.crw{position: relative;
    padding: 20px 15px 20px 15px;
    background: white;
    border-radius: 5px;
    box-shadow: 0px 3px 20px #0000001a;
    margin:  0px 0 0 0;}
.crw.all{ border-radius: 0 5px 5px 5px;}
.crawltable{width: 100%; border-collapse: collapse; }
.crawltable td{vertical-align: top; padding: 5px 0;}
.crawltable tr:hover{opacity: .9; box-shadow: 0px 8px 20px #0000001a;  }
.crawltable tr{position: relative;transition: all 300ms ease-in-out; border-radius: 5px; }
.crawltable tr .cirout{padding: 8px 10px 10px 8px; }
.crawltable tr .cir{  width: 10px; height: 10px;   border-radius: 5px; }
.crawltable tr.green .cir{background: #8cda6d;}
.crawltable tr.red .cir{background: #da6d6d;}
.crawltable tr.orange .cir{background: #ea9b55;}
.crawltable tr.yellow .cir{background: #efbd48;}
.crawltable tr.blue .cir{background: #85caf5;}
.crawltable td {text-overflow: ellipsis;}
.crawltable td .crop{  cursor: pointer;  white-space: nowrap; display: block;  max-width: 1000px; overflow: hidden;text-overflow: ellipsis;}
.crawltable td .infobox{    font-size: 10pt;
    padding: 10px;
    margin: 5px 10px 5px 0;
    border-radius: 5px;
    background: #e9edf0;}
.crawltable td .infobox a{color:black;}

.content.formcontent{ max-width: 100%;  padding: 200px;position: fixed;top: 0;left: 0;width: 100%;height: 100%;max-width: 100%;background: #000000bf;z-index: 9999;}
.content.formcontent form{position: relative; padding: 20px 20px 20px 20px; background: white; border-radius: 5px;  box-shadow: 0px 8px 20px #0000001a;    max-width: 500px; margin: 0 auto;}
.content.formcontent form strong{display:block; padding: 5px 0 30px 0;}
.content.formcontent form label{width: 100%; opacity: .8; padding: 10px 0 5px 0; display: block; font-size: 10pt; font-weight: bold;}
.content.formcontent form select{width: 100%;}
.content.formcontent form input{width: 100%;}
.content.formcontent form .btn{float:right; margin: 20px 0 0 0;}
.content.formcontent form .fa-times{float: right;padding: 10px;cursor: pointer;margin: -8px -5px 0 0;transition: all 300ms ease-in-out;}
.content.formcontent form .fa-times:hover{opacity: .7; }

input{padding: 15px 15px; background: white; border: solid 1px #dadada; border-radius: 5px;   display: inline-block; font-size: 10pt; font-weight: bold;text-align: left; color:gray;transition: all 300ms ease-in-out; }
input:focus{outline: none; background:#f1f1f1; }

select{-webkit-appearance:none; padding: 15px 15px; position: relative; background: white; border: solid 1px #dadada; border-radius: 5px;   display: inline-block; font-size: 10pt; font-weight: bold;text-align: left; color:gray;transition: all 300ms ease-in-out; }
select:focus{outline: none; background:#f1f1f1; }
.selecticon{    float: right;margin: -32px 15px 0 0;z-index: 999;position: relative;opacity: .6;}


.btn{padding: 15px 30px; text-decoration: none; background: #394f5f; border-style:none; border-radius: 5px; cursor: pointer; display: inline-block; font-size: 10pt; font-weight: bold;text-align: center; color:white;transition: all 300ms ease-in-out; }
.btn:hover{ opacity: .9; box-shadow: 0px 8px 20px #0000001a; transform: translate(0,-2px);  }
.btn.btn2{background: #efbd48;}
.btn.btnR{background: #da6d6d;}
.btn.btnG{background: #8cda6d;}
.btn.circle{height: 46px; width: 46px; padding: 15px 0; border-radius: 50%;}

.line{
    position: relative; padding: 20px 20px 20px 20px; background: white; border-radius: 5px;  box-shadow: 0px 8px 20px #0000001a;
    margin: 0 0 20px 0;
}
.line .btnspace{position: absolute; right: 20px; top: 20px; }
.line .btnspace .btn{margin: 0 0 0 15px;}
.line .url{ opacity: .7; font-size: 10pt; }
.line .infoblock.trafflight{min-width: 20px; animation-name: blink; animation-duration: 1.5s;  animation-iteration-count: infinite;}
.line .infoblock.trafflight .trflght{width: 15px; height: 15px; border-radius: 50%; }
.line .infoblock.trafflight .trflght.red{background: #da6d6d;}
.line .infoblock.trafflight .trflght.yellow{background: #ea9b55;}
.line .infoblock.trafflight .trflght.green{background: #8cda6d;}

.line.infoG{background: #8cda6d; color:White; font-weight: bold; font-size: 10pt;}
.line.infoR{background: #da6d6d; color:White; font-weight: bold; font-size: 10pt;}
.line.info2{background: #ea9b55; color:White; font-weight: bold; font-size: 10pt;}
.line.lineshort{  max-width: 500px; margin: 0 auto;}

.content.authform form{position: relative; padding: 20px 20px 20px 20px; background: white; border-radius: 5px;  box-shadow: 0px 8px 20px #0000001a;    max-width: 500px; margin: 0 auto;}
.content.authform form strong{display:block; padding: 5px 0 5px 0;}
.content.authform form label{width: 100%; opacity: .8; padding: 10px 0 40px 0; display: block; font-size: 10pt; font-weight: bold;}
.content.authform form input{-webkit-appearance:none;width: 280px;  letter-spacing: 14px;display: block; margin: 0 auto; text-align: center; font-size: 16pt;}
.content.authform form .btn{float:none; margin: 20px auto 0 auto; display:block;}
.content.authform.loginform form input{width: 100%; letter-spacing: initial; font-size: 12pt; margin-top:6px; padding: 14px;}


/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance:textfield;
}

@keyframes blink {
    0% {opacity: 1;}
    50% {opacity: .5;}
    100% {opacity: 1;}
}

.chart{height: 100px; margin: 0 0 40px 0; position: relative; }
.chart.hours{}
.chart .point{float:left; padding: 0 2px 0 0;position: relative;    width: 8px;height: 100px;}
.chart.hours .point{}
.chart .point .vertical{position: absolute; bottom: -16px; opacity: .6; font-size: 8pt;}
.chart .point span{display:block;   background:  #ea9b55; position: absolute; bottom: 0;}
.chart.hours .point span{display:block; width: 6px; height: 6px; background: red; border-radius: 3px;}
.chart.week .point{  width: 7px;}
.chart.week .point span{display:block; width: 5px; height: 6px; background: red; border-radius: 4px;}
.chart.month .point{  width: 8px;}
.chart.month.preview .point{  width: 7.8px;}
.chart.month .point span{display:block; width: 6px; height: 6px; background: red; border-radius: 4px;}

.chart .point.red span{background: #da6d6d;}
.chart .point.green span{background: #8cda6d;}
.chart .point.yellow span{background: #efbd48;}
.chart .point.orange span{background: #ea9b55;}

.chart .max{position: absolute; font-size: 8pt; opacity: .6; z-index: 99; right: 20px; top: -10px;}
.chart .min{position: absolute; font-size: 8pt; opacity: .6; z-index: 99; right: 20px; bottom: 0px;}
.chart .aprox{position: absolute; font-size: 8pt; opacity: .4;   right: 20px; width: 1200px; border-bottom: 1px dashed #0000005e; text-align: right; }

.fullinfo {margin-bottom: 20px;}

.line .infoblock.tit{width: 600px;}
.line .infoblock.tit a{color:black; text-decoration: none;}
.line .infoblock.titDet{width: 380px;}
.line .infoblock{float:left; padding: 5px 10px 5px 0; min-width: 150px;}
.line .infoblock strong{display: block;}
.line .infoblock span{display: block; opacity: .7; font-size: 10pt;}
.line.linecirc{padding: 20px 0px 20px 20px;}
.line .infoblock.infocirc{width: 202px}
.line .infoblock.infocirc span{padding: 6px;}
.line .infoblock .fa-spin{color:#b9b9b9;}
.line .infoblock.infocirc .fa-spin{color:#b9b9b9;}
.line .infoblock.infocirc strong .fa-spin{color: white;}
.line .infoblock.infocirc strong{display: inline-block;padding: 10px 20px;border-radius: 50px;color: white;font-size: 14pt;}
.line .infoblock.infocirc.if-all strong{background: #b6c0c7;}
.line .infoblock.infocirc.if-green strong{background: #8cda6d;}
.line .infoblock.infocirc.if-red strong{background: #da6d6d;}
.line .infoblock.infocirc.if-orange strong{background: #ea9b55;}
.line .infoblock.infocirc.if-yellow strong{background: #efbd48;}
.line .infoblock.infocirc.if-blue strong{background: #85caf5;}

.line .actinfo {}
.line .actinfo .infoblock{width: 300px;}
.line .actinfo .infoblock.infocirc2 strong{display: inline-block;padding: 10px 6px;border-radius: 50px;color: black;font-size: 14pt;}
.line .actinfo .infoblock.infocirc2 span{padding: 6px;}

.line .actinfo .screenblock{    float: right;
    max-height: 366px;
    overflow: hidden;
    position: relative;;
    width: 540px;
    padding: 20px 20px 0 20px;
    margin: -20px;
}
.line .actinfo .screenblock .shadow{    width: 500px;
    height: 20px;
    position: absolute;
    top: 366px;
    background: white;
    box-shadow: 0px 8px 20px #0000006e;}
.line .actinfo .screenblock img {border-radius: 5px;
    box-shadow: 0px 8px 20px #0000001a; margin-bottom: 20px;}

.load{opacity: .4;}

.line strong.main{padding: 0 6px;}

.charthelper{position: absolute; z-index: 999; display:none;padding: 10px 20px 10px 10px; background: white; border-radius: 5px;  box-shadow: 0px 8px 20px #0000001a; font-size: 10pt;}
.charthelper.show{ display:block; }
.charthelper span.point{display:block; width: 15px; height: 15px; border-radius: 50%; float:left; padding: 0;}
.charthelper span{display:block;     padding: 0 0 0 22px; }
.charthelper strong{display:block;  padding: 0 0 5px 22px;}
.charthelper .point.red{background: #da6d6d;}
.charthelper .point.green{background: #8cda6d;}
.charthelper .point.yellow{background: #efbd48;}
.charthelper .point.orange{background: #ea9b55;}

.tabs{position: relative;}
.tabs .tab{cursor:pointer; float:left; padding: 13px 20px 25px; margin: 0 10px 0 0; background: white;opacity: .7; border-radius: 5px 5px 0 0;transition: all 300ms ease-in-out;}
.tabs .tab.active{position: relative; z-index: 9999; transform: translate(0,-4px); padding-top: 17px; opacity: 1;}
.tabs .tab:hover{ transform: translate(0,-4px);padding-top: 17px; opacity: 1;  }
.tabs .tabR{float:right;}
.tabs .dwnl{    cursor: pointer;
    color:black;
    position: relative;
    transition: all .3s ease-in-out;
    border-radius: 5px;
    padding: 9px 0px 9px 3px;
    text-align: center;
    width: 36px;}
.tabs .dwnl:hover{background: rgba(90, 106, 117, 0.23);}
.tabs .dwnl:hover span{opacity: 1;}
.tabs .dwnl span{
    position: absolute;
    background: #ffffff;
    display: block;
    border-radius: 5px;
    opacity: 0;
    transition: all .3s ease-in-out;
    z-index: 9999;
    box-shadow: 0px 8px 20px #0000001a;
    width: 140px;
    padding: 6px;
    left: -50%;
    margin: 13px 0 0 -38px;
}
.tabs .dwnl span:before{
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #ffffff;
    border-width: 6px;
    margin-left: -6px;
}

.cl{clear:left;}

.logo a{text-decoration: none; color:black;}
.logo h1{margin: 3px 0;}


#page{
   width: 100%; }

.content.menu{margin-top: 20px; margin-bottom: 0;}
.menu .logo{float:left;  padding: 0  0 0 20px; opacity: 0.8; }
.menu .logo.logcent{margin: 0 auto; text-align: center; float:none; margin-top: 50px;}
.menu .logo img{max-width: 330px;}
.menu .menuright{float:right; padding: 0 20px 0 0;}

.content{    margin: 0 auto 20px auto;max-width: 1280px;padding: 20px;color:#2d2d2d;}
.content.wh{background: white; }
.content.blue{background: #d8222e; }

.footer{text-align: center; font-size: 8pt; opacity: .4;}
.footer a{color:black;}

p a {color:white; }


.modal .row .colin.mvR{ margin: 0;  }
.modal .row .colin.mvL{ margin: 0 ;  }

@media screen and (max-width: 940px) {

    .menu .menuright{display:none; }

    h1{  font-size: 20pt; padding: 0 20px;}
    h2{  font-size: 16pt; padding: 0 20px;}
    p{ margin: 30px  20px;}
    p.main{font-size: 12pt;}

    .row{display:block;}
    .row .colin.mvR{ margin: -20px 0 0 0;  }
    .row .colin.mvL{ margin: 0 0 -20px 0 ;  }


    .row .colin.wthArrRight:before{ position: absolute;    bottom: -30px;    left: 0px;      top: auto;}
    .row .colin.wthArrLeft:before{ position: absolute;    top: -30px;    left: 0px;
        border-top: none;
        border-left:none;
        border-bottom: 30px solid red;
        border-right: 30px solid transparent;
    }
    .row .colin.green:before{border-bottom-color:#d8222e;}

    .modal .row .colin.mvR{ margin: -20px 0 0 0;  }
    .modal .row .colin.mvL{ margin: 0 0 -20px 0 ;  }

    .rozc .row{display: flex;flex-wrap: wrap}
    .rozc .row .col{flex: 0 0 50%;}


    .articles .row{display: flex;flex-wrap: wrap}
    .articles .row .col{flex: 0 0 100%;}

}



@keyframes loader {
    0% {stroke-dashoffset: 141; opacity: 0;}
    5%{opacity: 1;}
    50% {stroke-dashoffset: 0;}
    95%{opacity: 1;}
    100% {stroke-dashoffset: -141; opacity: 0;}

}


@keyframes blink {
    50% {opacity: .5}

}

.clear{clear:both;}


.foot{text-align: center; width: 100%; opacity: .3; font-size: 9pt; padding: 200px 0 100px 0;}
.foot a{color:black;}