.surah-container::before, .surah-container::after{content:"";display:block;width:100%;height:21px;background:url("../../images/img_BorderHor.png") repeat-x;background-position:center}
.inner-container{position:relative;margin:-21px 0;padding:21px 40px;direction:ltr;}.inner-container .col-auto{margin:-21px 0;width:21px;padding:0;}
.inner-container::before, .inner-container::after, .inner-container .col-auto::after{content:"";display:block;width:21px;background:url("../../images/img_BorderVer.png") repeat-y;background-position:center;position:absolute;left:0;top:0;bottom:0;}
.inner-container::after{right:0;left:auto}
.surah-container.container-fluid{padding:0;color:#000;direction:rtl;font-family:'Lato-Regular';font-size:12px;}
#adminDashboardSec .adminDashboardSec .adminDashboardSecTable .surah-container.container-fluid .inner-container .row{margin:0 -15px !important;}
.inner-container .col table{width:100%;border-color:#eee !important;border:1px solid #eee;margin:0 -1px}
.para-content .inner-container .col .row > .col:last-child{display:none;}
#adminDashboardSec .adminDashboardSec .adminDashboardSecTable .surah-container.container-fluid .inner-container .col table td{padding:2px 10px !important;text-align:center;border-color:#eee}
#adminDashboardSec .adminDashboardSec .adminDashboardSecTable .surah-container.container-fluid .inner-container .col table td:first-child{width:50%;text-align:left;font-size:12px}
.inner-container .col table td:nth-child(2) {color:#a03f40}
.inner-container .col table td:nth-child(3) {color:#206cb8}
.inner-container .col table td:nth-child(4) {color:#75a87a} 
.inner-container .col table td:nth-child(5) {color:#ff775f}
    .inner-container .col table th {
        background: #fffcda;
        background: -moz-linear-gradient(top, #fffcda 0%, #f8c98d 100%);
        background: -webkit-linear-gradient(top, #fffcda 0%,#f8c98d 100%);
        background: linear-gradient(to bottom, #fffcda 0%,#f8c98d 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcda', endColorstr='#f8c98d',GradientType=0 );
        color: #9b6437;text-align:center;line-height:14px;padding:10px 0;border-color:#9b6437;
    }
    .inner-container .col table tr:hover td:first-child{background:#f8c98d !important}
    .para-content .inner-container .col table td:first-child{width:50px !important;text-align:center !important;}
    .para-content .inner-container .col table td:nth-child(2){text-align:left !important;}
    .para-content .inner-container .col table td:nth-child(3){width:110px !important;text-align:right !important;}
    .para-content .inner-container .col table tr:hover td:first-child{background:none !important;}
    .para-content .inner-container .col table tr:hover td:nth-child(2){background:#f8c98d !important}
    .para-content .inner-container .col table tr:hover td:nth-child(3){background:#f8c98d !important}
    #StartCourse .relative{display:flex;align-items:center;padding:15px 0;text-align:center;}
    #StartCourse .relative .rel{position:relative;margin-right:5px;width:50%;max-width:250px}
    #StartCourse .rel i{position:absolute;right:5px;top:9px;z-index:0;}
    #StartCourse .relative input[type="text"]{width:100%;border-radius:0;height:30px;line-height:30px;background:transparent;position:relative;z-index:1;}
    #StartCourse .relative label{padding-right:10px;margin:0;}
    #sliderCourseLevelRange .slider-selection {background: #daa520;border: none;box-shadow: none !important;}
    #sliderCourseLevelRange .slider-handle{background:#6a3a1d;}
    
.selected-person{color:#000;text-transform:capitalize;text-align:left;align-items:center;font-size:13px;padding:20px 15px;display:flex;justify-content:space-between;border:none !important;}
.selected-person .person, .selected-person .personNot{color:#000;font-size:13px;text-transform:capitalize;text-align:left;display:block;width:50%;}
.selected-person .person h3, .selected-person .personNot h3{font-size:18px;display:block;width:100%;margin:0;}
.tabcontent{border:none !important;padding:6px 10px 10px !important;background:#f6f6f6}
.selected-person input[type="button"]{margin:0 !important;}
#ManageTeacher .teacher-list-table{max-height:300px;overflow-y:auto}
.selected-person input{margin-right:10px}
.selected-person + .teacher-list-table table{width:100%;table-layout:fixed;}
.selected-person + .teacher-list-table table td{word-break:break-all;}
.ui-dialog-titlebar-close::before{content:"X";color:#FFF}
.student-list-table table th.jtable-column-header-selecting:first-child{width:30px !important;text-align:left !important;padding:5px 10px !important;}
.ui-widget.ui-widget-content[aria-describedby="ManageStudentpopUp"]{top:30px !important;max-height:calc(100vh - 60px) !important;}
.ui-dialog .ui-dialog-content{max-height:calc(100vh - 112px) !important;overflow-y:auto;}
.ui-dialog .ui-dialog-content::-webkit-scrollbar{width:10px;}
div.jtable-main-container{overflow:initial;}
.student-list-table{overflow:unset;}
    @media (max-width:1092px){
        .inner-container .col-auto {
            margin:  10px -20px;
            height: 21px;width:calc(100% + 40px);
            padding: 0;
        }
        .inner-container .col-auto::after {
            background: url("../../images/img_BorderHor.png") repeat-x;
            width: 100%;
            height: 21px;
        }
    }
@media (max-width:576px) {
    .inner-container .col {
        flex-wrap: wrap;
        font-size: 12px;
    }

        .inner-container .col table td:first-child {
            font-size: 13px;
        }

        .inner-container .col table {
            width: 100%;
            margin: 0;
        }

    .container-fluid {
        padding: 0 10px;
    }

    .inner-container .col table:last-child thead {
        display: none;
    }
    #CourseContent{padding:6px 0px 10px !important}
    #CourseContent .inner-container{padding:21px 30px;margin:-8px 0}
    .inner-container::before, .inner-container::after, .inner-container .col-auto::after{width:10px;}
    .surah-container::before, .surah-container::after{height: 10px;}
    .inner-container .col-auto::after {height: 10px;width: calc(100% - 20px);background-size: auto 100%;margin-left: 10px;}
}
.selectedTD {
    background: #9de0ab !important;
}
.table-data{padding:0 !important;float:none;}
.course-list-search-form{display:flex;justify-content:flex-start;width:100%;margin:10px 0;}.course-list-search-form input[type="text"]{width:220px;height:30px;}
.btnAssignStudent, .btnAssignTeacher,.course-list-search-form input[type="button"], #CourseSettings .ButtonsSection input[type="button"], #CourseContent input[type="button"]{width:auto;min-width:100px;padding:0 10px;border:none;font-size: 12px;font-family: Lato-Semibold;color: #FFF;background: #2c3e50;height:30px;line-height: 27px;display: block;text-align: center;}
.courses-list-table table{position:static;}
.organization-dashboard-page table td{padding:7px 10px !important;line-height:normal;}
.course-list-search-form div{display:flex;justify-content:space-between;width:100%}
#StartCourse .buttonsSection{margin:0;}
#adminDashboardSec .adminDashboardSec .adminDashboardSecTable .fieldsTable tr td {
padding: 15px 7px 0 !important;
}
.para_contentBoxLabels {
color: #000;
font-size: 14px;font-weight:bold;
}
table.fieldsTable td input, table.fieldsTable td textarea {
height: 34px;
width: 100%;
padding: 0 10px;
}
table.fieldsTable td textarea {
height: 100px;
}
table.fieldsTable + .buttonsSection {
padding: 0 8px;
}.buttonsSection.right{text-align:right}
input#btnCreateCourse, .buttonsSection input {
min-width: 100px;
border: none;
font-size: 12px;
font-family: Lato-Semibold;
color: #FFF;
background: #2c3e50;
height: 30px;
line-height: 27px;
display: inline-block;
text-align: center;padding:0 15px;
}
.table-data.course-tab .tab + div{display:block;}
#CourseSettings[style="display: block;"]{display:flex !important;flex-wrap:wrap}
#CourseSettings .aCourseSettings>div{width:50%;padding:0 5px;margin-bottom:15px}
#CourseSettings>div:nth-child(3){width:100%;}
#CourseSettings>div>span{width:100%;display:block}
#CourseSettings .aCourseSettings>div>span input[type='text'], #CourseSettings .aCourseSettings>div>span select{width:100%;display:block;border:1px solid #666;height:34px;margin:0 !important;padding:0 5px;}
#CourseSettings .aCourseSettings>div:nth-child(4)>span input[type='text'], #CourseSettings .aCourseSettings>div:nth-child(4)>span select{width:calc(50% - 5px);float:left}
#CourseSettings .aCourseSettings>div:nth-child(4)>span select{float:right}
#CourseSettings .aCourseSettings>div:nth-child(6){order:11;}
#CourseSettings .aCourseSettings>div:nth-child(8){order:10;}
#CourseSettings .aCourseSettings>div:nth-child(12){order:12;}
#CourseSettings .range-counter{display:flex;justify-content:space-between}
#CourseSettings .aCourseSettings>div .slider.slider-horizontal{width:calc(100% - 10px) !important;}
/*.organization-dashboard-page table th:first-child, #ManageTeacher .organization-dashboard-page table th:nth-child(2), #ManageTeacherpopUp .organization-dashboard-page table th:nth-child(2){width:70px}*/
/*.organization-dashboard-page table th:last-child{width:100px}*/
.organization-dashboard-page table th:last-child{text-align:center !important;}
.organization-dashboard-page table td:first-child, .organization-dashboard-page table td:last-child[colspan='8']{text-align:center !important}
.organization-dashboard-page table td:first-child, .organization-dashboard-page table td:last-child{text-align:left !important;}
.ayahConditionTrue .card-header{padding:0;background:#daa520}
.ayahConditionTrue .card-header h5 button{color:#FFF;display:block;width:100%;text-align:left;text-decoration:none}
.ayahConditionTrue .card{border-color:#daa520;margin-bottom:5px}
.tab{background:#f39c12 !important;border:none}
.tab button{color:#F6F6F6;border-top:2px solid #f39c12;}
#CourseSettings .formrow + .course-sec-incomplete-msg,#CourseSettings .formrow + .course-sec-incomplete-msgg{float:left;width:100%;text-align:left}
.divCourseSearch + .organization-dashboard-page table#myTableCourses, #myTableTeachers, .organization-dashboard-page table{table-layout:fixed !important;}
.divCourseSearch + .organization-dashboard-page table#myTableCourses th:last-child, #myTableTeachers th:last-child{width:auto !important;text-align:left;}
#myTableTeachers th:last-child{text-align:left;}
.divCourseSearch + .organization-dashboard-page table#myTableCourses td:last-child{font-size:0;}
.divCourseSearch + .organization-dashboard-page table#myTableCourses td:last-child a{border-left:1px solid #999;padding:0 5px;font-size:12px;margin-bottom:5px;line-height:12px;} 
.divCourseSearch + .organization-dashboard-page table#myTableCourses td:last-child a:first-child{border-left:none !important;}
.tab button:hover, .tab button.active{background:#F6F6F6;color:#f39c12;border-top:2px solid #f39c12}
#CourseSettings .ButtonsSection input[type="button"], #CourseContent input[type="button"]{display:inline-block;width:auto;min-width:70px}
.card-body {display:flex;flex-wrap:wrap;}span.count{height:40px;width:40px;border-radius:50%;background: #f9fcf7;display:flex;margin:10px;text-align:center;align-items:center;justify-content:center;cursor:pointer;
background: -moz-linear-gradient(top,  #f9fcf7 0%, #f5f9f0 100%);
background: -webkit-linear-gradient(top,  #f9fcf7 0%,#f5f9f0 100%);
background: linear-gradient(to bottom,  #f9fcf7 0%,#f5f9f0 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9fcf7', endColorstr='#f5f9f0',GradientType=0 );border:1px solid #ccc;}
span.count:hover {background: #e0f3fa;
background: -moz-linear-gradient(top,  #e0f3fa 0%, #b6dffd 100%);
background: -webkit-linear-gradient(top,  #e0f3fa 0%,#b6dffd 100%);
background: linear-gradient(to bottom,  #e0f3fa 0%,#b6dffd 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0f3fa', endColorstr='#b6dffd',GradientType=0 );}
.ayahConditionTrue{direction:rtl;}
.ayahConditionTrue .showAyahTextClicked{display:flex;text-align:right;width:100%;border-bottom:1px solid #f6f6f6}
.ayahConditionTrue .showAyahTextClicked:last-child{border-bottom:none} 
.ayahConditionTrue .innerBody .lblAyah{line-height:40px;font-size:15px;max-width:calc(100% - 60px)}
.ayahConditionTrue .showAyahTextClicked .lblAyah{padding:10px;}
.ayahConditionTrue .card-body>.clearfix{width:100%;background:#f6f6f6;padding:8px;}
.ayahConditionTrue .card-body{padding:8px;}
.ayahConditionTrue .card{border-radius:0 !important;} 
.course-sec-incomplete-msg,.course-sec-incomplete-msgg{width:100% !important;margin:25px 0;display:block;font-size:16px;text-align:center;}
.course-sec-incomplete-msg span,.course-sec-incomplete-msgg span{display:block;margin:0;float:none;}
#CourseSettings{background:#F9f9f9}#CourseSettings .ButtonsSection{text-align:right;width:100% !important;float:left;}
#CourseContent .aCourseContent>div:last-child{text-align:right}
.formrow {display: inline-block;margin-bottom: 0 !important;background: #fff;min-height: 73px;margin-top: 10px;box-shadow: 1px 1px #e4e4e4;border: none;position: relative;padding: 10px 15px !important;width:100% !important;}
.formrow>span:first-child{display:block;font-weight:bold;color:#000000;font-size:14px;}
.formrow input[type="text"]{font-weight:normal;display: inline-block;position: relative;width: 100%;height: 27px;line-height: 27px;padding: 2px 5px 3px;border: none !important;outline: none;color: #000;font-size: 13px;transition: all linear .3s;}
.formrow input[type="text"]::-webkit-input-placeholder{opacity:1;color:#000}
.formrow select {display: block;width: 100%;padding: 0;color: #000;margin: 8px 0 6px;background: transparent;border: none !important;outline: none;font-size: 13px;transition: all linear .3s;}
.formrow span[style="color: red;"]{position:absolute;right:15px;top:10px;}.formrow textarea{border:none;color:#000;font-size:13px;padding:0 !important;}
#CourseSettings .formrow{width:calc(50% - 5px) !important;float:left;}
#CourseSettings .formrow:nth-child(odd){margin-right:10px;}
.formrow .bouble span input{width:60px !important;}#ddlCourseDuration{width:calc(100% - 60px) !important;}
.formrow .radios{line-height:34px;height:34px;}
#CourseSettings .range-counter{font-size:11px;line-height:13px;}
#txtAssignmentDuration{width:60px !important;display:inline-block !important;}
.courseSearch.course-list-search-form div{justify-content:flex-end;line-height:30px;align-items:center}
.courseSearch.course-list-search-form div input[type="radio"]{margin:0px 10px 0 20px;display:inline-block;vertical-align:middle;width:auto}
.courseSearch.course-list-search-form div input:first-child{margin-left:0}
.courseSearch.course-list-search-form div input[type="text"]{margin-left:20px}
#tblCoursesBody a{display:inline-block;white-space:nowrap}
#courseInfo, .divCourseSearch{background:#f6f6f6;}#courseInfo .formrow{margin:0;}.buttonsSection{margin-top:10px;}
.divCourseSearch{flex-wrap:wrap;padding:15px;}.divCourseSearch .formrow, .aManageTeacher .formrow{width:calc(50% - 7px) !important;justify-content:flex-start !important;flex-wrap:wrap !important;}
.divCourseSearch .formrow:nth-child(odd), .aManageTeacher .formrow:nth-child(2){margin-right:14px;}.formrow>label{color:#000;display:block;width:100%;font-weight:bold;font-size:14px;}
.divCourseSearch .formrow input:nth-child(2){margin-left:0 !important;}
input[type="button"] + input[type="button"]{margin-left:5px;}
#courseInfo .buttonsSection input{margin-left:auto}
.organization-dashboard-page{max-height:unset;}
.formcontianer{background:#f6f6f6;padding:15px;display:flex;flex-wrap:wrap;font-family:'Lato-Regular' !important;}
.form-row {width:calc(100% + 10px)}
.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{font-family:'Lato-Regular' !important;}
.aManageTeacher .formrow:nth-child(1){width:100% !important;}
.formcontianer .course-list-search-form{margin:10px 0 0 !important;justify-content:flex-end !important;border:none;}
#ManageTeacher .organization-dashboard-page + .course-list-search-form{justify-content:flex-end !important;padding-top:10px;margin:0 !important;padding-bottom:0 !important;border:none !important;}
a.worldmap {
    width: 16px;
    float: right;
    height: 16px;
    border-radius: 100%;
    color: #fff !important;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    background: #00baba;
    position: relative;
    top: 3px;
    right: 0px;
    cursor: pointer;
}
#ddlTimeZones1{width:calc(100% - 30px) !important;display:inline-block !important;vertical-align:middle}
#ddlTimeZones1 + a{margin-top:5px}
.formrow input[type="radio"], .formrow input[type="checkbox"]{margin:0 5px 0 10px}.formrow input[type="radio"]:first-child, .formrow input[type="checkbox"]:first-child{margin-left:0}
#divCourseName{padding: 10px 0;font-weight: bold;text-transform: uppercase;color: #FC9312;}#divCourseName + div.table-data{margin-top:0;}
#divCourseName span{color: #000;text-transform: none;font-weight: normal;}
.divCourseName{padding: 10px 0;font-weight: bold;text-transform: uppercase;color: #FC9312;}.divCourseName + div.table-data{margin-top:0;}
.divCourseName span{color: #000;text-transform: none;font-weight: normal;}
#timeZoneWorldMapModal .modal-dialog .modal-content .modal-header {
    background: #3498DB !important;
    display: inline-block !important;
}

    #timeZoneWorldMapModal .modal-dialog .modal-content .modal-header .modal-title {
        color: #fff !important;
        font-size: 20px !important;
        float: left;
        width: 100%;
    }

    #timeZoneWorldMapModal .modal-dialog .modal-content .modal-header .modal-title-note {
        color: #fff !important;
        font-size: 14px !important;
        float: left;
        width: 100%;
        display: none;
    }
.copylinkBox {
    line-height: 0 !important;
    font-size: 13px;
}

#alertDialogClipboard .modal-header {
    background: #8FE9D8;
}

.shareJoinCourseLink, .copylink {
    cursor: pointer;
}