@charset "UTF-8";

/*!
 * Bootstrap v5.0.1 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */

.me-0 {
  margin-left: 0 !important;
}

.me-1 {
  margin-left: 0.25rem !important;
}

.me-2 {
  margin-left: 0.5rem !important;
}

.me-3 {
  margin-left: 1rem !important;
}

.me-4 {
  margin-left: 1.5rem !important;
}

.me-5 {
  margin-left: 3rem !important;
}

.me-auto {
  margin-left: auto !important;
}

.ms-0 {
  margin-right: 0 !important;
}

.ms-1 {
  margin-right: 0.25rem !important;
}

.ms-2 {
  margin-right: 0.5rem !important;
}

.ms-3 {
  margin-right: 1rem !important;
}

.ms-4 {
  margin-right: 1.5rem !important;
}

.ms-5 {
  margin-right: 3rem !important;
}

.ms-auto {
  margin-right: auto !important;
}

.pe-0 {
  padding-left: 0 !important;
}

.pe-1 {
  padding-left: 0.25rem !important;
}

.pe-2 {
  padding-left: 0.5rem !important;
}

.pe-3 {
  padding-left: 1rem !important;
}

.pe-4 {
  padding-left: 1.5rem !important;
}

.pe-5 {
  padding-left: 3rem !important;
}

.ps-0 {
  padding-right: 0 !important;
}

.ps-1 {
  padding-right: 0.25rem !important;
}

.ps-2 {
  padding-right: 0.5rem !important;
}

.ps-3 {
  padding-right: 1rem !important;
}

.ps-4 {
  padding-right: 1.5rem !important;
}

.ps-5 {
  padding-right: 3rem !important;
}

.text-start {
  text-align: right !important;
}

.text-end {
  text-align: left !important;
}



/*style.css spaces*/

.pr_32px,
.px_32px {
  padding-left: var(--px32);
}

.pl_32px,
.px_32px {
  padding-right: var(--px32);
}

.pr_12px {
  padding-left: var(--px12);
}

.pl_12px {
  padding-right: var(--px12);
}

.scroll_right {
  direction: rtl;
}

.scroll_right>* {
  direction: ltr;
}

img[src*="arrow-left"],
img[src*="send"],
img[src*="arrow-back"] {
  rotate: 180deg;
}

img[src*="send-white"] {
  rotate: 90deg;
}

.radio_item_container input {
  text-align: right;
}

.radio_item_container input:checked:before {
  margin-right: -1rem;
}

input.arrow_btns[type=number]::-webkit-inner-spin-button,
input.arrow_btns[type=number]::-webkit-outer-spin-button {
  right: .5rem;
  left: auto;
}

input.tafseer_font_size[type=number] {
  padding-left: 2.8rem;
}

input.tafseer_font_size[type=number]::-webkit-inner-spin-button,
input.tafseer_font_size[type=number]::-webkit-outer-spin-button {
  right: -30px;
  left: auto;
}

.sidebar_menu,
.sidebar_menu.show {
  right: auto;
}

.dropdown-toggle::after {
  margin-left: 0;
}

.search_sidebar {
  transition: .5s margin-left ease-out;
}

.search_sidebar.hide_sidebar {
  margin-left: -325px;
}

.filter_sidebar {
  transition: .7s margin-right ease-out;
}

.filter_sidebar.hide_sidebar {
  margin-right: -325px;
}

.accordion-button::after {
  margin-right: initial;
  margin-left: auto;
}

.top_text {
  left: var(--px8);
  right: auto;
}

.collapse_right_to_left.collapse,
.collapse_right_to_left.collapsing {
  left: 0;
  right: auto;
}

.collapse_right_to_left.collapse:not(.show) {
  left: -100%;
  right: auto;
}

.other_translations_header,
.other_translations_container {
  margin-left: -1rem;
}

.ayah_container {
  margin-left: -1rem;
}

.tafseer_content_text {
  margin-left: -1rem;
}

.audio_card {
  left: -11px;
}

.page_dropdown_menu {
  left: -56px !important;
}










@media (min-width: 576px) {

  .me-sm-0 {
    margin-left: 0 !important;
  }

  .me-sm-1 {
    margin-left: 0.25rem !important;
  }

  .me-sm-2 {
    margin-left: 0.5rem !important;
  }

  .me-sm-3 {
    margin-left: 1rem !important;
  }

  .me-sm-4 {
    margin-left: 1.5rem !important;
  }

  .me-sm-5 {
    margin-left: 3rem !important;
  }

  .me-sm-auto {
    margin-left: auto !important;
  }

  .ms-sm-0 {
    margin-right: 0 !important;
  }

  .ms-sm-1 {
    margin-right: 0.25rem !important;
  }

  .ms-sm-2 {
    margin-right: 0.5rem !important;
  }

  .ms-sm-3 {
    margin-right: 1rem !important;
  }

  .ms-sm-4 {
    margin-right: 1.5rem !important;
  }

  .ms-sm-5 {
    margin-right: 3rem !important;
  }

  .ms-sm-auto {
    margin-right: auto !important;
  }

  .pe-sm-0 {
    padding-left: 0 !important;
  }

  .pe-sm-1 {
    padding-left: 0.25rem !important;
  }

  .pe-sm-2 {
    padding-left: 0.5rem !important;
  }

  .pe-sm-3 {
    padding-left: 1rem !important;
  }

  .pe-sm-4 {
    padding-left: 1.5rem !important;
  }

  .pe-sm-5 {
    padding-left: 3rem !important;
  }

  .ps-sm-0 {
    padding-right: 0 !important;
  }

  .ps-sm-1 {
    padding-right: 0.25rem !important;
  }

  .ps-sm-2 {
    padding-right: 0.5rem !important;
  }

  .ps-sm-3 {
    padding-right: 1rem !important;
  }

  .ps-sm-4 {
    padding-right: 1.5rem !important;
  }

  .ps-sm-5 {
    padding-right: 3rem !important;
  }

  .text-sm-start {
    text-align: right !important;
  }

  .text-sm-end {
    text-align: left !important;
  }

  .text-sm-center {
    text-align: center !important;
  }
}

@media (min-width: 768px) {

  .me-md-0 {
    margin-left: 0 !important;
  }

  .me-md-1 {
    margin-left: 0.25rem !important;
  }

  .me-md-2 {
    margin-left: 0.5rem !important;
  }

  .me-md-3 {
    margin-left: 1rem !important;
  }

  .me-md-4 {
    margin-left: 1.5rem !important;
  }

  .me-md-5 {
    margin-left: 3rem !important;
  }

  .me-md-auto {
    margin-left: auto !important;
  }

  .ms-md-0 {
    margin-right: 0 !important;
  }

  .ms-md-1 {
    margin-right: 0.25rem !important;
  }

  .ms-md-2 {
    margin-right: 0.5rem !important;
  }

  .ms-md-3 {
    margin-right: 1rem !important;
  }

  .ms-md-4 {
    margin-right: 1.5rem !important;
  }

  .ms-md-5 {
    margin-right: 3rem !important;
  }

  .ms-md-auto {
    margin-right: auto !important;
  }

  .pe-md-0 {
    padding-left: 0 !important;
  }

  .pe-md-1 {
    padding-left: 0.25rem !important;
  }

  .pe-md-2 {
    padding-left: 0.5rem !important;
  }

  .pe-md-3 {
    padding-left: 1rem !important;
  }

  .pe-md-4 {
    padding-left: 1.5rem !important;
  }

  .pe-md-5 {
    padding-left: 3rem !important;
  }

  .ps-md-0 {
    padding-right: 0 !important;
  }

  .ps-md-1 {
    padding-right: 0.25rem !important;
  }

  .ps-md-2 {
    padding-right: 0.5rem !important;
  }

  .ps-md-3 {
    padding-right: 1rem !important;
  }

  .ps-md-4 {
    padding-right: 1.5rem !important;
  }

  .ps-md-5 {
    padding-right: 3rem !important;
  }

  .text-md-start {
    text-align: right !important;
  }

  .text-md-end {
    text-align: left !important;
  }

  .text-md-center {
    text-align: center !important;
  }
}

@media (min-width: 992px) {

  .me-lg-0 {
    margin-left: 0 !important;
  }

  .me-lg-1 {
    margin-left: 0.25rem !important;
  }

  .me-lg-2 {
    margin-left: 0.5rem !important;
  }

  .me-lg-3 {
    margin-left: 1rem !important;
  }

  .me-lg-4 {
    margin-left: 1.5rem !important;
  }

  .me-lg-5 {
    margin-left: 3rem !important;
  }

  .me-lg-auto {
    margin-left: auto !important;
  }

  .ms-lg-0 {
    margin-right: 0 !important;
  }

  .ms-lg-1 {
    margin-right: 0.25rem !important;
  }

  .ms-lg-2 {
    margin-right: 0.5rem !important;
  }

  .ms-lg-3 {
    margin-right: 1rem !important;
  }

  .ms-lg-4 {
    margin-right: 1.5rem !important;
  }

  .ms-lg-5 {
    margin-right: 3rem !important;
  }

  .ms-lg-auto {
    margin-right: auto !important;
  }

  .pe-lg-0 {
    padding-left: 0 !important;
  }

  .pe-lg-1 {
    padding-left: 0.25rem !important;
  }

  .pe-lg-2 {
    padding-left: 0.5rem !important;
  }

  .pe-lg-3 {
    padding-left: 1rem !important;
  }

  .pe-lg-4 {
    padding-left: 1.5rem !important;
  }

  .pe-lg-5 {
    padding-left: 3rem !important;
  }

  .ps-lg-0 {
    padding-right: 0 !important;
  }

  .ps-lg-1 {
    padding-right: 0.25rem !important;
  }

  .ps-lg-2 {
    padding-right: 0.5rem !important;
  }

  .ps-lg-3 {
    padding-right: 1rem !important;
  }

  .ps-lg-4 {
    padding-right: 1.5rem !important;
  }

  .ps-lg-5 {
    padding-right: 3rem !important;
  }

  .text-lg-start {
    text-align: right !important;
  }

  .text-lg-end {
    text-align: left !important;
  }

  .text-lg-center {
    text-align: center !important;
  }
}

@media (min-width: 1200px) {

  .me-xl-0 {
    margin-left: 0 !important;
  }

  .me-xl-1 {
    margin-left: 0.25rem !important;
  }

  .me-xl-2 {
    margin-left: 0.5rem !important;
  }

  .me-xl-3 {
    margin-left: 1rem !important;
  }

  .me-xl-4 {
    margin-left: 1.5rem !important;
  }

  .me-xl-5 {
    margin-left: 3rem !important;
  }

  .me-xl-auto {
    margin-left: auto !important;
  }

  .ms-xl-0 {
    margin-right: 0 !important;
  }

  .ms-xl-1 {
    margin-right: 0.25rem !important;
  }

  .ms-xl-2 {
    margin-right: 0.5rem !important;
  }

  .ms-xl-3 {
    margin-right: 1rem !important;
  }

  .ms-xl-4 {
    margin-right: 1.5rem !important;
  }

  .ms-xl-5 {
    margin-right: 3rem !important;
  }

  .ms-xl-auto {
    margin-right: auto !important;
  }

  .pe-xl-0 {
    padding-left: 0 !important;
  }

  .pe-xl-1 {
    padding-left: 0.25rem !important;
  }

  .pe-xl-2 {
    padding-left: 0.5rem !important;
  }

  .pe-xl-3 {
    padding-left: 1rem !important;
  }

  .pe-xl-4 {
    padding-left: 1.5rem !important;
  }

  .pe-xl-5 {
    padding-left: 3rem !important;
  }

  .ps-xl-0 {
    padding-right: 0 !important;
  }

  .ps-xl-1 {
    padding-right: 0.25rem !important;
  }

  .ps-xl-2 {
    padding-right: 0.5rem !important;
  }

  .ps-xl-3 {
    padding-right: 1rem !important;
  }

  .ps-xl-4 {
    padding-right: 1.5rem !important;
  }

  .ps-xl-5 {
    padding-right: 3rem !important;
  }

  .text-xl-start {
    text-align: right !important;
  }

  .text-xl-end {
    text-align: left !important;
  }

}

@media (min-width: 1400px) {

  .me-xxl-0 {
    margin-left: 0 !important;
  }

  .me-xxl-1 {
    margin-left: 0.25rem !important;
  }

  .me-xxl-2 {
    margin-left: 0.5rem !important;
  }

  .me-xxl-3 {
    margin-left: 1rem !important;
  }

  .me-xxl-4 {
    margin-left: 1.5rem !important;
  }

  .me-xxl-5 {
    margin-left: 3rem !important;
  }

  .me-xxl-auto {
    margin-left: auto !important;
  }

  .ms-xxl-0 {
    margin-right: 0 !important;
  }

  .ms-xxl-1 {
    margin-right: 0.25rem !important;
  }

  .ms-xxl-2 {
    margin-right: 0.5rem !important;
  }

  .ms-xxl-3 {
    margin-right: 1rem !important;
  }

  .ms-xxl-4 {
    margin-right: 1.5rem !important;
  }

  .ms-xxl-5 {
    margin-right: 3rem !important;
  }

  .ms-xxl-auto {
    margin-right: auto !important;
  }

  .pe-xxl-0 {
    padding-left: 0 !important;
  }

  .pe-xxl-1 {
    padding-left: 0.25rem !important;
  }

  .pe-xxl-2 {
    padding-left: 0.5rem !important;
  }

  .pe-xxl-3 {
    padding-left: 1rem !important;
  }

  .pe-xxl-4 {
    padding-left: 1.5rem !important;
  }

  .pe-xxl-5 {
    padding-left: 3rem !important;
  }

  .ps-xxl-0 {
    padding-right: 0 !important;
  }

  .ps-xxl-1 {
    padding-right: 0.25rem !important;
  }

  .ps-xxl-2 {
    padding-right: 0.5rem !important;
  }

  .ps-xxl-3 {
    padding-right: 1rem !important;
  }

  .ps-xxl-4 {
    padding-right: 1.5rem !important;
  }

  .ps-xxl-5 {
    padding-right: 3rem !important;
  }

  .text-xxl-start {
    text-align: right !important;
  }

  .text-xxl-end {
    text-align: left !important;
  }

}

@media(max-width:991px) {

  .surah_link_container:nth-child(even) {
    border-left: 1px solid var(--gainsboro);
  }
}

@media(max-width: 767px) {
  .sidebar_menu.show {
    left: 0;
  }

  .surah_link_container:nth-child(even) {
    border-left: none;
  }
}

@media(max-width: 575px) {
  .page_dropdown_menu {
    left: auto !important;
  }

  .tafseer_modal .modal-body {
    padding-left: 10px;
  }

  .px_sm_10px {
    padding-left: var(--px10);
    padding-right: var(--px10);
  }
}