@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'CoconNextBold';
    src: url('../../fonts/Cocon/CoconNextBold.eot');
    src: url('../../fonts/Cocon/CoconNextBold.eot') format('embedded-opentype'), url('../../fonts/Cocon/CoconNextBold.woff') format('woff'), url('../../fonts/Cocon/CoconNextBold.ttf') format('truetype'), url('../../fonts/Cocon/CoconNextBold.svg#CoconNextBold') format('svg');
}

@font-face {
    font-family: 'CoconNextLight';
    src: url('../../fonts/Cocon/CoconNextLight.eot');
    src: url('../../fonts/Cocon/CoconNextLight.eot') format('embedded-opentype'), url('../../fonts/Cocon/CoconNextLight.woff') format('woff'), url('../../fonts/Cocon/CoconNextLight.ttf') format('truetype'), url('../../fonts/Cocon/CoconNextLight.svg#CoconNextLight') format('svg');
}

@font-face {
    font-family: 'CoconNextRegular';
    src: url('../../fonts/Cocon/CoconNextRegular.eot');
    src: url('../../fonts/Cocon/CoconNextRegular.eot') format('embedded-opentype'), url('../../fonts/Cocon/CoconNextRegular.woff') format('woff'), url('../../fonts/Cocon/CoconNextRegular.ttf') format('truetype'), url('../../fonts/Cocon/CoconNextRegular.svg#CoconNextRegular') format('svg');
}

@font-face {
    font-family: 'Lato-Regular';
    src: url('../../fonts/Lato-Regular.eot');
    src: url('../../fonts/Lato-Regular.eot') format('embedded-opentype'), url('../../fonts/Lato-Regular.woff') format('woff'), url('../../fonts/Lato-Regular.ttf') format('truetype'), url('../../fonts/Lato-Regular.svg#CoconNextRegular') format('svg');
}
 
@font-face {
    font-family: 'Quran2020A';
    src: url('../../fonts/ScriptPgFont/Quran2020A.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

* {
    font-family: 'CoconNextRegular';
}

.btn{min-width:70px;}

#signInPopup {
    z-index: 9999;
}

.WWAContainer .card {
    border: none;
    background: none;
    margin: 0 auto;
    max-width: 1200px;
}

.video-btns-w {
    text-align: center;
}

    .video-btns-w .btn.collapsed, .video-btns-w .btn.collapsed:focus {
        width: 320px;
        margin: 5px 0;
        background: #2c3e50 !important;
        border-color: #2c3e50 !important;
        box-shadow: none !important;
    }
        .video-btns-w .btn, .video-btns-w .btn:focus {
            width: 320px;
            margin: 5px 0;
            background: #6f6f6f !important;
            border-color: #6f6f6f !important;
            box-shadow: none !important;
        }

    .video-btns-w i {
        margin-left: 5px;
        color: #E4C043;
        transform: rotate(180deg);
        float:right;margin-top:5px;
    }

    .video-btns-w i {
        margin-right: 5px;
    }

.videos-w a.close {
    color: #c81f1f;
    font-size: 14px;
    margin-bottom: 10px;
    text-align: left;
}

.LangChanger .socialLinks{display: inline-block;
    vertical-align: middle;
    margin-left: 20px;}
.LangChanger .socialLinks a{padding:0 3px;position:static;color:#5b8a80;}
.LangChanger .socialLinks a:hover{color:#000;}
#lbtnSetArabic{margin:0 !important;}
.list-style {
    position: relative;
    right: 24px;
    list-style: square;
    color: #666666;
}

.info-links {
    padding-left: 90px;
}

.link-head {
    color: #78521b;
}

.link-txt {
    color: #78521b;
    border-bottom: 1px solid;
}

.inner-link-txt {
    color: #666666;
    border-bottom: 1px solid;
}

.feature-links {
    padding-left: 0;
}

.study-links {
    padding-left: 20px;
}

.separator {
    border-top: 1px solid #c2c2c2;
    max-width: 100%;
    padding-top: 10px;
}

.footer-head1 {
    padding-top: 34px;
}

.FooterBody ul,
.FooterBody ol {
    margin: 0;
    padding: 0;
    text-align: right;
}

.footer-head .fa-facebook {
    color: #3b5999;
}
.footer-head .fa-twitter {
    color: #03a9f4;
}
.footer-head .fa-instagram {
    color: #e4405f;
}

a.watchBtn i {
    margin-left: 5px;
    float: right;
    transform: rotate(180deg);
    margin-top: 5px;
}

.UniqueFeatureRight a.readBtn.featureFiveBtn {
    margin-top: 0px !important; 
}

.modal.video-Model .modal-dialog {
    max-width: 1200px;
}
.modal.video-Model .modal-body {
    position: relative;
    display: block;
}
.modal.video-Model .modal-body::before {
    display: block;
    content: "";
    padding-top: 56.25%;
}
.modal.video-Model .modal-body iframe {
    position: absolute;
    top: 0;
    left: 15px;
    right: 15px;
    bottom: 15px;
    width: calc(100% - 30px);
    height: calc(100% - 15px);
}
.InnerPg3Bottom .col-md-6 a.innervideo-a, .Pg8Inner .col-md-4 .col-md-6 a, a.innervideo-a{display:inline-block}
.InnerPg3Bottom .col-md-6 a.innervideo-a img{width:100%;max-width:150px} 

div#workExpModal .modal-dialog, #workExpModal  .modal-dialog, #eduHistoryModal .modal-dialog{
    height: 100%;
    align-items: center;
    display: flex;
}
div#workExpModal .modal-body, #workExpModal  .modal-dialog .modal-body, #eduHistoryModal .modal-dialog .modal-body{
    text-align: center;padding:0;
}
div#workExpModal .modal-body h2, div#workExpModal .modal-body h1, #workExpModal  .modal-dialog .modal-body h2, #workExpModal  .modal-dialog .modal-body h1, #eduHistoryModal .modal-dialog .modal-body h1, #eduHistoryModal .modal-dialog .modal-body h2{
display:inline-block;font-size:27px;
}
div#workExpModal .modal-footer, #workExpModal  .modal-dialog .modal-footer, #eduHistoryModal .modal-footer{
    justify-content: center;
}

@media (min-width:1681px) and (max-width:1920px) {

    .LearnGridIc .SkypeCallingImg {
        width: 90% !important;
        margin-top: 22px !important;
        margin-right: -3px;
    }

    .LearnGridIc .phone {
        width: 83% !important;
        margin-top: 0%;
        margin-right: 30px;
    }

    .LearnGridIc .clock {
        width: 120% !important;
        margin-top: -18%;
        margin-right: -20px;
    }

    .LearnGridIc .globe {
        width: 116% !important;
        margin-top: 2% !important;
        margin-right: -5px;
    }

    .LearnGridIc .offlineImg {
        margin-top: 2%;
        margin-right: -10px;
    }

    .LearnGridIc .study {
        width: 180% !important;
        margin-top: 0%;
        margin-right: -145px;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 10px 0 0 !important;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 0 0 10px !important;
    }

    .LearnGridDesc .SoftwareSteps span.Steptext {
        width: 98% !important;
    }

    .LearnGridIc .FlexiblePaymentImg {
        margin-top: 7%;
        margin-right: -15px;
    }

    .LearnLMSStudyHeading {
        padding-left: 85px;
    }

    .LearnLMSStudyBody {
        padding-left: 150px;
    }
}

@media (min-width:1441px) and (max-width:1680px) {

    .LearnGridIc .SkypeCallingImg {
        width: 90% !important;
        margin-top: 22px !important;
        margin-right: -3px;
    }

    .LearnGridIc .phone {
        width: 83% !important;
        margin-top: 0%;
        margin-right: 30px;
    }

    .LearnGridIc .clock {
        width: 120% !important;
        margin-top: 0%;
        margin-right: -20px; 
    }

    .LearnGridIc .globe {
        width: 116% !important;
        margin-top: 2% !important;
        margin-right: -5px;
    }

    .LearnGridIc .offlineImg {
        margin-top: 19%;
        margin-right: -10px;
    }

    .LearnGridIc .study {
        width: 180% !important;
        margin-top: 0%;
        margin-right: -95px;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 10px 0 0 !important;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 0 0 10px !important;
    }

    .LearnGridDesc .SoftwareSteps span.Steptext {
        width: 98% !important;
    }

    .LearnGridIc .FlexiblePaymentImg {
        margin-top: 7%;
        margin-right: -15px;
    }

    .LearnLMSStudyHeading {
        padding-left: 85px;
    }

    .LearnLMSStudyBody {
        padding-left: 100px;
    }
}

@media (min-width:1366px) and (max-width:1440px) {

    .LearnGridIc .SkypeCallingImg {
        width: 90% !important;
        margin-top: 15px !important;
        margin-right: -3px;
    }

    .LearnGridIc .phone {
        width: 83% !important;
        margin-top: -25%;
        margin-right: 30px;
    }

    .LearnGridIc .clock {
        width: 120% !important;
        margin-top: 22%;
        margin-right: -20px;
    }

    .LearnGridIc .globe {
        width: 116% !important;
        margin-top: -20%;
        margin-right: -5px;
    }

    .LearnGridIc .offlineImg {
        margin-top: -1%;
        margin-right: -10px;
    }

    .LearnGridIc .study {
        width: 180% !important;
        margin-top: -25%;
        margin-right: -95px;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 10px 0 0 !important;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 0 0 10px !important;
    }

    .LearnGridDesc .SoftwareSteps span.Steptext {
        width: 98% !important;
    }

    .LearnGridIc .FlexiblePaymentImg {
        margin-top: 18%;
        margin-right: -15px;
    }

    .LearnLMSStudyHeading {
        padding-left: 85px;
    }

    .LearnLMSStudyBody {
        padding-left: 100px;
    }
}

@media (min-width:1280px) and (max-width:1365px) {

    .LearnGridIc .SkypeCallingImg {
        width: 90% !important;
        margin-top: -16px !important;
        margin-right: -3px;
    }

    .LearnGridIc .phone {
        width: 83% !important;
        margin-top: -25%;
        margin-right: 30px;
    }

    .LearnGridIc .clock {
        width: 120% !important;
        margin-top: 22%;
        margin-right: -20px;
    }

    .LearnGridIc .globe {
        width: 116% !important;
        margin-top: -20%;
        margin-right: -5px;
    }

    .LearnGridIc .offlineImg {
        margin-top: -1%;
        margin-right: -10px;
    }

    .LearnGridIc .study {
        width: 180% !important;
        margin-top: -25%;
        margin-right: -95px;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 10px 0 0 !important;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 0 0 10px !important;
    }

    .LearnGridDesc .SoftwareSteps span.Steptext {
        width: 98% !important;
    }

    .LearnGridIc .FlexiblePaymentImg {
        margin-top: 18%;
        margin-right: -15px;
    }

    .LearnLMSStudyHeading {
        padding-left: 85px;
    }

    .LearnLMSStudyBody {
        padding-left: 100px;
    }
}

/*@media (min-width:1024px) and (max-width:1920px){

.LearnGridIc .SkypeCallingImg{margin-top:-13px !important;}
.LearnGridIc .phone{width:83% !important;}
.LearnGridIc .clock{width:112% !important;}
.LearnGridIc .globe{width:116% !important;}
.LearnGridIc .study{width:150% !important;}



}*/



body>form{
    direction: rtl;
}

.LeftMainMenu {
    padding-right: 0;
}

.CustomDropDown {
    right: 0;
}

    .CustomDropDown .col-md-2 .dropdown-item {
        white-space: unset;
    }


.modal-body p {
    text-align: right;
}

@media (min-width:769px) {
    .StudyTypeImg {
        width: 180% !important;
    }

    .FlexiblePaymentImg {
        width: 120% !important;
    }
}

@media (max-width:600px) {
    .carousel-indicators {
        margin-right: 0;
    }
}


.tooltip1 .tooltiptext {
    visibility: hidden;
    width: 450px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    /*margin-left:20px;*/
    /* Position the tooltip */
    position: absolute;
    left: 0;
    top: 40px;
    z-index: 10;
}

.tooltip1:hover .tooltiptext {
    visibility: visible;
}

.tooltip1 .tooltiptext::after {
    content: "";
    position: absolute;
    top: -3%;
    right: 50%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}


.BrowseFit {
    z-index: -1;
}


body {
    padding: 0 !important;
}

.modal {
    padding: 0 !important;
}

.SubmitRequest {
    background-color: rgba(0,0,0,0.50);
}


.HowQuranWorks p {
    margin-bottom: 0;
}

.QuranNav {
    background-color: #9AEAD8;
    z-index: 1010;
}

    .QuranNav .QuranNavBar ul {
        color: #676767;
    }

.QuranNavBar .rightMenu a img {
    width: 70px;
}

.separatorNav {
    margin: 0 2px;
}

.loginNav {
    background-color: #F7EDA5;
    color: #2E2E2E;
    border-radius: 0px;
    margin-right: -5px;
    border: 1px solid #2E2E2E;
    font-size:14px;
    padding:5px 15px;
}

.signUpNav {
    background-color: #2E2E2E;
    color: #F7EDA5;
    border-radius: 0px;
    border: 1px solid #2E2E2E;
    font-size:14px;
    padding:5px 15px;

}

.LeftMainMenu li.show {
    background-color: #fffbdc;
}

.LeftMainMenu li a i {
    font-size: 22px;
}

.MainMenu {
    color: #a98212;
    padding: 0 4px 10px 4px;
}

.CustomDropDown {
    margin-top: 0px;
    border: none;
    border-radius: 0px;
    background-color: rgba(255,251,220,0.95);
    float: left;
    width: 900px;
    font-size: 0.90rem;
}

.CustomDropMenu .col-md-2 {
    float: right;
    padding: 0;
}

    .CustomDropMenu .col-md-2 .dropdown-item {
        text-align: center;
        padding: 20px 0 15px;
    }

        .CustomDropMenu .col-md-2 .dropdown-item img {
            width: 30px;
            margin-bottom: 5px;
        }

        .CustomDropMenu .col-md-2 .dropdown-item p {
            margin-bottom: 0 !important;
        }

        .CustomDropMenu .col-md-2 .dropdown-item:hover {
            background-color: #9aead8;
        }

.logoBrand {
    /*text-align: center;*/
    text-align: right;
    padding-right: 40px;
}

.LangChanger {
    text-align: left;
    padding: 0;
}

    .LangChanger .arabic {
        color: #5b8a80;
        font-size: 14px;
        font-weight: bold;
    }

        .LangChanger .arabic img {
            padding: 3px;
        }

        .LangChanger .arabic:hover {
            color: #313131;
        }


    .LangChanger .eng {
        color: #5b8a80;
        font-size: 13px;
        font-weight: bold;
        font-family: Lato-Regular !important;
    }

        .LangChanger .eng img {
            padding: 3px;
        }


        .LangChanger .eng:hover {
            color: #313131;
        }



@media (min-width:1900px) {
    .CustomDropDown {
        width: 1400px;
    }
}

@media (min-width:1400px) and (max-width:1899px) {
    .CustomDropDown {
        width: 1200px;
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    .CustomDropDown {
        width: 1100px;
    }
}

@media (min-width:1000px) and (max-width:1299px) {
    .CustomDropDown {
        width: 900px;
        font-size: 0.90rem
    }
}


/* ################################  Inner Header Start ########################### */

.InnerHeader {
    background-image: url(../../images/quraan-holding.jpg);
    float: left;
    padding-bottom: 60px;
    z-index: -1;
    background-size: cover;
}

.InnerHeaderDownloadLink {
    float: left;
    text-align: left;
    padding: 0;
    padding-top: 12px;
}

    .InnerHeaderDownloadLink a img {
        width: 170px;
    }
@media screen and (max-width:1080px) {
.InnerHeaderDownloadLink a img {
        width: 115px;
    }
}
.InnerPageSearch {
    background-color: rgba(255,255,255,0.20);
    margin-top: 8px;
    color: #FFFFFF;
    text-align: center;
    position: relative;
    padding: 10px;
}

    .InnerPageSearch a {
        position: absolute;
        top: 11px;
        left: 22px;
        font-size: 28px;
        color: #6f4a00;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

    .InnerPageSearch input {
        border-radius: 0;
        padding: 12px;
    }
/* ################################  InnerHeader End ########################### */

/* ################################  Breadcrumb Start ########################### */

.Innerbreadcrumb {
    background-color: #eaeaea;
    float: left;
}

.breadcrumbLinks {
    float: left;
    margin-top: 10px;
    font-weight: bold;
}

    .breadcrumbLinks a {
        color: #18222c;
        float: right;
    }

        .breadcrumbLinks a.active {
            color: #937614;
        }

    .breadcrumbLinks span {
        color: #18222c;
        padding: 0 10px;
        float: right;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

/* ################################  Breadcrumd End ########################### */



/*  ---------------------  Tajweed Page Start      -----------------------*/

/* ################################  Tajweed body Start ########################### */

.TajweedContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.TajweedBody {
    background-color: #FFFFFF;
    border-radius: 5px; /*border:1px solid #95989A;*/
    padding-bottom: 20px;
    float: left;
}

.TajweedHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .TajweedHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.Tajweedheading {
    margin: 10px 97px;
    text-align: center;
}

.TajweedBodyContainer {
    text-align: center;
}

.TajweedFirstVideos {
    display: flex;
    flex-wrap: wrap;
}

    .TajweedFirstVideos .col-12 {
        float: right;
        margin: 0px !important;
        padding: 0 10px;
        width: 20%;
        max-width: 100%;
        flex: 0 0 20%;
    }

        .TajweedFirstVideos .col-12.tajweedMainBoxTopTwo {
            width: 25%;
            max-width: 100%;
            flex: 0 0 25%;
        }

        .TajweedFirstVideos .col-12 img {
            max-width: 100%;
        }

        .TajweedFirstVideos .col-12 p {
            color: #000000;
            font-size: 14px;
            font-weight: 700;
        }

.TajweedSecondVideos .col-12 {
    background-color: red;
    padding: 10px;
    margin: 10px;
}

.zoom {
    transition: transform .2s;
}

    .zoom:hover {
        z-index: 1;
        -ms-transform: scale(1.2); /* IE 9 */
        -webkit-transform: scale(1.2); /* Safari 3-8 */
        transform: scale(1.2);
    }

.TajweedDetails {
    padding: 0 !important;
}

    .TajweedDetails h5 {
    }

    .TajweedDetails ul {
        text-align: right;
        text-align: justify;
        margin-top: 15px;
    }

        .TajweedDetails ul li {
            margin-bottom: 5px;
            width: 100%;
            font-weight: 600;
        }

            .TajweedDetails ul li i {
                color: #9d6d0d;
            }

.TajweedBody .container {
    float: right;
    width: 100%;
    max-width: 100%;
    margin: 0 !important;
}

.TajweedVideosGrid > .row {
    width: calc(100% + 30px)
}

.TajweedBody .container:after {
    display: block;
    clear: both;
    content: ""
}

.TajweedBodyContainer {
    padding: 0 25px 25px;
    margin: 0;
    width: 100%;
    max-width: 100%;
}

.TajweedDetails .SoftwareSteps {
    text-align: right;
}

@media (max-width: 1186px) {
    .options .card .card-header {
        padding: 10px 0px 10px 0px;
    }

    .TajweedFirstVideos .col-12 {
        width: 25%;
        flex: 0 0 25%;
    }

        .TajweedFirstVideos .col-12.tajweedMainBoxTopTwo {
            width: 30%;
            flex: 0 0 30%
        }
}

@media (max-width: 991px) {
    .TajweedFirstVideos .col-12 {
        width: 33.33%;
        flex: 0 0 33.33%;
    }

        .TajweedFirstVideos .col-12.tajweedMainBoxTopTwo {
            width: 33.33%;
            flex: 0 0 33.33%;
        }

    .img-icon {
        width: 100% !important;
        text-align: center;
        max-width: 100%;
    }

    .LangChanger .socialLinks {
        float: right;
        margin-right: 25px;
    }

        .LangChanger .socialLinks + div {
            float: left;
        }

    .LangChanger {
        width: 100% !important;
    }
}

@media (max-width: 767px) {
    .TajweedFirstVideos .col-12 {
        width: 50%;
        flex: 0 0 50%;
    }

        .TajweedFirstVideos .col-12.tajweedMainBoxTopTwo {
            width: 50%;
            flex: 0 0 50%
        }
}

@media (max-width: 550px) {
    .TajweedFirstVideos .col-12 {
        width: 100%;
        flex: 0 0 100%;
    }

        .TajweedFirstVideos .col-12.tajweedMainBoxTopTwo {
            width: 100%;
            flex: 0 0 100%
        }
}

@media (max-width:600px) {
    .TajweedBodyContainer {
        margin-right: -8px;
    }
}

@media (min-width:1024px) {
    .TajweedBodyContainer {
        margin-right: 7%;
    }

    .firstVideo {
        margin-right: 29% !important;
    }

    .TajweedVideosGrid {
        margin-right: 0;
        padding: 0;
    }

    .LastVideo {
        margin-right: 36% !important;
    }
}

@media (min-width:1025px)and (max-width:1280px) {
    .TajweedBodyContainer {
        margin-right: 1%;
    }

    .TajweedVideosGrid {
        margin-right: 8%;
        padding: 0;
    }

    .LastVideo {
        margin-right: 35% !important;
    }
}

@media (min-width:1281px)and (max-width:1366px) {
    .TajweedBodyContainer {
        margin-right: 4%;
    }

    .TajweedVideosGrid {
        margin-right: 8%;
        padding: 0;
    }

    .LastVideo {
        margin-right: 35.5% !important;
    }
}

@media (min-width:1367px)and (max-width:1440px) {
    .TajweedBodyContainer {
        margin-right: 7%;
    }

    .TajweedVideosGrid {
        margin-right: 5%;
        padding: 0;
    }

    .LastVideo {
        margin-right: 35.5% !important;
    }
}

@media (min-width:1441px)and (max-width:1920px) {
    .TajweedBodyContainer {
        margin-right: 18%;
    }

    .TajweedVideosGrid {
        margin-right: 5%;
        padding: 0;
    }

    .LastVideo {
        margin-right: 35.5% !important;
    }
}

@media (min-width:1921px) {
    .TajweedBodyContainer {
        margin-right: 23%;
    }

    .TajweedVideosGrid {
        margin-right: 6%;
        padding: 0;
    }

    .LastVideo {
        margin-right: 35.5% !important;
    }
}

/* ################################  Tajweed body End ########################### */

/*  ---------------------  Tajweed Page Start End    -----------------------*/


/*  ---------------------  Software Page Start      -----------------------*/

/* ################################  Software body Start ########################### */

.SoftwareContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.SoftwareBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.SoftwareHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .SoftwareHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.Softwareheading {
    margin: 10px 97px;
}

.SoftwareBodyContainer {
}

.SoftwareGridSection {
    float: left;
    padding: 25px;
    text-align: justify;
}

.DesktopImg {
    text-align: center;
}

    .DesktopImg img {
        width: 85%;
    }

.DesktopDesc span {
    color: #000000;
    float: left;
}

.DesktopDesc i {
    color: #9d6d0d;
}

.SoftwareSteps {
    float: right;
    padding: 5px;
}

    .SoftwareSteps span.Stepicon {
        float: right;
        width: 15px !important;
        color: #9d6d0d;
    }

    .SoftwareSteps span.Steptext {
        float: right;
        width: calc(100% - 15px);
    }

.tajweedMainBoxTopTwo {
    cursor: pointer;
}

.tajweedMainBox {
    cursor: pointer;
}

.MobileDesc {
    float: left;
}

.MobileHeading {
    text-align: center;
}

.MobileImg {
    text-align: center;
    float: right;
}

    .MobileImg img {
    }

.MobleStoreImg {
    padding: 0;
}

    .MobleStoreImg a {
        display: inline-block;
    }

    .MobleStoreImg img {
        width: 173px;
    }

/* ################################  Software body End ########################### */



/*  ---------------------  Software Page Start End    -----------------------*/

/*  ---------------------  Arabic Page Start      -----------------------*/

/* ################################  Arabic body Start ########################### */

.ArabicContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.ArabicBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.ArabicHeaderContent {
    margin-top: 35px;
    margin-bottom: 0;
}

    .ArabicHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.Arabicheading {
    margin: 10px 97px;
    text-align: center;
}

.ArabicBodyContainer {
}

.ArabicGridSection {
    float: left;
    padding: 0;
}


/* ################################ Arabic body End ########################### */



/*  ---------------------  Arabic Page Start End    -----------------------*/


/*  ---------------------  Pricing Start      -----------------------*/

/* ################################  Pricing body Start ########################### */

.PricingContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.PricingBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.PricingHeaderContent {
    margin-top: 35px;
}

    .PricingHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.Pricingheading {
    margin: 10px 97px;
    text-align: center;
}

.PricingBodyContainer {
}

.PricingGridSection {
    float: left;
    padding: 0 25px 25px;
}

    .PricingGridSection .container {
        padding: 0;
    }

.Pricing {
    margin-bottom: 18px;
    max-width: 100%;
}

.PricingBodyContainer {
    text-align: right;
    max-width: 100%;
}

    .PricingBodyContainer .col-md-4 {
        float: right;
        margin-top: 25px;
    }

        .PricingBodyContainer .col-md-4 img {
            padding: 10px 0;
        }

.firstRow {
    background-color: #f1f4f5;
}

    .firstRow .mainContainer {
        padding: 0px !important;
    }

    .firstRow .question {
        padding: 30px 30px 0px 5px;
        margin: 0px;
        text-align: right;
    }

    .firstRow .answersOpt {
        padding: 0 !important;
    }

    .firstRow .text-center .col-lg-6 {
        float: right;
    }

.options .card .card-body {
    background-color: #f1f4f5;
}

.options .card .card-header {
    font-size: 14px !important;
    padding: 10px 0 !important;
}

.firstRow .options {
    padding: 0px;
    margin: 0px;
}

    .firstRow .options .card {
        border-radius: 0px !important;
        border-right: 1px solid #FFFFFF !important;
        border-left: 1px solid #FFFFFF !important;
        border-top: none !important;
        border-bottom: none !important;
        margin: 0px !important;
    }

.Assignments .card-header {
    background-color: #64b5f6;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    /*font-weight: bold !important;*/
}

.CostAssignments .card-header {
    background-color: #4fc3f7;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    /*font-weight: bold !important;*/
}

.CostMonths .card-header {
    background-color: #9ccc65;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    /*font-weight: bold !important;*/
}

.secondRow {
    background-color: #f1f4f5;
    margin-top: 10px !important;
}

    .secondRow .mainContainer {
        padding: 0px !important;
    }

    .secondRow .text-center .col-lg-6 {
        float: right;
    }

    .secondRow .question {
        padding: 30px 30px 30px 5px;
        margin: 0px;
        text-align: right;
        border-left: 1px solid #FFFFFF !important;
    }

    .secondRow .answersOpt {
        padding: 30px 30px 30px 5px;
        text-align: right;
        border-right: 1px solid #FFFFFF !important;
    }

    .secondRow .options {
        padding: 0px;
        margin: 0px;
    }

        .secondRow .options .card {
            border-radius: 0px !important;
            border-right: 1px solid #FFFFFF !important;
            border-left: 1px solid #FFFFFF !important;
            border-top: none !important;
            border-bottom: none !important;
            margin: 0px !important;
        }

.Minutes .card-header {
    background-color: #4dd0e1;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.CostMin .card-header {
    background-color: #ffa726;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.TotalConf .card-header {
    background-color: #ff7043;
    border-radius: 0px !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.TFC_Yes {
    padding: 0 10px;
}

.TFC_No {
    padding: 0 10px;
}

.thirdRow {
    background-color: #f1f4f5;
    margin-top: 10px !important;
}

    .thirdRow .mainContainer {
        padding: 0px !important;
    }

    .thirdRow .text-center .col-lg-6 {
        float: right;
    }

    .thirdRow .question {
        padding: 30px 30px 0px 5px;
        margin: 0px;
        text-align: right;
        border-left: 1px solid #FFFFFF !important;
    }

    .thirdRow .answersOpt {
        padding: 0 !important;
        border-right: 1px solid #FFFFFF !important;
    }

    .thirdRow .options {
        padding: 0px;
        margin: 0px;
    }

        .thirdRow .options .card {
            border-radius: 0px !important;
            border-right: 1px solid #FFFFFF !important;
            border-left: 1px solid #FFFFFF !important;
            border-top: none !important;
            border-bottom: none !important;
            margin: 0px !important;
        }

.forthRow {
    margin-top: 10px !important;
}

    .forthRow .mainContainer {
        padding: 0px !important;
    }

    .forthRow .question {
        padding: 30px 30px 0px 5px;
        margin: 0px;
        text-align: right;
        border-left: 1px solid #FFFFFF !important;
        color: #876d29;
        font-weight: bold;
    }

    .forthRow .answersOpt {
        padding: 0 !important;
        border-right: 1px solid #FFFFFF !important;
    }

    .forthRow .text-center .col-lg-6 {
        float: right;
    }

    .forthRow .TotalCount {
        padding: 0px;
        margin: 0px;
        float: left;
    }

        .forthRow .TotalCount .card {
            border-radius: 0px !important;
            border-right: 1px solid #FFFFFF !important;
            border-left: 1px solid #FFFFFF !important;
            border-top: none !important;
            border-bottom: none !important;
            margin: 0px !important;
        }

    .forthRow .options {
        padding: 0px;
        margin: 0px;
    }

        .forthRow .options .card {
            border-radius: 0px !important;
            border-right: 1px solid #FFFFFF !important;
            border-left: 1px solid #FFFFFF !important;
            border-top: none !important;
            border-bottom: none !important;
            margin: 0px !important;
        }

.totalCost {
    border: none !important;
}

    .totalCost .card-body {
        border: none !important;
        background-color: #FFFFFF;
        padding: 35px 0 35px 0;
        color: #e74c3c;
    }

.totalVal {
    background-color: #e74c3c !important;
    padding: 32px 0px;
}

.answersOpt .col-lg-8 {
    float: right;
}

.FeeCalcu {
    float: right;
}

#pricingDetails .TeacherConference-nav {
    float: right;
    position: relative;
    height: 27px;
}

#pricingDetails .TeacherConference-button.TeacherConference-up {
    position: absolute;
    height: 50%;
    top: 1px;
    border-bottom: 1px solid #eee;
    right: -23px;
    background: #d3d3d3;
}

#pricingDetails .TeacherConference-button.TeacherConference-down {
    position: absolute;
    bottom: 0px;
    height: 50%;
    right: -23px;
    background: #d3d3d3;
}

#pricingDetails .TeacherConference-button {
    position: relative;
    cursor: pointer;
    border-left: 1px solid #eee;
    width: 20px;
    text-align: center;
    color: #333;
    font-size: 13px;
    line-height: 1.7;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    line-height: 13px;
}

#pricingDetails .TeacherConference {
    position: relative;
    margin: 0 auto;
    width: 60px;
}

    #pricingDetails .TeacherConference input {
        width: 45px;
        height: 27px;
        line-height: 1.65;
        float: right;
        display: block;
        padding: 0;
        margin: 0;
        text-align: center;
        border: 1px solid #eee;
    }

.question .col-sm-1 {
    float: right;
}

.noticeText {
    float: right;
    padding-right: 40px;
}

.explore-more-link {
    cursor: pointer;
    font-weight: bold;
    color: #337ab7 !important;
}


@media (max-width: 1186px) {
    .options .card .card-header {
        padding: 10px 0px 10px 0px;
    }
}




/* ################################ Pricing body End ########################### */



/*  ---------------------  Pricing Page Start End    -----------------------*/

/*  ---------------------  FAQs Start      -----------------------*/

/* ################################  FAQs body Start ########################### */

.FAQContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.FAQBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.FAQHeaderContent {
    margin-top: 35px;
}

    .FAQHeaderContent + .container-fluid {
        padding: 0;
    }

    .FAQHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.FAQheading {
    margin: 10px 97px;
    text-align: center;
}

.FAQBodyContainer {
    padding: 0;
}

.FAQGridSection {
    float: left;
    padding: 0 25px 25px;
}

.FAQ {
    margin: 0 0 18px;
}

.FAQBodyContainer {
    text-align: right;
}

.orangeheading {
    width: 100%;
    text-align: center;
    background-color: #dda53b;
    padding: 15px 0;
    margin-top: 10px;
    margin: 0;
    color: #FFFFFF;
    font-size: 22px;
}

.FAQBodyContainer .panel {
    padding: 0;
}

   .FAQBodyContainer .panel .panel-body, #accordion .panel-body {
        background-color: #fff9f1;
        padding: 10px;
        border: 1px solid #ccc;
        border-top: 0;
    }

.FAQBodyContainer .accordion, #accordion .panel-heading {
    background-color: #eee;
    color: #444;
    cursor: pointer; 
    width: 100%;
    border: none;
    text-align: right;
    outline: none;
    font-size: 15px;
    transition: 0.4s;border: 1px solid #eee;
    margin-bottom: 2px;
}

.panel.panel-default {
margin-bottom:2px;
}
.panel-heading {
    position:relative;
}
.panel-heading .panel-title {
    width: 100%;
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}

    .panel-heading .panel-title a {
        display: block;
        font-size: 1.25rem;
        color: #444;
        padding: 18px;
    }
.FAQBodyContainer .active, .accordion:hover, #accordion .panel-heading:hover, #accordion .panel-heading.active {
    background-color: #6a3a1d;
    color: #FFFFFF;
}

.FAQBodyContainer .accordion:after, #accordion .panel-heading::after {
    content: '\002B';
    color: #777;
    font-weight: bold;
    float: left;
    position:absolute;
    top:18px;
    left:20px;
}

.FAQBodyContainer .active:after {
    content: "\2212";
    color: #FFFFFF;
}

.FAQBodyContainer .panel{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

#accordion .panel-heading:hover a, #accordion .panel-heading:hover::after, #accordion .panel-heading.active a {
    color:#FFF;
    }

/* ################################ FAQs body End ########################### */

/*  ---------------------  FAQs Page Start End    -----------------------*/


/*  ---------------------  Video Start      -----------------------*/

/* ################################  Video body Start ########################### */

.VideoContainer {
    background-color: #EAEAEA;
    padding-top: 13px !important;
    padding: 30px;
    float: left;
}

.VideoBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
    text-align: right;
}

.VideoHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .VideoHeaderContent span img {
        width: 30px;
        margin-top: 10px;
    }

.Videoheading {
    margin: 10px 97px;
    text-align: center;
}

.VideoBodyContainer {
}

.VideoBodyContainer {
    text-align: left;
}

.vidHeading i {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    margin: 0 0 0 10px;
}

.brick .col-lg-8 {
    text-align: right;
}

.lnkVid .thumbwrap {
    float: right;
}

.vidHeading {
    padding: 0 !important;
}

ul.youtubewall .video-main-wrapper .ar-desc ul {
    margin: 10px 29px !important;
}




/* ################################ Video body End ########################### */



/*  ---------------------  Video Page Start End    -----------------------*/



/* ################################  Header Start ########################### */

.HeaderBanner {
    position: absolute;
    top: 8px !important;
}

.HeaderDownloadLink {
    float: left;
    text-align: left;
    position: absolute;
    top: 78px;
    left: 0;
    z-index: 1;
}

    .HeaderDownloadLink a img {
        width: 173px;
    }

.BannerTagLine {
    background-color: rgba(45,185,154,0.60);
    color: #FFFFFF;
    text-align: center;
    position: absolute;
    top: 140px;
    height: 100px;
    display: table;
}

    .BannerTagLine h1 {
        font-size: 1.4rem;
        padding: 15px 0 15px 0;
        height: 100px;
        display: table-cell;
        vertical-align: middle;
        width: 100%;
        text-align: center;
    }

    .BannerTagLine p {
        font-size: 1rem;
        padding-bottom: 15px;
    }

@media (max-width:1280px) {




    .BannerTagLine h1 {
        font-size: 1.4rem;
    }

    .BannerTagLine p {
        font-size: 1rem;
    }
}


.HeaderFormContainer {
    margin-top: 10px;
}

.Headerform {
    float: left;
}

.inputHeaderBanner {
    background-color: rgba(255,255,255,0.20);
    padding: 10px;
    border: 1px solid;
    border-color: rgba(130,122,96,0.20);
    position: relative;
}

    .inputHeaderBanner input {
        border-radius: 0;
    }

    .inputHeaderBanner a {
        position: absolute;
        top: 12px;
        left: 22px;
        font-size: 28px;
        color: #6f4a00;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.Learnmenu {
}

.LearnPills {
    background-color: #FFFFFF;
    padding: 6px;
    border-radius: 6px;
    font-size: 1.2rem;
}

    .LearnPills a {
        color: #525252;
        padding: 0 1rem;
    }

        .LearnPills a span {
            float: right;
            font-size: 12px;
        }

    .LearnPills .active {
        background-color: #9AEAD8 !important;
    }

.dropIcon {
    position: absolute;
    margin-top: -27px;
    margin-left: 13px;
    font-size: 41px !important;
    color: white;
}

.mainSlider {
    z-index: -1;
}

    .mainSlider .carousel-item img {
        object-fit: cover;
        object-position: top;
    }



.HowLearnInput {
    padding: 13px;
    color: #443000;
}

.DownloadAppBtn {
    margin-bottom: 0 !important;
    border-radius: 0px;
    background-color: #F7EDA5;
    color: #000000;
    border: 1px solid #4A4A4A;
}


.carousel-control-prev, .carousel-control-next {
    z-index: 1;
}

.carousel-indicators li {
    width: 12px;
    height: 12px;
    border-radius: 14px;
}

.carousel-indicators .active {
    width: 14px;
    height: 14px;
}

.navbar.navbar-expand-lg + div {
    position: relative;
}

@media (min-width:600px) and (max-width: 1100px) {
    .HeaderBanner {
    }

    .InnerPageSearch {
        float: right
    }
}

    .InnerPageSearch {
        float: right
    }

@media (min-width:1401px) {
    .HeaderBanner {
    }
}


/* ################################  Header End ########################### */




/* ################################  Menu Start ########################### */

.menuContainer {
    background-color: #EAEAEA;
    padding-top: 25px;
    padding-bottom: 25px;
    float: left;
}

.MenuBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    border: 1px solid #95989A;
    padding-bottom: 200px;
    float: left;
}

.menuHeader span {
    float: left;
}

.Menuheading {
    margin: 10px 97px;
}

.headerContent {
    margin-top: 35px;
}

    .headerContent span img {
        width: 30px;
        margin-top: 10px;
    }

.tabsMenu {
    margin-top: 35px;
}

/* Tab Menu  Style Start */

a:hover, a:focus {
    text-decoration: none;
    outline: none;
}

.tab .nav-tabs {
    border-bottom: 0 none;
}

    .tab .nav-tabs li {
        margin-right: 10px;
    }

        .tab .nav-tabs li a {
            position: relative;
            padding: 15px 32px;
            color: #444;
            font-size: 17px;
            z-index: 1;
        }

            .tab .nav-tabs li a:hover {
                background: transparent;
                border: 1px solid transparent;
            }

            .tab .nav-tabs li a:before {
                content: "";
                width: 100%;
                height: 100%;
                position: absolute;
                bottom: 8px;
                left: -1px;
                font-size: 17px;
                background: #F4F4F4;
                border: 1px solid #d3d3d3;
                border-bottom: 0px none;
                transform-origin: left center 0;
                transform: perspective(4px) rotateX(2deg);
                z-index: -1;
            }

        .tab .nav-tabs li.active a:before {
            border: 2px solid #15A283;
            border-bottom: none;
        }

        .tab .nav-tabs li.active a, .tab .nav-tabs li.active a:focus, .tab .nav-tabs li.active a:hover {
            border: 1px solid transparent;
            background: transparent;
            color: #444;
            z-index: 2;
        }

.tab-content .tab-pane {
    border: 2px solid #15A283;
    padding: 50px;
    background: #F4F4F4;
    line-height: 22px;
}

    .tab-content .tab-pane h3 {
        margin-top: 0;
    }

@media only screen and (max-width: 767px) {
    .tab .nav-tabs li a {
        padding: 15px 10px;
        font-size: 14px;
    }

        .tab .nav-tabs li a:before {
            bottom: 6px;
        }
}

@media only screen and (max-width: 576px) {
    .tab .nav-tabs li {
        width: 100%;
        margin-bottom: 5px;
    }

        .tab .nav-tabs li a:before {
            bottom: 0;
            transform: none;
            border-bottom: 1px solid #d3d3d3;
        }

        .tab .nav-tabs li.active a:before {
            background-color: #15A283;
            border: none;
            color: #FFFFFF;
            text-align: center;
        }

    .HeaderDownloadLink {
        width: auto !important;
        text-align: right !important;
    }

        .HeaderDownloadLink img {
            height: 30px;
            width: 30px !important;
            object-fit: cover;
            object-position: left;
            border-radius: 5px;
            margin: 0 5px;
        }

        .HeaderDownloadLink a {
            display: inline-block;
            width: 30px;
            background: #000;
            padding: 0;
            height: 30px;
            border-radius: 5px;
            vertical-align: top
        }

            .HeaderDownloadLink a:last-child img {
                width: 22px !important;
                object-position: calc(100% + 9px) !important;
            }

    .inputHeaderBanner {
        margin-top: 30px !important;
        padding: 6px !important;
        position: static;
    }

    body .selector-box {
        height: 32px !important;
        width: calc(100% - 50px) !important;
        padding: 6px !important;
        font-size: 12px !important;
        font-weight: normal !important;
        white-space: nowrap
    }

    .selector-btn {
        height: 32px !important;
        width: 50px !important;
        padding: 5px 0px 9px 0px !important;
    }

    body .BannerTagLine {
        width: calc(100% - 30px);
        left: 15px;
        right: 15px;
        max-width: 100%;
        margin: 0;
        height: 60px !important;
        top: 90px;
    }

        body .BannerTagLine h1 {
            height: 60px !important;
            padding: 15px;
            font-size: 0.85rem !important;
        }

    .carousel-indicators {
        bottom: -10px !important;
    }

    .UniqueFeatureRight p a, a.ReadMore {
        margin-bottom: 30px;
    }

    #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField input {
        font-size: 13px
    }

    html, body {
        overflow-x: hidden;
    }
}

.tab-content {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*  Tab Menu Style End*/

/* ################################  Menu End ########################### */

/* ################################  Who We Are Start ########################### */

.WWAContainer {
    background-color: #EAEAEA;
    padding: 30px;
    float: left;
}

.WWABody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.WWAHeaderContent {
    margin-top: 30px;
    margin-bottom: 15px;
    justify-content: center;
    align-items: center;
}

    .WWAHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.WWAheading {
    margin: 10px 0px;
    padding: 0 10px;
    max-width: calc(100% - 80px);
}

.WWABodyContainer {
}

.WWAGridSection {
    float: left;
    padding: 25px 6%;
}

.WhoWeAreContent {
    float: right;
    text-align: justify;
}

.WhoWeAreImg {
    float: left;
}

    .WhoWeAreImg img {
        width: 100%;
    }



/* ################################  Who We Are End ########################### */


/* ################################  Certified Start ########################### */

.CertifiedContainer {
    background-color: #EAEAEA;
    padding-top: 50px !important;
    padding: 30px;
    float: left;
}

.CertifiedBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.CertifiedHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
    align-items: center;
    justify-content: center;
}

    .CertifiedHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.Certifiedheading {
    margin: 8px 0px;
    padding: 0 10px;
    max-width: calc(100% - 80px);
    text-align: center;
}

.Imgresponsive {
    max-width: 100%;
    height: auto;
    margin-top: -65px;
}

.CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
    float: right;
    text-align: center;
    /*padding: 60px;*/
    padding: 56px;
}

    .CertifiedTeachers p, .VarietyTeachers p, .AffordablePrices p {
        /*color: #2DB99A;*/
        text-align: justify;
    }


/* ################################  Certified End ########################### */

/* ################################  Learn Anywhere Start ########################### */

.LearnContainer {
    background-color: #EAEAEA;
    padding: 30px;
    padding-top: 0 !important;
    float: left;
}

.LearnBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.LearnHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .LearnHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.Learnheading {
    margin: 10px 97px;
}

.LearnBodyContainer {
}

.LearnGridSection {
    float: right;
}

.LearnGridSection2 {
    float: right;
    padding: 25px 6%;
}

    .LearnGridSection2 .FeaturesLeft {
        float: right;
        text-align: right;
        margin: 15px 0;
    }

    .LearnGridSection2 .FeaturesRight {
        float: left;
        text-align: left;
        margin: 15px 0;
    }

.FeaturesLeft .LearnGridIc img {
    width: 100%;
}

.FeaturesRight .LearnGridIc {
    float: left;
}

    .FeaturesRight .LearnGridIc img {
        width: 100%;
    }

.FeaturesLeft .LearnGridDesc {
    padding: 0 30px;
}

    .FeaturesLeft .LearnGridDesc p {
        text-align: justify;
    }

    .FeaturesLeft .LearnGridDesc .SoftwareSteps {
        text-align: justify;
    }

.FeaturesRight .LearnGridDesc {
    float: left;
}

    .FeaturesRight .LearnGridDesc p {
        text-align: justify;
    }

.LearnDesc {
    text-align: center;
    font-size: 20px;
}

.LearnGridIc {
    float: right;
    padding: 0;
}

.LearnGridDesc {
    float: right;
    padding: 0 30px;
}

    .LearnGridDesc h5 {
        font-size: 18px;
        text-align: right;
    }

        .LearnGridDesc h5 a {
            color: #15A283;
        }

    .LearnGridDesc p {
        font-size: 16px;
        color: #000;
    }

.with2Icons {
    margin-top: 100px;
}

.StudyAnywhere {
    float: right;
    margin-bottom: 30px;
}

.FlexibleModalClose {
    float: left;
    margin-left: 0 !important;
}

@media (min-width: 1500px) {
    .dontUseSkype .LearnGridDesc {
        padding: 70px 30px !important;
    }

    .onMobile {
        margin-top: -50px !important;
    }

        .onMobile .LearnGridDesc {
            padding: 80px 30px !important;
        }

    .TFclock {
        margin-top: -50px !important;
    }

        .TFclock .LearnGridDesc {
            padding: 0 30px !important;
        }

    .globe {
        margin-top: -10px !important;
    }

        .globe .LearnGridDesc {
            padding: 70px 30px !important;
        }

    .offlineSec {
        margin-top: -45px !important;
    }

        .offlineSec .LearnGridDesc {
            padding: 45px 30px !important;
        }

    .studySec {
        margin-top: -20px !important;
    }

        .studySec .LearnGridDesc {
            padding: 70px 30px !important;
        }
}

@media (min-width:768px) {

    .LearnGridSection2 {
        padding: 25px 20%;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 30px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 30px;
    }
}

/* ################################  Learn Anywhere End ########################### */

/* ################################  No Time Search Start ########################### */

.SearchContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.SearchBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.SearchHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .SearchHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.Searchheading {
    margin: 10px 97px;
}

.SearchBodyContainer {
    text-align: center;
}

.SearchDesc {
    text-align: center;
    font-size: 18px;
    margin-bottom: 35px;
}

.RequestBtn {
    border: 1px solid #000000;
    border-radius: 0;
    background-color: #F7EDA5;
    color: #000000;
    font-size: 14px;
    margin-bottom: 35px;
    padding: 10px 35px;
}

/* ################################  No Time Search End ########################### */

/* ################################  How Quran LMS Works Start ########################### */

.HowQuranLMSWorksContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.HowQuranLMSBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.HowQuranLMSHeaderContent {
    margin-top: 35px;
}

    .HowQuranLMSHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.HowQuranLMSheading {
    margin: 10px 86px;
}

.HowQuranLMSWorks {
    margin-bottom: 18px;
}

.HowQuranLMSBodyContainer {
    text-align: right;
    max-width: 100%;
}

    .HowQuranLMSBodyContainer .col-md-4 {
        float: right;
        margin-top: 25px;
    }

        .HowQuranLMSBodyContainer .col-md-4 img {
            padding: 10px 0;
            margin: 0 auto;
            display: block;
        }

        .HowQuranLMSBodyContainer .col-md-4 h4 {
            text-align: center;
        }


/* ################################  How Quran LMS Works End ########################### */

/* ################################  How Quran Works Start ########################### */

.HowQuranWorks {
    margin-bottom: 18px;
}

.HowQuranContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.HowQuranBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.HowQuranHeaderContent {
    margin-top: 35px;
}

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        margin-left: 14px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.HowQuranheading {
    margin: 10px 86px;
}

.HowQuranBodyContainer {
    text-align: center;
}

    .HowQuranBodyContainer .col-md-4 {
        float: left;
        margin-top: 25px;
    }

        .HowQuranBodyContainer .col-md-4 img {
            padding: 10px 0;
        }

    .HowQuranBodyContainer img {
        max-width: 100%;
        height: auto;
        margin-top: 30px;
    }

.HowQuranDesc {
    text-align: center;
    font-size: 18px;
    margin-bottom: 15px !important;
}

.HowQuranDownlad {
    background-image: url(../../images/InstallBg.png);
    background-size: cover;
    background-position: right;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 200px;
    position: absolute;
}

    .HowQuranDownlad p {
        padding: 10px 15px 10px 0;
    }

.LearnAbout {
    background-image: url(../../images/InstallBg.png);
    background-size: cover;
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px;
    width: 400px;
    position: absolute;
}

    .LearnAbout p {
        padding: 10px 15px 10px 15px;
    }

.FindTeacher {
    background-image: url(../../images/InstallBg-left.png);
    background-size: cover;
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 400px;
    position: absolute;
}

    .FindTeacher p {
        padding: 10px 0 10px 10px;
    }


.FindTeacherHoverContent {
    display: none;
    color: #000000;
    position: absolute;
    top: 0;
    right: 98%;
    background-color: rgba(247,237,165,0.90);
    padding: 10px;
    width: 398px;
    z-index: 5;
    border-radius: 8px;
    border: 1px solid #5a521c;
}

    .FindTeacherHoverContent p {
        text-align: right;
        padding: 10px;
    }

    .FindTeacherHoverContent ul {
        text-align: right;
        padding: 0 15px;
    }

.FindTeacher:hover .FindTeacherHoverContent {
    display: block;
    color: #000000;
}



.SlctPlan {
    background-image: url(../../images/InstallBg.png);
    background-size: cover;
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 165px;
    position: absolute;
}

    .SlctPlan p {
        padding: 10px 15px 10px 0;
    }

.YourStudy {
    background-image: url(../../images/InstallBg.png);
    background-size: cover;
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 287px;
    position: absolute;
}

    .YourStudy p {
        padding: 10px 30px 10px 5px;
    }

.AssignmentAppears {
    background-image: url(../../images/InstallBg-left.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 153px;
    position: absolute;
}

    .AssignmentAppears p {
        padding: 10px 0 10px 25px;
    }

.TeacherCorrect {
    background-image: url(../../images/InstallBg-left.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 178px;
    position: absolute;
}

    .TeacherCorrect p {
        padding: 10px 0 10px 15px;
    }

.ScheduleOnline {
    background-image: url(../../images/InstallBg-left.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 178px;
    position: absolute;
}

    .ScheduleOnline p {
        padding: 10px 0 10px 15px;
    }

.TeacherPrivate {
    background-image: url(../../images/InstallBg-left.png);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
    padding: 5px 10px;
    width: 165px;
    position: absolute;
}

    .TeacherPrivate p {
        padding: 10px 0 10px 15px;
        margin-bottom: 0;
    }



.flowMobile {
    display: none;
}

@media (max-width:350px) {

    .flowMobile {
        display: block;
    }

    .flowDesktop {
        display: none;
    }

    .HowQuranDownlad {
        display: none;
    }

    .LearnAbout {
        display: none;
    }

    .FindTeacher {
        display: none;
    }

    .SlctPlan {
        display: none;
    }

    .YourStudy {
        display: none;
    }

    .AssignmentAppears {
        display: none;
    }

    .TeacherCorrect {
        display: none;
    }

    .ScheduleOnline {
        display: none;
    }

    .TeacherPrivate {
        display: none;
    }
}

@media (min-width:351px) and (max-width:359px) {

    .flowMobile {
        display: block;
    }

    .flowDesktop {
        display: none;
    }

    .HowQuranDownlad {
        display: none;
    }

    .LearnAbout {
        display: none;
    }

    .FindTeacher {
        display: none;
    }

    .SlctPlan {
        display: none;
    }

    .YourStudy {
        display: none;
    }

    .AssignmentAppears {
        display: none;
    }

    .TeacherCorrect {
        display: none;
    }

    .ScheduleOnline {
        display: none;
    }

    .TeacherPrivate {
        display: none;
    }
}

@media (min-width:360px) and (max-width:374px) {

    .flowMobile {
        display: none;
    }

    .flowDesktop {
        width: 70%;
        margin-top: 0 !important;
    }

    .HowQuranDownlad {
        top: 16%;
        left: 16%;
        font-size: 7px;
        width: 95px;
    }

        .HowQuranDownlad p {
            padding: 5px 15px 5px 0;
        }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 143px;
        font-size: 7px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -14%;
        }

    .FindTeacher {
        top: 35%;
        right: 1%;
        width: 148px;
        font-size: 7px;
    }

        .FindTeacher p {
            padding: 5px 0 5px 10px;
        }

    .FindTeacherHoverContent {
        width: 210px;
        right: 63%;
    }

    .SlctPlan {
        top: 45%;
        left: 20%;
        font-size: 7px;
        width: 85px;
    }

        .SlctPlan p {
            padding: 5px 15px 5px 0;
        }

    .YourStudy {
        top: 61%;
        left: 0%;
        width: 88px;
        font-size: 7px;
    }

        .YourStudy p {
            padding: 5px 11px 5px 0px;
        }

    .AssignmentAppears {
        top: 66%;
        left: 33%;
        font-size: 7px;
        width: 80px;
    }

        .AssignmentAppears p {
            padding: 5px 0 5px 19px;
        }

    .TeacherCorrect {
        top: 83%;
        left: 33%;
        font-size: 7px;
        width: 100px;
    }

        .TeacherCorrect p {
            padding: 2px 0 3px 15px;
        }

    .ScheduleOnline {
        top: 66%;
        right: 2%;
        width: 75px;
        font-size: 7px;
    }

        .ScheduleOnline p {
            padding: 2px 0 2px 9px;
        }

    .TeacherPrivate {
        top: 76%;
        right: 1%;
        width: 79px;
        font-size: 7px;
    }

        .TeacherPrivate p {
            padding: 2px 0 2px 5px;
        }
}


@media (min-width:375px) and (max-width:399px) {

    .flowMobile {
        display: none;
    }

    .flowDesktop {
        width: 70%;
        margin-top: 0 !important;
    }

    .HowQuranDownlad {
        top: 16%;
        left: 16%;
        font-size: 7px;
        width: 95px;
    }

        .HowQuranDownlad p {
            padding: 5px 15px 5px 0;
        }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 143px;
        font-size: 7px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -59%;
        }

    .FindTeacher {
        top: 35%;
        right: 1%;
        width: 148px;
        font-size: 7px;
    }

        .FindTeacher p {
            padding: 5px 0 5px 10px;
        }

    .FindTeacherHoverContent {
        width: 210px;
        right: 63%;
    }

    .SlctPlan {
        top: 45%;
        left: 20%;
        font-size: 7px;
        width: 85px;
    }

        .SlctPlan p {
            padding: 5px 15px 5px 0;
        }

    .YourStudy {
        top: 65%;
        left: 0%;
        width: 88px;
        font-size: 7px;
    }

        .YourStudy p {
            padding: 5px 11px 5px 0px;
        }

    .AssignmentAppears {
        top: 67%;
        left: 33%;
        font-size: 7px;
        width: 80px;
    }

        .AssignmentAppears p {
            padding: 5px 0 5px 19px;
        }

    .TeacherCorrect {
        top: 83%;
        left: 33%;
        font-size: 7px;
        width: 100px;
    }

        .TeacherCorrect p {
            padding: 2px 0 3px 15px;
        }

    .ScheduleOnline {
        top: 67%;
        right: 2%;
        width: 75px;
        font-size: 7px;
    }

        .ScheduleOnline p {
            padding: 2px 0 2px 9px;
        }

    .TeacherPrivate {
        top: 76%;
        right: 1%;
        width: 79px;
        font-size: 7px;
    }

        .TeacherPrivate p {
            padding: 2px 0 2px 5px;
        }
}

@media (min-width:400px) and (max-width:414px) {

    .flowMobile {
        display: none;
    }

    .flowDesktop {
        width: 70%;
        margin-top: 0 !important;
    }

    .HowQuranDownlad {
        top: 15%;
        left: 17%;
        font-size: 7px;
        width: 95px;
    }

        .HowQuranDownlad p {
            padding: 5px 15px 5px 0;
        }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 157px;
        font-size: 7px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -62%;
        }

    .FindTeacher {
        top: 36%;
        right: 1%;
        width: 148px;
        font-size: 7px;
    }

        .FindTeacher p {
            padding: 5px 0 5px 10px;
        }

    .FindTeacherHoverContent {
        width: 210px;
    }

    .SlctPlan {
        top: 46%;
        left: 20%;
        font-size: 7px;
        width: 85px;
    }

        .SlctPlan p {
            padding: 5px 15px 5px 0;
        }

    .YourStudy {
        top: 68%;
        left: 0%;
        width: 88px;
        font-size: 7px;
    }

        .YourStudy p {
            padding: 5px 11px 5px 0px;
        }

    .AssignmentAppears {
        top: 69%;
        left: 33%;
        font-size: 7px;
        width: 80px;
    }

        .AssignmentAppears p {
            padding: 5px 0 5px 19px;
        }

    .TeacherCorrect {
        top: 87%;
        left: 33%;
        font-size: 7px;
        width: 100px;
    }

        .TeacherCorrect p {
            padding: 2px 0 3px 15px;
        }

    .ScheduleOnline {
        top: 70%;
        right: 3%;
        width: 75px;
        font-size: 7px;
    }

        .ScheduleOnline p {
            padding: 2px 0 2px 9px;
        }

    .TeacherPrivate {
        top: 81%;
        right: 2%;
        width: 79px;
        font-size: 7px;
    }

        .TeacherPrivate p {
            padding: 2px 0 2px 5px;
        }
}

@media (min-width:415px) and (max-width:500px) {


    .flowMobile {
        display: none;
    }

    .flowDesktop {
        width: 70%;
        margin-top: 0 !important;
    }

    .HowQuranDownlad {
        top: 15%;
        left: 17%;
        font-size: 7px;
        width: 95px;
    }

        .HowQuranDownlad p {
            padding: 5px 15px 5px 0;
        }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 157px;
        font-size: 7px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -65%;
        }

    .FindTeacher {
        top: 35%;
        right: 1%;
        width: 148px;
        font-size: 7px;
    }

        .FindTeacher p {
            padding: 5px 0 5px 10px;
        }

    .FindTeacherHoverContent {
        width: 210px;
    }

    .SlctPlan {
        top: 46%;
        left: 20%;
        font-size: 7px;
        width: 85px;
    }

        .SlctPlan p {
            padding: 5px 15px 5px 0;
        }

    .YourStudy {
        top: 68%;
        left: 0%;
        width: 88px;
        font-size: 7px;
    }

        .YourStudy p {
            padding: 5px 11px 5px 0px;
        }

    .AssignmentAppears {
        top: 69%;
        left: 33%;
        font-size: 7px;
        width: 80px;
    }

        .AssignmentAppears p {
            padding: 5px 0 5px 19px;
        }

    .TeacherCorrect {
        top: 87%;
        left: 33%;
        font-size: 7px;
        width: 100px;
    }

        .TeacherCorrect p {
            padding: 2px 0 3px 15px;
        }

    .ScheduleOnline {
        top: 70%;
        right: 3%;
        width: 75px;
        font-size: 7px;
    }

        .ScheduleOnline p {
            padding: 2px 0 2px 9px;
        }

    .TeacherPrivate {
        top: 81%;
        right: 2%;
        width: 79px;
        font-size: 7px;
    }

        .TeacherPrivate p {
            padding: 2px 0 2px 5px;
        }
}

@media (min-width:501px) and (max-width:549px) {

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 9%;
        font-size: 10px;
        width: 150px;
    }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 221px;
        font-size: 10px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 1%;
        width: 213px;
        font-size: 10px;
    }

    .FindTeacherHoverContent {
        width: 300px;
    }

    .SlctPlan {
        top: 46%;
        left: 12%;
        font-size: 10px;
    }

    .YourStudy {
        display: none;
    }

    .AssignmentAppears {
        top: 65%;
        left: 21%;
        font-size: 10px;
        width: 115px;
    }

        .AssignmentAppears p {
            padding: 10px 0 10px 19px;
        }

    .TeacherCorrect {
        top: 85%;
        left: 25%;
        font-size: 10px;
    }

    .ScheduleOnline {
        top: 70%;
        right: 28%;
        width: 108px;
        font-size: 10px;
        background-image: url(../../images/InstallBg.png);
        background-position: right;
        background-repeat: no-repeat;
        background-size: cover;
    }

        .ScheduleOnline p {
            padding: 10px 15px 10px 0;
        }

    .TeacherPrivate {
        top: 78%;
        right: 24%;
        font-size: 10px;
        background-image: url(../../images/InstallBg.png);
        background-position: right;
        background-repeat: no-repeat;
        background-size: cover;
    }

        .TeacherPrivate p {
            padding: 10px 15px 10px 0;
        }
}

@media (min-width:550px) and (max-width:576px) {

    .HowQuranheading {
        width: 472px !important;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
        width: 70%;
        margin-top: 0 !important;
    }

    .HowQuranDownlad {
        top: 13%;
        left: 9%;
        font-size: 10px;
        width: 150px;
    }

    .LearnAbout {
        top: 26%;
        left: 0.5%;
        width: 221px;
        font-size: 10px;
    }

        .LearnAbout p {
            padding: 5px 15px 6px 5px;
        }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -76%;
        }

    .FindTeacher {
        top: 35%;
        right: 1%;
        width: 213px;
        font-size: 10px;
    }

    .FindTeacherHoverContent {
        width: 300px;
    }

    .SlctPlan {
        top: 46%;
        left: 12%;
        font-size: 10px;
    }

    .YourStudy {
        display: none;
    }

    .AssignmentAppears {
        top: 67%;
        left: 32%;
        font-size: 10px;
        width: 115px;
    }

        .AssignmentAppears p {
            padding: 10px 0 10px 19px;
        }

    .TeacherCorrect {
        top: 88%;
        left: 32%;
        font-size: 10px;
    }

    .ScheduleOnline {
        top: 68%;
        right: 3%;
        width: 108px;
        font-size: 10px;
    }

        .ScheduleOnline p {
            padding: 10px 0 10px 15px;
        }

    .TeacherPrivate {
        top: 79%;
        right: 32%;
        font-size: 10px;
        background-image: url(../../images/InstallBg.png);
        background-position: right;
        background-repeat: no-repeat;
        background-size: cover;
    }

        .TeacherPrivate p {
            padding: 10px 15px 10px 0;
        }
}

@media (min-width:577px) and (max-width:768px) {

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 24%;
        font-size: 10px;
        width: 150px;
    }

    .LearnAbout {
        top: 26%;
        left: 3%;
        width: 295px;
        font-size: 10px;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 7%;
        width: 265px;
        font-size: 10px;
    }

    .FindTeacherHoverContent {
        width: 300px;
    }

    .SlctPlan {
        top: 46%;
        left: 22%;
        font-size: 10px;
    }

    .YourStudy {
        top: 68%;
        left: 0%;
        width: 174px;
        font-size: 10px;
    }

        .YourStudy p {
            padding: 10px 12px 10px 5px;
        }

    .AssignmentAppears {
        top: 69%;
        left: 34%;
        font-size: 10px;
    }

    .TeacherCorrect {
        top: 88%;
        left: 35%;
        font-size: 10px;
    }

    .ScheduleOnline {
        top: 70%;
        right: 8%;
        width: 108px;
        font-size: 10px;
    }

    .TeacherPrivate {
        top: 81%;
        right: 1%;
        font-size: 10px;
    }
}

@media (min-width:769px) and (max-width:800px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            font-size: 24px;
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 25%;
        font-size: 12px;
        width: 150px;
    }

    .LearnAbout {
        top: 26%;
        left: 4%;
        width: 295px;
        font-size: 12px;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 8%;
        width: 265px;
        font-size: 12px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 22%;
        font-size: 12px;
    }

    .YourStudy {
        top: 68%;
        left: 0%;
        width: 194px;
        font-size: 12px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 35%;
        font-size: 12px;
    }

    .TeacherCorrect {
        top: 88%;
        left: 34%;
        font-size: 12px;
    }

    .ScheduleOnline {
        top: 70%;
        right: 1%;
        font-size: 12px;
    }

    .TeacherPrivate {
        top: 81%;
        right: 3%;
        font-size: 12px;
    }
}

@media (min-width:801px) and (max-width:992px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            font-size: 24px;
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 25%;
    }

    .LearnAbout {
        top: 26%;
        left: 4%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 18%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 29%;
    }

    .YourStudy {
        top: 69%;
        left: 7%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 38%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 38%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 12%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 13%;
    }
}

@media (min-width:993px) and (max-width:1024px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 25%;
    }

    .LearnAbout {
        top: 26%;
        left: 4%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 18%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 29%;
    }

    .YourStudy {
        top: 69%;
        left: 7%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 38%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 38%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 12%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 13%;
    }
}

@media (min-width:1025px) and (max-width:1280px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 30%;
    }

    .LearnAbout {
        top: 26%;
        left: 13%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 24%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 33%;
    }

    .YourStudy {
        top: 69%;
        left: 15%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 41%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 41%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 20%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 21%;
    }
}

@media (min-width:1281px) and (max-width:1366px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 14px;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 31%;
    }

    .LearnAbout {
        top: 26%;
        left: 16%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 26%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 34%;
    }

    .YourStudy {
        top: 69%;
        left: 18%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 42%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 42%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 22%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 23%;
    }
}


@media (min-width:1367px) and (max-width:1440px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 32%;
    }

    .LearnAbout {
        top: 26%;
        left: 17%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 27%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 35%;
    }

    .YourStudy {
        top: 69%;
        left: 19%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 42%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 42%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 23%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 24%;
    }
}

@media (min-width:1441px) and (max-width:1650px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 32%;
    }

    .LearnAbout {
        top: 26%;
        left: 17%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 27%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 35%;
    }

    .YourStudy {
        top: 69%;
        left: 19%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 42%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 42%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 23%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 24%;
    }
}

@media (min-width:1651px) and (max-width:1920px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 14px;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 37%;
    }

    .LearnAbout {
        top: 26%;
        left: 26%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 33%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 39%;
    }

    .YourStudy {
        top: 69%;
        left: 27%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 44%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 44%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 30%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 31%;
    }
}

@media (min-width:1921px) {
    .HowQuranheading {
        margin: 10px 86px;
    }

        .HowQuranheading h2 {
            text-align: center;
        }

    .HowQuranBodyContainer img {
        margin-top: 0;
    }

    .HowQuranHeaderContent span img {
        width: 30px;
        margin-top: 0;
        margin-left: 7px;
    }

    .flowMobile {
        display: none;
    }

    .flowDesktop {
    }

    .HowQuranDownlad {
        top: 13%;
        left: 37%;
    }

    .LearnAbout {
        top: 26%;
        left: 26%;
    }

        .LearnAbout img {
            position: absolute;
            width: 20%;
            left: -7%;
            top: -30%;
        }

    .FindTeacher {
        top: 35%;
        right: 33%;
        width: 265px;
    }

        .FindTeacher p {
            padding: 10px 0px 10px 32px;
        }

    .SlctPlan {
        top: 46%;
        left: 39%;
    }

    .YourStudy {
        top: 69%;
        left: 27%;
        width: 229px;
    }

    .AssignmentAppears {
        top: 69%;
        left: 44%;
    }

    .TeacherCorrect {
        top: 88%;
        left: 44%;
    }

    .ScheduleOnline {
        top: 70%;
        right: 30%;
    }

    .TeacherPrivate {
        top: 81%;
        right: 31%;
    }
}



/* ################################ How Quran Works End ########################### */

/* ################################ Become a Teacher Start ########################### */

.BecomeTeacherContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.BecomeTeacherBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.BecomeTeacherHeaderContent {
    margin-top: 35px;
}

    .BecomeTeacherHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.BecomeTeacherheading {
    margin: 10px 97px;
}

.BecomeTeacherBodyContainer {
    text-align: center;
    margin-top: 50px;
}

.BecomeTeacherDesc {
    text-align: center;
    font-size: 18px;
}

.BecomeTeacherTimeLine {
    margin-top: 30px;
    margin-bottom: 70px;
}

.timeline {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

    .timeline::after {
        content: '';
        position: absolute;
        width: 12px;
        background-image: url(../../images/timelineBg.png);
        background-repeat: repeat-y;
        top: 0;
        bottom: 0;
        right: 50%;
        margin-right: -3px;
    }

.BecomeTeacherContent {
    padding: 10px 40px;
    position: relative;
    background-color: inherit;
    width: 24%;
}

    .BecomeTeacherContent::after {
        content: '';
        position: absolute;
        width: 25px;
        height: 25px;
        left: -20px;
        background-color: white;
        border: 4px solid #33B5A2;
        top: 15px;
        border-radius: 50%;
        z-index: 1;
    }

.Contentleft {
    right: 284px;
}

.Contentright {
    right: 50%;
}

.Contentleft::before {
    content: " ";
    height: 0;
    position: absolute;
    top: 19px;
    width: 0;
    z-index: 1;
    left: 10px;
    border: medium solid #33B5A2;
    border-width: 10px 10px 10px 0;
    border-color: transparent #33B5A2 transparent transparent;
}

.Contentright::before {
    content: " ";
    height: 0;
    position: absolute;
    top: 18px;
    width: 0;
    z-index: 1;
    right: 24px;
    border: medium solid #33B5A2;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #33B5A2;
}

.Contentright::after {
    right: -9px;
}

.BecomeTeacherContent .content {
    padding: 20px 30px;
    background-color: white;
    position: relative;
    border-radius: 6px;
}

.AlignLg {
    margin-left: -36px;
}

.ContentRightAlign {
    text-align: center;
    padding: 0 !important;
    background: none !important;
}

    .ContentRightAlign .BuildYourProfile {
        background-color: #33B5A2;
        color: #FFFFFF;
        border-radius: 7px;
        border: 1px solid #000000;
    }

    .ContentRightAlign .SearchNewStudents {
        background-color: #33B5A2;
        color: #FFFFFF;
        border-radius: 7px;
        border: 1px solid #000000;
    }

    .ContentRightAlign .StartEarn {
        background-color: #33B5A2;
        color: #FFFFFF;
        border-radius: 7px;
        border: 1px solid #000000;
    }

    .ContentRightAlign p {
        margin-top: 10px;
    }

    .ContentRightAlign .LastBtnText {
    }

.BecomeTeacherBtn {
    text-align: center;
}

.BecomeTeacherRequestBtn {
    border: 1px solid #000000;
    border-radius: 0;
    background-color: #F7EDA5;
    color: #000000;
    font-size: 14px;
    padding: 10px 35px;
    margin-top: 35px;
    margin-bottom: 35px;
}

@media screen and (max-width: 600px) {

    .BecomeTeacherContent::after {
        left: 21px !important;
    }

    .ContentRightAlign {
        text-align: right;
    }

    .Contentleft {
        right: 0;
    }

    .timeline::after {
        right: 31px;
    }

    .BecomeTeacherContent {
        width: 100%;
        padding-right: 70px;
        padding-left: 25px;
    }

        .BecomeTeacherContent::before {
            right: 60px;
            border: medium solid #33B5A2;
            border-width: 10px 0 10px 10px;
            border-color: transparent transparent transparent #33B5A2;
        }

    .Contentleft::after, .Contentright::after {
        right: 15px;
    }

    .Contentright {
        right: 0%;
    }

    .AlignLg {
        margin-left: 0;
    }
}

@media (min-width:601px) and (max-width:1024px) {
    .Contentleft {
        right: 239px;
    }
}


/* ################################  Become a Teacher End ########################### */

/* ################################ Join Us Arabic Teacher Start ########################### */

.ArabicTeacherContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.ArabicTeacherBody {
    padding: 0;
    background-image: url(../../images/quraan-holding.jpg);
    border-radius: 5px;
    float: right;
    background-position: left;
    background-size: contain;
    background-repeat: no-repeat;
}

.ArabicTeacherLeft {
    background-color: #FFFFFF;
    float: right;
    padding-bottom: 0 !important;
    padding: 50px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

    .ArabicTeacherLeft h2 {
        text-align: right;
    }

    .ArabicTeacherLeft p, .ArabicTeacherLeft span {
        font-size: 20px;
        text-align: right;
    }

    .ArabicTeacherLeft span {
        margin-right: 15px;
    }

        .ArabicTeacherLeft p i, .ArabicTeacherLeft span i {
            color: #33b5a2;
        }

.ArabicTeacherDesc {
    padding-left: 17%;
}

.ArabicTeacherRight {
    float: right;
    text-align: left;
    padding-left: 0;
    position: relative;
    left: -0.9%;
}

    .ArabicTeacherRight img {
        width: 800px;
        height: 500px;
    }

.ArabicTeacherDetails {
    margin-bottom: 15px;
}

    .ArabicTeacherDetails h5 {
        text-align: right;
    }

        .ArabicTeacherDetails h5 i {
            color: #33b5a2;
        }

    .ArabicTeacherDetails p {
        margin-bottom: 0;
        margin-right: 35px;
        margin-top: -6px;
        font-size: 16px;
    }

.EarnMoneySignUp {
    background-color: #FFFFFF;
    text-align: center;
    padding: 18px 45px;
    border: 1px solid #000000;
}

    .EarnMoneySignUp h3 {
        padding: 10px;
    }

.EarnMoneyInput {
    padding: 10px 0;
}

    .EarnMoneyInput .col-md-6 input {
        border-radius: 0;
        padding: 10px 5px;
    }

.BecomeTeacherRequestBtn {
    float: right;
}

.BecomeTeacherInfo {
    float: right;
    margin-top: 42px;
}

.SignUpEmailBtn {
    width: 100%;
    background-color: #33b5a2;
    border: none;
    border-radius: 0;
    padding: 10px 0px;
    margin-bottom: 10px;
}

.SignUpFbBtn {
    width: 100%;
    background-color: #FFFFFF;
    color: #2d5192;
    border-color: #2d5192;
    border-radius: 0;
    padding: 10px 0px;
    margin-top: 10px;
}

tooltip {
    background-color: #000000;
}

@media (min-width: 1600px) {
    .EarnMoney {
        position: absolute;
        top: 30px;
        right: -24%;
    }
}

@media (min-width: 1200px) and (max-width: 1599px) {
    .EarnMoney {
        position: absolute;
        top: 0px;
        right: 0%;
        padding: 5px;
    }

    .EarnMoneySignUp {
        padding: 5px 20px;
    }
}

/* ################################  Join Us Arabic Teacher End ########################### */

/* ################################  Join Quran Start ########################### */

.JoinQuranContainer {
    background-color: #EAEAEA;
    padding-top: 0 !important;
    padding: 30px;
    float: left;
}

.JoinQuranBody {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding-bottom: 20px;
    float: left;
}

.JoinQuranHeaderContent {
    margin-top: 35px;
    margin-bottom: 35px;
}

    .JoinQuranHeaderContent span img {
        width: 30px;
        margin-top: 10px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }

.JoinQuranheading {
    margin: 10px 97px;
}

.JoinQuranBodyContainer {
    text-align: center;
}

.JoinQuranDesc {
    text-align: center;
    font-size: 18px;
}

.JoinQuranRequestBtn {
    border: 1px solid #000000;
    border-radius: 0;
    background-color: #F7EDA5;
    color: #000000;
    font-size: 14px;
    padding: 10px 35px;
    margin-top: 35px;
    margin-bottom: 35px;
}

/* ################################  Join Quran End ########################### */

/* ################################ Footer Start ########################### */

.FooterContainer {
    background-color: #eaeaea;
    padding-top: 0 !important;
    padding: 10px;
    float: left;
    direction:rtl;
}

.FooterBody {
    background-color: #eaeaea;
    float: left !important;
    margin-bottom: 10px;
}

.FooterContent {
    font-size: 13px;
}

.FooterLink {

}

.not-visible {
    visibility:hidden;
}


.FooterContent {
    float: left;
}

.FooterAbout {
    float: right;
    text-align: center;
    min-width:200px;
}

    .FooterAbout img {
    }

.FooterContentLeft {
    float: left;
}

.footerLogo {
    float: right;
}

.footerDesc {
    float: right;
    padding: 0;
    text-align: justify;
    font-size: 12px;
}

.FooterInfo {
    float: right;
}

    .FooterInfo b {
    }

    .FooterInfo .col-md-12 .col-md-6 {
        float: right;
        padding: 0;
    }

        .FooterInfo .col-md-12 .col-md-6 a {
            width: 100%;
            float: right;
            color: #5a5a5a;
        }

            .FooterInfo .col-md-12 .col-md-6 a:hover {
                color: #33b5a2;
            }

.FooterLinks {
    float: right;
    text-align: right;
    padding: 0;
    margin-top: 10px;
}

.contactInfo {
    float: right;
}

.FooterContact {
    padding: 0;
    margin-top: 34px;
}

    .FooterContact p {
        color: #5a5a5a;
        border-bottom: 0.75px solid #dbdbdb;
        padding-bottom: 0px;
        width: 100%;
        text-align: right;
        margin-bottom: 5px;
    }

.FooterNewsLetter {
    float: right;
}

.img-icon {
    width: 155px;
    margin: 0 0 15px;
}
    .img-icon + span.MainBodyheading {
        max-width: 690px;
        margin: 0;
    }
.FooterBottom {
    float: right;
    text-align:center;
    margin-top: 36px;
}

    .FooterBottom p {
        margin-bottom: 0;
        font-size: 13px;
    }

.FooterContentRight {
    text-align: right;
}

    .FooterContentRight a i {
        padding: 0 10px;
        font-size: 22px;
        color: #5a5a5a;
    }

        .FooterContentRight a i:hover {
            color: #33b5a2;
        }

/* ################################  Footer End ########################### */

/* ################################  Submit a Request Popup Start ########################### */

.SubmitRequestBody {
}
    /*.SubmitRequest{background-color:rgba(0,0,0,0.50) !important;}*/
    .SubmitRequestBody b {
        text-align: center;
    }

.LessonToggle .active {
    background-color: green !important;
}

.SubmitRequestForm .form-group label i {
    color: red;
}

.SubmitRequestForm .row label {
    float: left;
}

.PopupSaveBtn {
    text-align: right;
}

.studentData {
    text-align: center;
    font-size: 14px;
    margin-top: 25px;
}

.RespondAlert {
    font-size: 14px;
}

.RequiredIcon {
    font-size: 12px;
}

/* Price Range Slider Start */

slidecontainer {
    width: 100%;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 5px;
    background: #d3d3d3;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

    .slider:hover {
    }

    .slider::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 25px;
        height: 25px;
        border-radius: 50%;
        background: #4CAF50;
        cursor: pointer;
    }

    .slider::-moz-range-thumb {
        width: 25px;
        height: 25px;
        border-radius: 50%;
        background: #4CAF50;
        cursor: pointer;
    }

/* Price Range Slider End */

.SubmitReqSubHeading {
    font-weight: bold;
    text-align: right;
}
#spResultBox{width:100%;}
.right_col #EditProfilePage .container{width:100%;padding:0 15px;max-width:100% !important;}

.nav-sm .container.body .right_col {
    width: calc(100% - 80px) !important;
}
#sec1 .marginBottom.padding {
padding-bottom:15px !important;}
#sec1 .marginBottom.padding::after {
    content: "";
    display: block;
    clear: both
}
.heading-experience, .heading-education{text-align:right;margin-bottom:15px;}
#ddlFCView{height:30px;padding:0;border-radius:0;margin-bottom:10px;}
.profile-main-courses-schedule{padding:0;}
#calendar{margin:20px 0 !important;}
/* ################################  Submit a Request Popup End ########################### */
@media (max-width: 576px) {
    .QuranNav {
        z-index: 9999;
    }

    .mainSlider .carousel-item img {
        height: auto;
    }

    .HeaderBanner {
        top: 30%;
    }

    .HeaderFormContainer {
        margin-top: 0px;
    }

    .Headerform {
        margin-top: 15px;
    }

    .HeaderDownloadLink {
        float: left;
        margin-top: 0px;
    }

        .HeaderDownloadLink a img {
            width:26px !important;
        }
    #rev_slider_1_1_wrapper #rev_slider_1_1 .uranus.tparrows, #rev_slider_1_1_wrapper .tp-rightarrow.tparrows.uranus{width:22px !important;height:22px !important;top:70% !important;display:none;}
        #rev_slider_1_1_wrapper #rev_slider_1_1:hover .uranus.tparrows, #rev_slider_1_1_wrapper .tp-rightarrow.tparrows.uranus{display:block;}
        .navbar-nav.mr-auto.LeftMainMenu li:nth-child(3), .navbar-nav.mr-auto.LeftMainMenu li:nth-child(4) {
            width: 100%;
            display: block;
            text-align: right
        }
    .BannerTagLine {
        width: calc(100% - 40px);
        left: 20px;
        right: 20px;
    }

        .BannerTagLine h1 {
            font-size: 1rem;
        }


    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 20px;
    }

    .Learnheading {
        margin: 0;
    }

    .Searchheading {
        margin: 0;
    }

    .HeaderDownloadLink {
        text-align: center;
    }

    .EarnMoney {
        position: absolute;
        top: 10px;
        left: 0;
    }
}

@media (min-width: 768px) {

    .Headerform {
        width: 45% !important;
        margin: 0 2%;
    }

    .BannerTagLine {
        width: 50%;
        margin-right: 25%;
    }

    .InnerPageSearch {
        width: 49%;
    }

    .HeaderFormContainer {
        width: 50%;
    }

    .SearchBodyContainer {
        width: 40%;
    }

    .BecomeTeacherBodyContainer {
        width: 39%;
    }

    .JoinQuranBodyContainer {
        width: 40%;
    }

    .nav-separator {
        border-left: 1px solid #e9e5ca;
    }

    .CustomDropMenu .col-md-2 .lastMenu {
        border: none;
    }
}

@media (max-width:1250px) {
    .RegisterForCourses_wrapper_BottomArea .col-lg-2.col-md-2.col-sm-2.col-xs-2 {
        width: 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .mainContainerSearchCourse, .RegisterForCourses_wrapper_BottomArea .col-lg-10.col-md-10.col-sm-10.col-xs-10 {
        width: 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    table.table-courses-offered thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    table.table-courses-offered td {
        border-bottom: 1px solid #ddd;
        display: block;
        font-size: .8em;
        text-align: left;
    }

        table.table-courses-offered td::before {
            content: attr(data-label);
            float: left;
            font-weight: bold;
            text-transform: uppercase;
            left: 0px;
            width: 100%;
            text-align: right;
            padding-right: 0px;
            font-weight: bold;
            white-space: nowrap;
            font-size: .8em;
            text-transform: uppercase;
            padding: 8px 5px;
            background-color: #8fe9d8;
            margin-bottom:7px;
        }

    .table-courses-offered-container {
        max-height: unset !important;
    }
}
@media (min-width:576px) and (max-width:600px) {

    .JoinQuranheading {
        margin: 10px 86px;
    }

        .JoinQuranheading h2 {
            font-size: 28px;
            text-align: center;
        }

    .BecomeTeacherheading {
        margin: 10px 54px;
    }

        .BecomeTeacherheading h2 {
            font-size: 28px;
            text-align: center;
        }



    .Searchheading {
        margin: 10px 110px;
    }

        .Searchheading h2 {
            font-size: 28px;
            text-align: center;
        }

    .Learnheading {
        margin: 10px 20px;
        width: 81%;
    }

        .Learnheading h2 {
            font-size: 28px;
            text-align: center;
        }

    .Menuheading {
        margin: 10px 205px;
    }

        .Menuheading h2 {
            font-size: 28px;
            text-align: center;
        }
}

@media (min-width:480px) and (max-width:575px) {

    .JoinQuranheading {
        margin: 10px 61px;
    }

        .JoinQuranheading h2 {
            font-size: 24px;
            text-align: center;
        }

    .BecomeTeacherheading {
        margin: 10px 33px;
    }

        .BecomeTeacherheading h2 {
            font-size: 24px;
            text-align: center;
        }


    .Searchheading {
        margin: 10px 82px;
    }

        .Searchheading h2 {
            font-size: 24px;
            text-align: center;
        }

    .Learnheading {
        margin: 10px 20px;
        width: 77%;
    }

        .Learnheading h2 {
            font-size: 24px;
            text-align: center;
        }

    .Menuheading {
        margin: 10px 162px;
    }

        .Menuheading h2 {
            font-size: 24px;
            text-align: center;
        }
}

@media (min-width:400px) and (max-width:479px) {

    .JoinQuranheading {
        margin: 10px 29px;
    }

        .JoinQuranheading h2 {
            font-size: 22px;
            text-align: center;
        }

    .BecomeTeacherheading {
        margin: 10px 12px;
    }

        .BecomeTeacherheading h2 {
            font-size: 22px;
            text-align: center;
        }



    .Searchheading {
        margin: 10px 51px;
    }

        .Searchheading h2 {
            font-size: 22px;
            text-align: center;
        }

    .Learnheading {
        margin: 10px 20px;
        width: 70%;
    }

        .Learnheading h2 {
            font-size: 22px;
            text-align: center;
        }

    .Menuheading {
        margin: 10px 124px;
    }

        .Menuheading h2 {
            font-size: 22px;
            text-align: center;
        }
}



@media (min-width:1280px) and (max-height:768px) {
    .HeaderBanner {
        top: 45%;
    }
}


@media (min-width:1280px) and (max-width:1366px) and (max-height:660px) {
    .HeaderBanner {
        top: 31%;
    }
}
@media screen and (max-width:1100px) and (min-width:992px){
    .LangChanger{margin-left:196px !important;}
    .loginNav, .signUpNav{font-size:13px;padding:5px 10px}
}
@media (min-width:611px) and (max-width:768px) {


    .BannerTagLine {
        width: 70%;
        margin-right: 15%;
    }

    .HeaderBanner {
        top: 31%;
    }

    .HeaderFormContainer {
        width: 70%;
    }

    .WWAContainer {
        padding: 20px;
    }

    .WWAheading {
        margin: 0;
        padding: 0 10px;
        max-width: calc(100% - 80px);
        text-align: center;
    }

    .LearnGridSection2 {
        padding: 0;
    }

    .LearnContainer {
        padding: 20px;
    }

    .Learnheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .CertifiedContainer {
        padding: 20px;
    }

    .Certifiedheading {
        margin: 0;
        padding: 0 10px;
        max-width: calc(100% - 68px);
        text-align: center;
    }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 15px;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 16px;
        }

        .CertifiedTeachers p, .VarietyTeachers p, .AffordablePrices p {
            font-size: 12px;
        }

    .SearchContainer {
        padding: 20px;
    }

    .Searchheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .SearchBodyContainer {
        width: 65%;
    }

    .HowQuranLMSWorksContainer {
        padding: 20px;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .HowQuranContainer {
        padding: 20px;
    }

    .HowQuranheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .BecomeTeacherBodyContainer {
        width: 65%;
    }

    .Contentleft {
        left: 97px;
    }

    .BecomeTeacherContent {
        width: 35%;
    }

    .JoinQuranContainer {
        padding: 20px;
    }

    .JoinQuranheading {
        margin: 0;
        width: 611px;
        text-align: center;
    }

    .JoinQuranBodyContainer {
        width: 75%;
    }

    


    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 33%;
        padding: 10px;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 22px;
        }

    .TajweedDetails {
        padding: 0 50px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 22px;
        }

    .ArabicGridSection {
        padding: 0px;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 15px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 22px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 0 15px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 18px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 20px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 18px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 9.8 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 22px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 18px;
    }
}

@media (min-width:576px) and (max-width:610px) {



    .BannerTagLine {
        max-width: 100%;
    }

    .HeaderBanner {
        top: 26%;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        padding: 0 10px;
        margin: 0;
        max-width: calc(100% - 68px);
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 22px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 35%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 22px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        padding: 0 10px;
        max-width: calc(100% - 68px);
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 22px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 22px;
        }

    .RequestBtn {
        width: 50%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 22px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 22px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 22px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 50%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 22px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 22px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }

    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 33%;
        padding: 10px;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 22px;
        }

    .TajweedDetails {
        padding: 0 50px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 22px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 15px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 22px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 0 10px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 15px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 22px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 16px;
    }

    .FAQBodyContainer {
        padding: 0 15px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 18px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 20px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 18px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 6.8 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 22px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 18px;
    }
}




@media (min-width:501px) and (max-width:575px) {

    .HeaderBanner {
        top: 26%;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 20px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 100%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 20px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 20px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 20px;
        }

    .RequestBtn {
        width: 100%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 20px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 20px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 20px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 100%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 20px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 500px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 20px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }

    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 33%;
        padding: 10px;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 22px;
        }

    .TajweedDetails {
        padding: 0 50px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 22px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 22px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 0 10px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 15px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 22px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 16px;
    }

    .FAQBodyContainer {
        padding: 0 15px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 16px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 18px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 16px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 5.8 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 22px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 18px;
    }
}


@media (min-width:421px) and (max-width:500px) {




    .HeaderBanner {
        top: 26%;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        margin: 0;
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 16px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 100%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 16px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 16px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 16px;
        }

    .RequestBtn {
        width: 100%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 16px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 100%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 20px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 16px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }

    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 48%;
        padding: 10px;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 22px;
        }

    .TajweedDetails {
        padding: 0 10px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 22px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 22px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 0 10px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 22px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 16px;
    }

    .FAQBodyContainer {
        padding: 0 7px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 14px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 16px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 14px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 4.5 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 22px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 16px;
    }
}


@media (min-width:401px) and (max-width:420px) {



    .HeaderBanner {
        top: 26%;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 16px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 100%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 16px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 16px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 16px;
        }

    .RequestBtn {
        width: 100%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 340px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 16px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 100%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 20px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 339px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 16px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }

    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 48%;
        padding: 10px;
    }

    .separatorNav {
        margin: 0 2px !important;
    }

    .LangChanger {
        padding: 0;
    }




    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 22px;
        }

    .TajweedDetails {
        padding: 0 8px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 16px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 18px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 0 10px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 16px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 18px;
    }

    .FAQBodyContainer {
        padding: 0 7px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 14px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 12px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 4.1 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 16px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }
}


@media (min-width:360px) and (max-width:400px) {
    .HeaderBanner {
        top: 30%;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 16px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 100%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 16px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 16px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
        top: 50px;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 16px;
        }

    .RequestBtn {
        width: 100%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 16px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 100%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 20px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 288px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 16px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }


    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 22px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 48%;
        padding: 10px;
    }

    .separatorNav {
        margin: 0 15px !important;
    }

    .LangChanger {
        padding: 0;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 16px;
        }

    .TajweedDetails {
        padding: 0 5px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 16px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 18px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 5px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 16px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 16px;
    }

    .FAQBodyContainer {
        padding: 0 7px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }


    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 14px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 12px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 3.7 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 16px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }
}

@media (min-width:992px) {
    .quran-logo {
        position: relative;
        right: calc(50% - 65px);
        z-index: 999999;
    }

    .login-btns {
        position: absolute;
        left: 22px;
        z-index: 999999;
    }

    .inner-links {
        margin-right: -180px;
    }

    .LangChanger {
        margin-right: auto;
        margin-left: 230px;
    }

    .signUpNav {
        float: right;
    }
}

@media (max-width:414px) {
    #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
        margin-right: 53.3% !important;
    }

    #signInPopup {
        margin-top: 47.2px !important;
    }

    .HeaderBanner {
        top: 60%;
    }

    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg,
    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg {
        width: 100% !important;
    }

    .signInwindowText {
        margin-right: 100px !important;
    }

    .nav-link {
        padding: 0;
    }

    .nav-link,
    .signUpNav {
        float: right;
    }

    .quran-logo {
        margin-right: -3px;
    }

        .quran-logo > img {
            max-width: 125px;
        }

    .loginNav,
    .signUpNav {
        padding: 8px;
        font-size: 14px;
    }

    .inner-options {
        border-bottom: 1px solid #e9e5ca;
        margin-bottom: 10px;
    }

    body #carouselExampleIndicators .carousel-indicators li {
        height: 10px !important;
        width: 10px !important;
    }
    .loginNav, .signUpNav{font-size:10px !important;}
}

@media (max-width:375px) {
    #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
        padding: 8px 30px !important;
    }

    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg,
    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg {
        width: 100% !important;
    }

    .signInwindowText {
        margin-right: 63px !important;
        white-space: nowrap;
    }

    .loginNav, .signUpNav {
        padding: 7px;
        font-size: 12px;
    }

    .quran-logo > img {
        max-width: 108px;
    }

    .nav-link {
        font-size: 14px;
    }

    #lbtnSetArabic,
    #lbtnSetEnglish {
        font-size: 10px;
    }
}

@media (max-width:360px) {
    #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
        margin-right: 51.3% !important;
    }

    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg,
    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg {
        width: 100% !important;
    }

    .signInwindowText {
        margin-right: 48px !important;
        white-space: nowrap;
    }

    .quran-logo {
        margin-right: -1px;
    }

        .quran-logo > img {
            max-width: 98px;
        }

    .loginNav, .signUpNav {
        padding: 6px;
        font-size: 12px;
    }
}

@media (max-width:359px) {

    .TajweedBodyContainer {
        padding: 0 0 25px;
    }

    #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
        margin-right: 44.4% !important;
    }

    .HeaderBanner {
        top: 41%;
    }

    .inputHeaderBanner a {
        top: 20px;
        font-size: 20px;
    }

    .HowLearnInput {
        font-size: 14px;
    }

    .WWAContainer {
        padding: 12px;
    }

    .WWAheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .WWAheading h2 {
            font-size: 16px;
        }

    .WWAHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .WWAGridSection {
        padding: 0;
    }

    .SoftwareSteps span.Stepicon {
        width: 4%;
    }

    .JoinQuranRequestBtn {
        margin: 1%;
        width: 100%;
    }

    .LearnContainer {
        padding: 12px;
    }

    .LearnHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Learnheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .Learnheading h2 {
            font-size: 16px;
        }

    .LearnGridSection2 {
        padding: 0;
    }

    .FeaturesLeft .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesRight .LearnGridDesc {
        padding: 0 4px;
    }

    .FeaturesLeft .LearnGridIc img {
        width: 70%;
        margin-right: 15%;
    }

    .FeaturesRight .LearnGridIc img {
        width: 70%;
        margin-left: 15%;
    }

    .CertifiedContainer {
        padding: 12px;
    }

    .CertifiedHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Certifiedheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .Certifiedheading h3 {
            font-size: 16px;
        }

    .CertifiedTeachers, .VarietyTeachers, .AffordablePrices {
        padding: 0;
    }

        .CertifiedTeachers h4, .VarietyTeachers h4, .AffordablePrices h4 {
            font-size: 18px;
        }

    .SearchContainer {
        padding: 12px;
    }

    .SearchHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .Searchheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .Searchheading h2 {
            font-size: 16px;
        }

    .RequestBtn {
        width: 100%;
    }

    .HowQuranLMSWorksContainer {
        padding: 12px;
    }

    .HowQuranLMSHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .HowQuranLMSheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .HowQuranLMSheading h2 {
            font-size: 16px;
        }

    .HowQuranLMSBodyContainer .col-md-4 h4 {
        font-size: 18px;
    }

    .HowQuranContainer {
        padding: 12px;
    }

    .HowQuranHeaderContent span img {
        width: 24px;
        margin-top: 0;
        margin-left: 0;
    }

    .HowQuranheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .HowQuranheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherContainer {
        padding: 12px;
    }

    .BecomeTeacherHeaderContent span img {
        width: 24px;
        margin-top: 0;
    }

    .BecomeTeacherheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .BecomeTeacherheading h2 {
            font-size: 16px;
        }

    .BecomeTeacherBodyContainer {
        margin-top: 10px;
    }

    .BecomeTeacherDesc {
        font-size: 16px;
    }

    .BecomeTeacherTimeLine {
        padding: 0;
        margin-bottom: 0;
    }

    .BecomeTeacherRequestBtn {
        width: 100%;
    }

    .ArabicTeacherContainer {
        padding: 12px;
    }

    .ArabicTeacherLeft {
        padding: 25px;
        text-align: center;
        border-radius: 5px;
    }

        .ArabicTeacherLeft h2 {
            font-size: 20px;
        }

        .ArabicTeacherLeft p, .ArabicTeacherLeft span {
            font-size: 14px;
        }

    .ArabicTeacherDesc {
        padding: 0;
    }

    .ArabicTeacherDetails h5 {
        font-size: 18px;
    }

    .ArabicTeacherDetails p {
        margin-left: 0;
    }

    .ArabicTeacherLeft span {
        margin: 0;
    }

    .BecomeTeacherRequestBtn {
        margin: 1%;
    }

    .JoinQuranContainer {
        padding: 12px;
    }

    .JoinQuranHeaderContent {
        margin-bottom: 10px;
    }

        .JoinQuranHeaderContent span img {
            width: 24px;
            margin-top: 0;
        }

    .JoinQuranheading {
        margin: 0;
        width: 248px;
        text-align: center;
    }

        .JoinQuranheading h2 {
            font-size: 16px;
        }

    .JoinQuranDesc {
        font-size: 14px;
    }


    .InnerHeaderDownloadLink a img {
        width: 140px;
    }

    .SoftwareContainer {
        padding: 12px;
    }

    .SoftwareBody {
        padding: 2px;
    }

    .Softwareheading {
        margin: 0 12px;
        text-align: center;
    }

        .Softwareheading h2 {
            font-size: 16px;
        }

    .SoftwareGridSection {
        padding: 0;
    }

    .MobleStoreImg a img {
        width: 100%;
        padding: 10px;
    }

    .separatorNav {
        margin: 0 -2px;
    }

    .LangChanger {
        padding: 0;
    }

    .TajweedContainer {
        padding: 12px;
    }

    .Tajweedheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Tajweedheading h2 {
            font-size: 16px;
        }

    .TajweedDetails {
        padding: 0 5px !important;
    }

    .ArabicContainer {
        padding: 12px;
    }

    .Arabicheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Arabicheading h2 {
            font-size: 16px;
        }

    .ArabicGridSection {
        padding: 0;
    }

    .PricingContainer {
        padding: 12px;
    }

    .Pricingheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Pricingheading h2 {
            font-size: 16px;
        }

    .PricingGridSection {
        padding: 0;
    }

    .PricingBodyContainer {
        padding: 5px;
    }

        .PricingBodyContainer .SoftwareSteps .Steptext h4 {
            font-size: 16px;
        }

    .FAQContainer {
        padding: 12px;
    }

    .FAQheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .FAQheading h2 {
            font-size: 16px;
        }

    .FAQGridSection {
        padding: 0;
    }

    .orangeheading {
        font-size: 16px;
    }

    .FAQBodyContainer {
        padding: 0 7px;
    }

        .FAQBodyContainer .accordion {
            font-size: 14px;
        }

        .FAQBodyContainer .panel .panel-body p, .FAQBodyContainer .panel .panel-body ul {
            font-size: 12px;
        }

    .tutorialVideoArea {
        padding: 0;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    .brick .col-lg-8 {
        padding: 0;
    }

    #tutorialVideoArea .vidHeading {
        padding-top: 20px !important;
    }

    .vidHeading .fa {
        line-height: 1 !important;
    }

    #tutorialVideoArea .vidSubHeading {
        font-size: 14px !important;
        font-weight: bold !important;
    }

    .ar-desc p, .ar-desc ul {
        font-size: 12px;
    }

    ul.youtubewall li .panel i, ul.youtubewall li .panel a {
        line-height: 3.5 !important;
    }

    .VideoContainer {
        padding: 12px;
    }

    .Videoheading {
        margin: 0 12px;
        text-align: center;
        width: 100%;
    }

        .Videoheading h2 {
            font-size: 16px;
        }

    .VideoBody {
        padding: 0;
    }

    .btnTeacherStudents .container-fluid .SoftwareSteps .Steptext h4 {
        font-size: 14px;
    }

    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg,
    #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg {
        width: 100% !important;
    }

    .signInwindowText {
        margin-right: 53px !important;
        white-space: nowrap !important;
    }

    .nav-link {
        font-size: 13px;
    }

    .quran-logo > img {
        max-width: 90px;
    }

    .loginNav, .signUpNav {
        padding: 5px;
        font-size: 10px;
    }
}



@media (width:360px) and (height:640px) {
   
}

@media (width:414px) and (height:736px) {
    
}

@media (width:375px) and (height:667px) {
  
}

@media (min-width:660px) and (max-height:810px) {
    
}

@media (width:1024px) and (height:768px) {

    
}


.LessonToggle label {
    border-radius: 0;
}

.headingareatop {
    width: 100%;
    float: right;
    padding: 0px;
    text-align: center;
    font-weight: 300 !important;
    color: #2c3e50;
    font-size: 36px;
}

.RegisterForCourses_wrapper_BottomArea .col-lg-2, .RegisterForCourses_wrapper_BottomArea .col-lg-8, .mainContainerSearchCourse {
    float: right !important;
}
    .mainContainerSearchCourse .spResultBox {
        padding: 0 !important;
        margin: 0 10px 0 -5px !important;
        width: calc(100% - 5px) !important;
    }
/* Sign Up Calling start*/
#signUpPopup {
    margin-top: 47.1px;
    z-index: 9999;
}

    #signUpPopup .modal-dialog .modal-content {
        border-radius: 0;
        background-color: #f5f0d8;
    }

        #signUpPopup .modal-dialog .modal-content .modal-header {
            border: none;
            color: #000;
        }

            #signUpPopup .modal-dialog .modal-content .modal-header h5 {
                width: 100%;
                text-align: center;
                padding: 10px 35px 0px 0px;
                font-size: 22px;
            }

            #signUpPopup .modal-dialog .modal-content .modal-header button {
                color: #000;
                padding-top: 25px;
            }

        #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 {
            text-align: center;
            float: right;
        }

            #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6:hover p {
                color: #385723;
            }

            #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg {
                background-image: url(../../images/teacherPhotoSignUp.png);
                background-repeat: no-repeat;
                width: 205px;
                height: 202px;
                background-position: center center;
            }
            /*#signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg:hover{background-image: url(../../images/hoverTeacher.png); background-repeat:no-repeat;}*/
            #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg {
                background-image: url(../../images/studentPhotoSignUp.png);
                background-repeat: no-repeat;
                width: 205px;
                height: 202px;
                background-position: center center;
            }
            /*#signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg:hover{background-image: url(../../images/hoverStudent.png); background-repeat:no-repeat;}*/
            #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a p {
                color: #002060;
                font-size: 22px;
                padding: 10px;
                font-weight: 500;
                text-align: center;
            }

                #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a p:hover {
                    color: #866f00;
                }

.resetWindowTxt {
    text-align: center;
}

.chosen-container-multi .chosen-choices li {
    float: right !important;
}


/* Signin Calling start*/
#signInPopup {
    margin-top: 47px;
}

    #signInPopup .modal-dialog .modal-content {
        border-radius: 0;
        background-color: #e1b12c;
    }

        #signInPopup .modal-dialog .modal-content .modal-header {
            border: none;
            color: white;
            padding-bottom: 0;
        }

            #signInPopup .modal-dialog .modal-content .modal-header h5 {
                width: 100%;
                text-align: center;
                padding: 10px 35px 0px 0px;
                font-size: 22px;
            }

            #signInPopup .modal-dialog .modal-content .modal-header button {
                color: white;
                padding-top: 15px;
            }

        #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 {
            float: left;
        }

            #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 {
                float: right;
                text-align: right;
            }

                #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 img {
                    width: 112%;
                    margin-top: 4%;
                }

            #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField {
                max-width: 80%;
            }

            #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-10 {
                float: right;
                background-color: #FFFFFF;
                padding-bottom: 5px;
                border-radius: 2px;
                text-align: right;
            }

            #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField span {
                font-size: 14px;
                font-weight: 500;
            }

            #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField input {
                border: none;
                padding: 0;
            }

        #signInPopup .modal-dialog .modal-content .modal-body .LoginPassword {
            margin-top: 10px;
        }

        #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword {
            /*float: left;*/
            margin-top: 5px;
        }

            #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword a {
                color: #75210d;
                font-weight: 500;
                font-size: 15px;
                text-decoration: underline;
            }

            #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword > a {
                margin-right: 72px;
            }

            #signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
                border-radius: 0;
                border: 1px solid #000000;
                background-color: #f8edaa;
                color: #635425;
                font-weight: 500;
                font-size: 14px;
                margin-top: 2%;
                /*padding: 8px 40px;*/
            }

.signInwindowText {
    text-align: right;
    margin-right: 72px;
}

#signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField input:focus {
    border-color: none !important;
    box-shadow: none !important;
}

@media (max-width:768px) {
    #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 {
        max-width: 20%;
    }

    .navbar-toggler {
        padding: 5px
    }

    #signInPopup .modal-dialog .modal-content .modal-body .col-md-12 {
        padding-left: 0;
    }
}

/* Signin Calling end*/

/* Change Password Calling start*/
#resetPwPopup {
    margin-top: 2%;
}

    #resetPwPopup .modal-dialog .modal-content {
        border-radius: 0;
        background-color: #e1b12c;
    }

        #resetPwPopup .modal-dialog .modal-content .modal-header {
            border: none;
            color: white;
            padding-bottom: 0;
        }

            #resetPwPopup .modal-dialog .modal-content .modal-header h5 {
                width: 100%;
                text-align: center;
                padding: 10px 35px 0px 0px;
                font-size: 22px;
            }

            #resetPwPopup .modal-dialog .modal-content .modal-header button {
                color: white;
                padding-top: 15px;
            }

        #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 {
            float: left;
        }

            #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 {
                float: right;
                text-align: right;
            }

                #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 img {
                    width: 112%;
                    margin-top: 4%;
                }

            #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField {
                max-width: 80%;
            }

            #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-10 {
                float: left;
                background-color: #FFFFFF;
                padding-bottom: 5px;
                border-radius: 2px;
                text-align: right;
            }

            #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField span {
                font-size: 14px;
                font-weight: 500;
            }

            #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField input {
                border: none;
                padding: 0;
            }

        #resetPwPopup .modal-dialog .modal-content .modal-body .LoginPassword {
            margin-top: 18px;
            float: left;
        }

        #resetPwPopup .modal-dialog .modal-content .modal-body .ForgotPassword {
            float: left;
            margin-top: 5px;
        }

            #resetPwPopup .modal-dialog .modal-content .modal-body .ForgotPassword a {
                color: #75210d;
                font-weight: 500;
                font-size: 15px;
                text-decoration: underline;
            }

            #resetPwPopup .modal-dialog .modal-content .modal-body .ForgotPassword button {
                border-radius: 0;
                border: 1px solid #000000;
                background-color: #f8edaa;
                color: #635425;
                font-weight: 500;
                font-size: 14px;
                float: right;
                margin-right: 68%;
                margin-top: 2%;
                padding: 8px 40px;
            }


        #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .LoginTxtField input:focus {
            border-color: none !important;
            box-shadow: none !important;
        }
ul.youtubewall li .panel{max-height:unset !important;display:flex !important;align-items:center;justify-content:center;}
.DashboradBody .link-cont{margin-left:0;}
.LangChanger{direction:rtl !important;}
@media screen and (max-width:991px) {
    .col-md-7.inner-links, .col-md-4.col-sm-12.col-xs-12.col-lg-12.brick {
        width: calc(100% - 170px) !important; max-width: 100%;float:right;
    }
    ul.youtubewall li .thumbwrap {
    margin:0;
    }
    .BannerTagLine h1 br {
        display: none
    }
    .mainContainerSearchCourse .spResultBox {
        padding: 0 !important;
        margin: 0 -5px !important;
        width: calc(100% + 10px) !important;
    }
    .selector-box {
        overflow: hidden;
        white-space: nowrap
    }

    .HeaderFormContainer {
        width: 100% !important;
    }

    .BannerTagLine {
        width: calc(100% - 100px);
        left: 50px;
        right: 50px;
        max-width: 100%;
        margin: 0;
    }

    #navbarSupportedContent {
        position: relative;
    }

    .col-md-7.LangChanger {
        position: absolute;
        top: 7px;
        width: auto;
        left: 15px;
    }

    #lbtnSetArabic {
        margin-left: 0 !important;
    }

    .navbar-nav.mr-auto.LeftMainMenu {
        flex-direction: unset;
        flex-wrap: wrap;
    }

        .navbar-nav.mr-auto.LeftMainMenu li:first-child {
            width: 30px;
        }

        .navbar-nav.mr-auto.LeftMainMenu li:nth-child(2) {
            width: 30px;
            text-align: center;
            padding-bottom: 0;
        }

        .navbar-nav.mr-auto.LeftMainMenu li:nth-child(3), .navbar-nav.mr-auto.LeftMainMenu li:nth-child(4) {
            padding: 0 15px
        }

    .dropdown-menu.CustomDropDown {
        background: #FFF;
        float: right;
        padding-bottom: 10px;
        width: calc(100vw - 130px)
    }

    .UniqueFeatureRight p a, a.ReadMore {
        margin-bottom: 20px;
    }

    .WWAHeaderContent2, .WWAHeaderContent1 {
        padding: 0 15px
    }

        .WWAHeaderContent2 span, .WWAHeaderContent1 span {
            float: left;
        }

            .WWAHeaderContent2 span:nth-child(2), .WWAHeaderContent1 span:nth-child(2) {
                width: calc(100% - 86px);
            }

                .WWAHeaderContent2 span:nth-child(2) span, .WWAHeaderContent1 span:nth-child(2) span {
                    width: 100%;
                    text-align: center;
                    border: none !important;
                }

                .WWAHeaderContent1 span:nth-child(2) span {
                    width: 100%;
                    text-align: center;
                    width: auto;
                    display: inline-block;
                    float: none;
                }

    .WWAHeaderContent span:nth-child(2) h2 {
        display: table;
        width: 100%;
    }

        .WWAHeaderContent span:nth-child(2) h2 span {
            display: table-cell;
            vertical-align: middle;
            height: 40px;
            float: none
        }

    .HeaderFormContainer {
        padding: 0;
    }

    .SpanGreen {
        padding-bottom: 60px;
        position: relative;
    }

        .SpanGreen > a {
            position: absolute !important;
            bottom: 20px !important;
            left: 0 !important;
            margin: 0;
        }

    .quranLearning {
        clear: both
    }

    ul.Feature8Text {
        padding-bottom: 20px;
    }

    .CustomDropMenu {
        display: flex;
        flex-wrap: wrap;
        padding: 0 0 0 5px
    }

        .CustomDropMenu .col-md-2 .dropdown-item {
            height: 100%;
            padding: 20px 10px 15px
        }
    .RegisterForCourses_wrapper_BottomArea > div {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 15px !important;
        border: none !important;
    }
    #timezonebox .headingright{padding:0;width:100%;}
    .RegisterForCourses_wrapper_BottomArea .rangeslider, .RegisterForCourses_wrapper_BottomArea .rangeslider_blue {
        width: 100% !important;
        padding: 0 8px;
        margin: 0 !important;
    }
    .table-courses-offered-container{max-height:unset !important;}
    #dvCourseStudentSettings {
    margin-top:20px !important;
    }
    .LangChanger {
    text-align:center;
    float:left;width:auto;padding:10px 0;
    }
    #sec1, #sec1 + .profile-main{width:100%;max-width:100% !important;flex:0 0 100% !important;}
    .fc-toolbar.fc-header-toolbar{display:flex;flex-wrap:wrap;}
    .fc-toolbar .fc-left{order:1;width:50%;}
    .fc-toolbar .fc-right{width:50%;order:2;}
}

@media (max-width:768px) {
    #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 .col-md-2 {
        max-width: 20%;
    }

    .quran-logo > img {
        max-width: 110px;
        width: auto
    }

    .quran-logo {
        top: 0px;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 150px;
        text-align: center;
        left: calc(50% - 75px);
    }

    #resetPwPopup .modal-dialog .modal-content .modal-body .col-md-12 {
        padding-left: 0;
    }

    .HeaderBanner {
        top: 135px;
    }

    #carouselExampleIndicators .carousel-indicators li {
        height: 15px !important;
        width: 15px !important;
    }
    .openlanguagebox .poppubtnsBox{
        text-align:left;
    }
    .openlanguagebox .poppubtnsBox button{
        float:none;display:inline-block
    }
}


@media (max-width: 767px) {
    .LangChanger{width:100%;}
    .col-md-7.inner-links{width:100% !important;text-align:right}
    .navbar-nav.mr-auto.LeftMainMenu li:nth-child(3), .navbar-nav.mr-auto.LeftMainMenu li:nth-child(4){display:block;width:100%;}
    .lead{font-size:14px !important;}
    .center h2{font-size:18px !important;}
    .totalCost .text-right {
        text-align: center;
    }
    .nav.side-menu > li{max-width:80px;width:auto !important;}
    #EditProfilePage h2 .find-tutors {
        max-width: calc(100% - 92px);
        display: inline-block;
    }
    #sidebar-menu ul {
        justify-content: center;
    }
    .menuImgPadding {
        padding: 11px 20px
    }
    .nav-sm .container.body .right_col {
        width: 100% !important;
    }
    .TotalCount {
        width: 100%;
    }

    .teacherName.FTHeader {
        display: flex;
        align-items: center;
        max-width: calc(100% - 87px)
    }

    .FTSearchResultRow .statistics .head {
        display: inline-block;font-size:11px;
    }

    .FTSearchResultRow .statistics .value {
        float: left;
        min-width: 50%;
    }

    .FTSearchResultRow .statistics .gBigTxt, .FTSearchResultRow .statistics .gSmlTxt {
        position: static;
        font-size: 12px !important;
    }
    .statistics .gBigTxt {
    display:inline-block;margin:0 !important;
    }
    .teacher-detail-separator .rating-cont{float:left;width:50%;}
    .teacher-detail-separator:nth-child(2) .head {
        width: 100%;
    }
    .teacher-detail-separator {
   border:none;
    }
    .question .col-sm-1 {
        margin: 0 auto;
    }

    .container.block5ReadMore.block5-read.sstm {
        margin: 0 !important;
    }

    .UniqueFeatureLeft h5 {
        clear: both;
    }

    .UniqFeatureDetail:nth-child(8) .Feature8Text > li {
        position: relative;
        padding-bottom: 50px;
    }

    .Feature8Text > li > a {
        position: absolute;
        bottom: 10px;
        right: 40px;
        margin: 0;
    }

    .CustomDropMenu .col-md-2 {
        width: 33.33%
    }

    .HeaderFormContainer {
        width: 50% !important
    }

    .selector-box {
        font-size: 13px !important;
        height: 32px !important;
    }

    .inputHeaderBanner {
        margin: 0 !important;
        padding: 5px;
    }

    .selector-btn {
        height: 32px !important;
        padding: 5px 0px 9px 0px !important;
    }

    .tp-mask-wrap {
        top: 20px;
        left: 0;
        right: 0;
        transform: none !important;
    }

    .tp-loop-wrap {
        width: 100%;
    }

    .tp-parallax-wrap {
        transform-style: preserve-3d;
        left: 0 !important;
        right: 0 !important;
    }

    .tp-bullets {
        display: none;
    }

    .HeaderDownloadLink img, .InnerHeaderDownloadLink a img {
        height: 30px;
        width: 29px !important;
        object-fit: cover;
        object-position: left;
        border-radius: 5px;
    }

    .HeaderDownloadLink a:last-child img, .InnerHeaderDownloadLink a:last-child img {
        object-position: calc(100% + 4px)
    }

    .HeaderFormContainer {
        width: calc(100% - 93px) !important
    }

    .InnerPageSearch {
        width: calc(100% - 110px);
        float: right;
        padding: 3px;
    }

    .rev_slider .tp-mask-wrap .tp-caption, .rev_slider .tp-mask-wrap :last-child, .wpb_text_column .rev_slider .tp-mask-wrap .tp-caption, .wpb_text_column .rev_slider .tp-mask-wrap :last-child {
        margin-bottom: 0;
        font-size: 15px !important;
        text-align: center !important;
        white-space: normal !important;
        opacity: 1 !important;
        padding: 10px 0px !important;
        line-height: normal !important;
        margin: 10px auto 0 !important;
    }

    #slide-12-layer-1, #slide-11-layer-1, #slide-10-layer-1, #slide-5-layer-1, #slide-6-layer-1, #slide-8-layer-1, #slide-13-layer-1, #slide-14-layer-1, #slide-17-layer-1, #slide-3-layer-1, #slide-16-layer-1 {
        min-height: 68px !important;
    }
    .FooterAbout {
        text-align:right
    }
    .FooterContent .col .row > div, .FooterAbout {
        margin-bottom: 20px;
    }
    .signUpNav{float:right;font-size:13px;}
    .loginNav{font-size:13px;}
    .headingareatop{font-size:20px;}
    .page-description{margin:0 15px 20px !important;font-size:14px !important;}
    .fc td, .fc th{font-size:12px;}
    #sec2.profile-main-header .floatRight {
        text-align: right !important;
    }
    .profile-main .alignLeft{flex-wrap:wrap;}
}
/* Change Password Calling end*/

.englihLink {
    /*padding: 2px 6px 2px 6px;
    margin: 0px 0px 0px -5px;*/
}

.arabicLink {
    /*padding: 0px 5px 2px 3px;
    float: left;*/
}


.carousel-item:nth-child(1) .BannerTagLine {
    background: RGBA(235, 236, 231,0.80);
    color: RGB(146, 96, 63);
}

.carousel-item:nth-child(2) .BannerTagLine {
    background: RGBA(215, 237, 225,0.80);
    color: RGB(56, 145, 128);
}

.carousel-item:nth-child(3) .BannerTagLine {
    background: RGBA(231, 219, 203,0.80);
    color: RGB(106, 94, 78);
}

.carousel-item:nth-child(4) .BannerTagLine {
    background: RGBA(231, 217, 190,0.80);
    color: RGB(143, 104, 41);
}

.carousel-item:nth-child(5) .BannerTagLine {
    background: RGBA(224, 220, 159,0.50);
    color: RGB(126, 115, 0);
}

.carousel-item:nth-child(6) .BannerTagLine {
    background: RGBA(249, 236, 191,0.80);
    color: RGB(121, 103, 25);
}

.carousel-item:nth-child(7) .BannerTagLine {
    background: RGBA(255, 228, 201,0.80);
    color: RGB(141, 79, 17);
}

.carousel-item:nth-child(8) .BannerTagLine {
    background: RGBA(249, 222, 213,0.80);
    color: RGB(162, 69, 69);
}

.carousel-item:nth-child(9) .BannerTagLine {
    background: RGBA(216, 225, 198,0.80);
    color: RGB(99, 119, 36);
}

.carousel-item:nth-child(10) .BannerTagLine {
    background: RGBA(213, 226, 204,0.80);
    color: RGB(64, 118, 66);
}

.carousel-item:nth-child(11) .BannerTagLine {
    background: RGBA(250, 236, 191,0.80);
    color: RGB(119, 101, 22);
}

.carousel-item:nth-child(12) .BannerTagLine {
    background: RGBA(230, 218, 202,0.80);
    color: RGB(108, 96, 80);
}

    .carousel-item:nth-child(12) .BannerTagLine span {
        color: RGB(128, 41, 38);
    }

.carousel-item:nth-child(13) .BannerTagLine {
    background: RGBA(231, 241, 206,0.80);
    color: RGB(103, 152, 58);
}

    .carousel-item:nth-child(13) .BannerTagLine span {
        color: RGB(137, 38, 33);
    }
.InnerPageHeading h2.bordered {
    border: none;
    line-height: 1.5;
}
    .InnerPageHeading h2.bordered span {
        border-bottom: 2px solid;
        padding-bottom: 4px;
    }
.list-heading {
    padding-right: 15px;
}
    .list-heading + *{padding:0 15px;display:block}
    .list-heading::before {
        content: '';
        height: 6px;
        width: 6px;
        border-radius: 50%;
        background: #000;
        margin-right: -15px;
        margin-left: 9px;
        display: inline-block;
        vertical-align: middle;
    }

.carousel-item:nth-child(14) .BannerTagLine {
    background: RGBA(250, 237, 192,0.80);
    color: RGB(122, 115, 18);
}

    .carousel-item:nth-child(14) .BannerTagLine span {
        color: RGB(128, 14, 3);
    }

.carousel-item:nth-child(15) .BannerTagLine {
    background: RGBA(197, 231, 214,0.80);
    color: RGB(27, 116, 103);
}

.carousel-item:nth-child(16) .BannerTagLine {
    background: RGBA(223, 231, 180,0.80);
    color: RGB(84, 111, 11);
}
.table table td, .table table th {
    border: none;
    vertical-align: top;
}

#tblCourseStudentSettings table {
    width: 100%;table-layout:fixed
}
.colToRemoveAtRoot.studentCriteria:last-child{width:20%;}

#tblCourseStudentSettings table th {
    color: #FFF;
}

#tblCourseStudentSettings > tr > td {
    padding: 0
}

#tblCourseStudentSettings th.courseSetting {
    padding-bottom: .75rem !important;
}

@media screen and (max-width:576px) {
    .carousel-item:nth-child(1) .BannerTagLine {
        background: RGBA(235, 236, 231,0.95);
        color: RGB(146, 96, 63);
    }

    .HeaderBanner {
        top: 10px !important;
    }

    .carousel-item:nth-child(2) .BannerTagLine {
        background: RGBA(215, 237, 225,0.95);
        color: RGB(56, 145, 128);
    }

    .carousel-item:nth-child(3) .BannerTagLine {
        background: RGBA(231, 219, 203,0.95);
        color: RGB(106, 94, 78);
    }

    .carousel-item:nth-child(4) .BannerTagLine {
        background: RGBA(231, 217, 190,0.95);
        color: RGB(143, 104, 41);
    }

    .carousel-item:nth-child(5) .BannerTagLine {
        background: RGBA(224, 220, 159,0.95);
        color: RGB(126, 115, 0);
    }

    .carousel-item:nth-child(6) .BannerTagLine {
        background: RGBA(249, 236, 191,0.95);
        color: RGB(121, 103, 25);
    }

    .carousel-item:nth-child(7) .BannerTagLine {
        background: RGBA(255, 228, 201,0.95);
        color: RGB(141, 79, 17);
    }

    .carousel-item:nth-child(8) .BannerTagLine {
        background: RGBA(249, 222, 213,0.95);
        color: RGB(162, 69, 69);
    }

    .carousel-item:nth-child(9) .BannerTagLine {
        background: RGBA(216, 225, 198,0.95);
        color: RGB(99, 119, 36);
    }

    .carousel-item:nth-child(10) .BannerTagLine {
        background: RGBA(213, 226, 204,0.95);
        color: RGB(64, 118, 66);
    }

    .carousel-item:nth-child(11) .BannerTagLine {
        background: RGBA(250, 236, 191,0.95);
        color: RGB(119, 101, 22);
    }

    .carousel-item:nth-child(12) .BannerTagLine {
        background: RGBA(230, 218, 202,0.95);
        color: RGB(108, 96, 80);
    }

        .carousel-item:nth-child(12) .BannerTagLine span {
            color: RGB(128, 41, 38);
        }

    .carousel-item:nth-child(13) .BannerTagLine {
        background: RGBA(231, 241, 206,0.95);
        color: RGB(103, 152, 58);
    }

        .carousel-item:nth-child(13) .BannerTagLine span {
            color: RGB(137, 38, 33);
        }

    .carousel-item:nth-child(14) .BannerTagLine {
        background: RGBA(250, 237, 192,0.95);
        color: RGB(122, 115, 18);
    }

        .carousel-item:nth-child(14) .BannerTagLine span {
            color: RGB(128, 14, 3);
        }

    .carousel-item:nth-child(15) .BannerTagLine {
        background: RGBA(197, 231, 214,0.95);
        color: RGB(27, 116, 103);
    }

    .carousel-item:nth-child(16) .BannerTagLine {
        background: RGBA(223, 231, 180,0.95);
        color: RGB(84, 111, 11);
    }
    table.speedCalcBoxtable.table-responsive, table.speedCalcBoxtable.table-responsive tbody, table.speedCalcBoxtable.table-responsive tbody tr, .RegisterForCourses_wrapper_BottomArea .col-lg-2.col-md-2.col-sm-2.col-xs-2 .rowbox .openspeedboxinfo .speedCalcBox {
        display: block;
        width: 100% !important;
    }

        table.speedCalcBoxtable.table-responsive td {
            border-bottom: 1px solid #ddd;
            display: block;
            font-size: .8em;
            text-align: right;
        }
    .RegisterForCourses_wrapper_BottomArea .col-lg-2.col-md-2.col-sm-2.col-xs-2 .rowbox .openspeedboxinfo .closebutton {
        right: auto !important;
        left: 0 !important;
    }
            table.speedCalcBoxtable.table-responsive td::before {
                content: attr(data-label);
                float: left;
                font-weight: bold;
                text-transform: uppercase;
                left: 0px;
                width: 100%;
                text-align: right;
                padding-right: 0px;
                font-weight: bold;
                white-space: nowrap;
                font-size: 1em;
                text-transform: uppercase;
                padding: 8px 5px;
                color: #FFF;
                background-color: #42819f;
            }
    .speedCalcBoxtable.table-responsive thead {
        display: none;
    }
    .fc td, .fc th{font-size:10px;font-weight:normal;vertical-align:middle;}
    #tutorProfileModal .modal-body{padding:30px 0 0;}
    #sec1 + .profile-main{padding:0;}
    .teachingSchedule .fcs-center h3, .teachingSchedule .fcs-center select{font-size:18px;}
    .profile-left .profile-left-value{margin:0;position:static;}
    #tblCourseStudentSettings > tr:nth-child(7) > td > table {
        width: 100%
    }

        #tblCourseStudentSettings > tr:nth-child(7) > td > table > tbody > tr, #tblCourseStudentSettings > tr:nth-child(7) > td > table > tbody > tr > td {
            width: 100%;
            display: block;
        }

    td.courseSetting, th.courseSetting {
        width: 25% !important;
    }
    .colToRemoveAtRoot:nth-child(3){width:5px !important;padding:0 !important;}
    #tblCourseStudentSettings > tr:nth-child(7) > td td.courseSetting {
        width: 100% !important;
    }

    .courseNameHoolder .col-md-8.col-sm-12.float-right {
        padding: 0;
    }
    .LangChanger, .col-md-7.inner-links {
        width: 100% !important;
    }
    
}

@media screen and (max-height:285px) {

    #signInPopup {
        max-height: calc(100% - 48px)
    }

        #signInPopup .modal-dialog {
            height: calc(100% - 16px);
            overflow-y: hidden;
        }

        #signInPopup .modal-content {
            height: 100%;
            padding-bottom: 15px;
        }

        #signInPopup .modal-body {
            height: calc(100% - 59px);
            overflow: scroll
        }
}

@media screen and (max-height:655px) and (max-width:767px) {

    #signUpPopup {
        max-height: calc(100% - 48px)
    }

        #signUpPopup .modal-dialog {
            height: calc(100% - 16px);
            overflow-y: hidden;
        }

        #signUpPopup .modal-content {
            height: 100%;
            padding-bottom: 15px;
        }

        #signUpPopup .modal-body {
            height: calc(100% - 59px);
            overflow: scroll
        }
}

#signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .student-bg, #signUpPopup .modal-dialog .modal-content .modal-body .col-md-6 a .teacher-bg {
    width: 100%;
}

/* Start Cookie */

.cookieBannerMain {
    z-index: 5000 !important;
    position: fixed !important;
    left: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    padding: 0px !important;
    background-color: #e74c3c !important;
    color: #FFF !important;
    border: 0;
    font-size: 12px;
    vertical-align: baseline;
    font-family: Verdana;
    text-align: center;
}

.cookieBanner {
    max-width: 81.025641rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    justify-content: center !important;
    align-items: center !important;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    color: #FFF !important;
}

.cookieGridCell {
    margin-top: 0;
    margin-bottom: 0;
    margin: 4px;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    color: #FFF !important;
    /*margin-left: 10%;*/
}

.whitecolor {
    color: #FFF !important;
}

.cookieCloseButton {
    position: relative;
    /*padding: .8em;*/
    /*border: 1px solid transparent;*/
    border-radius: 3px;
    background-color: transparent;
    outline: none;
    font-weight: 400;
    line-height: 1.15384615;
    text-decoration: none;
    cursor: pointer;
    border-color: rgba(0,89,153,0);
    box-shadow: 0 0 0 0 rgba(0,149,255,0);
    background-color: #e74c3c !important;
    color: #FFF !important;
    font-size: 15px;
}

.cookieGridCellMargin {
    /*margin-left: auto !important;*/
}

.cookieInfoMessage {
    padding-top: 10px;
}
.or {
    position: absolute;
    font-size: 18px;
    background: #e1b12c;
    top: calc(50% - 50px);
    right: calc(50% - 13px);
    display: block;
    z-index: 100;
    padding: 5px 0;
}.signup-social {
    position: absolute;
    top: -59px;
    bottom: 0;
    left: 0;
    background: rgba(185, 146, 36, 0.92);
    width: 0px;
    text-align: center;
    padding: 30px 0;
    overflow: hidden;
    transition: ease all 1s;
}.signup-social.open {
    width: 180px;
}.signup-social a {
    color: #FFF;
    display: block;
}.signup-social a .teacher-bg, .signup-social a .student-bg {
    width: 70px;
    background-size: 100%;
    height: 80px;
    margin: 0 auto;
}
a .teacher-bg {
    background-image: url(../../images/teacherPhotoSignUp.png);
    background-repeat: no-repeat;
    width: 205px;
    height: 202px;
    background-position: center center;
}a .student-bg {
    background-image: url(../../images/studentPhotoSignUp.png);
    background-repeat: no-repeat;
    width: 205px;
    height: 202px;
    background-position: center center;
}.signup-social h2 {
    font-size: 22px;
    color: #FFF;
    text-transform: uppercase;
}

/* End Cookie */

#divImageContainer{position:relative}
.ViewQuranDetailsbox_left .imgarea.imgPaddingForScriptPg div[id*="mapster_wrap"] {
    width: 100% !important;
    height: auto !important;
    padding-right: 20px !important;
}
.ViewQuranDetailsbox_left .imgarea img {
    width: 100% !important;
    height: auto !important;
}
div#lnkRow {
    width: 20px !important;
    padding: 0 !important;
    position: absolute;
    top: 0;
    right: 6px;
}
a.scriptSelectRow {
    margin-top: 28px;
    display: block;
}
div#divRow {
    position: absolute;
    top: 60px;
    right: 30px;
    left: 0;
    font-size: 24px;
}
div#divRow>div {
    background: #FFF;
    padding: 10px;
    text-align: right !important;
    width: 100%;
    display: block; 
    padding:6px 10px 7px;
    border:1px solid #000;
    position: relative;
    height:93px;
}

.ViewQuranDetailsbox_left .imgarea + .navigationbtnsarea{margin-top:20px;}

div#divRow>div:empty {
    background:none;
    outline: 0;
}

.col-md-auto.ViewQuranDetailsbox_left{width:600px;}
.imgarea[pg2="pg2"] div#lnkRow{top: 273px;right: 84px;}
.imgarea[pg2="pg2"] div#lnkRow a.scriptSelectRow{margin-top:23px}
.imgarea[pg2="pg2"] div#lnkRow a.scriptSelectRow:first-child{position:relative;left:-35px}
.imgarea[pg2="pg2"] div#lnkRow a.scriptSelectRow:nth-child(5){position:relative;left:-40px}
.imgarea[pg2="pg2"] div#lnkRow a.scriptSelectRow:nth-child(6){position:relative;left:-90px}
.ViewQuranDetailsbox_left [pg2="pg2"] .imgarea img{width:545px;display:block;margin:0 auto}

.imgarea[pg1="pg1"] div#lnkRow a.scriptSelectRow:first-child{position:relative;left:-75px}
.imgarea[pg1="pg1"] div#lnkRow a.scriptSelectRow:nth-child(2){position:relative;left:-35px}
.imgarea[pg1="pg1"] div#lnkRow a.scriptSelectRow:nth-child(5){position:relative;left:-10px}
.imgarea[pg1="pg1"] div#lnkRow a.scriptSelectRow:nth-child(6){position:relative;left:-44px}
.imgarea[pg1="pg1"] div#lnkRow a.scriptSelectRow:nth-child(7){position:relative;left:-90px}
.ViewQuranDetailsbox_left [pg1="pg1"].imgarea img.mapster_el, .ViewQuranDetailsbox_left [pg2="pg2"].imgarea img.mapster_el {
    width: 545px !important;
    display: block !important;
    margin: 0 auto;
    position: static !important;
    opacity: 1 !important;
}

.imgarea[pg1="pg1"] div#lnkRow{top: 224px;right: 84px;}
.imgarea[pg1="pg1"] div#divRow{top: 280px;
    left: 105px;
    right: 200px;}
.ViewQuranDetailsbox_left [pg1="pg1"].imgarea>div,.ViewQuranDetailsbox_left [pg2="pg2"].imgarea>div {
    padding: 0 !important;
}
.ViewQuranDetailsbox_left [pg1="pg1"].imgarea a.scriptSelectRow{margin-top:23px;} 
.imgarea[pg1="pg1"] div#divRow>div:first-child{position:relative;left:35px;width:109%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(2){position:relative;left:0px;width:133%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(3){position:relative;left:7px;width:130%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(4){position:relative;left:7px;width:130%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(5){position:relative;left:-10px;width:120%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(6){position:relative;left:0px;width:100%}
.imgarea[pg1="pg1"] div#divRow>div:nth-child(7){position:relative;left:150px;width:60%}
.imgarea[pg1="pg1"] div#divRow div{padding:5px 10px} 
                              
.imgarea[pg2="pg2"] div#divRow {top:328px;right:200px;left:90px;}
.imgarea[pg2="pg2"] div#divRow div{padding:7px 10px} 
.imgarea[pg2="pg2"] div#divRow>div:first-child{position:relative;left:0px;width:128%}
.imgarea[pg2="pg2"] div#divRow>div:nth-child(2){position:relative;left:0px;width:130%}
.imgarea[pg2="pg2"] div#divRow>div:nth-child(3){position:relative;left:0px;width:128%}
.imgarea[pg2="pg2"] div#divRow>div:nth-child(4){position:relative;left:20px;width:110%}
.imgarea[pg2="pg2"] div#divRow>div:nth-child(4){position:relative;left:-30px;width:110%}

.ViewQuranDetailsbox_left .imgarea[pg2="pg2"] canvas, .ViewQuranDetailsbox_left .imgarea[pg1="pg1"] canvas{width:545px !important;height:808px !important;}
div#divRow > div a {
    font-size: 18px;
    margin-top: 13px;
    top: 1px;
    left: 2px;
    line-height: 18px;
}
.imgarea[pg50="pg50"] div#lnkRow, .imgarea[pg128="pg128"] div#lnkRow, .imgarea[pg151="pg151"] div#lnkRow, .imgarea[pg177="pg177"] div#lnkRow, .imgarea[pg249="pg249"] div#lnkRow, .imgarea[pg262="pg262"] div#lnkRow, .imgarea[pg282="pg282"] div#lnkRow, .imgarea[pg305="pg305"] div#lnkRow, .imgarea[pg322="pg322"] div#lnkRow, .imgarea[pg411="pg411"] div#lnkRow, .imgarea[pg428="pg428"] div#lnkRow, .imgarea[pg477="pg477"] div#lnkRow, .imgarea[pg483="pg483"] div#lnkRow, .imgarea[pg496="pg496"] div#lnkRow, .imgarea[pg511="pg511"] div#lnkRow, .imgarea[pg518="pg518"] div#lnkRow, .imgarea[pg542="pg542"] div#lnkRow, .imgarea[pg553="pg553"] div#lnkRow, .imgarea[pg560="pg560"] div#lnkRow, .imgarea[pg562="pg562"] div#lnkRow, .imgarea[pg572="pg572"] div#lnkRow, .imgarea[pg574="pg574"] div#lnkRow, .imgarea[pg582="pg582"] div#lnkRow, .imgarea[pg587="pg587"] div#lnkRow, .imgarea[pg591="pg591"] div#lnkRow, .imgarea[pg601="pg601"] div#lnkRow, .imgarea[pg602="pg602"] div#lnkRow, .imgarea[pg603="pg603"] div#lnkRow, .imgarea[pg604="pg604"] div#lnkRow{top:105px;}
.imgarea[pg50="pg50"] div#divRow, .imgarea[pg128="pg128"] div#divRow, .imgarea[pg151="pg151"] div#divRow, .imgarea[pg177="pg177"] div#divRow, .imgarea[pg249="pg249"] div#divRow, .imgarea[pg262="pg262"] div#divRow, .imgarea[pg282="pg282"] div#divRow, .imgarea[pg305="pg305"] div#divRow, .imgarea[pg322="pg322"] div#divRow, .imgarea[pg411="pg411"] div#divRow, .imgarea[pg428="pg428"] div#divRow, .imgarea[pg477="pg477"] div#divRow, .imgarea[pg483="pg483"] div#divRow, .imgarea[pg496="pg496"] div#divRow, .imgarea[pg511="pg511"] div#divRow, .imgarea[pg518="pg518"] div#divRow, .imgarea[pg542="pg542"] div#divRow, .imgarea[pg553="pg553"] div#divRow, .imgarea[pg560="pg560"] div#divRow, .imgarea[pg562="pg562"] div#divRow, .imgarea[pg572="pg572"] div#divRow, .imgarea[pg574="pg574"] div#divRow, .imgarea[pg582="pg582"] div#divRow, .imgarea[pg587="pg587"] div#divRow, .imgarea[pg591="pg591"] div#divRow, .imgarea[pg601="pg601"] div#divRow, .imgarea[pg602="pg602"] div#divRow, .imgarea[pg603="pg603"] div#divRow, .imgarea[pg604="pg604"] div#divRow{top:165px;}
.imgarea[pg77="pg77"] div#lnkRow, .imgarea[pg208="pg208"] div#lnkRow, .imgarea[pg332="pg332"] div#lnkRow, .imgarea[pg342="pg342"] div#lnkRow, .imgarea[pg350="pg350"] div#lnkRow, .imgarea[pg367="pg367"] div#lnkRow, .imgarea[pg377="pg377"] div#lnkRow, .imgarea[pg415="pg415"] div#lnkRow, .imgarea[pg418="pg418"] div#lnkRow, .imgarea[pg446="pg446"] div#lnkRow, .imgarea[pg453="pg453"] div#lnkRow, .imgarea[pg499="pg499"] div#lnkRow, .imgarea[pg507="pg507"] div#lnkRow, .imgarea[pg526="pg526"] div#lnkRow, .imgarea[pg549="pg549"] div#lnkRow, .imgarea[pg556="pg556"] div#lnkRow, .imgarea[pg558="pg558"] div#lnkRow, .imgarea[pg585="pg585"] div#lnkRow{top:53px;}
.imgarea[pg77="pg77"] div#divRow, .imgarea[pg208="pg208"] div#divRow, .imgarea[pg332="pg332"] div#divRow, .imgarea[pg342="pg342"] div#divRow, .imgarea[pg350="pg350"] div#divRow, .imgarea[pg367="pg367"] div#divRow, .imgarea[pg377="pg377"] div#divRow, .imgarea[pg415="pg415"] div#divRow, .imgarea[pg418="pg418"] div#divRow, .imgarea[pg446="pg446"] div#divRow, .imgarea[pg453="pg453"] div#divRow, .imgarea[pg499="pg499"] div#divRow, .imgarea[pg507="pg507"] div#divRow, .imgarea[pg526="pg526"] div#divRow, .imgarea[pg549="pg549"] div#divRow, .imgarea[pg556="pg556"] div#divRow, .imgarea[pg558="pg558"] div#divRow, .imgarea[pg585="pg585"] div#divRow{top:113px;}
.imgarea[pg187="pg187"] div#lnkRow{top:60px}
.imgarea[pg187="pg187"] div#divRow{top:115px}
.imgarea[pg221="pg221"] div#lnkRow a:nth-child(7), .imgarea[pg235="pg235"] div#lnkRow a:nth-child(9), .imgarea[pg255="pg255"] div#lnkRow a:nth-child(3), .imgarea[pg267="pg267"] div#lnkRow a:nth-child(7), .imgarea[pg293="pg293"] div#lnkRow a:nth-child(10), .imgarea[pg312="pg312"] div#lnkRow a:nth-child(5), .imgarea[pg359="pg359"] div#lnkRow a:nth-child(11), .imgarea[pg385="pg385"] div#lnkRow a:nth-child(8), .imgarea[pg396="pg396"] div#lnkRow a:nth-child(8), .imgarea[pg404="pg404"] div#lnkRow a:nth-child(10), .imgarea[pg434="pg434"] div#lnkRow a:nth-child(8), .imgarea[pg440="pg440"] div#lnkRow a:nth-child(4), .imgarea[pg458="pg458"] div#lnkRow a:nth-child(4), .imgarea[pg467="pg467"] div#lnkRow a:nth-child(3), .imgarea[pg489="pg489"] div#lnkRow a:nth-child(5), .imgarea[pg502="pg502"] div#lnkRow a:nth-child(7), .imgarea[pg515="pg515"] div#lnkRow a:nth-child(7), .imgarea[pg520="pg520"] div#lnkRow a:nth-child(12), .imgarea[pg523="pg523"] div#lnkRow a:nth-child(8), .imgarea[pg528="pg528"] div#lnkRow a:nth-child(10), .imgarea[pg531="pg531"] div#lnkRow a:nth-child(5), .imgarea[pg534="pg534"] div#lnkRow a:nth-child(7), .imgarea[pg537="pg537"] div#lnkRow a:nth-child(11), .imgarea[pg545="pg545"] div#lnkRow a:nth-child(7), .imgarea[pg551="pg551"] div#lnkRow a:nth-child(7), .imgarea[pg554="pg554"] div#lnkRow a:nth-child(7), .imgarea[pg564="pg564"] div#lnkRow a:nth-child(6), .imgarea[pg566="pg566"] div#lnkRow a:nth-child(10), .imgarea[pg568="pg568"] div#lnkRow a:nth-child(9), .imgarea[pg570="pg570"] div#lnkRow a:nth-child(5), .imgarea[pg575="pg575"] div#lnkRow a:nth-child(8), .imgarea[pg577="pg577"] div#lnkRow a:nth-child(6), .imgarea[pg578="pg578"] div#lnkRow a:nth-child(10), .imgarea[pg580="pg580"] div#lnkRow a:nth-child(7), .imgarea[pg583="pg583"] div#lnkRow a:nth-child(8), .imgarea[pg586="pg586"] div#lnkRow a:nth-child(2), .imgarea[pg587="pg587"] div#lnkRow a:nth-child(10), .imgarea[pg589="pg589"] div#lnkRow a:nth-child(3), .imgarea[pg590="pg590"] div#lnkRow a:nth-child(2), .imgarea[pg591="pg591"] div#lnkRow a:nth-child(8), .imgarea[pg592="pg592"] div#lnkRow a:nth-child(5), .imgarea[pg593="pg593"] div#lnkRow a:nth-child(3), .imgarea[pg594="pg594"] div#lnkRow a:nth-child(6), .imgarea[pg595="pg595"] div#lnkRow a:nth-child(2), .imgarea[pg595="pg595"] div#lnkRow a:nth-child(9), .imgarea[pg596="pg596"] div#lnkRow a:nth-child(6), .imgarea[pg596="pg596"] div#lnkRow a:nth-child(11), .imgarea[pg597="pg597"] div#lnkRow a:nth-child(3), .imgarea[pg597="pg597"] div#lnkRow a:nth-child(7), .imgarea[pg598="pg598"] div#lnkRow a:nth-child(4), .imgarea[pg598="pg598"] div#lnkRow a:nth-child(7), .imgarea[pg599="pg599"] div#lnkRow a:nth-child(6), .imgarea[pg599="pg599"] div#lnkRow a:nth-child(10), .imgarea[pg600="pg600"] div#lnkRow a:nth-child(4), .imgarea[pg600="pg600"] div#lnkRow a:nth-child(9), .imgarea[pg601="pg601"] div#lnkRow a:nth-child(3), .imgarea[pg601="pg601"] div#lnkRow a:nth-child(7), .imgarea[pg602="pg602"] div#lnkRow a:nth-child(4), .imgarea[pg602="pg602"] div#lnkRow a:nth-child(8), .imgarea[pg603="pg603"] div#lnkRow a:nth-child(4), .imgarea[pg603="pg603"] div#lnkRow a:nth-child(7), .imgarea[pg604="pg604"] div#lnkRow a:nth-child(3), .imgarea[pg604="pg604"] div#lnkRow a:nth-child(6){margin-top:136px}
.imgarea[pg221="pg221"] div#divRow div:nth-child(7), .imgarea[pg235="pg235"] div#divRow div:nth-child(9), .imgarea[pg255="pg255"] div#divRow div:nth-child(3), .imgarea[pg267="pg267"] div#divRow div:nth-child(7), .imgarea[pg293="pg293"] div#divRow div:nth-child(10), .imgarea[pg312="pg312"] div#divRow div:nth-child(5), .imgarea[pg359="pg359"] div#divRow div:nth-child(11), .imgarea[pg385="pg385"] div#divRow div:nth-child(8), .imgarea[pg396="pg396"] div#divRow div:nth-child(8), .imgarea[pg404="pg404"] div#divRow div:nth-child(10), .imgarea[pg434="pg434"] div#divRow div:nth-child(8), .imgarea[pg440="pg440"] div#divRow div:nth-child(4), .imgarea[pg458="pg458"] div#divRow div:nth-child(4), .imgarea[pg467="pg467"] div#divRow div:nth-child(3), .imgarea[pg489="pg489"] div#divRow div:nth-child(5), .imgarea[pg502="pg502"] div#divRow div:nth-child(7), .imgarea[pg515="pg515"] div#divRow div:nth-child(7), .imgarea[pg520="pg520"] div#divRow div:nth-child(12), .imgarea[pg523="pg523"] div#divRow div:nth-child(8), .imgarea[pg528="pg528"] div#divRow div:nth-child(10), .imgarea[pg531="pg531"] div#divRow div:nth-child(5), .imgarea[pg534="pg534"] div#divRow div:nth-child(7), .imgarea[pg537="pg537"] div#divRow div:nth-child(11), .imgarea[pg545="pg545"] div#divRow div:nth-child(7), .imgarea[pg551="pg551"] div#divRow div:nth-child(7), .imgarea[pg554="pg554"] div#divRow div:nth-child(7), .imgarea[pg564="pg564"] div#divRow div:nth-child(6), .imgarea[pg566="pg566"] div#divRow div:nth-child(10), .imgarea[pg568="pg568"] div#divRow div:nth-child(9), .imgarea[pg570="pg570"] div#divRow div:nth-child(5), .imgarea[pg575="pg575"] div#divRow div:nth-child(8), .imgarea[pg577="pg577"] div#divRow div:nth-child(6), .imgarea[pg578="pg578"] div#divRow div:nth-child(10), .imgarea[pg580="pg580"] div#divRow div:nth-child(7), .imgarea[pg583="pg583"] div#divRow div:nth-child(8), .imgarea[pg586="pg586"] div#divRow div:nth-child(2), .imgarea[pg587="pg587"] div#divRow div:nth-child(10), .imgarea[pg589="pg589"] div#divRow div:nth-child(3), .imgarea[pg590="pg590"] div#divRow div:nth-child(2), .imgarea[pg591="pg591"] div#divRow div:nth-child(8), .imgarea[pg592="pg592"] div#divRow div:nth-child(5), .imgarea[pg593="pg593"] div#divRow div:nth-child(3), .imgarea[pg594="pg594"] div#divRow div:nth-child(6), .imgarea[pg595="pg595"] div#divRow div:nth-child(2), .imgarea[pg595="pg595"] div#divRow div:nth-child(9), .imgarea[pg596="pg596"] div#divRow div:nth-child(6), .imgarea[pg596="pg596"] div#divRow div:nth-child(11), .imgarea[pg597="pg597"] div#divRow div:nth-child(3), .imgarea[pg597="pg597"] div#divRow div:nth-child(7), .imgarea[pg598="pg598"] div#divRow div:nth-child(4), .imgarea[pg598="pg598"] div#divRow div:nth-child(7), .imgarea[pg599="pg599"] div#divRow div:nth-child(6), .imgarea[pg599="pg599"] div#divRow div:nth-child(10), .imgarea[pg600="pg600"] div#divRow div:nth-child(4), .imgarea[pg600="pg600"] div#divRow div:nth-child(9), .imgarea[pg601="pg601"] div#divRow div:nth-child(3), .imgarea[pg601="pg601"] div#divRow div:nth-child(7), .imgarea[pg602="pg602"] div#divRow div:nth-child(4), .imgarea[pg602="pg602"] div#divRow div:nth-child(8), .imgarea[pg603="pg603"] div#divRow div:nth-child(4), .imgarea[pg603="pg603"] div#divRow div:nth-child(7), .imgarea[pg604="pg604"] div#divRow div:nth-child(3), .imgarea[pg604="pg604"] div#divRow div:nth-child(6){margin-top:110px}
div#divRow>div .sp-replacer{
    top: 22px;
    left: 1px;
}
div#divRow > div:empty {
    border-color: transparent;
    height: 48px;
    z-index:0;
}
div#divRow > div > div[contenteditable="true"] {
    border-bottom: 1px solid #000;
    margin: 0 -10px;
    padding: 0 10px;
    outline: 0
}
div#divRow>div> div[contenteditable="true"]{border-bottom:1px solid #000;margin:0 -10px;padding:0 10px;outline:0}
body div#divRow>div>#editDiv{font-family: 'Quran2020A' !important;font-size:27px;}
#myWordslist, #myWordslist td {font-size:20px}
#editDiv + #divWords {
    position: absolute;
    top: 91px;
    left:-1px;
    right: -1px;
    padding: 0 5px;
}

#editDiv + div#divWords ul {
    text-align: right;
}

#editDiv + div#divWords li {
    display: inline-block;
    float: none;
}
.main_container.jpar #lnkEditProfile {
    position: static;
    margin:0 10px;
}
.main_container.jpar .main_container.jpar #LnkBtnLogOut {
    position: static;
}
.main_container.jpar #lbtnSetArabic {
    position: static;
    margin-right: 10px !important;
}
.main_container.jpar .link-separator {
    position: static;
    margin-top: 2px;
}
.main_container.jpar #lbtnSetEnglish, .main_container.jpar #LnkBtnLogOut {
    position: static;
}
.main_container.jpar .breadcrumbLinks + .headingarea{direction:ltr;}
.main_container.jpar .menu_section > ul{margin-right:10px !important;}
.main_container.jpar .nav.side-menu > li {
    width: 100%;
}
.nav-sm .main_container.jpar .nav.side-menu li a {
    padding: 10px 0 5px !important;
}
.main_container.jpar .logo-cont img {
    margin-top: 5px !important;
    max-height: 45px;
}
@media screen and (max-width:1120px){
    .DashboradBody .main_container.jpar .link-cont.LangChanger {
        margin: 0 !important;
    }
}
@media screen and (max-width:991px) {
    .DashboradBody .main_container.jpar .link-cont.LangChanger {
        width:unset !important;padding:0 !important;
    }
}
@media screen and (max-width:767px) {
    .nav-sm .container.body .main_container.jpar .right_col[role="main"]{margin:0 !important;}
    .main_container.jpar nav.navbar.pull-right {
        float: left !important;
        width: 100%;
        justify-content: center;
    }
    .main_container.jpar .nav.side-menu > li a{width:80px !important;}
    .main_container.jpar .logo-cont{text-align:center;margin:10px 0}
}
@media screen and (max-width:991px) {
#signInPopup .modal-dialog{max-width:700px !important;width:96%;}
}
@media screen and (max-width:767px) {
#signInPopup .modal-body .row>div:not(.signup-social){width:100%;flex:0 0 100%;padding:0 1.5rem !important}
#signInPopup .modal-body .row>div.or{text-align:center;position:relative;padding:15px 1.5rem !important;right:0;}
.or span{background:#e1b12c;position:relative;padding:0 10px}
#signInPopup .modal-body .row>div.or::before{content:"";height:1px;background:#dee2e6!important;position:absolute;top:50%;left:1.5rem;right:1.5rem}
#signInPopup .modal-body .row>div.border-left{border-left:0 !important;}
#signInPopup .modal-body .row .form-row{margin-left:0 !important;margin-right:0 !important;}
#signInPopup .modal-dialog .modal-content .modal-body .ForgotPassword{margin-left:0 !important;padding:0 !important;}
#googleSignIn {background:#DE4B39;}
a[onclick="FBLogin();"]{background:#3B5999;}
}

.hide {
    display: none;
}
th.colToRemoveAtRoot, td.colToRemoveAtRoot {
    width: 25px;
}
#tblCourseStudentSettings td.courseSetting .float-right {
    float: right !important;
}
.fb-login {
    margin-bottom: 18px;
}

    .fb-login img, #googleSignIn img {
        width: 272px;
        height: 54px;
        object-fit: cover;
        border-radius: 3px;display:block;
    }
@media only screen and (max-width: 576px) {
    th.colToRemoveAtRoot, td.colToRemoveAtRoot {
        display: none !important;
    }
}