/* @import url('//fonts.googleapis.com/css?family=Caveat|Roboto|Roboto+Condensed&subset=cyrillic,cyrillic-ext,latin-ext'); */
/* @import url('https://fonts.googleapis.com/css?family=Caveat:700|Roboto|Roboto+Condensed&subset=cyrillic,latin-ext'); */
@font-face{
        font-family: "Liberation";
        src: url(/fonts/LiberationSans-Regular.ttf);
}
@font-face{
        font-family: "Roboto";
        src: url(/fonts/Roboto-Regular.ttf);
}
@font-face{
        font-family: "RobotoCondensed";
        src: url(/fonts/RobotoCondensed-Regular.ttf);
}
@font-face{
        font-family: "Caveat";
        src: url(/fonts/Caveat-Regular.ttf);
}
@font-face{
        font-family: "Gabriela";
        src: url(/fonts/Gabriela-Regular.ttf);
}
@font-face{
        font-family: "PTSansNarrow";
        src: url(/fonts/PTSansNarrow-Regular.ttf);
}
@font-face{
        font-family: "fontello";
        src: url('/fonts/fontello.ttf?5');
        font-weight: normal;
        font-style: normal;
}
body{
    font-family: Helvetica, Arial, sans-serif;
        font-size: 22px;
    color: #f0f0f0;/*white;*/
    margin: 0;
    padding: 0;
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently */
        overflow: hidden;
}

.osd{
    position: absolute;
}
#info{
    right: 0px;
    top: 0px;
    padding: 20px;
    display: none;
        font-size: 16px;
}
#numprog{
    left: 20px;
    top: 20px;
    padding: 10px;
    /*border-radius: 8px;*/
}
#permanentTime{
    right: 20px;
    top: 20px;
    padding: 10px;
        position: absolute;
}
#launch{
    background-color: black;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    padding: 100px;
    font-size: 16px;
    background-repeat: no-repeat;
    background-position: center center;
   /*   background-size: auto 10%;*/
   /* background-image: url(/stbPlayer/); */
   /*   background-image: url(/stbPlayer/buffering.gif); */
        /* новый год */
   /*      background-size: auto 80%; */
   /*   background-image: url(/stbPlayer/GranularFailingEel-size_restricted.gif); */
        /* 8 марта */
        /* background-size: auto 80%; */
        /* background-image: url(/stbPlayer/b0594b94cbabc558453891912620a519.gif); */
        /* хелоин */
        /* background-size: auto 100%; */
    /* background-image: url(/stbPlayer/GyP.gif); */
        /* background-image: url(/stbPlayer/output.gif); */
        /* background-image: url(/stbPlayer/jack-o-lantern-burning-fire-happy-halloween-animated-gif-image.gif); */
}
.logo{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: 100px;
    background-position: bottom left;
    background-repeat: no-repeat;
    background-image: url(/stbPlayer/400x400.png);
}
#plogo{
    background-position: top right;
    background-image: url();
}
#list_osd{
        display: none;
        position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    /* overflow: hidden;         */
}
#list_window{
        display: none;
        position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
}
.list_back{
        background-color: black;
}
#_t{
        position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    height: 50px;
}
#_b{
        position: absolute;
    left: 0px;
    right: 0px;
    top: 338px;
    bottom: 0px;
}
#_l{
        position: absolute;
    left: 0px;
    width: 10px;
    top: 0px;
    bottom: 0px;
}
#_r{
        position: absolute;
    left: 522px;
    right: 0px;
    top: 0px;
    bottom: 0px;
}
#list{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: 10px;
    overflow: hidden;
}
#listCaption{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    height: 30px;
    /* border-bottom: 1px solid gold; */
        white-space: nowrap;
        overflow: hidden;
}
#listTime{
    position: absolute;
    right: 0px;
    top: 0px;
    width: 80px;
    font-size: 22px;
}
#list_s{
    font-size: 16px;
}
#listPodval{
    position: absolute;
    left: 0px;
    right: 0px;
    /*width: 100%;*/
    bottom: 0px;
    height: 30px;
    /* border-top: 1px solid gold; */
}
#listDetail{
    position: absolute;
    left: 0px;
    width: 514px;
    top: 330px;
    bottom: 31px;
    padding: 4px;
    overflow: hidden;
}
#listPopUp{
    display: none;
    position: absolute;
    left: 0px;
    bottom: 31px;
    padding: 10px;
    margin: 10px;
    background-color: black;
    /* border: 1px solid gold; */
}
#listIn{
    position: absolute;
    left: 522px;
    right: 0px;
    top: 31px;
    bottom: 31px;
    padding: 4px 0px;
}
#listAbout{
    display: none;
    position: absolute;
    left: 522px;
    right: 0px;
    top: 31px;
    bottom: 31px;
    padding: 10px;
    font-size: smaller;
        overflow: hidden;
}
#listEdit{
    display: none;
    position: absolute;
    left: 522px;
    right: 0px;
    top: 31px;
    bottom: 31px;
    padding: 10px;
}
.item{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /*border: 1px solid black;*/
    /*border-bottom: 1px solid black;*/
}
.progress_div{
    float: right;
    /*float: left;*/
    /*border: 1 solid gold;*/
    /*margin: 6;*/
    background-color: #446;
}
.img{
    float: left;
    height: 100%;
    /*margin: 0 0 0 6px;*/
    /*background-size: auto 80%;*/
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}
#info1{
        display: none;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
    padding: 20px;
}
#picon{
    float: left;
        width: 80px;
    height: 80px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}
#channel{
    float: left;
    width: 1040px;
    padding: 0px 20px;
    white-space: nowrap;
    overflow: hidden;
    /*text-overflow: ellipsis;*/
}
#channel_number{
    float: left;
    width: 70px;
}
#progress_div{
    width: 100%;
    background-color: #446;
    margin: 2px 0px;
}
#progress{
    height: 6px;
}
#progress_r{
    height: 6px;
        float: right;
        background-color: #446;
}
#progress_div .tooltip{
        display: none;
        background-color: #600;
        /* border: 1px solid green; */
        position: fixed;
        border-radius: 9px;
        border-radius: 50%;
}
#progress_div .tooltip span{
        background-color: #446;
        position: relative;
        top:-1.5em;
        border-radius: 0.2em;
        text-align: center;
    padding: 0px 0.3em;
}
/* #progress_div:hover .tooltip{
    display: block;
} */
#begin_time{
    display: inline-block;
    vertical-align: bottom;
    font-size: 22px;
    width: 70px;
}
#end_time{
    display: inline-block;
    vertical-align: bottom;
    font-size: 22px;
    width: 70px;
    text-align: right;
}
#programm_name{
    display: inline-block;
    vertical-align: bottom;
    width: 900px;
    overflow: hidden;
    text-overflow: ellipsis;
}
#nbegin_time{
    display: inline-block;
    vertical-align: bottom;
    font-size: 22px;
    width: 70px;
}
#nend_time{
    display: inline-block;
    vertical-align: bottom;
    font-size: 22px;
    width: 70px;
    text-align: right;
}
#nprogramm_name{
    display: inline-block;
    vertical-align: bottom;
    width: 900px;
    overflow: hidden;
    text-overflow: ellipsis;
}
#data{
    float: right;
    width: 80px;
    font-size: 22px;
        white-space: nowrap;
}
#current_s{
    font-size: 16px;
}
#video_res{
    font-size: 16px;
}
#descr{
        padding: 0px 100px;
        margin: 0px 0px 20px 0px;
}
#buffering{
    display: none;
    position: absolute;
    background-repeat: no-repeat;
        background-position: center center;
    background-image: url(/stbPlayer/buffering.gif);
}
#pip_buffering{
    display: none;
    position: absolute;
    background-repeat: no-repeat;
        background-position: center center;
    background-image: url(/stbPlayer/buffering.gif);
}
#mute{
    display: none;
    position: absolute;
    left: 0px;
    top: 50%;
    width: 40px;
    height: 40px;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url(/stbPlayer/mute.png);
    background-size: 20px;
}
#volume_div{
    display: none;
    position: absolute;
    left: 10px;
    top: 40%;
    width: 15px;
    height: 20%;
    background-color: green;
    border: 5px solid black;
}
#volume{
    width: 100%;
    height: 50%;
    background-color: black;
}
#dialogbox{
    display: none;
    position: absolute;
    /* left: 30%;
    right: 30%;
    top: 40%; */
        max-width: 80%;
        max-height: 90%;
        min-width: 30%;
        /* min-height: 20%; */
    padding: 10px;
        overflow: hidden;
    /* border: 1px solid gold; */
}
.btn{
    font-size: smaller;
    display: inline-block;
    background-color: #555;
    border-radius: 6px;
        text-align: center;
    padding: 0px 6px;
    vertical-align: middle;
    line-height: normal;
        text-decoration: none;
        box-shadow: 0 1px rgba(255,255,255,.2) inset, 0 3px 5px rgba(0,1,6,.5), 0 0 1px 1px rgba(0,1,6,.2);
}
.btn:hover { background: #333; }
.btn:active { top: 1px; box-shadow: 0 0 1px rgba(0,0,0,.5) inset, 0 2px 3px rgba(0,0,0,.5) inset, 0 1px 1px rgba(255,255,255,.1); }
.red { background-color: red; }
.red:hover { background: #d00; }
.green { background-color: green; }
.green:hover { background: #060; }
.yellow { background-color: #bb0; }
.yellow:hover{ background-color: #990; }
.blue { background-color: blue; }
.blue:hover { background: #00d; }
.w100 { width: 100px; }
.w50 { width: 50px; }
#testFont{
        white-space: nowrap;
}
.fontello{
        font-family: "fontello";
        line-height: 1.2em;
}