/* 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; 
    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;
}

/* End Cookie */

/* Mobile Tab Menu Start */


@media (max-width: 767px) {

    #tajweedMainPage .TajweedMainMobile {
        width: 100% !important;
        margin: 0 !important;
        padding-bottom: 15px !important;
    }

    .b-1 {
        width: 50%;
        float: left;
    }

    .b-2 {
        width: 48%;
        margin-left: 2%;
        float: left;
        text-align: left !important;
        margin-top: 25px;
        font-size: 14px;
    }

    #tajweedMainPage {
        padding-bottom: 20px;
    }
}


@media (max-width: 991px) {

    .vidDetails, .mobiViewVideos {
        width: 50% !important;
    }

    #SimplifiedTajweed {
        height: 172px;
        overflow-y: scroll;
    }


    #videoDetailMobile {
        margin-bottom: 30px;
    }

    .vidDuration {
        font-size: 12px;
    }

    #tutorialVideoArea {
        padding: 0px 5px !important;
    }

        #tutorialVideoArea .mobView {
            padding-right: 0px !important;
            padding-left: 0px !important;
        }

    #mobileNav li {
        width: 100% !important;
    }

    #mobileNav {
        padding: 0px 0px 0px 30px;
    }

    .vidList {
        display: none !important;
    }

    .VideoObjectives {
        display: none !important;
    }

    .downloadVideo {
        display: none !important;
    }

    .vidDetails b {
        text-transform: uppercase;
    }

    .mobileTabs {
        height: 250px;
    }

        .mobileTabs ul li {
            width: 48% !important;
            float: left;
        }

    .moibleTabsUl > li.active > a, .moibleTabsUl > li.active > a:hover, .moibleTabsUl > li.active > a:focus {
        color: #FFFFFF;
        cursor: default;
        background-color: #c39b51 !important;
        border: 1px solid #ddd;
        border-bottom-color: transparent;
        font-weight: bold;
        border: 2px solid #c39b51 !important;
        border-radius: 0px !important;
        font-size: 11px;
    }


    .moibleTabsUl > li > a {
        margin-right: 2px;
        line-height: 1.42857143;
        border-radius: 0px !important;
        border: 2px solid #c39b51 !important;
        color: #c39b51;
        font-weight: bold;
        font-size: 11px;
        background-color: #FFFFFF;
        padding: 10px 11px !important;
    }


    .moibleTabsUl {
        margin-left: 4%;
        position: sticky;
        top: 0;
        z-index: 999999;
    }

    .line {
        width: 102%;
        height: 2px;
        background-color: #c39b51;
        margin-top: -2px;
        position: absolute;
        margin-left: -3% !important;
        padding: 0px !important;
        overflow: hidden !important;
    }
}

@media (min-width: 992px) {

    .mobileTabs {
        display: none;
    }
}


.VideoLink {
    border: none !important;
}

.vidList {
    border-left: 1px solid #ccc;
}

/* obile Tab Menu End */

.videoObjectives {
    height: 530px;
    overflow-y: scroll;
}

.VideoLink {
    height: 530px;
}

.videosList {
    height: 530px;
    overflow-y: scroll;
}

.mobiView {
    width: 100%;
    height: 416px;
}


::-webkit-scrollbar-track {
    background: #ccc;
}


::-webkit-scrollbar-thumb {
    background: #888;
}



#tutorialVideoArea .tajweedMainBox,
#tutorialVideoArea .tajweedMainBoxTopTwo {
    cursor: pointer;
}

/* Tajveed Video Detail Page Start */

@media (max-width: 768px) {
    .videoDetail .col-sm-12 {
        width: 100% !important;
    }
}

@media (min-width: 992px) {
    .vidList {
        height: 545px;
        overflow-y: scroll;
    }

    .VideoObjectives {
        border-right: 1px solid #ccc;
        height: 545px;
        overflow-y: scroll;
    }

    .VideoLink {
        height: 545px;
    }
}

.VideoLink {
    border-right: 1px solid #ccc;
}

    .VideoLink h5 {
        text-transform: uppercase;
        font-weight: bold;
        color: #b9820d;
    }

/*.vidList{height:545px; overflow-y:scroll;}*/
.vidList .col-xs-6 {
    padding: 0px !important;
}

.vidList .col-xs-5 {
    padding: 0px 0px 0px 5px !important;
}

.vidDuration {
    text-align: right;
    padding-top: 10px;
}

.downloadVideo {
    margin-left: 22%;
    padding: 7px;
    color: black;
    font-weight: bold;
    text-align: center;
    float: left;
}

.TV_DownloadQuranUniversityMobileAppQurani {
    margin-top: 5px;
}

.moreVid {
    border: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    margin-top: 10px;
}

    .moreVid .panel-body {
        padding: 0px !important;
        border-bottom: 1px solid #ccc !important;
    }

.VideoObjectives {
    border-right: 1px solid #ccc;
}

.objList {
    padding: 0px;
}

    .objList li {
        font-size: 12px;
    }


/* Tajveed Video Detail Page End */

/* Updation 27/05/18 Start */

.mobiViewVideos {
    margin-bottom: 10px;
}

.zoom {
    transition: transform .2s; /* Animation */
    -webkit-transition: transform .2s; /* Animation */
}

    .zoom:hover {
        transform: scale(1.3); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        -webkit-transform: scale(1.3); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        z-index: 9999999 !important;
    }


.VidTitle {
    text-align: center;
    text-decoration: none;
    color: #000;
}



#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-xs-6 {
    /*background-color:#3498db !important;
	border: 1px solid #3498db !important;*/
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}




#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-xs-6 {
    /*background-color:#dbf1ff !important;
	border: 1px solid #3498db !important;*/
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}



#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}


#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}


#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-md-2,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-sm-6,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-xs-6 {
    padding: 0px 0 0px 0;
    text-align: center;
    margin: 5px;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}


@media (min-width: 768px) {
    .centerAdjust {
        margin-left: 33.1% !important;
    }

    .centerAdjustLast {
        margin-left: 35.6% !important;
    }
}


@media (min-width: 767px) {


    #tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow {
        margin-left: 10%;
    }
}



@media (max-width: 767px) {
    .col-xs-12 {
        width: 48%;
    }
}

@media (max-width: 549px) {

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-xs-6 {
        margin-left: 25%;
    }



    #tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-xs-6 {
        margin-left: 25%;
    }



    #tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-xs-6 {
        margin-left: 25%;
    }

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-xs-6 {
        margin-left: 25%;
    }

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-xs-6 {
        margin-left: 25%;
    }

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-xs-6 {
        margin-left: 25%;
    }

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-xs-6 {
        margin-left: 25%;
    }

    #tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-md-2,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-sm-6,
    #tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-xs-6 {
        margin-left: 25%;
    }
}


@media (max-width: 991px) {
    .col-sm-6 {
        width: 48% !important;
    }
}

@media (max-width: 549px) {
    .col-sm-6 {
        width: 100% !important;
    }
}

/* Updation 27/05/18 End */

.Vidinfo {
    margin: 0 !important;
}

.catplaybtn {
    position: absolute;
    background-color: #000;
    width: 98%;
    height: 100%;
    opacity: 0.7;
}

    .catplaybtn i {
        color: #fff;
        margin: 27% 31% 26% 48%;
    }

.objinfo {
    float: left;
}

.durationinfo {
    float: right;
}

.catModal {
    padding: 0px 15px 5px 15px !important;
}

.borderClear {
    border: none !important;
}

.modalAside {
    background-color: #ecf0f1;
    height: 389px;
}


.playbtn {
    position: absolute;
    background-color: #000;
    width: 95%;
    height: 95%;
    opacity: 0.7;
}

    .playbtn i {
        color: red;
        margin: 30% 30% 26% 44%;
    }

.modal-title span {
    margin-right: 5px;
}

.img-responsive img {
    width: 100%;
}

.modal-title {
    color: #bd912f;
    text-transform: uppercase;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .firstRow .col-xs-3 {
    background-color: #3498db !important;
    border: 1px solid #3498db !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

.MainAnchor .close {
    color: #931d11 !important;
    opacity: 1.0 !important;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .secondRow .col-xs-3 {
    background-color: #dbf1ff !important;
    border: 1px solid #3498db !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .thirdRow .col-xs-3 {
    background-color: #cbfff5 !important;
    border: 1px solid #16a085 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .forthRow .col-xs-3 {
    background-color: #ffe6cf !important;
    border: 1px solid #d35400 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .fifthRow .col-xs-3 {
    background-color: #ffe6cf !important;
    border: 1px solid #d35400 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .sixthRow .col-xs-3 {
    background-color: #ffe6cf !important;
    border: 1px solid #d35400 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .seventhRow .col-xs-3 {
    background-color: #ffe6cf !important;
    border: 1px solid #d35400 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-md-1,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-sm-3,
#tutorialVideoArea .container .tutorialVideoArea .mainCon .eighthRow .col-xs-3 {
    background-color: #ffe6cf !important;
    border: 1px solid #d35400 !important;
    padding: 30px 0 30px 0;
    text-align: center;
    margin: 5px;
}

#banner {
    width: 100%;
    float: left;
    margin: -10px 0px 0px 0px;
    padding: 20px 0px 0px 0px;
    background: url(../images/Bannerbg.jpg) top repeat-x;
}

    #banner div.container {
        position: relative;
        padding: 0px;
    }

        #banner div.container .callusbuttons {
            min-width: 10px;
            float: left;
            margin: 0px;
            padding: 0px;
            position: absolute;
            top: 20px;
            left: 12%;
        }

            #banner div.container .callusbuttons a {
                min-width: 10px;
                float: left;
                margin: 0px 5px;
                padding: 10px;
                background: #fff;
                color: #407625;
                font-weight: bold;
                text-transform: uppercase;
                text-align: center;
                font-size: 14px;
                border-radius: 5px;
            }

                #banner div.container .callusbuttons a:hover {
                    background: #407625;
                    color: #fff;
                    text-decoration: none;
                }


        #banner div.container img.bannerlaptop {
            float: right;
        }

        #banner div.container .bannerdescriptionarea {
            width: 45%;
            float: left;
            margin: 0px;
            padding: 0px;
            position: absolute;
            top: 90px;
            left: 0px;
        }

            #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper {
                width: 100%;
                float: left;
                margin: 0px;
                padding: 0px;
                position: relative;
            }

                #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg,
                #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg img {
                    width: 100%;
                    z-index: 1000;
                }

                #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
                    width: 50%;
                    float: left;
                    margin: -5px 25% 0px;
                    padding: 10px;
                    border-radius: 10px;
                    font-weight: bold;
                    font-size: 18px;
                    color: #fff;
                    line-height: 24px;
                    text-align: center;
                    background: #356217;
                }

                    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton span {
                        width: 100%;
                        float: left;
                        font-size: 20px;
                        color: #806004;
                        line-height: 20px;
                    }

#content,
#tutorialVideoArea {
    width: 100%;
    float: left;
    margin: 0px 0px 20px 0px;
    padding: 20px 0px;
}

#tutorial {
    width: 100%;
    float: left;
    margin: 0px 0px 0px 0px;
    padding: 50px 0px 0px;
}

    #content .container .headingarea,
    #tutorial .container .headingarea {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px;
        text-align: center;
    }

        #content .container .headingarea .headingareatop,
        #tutorial .container .headingarea .headingareatop {
            width: 100%;
            float: left;
            margin: 0px 0px 0px 0px;
            padding: 0px;
            text-align: center;
            font-weight: 300 !important;
            color: #2c3e50;
            font-size: 36px;
        }

            #content .container .headingarea .headingareatop img,
            #tutorial .container .headingarea .headingareatop img {
                margin: 0px 20px;
            }

        #content .container .headingarea .headingareabottom,
        #tutorial .container .headingarea .headingareabottom {
            width: 100%;
            float: left;
            margin: 0px 0px 20px 0px;
            padding: 0px;
            text-align: center;
            font-weight: normal;
            color: #7f8c8d;
            font-size: 15px;
        }


#content .container > .col-lg-6.col-md-6 {
    padding: 50px 85px;
}



#content .container .col-lg-6.col-md-6.text-center {
    text-align: center;
}

#content .container .col-lg-6.col-md-6 .orangeheading {
    width: 100%;
    float: left;
    margin: 0px 0px 0px 0px;
    padding: 10px;
    text-align: center;
    font-weight: normal;
    color: #c55a11;
    font-size: 20px;
    background: #fffdef;
    border-radius: 15px;
    border: 1px solid #7d3c16;
}

    #content .container .col-lg-6.col-md-6 .orangeheading.marginbottom30 {
        margin-bottom: 30px;
    }

#content .container .col-lg-6.col-md-6 .watchvideobutton {
    min-width: 10px;
    float: right;
    margin: 10px 0px;
    padding: 8px 5px;
    text-align: center;
    font-weight: normal;
    color: #fff;
    font-size: 17px;
    background: #ffc528;
}

    #content .container .col-lg-6.col-md-6 .watchvideobutton i.fa {
        margin-right: 5px;
    }

    #content .container .col-lg-6.col-md-6 .watchvideobutton:hover {
        background: #333;
        text-decoration: none;
    }

#content .container .col-lg-6.col-md-6 .explorebox {
    width: 100%;
    float: left;
    margin: 0px;
    padding: 30px;
    border-radius: 35px;
    background: #fffdef;
    border: 1px solid #7d3c16;
}

#content .container .col-lg-6.col-md-6.text-center .explorebox {
    padding: 15px 30px;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow {
    width: 100%;
    float: left;
    margin: 0px;
    padding: 0px 0px 30px 0px;
    position: relative;
}

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow:nth-child(3) {
        padding-bottom: 0px;
    }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px 10% 0px 0px;
        font-size: 16px;
        color: #0e6107;
        line-height: 24px;
        display: list-item;
    }

#content .container .col-lg-6.col-md-6.text-center .explorebox .explorerow .text {
    display: block;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text strong.red {
    color: #ce0202;
    font-weight: inherit;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text strong.green {
    color: #67db19;
    font-weight: inherit;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text strong.black {
    color: #000;
    font-weight: inherit;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text strong.bigblue {
    color: #2e75b6;
    font-weight: bold;
    font-size: 24px;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text strong.bigorange {
    color: #c55a11;
    font-weight: bold;
    font-size: 24px;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
    position: absolute;
    top: 0px;
    left: 96%;
}

#content .container .col-lg-6.col-md-6 .explorebox .explorerow:nth-child(2) .text img.outofboxright, #content .container .col-lg-6.col-md-6 .explorebox .explorerow:nth-child(3) .text img.outofboxright {
    top: 5px;
}

#content .container .featuresanddetails {
    width: 100%;
    float: left;
    margin: 30px 0px 100px 0px;
    padding: 0px;
}

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(1) {
        padding-right: 50px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) {
        padding: 0px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 20px 35px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) .featurebox {
        margin: 26px 0px 0px 25px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .blueheading {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        text-align: left;
        font-weight: bold;
        color: #2c3e50;
        font-size: 18px;
        position: relative;
    }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .blueheading .hexagon {
            width: 57px;
            float: left;
            margin: 0px;
            padding: 10px;
            text-align: center;
            font-weight: bold;
            color: #fff;
            font-size: 20px;
            height: 60px;
            line-height: 42px;
            position: absolute;
            top: -16px;
            left: -64px;
        }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .featureorangeheading {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
        font-size: 18px;
        color: #c55a11;
        line-height: 22px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
        font-size: 13px;
        color: #34495e;
        line-height: 18px;
        text-align: justify;
    }


        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.red {
            color: #ce0202;
            font-weight: inherit;
        }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.green {
            color: #67db19;
            font-weight: inherit;
        }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.black {
            color: #000;
            font-weight: inherit;
        }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.yellow {
            color: #db9f0f;
            font-weight: inherit;
        }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.blue {
            color: #0474e4;
            font-weight: inherit;
        }

        #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .text strong.purple {
            color: #4d24ff;
            font-weight: inherit;
        }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .readmore {
        min-width: 10px;
        float: right;
        margin: 0px;
        padding: 0px 0px 0px 0px;
        font-size: 12px;
        color: #2b9ae0;
        line-height: 22px;
        text-decoration: none;
    }

#content .container .headingarea .hexaheading {
    width: 100%;
    float: left;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    text-align: center;
    font-weight: 400;
    color: #2c3e50;
    font-size: 36px;
    text-transform: uppercase;
}

    #content .container .headingarea .hexaheading span.headingtext {
        position: relative;
    }

        #content .container .headingarea .hexaheading span.headingtext span.hexanumber {
            width: 57px;
            margin: 0px;
            padding: 10px;
            text-align: center;
            font-weight: bold;
            color: #fff;
            font-size: 20px;
            height: 60px;
            line-height: 42px;
            position: absolute;
            top: -10px;
            left: -60px;
        }

#content .container .studytoolarea {
    width: 100%;
    float: left;
    margin: 30px 0px 100px 0px;
    padding: 0px;
}

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 35px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
        min-height: 251px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(1) .studybox:nth-child(2) {
        padding: 47px 35px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(1) {
        padding: 43px 35px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 {
        font-weight: 400;
        color: #c55a11;
        padding-top: 20px;
        font-size: 30px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8.paddingnone, #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5.paddingnone {
        padding: 0px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 img {
        width: 100%;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5.paddingnone img.smalllaptop {
        float: right;
        margin-top: 20px;
        width: 100%;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxheading {
        width: 100%;
        float: left;
        margin: 10px 0px 0px;
        padding: 0px;
        font-weight: 400;
        color: #000000;
        font-size: 24px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxtext {
        width: 100%;
        float: left;
        margin: 0px 0px;
        padding: 0px;
        font-weight: normal;
        color: #36502c;
        font-size: 15px;
        text-align: justify;
    }

        #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxtext strong {
            color: #b93805;
            font-weight: inherit;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox img.webbased {
        position: absolute;
        bottom: 5px;
        right: 5px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) {
        padding: 0px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox img.mobileinhand {
        float: right;
    }

#content .container .hafarea {
    width: 100%;
    float: left;
    margin: 60px 0px 100px 0px;
    padding: 0px;
}

    #content .container .hafarea .col-lg-6.col-md-6 .studybox {
        width: 100%;
        float: left;
        margin: 0px 0px 40px 0px;
        padding: 25px 35px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
        min-height: 170px;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li {
            list-style: disc;
            width: 100%;
            float: left;
        }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul {
            padding: 0px;
        }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul.paddingtop {
                padding: 25px 0px 0px 0px;
            }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li p {
                font-size: 18px;
                color: #0e6107;
                margin: 0px;
            }

                #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li p strong {
                    color: #b28806;
                    font-weight: inherit;
                }

                #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p strong {
                    color: #b93805;
                    font-weight: inherit;
                }

                    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p strong.blue {
                        color: #0474e4;
                        font-weight: inherit;
                    }

                    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p strong.black {
                        color: #000;
                        font-weight: inherit;
                    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 {
            padding: 0px;
        }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 img, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 > img {
                max-width: 100%;
                float: right;
                margin-top: 00px;
            }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 > img {
                margin-top: 25px;
            }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxheading {
            width: 100%;
            float: left;
            margin: 10px 0px 0px;
            padding: 0px; 
            font-weight: 400;
            color: #000000;
            font-size: 24px;
        }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxtext {
            width: 100%;
            float: left;
            margin: 0px 0px;
            padding: 0px; 
            font-weight: normal;
            color: #36502c;
            font-size: 16px;
            text-align: justify;
        }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 .studyboxtext strong {
                color: #b93805;
                font-weight: inherit;
            }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox img.webbased {
            position: absolute;
            bottom: 5px;
            right: 5px;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) {
        padding: 20px 25px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox img.mobileinhand {
        float: right;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul {
        padding: 0px 0px 10px 40px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul {
        padding: 0px;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li p {
            font-size: 18px;
            color: #0e6107;
            margin: 0px;
        }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul li p strong, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li p strong {
                color: #c55a11;
                font-weight: inherit;
            }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton {
        min-width: 10px;
        float: right;
        margin: 10px 0px;
        padding: 5px 5px;
        text-align: center; 
        font-weight: normal;
        color: #fff;
        font-size: 17px;
        background: #ffc528;
        position: absolute;
        top: 0px;
        left: 15px;
        z-index: 100;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton:hover, #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) .watchvideobutton:hover {
            background: #333;
            text-decoration: none;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) {
        padding: 10px 35px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .felxpaymentheading {
        width: 100%;
        float: left;
        margin: 0px 0px 20px;
        padding: 0px; 
        font-weight: normal;
        color: #2c3e50;
        font-size: 18px;
        text-align: center;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul {
        margin: 0px;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul p {
            padding-right: 25px;
        }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li p { 
            font-size: 15px;
            color: #0e6107;
            margin: 0px;
            line-height: 20px;
        }

            #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li p strong {
                color: #c55a11;
            }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li a.readmore { 
            font-size: 12px;
            color: #0b64b7;
            margin: 10px 0px 0px;
            line-height: 20px;
            min-width: 10px;
            float: left;
        }

#content .container .aciarea {
    width: 100%;
    float: left;
    margin: 30px 0px 100px 0px;
    padding: 0px;
}

    #content .container .aciarea .aciareabox {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 25px 35px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
        overflow: hidden;
    }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p {
            width: 100%;
            float: left;
            margin: 0px 0px;
            padding: 20px 0px; 
            font-weight: normal;
            color: #165403;
            font-size: 18px;
            text-align: center;
        }

            #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p strong.red, #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p .bigtext strong.red {
                color: #c50809;
                font-weight: normal;
            }

            #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p .bigtext {
                font-size: 24px;
            }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 img {
            max-width: 100%;
        }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p b {
            font-weight: bold;
        }

            #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p b.green {
                color: #165403;
            }

            #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p b.red {
                color: #c70808;
            }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p strong.mud {
            color: #997400;
            font-weight: inherit;
        }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p strong.orange {
            color: #ba5f1c;
            font-weight: inherit;
        }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p strong.red {
            color: #c70808;
            font-weight: inherit;
        }

        #content .container .aciarea .aciareabox:nth-child(2) .col-lg-6.col-md-6:nth-child(2) p {
            margin: 0px;
            padding: 0px;
        }

            #content .container .aciarea .aciareabox:nth-child(2) .col-lg-6.col-md-6:nth-child(2) p:nth-child(1) {
                font-size: 24px;
            }

            #content .container .aciarea .aciareabox:nth-child(2) .col-lg-6.col-md-6:nth-child(2) p:nth-child(2) {
                margin: 10px 0px;
            }

        #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton {
            width: 40%;
            float: right;
            margin: 10px 30%;
            padding: 8px 5px;
            text-align: center; 
            font-weight: normal;
            color: #fff;
            font-size: 17px;
            background: #ffc528;
        }

            #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton i.fa {
                margin-right: 5px;
            }

#content .container .registrationstepsarea {
    width: 100%;
    float: left;
    margin: 30px 0px 0px 0px;
    padding: 0px;
}

    #content .container .registrationstepsarea .col-lg-6.col-md-6:nth-child(1) {
        padding: 0px;
    }

    #content .container .registrationstepsarea .orangeheading, #content .container .registrationstepsarea .col-lg-6.col-md-6 .orangeheading {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 0px 0px;
        text-align: center; 
        font-weight: normal;
        color: #c55a11;
        font-size: 24px;
    }

    #content .container .registrationstepsarea .registrationstepsbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 25px 35px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
    }

        #content .container .registrationstepsarea .registrationstepsbox img, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox img {
            max-width: 100%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
            width: 168px;
            float: left;
            margin: 0px;
            padding: 10px;
            background: #6dab31;
            border-radius: 3px;
            position: absolute;
            top: 5%;
            left: 28%;
        }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.two {
                top: 16.5%;
                left: 56%;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.three {
                top: 47.5%;
                left: 64%;
                cursor: pointer;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.four {
                top: 59%;
                left: 29%;
                width: 250px;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.five {
                top: 69.5%;
                left: 64%;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.six {
                top: 79.5%;
                left: 29%;
                width: 250px;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven {
                top: 90.5%;
                left: 64%;
                cursor: pointer;
            }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
            left: 15%;
            width: 120px;
        }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
                top: 16.5%;
                left: 60%;
            }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three {
                top: 46.5%;
                left: 74%;
            }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four {
                top: 57%;
                left: 25%;
                width: 150px;
            }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five {
                top: 66.5%;
                left: 74%;
            }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
                top: 76%;
                left: 25%;
                width: 150px;
            }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
                top: 90.5%;
                left: 74%;
            }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
            top: 8%;
            left: 30%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.nine {
            top: 19%;
            left: 56%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
            top: 69%;
            left: 20%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eleven {
            top: 69%;
            left: 69%;
            width: auto;
        }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.eight {
            top: 8%;
            left: 10%;
            width: auto;
        }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.nine {
            top: 19%;
            left: 70%;
            width: auto;
        }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.ten {
            top: 80%;
            left: 2%;
            width: auto;
        }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.eleven {
            top: 80%;
            left: 80%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox:after, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox:after {
            content: '';
            position: absolute;
            border-style: solid;
            border-color: transparent #6dab31;
            display: block;
            width: 0;
            z-index: 1;
            margin-top: -14px;
            top: 60%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.rightarrow:after, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.rightarrow:after {
            right: -10px;
            border-width: 7px 0 7px 10px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.leftarrow:after, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.leftarrow:after {
            left: -10px;
            border-width: 7px 10px 7px 0px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .greenboxwrapper, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .greenboxwrapper {
            width: 100%;
            float: left;
            margin: 0px;
            padding: 0px;
            position: relative; 
            font-size: 12px;
            text-transform: uppercase;
            font-weight: 600;
            color: #fff;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
            width: 600px;
            float: left;
            margin: 0px;
            padding: 10px;
            position: absolute;
            top: -150px;
            left: -590px;
            display: none;
            z-index: 500;
        }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2 {
                width: 600px;
                float: left;
                margin: 0px;
                padding: 10px;
                position: absolute;
                top: -700px;
                left: -590px;
                display: none;
                z-index: 500;
            }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox:hover .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox:hover .hoverbox {
            display: block;
        }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox:hover .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox:hover .hoverbox.hoverbox2 {
                display: block;
            }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .orangeheading, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .orangeheading {
            width: 100%;
            float: left;
            margin: 0px 0px 20px 0px;
            padding: 0px 0px 0px 0px;
            text-align: center; 
            font-weight: normal;
            color: #c55a11;
            font-size: 20px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox {
            width: 100%;
            float: left;
            margin: 0px 0px 20px 0px;
            padding: 25px 35px;
            border-radius: 35px;
            background: #fffdef;
            border: 1px solid #7d3c16;
            position: relative;
        }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext {
                width: 100%;
                float: left;
                margin: 0px 0px 0px 0px;
                padding: 20px;
                text-align: center; 
                font-weight: normal;
                color: #2c3e50;
                font-size: 18px;
                position: relative;
            }

                #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span,
                #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span {
                    position: absolute;
                    bottom: -30px;
                    left: 0px;
                }

                    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton,
                    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton {
                        min-width: 10px;
                        float: left;
                        margin: 0px;
                        padding: 8px;
                        text-align: center; 
                        font-weight: normal;
                        color: #fff;
                        font-size: 17px;
                        background: #ffc528;
                    }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton,
            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton {
                width: 40%;
                float: left;
                margin: 10px 30%;
                padding: 15px;
                text-align: center; 
                font-weight: normal;
                color: #fff;
                font-size: 17px;
                background: #ffc528;
            }

                #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton:hover,
                #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton:hover,
                #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton:focus,
                #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton:focus,
                #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton:hover,
                #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton:hover,
                #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton:focus,
                #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton:focus {
                    background: #333;
                    color: #fff;
                    text-decoration: none;
                }


            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span a, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span a {
                color: #c60c0c;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext strong.red, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext strong.red {
                color: #c60c0c;
                font-weight: normal;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox img, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox img {
                width: 100%;
            }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .curriculumheading,
    #content .container .registrationstepsarea .col-lg-8.col-md-8 .curriculumheading {
        width: 100%;
        float: left;
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 0px 0px;
        text-align: left; 
        font-weight: normal;
        color: #c55a11;
        font-size: 24px;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 p,
    #content .container .registrationstepsarea .col-lg-8.col-md-8 p {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px;
        font-size: 14px;
        color: #333; 
        font-weight: normal;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 ul,
    #content .container .registrationstepsarea .col-lg-8.col-md-8 ul {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px;
        position: relative;
    }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 ul li,
        #content .container .registrationstepsarea .col-lg-8.col-md-8 ul li {
            width: 95%;
            float: left;
            margin: 0px 0px 0px 5%;
            padding: 0px 0px 0px 2%; 
            font-weight: normal;
            font-size: 14px;
            color: #333;
            list-style: disc;
            text-align: left;
        }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 ul li span,
            #content .container .registrationstepsarea .col-lg-6.col-md-6:nth-child(2) p span,
            #content .container .registrationstepsarea .col-lg-8.col-md-8 ul li span {
                width: 100%;
                float: left;
                padding-left: 5%;
            }

#content .container .coursearea {
    width: 100%;
    float: left;
    margin: 30px 0px;
    padding: 0px;
}

    #content .container .coursearea .col-lg-6.col-md-6 .orangeheading {
        width: 80%;
        float: left;
        margin: 0px 10% -20px;
        padding: 10px 0px;
        text-align: center; 
        font-weight: normal;
        color: #000;
        font-size: 20px;
        background: #fbe5d6;
        border: 1px solid #7d3c16;
        position: absolute;
        top: -10px;
        left: 0px;
        z-index: 100;
    }

    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox {
        width: 100%;
        float: left;
        margin: 20px 0px 20px 0px;
        padding: 25px 10px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
        overflow: hidden;
    }

        #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li {
            width: 100%;
            float: left;
            margin: 0px 0px;
            padding: 4px 0px 5px; 
            font-weight: normal;
            color: #58595b;
            font-size: 18px;
            text-align: left;
        }

            #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li:nth-child(1), #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li:nth-child(2) {
                font-weight: 500;
                color: #165403;
            }

            #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li:nth-child(3) {
                color: #7b6002;
            }

    #content .container .coursearea .courseareabox .col-lg-6.col-md-6 img {
        max-width: 100%;
    }

    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton {
        min-width: 10px;
        float: right;
        margin: 10px 0px;
        padding: 8px 5px;
        text-align: center; 
        font-weight: normal;
        color: #fff;
        font-size: 17px;
        background: #ffc528;
        position: absolute;
        bottom: 18px;
        right: 40%;
        z-index: 100;
        transition: all linear 0.5s;
    }

        #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton i.fa {
            margin-right: 5px;
        }

        #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton:hover {
            transform: rotate(0deg);
            transition: all linear 0.5s;
        }

#content .container .accordianarea {
    width: 100%;
    float: left;
    margin: 30px 0px;
    padding: 0px;
}

    #content .container .accordianarea .col-lg-6.col-md-6 .orangeheading {
        width: 100%;
        float: left;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 10px 0px;
        text-align: left; 
        font-weight: bold;
        color: #945f0b;
        font-size: 18px;
        background: none;
        border: none;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel {
        border-radius: 0px !important;
        border-color: #daa520 !important;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading {
        background: none;
        position: relative;
        border-color: #daa520 !important;
    }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading h4.panel-title a, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a {
            width: 100%;
            display: block; 
            font-weight: normal;
            color: #9e7817;
            font-size: 13px;
            text-decoration: none;
        }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading.active h4.panel-title a:after, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading.active h4.panel-title a:after {
            content: "\f077";
            font-family: 'FontAwesome';
            position: absolute;
            top: -0px;
            right: 10px;
            color: #daa520;
            font-size: 10px;
            border-left: 1px solid #daa520;
            padding-left: 10px;
            height: 36px;
            line-height: 36px;
        }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading h4.panel-title a:after, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a:after {
            content: "\f078";
            font-family: 'FontAwesome';
            position: absolute;
            top: -0px;
            right: 10px;
            color: #daa520;
            font-size: 10px;
            border-left: 1px solid #daa520;
            padding-left: 10px;
            height: 36px;
            line-height: 36px;
        }


        #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a div.stars {
            min-width: 10px;
            float: left;
            margin: 0px 10px 0px 0px;
            padding: 0px;
            position: relative;
            vertical-align: middle;
            display: inline-block;
            overflow: hidden;
            white-space: nowrap;
        }

            #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a div.stars .emptyedstars {
                min-width: 10px;
                float: left;
                margin: 0px 0px 0px 0px;
                padding: 0px;
                height: 15px;
                white-space: nowrap;
            }

            #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a div.stars .filledstars {
                min-width: 10px;
                float: left;
                margin: 0px 0px 0px 0px;
                padding: 0px;
                position: absolute;
                top: 0px;
                left: 0px;
                overflow: hidden;
                height: 15px;
                white-space: nowrap;
            }

                #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a div.stars .emptyedstars i.fa,
                #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a div.stars .filledstars i.fa {
                    font-size: 14px;
                    color: #f39c12;
                    margin: 0px 1px;
                }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body {
        border-color: #daa520 !important;
    }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body p.heading, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body p.heading {
            width: 100%;
            float: left;
            margin: 0px 0px 10px 0px;
            padding: 0px;
            border-bottom: 1px solid #daa520; 
            font-weight: normal;
            color: #9e7817;
            font-size: 14px;
            text-decoration: none;
        }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body p.cols, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body p.cols {
            font-weight: normal;
            color: #9e7817;
            font-size: 13px;
            text-decoration: none;
        }

            #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body p.cols strong, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body p.cols strong {
                font-size: 12px;
            }


.modal-header {
    border: none;
}
/*INNER PAGES*/

.innerpage {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}
/*STUDY PROCEDURE*/


#content .container .StudyProcedure {
    width: 100%;
    float: left;
    margin: 30px 0px 0px 0px;
    padding: 0px;
}

    #content .container .StudyProcedure .col-lg-4 {
        padding-bottom: 80px;
        position: relative;
    }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox:nth-child(1):after {
            width: 100%;
            float: left;
            margin: 0px;
            padding: 0px;
            text-align: center;
            height: 100px;
            position: absolute;
            bottom: -100px;
            left: 0px;
            content: "\f063";
            font-family: 'FontAwesome';
            font-size: 36px;
            color: #9b6f28;
            line-height: 90px;
        }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox {
            width: 100%;
            float: left;
            margin: 0px 0px 100px;
            padding: 25px 25px;
            border-radius: 35px;
            background: #fffdef;
            border: 1px solid #9b6f28;
            position: relative;
            min-height: 640px;
        }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox:nth-child(2) {
                margin-bottom: 0px;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .brownheading {
                width: 90%;
                float: left;
                margin: -45px 5% 10px;
                padding: 10px;
                text-align: center; 
                font-weight: normal;
                color: #000;
                font-size: 18px;
                background: #fbe5d6;
                border: 1px solid #7d3c16;
                border-radius: 5px;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .studysubheading {
                width: 90%;
                float: left;
                margin: 0px 0px 30px;
                padding: 10px 10% 0px 0px;
                text-align: center; 
                font-weight: normal;
                color: #bf2523;
                font-size: 14px;
                position: relative;
                text-transform: uppercase;
            }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .studysubheading img {
                    position: absolute;
                    top: 0px;
                    right: -80px;
                }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea {
                width: 100%;
                float: right;
                position: relative;
                margin: 0px 0px 30px 0px;
                padding: 0px;
            }

        #content .container .StudyProcedure .col-lg-4:nth-child(2) .StudyProceduresbox .imgarea, #content .container .StudyProcedure .col-lg-4:nth-child(3) .StudyProceduresbox .imgarea {
            width: 100%;
            float: right;
            position: relative;
            margin: 31px 0px 31px 0px;
            padding: 0px;
        }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea img {
            width: 89px;
            float: right;
        }

        #content .container .StudyProcedure .col-lg-4:nth-child(2) .StudyProceduresbox .imgarea img, #content .container .StudyProcedure .col-lg-4:nth-child(3) .StudyProceduresbox .imgarea img {
            width: 86px;
            float: right;
        }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox {
            width: calc(100% - 100px);
            float: left;
            margin: 0px;
            padding: 5px;
            background: #dbe9d1;
            border-radius: 3px;
            position: absolute;
            top: 3%;
            left: 0px;
        }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.two {
                top: 23%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.three {
                top: 40%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.four {
                top: 63%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.five {
                top: 84%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.six {
                top: 4%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.seven {
                top: 32%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.eight {
                top: 55%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.nine {
                top: 80%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.ten {
                top: -2%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.eleven {
                top: 30%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.twelve {
                top: 55%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.thirteen {
                top: 80%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox:after {
                content: '';
                position: absolute;
                border-style: solid;
                border-color: transparent #dbe9d1;
                display: block;
                width: 0;
                z-index: 1;
                margin-top: -14px;
                top: 58%;
                right: -10px;
                border-width: 8px 0 8px 10px;
            }


            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.seven:after {
                top: 90%;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox .greenboxwrapper {
                width: 100%;
                float: left;
                margin: 0px;
                padding: 0px;
                position: relative; 
                font-size: 13px;
                text-transform: none;
                font-weight: normal;
                color: #fff;
                text-align: center;
                line-height: 15px;
            }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox .greenboxwrapper strong {
                    font-weight: 600;
                }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .text {
            width: 100%;
            float: left;
            margin: 0px 0px 20px 0px;
            padding: 0px;
            position: relative; 
            font-size: 14px;
            font-weight: normal;
            color: #3d4b5b;
            text-align: center;
        }

        #content .container .StudyProcedure .col-lg-4:nth-child(3) .StudyProceduresbox .text {
            padding: 20px 0px;
        }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .text strong {
            color: #d31313;
            font-weight: normal;
            width: 100%;
            float: left;
        }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages {
            width: 100%;
            float: left;
            margin: 20px 0px 30px;
            padding: 0px;
            border-radius: 25px;
            border: 1px solid #5cb43d;
            overflow: hidden;
            min-height: 370px;
            background: #ebf1e9;
        }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-child(1) {
                background: #70ad47;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-child(2) {
                background: #d5e3cf;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-child(3) {
                background: #ebf1e9;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-child(4) {
                background: #d5e3cf;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-child(5) {
                background: #ebf1e9;
            }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr th {
                text-align: center;
                padding: 10px; 
                font-weight: normal;
                font-size: 14px;
                color: #fff;
            }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr th:nth-child(1) {
                    border-right: 1px solid #fff;
                }

            #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr {
                border-bottom: 1px solid #fff;
            }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr td:nth-child(1) {
                    border-right: 1px solid #fff;
                }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr:nth-last-child(1) {
                    border: none;
                }

                #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .StudyProcedureadvantages table tbody tr td {
                    text-align: left;
                    padding: 10px; 
                    font-weight: normal;
                    font-size: 13px;
                    color: #3d4b5b;
                    vertical-align: top;
                }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox a.watchvideobutton {
            width: 100%;
            float: right;
            margin: 10px 0px;
            padding: 8px 5px;
            text-align: center; 
            font-weight: normal;
            color: #fff;
            font-size: 17px;
            background: #ffc528;
        }

#content .container .StudyProcedureTextArea {
    width: 100%;
    float: left;
    margin: 0px 0px 30px 0px;
    padding: 0px;
}

    #content .container .StudyProcedureTextArea .StudyProcedureTextAreaheading {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        text-align: left; 
        font-weight: normal;
        color: #c55a11;
        font-size: 24px;
    }

    #content .container .StudyProcedureTextArea .StudyProcedureTextAreaheadingsub {
        width: 100%;
        float: left;
        margin: 0px 0px 5px 0px;
        padding: 0px 0px 0px 0px;
        text-align: left; 
        font-weight: normal;
        color: #000;
        font-size: 18px;
    }

    #content .container .StudyProcedureTextArea p {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px;
        font-size: 14px;
        color: #333; 
        font-weight: normal;
    }

    #content .container .StudyProcedureTextArea ul {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px;
        position: relative;
    }

        #content .container .StudyProcedureTextArea ul li {
            width: 95%;
            float: left;
            margin: 0px 0px 0px 5%;
            padding: 0px 0px 0px 2%; 
            font-weight: normal;
            font-size: 14px;
            color: #333;
            list-style: disc;
            text-align: left;
        }

            #content .container .StudyProcedureTextArea ul li span, #content .container .StudyProcedureTextArea p span {
                width: 100%;
                float: left;
                padding-left: 5%;
            }
/*Vission and Mission*/

#content .container .VissionMission {
    width: 100%;
    float: left;
    margin: 30px 0px;
    padding: 0px;
}

    #content .container .VissionMission .col-lg-6 {
        position: relative;
    }

        #content .container .VissionMission .col-lg-6 .headingarea {
            width: 100%;
            float: left;
            margin: 0px;
            padding: 0px;
            text-align: center;
        }

            #content .container .VissionMission .col-lg-6 .headingarea .headingareatop {
                width: 100%;
                float: left;
                margin: 0px 0px 0px 0px;
                padding: 0px;
                text-align: center; 
                font-weight: 100;
                color: #2c3e50;
                font-size: 36px;
            }

                #content .container .VissionMission .col-lg-6 .headingarea .headingareatop img {
                    margin: 0px 20px;
                }

        #content .container .VissionMission .col-lg-6 .VissionMissionbox {
            width: 100%;
            float: left;
            margin: 20px 0px 0px 0px;
            padding: 25px 25px;
            border-radius: 35px;
            background: #fffdef;
            border: 1px solid #9b6f28;
            position: relative;
            min-height: 360px;
        }

            #content .container .VissionMission .col-lg-6 .VissionMissionbox .VissionMissionimagearea {
                width: 100%;
                float: left;
                margin: 0px 0px 20px;
                padding: 0px;
                text-align: center;
            }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox .VissionMissionimagearea img {
                    max-width: 100%;
                }

            #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext {
                width: 100%;
                float: left;
                margin: 0px 0px;
                padding: 0px; 
                font-weight: normal;
                font-size: 24px;
                color: #000;
                line-height: 22px;
                text-align: center;
            }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext i {
                    color: #000;
                }

            #content .container .VissionMission .col-lg-6 .VissionMissionbox p.objectives {
                width: 100%;
                float: left;
                margin: 0px 0px;
                padding: 0px; 
                font-weight: normal;
                font-size: 20px;
                color: #407625;
                line-height: 22px;
            }

            #content .container .VissionMission .col-lg-6 .VissionMissionbox ul.objectivesul {
                width: 100%;
                float: left;
                margin: 10px 0px;
                padding: 0px;
            }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox ul.objectivesul li {
                    width: 100%;
                    float: left;
                    margin: 0px 0px 10px;
                    padding: 0px; 
                    font-weight: normal;
                    font-size: 14px;
                    color: #667071;
                    line-height: 18px;
                }

                    #content .container .VissionMission .col-lg-6 .VissionMissionbox ul.objectivesul li strong {
                        font-weight: bold;
                        color: #000;
                    }

            #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext span, #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext span.big {
                width: 100%;
                float: left;
                margin-top: 20px;
                font-size: 16px;
                line-height: 18px;
                color: #385723;
            }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext span.big {
                    font-size: 18px;
                    line-height: 20px;
                }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext span strong.black {
                    color: #000;
                    font-weight: bold;
                    font-style: italic;
                }

                #content .container .VissionMission .col-lg-6 .VissionMissionbox .bluetext span strong.brown {
                    color: #c55a11;
                    font-weight: normal;
                }
/*Best Design For Function*/

#content .container .BestDesignForFunction {
    width: 100%;
    float: left;
    margin: 30px 0px 120px 0px;
    padding: 0px;
}


#content .container .BestDesignForFunction2 {
    margin: 30px 0px 0px 0px;
}

    #content .container .BestDesignForFunction2 .StudyProcedureTextAreaheading {
        width: 100%;
        float: left;
        margin: 0px 0px 10px 0px;
        padding: 0px 0px 0px 0px;
        text-align: left; 
        font-weight: normal;
        color: #c55a11;
        font-size: 24px;
    }

    #content .container .BestDesignForFunction2 > p > a {
        max-width: 100%;
    }


    #content .container .BestDesignForFunction2 > p {
        letter-spacing: normal;
        word-spacing: normal;
        line-height: 30px;
        text-align: justify;
    }

.allimagesheadings {
    letter-spacing: normal;
    word-spacing: normal;
    text-align: center !important;
    font-size: 18px;
    color: #0e6107;
}

#content .container .BestDesignForFunction2 .BestDesignForFunctionTable {
    width: 100%;
    float: left;
    margin: 30px 0px 30px 0px;
    padding: 0px;
    border: 1px solid #ccc;
}

    #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr:nth-child(2n) {
        background: #f5f5f5;
    }

    #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr:nth-child(1) {
        background: #7d3c16;
    }

        #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr:nth-child(1) td {
            border-right: 1px solid #fff;
            color: #fff;
        }

            #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr:nth-child(1) td:nth-child(2) {
                border-right: 1px solid #ccc;
            }

    #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td {
        padding: 0px;
        border: 1px solid #ccc;
    }

        #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td p {
            margin-bottom: 0px;
            padding: 10px;
        }

        #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td:nth-child(1) {
            width: 30%;
            font-weight: bold;
        }

        #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td:nth-child(2) {
            width: 70%;
        }

        #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td > table {
            width: 100%;
        }

            #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td > table > tbody > tr {
                background: none !important;
                border: none;
                border-bottom: 1px solid #ccc;
            }

                #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td > table > tbody > tr > td {
                    border: none;
                }

                    #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td > table > tbody > tr > td > p {
                        color: #333;
                        font-weight: normal;
                    }

                #content .container .BestDesignForFunction2 .BestDesignForFunctionTable tr td > table > tbody > tr:nth-last-child(1) {
                    border-bottom: none;
                }

#content .container .BestDesignForFunction .BDFFrow {
    width: 100%;
    float: left;
    margin: 0px 0px 10px 0px;
    padding: 0px;
    text-align: center;
}

    #content .container .BestDesignForFunction .BDFFrow img {
        max-width: 100%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        max-width: 40%;
        float: left;
        margin: 30px 0px 0px 32%;
        padding: 15px;
        border-radius: 15px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone:after {
            content: '';
            position: absolute;
            border-style: solid;
            border-width: 0 30px 20px;
            border-color: #fffdef transparent;
            display: block;
            width: 0;
            z-index: 1;
            top: -20px;
            left: 45px;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone:before {
            content: '';
            position: absolute;
            border-style: solid;
            border-width: 0 30px 20px;
            border-color: #7d3c16 transparent;
            display: block;
            width: 0;
            z-index: 0;
            top: -21px;
            left: 45px;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone .heading {
            width: 100%;
            float: left;
            margin: 0px 0px 10px 0px;
            padding: 0px; 
            font-weight: normal;
            font-size: 15px;
            color: #a80d0d;
            text-align: left;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone ul {
            width: 100%;
            float: left;
            margin: 0px 0px 0px 0px;
            padding: 0px;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone ul li {
                width: 95%;
                float: left;
                margin: 0px 0px 0px 5%;
                padding: 0px 0px 0px 2%; 
                font-weight: normal;
                font-size: 15px;
                color: #000;
                list-style: disc;
                text-align: left;
            }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 24%;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two .heading {
                color: #2757de;
                font-weight: bold;
            }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two ul li {
                color: #045608;
            }

                #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two ul li strong {
                    font-weight: normal;
                    color: #ef6601;
                }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 30%;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three .heading {
                color: #2757de;
                font-weight: bold;
            }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three ul li {
                color: #045608;
            }

                #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three ul li strong.orange {
                    font-weight: normal;
                    color: #e57701;
                }

                #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three ul li strong.blackunderline {
                    font-weight: normal;
                    color: #000;
                    text-decoration: underline;
                }

                #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three ul li strong.black {
                    font-weight: normal;
                    color: #000;
                }

                #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three ul li strong.red {
                    font-weight: normal;
                    color: #df0404;
                }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:after, #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:before {
                left: 80%;
            }
/*Best Design For Function*/


#content .container .AMTE {
    width: 100%;
    float: left;
    margin: 30px 0px 80px 0px;
    padding: 0px;
}

    #content .container .AMTE .AMTErow {
        width: 100%;
        float: left;
        margin: 0px 0px 70px 0px;
        padding: 0px;
    }

        #content .container .AMTE .AMTErow .col-lg-7 { 
            font-size: 18px;
            color: #165403;
            line-height: 22px;
            padding: 50px 0px;
        }

        #content .container .AMTE .AMTErow .col-lg-5 img {
            width: 100%;
            margin-bottom: 20px;
        }

#content .container > .AMTE > .AMTErow > .col-lg-6 {
    padding-bottom: 90px;
    position: relative;
}

#content .container .AMTE .AMTErow .col-lg-6 .AMTEbox {
    width: 100%;
    float: left;
    margin: 40px 0px;
    padding: 25px 25px;
    border-radius: 35px;
    background: #fffdef;
    border: 1px solid #9b6f28;
    position: relative;
    min-height: 280px;
}

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .brownheading {
        width: 90%;
        float: left;
        margin: -45px 5% 10px;
        padding: 10px;
        text-align: center; 
        font-weight: normal;
        color: #000;
        font-size: 18px;
        border-radius: 5px;
        background: #fbe5d6;
        border: 1px solid #7d3c16;
    }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 img, #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul img, #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox ul img {
        width: 100%;
    }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul img, #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox ul img {
        margin-top: 10px;
    }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul, #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox ul {
        width: 100%;
        float: left;
        margin: 0px 0px 0px 0px;
        padding: 0px;
        position: relative;
    }

        #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul li, #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox ul li {
            width: 95%;
            float: left;
            margin: 0px 0px 0px 5%;
            padding: 0px 0px 0px 2%; 
            font-weight: normal;
            font-size: 16px;
            color: #165403;
            list-style: disc;
            text-align: left;
        }

        #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul a.watchvideobutton {
            min-width: 10px;
            float: right;
            margin: 0px 0px;
            padding: 5px;
            text-align: center; 
            font-weight: normal;
            color: #fff;
            font-size: 17px;
            background: #ffc528;
            position: absolute;
            bottom: -15px;
            right: 0px;
        }

            #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul a.watchvideobutton:hover {
                background: #333;
                color: #fff;
            }

/***********************
********* Register Form Start ******
************************/

.QuranSection h6 {
    color: #9c582e; 
    font-size: 18px;
    text-transform: uppercase;
}

.QuranSection h3 {
    color: #323a43; 
    font-size: 26px;
    font-weight: 700;
    text-align: left;
}

.QuranSection p {
    color: #686868; 
    font-size: 17px;
    text-align: left;
    line-height: 22px;
}

.optType {
    background: #ECF0F1;
    color: #000;
    min-width: 40%;
    padding: 10px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold; 
    margin-bottom: 15px;
}

.radio-inline, .checkbox-inline {
    display: inline-block;
    padding-left: 0px;
    margin-bottom: 0;
    font-weight: normal;
    vertical-align: middle;
    cursor: pointer;
}

#signupForm input[type="radio"] {
    display: inline-block;
    position: relative;
    width: 17px;
    height: 20px;
    line-height: 0px;
    margin: 2px 4px 0;
    padding: 10px 6px 9px;
    border: none;
    outline: 0px;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#infoForm input, textarea {
    -webkit-font-smoothing: antialiased;
    outline: none;
}

#infoForm strong, b {
    font-weight: bold;
}

em, i {
    font-style: italic;
}

#infoForm h1 {
    display: block;
    font-size: 3.1em;
    line-height: 1.45em; 
    text-align: center;
    font-weight: bold;
    color: #555;
    text-shadow: 1px 1px 0 #fff;
}

#infoForm .validationClr {
    color: #ea281f;
    font-size: 20px;
    float: right;
}
/** form field **/

#infoForm .frmCls {
    display: block;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 5px;
    font-size: 0;
}

#infoForm .frmClsLabel {
    display: block;
    padding: 7px 20px 1px;
    vertical-align: top;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    color: #939393;
    cursor: pointer;
}

#infoForm form div.switch .frmClsLabel {
    padding: 16px 20px 13px;
}

#infoForm form {
    display: block;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 5px;
    font-size: 0;
}

    #infoForm form div label {
        display: block;
        padding: 7px 20px 1px;
        vertical-align: top;
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
        color: #626262;
        cursor: pointer;
    }

    #infoForm form div.switch label {
        padding: 16px 20px 13px;
    }

.col-1, .col-2, .col-3, .col-4 {
    border-bottom: 1px solid #e4e4e4;
    float: left;
}

#infoForm form div .col-4 {
    height: 86px;
}

#infoForm input[type=radio] {
    display: inline-block;
    position: relative;
    width: 17px;
    height: 20px;
    line-height: 0px;
    margin: 2px 4px 0;
    padding: 10px 6px 9px;
    border: none;
    outline: 0px;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#infoForm .submitBtnBox {
    display: inline-block;
    float: right;
    margin-top: 90px;
}

    #infoForm .submitBtnBox .submitBtn {
        float: left;
    }

    #infoForm .submitBtnBox .clearBtn {
        float: left;
        color: #000;
    }

.btnSubClrMove {
    float: right !important;
}

#infoForm .btn-grn {
    background: #1abc9c;
    color: #fff;
    padding: 0px 17px;
}

    #infoForm .btn-grn:hover {
        color: #E4E2E2;
    }

#infoForm .btn-clr {
    color: #626262;
    background: #fff;
}

#infoForm .registerBtnBox {
    display: inline-block;
    float: right;
    margin-top: 12px;
}

    #infoForm .registerBtnBox .registerBtn {
        float: left;
    }

    #infoForm .registerBtnBox .clearBtn1 {
        float: left;
        color: #000;
    }

#infoForm .btn-blue {
    background: #41aef9;
    color: #fff;
    padding: 0px 17px;
}

    #infoForm .btn-blue:hover {
        color: #E4E2E2;
    }

#infoForm .btn-clr1 {
    color: #c0392b;
    background: #fff;
}

#infoForm .infoFormRadio h5 {
    color: #626262; 
    font-size: 13px;
    text-transform: uppercase;
    margin: 0px;
    padding: 0px;
    margin-top: 15px;
    margin-bottom: 5px;
}

#infoForm .radio-inline, #infoForm .checkbox-inline {
    padding-left: 0px;
}

#infoForm label input {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 27px;
    line-height: 27px;
    margin: 5px -5px 0;
    padding: 7px 5px 3px;
    border: none;
    outline: none;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#infoForm label textarea {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 150px;
    line-height: 27px;
    margin: 5px -5px 0;
    padding: 7px 5px 3px;
    border: none;
    outline: none;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#infoForm .col-submit {
    text-align: center;
    padding: 20px;
}

#infoForm label select {
    display: block;
    width: 100%;
    padding: 0;
    color: #838a8e;
    margin: 8px 0 6px;
    font-weight: bold;
    background: transparent;
    border: none;
    outline: none; 
    font-size: 14px;
    opacity: .5;
    transition: all linear .3s;
}

#infoForm select option {
    color: #000 !important;
    background: #fff;
    padding: 15px 0px !important;
}

#infoForm select:focus option:checked {
    color: #000 !important;
    text-shadow: 1px 0px 0px !important;
    background: #d3dcde !important;
    -moz-appearance: none !important;
}

#infoForm label input:focus, label select:focus {
    opacity: 1;
}

#infoForm label select:active, #infoForm label select:hover, #infoForm label option:hover {
    background: #d6dfe1;
}

#infoForm::-webkit-input-placeholder {
    color: #bdc3c7;
    font-weight: 600;
}

#infoForm:-moz-placeholder {
    /* Firefox 18- */
    color: #bdc3c7;
    font-weight: 600;
}

#infoForm::-moz-placeholder {
    /* Firefox 19+ */
    color: #bdc3c7;
    font-weight: 600;
}

#infoForm:-ms-input-placeholder {
    color: #bdc3c7;
    font-weight: 300;
}

#infoForm button {
    width: 100%;
    height: 35px;
    border: none;
    border-radius: 4px;
    margin: 0 0 15px 0;
    font-size: 14px;
    font-weight: bold;
    overflow: hidden;
    outline: none;
}

    #infoForm button.submitbtn {
        background-image: -moz-linear-gradient(#97c16b, #8ab959);
        background-image: -webkit-linear-gradient(#97c16b, #8ab959);
        background-image: linear-gradient(#97c16b, #8ab959);
        border-bottom: 1px solid #648c3a;
        cursor: pointer;
        color: #fff;
    }

        #infoForm button.submitbtn:hover {
            background-image: -moz-linear-gradient(#8ab959, #7eaf4a);
            background-image: -webkit-linear-gradient(#8ab959, #7eaf4a);
            background-image: linear-gradient(#8ab959, #7eaf4a);
        }

        #infoForm button.submitbtn:active {
            height: 34px;
            border-bottom: 0;
            margin: 1px 0 0 0;
            background-image: -moz-linear-gradient(#7eaf4a, #8ab959);
            background-image: -webkit-linear-gradient(#7eaf4a, #8ab959);
            background-image: linear-gradient(#7eaf4a, #8ab959);
            -moz-box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
            -webkit-box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
            box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
        }

#infoForm .formIcon {
    text-align: center;
    width: 100%;
    margin: 24px 0px;
}

#infoForm .infoFormRadio {
    display: inline-block;
    color: #826f51;
}

    #infoForm .infoFormRadio .radio1 {
        float: left;
    }

#infoForm .RadioGroup1_0 {
    float: left;
}

#infoForm option {
    color: #FFF;
    background: #fff;
}

    #infoForm option:nth-child(2) {
        background: #ecf0f1;
    }

    #infoForm option:nth-child(3) {
        background: #ecf0f1;
    }

    #infoForm option:nth-child(4) {
        background: #ecf0f1;
    }

/** responsive design **/

@media(min-width: 850px) {
    #infoForm form div {
        display: inline-block;
    }

    #infoForm .col-submit {
        display: block;
    }

    #infoForm .col-1, .col-2, .col-3, .col-4 {
        box-shadow: 1px 1px #e4e4e4;
        border: none;
    }

    #infoForm .col-1 {
        width: 100%;
    }

    #infoForm .col-2 {
        width: 50%;
    }

    #infoForm .col-3 {
        width: 33.3333333333%;
    }

    #infoForm .col-4 {
        width: 25%;
    }

    #infoForm .col-submit button {
        width: 30%;
        margin: 0 auto;
    }
}
/***********************
********* Register Form End ******
************************/


/***********************
*** Signup Page 
************************/

#signUppage {
}

    #signUppage .QuranSection {
        padding: 2px 2px;
    }

        #signUppage .QuranSection h6 {
            color: #9c582e; 
            font-size: 18px;
            text-transform: uppercase;
        }

        #signUppage .QuranSection h3 {
            color: #323a43; 
            font-size: 26px;
            font-weight: 700;
            text-align: left;
        }

        #signUppage .QuranSection p {
            color: #686868; 
            font-size: 17px;
            text-align: left;
            line-height: 22px;
        }

    #signUppage h6 {
        color: #61391a; 
        font-size: 18px;
        text-transform: uppercase;
    }
/***********************
********* Register Form Start ******
************************/

/*#signupForm {
    background: #f9f9f9;
    padding: 10px;
}

    #signupForm input, textarea {
        -webkit-font-smoothing: antialiased;
        outline: none;
    }

    #signupForm strong, b {
        font-weight: bold;
    }

em, i {
    font-style: italic;
}*/

/*#signupForm h1 {
    display: block;
    font-size: 3.1em;
    line-height: 1.45em;
    font-family: 'Lato', sans-serif;
    text-align: center;
    font-weight: bold;
    color: #555;
    text-shadow: 1px 1px 0 #fff;
}

#signupForm .validationClr {
    color: #ea281f;
    font-size: 20px;
    float: right;
}*/
/** form field **/

#signupForm .frmCls {
    display: block;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 5px;
    font-size: 0;
}

#signupForm .frmClsLabel {
    display: block;
    padding: 7px 20px 1px;
    vertical-align: top;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    color: #939393;
    cursor: pointer;
}

#signupForm .SignUpFormCls {
    display: block;
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
}

    #signupForm .SignUpFormCls div label {
        display: block;
        padding: 2px 20px 1px;
        vertical-align: top;
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
        color: #626262;
        cursor: pointer;
    }

    #signupForm .SignUpFormCls div.switch label {
        padding: 16px 20px 13px;
    }

.col-1, .col-2, .col-3, .col-4 {
    border-bottom: 1px solid #e4e4e4;
    float: left;
}

#signupForm .SignUpFormCls div .col-4 {
    height: 86px;
}

#signupForm input[type=radio] {
    display: inline-block;
    position: relative;
    width: 17px;
    height: 20px;
    line-height: 0px;
    margin: 0px 4px 0;
    padding: 10px 6px 9px;
    border: none;
    outline: 0px;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
    float: left;
}

#signupForm .submitBtnBox {
    display: inline-block;
    float: right;
    margin-top: 90px;
}

    #signupForm .submitBtnBox .submitBtn {
        float: left;
    }

    #signupForm .submitBtnBox .clearBtn {
        float: left;
        color: #000;
    }

#signupForm .btn-grn {
    background: #1abc9c;
    color: #fff;
    padding: 0px 17px;
}

    #signupForm .btn-grn:hover {
        color: #E4E2E2;
    }

#signupForm .btn-clr {
    color: #626262;
    background: #fff;
}

#signupForm .registerBtnBox {
    display: inline-block;
    float: right;
    margin-top: 22px;
}

    #signupForm .registerBtnBox .registerBtn {
        float: left;
    }

    #signupForm .registerBtnBox .clearBtn1 {
        float: left;
        color: #000;
    }

#signupForm .btn-blue {
    background: #41aef9;
    color: #fff;
    padding: 0px 17px;
}

    #signupForm .btn-blue:hover {
        color: #E4E2E2;
    }

#signupForm .btn-clr1 {
    color: #c0392b;
    background: #fff;
}

#signupForm label input {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 27px;
    line-height: 27px;
    margin: 5px -5px 0;
    padding: 7px 5px 3px;
    border: none;
    outline: none;
    color: #626262;
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#signupForm label textarea {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 150px;
    line-height: 27px;
    margin: 5px -5px 0;
    padding: 7px 5px 3px;
    border: none;
    outline: none;
    color: #626262; 
    font-weight: bold;
    font-size: 14px;
    opacity: .6;
    transition: all linear .3s;
}

#signupForm .col-submit {
    text-align: center;
    padding: 20px;
}

#signupForm label select {
    display: block;
    width: 100%;
    padding: 0;
    color: #838a8e;
    margin: 8px 0 6px;
    font-weight: bold;
    background: transparent;
    border: none;
    outline: none; 
    font-size: 14px;
    opacity: .5;
    transition: all linear .3s;
}

#signupForm select option {
    color: #000 !important;
    background: #fff;
    padding: 5px 0px !important;
}

#signupForm select:focus option:checked {
    color: #000 !important;
    text-shadow: 1px 0px 0px !important;
    background: #d3dcde !important;
    -moz-appearance: none !important;
}

#signupForm label input:focus, label select:focus {
    opacity: 1;
}

#signupForm label select:active, #signupForm label select:hover, #signupForm label option:hover {
    background: #d6dfe1;
}

#signupForm::-webkit-input-placeholder {
    color: #bdc3c7;
    font-weight: 600;
}

#signupForm:-moz-placeholder {
    /* Firefox 18- */
    color: #bdc3c7;
    font-weight: 600;
}

#signupForm::-moz-placeholder {
    /* Firefox 19+ */
    color: #bdc3c7;
    font-weight: 600;
}

#signupForm:-ms-input-placeholder {
    color: #bdc3c7;
    font-weight: 300;
}

#signupForm button {
    width: 100%;
    height: 35px;
    border: none;
    border-radius: 4px;
    margin: 0 0 15px 0;
    font-size: 14px;
    font-weight: bold;
    overflow: hidden;
    outline: none;
}

    #signupForm button.submitbtn {
        background-image: -moz-linear-gradient(#97c16b, #8ab959);
        background-image: -webkit-linear-gradient(#97c16b, #8ab959);
        background-image: linear-gradient(#97c16b, #8ab959);
        border-bottom: 1px solid #648c3a;
        cursor: pointer;
        color: #fff;
    }

        #signupForm button.submitbtn:hover {
            background-image: -moz-linear-gradient(#8ab959, #7eaf4a);
            background-image: -webkit-linear-gradient(#8ab959, #7eaf4a);
            background-image: linear-gradient(#8ab959, #7eaf4a);
        }

        #signupForm button.submitbtn:active {
            height: 34px;
            border-bottom: 0;
            margin: 1px 0 0 0;
            background-image: -moz-linear-gradient(#7eaf4a, #8ab959);
            background-image: -webkit-linear-gradient(#7eaf4a, #8ab959);
            background-image: linear-gradient(#7eaf4a, #8ab959);
            -moz-box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
            -webkit-box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
            box-shadow: inset 0 1px 3px 1px rgba(0, 0, 0, 0.3);
        }

#signupForm .formIcon {
    text-align: center;
    width: 100%;
    margin: 24px 0px;
}

#signupForm .infoFormRadio {
    display: inline-block;
    color: #826f51;
}

    #signupForm .infoFormRadio .radio1 {
        float: left;
    }

#signupForm .RadioGroup1_0 {
    float: left;
}

#signupForm option {
    color: #FFF;
    background: #fff;
}

#signupForm .SignUpFormCls div {
    background: #fff;
}

.col-1, .col-2, .col-3, .col-4 {
    width: 100%;
}

/** responsive design **/


/***********************
********* Signup Form End ******
************************/
 
/*DOWNLOAD Page*/

.signupAppTxt h2 {
    color: #61391a; 
    font-weight: 400;
    font-size: 23px;
}

.signupAppTxt ul {
    color: #7f8c8d; 
    font-weight: 400;
    font-size: 14px;
    list-style: none;
    margin-left: -28px;
}

    .signupAppTxt ul li::before {
        float: left;
        font-family: FontAwesome;
        content: "\f0da";
        font-size: 18px;
        margin-right: 9px;
        line-height: 27px;
        color: #714622;
        margin-bottom: 15px;
    }

    .signupAppTxt ul li {
        padding: 10px 0px;
    }

.downloadBtn {
    padding: 9px 28px;
    background: #f39c12;
    color: #fff;
    border-radius: 4px;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 12px;
    border: 0px;
    margin-left: 55px;
    text-decoration: none;
}

    .downloadBtn:hover,
    .downloadBtn:focus {
        background: #754E2D;
        color: #fff;
        text-decoration: none;
    }

#successMsg {
    width: 100%;
    float: left;
}

.successMsg h4 {
    font-size: 18px;
    margin-top: 17px;
    margin-bottom: 0;
    color: #61391a;
}

.successMsg span {
    color: #96a1a2;
    font-size: 16px;
}

.successMsg a {
    cursor: pointer;
    color: #f39c12; 
}

    .successMsg a:hover,
    .successMsg a:focus {
        background: none;
        color: inherit;
        text-decoration: none;
    }

#Instructions {
    padding: 40px 0px 60px;
    margin-top: 40px;
}

    #Instructions h2 {
        color: #61391a; 
        font-weight: 400;
        font-size: 23px;
    }

    #Instructions ul {
        list-style: none;
        color: #7f8c8d;
        font-size: 15px;
        font-weight: 500;
        margin-left: -30px;
    }

        #Instructions ul li {
            padding: 5px 0px;
            list-style: none;
            position: relative;
        }

            #Instructions ul li::before {
                font-family: FontAwesome;
                content: "\f0da";
                font-size: 18px;
                margin-right: 9px;
                line-height: 27px;
                color: #714622;
                position: absolute;
                top: 0px;
                left: -15px;
            }
/*WHY JOIN*/

#content .container .WhyJoin {
    width: 100%;
    float: left;
    margin: 0px 0px 40px 0px;
    padding: 0px 0px 10px 0px;
}

    #content .container .WhyJoin .orangeheading {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 15px;
        text-align: center;
        color: #fff;
        font-size: 24px;
        background: #daa520;
    }

        #content .container .WhyJoin .orangeheading span {
            width: 100%;
            float: left; 
            font-size: 14px;
        }

    #content .container .WhyJoin #WhyJoinaccordion .panel, #content .container .WhyJoin #WhyJoinaccordion2 .panel {
        border-radius: 0px !important;
        border: none;
        border-bottom: 2px solid #fff;
        margin-top: 0px;
    }

    #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading {
        padding: 0px;
        background: #ecf0f1;
        position: relative;
        border-color: #ccc !important;
        margin-top: 0px !important;
        color: #2c3e50;
        border-radius: 0px !important;
    }

        #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading:hover, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading:hover, #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading.active, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading.active {
            background: #2c3e50;
            color: #fff;
        }

        #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading h4.panel-title a, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading h4.panel-title a {
            width: 100%;
            display: block;
            font-weight: normal;
            color: inherit;
            font-size: 13px;
            text-decoration: none;
            padding: 20px 70px 20px 20px;
        }

            #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading h4.panel-title a span, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading h4.panel-title a span {
                width: 100%;
                display: block;
                text-align: right;
                margin: 0px;
                padding: 0px;
                line-height: 22px;
                color: inherit;
            }

    #content .container .WhyJoin #WhyJoinaccordion .panel-group .panel, #content .container .WhyJoin #WhyJoinaccordion2 .panel-group .panel {
        margin-top: 0px !important;
    }

    #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading.active h4.panel-title a:after, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading.active h4.panel-title a:after {
        content: "\f077";
        font-family: 'FontAwesome';
        position: absolute;
        top: 0px;
        right: 10px;
        color: inherit;
        font-size: 10px;
        border-left: 1px solid;
        border-color: #ccc;
        padding-left: 20px;
        padding-right: 10px;
        height: 100%;
        line-height: 76px;
    }

    #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-heading h4.panel-title a:after, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-heading h4.panel-title a:after {
        content: "\f078";
        font-family: 'FontAwesome';
        position: absolute;
        top: 0px;
        right: 10px;
        color: inherit;
        font-size: 10px;
        border-left: 1px solid;
        border-color: #ccc;
        padding-left: 20px;
        padding-right: 10px;
        height: 100%;
        line-height: 76px;
    }

    #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-collapse .panel-body, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-collapse .panel-body {
        border-color: #fff !important;
        background: #d5e5e6;
        padding-left: 70px;
        padding-right: 70px;
    }

        #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-collapse .panel-body .heading, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-collapse .panel-body .heading {
            width: 100%;
            float: left;
            margin: 0px 0px 15px 0px;
            padding: 15px;
            text-align: center;
            color: #2c3e50;
            font-size: 24px;
        }

            #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-collapse .panel-body .heading span, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-collapse .panel-body .heading span {
                width: 100%;
                float: left; 
                font-size: 16px;
                text-transform: uppercase;
            }

        #content .container .WhyJoin #WhyJoinaccordion .panel-default .panel-collapse .panel-body p.cols, #content .container .WhyJoin #WhyJoinaccordion2 .panel-default .panel-collapse .panel-body p.cols {
            font-weight: normal;
            color: #2c3e50;
            font-size: 13px;
            text-decoration: none;
        }


/*DEMO PAGE*/

#tutorialVideoArea {
    margin-bottom: 34px;
    padding: 50px 10px;
    position: relative;
}

.btnTeacherStudents.row {
    margin-bottom: 10px;
}

#tutorialVideoArea h6 {
    color: #2c3e50; 
    font-size: 24px;
    font-weight: inherit;
    margin-bottom: 34px;
    text-transform: uppercase;
}

#tutorialVideoArea .colorActive {
    color: #d4613E;
}

#tutorialVideoArea #btnTeacher {
    margin-left: 0px;
    margin-right: 20px;
}

#tutorialVideoArea .btn_Active {
    background-color: #d4613E;
    width: 130px;
    height: 45px;
    border-radius: 25px;
    border: none;
    color: #fff;
    float: right;
}


#tutorialVideoArea .btn_InActive {
    background-color: #967853;
    width: 135px;
    height: 45px;
    border-radius: 25px;
    border: none;
    color: #fff;
    float: right;
}

#tutorialVideoArea .brick {
    border: 1px solid #e0e0e0;
    padding-top: 17px;
    padding-bottom: 17px;
}


#tutorialVideoArea .vidHeading {
    display: inline-flex;
    padding-top: 30px;
    padding-bottom: 5px;
}

.vidHeading .fa {
    margin-right: 3px;
    line-height: 2.7;
    float: left;
}

#tutorialVideoArea .vidSubHeading {
    font-size: 24px;
    color: #652e1e;
}

#tutorialVideoArea .cl {
    clear: both;
}



/*POPUP Styling*/

.thumbnail {
    width: 100%;
    float: left;
    padding: 0px;
    border: 0px;
}

#lightbox .modal-dialog {
    width: 60% !important;
}

    #lightbox .modal-dialog button.close {
        width: 25px;
        float: right;
        height: 25px;
        margin: 0px;
        padding: 0px;
        color: #000;
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 9999;
    }

    #lightbox .modal-dialog .modal-content .modal-body img {
        width: 100%;
    }



/*PAGINATION*/

.PaginationArea {
    width: 100%;
    float: left;
    margin: 10px 0px 30px;
    padding: 5px 0px;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
}

    .PaginationArea > a.next,
    .PaginationArea > a.prev {
        min-width: 10px;
        float: right;
        margin: 0px;
        padding: 0px; 
        font-size: 16px;
        color: #333;
        text-decoration: none;
        text-transform: capitalize;
    }

        .PaginationArea > a.next > i.fa {
            margin-left: 10px;
        }

    .PaginationArea > a.prev {
        float: left;
    }

        .PaginationArea > a.prev > i.fa {
            margin-right: 10px;
        }


        .PaginationArea > a.next:hover,
        .PaginationArea > a.prev:hover,
        .PaginationArea > a.next:focus,
        .PaginationArea > a.prev:focus {
            color: #8d582c;
        }



/*HIGHLY ACCESIBLE AND FLEXIBLE*/

#content .container .hafareaNEW {
    width: 100%;
    float: left;
    margin: 100px 0px 100px 0px;
    padding: 0px;
}

    #content .container .hafareaNEW .studybox {
        width: 100%;
        float: left;
        margin: 0px 0px 60px 0px;
        padding: 25px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #7d3c16;
        position: relative;
        min-height: 190px;
    }

        #content .container .hafareaNEW .studybox.extrapadding {
            padding: 5px 50px;
        }

        #content .container .hafareaNEW .studybox.twofifth {
            min-height: 180px;
        }

        #content .container .hafareaNEW .studybox.lesspadding {
            padding: 5px 10px 5px 49px;
        }

        #content .container .hafareaNEW .studybox .fifthbox ul li p strong {
            font-weight: normal;
        }

        #content .container .hafareaNEW .studybox ul li {
            list-style: disc;
            width: 100%;
            float: left;
        }


        #content .container .hafareaNEW .studybox ul {
            padding: 0px;
            color: #0e6107;
        }

            #content .container .hafareaNEW .studybox ul li p { 
                font-size: 15px;
                color: #0e6107;
                margin: 0px;
            }

                #content .container .hafareaNEW .studybox ul li p strong {
                    color: #b28806;
                    font-weight: bold;
                }

                #content .container .hafareaNEW .studybox ul li p strong {
                    color: #b93805;
                    font-weight: bold;
                }

                    #content .container .hafareaNEW .studybox ul li p strong.blue {
                        color: #0474e4;
                        font-weight: bold;
                    }

                    #content .container .hafareaNEW .studybox ul li p strong.black {
                        color: #000;
                        font-weight: bold;
                    }

        #content .container .hafareaNEW .studybox img {
            max-width: 100%;
            float: right;
            margin-top: -70px;
        }

        #content .container .hafareaNEW .studybox .free {
            position: absolute;
            bottom: -20px;
            left: 0px;
        }

        #content .container .hafareaNEW .studybox.extrapadding img {
            margin-top: -40px;
        }

        #content .container .hafareaNEW .studybox .studyboxheading {
            width: 100%;
            float: left;
            margin: 10px 0px 0px;
            padding: 0px; 
            font-weight: 400;
            color: #000000;
            font-size: 24px;
        }

        #content .container .hafareaNEW .studybox .studyboxtext {
            width: 100%;
            float: left;
            margin: 0px 0px;
            padding: 0px; 
            font-weight: normal;
            color: #36502c;
            font-size: 16px;
            text-align: justify;
        }

            #content .container .hafareaNEW .studybox .studyboxtext strong {
                color: #b93805;
                font-weight: bold;
            }

        #content .container .hafareaNEW .studybox img.webbased {
            position: absolute;
            bottom: 5px;
            right: 5px;
        }

    #content .container .hafareaNEW:nth-child(2) .studybox:nth-child(2) {
        padding: 20px 25px;
    }

    #content .container .hafareaNEW .studybox img.mobileinhand {
        float: right;
    }

    #content .container .hafareaNEW .studybox .fifthbox ul {
        padding: 0px 0px 10px 70px;
    }


        #content .container .hafareaNEW .studybox .fifthbox ul li p strong, #content .container .hafareaNEW .studybox ul li p strong {
            color: #c55a11;
            font-weight: bold;
        }

    #content .container .hafareaNEW:nth-child(2) .studybox:nth-child(3) {
        padding: 10px 35px;
    }

    #content .container .hafareaNEW .studybox .felxpaymentheading {
        width: 100%;
        float: left;
        margin: 0px 0px 5px;
        padding: 0px; 
        font-weight: normal;
        color: #0e6107;
        font-size: 22px;
        text-align: center;
    }

        #content .container .hafareaNEW .studybox .felxpaymentheading strong.orange {
            color: #c55a11;
        }

    #content .container .hafareaNEW .studybox ul li p strong.orange {
        color: #c55a11;
    }

    #content .container .hafareaNEW .studybox ul li p strong.mud {
        color: #bf9000;
    }

    #content .container .hafareaNEW .studybox ul li p strong.red {
        color: red;
    }

    #content .container .hafareaNEW .studybox ul li a.readmore { 
        font-size: 18px;
        color: #000;
        margin: 10px 0px 0px;
        line-height: 20px;
        min-width: 10px;
        float: left;
    }

/*WATCH VIDEO BUTTON NEW PLACE*/

.watchvideobuttonNEW,
.watchvideobuttonNEW_CO {
    width: 30%;
    float: right;
    margin: 0px 35%;
    padding: 15px;
    text-align: center; 
    font-weight: normal;
    color: #fff;
    font-size: 17px;
    background: #ffc528;
}

    .watchvideobuttonNEW:hover,
    .watchvideobuttonNEW:focus,
    .watchvideobuttonNEW_CO:hover,
    .watchvideobuttonNEW_CO:focus,
    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton:hover,
    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton:focus {
        background: #333;
        color: #fff;
        text-decoration: none;
    }

.watchvideobuttonNEW_CO {
    width: 50%;
    margin: 0px 25%;
    padding: 12px 0px;
}


/*ENGLISH ARABIC SHOW HIDE*/


.fa.fa-video-camera {
    margin: 0px 5px;
}

.video-main-wrapper {
    margin-bottom: 20px;
}

#tutorialVideoArea .container .row .tutorialVideoArea.wow.fadeInLeft .btnTeacherStudents.row .col-lg-6 {
    width: 100%;
}

#content .container .hafareaNEW .studybox.lesspadding ul li p strong {
    font-weight: normal;
}

#lightbox .modal-body img {
    padding: 25px;
}



.TGCarea {
    width: 100%;
    float: left;
    margin: 30px 0px;
    padding: 0px;
}

ul.youtubewall .video-main-wrapper .ar-desc ul {
    margin: 10px 0px;
    padding: 0px;
}

    ul.youtubewall .video-main-wrapper .ar-desc ul li {
        margin: 0px 0px 0px 30px;
    }


.modal-dialog {
    margin: 70px auto !important;
}

.col-md-4.col-sm-12.col-xs-12.col-lg-12.brick {
    width: 100%;
}

#content .container .FAQs .FaqsArea .panel-default .panel-collapse .panel-body p a {
    word-wrap: break-word;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox {
        width: 65%;
    }
}


@media only screen and (-webkit-min-device-pixel-ratio: 1) {
    ::i-block-chrome, #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) .featurebox {
        margin-top: 44px;
    }
}


/*RESPONSIVE CSS*/


@media (max-width:1600px) {
    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox {
        width: 600px;
        left: -590px;
    }

    #content .container .hafareaNEW.HAFpage .studybox {
        min-height: 190px;
    }
}

@media (max-width:1440px) {
    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span {
        font-size: 14px;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 550px;
        left: -540px;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        top: 4%;
    }

        #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three {
            top: 46%;
        }
}

@media (max-width:1366px) {
    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox {
        width: 600px;
        left: -590px;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 500px;
        left: -490px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox {
            padding: 15px;
        }
}

@media (max-width:1280px) {
    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) img {
        max-width: 100%;
        margin-bottom: 45px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) .featurebox {
        margin-left: 0px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox {
        width: 600px;
        left: -590px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox {
            padding: 25px;
            overflow: hidden;
        }
}

@media (max-width:1080px) {
    #banner div.container img.bannerlaptop {
        width: 70%;
    }

    #banner div.container .bannerdescriptionarea {
        width: 42%;
    }


    #content .container .col-lg-6.col-md-6 {
        padding: 50px 35px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(1), #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(1) .studybox:nth-child(2) {
        padding: 20px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton {
        top: 0px;
        left: 10px;
    }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(1) {
        padding: 25px 15px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li p, #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li {
        font-size: 1.1em;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul, #content .container .hafarea .col-lg-6.col-md-6 .studybox .felxpaymentheading {
        margin-bottom: 5px;
    }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) {
        padding: 10px 35px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li a.readmore {
        margin: 0px;
    }

    #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton {
        bottom: 80%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox {
        left: 24%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.two {
            left: 57%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven {
            left: 66%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six {
            left: 24%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
            top: 6%;
            left: 26%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.nine {
            top: 19%;
            left: 57%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
            top: 70%;
            left: 19%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eleven {
            top: 70%;
            left: 73%;
            width: auto;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox {
            width: 600px;
            left: -590px;
            z-index: 1000;
        }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 400px;
        left: -390px;
    }

    #content .container .StudyProcedure .col-lg-4:nth-child(2) .StudyProceduresbox .text {
        padding-top: 30px;
    }

    #content .container .StudyProcedure .col-lg-4:nth-child(3) .StudyProceduresbox .text {
        padding: 25px 0px;
    }

        #content .container .StudyProcedure .col-lg-4:nth-child(3) .StudyProceduresbox .text br {
            display: none;
        }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 33%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 19%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 30%;
        }

    #content .container .hafareaNEW .studybox.extrapadding img,
    #content .container .hafareaNEW .studybox img {
        margin-top: 0px;
    }

    #content .container .col-lg-6.col-md-6.fifthbox {
        padding: 30px;
    }

        #content .container .col-lg-6.col-md-6.fifthbox ul {
            padding-left: 0px !important;
        }

    #content .container .hafareaNEW .studybox.extrapadding {
        padding: 20px 50px;
    }

    #content .container .col-lg-6.col-md-6 .studybox.twofifth .col-lg-6.col-md-6 {
        padding: 35px;
    }

    #content .container .hafareaNEW .col-lg-6.col-md-6:nth-child(1) .studybox:nth-child(3) {
        padding: 40px;
    }

    #content .container .hafareaNEW.HAFpage .studybox {
        min-height: 260px;
    }

        #content .container .hafareaNEW.HAFpage .studybox.twofifth {
            min-height: 300px;
        }

    #content .container .hafareaNEW .studybox ul li p br {
        display: none;
    }

    #content .container .hafareaNEW.HAFpage .studybox.lesspadding .col-lg-4 {
        width: 100%;
    }
}

@media (max-width:1024px) {
    #banner div.container img.bannerlaptop {
        width: 70%;
    }

    #banner div.container .bannerdescriptionarea {
        width: 40%;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
            font-weight: normal;
            font-size: 16px;
        }



    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        max-width: 60%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 33%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 19%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 15%;
        }


    #content .container .featuresanddetails .col-lg-6.col-md-6 {
        padding: 0px;
    }

        #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) img {
            margin: 102px 0px;
        }

    #content .container .hafareaNEW .studybox,
    #content .container .hafareaNEW .studybox.twofifth,
    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox {
        min-height: 270px;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox .greenboxwrapper {
        font-size: 12px;
        line-height: 11px;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .col-lg-6.col-md-6 {
        padding: 0px !important;
    }

    #content .container .hafareaNEW .studybox.lesspadding .col-lg-4 {
        width: 100%;
    }

    #content .container .hafareaNEW .studybox ul li a.readmore {
        margin: 0px 0px 10px;
    }

    #content .container .AMTE .AMTErow .col-lg-6 {
        padding: 10px;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox:nth-child(1) {
        min-height: 670px;
    }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul li {
        min-height: 56px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(1) .studybox:nth-child(2) .col-lg-7.col-md-7 {
        width: 70%;
    }
}

@media (max-width:900px) {

    #banner div.container {
        width: 100%;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
            font-size: 46px;
        }

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) img {
        display: none;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(1), #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) {
        padding: 0px 10px;
    }

        #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) .featurebox {
            margin: 0px;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 {
        text-align: center;
    }

        #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 br {
            display: none;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8.paddingnone, #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5.paddingnone {
        text-align: center;
    }

        #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 img, #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5.paddingnone img.smalllaptop {
            width: auto;
            float: none;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox {
        padding: 15px !important;
    }

        #content .container .studytoolarea .col-lg-6.col-md-6 .studybox img.webbased {
            position: relative;
            top: 0px;
            right: 0px;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(1), #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(1) .studybox:nth-child(2), #content .container .studytoolarea .col-lg-6.col-md-6 .studybox {
        text-align: center;
    }

        #content .container .studytoolarea .col-lg-6.col-md-6 .studybox img.mobileinhand {
            float: none;
        }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 {
        width: 60%;
        float: left;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 {
        width: 40%;
        float: left;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton {
        transform: rotate(0deg);
        min-width: 10px;
        left: 20px;
        top: 35px;
        padding: 10px 18px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li {
        list-style: none;
        text-align: center;
    }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-7.col-md-7 {
        width: 40%;
        margin-left: 20%;
    }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) .col-lg-4.col-md-4 {
        width: 27%;
    }

        #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) .col-lg-4.col-md-4.fifthbox {
            margin-left: 19%;
        }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        left: 16%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.two, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
            left: 59%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            left: 71%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            left: 16%;
        }

    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton {
        transform: rotate(0deg);
    }

    #footer .container .col-lg-3, #footer .container .col-lg-4, #footer .container .col-lg-5 {
        width: 100%;
        float: left;
        margin: 0px 0px 10px;
        padding: 10px;
    }

    #footer .container .col-lg-5 {
        padding: 15px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
        top: 6%;
        left: 22%;
        width: auto;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.nine {
        top: 19%;
        left: 59%;
        width: auto;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
        top: 70%;
        left: 10%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.eleven {
        top: 70%;
        left: 80%;
        width: auto;
    }

    #content .container .StudyProcedure .col-lg-4 {
        width: 100%;
        float: left;
        margin-bottom: 00px;
    }

        #content .container .StudyProcedure .col-lg-4:nth-child(1) .StudyProceduresbox .imgarea {
            margin: 30px 0px;
        }

    #content .container .headingarea {
        margin: 0px 0px 30px 0px !important;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        max-width: 60%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 28%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 17%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 15%;
        }

    #verification {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px;
    }

        #verification .verification-Q, #verification .verification-Cross, #verification .verificationClsBox {
            width: 100%;
            float: left;
            margin: 0px 0px 20px 0px;
            padding: 0px;
            text-align: center;
        }

            #verification .verificationClsBox #dvConfirm h3, #verification .verificationClsBox #dvConfirm h4 {
                width: 100%;
                margin: 0px;
                padding: 0px;
                text-align: center;
            }

        #verification .frmBox1 {
            margin: 10px 0px;
        }

    #dvConfirm {
        padding: 0px;
    }

    #content .container .col-lg-6.col-md-6 {
        text-align: center;
    }

        #content .container .col-lg-6.col-md-6 img,
        #content .container .col-lg-6.col-md-6 img.pull-left {
            float: none !important;
        }

        #content .container .col-lg-6.col-md-6 ul li {
            text-align: left;
        }

        #content .container .col-lg-6.col-md-6 .studybox .col-lg-6.col-md-6 {
            padding: 0px !important;
        }

        #content .container .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2),
        #content .container .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) {
            padding-left: 85px;
        }


    .alert.alert-danger.dverror_Contact,
    .alert.alert-success.dvsuccess_Contact {
        width: 100%;
        float: left;
    }

    .col-lg-6.col-md-6.col-xs-offset-3 {
        margin-left: 0px;
        width: 100%;
    }



    #content .container .hafareaNEW.HAFpage .studybox,
    #content .container .hafareaNEW.HAFpage .studybox.twofifth,
    #content .container .hafareaNEW .studybox,
    #content .container .hafareaNEW .studybox.twofifth {
        min-height: 100px;
    }



    #content .container .featuresanddetails .col-lg-6.col-md-6:nth-child(2) img {
        margin: 0px;
    }
}

@media (max-width:800px) {


    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        font-size: 36px;
        width: 50%;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran span {
            font-size: 16px;
        }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
        top: 60px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        width: 70%;
        margin-left: 15%;
        margin-right: 15%;
    }

    #content .container .headingarea {
        margin-top: 50px !important;
    }

    #content .container .col-lg-6.col-md-6 {
        padding: 50px 10px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 500px;
        left: -490px;
    }

    #content .container .col-lg-6.col-md-6 .orangeheading.marginbottom30 {
        margin-top: 30px;
    }

    .col-lg-6.col-md-6.col-xs-offset-3 {
        width: 100%;
        margin: 0px;
        padding: 0px;
    }

    #banner div.container .callusbuttons {
        left: 4%;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .col-lg-6.col-md-6 {
        padding: 0px !important;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox a.watchvideobutton {
        width: 40%;
        margin: 10px 30%;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .featureorangeheading {
        text-align: left;
    }

    #content .container .VissionMission {
        margin: 0px 0px 30px 0px;
    }

    .innerpage {
        margin-top: 0px !important;
    }



    #content .container .BestDesignForFunction2 p {
        width: 100%;
        float: left;
    }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6.col-md-6 {
        width: 100%;
    }

    #content .container .BestDesignForFunction2 {
        margin: 30px 0px 30px 0px;
        width: 100%;
        float: left;
    }

    .col-lg-4.col-md-4,
    #content .container .coursearea .col-lg-6.col-md-6 {
        width: 100%;
        float: left;
    }

    #content .container .headingarea .headingareatop img, #tutorial .container .headingarea .headingareatop img {
        display: none;
    }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
        left: 93%;
    }

    #content .container .featuresanddetails,
    #content .container .hafareaNEW,
    #content .container .studytoolarea {
        margin: 30px 0px !important;
    }
}

@media (max-width:767px) {


    #lightbox .modal-dialog {
        width: 98% !important;
    }



    #banner {
        padding: 40px 0px 10px;
    }

        #banner div.container img.bannerlaptop {
            width: 60%;
        }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
            padding: 40px 0px 20px;
        }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
            top: 20px;
        }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
            font-size: 16px;
            padding: 10px 20px;
        }

            #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton span {
                font-size: 12px;
            }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text {
        padding-right: 20%;
    }

        #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
            left: 87%;
        }


    #content .container .headingarea .hexaheading {
        font-size: 26px;
    }

        #content .container .headingarea .hexaheading span.headingtext span.hexanumber {
            top: -17px;
        }

    #content .container .AMTE .AMTErow .col-lg-7 {
        padding: 10px 0px;
        text-align: center;
    }

    #content .container .BestDesignForFunction {
        margin-bottom: 30px;
    }

    #content .container .AMTE {
        margin: 0px 0px 00px;
    }

    .signInWindow,
    .resetPwWindow {
        width: 100%;
        height: 100%;
        float: right;
        padding: 25% 10px;
        background: rgba(236, 179, 35, 0.8);
        position: fixed;
        z-index: 10;
        top: 0px;
        right: 0px;
    }

    .resetPwWindow {
        background: rgba(216, 143, 46, 0.8);
    }

    #signinWindow .frmBox1,
    #signinWindow .frmBox2 {
        background: #fff;
        border: 1px solid #deab28;
        width: 100% !important;
        border-right: 0px;
        border-bottom: 0px;
        margin: 0px 0px 10px 0px;
        padding: 0px;
    }

    #signinWindow form {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px;
    }


    #banner div.container .bannerdescriptionarea {
        top: 50px;
    }


    #banner div.container .callusbuttons {
        top: 0px;
    }

    .modal-body iframe {
        width: 100%;
    }

    #content .container .col-lg-6.col-md-6 .orangeheading.marginbottom30 {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .headingarea {
        margin: 0px 0px 10px 0px !important;
    }

    #content .container .headingarea .headingareatop, #tutorial .container .headingarea .headingareatop {
        margin-top: 30px;
    }

    #content .container .featuresanddetails .col-lg-6.col-md-6 .featurebox .featureorangeheading {
        text-align: left;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox span.signinonlinearea .watchvideobutton {
        width: 100%;
        margin: 10px 0px;
        padding: 10px 5px;
        font-size: 14px;
    }


    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span {
        width: 100%;
        float: left;
        margin: 10px 0px 0px;
        padding: 0px;
        position: relative;
        bottom: 0px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span .watchvideobutton {
            width: 100%;
            margin: 0px 0px;
            padding: 10px 5px;
            font-size: 14px;
        }

    #content .container .studytoolarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) {
        padding: 0px !important;
        overflow: hidden;
    }

    #content .container .hafareaNEW .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-6.col-md-6 {
        width: 100%;
    }

    .PaginationArea > a.next, .PaginationArea > a.prev {
        max-width: 50%;
    }

    .PaginationArea > a.next {
        text-align: right;
    }

        .PaginationArea > a.next > i.fa, .PaginationArea > a.prev > i.fa {
            display: none;
        }

    #content .container .headingarea .hexaheading {
        opacity: 0.7;
    }

        #content .container .headingarea .hexaheading img {
            display: none;
        }

    #content .container .AMTE .AMTErow .col-lg-6 .AMTEbox .col-lg-6 ul a.watchvideobutton {
        width: 100%;
        position: relative;
        bottom: 0px;
        margin-bottom: 10px;
    }

    #content .container .FAQs .FaqsArea .panel-default .panel-collapse .panel-body ul li a u {
        word-wrap: break-word;
    }

    #content .container .BestDesignForFunction2 {
        margin: 30px 0px 0px 0px;
        width: 100%;
        float: left;
        padding: 0px;
    }

    [class*='col-'] {
        width: 100%;
        float: left;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
        width: 104px;
    }

    #content .container .coursearea .col-lg-6.col-md-6 {
        width: 100%;
    }

    #content .container .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2), #content .container .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) {
        padding-right: 25px;
    }



    ul.youtubewall li .thumbwrap {
        margin: 0px !important;
    }

    .dropdownmenulvltwo {
        display: none;
    }

    #Instructions ul {
        margin-left: 0px;
        padding-right: 30px;
    }

    .watchvideobuttonNEW, .watchvideobuttonNEW_CO {
        padding: 5px;
    }
}

@media (max-width:736px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
        right: -90px;
    }

    #content .container .headingarea .hexaheading {
        padding: 0px 10%;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading {
        padding: 0px;
    }

        #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading h4.panel-title a, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a {
            padding: 10px 30px 10px 5px;
        }

            #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading h4.panel-title a:after, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a:after, #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading.active h4.panel-title a::after, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading.active h4.panel-title a::after {
                line-height: 32px;
                height: 100%;
            }

    #content .container .aciarea .aciareabox .col-lg-6.col-md-6 {
        padding-bottom: 20px !important;
    }

    .innerpage {
        padding-top: 20px !important;
    }
}

@media (max-width:667px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
        right: -104px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 450px;
        left: -440px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        left: 12%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.two, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
            left: 59%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            left: 72%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            left: 12%;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(1) {
        padding: 25px 15px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-7.col-md-7.fifthbox ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5 ul li p, #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-4.col-md-4 ul li p, #content .container .coursearea .col-lg-6.col-md-6 .courseareabox ul li, #content .container .aciarea .aciareabox .col-lg-6.col-md-6 p {
        font-size: 1em;
    }

    #content .container .headingarea .headingareatop {
        font-size: 20px;
    }

    #content .container .aciarea, #content .container .hafarea, #content .container .studytoolarea, #content .container .featuresanddetails {
        margin-bottom: 30px;
    }

    #content .container .col-lg-6.col-md-6 .orangeheading {
        font-size: 16px;
    }

    #content .container .headingarea .hexaheading {
        font-size: 20px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .orangeheading, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .orangeheading {
        font-size: 1.3em;
        line-height: 1.1em;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
        top: 70%;
        left: 6%;
        width: auto;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        max-width: 60%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 25%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 15%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 15%;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:after, #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:before {
                left: 75%;
            }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        font-size: 14px;
        padding: 7px;
    }


    #banner div.container .callusbuttons a {
        font-size: 12px;
    }

    #content .container .col-lg-6.col-md-6 {
        padding: 0px 10px 50px;
    }

    #content .container .hafareaNEW {
        margin: 0px;
    }

    #content .container .coursearea .col-lg-6.col-md-6 {
        padding: 0px;
    }


    .watchvideobuttonNEW {
        width: 50%;
        margin: 0px 25%;
    }
}

@media (max-width:640px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran span {
        font-size: 12px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        font-size: 22px;
        line-height: 24px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        padding: 58px 0px;
    }

    .aciarea .aciareabox .col-lg-6.col-md-6 {
        width: 100%;
        float: left;
    }

    .innerpage {
        padding-top: 50px !important;
    }


    #content .container .hafareaNEW .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-6.col-md-6 {
        float: right;
        padding: 0px !important;
    }
}

@media (max-width:568px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        padding: 38px 0px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
        top: -5px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        width: 120px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            width: 175px;
        }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        left: 14%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.two, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
            left: 59%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            left: 72%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            left: 18%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            top: 75.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four {
            top: 57%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
            width: 400px;
            left: -390px;
        }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox {
                padding: 25px 10px;
            }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
            left: 15%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
            top: 68%;
            left: 4%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.eleven {
            top: 68%;
        }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        max-width: 70%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 22%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 12%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 15%;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:after, #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:before {
                left: 65%;
            }

    #banner div.container .bannerdescriptionarea {
        top: 20px;
    }

    #banner div.container .callusbuttons {
        top: -10px;
    }

        #banner div.container .callusbuttons a {
            padding: 5px;
        }
}

@media (max-width:533px) {

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        padding: 25px 0px;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton {
        padding: 5px;
        font-size: 1em;
        top: 35%;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton i.fa {
            display: none;
        }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 350px;
        left: -340px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        top: 3.5%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.two, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
            left: 59%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            left: 72%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            left: 16%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.three, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.three {
            top: 45%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four {
            top: 56.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.five, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.five {
            top: 65.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            top: 75.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            top: 88%;
        }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .studysubheading {
        width: 100%;
        padding-right: 30%;
    }

        #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .studysubheading img {
            top: 10px;
            right: 0px;
            max-width: 30%;
        }

    #banner div.container .callusbuttons {
        left: 2%;
    }

    .hexanumber {
        display: none;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox .greenboxwrapper {
        font-size: 12px;
        line-height: 12px;
    }
}

@media (max-width:480px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        font-size: 14px;
        padding: 10px;
        line-height: 20px;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton span {
            font-size: 11px;
        }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        font-size: 16px;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran span {
            font-size: 10px;
            line-height: 12px;
        }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text {
        padding-right: 30%;
        font-size: 1.1em;
    }

        #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
            left: 80%;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-7.col-md-7 {
        width: 80%;
        padding: 0px 0px 10px 0px;
    }

        #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-7.col-md-7 ul {
            padding: 0px;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-5.col-md-5 {
        width: 80%;
        margin-left: 20%;
    }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(3) .col-lg-4.col-md-4 {
        width: 80%;
        margin-left: 20%;
        margin-bottom: 10px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        left: 11%;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            left: 11%;
        }

    #content .container .headingarea .headingareatop img {
        margin: 0px 5px;
    }

    #content .container .headingarea .headingareatop img {
        display: none;
    }

    #content .container .headingarea .hexaheading span.headingtext span.hexanumber {
        top: -60px;
        left: 40%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
        left: 9%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.ten {
        top: 57%;
        left: 2%;
        width: 70px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        font-size: 12px;
    }
}

@media (max-width:414px) {

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
        right: -144px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
        padding: 18px 0px;
    }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton span {
        font-size: 10px;
    }

    #content .container .studytoolarea .col-lg-6.col-md-6 .studybox img, #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 img, #content .container .studytoolarea .col-lg-6.col-md-6 .studybox .col-lg-5.col-md-5.paddingnone img.smalllaptop, #content .container .aciarea .aciareabox:nth-child(2) .col-lg-6.col-md-6:nth-child(2) p:nth-child(2) img {
        max-width: 100%;
    }

    #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton, #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton {
        font-size: 10px;
    }

        #content .container .hafarea .col-lg-6.col-md-6 .studybox .watchvideobutton i.fa, #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton i.fa {
            width: 100%;
            display: block;
        }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        width: 100px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .greenboxwrapper, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .greenboxwrapper {
            font-size: 10px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            width: 145px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            top: 73.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            top: 85%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
            width: 300px;
            left: -290px;
        }

    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox img {
        max-width: 100%;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 16%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 7%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 14%;
        }

    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        width: 96%;
        padding: 5px;
        margin-right: 2%;
        margin-left: 2%;
    }

    .downloadNEWarea .downloadbutton,
    .downloadNEWarea .GoogleStore,
    .downloadNEWarea .iTune {
        width: 100%;
        margin: 0px 0px 20px 0px;
    }
}

@media (max-width:375px) {
    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        font-size: 12px;
        padding: 10px;
        line-height: 20px;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton span {
            line-height: 10px;
        }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
        left: 75%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        width: 90px;
    }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            width: 135px;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
            top: 72.5%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
            top: 84%;
        }

        #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
            width: 250px;
            left: -240px;
        }

            #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox .registrationstepshoverbox .bluetext span {
                position: relative;
                top: 0px;
                left: 0px;
                width: 100%;
                float: left;
                margin-top: 30px;
            }

            #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
                top: -20px;
            }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a span.stars i.fa {
        font-size: 10px;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-heading h4.panel-title a, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-heading h4.panel-title a {
        font-size: 0.65em;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body p.heading, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body p.heading {
        font-size: 0.8em;
    }

    #content .container .accordianarea .col-lg-6.col-md-6 #accordion .panel-default .panel-collapse .panel-body p.cols, #content .container .accordianarea .col-lg-6.col-md-6 #accordion2 .panel-default .panel-collapse .panel-body p.cols {
        font-size: 0.7em;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.eight {
        left: 5%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.eleven {
        top: 57%;
    }
}

@media (max-width:360px) {
    #content .container .hafarea .col-lg-6.col-md-6 .studybox .col-lg-8.col-md-8 ul.paddingtop {
        padding-top: 0px;
    }

    #content .container .headingarea .hexaheading span.headingtext span.hexanumber {
        left: 30%;
    }

    #content .container .coursearea .col-lg-6.col-md-6 .courseareabox .watchvideobutton {
        right: 30%;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox .imgarea .greenbox.two {
        top: 20%;
    }

    #content .container .VissionMission .col-lg-6 .headingarea .headingareatop {
        font-size: 26px;
    }

        #content .container .VissionMission .col-lg-6 .headingarea .headingareatop img {
            margin: 0px 10px;
        }

    #content .container .BestDesignForFunction2 .BestDesignForFunctionTable {
        overflow-x: scroll;
        max-width: 100%;
    }
}

@media (max-width:320px) {
    #banner div.container .bannerdescriptionarea {
        width: 55%;
    }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .quranrailimg {
            right: -146px;
        }

        #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquran {
            padding: 18px 0px 4px;
        }

    #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text {
        padding-right: 35%;
    }

        #content .container .col-lg-6.col-md-6 .explorebox .explorerow .text img.outofboxright {
            left: 70%;
        }

    #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-7.col-md-7, #content .container .hafarea .col-lg-6.col-md-6:nth-child(2) .studybox:nth-child(2) .col-lg-5.col-md-5 {
        width: 70%;
        margin-left: 30%;
    }

    #content .container .aciarea .aciareabox .col-lg-6.col-md-6 .watchvideobutton {
        right: -35px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .greenboxwrapper, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .greenboxwrapper {
        text-transform: none;
        line-height: 10px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox:after, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox:after {
        top: 66%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox {
        padding: 5px;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox, #content .container .registrationstepsarea .registrationstepsbox .greenbox {
        width: 80px;
        top: 6.5%;
        left: 10%;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.two {
        top: 18%;
        left: 61%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
        left: 2%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.four, #content .container .registrationstepsarea .registrationstepsbox .greenbox.four {
        top: 57.5%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox.six, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.six {
        top: 74.5%;
    }

    #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox.seven {
        top: 86%;
    }

    #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .registrationstepsbox .greenbox .hoverbox, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox.hoverbox2, #content .container .registrationstepsarea .col-lg-6.col-md-6 .registrationstepsbox .greenbox .hoverbox {
        width: 230px;
        left: -220px;
    }

    body {
        width: 100%;
        overflow-x: hidden;
    }

    #content .container .StudyProcedure .col-lg-4 .StudyProceduresbox {
        width: 100%;
        float: left;
        margin: 0px 0px 100px;
        padding: 10px;
        border-radius: 35px;
        background: #fffdef;
        border: 1px solid #9b6f28;
        position: relative;
    }

    #content .container .BestDesignForFunction .BDFFrow .BDFFboxone {
        margin-left: 10%;
    }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.two {
            margin-left: 0%;
        }

        #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three {
            margin-left: 15%;
        }

            #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:after, #content .container .BestDesignForFunction .BDFFrow .BDFFboxone.three:before {
                left: 60%;
            }


    #banner div.container .bannerdescriptionarea .bannerdescriptionarea_wrapper .studyingquranbutton {
        font-size: 12px;
        line-height: 14px;
    }

    #banner div.container .bannerdescriptionarea {
        top: 0px;
    }


    #banner div.container .callusbuttons {
        top: -25px;
    }

        #banner div.container .callusbuttons a {
            font-size: 11px;
        }
}





.red {
    color: #c00000 !important;
}

.green {
    color: #385723 !important;
}

.blue {
    color: #197ec4 !important;
}

.darkblue {
    color: #2f5597 !important;
}

.mud {
    color: #7f6000 !important;
}

.purple {
    color: #7030a0 !important;
}

.orange {
    color: #c55a11 !important;
}

.grey {
    color: #a6a6a6 !important;
}

.paret {
    color: #92D050 !important;
}

.mahroon {
    color: #C00000 !important;
}

.gold {
    color: #BF9000 !important;
}

.black {
    color: #000 !important;
}

.lightgreen {
    color: #92D050 !important;
}

.bluegrey {
    color: #354a5f !important;
}

.nopadding {
    padding: 0px !important;
}

/*a:active,
a:focus,
a:visited,
a:link {
    outline: 0 !important;
    border: none !important;
}*/

/*img:active,
img:focus,
img:visited,
a:link {
    outline: 0 !important;
    border: none !important;
}*/

ul.youtubewall li .panel {
    z-index: 100 !important;
}

/*SAFARI*/

.signWindowBtn > img {
    float: right;
}


.smalllaptop {
    margin-top: 30px;
}

.OnlineVirtualClassroomUl ul li {
    width: 90% !important;
    margin-left: 10% !important;
}



.LearnQuranSectionDetail {
    margin-top: 25px;
    text-align: justify;
    width: 100%;
    float: left;
}




.TopWatchVideoContainer {
    margin-top: 51px;
}


/* Email Verification PopUp Started*/

.EmailVerification_Overlay {
    width: 100%;
    float: left;
    margin: 0px;
    padding: 0px;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
}

.EmailVerification_PopUp {
    width: 50%;
    float: left;
    margin: 0px 25%;
    padding: 10px;
    background: #C8E6C9;
    position: fixed;
    top: 35%;
    left: 0px;
    z-index: 9999;
}


.EmailVerification_PopUp_inner {
    width: 100%;
    float: left;
    margin: 0px;
    padding: 0px;
    position: relative;
}

    .EmailVerification_PopUp_inner > .iconarea {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 0px;
        text-align: center;
    }

    .EmailVerification_PopUp_inner > .closebtn {
        width: 15px;
        float: left;
        margin: 0px;
        padding: 0px;
        text-align: center;
        position: absolute;
        top: 0px;
        right: 0px;
        color: #ff0000;
    }

    .EmailVerification_PopUp_inner > .greentext,
    .EmailVerification_PopUp_inner > .bluetext,
    .EmailVerification_PopUp_inner > .redtext {
        width: 100%;
        float: left;
        margin: 0px;
        padding: 10px 0px 0px;
        text-align: center;
        font-size: 16px;
        color: #1B5E20;
        font-weight: bold;
    }

    .EmailVerification_PopUp_inner > .bluetext {
        font-size: 15px;
        color: #165D4F;
        padding: 0px 0px 10px;
    }

    .EmailVerification_PopUp_inner > .redtext {
        font-size: 15px;
        color: red;
        padding: 0px 0px 10px;
    }

    .EmailVerification_PopUp_inner > .verificationbtn {
        min-width: 10px;
        float: left;
        margin: 0px 0px 10px 35%;
        padding: 5px 15px;
        text-align: center;
        font-size: 16px;
        color: #fff;
        background: #F39C12;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        -o-border-radius: 3px;
        -ms-border-radius: 3px;
        border: none;
    }

        .EmailVerification_PopUp_inner > .verificationbtn:hover,
        .EmailVerification_PopUp_inner > .verificationbtn:focus {
            background: #333;
        }

@media (max-width:1024px) {

    .EmailVerification_PopUp_inner > .verificationbtn {
        margin-left: 30%;
    }
}

@media (max-width:768px) {

    .EmailVerification_PopUp_inner > .verificationbtn {
        margin-left: 32%;
    }

    .EmailVerification_PopUp {
        width: 70%;
        float: left;
        margin: 0px 15%;
    }
}

@media (max-width:560px) {

    .EmailVerification_PopUp_inner > .verificationbtn {
        margin-left: 0px;
        width: 100%;
    }

    .EmailVerification_PopUp {
        width: 90%;
        float: left;
        margin: 0px 5%;
        top: 25%;
    }
}

/* Email Verification PopUp Ended*/

.searchcoursesMore {
    float: right;
}

.dverror_notify, .dvsuccess_notify {
    float: left;
    width: 100%;
}


.registerArea {
    width: 100%;
    float: left;
    margin: 0px 0px 30px 0px;
    padding: 0px;
}

.registerAreaHeading {
    width: 100%;
    float: left;
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    text-align: left; 
    font-weight: normal;
    color: #c55a11;
    font-size: 24px;
}

.fullNameTxt {
    background-color: #FFFFFF !important;
    width: 30.5%;
    margin-left: 2%;
    float: left;
    margin-top: 5px;
}

.jqvmap-zoomin, .jqvmap-zoomout {
    position: absolute;
    left: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #000000;
    padding: 3px;
    color: white;
    width: 12px;
    height: 13px;
    cursor: pointer;
    line-height: 6px;
    text-align: center;
}

.signupForm .SignUpFormCls div label {
    padding: 2px 10px 1px !important;
}

    .signupForm .SignUpFormCls div label input {
        margin: 5px -5px 0 !important;
        padding: 3px 5px 5px !important;
        font-size: 13px !important;
    }


#countryOfResidenceWorldMapModal .modal-dialog .modal-content .modal-header {
    background: #3498DB;
}

    #countryOfResidenceWorldMapModal .modal-dialog .modal-content .modal-header .modal-title {
        color: #fff;
    }

.FullName {
    background-color: #ecf0f1 !important;
    padding-bottom: 10px;
    margin-top: 5px;
}

    .FullName p {
        text-align: right;
        color: #ba4f15;
        padding: 13px 12px;
        font-weight: bold;
    }