@font-face {
    font-family: Nazanin;
    src: url("../assets/Fonts/B_NAZANIN/B-NAZANIN.TTF");
}
@font-face {
    font-family: Farnaz;
    src: url("../assets/Fonts/B-Farnaz/B\ Farnaz_0.ttf");
}
@font-face {
    font-family: Titr;
    src: url("../assets/Fonts/B-Titr/B\ Titr\ Bold_0.ttf");
}
@font-face {
    font-family: BAHNSCHRIFT;
    src: url("../assets/Fonts/BAHNSCHRIFT.TTF");
}

body{
font-family: Nazanin;
padding: 0;
margin: 0;
background: rgb(46,53,60);
background: linear-gradient(126deg, rgba(46,53,60,1) 0%, rgba(5,8,16,1) 45%, rgba(5,8,16) 100%);
direction: rtl;
color: #fff;
}
.logo-top{
    text-decoration: none;
    color: white;
}
.logo{
font-family: Farnaz;
margin: unset;
}
.logo img{
width: 30px;
height: 30px;
}
.logo h4{
font-size: 15px;
margin: auto;
margin-right: 9px;
}
.hamberguar{
cursor: pointer;
display: flex;
flex-direction: column;
width: 25px; 
height: 13px; 
justify-content: space-between;


}
.line{
height: 4px; 
background-color: #fff;
}
.menu {
position: fixed;
top: 0;
left: -101%; 
width: 100%;
background-color: #f8f8f8;
padding: 10px;
border: 1px solid #ccc;
opacity: 0;
visibility: hidden; 
transition: opacity 0.5s ease, left 1s ease; 
}
.menu li:hover{
background: #142dc9;
}

.menu.active {
left: 0; 
opacity: 1; 
visibility: visible; 
}


.menu ul {
list-style: none;
padding: 0;

}

.menu ul li {
margin: 10px 0;
}

.menu ul li a {
text-decoration: none;

}

.whatsapp{
    position: fixed;
    bottom: 90px;
    z-index: 10;
  }
  .whatsapp img{
    width: 70px;
    height: 70px;
  }

  .menu{
    display: none;
          position: absolute;
          top: 0px;
          left: 5px;
          background: rgb(8,22,42);
          background: linear-gradient(123deg, rgba(8,22,42,1) 15%, rgba(6,9,19,1) 35%, rgba(6,9,19,1) 45%, rgba(7,15,29,1) 50%);
          border-radius: 5px;
          box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
          z-index: 1000;
          font-family: Farnaz;
      }
      .header-controller{
        display: none;
      }
      .menu.active {
          display: block;
          display: block;
          height: 900px;
          width: 60%;
          margin: 0;
          padding: 0;
          border: none;
          position: fixed;
      }
      .menu ul {
          list-style: none;
          padding: 0;
          margin: 0;
          margin-top: 5rem;
      }
      .menu li {
          padding: 10px 20px;
      }
      .menu a {
          text-decoration: none;
          color: white;
          transition: color 0.3s ease;
      }
      .support-btn{
        display: none;
      }
      .toggle-menu{
        display: block;
      }
      .all-elemnt-controller{
        position: -webkit-sticky;
        position: sticky;
        top: 0; 
        /* background: rgb(25 30 38); */
      }
      .menu a:hover {
          color: #FFD700; 
      }
      .support-call{
        text-decoration: none;
        color: #000 !important;
        background: #fff;
        border-radius: 20px;
        padding: 10px 20px;
      }
      .support-controll{
        text-align: center;
      margin-top: 5rem;
      }

      .cust-header{
        position: sticky;
        top: 0;
        z-index: 15;
        background: transparent;
        border-bottom: 0;
        outline: 0;
        }

        @media (min-width: 767px) 
        {
			 .logo{
        margin: auto;
      }
            .cust-header{
                background:#12161e;
            }
            .logo-controller{
                margin: 0 !important;
                 width: 14%;
              }
              .header-controller{
                display: block;
                margin: 0;
                width: 70%;
                text-align: center;
              }
              .ham-toggle{
                margin: 0 !important;
                width: 15%;
              }
              .header{
                padding: 10px 20px;
                font-size: 17px;
                display: flex;
                justify-content: space-evenly;
              }
              .header a{
                text-decoration: none;
                color: #fff;
              }
              .logo img{
                width: 35px;
                  height: 35px;
              }
              .logo h4{
                font-size: 15px;
                margin: auto;
                margin-right: 9px;
              }
              .header a:hover{
                color: #374e83;
              }
              .support-btn{
                display: block;
                width: 13%;
                height: auto;
                padding-top: 0;
                text-align: center;
                margin: auto;
              }
              .support-controll{
                margin-top: auto;
              }
              .all-elemnt-controller{
                margin: 0;
                padding: 10px;
              }
              #supportBtn .support-call{
                text-decoration: none;
                color: #000 !important;
                font-size: 15px;
                background: #fff;
                border-radius: 20px;
                padding: 5px 10px;
                font-weight: 700;
              }
        }
        @media(min-width:1439px) {
            .header{
                font-size: 17px;
              }
              .logo h4{
                font-size: 17px;
              }
              .logo img {
                width: 40px;
                height: 40px;
              }
              #supportBtn .support-call{
                padding: 10px 15px;
              }
        }