﻿* {
    margin: 0px;
    padding: 0px;
}

main{
    background-color: #080210;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23f1f1f1' fill-opacity='0.08' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
}
.section {
    text-align: center;
    border-radius: 20px;
    float: right;
    width: 100%;
    font-weight: bold;
    font-family: ui-monospace;
    height: 70px;
    border-bottom: 2px solid #515151;
        display: flex;
    justify-content: center;
   text-decoration: none;
   color:#e7e9eb; 
}

.section article {
    width: 33%;
    float: left;
    line-height: 70px;
}

.section h1{
    line-height: 70px;
    display: inline-block;
    float: left;
    font-size: 16px;
    width: 33%;
}

.section:hover {
    cursor: pointer;
}
button:hover,button::selection{
    cursor: pointer;
    background: #fff;
    border-width:0px;
    color:black;
}

.section img {
    margin-top: 5px;
    border-radius: 50%;
  
}

.section button  , .section button::selection {
    display: inline-block;
    border: 0px;
    font-weight: bold;
    font-family: sans-serif;

    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 10px;
    font-size: 1rem;
    line-height: 22px;
    border-radius: .25rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;

}

main {
    max-width: 920px;
    margin: auto;
}



#android{
    width: 100%;
    display: flex;
   justify-content: center;
   border-bottom: 2px solid #a9a9a8;
   padding: 3px 0px;
   display: none;
}
#android img{
    height: 65px;
    width: 65px;
    object-fit: contain;
    border-radius: 50%;
    margin-right: 13px;
        margin-top: 10px;
}
#close{
    font-weight: bold;
    font-size: 26px;
    line-height: 75px;
    color: #888888;
    margin: 0px 13px;
    cursor: pointer;
}
#text{
    width: 40%;
}
#app_name{
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    padding: 11px 0px;
}
#app_title{
    font-size: 14px;
    font-family: monospace;
}
#android button{
    width: 25%;
    background: rgb(31, 31, 31);
    color: white;
    height: 40px;
    border:0px;
    margin-top: 15px;
    border-radius: 14px;
}

footer{
    clear: both;
    text-align: center;
    font-family: monospace;

    margin: auto;
    padding: 20px 0px 20px 0px !important;
    font-size: 16px;
    vertical-align: baseline;
}
.EN{
	    text-align:left;
    direction:ltr;

}
.ENF{
	    text-align:left;
    direction:ltr;
    font-size: 11px;


}

.header-4 {
    background-color: #333;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
}

.logo {
    text-align: center;
    flex: 1;
}

.logo img {
}

.contact-button {
    background-color: #f00;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    text-decoration: none;
}

.contact-button:hover {
    background-color: #d00;
}

.menu-hdr {
    cursor: pointer;
    height: 34px;
        padding: 5px;
}
.Ad { background-color: rgb(255 255 255 / 22%); padding: 5px 2px;}
.Font{ font-family: 'Cairo', sans-serif !important;     font-weight: 700; cursor:pointer; } 
#begin-loader {}
@media only screen and (max-width: 540px) {
        footer img{ margin: 5px !important;  border: 0px solid #ffe35b !important;}
                
    .article1 {
width: 20%;
    }
    .article2{
    width: 76% !important;
    font-size: 13px !important;
}
.article3{
width: 25%;
}
.section:hover {
    background-color: #e7e9eb0f;
}
#footer-title{
    font-size: 11px;
}
footer article{margin-right: 3px;}
.footer-content{
    font-size: 11px;
}
footer{
    max-width: 100%;
}
.ChannelTV {margin: 5px!important;}
}

@media only screen and (max-width: 485px){
    
*{
    font-size:12px ;
}

    
.article3 {
    width: 35% ;
}
     #article2, .section h1{    font-size: 12px !important;}
 

}

@media only screen and (max-width: 385px){

    #article2, .section h1{    font-size: 11px !important;}

    
*{
    font-size:11px ;
}

#close{
    font-weight: bold;
    font-size: 26px;
    line-height: 75px;
    color: #888888;
    margin: 0px 13px;
    cursor: pointer;
}
}
@media only screen and (max-width: 375px){


    
    
}
@media only screen and (max-width: 768px) {
  .ChannelTV {
    
  }
}