@media screen and (min-width: 420px) and (max-width: 440px) and (min-height: 727px) and (max-height: 747px) {

  .box {
    display: grid;
    grid-template-rows: repeat(16, 6.1vh);
    grid-template-columns: 1fr;
    width: 370px;
    margin: 0 auto;
  }

  .header1,
  .header2,
  .header3,
  .tahajjud,
  .fajr,
  .sunrise,
  .ishrok,
  .duha,
  .zenith,
  .zuhr,
  .asr,
  .sunset,
  .magrib,
  .isha,
  .footer {
    display: grid;
    grid-template-columns: repeat(5, 1fr);  
    border-bottom: 4px solid rgb(191, 194, 191);
  }
    

  .header1 {
    display: flex;
    justify-content: center;
    font-size: 23px;
    color: rgb(11, 20, 146);
    transform: scaleY(1.2);
    padding-top: 5px;
    width: 100%;
    border-bottom: none;
  }

  /* .switchButton img, 
  .dalilButton img {
    max-width: 80%;
    max-height: 80%;
  } */

  .dalilButton img {
  padding-left: 5px;  
  }

.modal-content {
  width: 70%;
  font-size: 15px;

}

  .header2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 30px;
    color: red;
    padding-right: 15px;
    padding-left: 15px;
    width: 100%;
    border-bottom: none;
  }

  .header3 {
    display: flex;
    justify-content: space-around;
    align-items: flex-end; /* изменено align-items на flex-end */
    font-size: 25px; /* добавлен размер шрифта */
    color: rgb(80, 80, 80);
    /* padding-left: 20px; */
    width: 100%;
    height: auto;
  }

  .footer {
    display: none;
  }

  .namazName {
    color: rgb(11, 20, 146);
    font-size: 25px;
    width: 38%;
  }

  .startName {
    color: rgb(11, 20, 146); 
    font-size: 25px; 
    /* padding-left: 5px; */
    width: 25%;
  }

  .startNameLeft {
    color: #eae6e6;
    font-size: 30px;
    padding-bottom: 10px;
    width: 20%;
    padding-left: 1px;
    display: none;
  }

  .endName {
    color: rgb(11, 20, 146);
    font-size: 25px;
  }

  .endNameLeft {
    color: #eae6e6;
    font-size: 30px;
    padding-bottom: 10px;
    display: none;
    padding-right: 5px;
  }

  .tahajjudName,
  .fajrName,
  .sunriseName,
  .ishrokName,
  .duhaName,
  .zenithName,
  .zuhrName,
  .asrName,
  .sunsetName,
  .magribName,
  .ishaName {
    font-size: 25px;
    color: rgb(80, 80, 80);
    width: 155px;
    display: flex;
    justify-content: start;
    align-items: flex-end; /* изменено align-items на flex-end */
    padding-left: 20px;
  }

  .tahajjudStart,
  .fajrStart,
  .sunriseStart,
  .ishrokStart,
  .duhaStart,
  .zenithStart,
  .zuhrStart,
  .asrStart,
  .sunsetStart,
  .magribStart,
  .ishaStart {
    font-size: 25px;
    color: rgb(80, 80, 80);
    display: flex;
    justify-content: start;
    align-items: flex-end; /* изменено align-items на flex-end */

  }

  .tahajjudStartLeft,
  .fajrStartLeft,
  .sunriseStartLeft,
  .ishrokStartLeft,
  .duhaStartLeft,
  .zenithStartLeft,
  .zuhrStartLeft,
  .asrStartLeft,
  .sunsetStartLeft,
  .magribStartLeft,
  .ishaStartLeft {
    font-size: 10px;
    color: rgb(255, 0, 0);
    display: flex;
    justify-content: start;
    align-items: flex-end; /* изменено align-items на flex-end */
    padding-bottom: 4px;
    padding-left: 1px;
  }

  .tahajjudEnd,
  .fajrEnd,
  .sunriseEnd,
  .ishrokEnd,
  .duhaEnd,
  .zenithEnd,
  .zuhrEnd,
  .asrEnd,
  .sunsetEnd,
  .magribEnd,
  .ishaEnd {
    font-size: 25px; /* изменен размер шрифта */
    color: rgb(80, 80, 80);
    display: flex;
    justify-content: start;
    align-items: flex-end; /* изменено align-items на flex-end */
  }

  .tahajjudEndLeft,
  .fajrEndLeft,
  .sunriseEndLeft,
  .ishrokEndLeft,
  .duhaEndLeft,
  .zenithEndLeft,
  .zuhrEndLeft,
  .asrEndLeft,
  .sunsetEndLeft,
  .magribEndLeft,
  .ishaEndLeft {
    font-size: 10px;
    color: rgb(255, 0, 0);
    display: flex;
    justify-content: start;
    align-items: flex-end; /* изменено align-items на flex-end */
    padding-bottom: 4px;
    padding-left: 1px;
  }

  .highlight {
    background-color: rgb(101, 223, 101);
    color: rgb(0, 0, 0);
  }

  .timer {
    color: red;
  }
}