body {
    height: 100%;
    font-family: vazir;
  
  
  }
  
  .bbg {
  
    height: 100%;
    font-family: vazir;
    background:  linear-gradient(90deg,#8f1c86 0%,#140033 67%);
    
  }
  
  
  /* ///////////////////////////////////nav panel */
  .sidenav {
  
    background:  linear-gradient(90deg,#8f1c86 0%,#140033 67%);
  
    border-radius: 5px;
    border-bottom: 1px solid #ffffff;
  }
  
  .dropdown:hover .dropdown-menu {
    display: block;
  }
  
  .txa1 {
    text-align: right;
  }
  
  /* ///////////////////////////////////nav panel */
  
  /* ///////////////////////////////////list moshtarian panel */
  .bg1 {
    background-color: #fcf7fc;
    border: 1px solid #8f1c86;
    border-radius: 20px;
  
  
    padding: 10px;
  
  }
  
  .textlc {
    color: #8f1c86;
  
  }
  
  
  
  /* //////////////////////////login page */
  .lf label {
    color: white;
  }
  
  
  
  .cardsi {
    margin-top: 50px;
    background-color: #ffffff;
    border: 1px solid #8f1c86;
    border-radius: 20px;
  
  }
  
  @media screen and (min-width: 700px) {
    .imsi {
      width: 20%;
      margin-bottom: 20px;
    }
  }
  
  @media screen and (max-width:699px) {
    .imsi {
      width: 30%;
      margin-bottom: 15px;
  
    }
  }
  
  .logc {
    color: #140033;
  }
  
  .logci {
  
    color: #000000;
  }
  
  /* //////////////////////////login page */
  
  
  /* ///////////////////////////////////list moshtarian panel */
  
  @media screen and (max-width: 700px) {
    .img1 {
      border-radius: 10%;
      border:1px solid black;
      margin-bottom: 10px;
      margin-top: -90px;
      width: 120px;
      height: 120px;
    }
  }
  
  @media screen and (min-width: 701px) {
    .img1 {
      border-radius: 10%;
      border:1px solid black;
      margin-bottom: 10px;
      margin-top: -80px;
      width: 200px;
      height: 200px;
    }
  }
  
  .div1 {
  
  
   
    background:#910819
  
    /* background-color: #ed2049; */
  
  }
  
  
  .nav1 {
  
    background:  linear-gradient(90deg,#8f1c86 0%,#140033 67%);
  
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 5px;
    border-bottom: 1px solid #ffffff;
    border-top: 1px solid #ffffff;
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  
  
  
  }
  
  
  btn1 {
    color: #092635;
  
  }
  
  @media screen and (max-width: 700px) {
    .btnn {
      /* background-image: linear-gradient(to right, #314755 0%, #26a0da  51%, #314755  100%); */
      background-image: linear-gradient(to right, #140033 0%, #8f1c86  51%, #140033  100%);
      margin-bottom: 5px;
      margin-left: 5px;
      text-decoration: none;
      border: 1px solid white;
      padding-left: 10px;
      padding-right:10px;
      padding-top: 3px;
      padding-bottom: 3px;
      border-radius: 5px;
      white-space: nowrap;
       transition: 0.5s;
       background-size: 200% auto;
       color: white;            
       box-shadow: 0 0 20px #eee;
       border-radius: 10px;
    }
    
    
     .btnn:hover {
       background-position: right center; /* change the direction of the change here */
       color: #fff;
       text-decoration: none;
     }
  }
  @media screen and (min-width: 701px) {
    .btnn {
      /* background-image: linear-gradient(to right, #314755 0%, #26a0da  51%, #314755  100%); */
      background-image: linear-gradient(to right, #140033 0%, #8f1c86  51%, #140033  100%);
      margin-bottom: 5px;
      margin-left: 5px;
      text-decoration: none;
      border: 1px solid white;
      padding-left: 15px;
      padding-right:15px;
      padding-top:5px;
      padding-bottom:5px;
      border-radius: 5px;
      white-space: nowrap;
       transition: 0.5s;
       background-size: 200% auto;
       color: white;            
       box-shadow: 0 0 20px #eee;
       border-radius: 10px;
    }
    
    
     .btnn:hover {
       background-position: right center; /* change the direction of the change here */
       color: #fff;
       text-decoration: none;
     }
  }
  
  
  
  /* /////////////////////////////nav cardvisit*/
  
  
  /* /////////////////////////////bashgah va afzoodan moshtari */
  .pishnahad{
    color:#140033;
    text-align: center;
  
    font-size:22px;
   
    border-radius:20px;
  }
  @media screen and (max-width: 700px) {
    .pishnahad {
      font-size:18px;
     line-height:30px;
     padding:10px;
  
  
    }
  }
  
  @media screen and (min-width: 701px) {
    .pishnahad {
      font-size:18px;
      margin-left:50px;
  margin-right:50px;
  padding:5px;
  
  
    }
  }
  
  .tite {
    margin-top: 30px;
  
    scroll-margin-top: 80px;
  
  }
  
  .tite h2 {
    text-align: center;
    font-size: 21px;
    font-weight: 300;
    color: #140033;
    letter-spacing: 1px;
    text-transform: uppercase;
  
    display: grid;
    grid-template-columns: 1fr max-content 1fr;
    grid-template-rows: 27px 0;
    grid-gap: 20px;
    align-items: center;
  }
  
  @media screen and (max-width: 700px) {
    .ctext {
      color: #000000;
      margin-bottom: 10px;
      font-size: 17px;
  
    }
  }
  
  @media screen and (min-width: 701px) {
    .ctext {
      color: #000000;
      margin-bottom: 10px;
      font-size: 18px;
    }
  }
  
  
  .tite h2:after,
  .tite h2:before {
    content: " ";
    display: block;
    height: 3px;
    background-color: #8f1c86;
    ;
  }
  
  .btnb {
    background-image: linear-gradient(to right, #140033 0%, #8f1c86  51%, #140033  100%);
    margin-bottom: 5px;
    margin-left: 5px;
    text-decoration: none;
    border: 1px solid white;
    padding-left: 25px;
    padding-right:25px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    white-space: nowrap;
     transition: 0.5s;
     background-size: 200% auto;
     color: white;            
     box-shadow: 0 0 20px #eee;
     border-radius: 10px;
  
  
  
  
  }
  
  
  .btnb:hover {
    background-position: right center; /* change the direction of the change here */
    color: #fff;
    text-decoration: none;
  
  }
  
  .btnc{
  
    margin-bottom: 5px;
    margin-left: 5px;
    text-decoration: none;
    border: 1px solid #8f1c86;
    padding-left: 20px;
    padding-right:20px;
    padding-top: 5px;
    padding-bottom: 7px;
    border-radius: 7px;
    white-space: nowrap;
     
  
     color: #8f1c86;            
  
     border-radius: 10px;
  }
  .btnc:hover {
    background-image: linear-gradient(to right, #140033 0%, #8f1c86  51%, #140033  100%);
    color: #fff;
    text-decoration: none;
  
  }
  
  
  /* ///////////////////////////// bashgah va afzoodan moshtari*/
  
  /* ///////////////////////////// ertabat ba ma*/
  .iconn {
  
    width: 25px;
    height: 25px;
  
  
  
  }
  
  @media screen and (max-width: 700px) {
  
    .posi {
  
      float: right;
      margin-left: 20px;
      font-size: 18px;
  
    }
  }
  
  @media screen and (min-width: 701px) {
  
    .posi {
  
      float: right;
      margin-left: 20px;
      font-size: 18px;
  
  
    }
  }
  
  
  .dar2 {
  
    border: 1px solid #140033;
    color: #050505;
    border-radius: 10px;
    font-size:10px;
    margin-left:10px;
    margin-right:10px;
    background-color: #ffffff;
  
  }
  .dar2:hover {
    background-color: #6a1d86;
    color: #ffffff;
    cursor: pointer;
  
  }
  
  .linkv {
  font-size:18px;
  
  }
  
  /* ///////////////////////////// ertabat ba ma*/
  
  /* ///////////////////////////// darbareye ma*/
  @media screen and (max-width: 700px) {
  
    .pctext1 {
  
      color: #000000;
      text-align: justify;
  padding-left:25px;
  padding-right:25px;
      margin-top:3px;
      font-size: 16px;
    }
  }
  
  @media screen and (min-width: 701px) {
  
    .pctext1 {
  
      color: #000000;
      text-align: justify;
      margin-right: 10px;
      margin-top: 3px;
      font-size: 20px;
  
    }
  }
  
  
  
  
  
  .dar1 {
    border:3px solid #8f1c86 ;
   background-color: #fff8f8;
  
    color: #8f1c86;
    border-radius: 10px;
  }
  @media screen and (max-width: 700px) {
  
    .pctext2 {
  
      color:#8f1c86;
      margin-right: 10px;
  
      margin-top:3px;
      font-size: 18px;
    }
  }
  
  @media screen and (min-width: 701px) {
  
    .pctext2 {
  
      color: #8f1c86;
      text-align: justify;
      margin-right: 10px;
      margin-top: 3px;
      font-size: 20px;
  
    }
  }
  .dar3 {
    border:3px solid #8f1c86 ;
    background-image: linear-gradient(to right, #140033 0%, #8f1c86  51%, #140033  100%);
  
    color: #ffffff;
    border-radius: 10px;
  }
  /* ///////////////////////////// darbareye ma*/
  
  
  
  
  /* ///////////////////////////// tavanaiiha*/
  
  .bgprogress {
    background-color: #8f1c86;
  }
  
  /* ///////////////////////////// tavanaiiha*/
  /* ///////////////////////////// etelaat mali*/
  
  
  /* ///////////////////////////// etelaat mali*/
  
  /* ///////////////////////////// footer*/
  .footst {
    border-top: 1px solid #ffe253;
    text-align: center;
  
  
  }
  
  .footst h5 {
    text-align: center;
  }
  
  .footst ul {
    text-align: center;
  }
  
  .footst p {
    color: #e5f5ea;
  }
  
  .logost {
    height: 120px;
    width: 120px;
  }
  
  /* ///////////////////////////// footer*/
  
  
  
  
  /* Create three equal columns that floats next to each other */
  .column {
    float: left;
    width: 33.33%;
    display: none;
  
  }
  
  /* Clear floats after rows */
  .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  
  /* The "show" class is added to the filtered elements */
  .show {
    display: block;
  }
  
  /* Style the buttons */
  
  
  
  .btn.active {
    background-color: #666;
    color: white;
  }
  /*checkbox */
  .cbst{
    color:#8f1c86;
    margin-bottom: 10px;
    margin-top:10px;
     font-size: 18px;
  }
  .form-check {
    display: flex;
    align-items: center; /* تراز عمودی چک‌باکس و لیبل */
    justify-content: flex-start; /* جلوگیری از انتقال به وسط یا چپ */
    direction: rtl; /* متن و ترتیب چک‌باکس را راست‌چین می‌کند */
  }
  
  .form-check-label {
    margin-right:35px; /* فاصله لیبل از چک‌باکس */
    margin-left: 0; /* حذف فاصله چپ */
    color:#000000;
  }
  
  .form-check-input {
    margin-left: 0px; /* فاصله چک‌باکس از لیبل */
    margin-right: 0; /* حذف فاصله سمت راست */
  
    border:1px solid black;
  }
  
  /*checkbox */
  
  @font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: 100;
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Thin.eot");
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Thin.woff")format("woff"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Thin.ttf")format("ttf"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Thin.woff2")format("woff2");
  
  }
  
  @font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: 300;
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Light.eot");
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Light.woff")format("woff"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Light.ttf")format("ttf"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Light.woff2")format("woff2");
  
  }
  
  @font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: 400;
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Regular.eot");
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Regular.woff")format("woff"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Regular.ttf")format("ttf"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Regular.woff2")format("woff2");
  
  }
  
  @font-face {
    font-family: Vazir;
    font-style: normal;
    font-weight: 950;
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Black.eot");
    src: url("https://sdpanel.ayrito.ir/fonts/Vazir-Black.woff")format("woff"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Black.ttf")format("ttf"),
      url("https://sdpanel.ayrito.ir/fonts/Vazir-Black.woff2")format("woff2");
  
  }
  
  .table_td p {
    color: white;
  }
  
  .table_td a {
    color: #ffe253;
    text-decoration: none;
  }
  
  .table_td a:hover {
    color: white;
  }
  
  .fmv{
  margin-right:10px;
  margin-left:10px;
  
  }
  .fmv1{
  border:1px solid #8f1c86 ;
    
    }