.bg-white
{
	background-color: #fff!important;
}

.font-20
{
	font-size: 20px!important;
}


.font-17
{
	font-size: 17px!important;
}

.height-350
{
    height: 350px!important;
}

.height-40
{
    height: 40px!important;
}

.white-color
{
    color: #ffff!important;
}

.red-color
{
    color: #ff5722!important;
}

.black-color
{
    color: #000!important;
}

.img-circle
{
    height: 24px!important;
    border-radius: 15px!important;
}

.common-button {
    background-color: #6cbe46;
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 5%), inset 0 -1px 0 rgb(0 0 0 / 10%);
    cursor: pointer;
    color: #ffffff;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: 1px solid transparent;
    padding: 0.625rem 1rem;
    font-size: 1rem;
    line-height: 1;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control {
    border: 1px solid #28a745!important;
    border-radius: 5px!important;
    height: 35px!important;
    padding-left: 18px!important;
    font-size: 14px!important;
    background: transparent;
}

.btn-danger{
	background-color: #791a1a;
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 5%), inset 0 -1px 0 rgb(0 0 0 / 10%);
    cursor: pointer;
    color: #ffffff;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    padding: 0.625rem 1rem;
    font-size: 1rem;
    line-height: 1;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.card{
	background-color: #fff!important;
    background-clip: border-box!important;
    border: 1px solid rgba(0,0,0,.125)!important;
    border-radius: .25rem!important;
}

.card-header {
    padding: .75rem 1.25rem!important;
    margin-bottom: 0!important;
    background-color: rgba(0,0,0,.03)!important;
    border-bottom: 1px solid rgba(0,0,0,.125)!important;
}

.card-body{
	    flex: 1 1 auto!important;
    padding: 1.25rem!important;
}

.audio-sura-card {
    background-color: #fff;
    position: relative;
    overflow: hidden;
    margin-top: 24px;
    height: 36px;
    -webkit-box-shadow: 0 2px 10px rgb(0 0 0 / 10%);
    box-shadow: 0 2px 10px rgb(0 0 0 / 10%);
}

.title
{
	color: #FF5722!important;
	font-weight: bold;
	font-size: 40px;
}

.nav--colored .nav__menu > li > a.active {
    color: #ff5722!important;
}

.footer--light {
    background-color: #f5f2f2;
}

.letter-background
{
    line-height: 1.2;
    color: rgb(255 87 34 / 21%);
    z-index: 1;
    position: absolute;
    top: 50%;
    left: -15px;
    transform: translate(0px, -50%);
    user-select: none;
    pointer-events: none;
    text-transform: uppercase;
    font-size: 4rem;
    font-weight: 900;
}

.video-btn
{
    cursor: pointer!important;
}

.entry__sura_video_img-holder {
    margin-bottom: 0px!important;
}

.sura-title
{
    color: #ff5722!important;
}

.logo
{
  height: 55px!important;
}

.pillar
{
    font-size: 16px!important;
    font-family: 'SolaimanLipi', Arial, sans-serif !important;
}


.shadow {
    box-shadow: 0 .5rem 0.3 rem rgba(0,0,0,.15)!important;
    border-radius: 10px;
}


@media only screen and (max-width: 600px) {
  #suraSlider {
    display: none;
  }
}


@media only screen and (min-width: 769px) {
  #audio-sura {
    display: none;
  }
}