@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,300;0,400;0,500;1,200&display=swap');
body {font-family: 'Montserrat', sans-serif;
width: 100%;
  height: 100%;
  opacity: 1;
  background-image: url('../img/header.jpg');
  background-repeat: repeat;
  background-position: 50%;
  position: relative;
  margin-bottom: -50px;
  position: relative;
}


h2 {color: #eee;font-weight: normal;font-size: 24px;}

footer {background: #1a0f1f;color: #fff;}


header {
   left: 0;
  margin-top:-100px;
  width: 100%;
  height: auto;
  opacity: 1;
  background-image: url('../img/background3.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: scroll;
  background-size: cover;
  position: relative;
}


.tvch {margin-top: 10px;}
.tvch h1 {color: #c9c8cb;margin:15px 0;font-size: 32px;}
.tvch .logoch {border: solid 1px #e6843a;
  padding: 4px 10px;
background: #e6843a;
border-radius: 25px;
text-align: center;
  
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s;}

.tvch .logoch img {text-align: center;width: 100%;}
.tvch button.btn-outline-light {width: 100%;}
.sdescr {margin: 15px 0;}
.sdescr p {color: #c9c8cb;line-height: 20px;}
.sdescr button {font-size: 16px;}

.chlist {margin-top:0px;height: 90vh;color: #79797b;border-radius: 0 0 20px 20px;border: 1px solid #e6843a;}
.chlist h3 {color: #e6843a;font-weight: bold;text-transform: uppercase;}
.chlist h3:hover {color: #ffffff;font-weight: bold;text-transform: uppercase;}
.chlisto h2 {font-size:17px;color: #000;background: #e6843a;padding: 15px;position: relative;font-weight: bold;}

.chlisto select {border: 1px solid #e6843a;margin-top: -8px;}

.sticky {
  position: sticky;
  top: 0;
  min-height: 2em;
  }
.text-orange {color:#e6843a;}




    .chlist img {border-radius: 12px;float: left;position: relative;width: 50px;}
    .chlist h3 {clear: both;position: relative;font-size: 16px;}
    .chlist span {clear: both;position: relative;font-size: 13px;border:0;}

    .chlist .flex {background: rgba(0,0,0,0.7);margin:5px 0;border-bottom: 1px solid #e6843a;}
    .chlist .flex a {text-decoration: none;color: #fff;}
    .chlist .flex a:hover {color: #fff;}



.content_block {
                overflow: hidden;
                position: relative;
                height: 100px;
            }

            .content_block.hide {
                height: auto;
            }

            .content_block.hide:after {
                height: 300px;
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
            }


            #headinb {
                background: url('https://player.teleon.tv/img/background3.jpg') no-repeat center center fixed;
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                padding: 50px 0;
                margin: -50px 0 0 0;
                text-shadow: 1px 1px 1px #000;
            }

            @media (min-width: 568px) {
                #headinb h1 {
                    font-weight: bold;
                    margin: 10px 0;
                    font-size: 36px;
                }

                #headinb .desc {
                    font-size: 17px;
                    margin: 20px 0;
                }

                #headinb .advant {
                    top: 22px;
                    position: relative;
                }

                .tvsearch button {
                    margin-top: -1px;
                    margin-left: 3px;
                }
            }

            @media (max-width: 568px) {
                #headinb h1 {
                    font-weight: bold;
                    margin: 10px 0;
                    font-size: 24px;
                }

                #headinb .desc {
                    font-size: 15px;
                    margin: 20px 0;
                }

                #headinb .advant {
                    top: 22px;
                    position: relative;
                }

                .tvsearch button {
                    clear: both;
                }
            }


footer {
	background: #0b0c10;
}


  .archivein {margin: 14px 0;margin: 5px 0;background: #000;font-size:18px;border-radius: 0;min-height: 140px;}
    .archivein img {border-radius: 0px;}
    .archivein span {font-size: 15px;overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 4; /* number of lines to show */
   -webkit-box-orient: vertical;
   padding: 10px;
   font-weight: bold;}
   .archivein .text-left {text-align: left;font-size: 13px;padding: 3px 10px 15px 10px;}
    .archivein:hover {background: #212121;}
    .archivein a:hover {text-decoration: none;color: #fff;}
    .archivein a {color: #818082;text-decoration: none;}
.archivetv {margin: 25px 0;}
.archivetv h2 {color: #c9c8ca;font-size: 24px;}
p.cl {color: #c9c8ca;margin:10px 0;font-size: 14px;}

.reltitle h2 {color: #c9c8ca;font-size: 24px;margin:15px 10px;}
.reltitle .row {margin: 0 2px;}

.relativeb .countr img {
                                    width: 30px;
                                    height: 20px;
                                    float: right;
                                    position: relative;
                                    margin-top: 15px;
                                    margin-right: 5px;
                                }

                                .relativeb {
                                    margin: -50px 0 14px 0;
                                    margin: 5px 0;
                                    background: #000;
                                    font-size: 18px;
                                    border-radius: 0;
                                    min-height: 40px;
                                }

                                .relativeb img {
                                    border-radius: 7px;
                                    max-height: 120px;
                                }

                                .relativeb span {
                                    font-size: 15px;
                                    overflow: hidden;
                                    text-overflow: ellipsis;
                                    display: -webkit-box;
                                    -webkit-line-clamp: 1;
                                    /* number of lines to show */
                                    -webkit-box-orient: vertical;
                                    padding: 10px;
                                    font-weight: bold;
                                }

                                .relativeb .text-left {
                                    text-align: left;
                                    font-size: 13px;
                                    padding: 3px 10px 15px 10px;
                                }

                                .relativeb {background: #0b0c10;}

                                .relativeb:hover {
                                    background: #212121;
                                    color: #fff;
                                }

                                .relativeb a:hover {
                                    text-decoration: none;
                                    color: #fff;
                                }
                                .relativeb a {color: #818082;text-decoration: none;}


                                 .content_block2 {
                                    overflow: hidden;
                                    position: relative;
                                    height: 170px;
                                    background: transparent;
                                    padding: 0px;
                                }

                                .content_block2.hide {
                                    height: auto;
                                }

                                .content_block2.hide:after {
                                    height: auto;
                                    position: absolute;
                                    left: 0;
                                    right: 0;
                                    bottom: 0;
                                }

                                .gblc {margin-top: -830px;position: relative;}


                                
    .videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.popupl {width:100%;height:420px;background:#000;text-align:center;color:#fff;}
  .popupl a i {margin:170px 0 0 0;font-weight:bold;color:red;font-size:80px}
  .popupl a:hover i {margin:170px 0 0 0;font-weight:bold;color:white;font-size:80px}
.my-video {
  /*FireFox*/
  scrollbar-width: none;
  /*IE10+*/
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
#my-video::-webkit-scrollbar {
  /*Chrome, Safari, Edge*/
  display: none;
}