@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css"); .mCustomScrollbar{-ms-touch-action:pinch-zoom;touch-action:pinch-zoom}.mCustomScrollbar.mCS_no_scrollbar,.mCustomScrollbar.mCS_touch_action{-ms-touch-action:auto;touch-action:auto}.mCustomScrollBox{position:relative;overflow:hidden;height:100%;max-width:100%;outline:0;direction:ltr}.mCSB_container{overflow:hidden;width:auto;height:auto}.mCSB_inside>.mCSB_container{margin-right:30px; border-left: 1px solid #E8E8E8;}.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container{margin-right:0;margin-left:30px}.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-left:0}.mCSB_scrollTools{position:absolute;width:16px;height:auto;left:auto;top:0;right:0;bottom:0;opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_outside+.mCSB_scrollTools{right:-26px}.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{right:auto;left:0}.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{left:-26px}.mCSB_scrollTools .mCSB_draggerContainer{position:absolute;top:0;left:0;bottom:0;right:0;height:auto}.mCSB_scrollTools a+.mCSB_draggerContainer{margin:20px 0}.mCSB_scrollTools .mCSB_draggerRail{width:7px;height:100%;margin:0 auto; position: absolute;left: 50%; top: 0; background-color: #E8E8E8 !important; -webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}.mCSB_scrollTools .mCSB_dragger{cursor:pointer;width:100%;height:30px;z-index:1}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{position:relative;width:4px;height:100%;margin:0 auto;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px;text-align:center}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:12px}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:8px}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonUp{display:block;position:absolute;height:20px;width:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools .mCSB_buttonDown{bottom:0}.mCSB_horizontal.mCSB_inside>.mCSB_container{margin-right:0;margin-bottom:30px; }.mCSB_horizontal.mCSB_outside>.mCSB_container{min-height:100%}.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal{width:auto;height:16px;top:auto;right:0;bottom:0;left:0}.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:-26px}.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer{margin:0 20px}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:2px;margin:7px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{width:30px;height:100%;left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:4px;margin:6px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:12px;margin:2px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:8px;margin:4px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{display:block;position:absolute;width:20px;height:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{right:0}.mCSB_container_wrapper{position:absolute;height:auto;width:auto;overflow:hidden;top:0;left:0;right:0;bottom:0;margin-right:30px;margin-bottom:30px}.mCSB_container_wrapper>.mCSB_container{padding-right:30px;padding-bottom:30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:20px}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:20px}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:20px}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper{margin-right:0;margin-left:30px}.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container{padding-right:0}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container{padding-bottom:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0;margin-left:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools,.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp,.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{-webkit-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;-moz-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;-o-transition:opacity .2s ease-in-out,background-color .2s ease-in-out;transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar{-webkit-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;-moz-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;-o-transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out;transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out}.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools{opacity:0;filter:"alpha(opacity=0)";-ms-filter:"alpha(opacity=0)"}.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,.mCustomScrollBox:hover>.mCSB_scrollTools,.mCustomScrollBox:hover~.mCSB_scrollTools,.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag{opacity:1;filter:"alpha(opacity=100)";-ms-filter:"alpha(opacity=100)"}.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.4);filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75);filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85);filter:"alpha(opacity=85)";-ms-filter:"alpha(opacity=85)"}.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9);filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp{background-image:url(mCSB_buttons.png);background-repeat:no-repeat;opacity:.4;filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_buttonUp{background-position:0 0}.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -20px}.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -40px}.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -56px}.mCSB_scrollTools .mCSB_buttonDown:hover,.mCSB_scrollTools .mCSB_buttonLeft:hover,.mCSB_scrollTools .mCSB_buttonRight:hover,.mCSB_scrollTools .mCSB_buttonUp:hover{opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_buttonDown:active,.mCSB_scrollTools .mCSB_buttonLeft:active,.mCSB_scrollTools .mCSB_buttonRight:active,.mCSB_scrollTools .mCSB_buttonUp:active{opacity:.9;filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:rgba(0,0,0,.85)}.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:rgba(0,0,0,.9)}.mCS-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:4px;background-color:#fff;background-color:rgba(255,255,255,.75);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px auto}.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px 0}.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -20px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -40px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px 0}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -20px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -40px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;background-color:#fff;background-color:rgba(255,255,255,.75);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px 0}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:6px;margin:5px auto}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px 0}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -20px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -40px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px 0}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -20px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -40px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -56px}.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.1)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:2px}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:2px;margin:7px auto}.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,.mCS-rounded.mCSB_scrollTools .mCSB_dragger{height:14px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:14px;margin:0 1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger{width:14px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:14px;margin:1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:16px;height:16px;margin:-1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:4px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:16px;width:16px;margin:0 -1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:4px;margin:6px 0}.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{background-position:0 -72px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -92px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -112px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -128px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px -72px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -92px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -112px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail{width:4px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{background-color:transparent;background-position:center}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);background-repeat:repeat-y;opacity:.3;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{height:4px;margin:6px 0;background-repeat:repeat-x}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px -72px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -92px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -112px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=)}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px -72px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -92px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -112px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-y;background-image:-moz-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(255,255,255,.5)),color-stop(100%,rgba(255,255,255,0)));background-image:-webkit-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-o-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-ms-linear-gradient(left,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:linear-gradient(to right,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-x;background-image:-moz-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,.5)),color-stop(100%,rgba(255,255,255,0)));background-image:-webkit-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-o-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:-ms-linear-gradient(top,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%);background-image:linear-gradient(to bottom,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger{height:70px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger{width:70px}.mCS-3d-dark.mCSB_scrollTools,.mCS-3d.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{width:8px;background-color:#000;background-color:rgba(0,0,0,.2);box-shadow:inset 1px 0 1px rgba(0,0,0,.5),inset -1px 0 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:8px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:8px;margin:4px 0;box-shadow:inset 0 1px 1px rgba(0,0,0,.5),inset 0 -1px 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:8px;margin:4px auto}.mCS-3d.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);box-shadow:inset 1px 0 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,.mCS-3d-thick.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical{right:1px}.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCS-3d-thick.mCSB_scrollTools_vertical{box-shadow:inset 1px 0 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,.mCS-3d-thick.mCSB_scrollTools_horizontal{bottom:1px;box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;box-shadow:inset 1px 0 0 rgba(255,255,255,.4);width:12px;margin:2px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4);height:12px;width:auto}.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{background-color:#000;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-thick-dark.mCSB_scrollTools{box-shadow:inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 1px 0 0 rgba(255,255,255,.4),inset -1px 0 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#777}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{background-color:#fff;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{right:0;margin:12px 0}.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:0;margin:0 12px}.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{left:0;right:auto}.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger{height:50px}.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger{width:50px}.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail{width:6px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px}.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:6px;margin:5px 0}.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:12px}.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:12px;margin:2px 0}.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools .mCSB_draggerRail{width:12px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;margin:3px 5px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:6px;margin:5px 3px;position:absolute;width:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:12px;margin:2px 0}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent;border-width:1px;border-style:solid;border-color:#fff;border-color:rgba(255,255,255,.2);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{border-color:#000;border-color:rgba(0,0,0,.2)}.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.6)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.6)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)} /* Fonts Include */ @font-face { src: url("../fonts/ArbFONTS-Montserrat-Arabic-Regular.ttf"); font-family: "main"; } /* Medium Fonts */ @font-face { src: url("../fonts/ArbFONTS-Montserrat-Arabic-Medium.ttf"); font-family: "medium"; } /* bold Fonts */ @font-face { src: url("../fonts/ArbFONTS-Montserrat-Arabic-Bold.ttf"); font-family: "bold"; } /* simi bold Fonts */ @font-face { src: url("../fonts/ArbFONTS-Montserrat-Arabic-SemiBold.ttf"); font-family: "simi-bold"; } /* Fonts Include */ /* Start General */ html * { text-rendering: optimizeSpeed; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: "main", sans-serif; margin: 0; padding: 0; } :root { --main-color: #305BAA; --secondary-color: #4D6372; --font-family: "main", sans-serif; --trans: all 0.4s ease-in-out; --font-14: 14px; --font-16: 16px; } body { /*overflow-x: hidden;*/ background: #F4F5F7; transition: var(--trans); } h1, h2, h3, h4, h5, h6 { font-family: "bold", "main", sans-serif; } a:hover, a:focus, a:active, button:hover, button:focus, button:active, div, section, span, p, div:hover, section:hover, span:hover, p:hover { text-decoration: none; outline: none; } select, input[type="checkbox"], input[type="radio"], select:focus, input[type="checkbox"]:focus, input[type="radio"]:focus { cursor: pointer; } .form-control:focus, .btn:focus { box-shadow: none !important; border-color: transparent; } .has-fixed-top .main-header { padding-top: 100px; } .btn-menasa { padding: 8px 15px !important; background-color: var(--main-color) !important; border-color: var(--main-color) !important; color: #FFF !important; border-radius: 12px; font-family: 'simi-bold', 'main', sans-serif; font-size: 14px; } .btn-menasa-second { padding: 8px 15px !important; background-color: transparent !important; border-color: var(--secondary-color) !important; color: var(--secondary-color) !important; border-radius: 12px; font-family: 'simi-bold', 'main', sans-serif; font-size: 14px; } .cover-image { width: 100%; height: 100%; object-fit: cover; } picture { display: block; } .sec-padding { padding: 50px 0; } /* Start General */ /* main-header */ .main-header { padding: 25px 0; position: relative; background-color: #FFF; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); z-index: 2; } .main-header .navbar-brand { margin-left: 40px; } .main-header .navbar-light .navbar-nav .nav-link { color: var(--secondary-color); font-size: 14px; padding: 8px 14px; margin-left: 5px; transition: all 0.35s ease, background 0.6s linear; font-family: 'simi-bold', 'bold', 'main', sans-serif; } .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show > .nav-link { color: var(--main-color); } .main-header .navbar-light .navbar-nav .nav-link:hover, .main-header .navbar-light .navbar-nav .nav-link:focus { color: var(--main-color); background: #c2d8ff; border-radius: 10px; } .btn-navbar .btn { margin-right: 10px; } .form-group { margin-bottom: 25px; } .form-group label { margin-bottom: 5px; } .btn-navbar .btn:hover { background: var(--main-color) !important; color: #FFF !important; border-color: var(--main-color) !important; } .btn-navbar .btn:hover svg path { fill: #FFF !important; } /* main-header */ /* main-slider */ .main-slider { background-color: #FFF; min-height: 580px; -webkit-clip-path: ellipse(100% 100% at 50% 0); clip-path: ellipse(100% 100% at 50% 0); padding-bottom: 50px; } .slider-text h1 { font-size: 32px; font-family: 'simi-bold', 'main', sans-serif; color: var(--main-color); line-height: 56px; } .slider-text p { padding: 15px 20px; background-color: var(--main-color); color: #FFF; border-radius: 24px; font-size: 17px; box-shadow: 0 25px 70px RGBA(48, 91, 170, 0.16); line-height: 35px; } .slider-img { width: 100%; /*height: 435px;*/ overflow: hidden; } /*.slider-img img { object-fit: contain; width: 100%; height: 100%; }*/ .owl-theme .owl-nav + .owl-dots { margin-top: 10px; display: inline-block; position: absolute; bottom: 0; right: 50%; transform: translateX(50%); background: vaR(--main-color); padding: 4px 15px; border-radius: 25px; } .owl-theme .owl-dots .owl-dot { vertical-align: middle; } .owl-theme .owl-dots .owl-dot span { margin: 3px 5px; width: 14px; height: 14px; background-color: #4C77C6; transition: all 0.35s ease; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background-color: #FFF; } .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled { display: none !important; } /* main-slider */ /* search-in-index */ .search-in-index { background: linear-gradient(to bottom, #305BAA, #273239); min-height: 400px; margin-top: -100px; padding-top: 150px !important; } .search-in-index .search-form .select2-container .select2-selection--single, .card-body .search-form .select2-container .select2-selection--single { height: 70px; border-radius: 0 12px 12px 0; border-color: #DEDEDE !important; } .search-in-index .search-form .select2-selection--single .select2-selection__rendered, .card-body .search-form .select2-selection--single .select2-selection__rendered { line-height: 70px; text-align: center; padding-left: 40px; } .search-in-index .search-form .select2-selection--single .select2-selection__arrow, .card-body .search-form .select2-selection--single .select2-selection__arrow { height: 70px; width: 40px; } .border-reverse .select2-selection--single { border-radius: 12px 0 0 12px !important; } .select2-container--default .select2-selection--single .select2-selection__arrow b { background-image: url(../images/icons/arrow-down.svg); background-color: transparent; background-size: contain; background-repeat: no-repeat; border: none !important; height: 20px !important; width: 20px !important; margin: auto !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; text-align: center; } .search-form .form-group .btn { width: 100%; height: 70px; color: var(--main-color); background-color: #FFF !important; border-radius: 12px; } .search-form .btn i { margin-left: 10px; } .search-form p { color: #FFF; font-size: 16px; margin-top: 30px; } .search-form p a { color: #FFF; font-family: 'medium', 'main', sans-serif; } .search-form .select2-container { width: 100% !important; z-index: 9999; } /* search-in-index */ /* sec-header */ .sec-header { position: relative; margin-bottom: 40px; } .sec-header h4 { font-size: 26px; font-family: 'medium', 'bold', sans-serif; color: var(--main-color); position: relative; margin-bottom: 20px; } .sec-header h4::after { content: ''; display: block; width: 75px; height: 6px; background-color: var(--main-color); margin: 0 auto; margin-top: 15px; } .sec-header h5 { color: var(--secondary-color); font-size: 19px; font-family: 'medium', 'bold', sans-serif; } .sec-header.light h4, .sec-header.light h5 { color: #FFF; } .sec-header.no-border h4::after { display: none !important; } /* sec-header */ /* feature-item */ .features { padding: 70px 0; background: #FFF; } .feature-item { padding: 25px; position: relative; } .feature-item::before { content: ''; display: block; background: #FFF; border-radius: 15px; border: 1px solid #F4F4F4; width: 100%; height: calc(100% - 70px); position: absolute; bottom: 0; left: 0; z-index: 1; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .feature-item figure { background: var(--main-color); width: 100px; height: 100px; border-radius: 50%; text-align: center; line-height: 100px; position: relative; z-index: 2; } .feature-item figure img { width: 50px; height: 50px; object-fit: contain; } .feature-item h3 { font-size: 18px; font-family: 'simi-bold', 'medium', sans-serif; color: var(--secondary-color); text-align: center; margin-bottom: 15px; position: relative; z-index: 2; } .feature-item p, .feature-item span, .feature-item pre { color: var(--secondary-color); font-size: 14px; line-height: 28px; position: relative; z-index: 2; } /* feature-item */ /* courses */ .courses { background: #F9F9F9; } /* courses */ /* course-item */ .course-item { background: #FFF; border: 1px solid #EFEFF6; border-radius: 15px; overflow: hidden; transition: var(--trans); box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .course-item figure { width: 100%; height: 234px; overflow: hidden; border-radius: 15px; position: relative; } .course-item .hot { position: absolute; top: 20px; left: 20px; background: linear-gradient(to bottom, var(--main-color), #85B0FD); padding: 8px 15px; border-radius: 25px; color: #FFF; z-index: 2; border: 2px solid #FFF; } .course-item .hot img { display: inline-block; width: 22px; height: 22px; margin-left: 5px; } .course-item figure img { transition: var(--trans); } .course-item h3 { color: var(--main-color); font-size: 16px; font-family: 'main', 'bold', sans-serif; line-height: 29px; } .course-item p { color: var(--secondary-color); font-size: 14px; line-height: 26px; } .course-item a.cat { display: inline-block; padding: 8px 15px; color: #FFF; background: var(--secondary-color); border-radius: 9px; margin-bottom: 15px; font-size: 14px; text-decoration: none; } .course-item a.btn { padding: 8px 20px; font-size: 16px; } .course-item:hover a.btn { background: #FFF !important; color: var(--main-color) !important; } .course-item:hover figure img { transform: scale(1.05, 1.05); } /* course-item */ /* action-btns */ .action-btns { margin-bottom: 25px; } .action-btns .btn { padding: 6px 20px; background: #FFF; border-radius: 6px; border: 1px solid #DFDFDF; color: vaR(--main-color); } .owl-nav-custom { display: inline-flex; margin-left: 20px; } .owl-nav-custom button { display: inline-block; background: #FFF; border-radius: 6px; border: 1px solid #DFDFDF; color: vaR(--main-color); padding: 6px 10px; transition: var(--trans); margin-right: 15px; } .action-btns .btn:hover, .owl-nav-custom button:hover { background: var(--main-color); border-color: var(--main-color); color: #FFF; } .owl-nav-custom.disabled { display: none !important; } .owl-prev.disabled, .owl-next.disabled{ opacity: 0.6; background: #CCC; cursor: not-allowed; } /* action-btns */ /* teachers */ .teachers { background: #FFF; } /* teachers */ /* teacher-item */ .teacher-item { background: #FFF; padding: 20px 10px; border-radius: 15px; border: 1px solid #EFEFF6; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .teacher-item figure { width: 180px; height: 180px; margin-right: auto; margin-left: auto; border-radius: 28px; overflow: hidden; } .teacher-item hr { border-top: 1px solid #EFEFF6; opacity: 1; } .teacher-item .title h4 { color: var(--main-color); font-size: 18px; margin-bottom: 0; } .teacher-item .title p { color: var(--secondary-color); font-size: 14px; margin-bottom: 0; } .rating-teacher { padding: 8px 15px; color: #E30D47; font-size: 25px; font-family: 'medium', 'main', sans-serif; border-radius: 12px; border: 1px solid #F1F4F8; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); text-align: center; } /* teacher-item */ /* date-price */ .date-price { padding: 8px 15px; color: #E30D47; font-size: 18px; font-family: 'medium', 'main', sans-serif; border-radius: 12px; border: 1px solid #F1F4F8; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); text-align: center; background: #FFF; margin-bottom: 10px; } .date-price i { font-size: 14px; color: var(--secondary-color); } .date-price span { color: var(--secondary-color); font-size: 14px; } /* date-price */ /* promo-sec */ .promo-sec { background: #FFF; } .promo-text h3 { color: var(--main-color); font-size: 40px; margin-bottom: 25px; line-height: 55px; } .promo-text p { color: var(--secondary-color); font-size: 17px; margin-bottom: 25px; } .promo-text a { min-width: 250px; font-size: 18px; padding: 8px 25px !important; } .promo-text a:hover { background: #FFF !important; color: var(--main-color) !important; } .promo-img { width: 100%; height: 480px; overflow: hidden; position: relative; } .promo-img img { width: 100%; height: 100%; object-fit: contain; } /* promo-sec */ /* testimonials */ .testimonials { background: #F9F9F9; } .testim-item { margin-top: 50px; margin-bottom: 30px; } .qoute-div { padding: 10px 20px; border-radius: 12px; border: 1px solid #F4F4F4; background: #FFF; position: relative; margin-bottom: 30px; } .qoute-div::before { content: ''; display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 12px solid #FFF; position: absolute; bottom: -12px; right: 50%; transform: translateX(50%); } .qoute-div span { width: 70px; height: 70px; display: block; margin-right: auto; margin-left: auto; border-radius: 50%; background: #FFF; box-shadow: 0 11px 12px RGBA(0, 0, 0, 0.05); text-align: center; line-height: 70px; position: relative; top: -35px; } .qoute-div p { font-size: 14px; line-height: 24px; color: var(--secondary-color); } .author figure { width: 55px; height: 55px; border-radius: 50%; overflow: hidden; box-shadow: 0 11px 70px RGBA(0, 0, 0, 0.05); margin-left: auto; margin-right: auto; } .author h4 { color: var(--main-color); font-size: 16px; } .testimonials .owl-item { opacity: 0.6; transition: all 0.65s ease !important; } .testimonials .owl-item.active.center { /*transform: scale(1.1, 1.1);*/ position: relative; z-index: 9; opacity: 1; } .testimonials .owl-theme .owl-nav + .owl-dots { position: relative; margin-top: 40px; } /* testimonials */ /* blog */ .blog-item .category { position: absolute; top: 20px; left: 20px; padding: 8px 15px; background: #F5C230; border-radius: 12px; color: var(--secondary-color); z-index: 2; } .author-blog figure { width: 40px; height: 40px; border-radius: 8px; border: 1px solid #F4F4F4; margin-left: 10px; } .author-blog div { color: var(--secondary-color); font-size: 13px; } .blog-item .date { color: var(--secondary-color); font-size: 14px; } /*.blog-item:hover .date, .blog-item:hover .author-blog div { color: #FFF; }*/ .blog-item a.btn { background: #FFF !important; color: var(--main-color) !important; } /* blog */ /* contact */ .contact { background: var(--main-color); } .contact-text img { margin-bottom: 25px; } .contact-text h4 { color: #FFF; font-size: 40px; margin-bottom: 20px; } .contact-text p { color: #EFEFF6; font-size: 19px; } .contact-form { padding: 15px; background: #FFF; border-radius: 15px; border: 1px solid #EFEFF6; } .contact-form .form-group { position: relative; } .contact-form .form-group .ico { position: absolute; top: 13px; right: 10px; color: #747474; font-size: 20px; } .contact-form .form-group input.form-control { padding-right: 40px; height: 55px; background: #F9F9F9; border-radius: 12px; text-align: right !important; } .contact-form .form-group textarea.form-control { background: #F9F9F9; padding-right: 40px; border-radius: 12px; } .contact-form .form-group .btn { height: 55px; font-size: 20px; border-radius: 12px; } /* contact */ /* main-footer */ .main-footer { background: var(--secondary-color); } .footer-top { padding: 30px 0; } .footer-item a.d-block { margin-bottom: 15px; } .footer-item p { color: #FFF; font-size: 17px; line-height: 28px; } .footer-item h4 { color: #FFF; font-size: 18px; margin-bottom: 15px; } .footer-item ul li .nav-link { padding-right: 0; color: #FFF; font-size: 14px; } .footer-item ul li .nav-link:hover { text-decoration: underline; } .social li a { padding: 0; background: #FFF; text-align: center; color: var(--secondary-color) !important; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; font-size: 18px !important; margin: 0 3px; } .footer-top { border-bottom: 1px solid #697A86; } .back-to-top, .back-to-top:hover { color: #FFF; } .back-to-top i { width: 35px; height: 35px; color: #FFF; border-radius: 50%; line-height: 35px; background: #E30D47; } .copyrights { padding: 10px 0; } .copyrights p { font-size: 14px; color: #FFF; } /* main-footer */ /* Loader */ .pre-loader{ position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 9999; background: RGBA(0, 0, 0, 0.7) } .loader { -webkit-filter: url("#goo"); filter: url("#goo"); position: absolute; width: 500px; height: 100px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .loader::after { content: ''; display: block; width: 50px; height: 50px; border-radius: 50%; background: #ffffff; margin: 0 auto; position: absolute; top: 25px; left: 225px; -webkit-animation: scale 2.5s ease-in-out infinite; animation: scale 2.5s ease-in-out infinite; } .loader div { position: absolute; width: 30px; height: 30px; border-radius: 50%; background: #ffffff; top: 35px; left: 235px; -webkit-animation: move 2.5s ease-in-out infinite alternate; animation: move 2.5s ease-in-out infinite alternate; } .loader div::after, .loader div::before { content: ''; display: block; position: absolute; width: 30px; height: 30px; border-radius: 50%; background: #ffffff; } .loader div::before { left: -75px; } .loader div::after { left: 75px; } @-webkit-keyframes move { 0% { -webkit-transform: translateX(-150px); transform: translateX(-150px); } 100% { -webkit-transform: translateX(150px); transform: translateX(150px); } } @keyframes move { 0% { -webkit-transform: translateX(-150px); transform: translateX(-150px); } 100% { -webkit-transform: translateX(150px); transform: translateX(150px); } } @-webkit-keyframes scale { 10% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.25); transform: scale(1.25); } 90% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes scale { 10% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.25); transform: scale(1.25); } 90% { -webkit-transform: scale(1); transform: scale(1); } } .loader svg { position: absolute; z-index: -100; pointer-events: none; } /* Loader */ /* menu-sm */ .menu-sm{ position: fixed; top: 0; left: 0; width: 0; height: 0; background-color: #fff; z-index: 99999; border-radius: 50%; /*border: 1px solid;*/ -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; overflow: hidden; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .menu-sm.show{ width: 100%; height: 100%; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.87s ease; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .menu-close{ margin: 20px; border: none; } .menu-close:hover, .menu-close:focus{ background: none !important; color: var(--bs-danger) !important; } .menu-header { position: relative; margin-bottom: 28px; text-align: center; } .menu-header::after{ content: ''; display: block; width: 35px; height: 2px; background: #1b1e21; margin-right: auto; margin-left: auto; margin-top: 10px; } .menu-header h4, .menu-header h5{ color: #005352; font-size: 22px; } .sm-nav-menu{ list-style: none; text-align: center; margin-bottom: 40px; padding-right: 0; } .sm-nav-menu li a{ display: inline-block; padding: 5px; color: #1b1e21; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border-bottom: 1px solid transparent; text-decoration: none; } .sm-nav-menu li a:hover, .sm-nav-menu li a:focus{ border-color: #ffd536; color: var(--main-color); } .bottom-social{ position: absolute; bottom: 0; width: 100%; background: linear-gradient(to left, var(--main-color), #22baaf); } .bottom-social ul{ display: flex; display: -ms-flexbox; justify-content: center; align-items: center; list-style: none; padding: 5px 0; } .bottom-social ul li a{ display: block; color: #FFF; padding: 5px; } /* menu-sm */ /* main-content */ .main-content { min-height: 55vh; position: relative; } /* main-content */ /* page-header */ .page-header { padding: 20px 0; } .white-bg { background: #FFF; border: 1px solid #E8E8E8; border-radius: 12px; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .page-header h1 { font-size: 16px; color: var(--main-color); margin-bottom: 0; } .page-header h1 svg { margin-left: 10px; vertical-align: middle; height: 29px; } .page-header .select2-container--default .select2-selection--single .select2-selection__arrow { display: none; } .page-header .select2-container--default .select2-selection--single .select2-selection__rendered::before { content: "\f0b0"; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; font-family: "Font Awesome 5 Free"; font-weight: 900; } .page-header .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0 10px; } .page-header .select2-container .select2-selection--single { height: 36px; border: 1px solid #F0F2F4; border-radius: 6px; } .page-header .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 36px; color: var(--secondary-color); } .page-header p { font-size: 14px; color: #747474; margin-top: 15px; } .account-page .card-body { border-bottom-right-radius: 15px !important; border-bottom-left-radius: 15px !important; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .account-page .page-header .white-bg { border-bottom-right-radius: 0 !important; border-bottom-left-radius: 0 !important; } /* page-header */ .page { margin-bottom: 30px; } /*msawat*/ .msaqat-page .course-item { margin-bottom: 25px; } /*msawat*/ /*load-more*/ .load-more a { padding: 8px 25px; background: #FFF; border: 1px solid var(--main-color); border-radius: 12px; } /*load-more*/ /* page-wrapper */ .page-wrapper { background: #FFF; /*border: 1px solid #E8E8E8;*/ border-radius: 12px 12px 15px 15px; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); padding: 20px; } /* page-wrapper */ /* single-title */ .single-title, .more-courses h5 { color: var(--main-color); font-size: 21px; margin-bottom: 20px; line-height: 1.6; } /* single-title */ /* single-img */ .single-image { width: 100%; height: 445px; overflow: hidden; position: relative; border-radius: 15px; } .single-image::before { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: RGBA(48, 91, 170, 0.30); } .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .play-btn a { display: block; width: 105px; height: 105px; background: RGBA(27, 27, 27, 0.50); border-radius: 50%; text-align: center; line-height: 105px; color: #FFFF; font-size: 60px; transition: var(--trans); } .play-btn:hover a { transform: translateY(-10px); } /* single-img */ /* text-stripped */ .text-stripped p, .text-stripped span, .text-stripped pre, .text-stripped blockquote, .text-stripped li, .text-stripped > *, .text-stripped td, .text-stripped td { font-size: 14px; color: #4D6372; line-height: 26px; } .msaqat-single-page .text-stripped { margin-bottom: 30px; } .text-stripped p { margin-bottom: 15px; } .text-stripped li { margin-bottom: 10px; } .text-stripped img, .text-stripped video, .text-stripped iframe { max-width: 100%; height: auto; } .text-stripped table, .text-stripped iframe { width: 100%; margin-bottom: 20px; } /* text-stripped */ /* desc-single */ .desc-single { display: flex; align-items: center; margin-bottom: 20px; } .desc-single > p { color: var(--secondary-color); font-size: 16px; line-height: 19px; margin-bottom: 0; margin-left: 20px; } .desc-single ul { background: #FFF; border: 1px solid #F1F4F8; margin-bottom: 0; border-radius: 12px; overflow: hidden; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); } .desc-single ul li { padding: 15px; border-left: 1px solid #F1F4F8; } .desc-single ul li h6 { font-size: 10px; color: var(--secondary-color); margin-bottom: 0; } .desc-single ul li span { color: var(--main-color); font-size: 12px; } /* desc-single */ /* teachers-single */ .teachers-single h4 { color: var(--secondary-color); font-size: 16px; font-family: 'simi-bold', 'medium', sans-serif; margin-bottom: 20px; } /* teachers-single */ /* teacher-single */ .teacher-single { position: relative; background: #FFF; border: 1px solid #E8E8E8; border-radius: 12px 12px 15px 15px; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); padding: 15px; margin-bottom: 15px; } .teacher-single figure { width: 105px; height: 115px; border-radius: 12px; overflow: hidden; margin-bottom: 0; } .teacher-single h5 { color: var(--secondary-color); font-size: 14px; margin-bottom: 10px; } .teacher-single .rating-stars i { color: #D9D9D9; font-size: 14px; } .teacher-single .rating-stars i.filled { color: #F68213; } .tag-item { padding: 10px 15px; border: 1px solid #E8E8E8; border-radius: 12px 12px 15px 15px; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); background: #FFF; margin-left: 10px; } .tag-item h6 { color: var(--secondary-color); font-size: 12px; margin-bottom: 2px; } .tag-item span { color: var(--main-color); font-size: 13px; font-family: 'simi-bold', 'bold', sans-serif; display: inline-block; } /* teacher-single */ /* teacher-action */ .teacher-action { width: 170px; } .teacher-action a { font-size: 14px; } .teacher-action a.btn-outline-light { border: 1px solid RGBA(166, 178, 177, 0.50); border-radius: 12px; color: #000000; padding: 8px 25px; } /* teacher-action */ /* side-left */ .side-left h4 { color: var(--main-color); font-size: 21px; line-height: 1.6; margin-bottom: 20px; } .side-left .course-item { margin-bottom: 15px; } .side-left .course-item figure { height: 170px; } /* side-left */ /* page-title */ .select2-dropdown { border: 1px solid #F4F4F4; border-radius: 12px !important; overflow: hidden !important; margin-top: 12px !important; padding: 15px 5px; } .select2-search--dropdown .select2-search__field { border: 1px solid #F4F4F4; border-radius: 25px !important; padding-right: 15px; } /* page-title */ .courses-page .date-price, .msaqat-single-page .date-price { font-size: 16px; } .courses-page .course-item { margin-bottom: 30px; } /* detial-item */ .detial-item:not(:last-child) { margin-bottom: 20px; } .detial-item label { font-size: 14px; color: var(--secondary-color); margin-bottom: 10px; } .detial-item label i { font-size: 16px; } .detial-item .value { padding: 12px 25px; background: #F9F9F9; border: 1px solid RGBA(166, 177, 187, 0.50); border-radius: 12px; text-align: center; color: var(--main-color); font-size: 16px; font-family: 'simi-bold', 'main', sans-serif; } .course-details a{ border-radius: 0; font-size: 18px; padding: 12px 20px; } /* detial-item */ /* share-single */ .share-single { padding: 8px 0 5px 0; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; } .share-single .title { font-size: 20px; color: #4D6372; } .share-single .title p { margin-bottom: 0; line-height: 27px; } .share-single .title img { height: 55px; margin-left: 5px; } .social-list li a { display: inline-block; width: 45px; height: 45px; background: var(--main-color); color: #FFF; text-align: center; line-height: 42px; border-radius: 50%; border: 3px solid #FFFF; box-shadow: 0 4px 4px rgba(176, 183, 195, 0.10); margin-right: 10px; box-sizing: border-box; } .social-list li a.facebook-icon { background: #3C5A96 !important; } .social-list li a.twitter-icon { background: #2AA3EF !important; } .social-list li a.insta-icon { background: #8940B6 !important; } .social-list li a.google-icon { background: #D1493C !important; } /* share-single */ .msaqat-single-page .course-item { margin-bottom: 25px; } /* auth */ .auth { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; min-height: 100vh; background: #FFF; } .auth-wrapper { -webkit-box-flex: 1; flex: 1; -webkit-box-flex: 1; -ms-flex: 1 0 auto; flex: 1 0 auto; -webkit-box-orient: horizontal !important; -webkit-box-direction: normal !important; -ms-flex-direction: row !important; flex-direction: row !important; } .auth-wrapper > div { width: 50%; flex: 0 0 50%; } .auth-img { background: #F4FAF9; text-align: center; } .auth-img img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; object-fit: contain; } .login-side { position: relative; } .auth-form img { margin-bottom: 15px; } .auth-form p { color: var(--main-color); font-size: 16px; margin-bottom: 30px; line-height: 22px; } .auth-form header:not(.page-header) h1 { font-size: 30px; margin-bottom: 25px; color: var(--main-color); line-height: 45px; font-family: 'main', 'bold', sans-serif; font-weight: normal; } .auth-form label { color: var(--secondary-color); font-size: 15px; margin-bottom: 5px; margin-right: 10px; } .auth-form .form-control { border-radius: 12px; border: 1px solid #E7EDEF; color: #798998; font-size: 14px; text-align: right; font-family: 'main', sans-serif; } .auth-form .form-control:not(textarea) { height: 48px; } .auth-form .form-control[type=number] { appearance: textfield; } .auth-form .form-group .currency { position: absolute; bottom: 15px; left: 15px; color: #798998; font-size: 14px; } .vcode { display: flex; } .vcode .form-control { margin: 0 5px; text-align: center; } .vcode .form-control:first-child { margin-right: 0 !important; } .vcode .form-control:last-child { margin-left: 0 !important; } .auth-form .btn { height: 50px; } .hints { text-align: center; } .hints small { color: #A6B1BB; font-size: 15px; } .hints small a { color: var(--main-color); font-family: 'simi-bold', 'main', sans-serif; text-decoration: none; } .alert { background: #FEDCE0; border: 1px solid #F2D4D8; border-radius: 10px; color: #BB4552; font-weight: normal; } .alert-dismissible .btn-close { box-shadow: none !important; color: #BB4552 !important; } .auth .nav-pills li { margin: 0 3px; } .auth .nav-pills .nav-link { padding: 20px 35px; border: 2px solid #E7EDEF; border-radius: 12px; } .auth .nav-pills .nav-link figure { width: 70px; height: 70px; border-radius: 50%; background: #E74C3C; overflow-y: hidden; margin: 0 auto 5px auto; transition: all 0.35s ease; display: flex; align-items: flex-end; } .auth .nav-pills .nav-link figure img { width: 100%; height: 100%; object-fit: contain; margin-bottom: -2px; } .auth .nav-pills .nav-link i { opacity: 0; visibility: hidden; width: 0; transition: all 0.35s ease; display: inline-block; } .auth .nav-pills .nav-link.active, .auth .nav-pills .show > .nav-link { background: var(--main-color); } .auth .nav-pills .nav-link.active figure, .auth .nav-pills .show > .nav-link figure { background: #FFF; } .auth .nav-pills .nav-link.active i, .auth .nav-pills .show > .nav-link i { opacity: 1; visibility: visible; width: 16px; } .auth-form .select2-container .select2-selection--single, .modal-form .select2-container .select2-selection--single { height: 48px; background: #FFF; border-radius: 12px; border: 1px solid #E7EDEF; } .auth-form .select2-container--default .select2-selection--single .select2-selection__rendered, .modal-form .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 48px; padding-right: 15px; padding-left: 41px; } .auth-form .select2-container--default .select2-selection--single .select2-selection__arrow, .modal-form .select2-container--default .select2-selection--single .select2-selection__arrow { height: 48px; width: 40px; } .auth-form .select2-container--default .select2-selection--single .select2-selection__arrow b, .modal-form .select2-container--default .select2-selection--single .select2-selection__arrow b { background-image: url(../images/icons/arrow.svg); height: 8px !important; } /* auth */ /* .picker */ .picker { width: 100% !important; top: 100%; right: 0; } .auth-form .form-control.datepicker { background: #FFF !important; } /* .picker */ .GenderDiv { height: 48px; background: #FFF; border-radius: 12px; border: 1px solid #E7EDEF; display: flex; align-items: center; justify-content: center; } .GenderDiv input[type=radio], .my-radios input[type=radio] { visibility: hidden; display: none; } .GenderDiv label.radio, .my-radios label.radio { cursor: pointer; /*text-indent: 35px;*/ overflow: visible; display: inline-block; position: relative; transition: all 0.35s ease; font-size: 15px; padding-right: 35px; padding-top: 5px; margin: 0 10px; /*margin-bottom: 15px;*/ } .GenderDiv label.radio:before, .my-radios label.radio:before { background: #F8F8F8; content:''; position: absolute; top:2px; right: 0; width: 25px; height: 25px; border-radius: 100%; transition: all 0.35s ease; } .GenderDiv label.radio:after, .my-radios label.radio:after { opacity: 0; content: ''; position: absolute; width: 13px; height: 7px; background: transparent; top: 10px; right: 6px; border: 3px solid #ffffff; border-top: none; border-right: none; transition: all 0.35s ease; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .GenderDiv input[type=radio]:checked + label:after, .my-radios input[type=radio]:checked + label:after { opacity: 1; } .GenderDiv input[type=radio]:checked + label:before, .my-radios input[type=radio]:checked + label:before { background: var(--main-color); } /* page-acc-footer */ .page-acc-footer { padding: 25px 0; background: #FFF; } .page-acc-footer p { color: #A6B1BB; font-size: 15px; margin-bottom: 0; } .footer-action { display: flex; justify-content: flex-end; } .footer-action .btn { margin-right: 10px; min-width: 140px; } /* page-acc-footer */ /* file upload */ .file-upload { margin: 0 auto; padding: 6px; width: 100%; } .file-upload-btn { width: 100%; margin: 0; color: #fff; background: #E7EDEF; border: none; padding: 10px; border-radius: 4px; border-bottom: 4px solid #E7EDEF; transition: all .2s ease; outline: none; text-transform: uppercase; font-weight: 700; } .file-upload-btn:hover { background: #E7EDEF; color: #ffffff; transition: all .2s ease; cursor: pointer; } .file-upload-btn:active { border: 0; transition: all .2s ease; } .file-upload-content { display: none; text-align: center; border: 2px dashed #E7EDEF; position: relative; transition: var(--trans); } .file-upload-input { position: absolute; margin: 0; padding: 0; width: 100%; height: 100%; outline: none; opacity: 0; cursor: pointer; } .image-upload-wrap { border: 2px dashed #E7EDEF; position: relative; transition: var(--trans); } .image-dropping { transition: var(--trans); } .image-dropping, .image-upload-wrap:hover { background-color: #f4f4f4; border: 2px dashed #798998; } .image-title-wrap { padding: 0 15px 15px 15px; color: #222; } .drag-text { text-align: center; } .drag-text h3 { font-weight: 100; text-transform: uppercase; color: #798998; padding: 60px 0; font-size: 14px; } .file-upload-image { max-height: 200px; max-width: 200px; margin: auto; padding: 20px; } .remove-image { margin: 0; color: #cd4535; border: none; padding: 6px 15px; border-radius: 4px; border-bottom: 1px solid #b02818; transition: all .2s ease; outline: none; text-transform: uppercase; font-weight: 500; background: #f7f7f7; } .remove-image:hover { background: #c13b2a; color: #ffffff; transition: all .2s ease; cursor: pointer; } .remove-image:active { border: 0; transition: all .2s ease; } /* file upload */ /* ConfirmationCode */ #ConfirmationCode, #ConfirmationCode2 { text-align: center; } #ConfirmationCode figure, #ConfirmationCode2 figure { width: 145px; height: 145px; border-radius: 50%; background: #F6F6F6; line-height: 145px; } #ConfirmationCode figure svg, #ConfirmationCode2 figure svg { max-width: 100%; max-height: 100%; object-fit: contain; display: inline-block; vertical-align: middle; } #ConfirmationCode h3, #ConfirmationCode2 h3 { color: var(--main-color); font-size: 22px; font-family: 'main', 'bold', sans-serif; } #ConfirmationCode p, #ConfirmationCode2 p { color: var(--secondary-color); font-size: 19px; } #ConfirmationCode .modal-content, #ConfirmationCode2 .modal-content { border: none; border-radius: 12px; } /* ConfirmationCode */ /* select two Multiple */ .select2-container--default .select2-selection--multiple .select2-selection__choice { background: #F2F2F2; border: #e3e3e3; border-radius: 5px; color: #333; font-size: 15px; padding: 6px 10px 6px 20px; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { border-left: none; color: var(--bs-danger); font-size: 23px; border-right: 1px solid #e3e3e3; } .select2-container--default .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--multiple { border: 1px solid #E7EDEF; border-radius: 12px; } .select2-container .select2-selection--multiple { min-height: 48px; } /* select two Multiple */ .my-padge { padding: 5px 8px; background: #FFF; border: 1px solid #E8E8E8; color: #696871; border-radius: 8px; display: inline-block; } .times-table tr td, .times-table tr th { vertical-align: middle; text-align: center; } .times-table thead tr th { color: #364F65; font-size: 15px; font-weight: normal; } .times-table tr td .btn { height: auto; text-decoration: none; } .times-table tr td .btn i { color: var(--main-color); font-size: 22px; vertical-align: middle; } .added-row { background: #EDEDED; } /* stat-item */ .stat-item { padding: 22px 15px; background: #FFF; border-radius: 12px; overflow: hidden; border: 1px solid #F1F4F8; margin-bottom: 20px; } .stat-item figure { width: 85px; height: 85px; margin-left: 10px; border-radius: 50%; overflow: hidden; background: linear-gradient(to bottom, #50C360, #2B8638); text-align: center; line-height: 85px; font-size: 40px; color: #FFF; margin-bottom: 0; } .stat-item h4 { font-family: 'main', 'bold', sans-serif; color: #000; font-size: 19px; margin-bottom: 15px; } .stat-item span { display: inline-block; padding: 5px 10px; background: #F0F6FE; color: #305BAA; font-size: 18px; font-family: 'bold', 'main', sans-serif; } /* stat-item */ /* modal */ .modal .custom-header { background-color: #F1F1F1; border-radius: 15px 15px 0 0; padding: 20px ; } .modal .custom-header h5 { color: #787878; font-size: 14px; margin-bottom: 0; } .menasa-modal .modal-content { border-radius: 15px; } .modal-form h5 { color: #4D6372; font-size: 14px; margin-bottom: 10px; } .checkbox-custom, .radio-custom { opacity: 0; position: absolute; } .checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label { display: inline-block; vertical-align: middle; cursor: pointer; } .checkbox-custom-label, .radio-custom-label { position: relative; } .checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before { content: ''; background: #F9F9F9; border: 1px solid #E8E8E8; display: inline-block; vertical-align: middle; width: 20px; height: 20px; padding: 2px; margin-right: 10px; text-align: center; font-size: 12px; line-height: 14px; transition: all 0.3s ease; } .checkbox-custom:checked + .checkbox-custom-label:before { content: "\f00c"; font-family: 'FontAwesome'; background-color: var(--main-color); color: #FFF; border: 1px solid var(--main-color); } .radio-custom + .radio-custom-label:before { border-radius: 50%; } .radio-custom:checked + .radio-custom-label:before { content: "\f00c"; font-family: 'FontAwesome'; background-color: var(--main-color); color: #FFF; border: 1px solid var(--main-color); } .checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label { outline: 1px solid #ddd; /* focus style */ } .choice-card { padding: 16px 16px; border-radius: 12px; border: 1px solid #E7EDEF; margin-bottom: 15px; } .choice-card .radio-custom-label { display: flex; width: 100%; align-items: center; justify-content: space-between; flex-direction: row-reverse; } .menasa-modal .footer-action .btn { margin: 0 !important; } .menasa-modal .modal-dialog { max-width: 360px !important; } .menasa-modal .modal-dialog.modal-lg { max-width: 600px !important; } .modal-form .form-control { border-radius: 12px; border: 1px solid #E8E8E8; height: 50px; } .modal-form .form-control:focus { border: 1px solid #E8E8E8; } .modal-form textarea.form-control { height: auto; resize: none; } .modal-form .icon { position: absolute; top: 50%; left: 15px; transform: translateY(-50%); line-height: 1; } .error-field { border-color: #BB4552 !important; } .success-field { border-color: #3AA94A !important; } /* modal */ /* users-number-select */ .users-number-select { position: relative; display: none; background-color: #FFF; border-radius: 12px; border: 1px solid #F4F4F4; } .users-number-select ul li { padding: 10px; border-bottom: 1px solid #E8E8E8; } .users-number-select ul li:last-child { border: none; } .users-number-select ul li label { color: #747474; display: flex; flex-direction: row-reverse; justify-content: space-between; width: 100%; } .users-number-select .radio-custom:checked + .radio-custom-label::before { background-color: transparent; border-color: transparent; color: var(--main-color); } .users-number-select .checkbox-custom + .checkbox-custom-label::before, .users-number-select .radio-custom + .radio-custom-label::before { background: none; border: none; } .modal-price { margin-bottom: 15px; } .modal-price p { color: #000; font-size: 14px; margin-bottom: 0; } .modal-price span { color: var(--main-color); font-size: 16px; font-family: 'bold', 'main', sans-serif; } .times-select { position: relative; background-color: #FFF; border-radius: 12px; border: 1px solid #F4F4F4; margin-bottom: 15px; display: none; } .times-select .d-flex { border-bottom: 1px solid #EFEFF6; } .times-select .table p { margin-bottom: 0; color: #7E7E7E; font-size: 12px; } .times-select .table b, .times-select .table strong { font-size: 16px; color: var(--main-color); } .custom-radio-button label { color: #000000; font-size: 14px; padding: 6px 12px; background: #F4F5F7; border-radius: 12px; border: 1px solid #D1D7DC; margin-left: 5px; margin-right: 10px; transition: var(--trans); cursor: pointer; } .custom-radio-button input { display: none; } .custom-radio-button input:checked + label, .custom-radio-button input:checked ~ label { background: var(--main-color); color: #FFF; } .picker__input { background: #FFF !important; } .other-times { display: none; } .picker__list-item small { display: inline-block; } .check-btn-add { display: inline-block; } .check-btn-add label { background: #f4f4f4; font-size: 12px; margin: 5px 3px; border-radius: 25px; border: 1px solid #ccc; } .check-btn-add input { opacity: 0; visibility: hidden; width: 0; display: none; } .check-btn-add input:checked ~ label, .check-btn-add input:checked + label { /*background: #b6effb;*/ border-color: var(--main-color) !important; color: var(--main-color); } /* users-number-select */ /*time-selected*/ .time-selected { padding: 5px 8px; background: #F4F4F4; border: 1px solid #f4f4f4; font-size: 12px; border-radius: 25px; display: inline-block; vertical-align: middle; margin-top: 8px; } .time-selected span { display: inline-block; vertical-align: middle; } .time-selected span time { display: inline-block; } .time-selected button { vertical-align: middle; padding: 2px; } /*time-selected*/ /* invoice-item */ .invoice-item h4 { color: var(--main-color); font-size: 16px; font-family: 'medium', 'main', sans-serif; border-bottom: 1px solid #E7EDEF; padding-bottom: 15px; } .invoice-item h4 svg { margin-left: 10px; } /* invoice-item */ /* white-bg-div */ .white-bg-div { background: #FFF; border: 1px solid #E8E8E8; border-radius: 12px; box-shadow: 0 15px 40px RGBA(183, 194, 214, 0.12); margin-bottom: 25px; } .white-header { display: flex; align-items: center; margin-bottom: 25px; } .white-header h3 { color: var(--main-color); font-size: 16px; font-family: 'main', sans-serif; } .white-actions { margin-right: auto; } .white-actions p { color: #9C9C9C; font-size: 12px; margin-bottom: 5px; } .white-actions span { color: var(--main-color); font-size: 22px; font-family: 'medium', 'main', sans-serif; } /* white-bg-div */ /* user-item-request */ .user-item-request { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #E8E8E8; } .user-item-request:last-child { margin-bottom: 0; border-bottom: none } .user-item-request figure { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; margin-bottom: 0; } .user-item-request h4 { color: #000000; font-size: 14px; font-family: 'main', sans-serif; } .user-item-request p { color: #979797; font-size: 12px; margin-bottom: 0; } .userAction .btn { line-height: 1; margin-bottom: 8px; padding-top: 5px; padding-bottom: 5px; } .userAction .btn:last-child { margin-bottom: 0; } .more-button .btn-link { color: var(--main-color); font-size: 14px; text-decoration: none; } .more-button .btn-link:hover { color: var(--secondary-color); } /* user-item-request */ /* user-nav-item */ .user-nav-item { margin-left: 10px; } .user-nav-item figure { width: 45px; height: 45px; border-radius: 50%; overflow: hidden; margin-bottom: 0; } .user-nav-item .flex-grow-1 { color: #4D6372; font-size: 14px; } .has-icon { position: relative; } .has-icon svg { margin-left: 8px; } .has-icon .num { width: 18px; height: 18px; background-color: var(--main-color); color: #FFF; line-height: 18px; position: absolute; top: 0; right: 5px; text-align: center; border-radius: 50%; font-size: 12px; } /* user-nav-item */ /* .nav-tabs .nav-link */ .nav-tabs .nav-link { color: #333; font-size: 18px; padding: 10px 25px; } .nav-tabs .nav-link img { height: 36px; display: block; margin: 0 auto .5rem auto; } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { color: var(--main-color); } .custom-drop { padding: 15px 0; border: 1px solid #F4F4F4; border-radius: 12px; } .custom-drop a { padding: 10px 10px; color: #747474; font-size: 14px; transition: all 0.3s ease; } .custom-drop a svg { margin-left: 5px; width: 22px; } .custom-drop a:hover { background-color: #c2d8ff; color: var(--main-color); } .custom-drop a:hover svg path { fill: var(--main-color); } .dropdown-divider { border-top: 1px solid #F4F4F4; } .user-drop:focus, .user-drop:hover { background-color: transparent !important; } .dropdown-toggle::after { vertical-align: middle; } .custom-drop::before { content: ''; display: block; width: 16px; height: 16px; position: absolute; top: -9px; right: 67px; transform: rotate(45deg); border-top: 1px solid #f4f4f4; border-left: 1px solid #f4f4f4; background: #FFF; } .notification-list-item .ico-item { width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 50%; background-color: #D7E4F3; color: var(--main-color); font-size: 22px; transition: all 0.3s ease; } .notification-list-item span { font-size: 14px; color: #000000; display: inline-block; margin-bottom: 5px; } .notification-list-item p { color: var(--main-color); font-size: 14px; font-weight: 600; } .notification-list-item:hover .ico-item { background-color: #FFF; } .rating-result i { font-size: 16px; color: #D9D9D9; } .rating-result i.filled { color: #F68213; } .notification-list-item:hover .rating-result i:not(.filled) { color: #FFF; } /* .nav-tabs .nav-link */ /* user-table */ .user-table figure { width: 70px; height: 70px; overflow: hidden; border-radius: 25px; } /* user-table */ /* dashboard-table */ .dashboard-table td { padding: 10px 10px; vertical-align: middle; color: #747474; font-size: 14px; text-align: center; } .dashboard-table th { text-align: center; } .table.dashboard-table > :not(:last-child) > :last-child > * { border-bottom-color: #E8E8E8; } div.dataTables_wrapper div.dataTables_filter { text-align: left; } div.dataTables_wrapper div.dataTables_filter input { margin-left: 0; margin-right: 5px; } div.table-responsive > div.dataTables_wrapper > div.row > div[class^="col-"]:last-child { padding-left: 0; } table.dataTable { margin-bottom: 25px !important; margin-top: 25px !important; border: 1px solid #E8E8E8; } .table.dashboard-table .userAction .btn { margin-bottom: 0; border-radius: 10px; padding: 10px !important; } .btn-danger-fade { background-color: #FEDCE0; border-color: #F2D4D8; color: #BB4552; } .verify-codes, .loader-spinner { display: none; } .SignInThirdParty_delimiter__ezi__ { display: grid; align-items: center; margin: 20px 0; grid-gap: 12px; grid-template-columns: 1fr auto 1fr; text-align: center; text-transform: uppercase; } .Typography_colorBase40__0qvxq { color: #b7b7b7; } .SignInThirdParty_delimiter__ezi__::after, .SignInThirdParty_delimiter__ezi__::before { width: 100%; height: 1px; background-color: #eee; content: ""; } .phone-group { display: none; } .search-form { padding: 30px 0; position: relative; z-index: 1; } .card-body .search-form .select2-container .select2-selection--single { background: #F9F9F9; } .card-body .search-form .form-group .btn { background-color: var(--main-color) !important; color: #FFF!important; } .card-body .search-form p, .card-body .search-form p a { color: #1c1f23; } /* dashboard-table */ /* tags */ .tags .nav { align-items: center; } .tags li:first-child { color: #000000; font-size: 16px; margin-left: 20px; margin-bottom: 10px; } .tags li a.btn { padding: 5px 10px; margin-bottom: 10px; margin-left: 10px; color: #747474; border: 1px solid #EFEFF6; border-radius: 12px; } .tags li a.btn:hover { color: #FFF; background-color: var(--main-color); border-color: var(--main-color); } .search-form h4 { font-size: 19px; color: #000000; text-align: center; margin-bottom: 25px; } .status { padding: 6px 15px 8px 15px; background-color: #f9f9f9; border-color: #f9f9f9; border-radius: 6px; color: #1c1f23; font-size: 12px; display: inline-block; } .status.success-status { background-color: #3AA94A; border-color: #3AA94A; color: #FFF; } .status.holding-status { background-color: #F4AA3D; border-color: #F4AA3D; color: #FFF; } .status.closed-status { background-color: #EB4B59; border-color: #EB4B59; color: #FFF; } .orders-table .btn-light i { color: #F4AA3D; } /* tags */ /*user-in-modal*/ .user-in-modal { text-align: center; } .user-in-modal figure { width: 90px; height: 90px; border-radius: 50%; border: 2px solid #FFF; overflow: hidden; box-shadow: 0 12px 19px RGBA(60, 128, 209, 0.09); margin-right: auto; margin-left: auto; } .user-in-modal h5 { color: #1E1E1E; font-size: 15px; } .user-in-modal p { color: #979797; font-size: 12px; } .add-rating-stars .rating { border: none; display: inline-block; } .add-rating-stars .rating > input { display: none; } .add-rating-stars .rating > label:before { margin: 5px; font-size: 1.25em; font-family: "Font Awesome 5 Free Solid"; display: inline-block; content: "\f005"; cursor: pointer; } .add-rating-stars .rating > .half:before { content: "\f089"; position: absolute; transform: scale(-1, 1); } .add-rating-stars .rating > label { color: #ddd; float: left; cursor: pointer; } /***** CSS Magic to Highlight Stars on Hover *****/ .add-rating-stars .rating > input:checked ~ label, /* show gold star when clicked */ .add-rating-stars .rating:not(:checked) > label:hover, /* hover current star */ .add-rating-stars .rating:not(:checked) > label:hover ~ label { color: #FFD700; } /* hover previous stars in list */ .add-rating-stars .rating > input:checked + label:hover, /* hover current star when changing rating */ .add-rating-stars .rating > input:checked ~ label:hover, .add-rating-stars .rating > label:hover ~ input:checked ~ label, /* lighten current selection */ .add-rating-stars .rating > input:checked ~ label:hover ~ label { color: #FFED85; } /*user-in-modal*/ .picker__select--month, .picker__select--year { height: 45px !important; font-size: 18px; } .form-control.datepicker { padding: 6px 15px !important; } .datepicker-dropdown { min-width: 30px; } .datepicker table { width: 300px; } .datepicker td, .datepicker th { height: 35px; } .datepicker table tr td.active.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active.disabled:hover[disabled], .datepicker table tr td.active.disabled[disabled], .datepicker table tr td.active:active, .datepicker table tr td.active:hover, .datepicker table tr td.active:hover.active, .datepicker table tr td.active:hover.disabled, .datepicker table tr td.active:hover:active, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active:hover[disabled], .datepicker table tr td.active[disabled], .datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled.disabled, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover.disabled, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active.disabled:hover[disabled], .datepicker table tr td span.active.disabled[disabled], .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover.disabled, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active:hover[disabled], .datepicker table tr td span.active[disabled] { background: var(--main-color); } .tempus-dominus-widget { width: 30rem; } .tempus-dominus-widget .calendar-header .previous { text-align: right; padding-left: 0; padding-right: 10px; } .tempus-dominus-widget .calendar-header .next { text-align: left; padding-right: 0; padding-left: 10px; } .tempus-dominus-widget .calendar-header .next i, .tempus-dominus-widget .calendar-header .previous i { transform: rotate(180deg); } /* teachers-list-page */ .teachers-list-page .teacher-single .rating-stars { margin-bottom: 10px; } .teachers-list-page .teacher-single .tag-item { padding-right: 0 !important; padding-left: 0 !important; border: none; border-radius: 0; background-color: transparent; box-shadow: none; margin-left: 20px; } .teachers-list-page .teacher-single .tag-item i { font-size: 20px; margin-left: 5px; } .teachers-list-page .teacher-single .tag-item h6 { margin-bottom: 10px; } .teachers-list-page .teacher-single .teacher-action a { height: 44px; line-height: 24px; } /* teachers-list-page */ /* user-header-single */ .account-page { padding: 50px 0; } .user-header-single { min-height: 305px; position: relative; background-color: #FFFF; display: flex; align-items: flex-end; border-top-right-radius: 12px; border-top-left-radius: 12px; overflow: hidden; padding: 20px 20px; border-bottom: 1px solid #E8E8E8; } .user-bg { position: absolute; top: 0; right: 0; width: 100%; height: 215px; background-color: #ccc; background-size: cover; background-repeat: no-repeat; background-position: center; } .user-bg::before { content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; display: block; background: linear-gradient(to right, #4672C1, #04245D); opacity: 0.71; } .user-media { position: relative; z-index: 2; } .user-media figure { width: 165px; height: 165px; overflow: hidden; border-radius: 25px; border: 2px solid #FFFFFF; } .user-media h2 { font-size: 19px; color: #FFF; margin-bottom: 10px; } .user-media a { margin-top: 30px; padding: 10px 25px !important; } .user-media .btn-light { background: #FFF; box-shadow: 0 3px 30px RGBA(108, 126, 147, 0.10); border-radius: 12px; } .user-card { border: none; } .user-card, .user-card .card-header { border-radius: 0; } .user-card .card-header { padding: 20px 20px; font-size: 16px; color: #4D6372; border-top: none !important; display: flex; justify-content: space-between; } .user-card .card-header i, .user-card .card-header svg { margin-left: 5px; } .user-card .card-header .select2-container--default .select2-selection--single { border: 1px solid #F0F2F4; border-radius: 6px; height: 40px; } .user-card .card-header .select2-container--default .select2-selection--single .select2-selection__arrow { display: none; } .user-card .card-header .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0 5px !important; text-align: center; line-height: 40px; } .user-card .text-stripped p, .user-card .text-stripped span, .user-card .text-stripped pre, .user-card .text-stripped blockquote, .user-card .text-stripped li, .user-card .text-stripped > *, .user-card .text-stripped td, .user-card.text-stripped td { font-size: 16px !important; } .tags a { font-size: 12px; padding: 10px 20px !important; margin-bottom: 5px; margin-top: 5px; } .tags a:hover { background: #FFF !important; color: var(--main-color) !important; } /* user-header-single */ /* user-comment */ .user-comment { margin-bottom: 30px; } .user-comment figure { width: 85px; height: 85px; border-radius: 25px; overflow: hidden; } .user-comment h4 { font-size: 15px; color: #4D6372; margin-bottom: 5px; } .user-comment .date-comment { color: #A6B1BB; font-size: 14px; } .user-comment .text-stripped p, .user-comment .text-stripped span { font-size: 12px !important; color: #A2A2A2 !important; } /* user-comment */ .user-card:last-child { border-bottom-right-radius: 12px !important; border-bottom-left-radius: 12px !important; overflow: hidden; } .user-card .user-card-footer .btn { color: var(--main-color); text-decoration: none; } .user-card .user-card-footer .btn i { font-size: 12px; } /* finance-num-item */ .finance-num-item { padding-top: 50px; padding-bottom: 50px; text-align: center; } .finance-num-item h4 { font-size: 23px; color: var(--main-color); font-family: 'main', 'medium', sans-serif; } .finance-num-item p { color: #000000; font-size: 27px; font-weight: bold; margin-bottom: 0; } /* finance-num-item */ /* table-rounded */ .table-rounded { max-height: 400px; position: relative; overflow: auto; } .table-rounded thead tr th { color: #020101; font-size: 16px; padding: 8px 10px; font-family: 'main', 'medium', sans-serif; font-weight: normal; } .table-rounded .table > :not(:last-child) > :last-child > * { border-bottom-color: #E8E8E8; } .table-rounded .table tbody tr td { vertical-align: middle; padding-top: 20px; padding-bottom: 20px; } .table-rounded .table tbody tr td:not(:first-child) { text-align: center; } .table-rounded .table tbody tr td:first-child, .table-rounded .table thead tr th:first-child { padding-right: 20px; } .table-rounded .table tbody tr td a:hover { color: var(--main-color); } .table-rounded td[rowspan] { background: #F9F9F9; border: 1px solid #E8E8E8; } /* table-rounded */ @import url('https://fonts.googleapis.com/css?family=Catamaran:400,800'); .not-found-page .error-container { text-align: center; font-size: 106px; font-family: 'Catamaran', sans-serif; font-weight: 800; margin: 70px 15px; } .not-found-page .error-container > span { display: inline-block; position: relative; } .not-found-page .error-container > span.four { width: 136px; height: 43px; border-radius: 999px; background: linear-gradient(140deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.07) 43%, transparent 44%, transparent 100%), linear-gradient(105deg, transparent 0%, transparent 40%, rgba(0, 0, 0, 0.06) 41%, rgba(0, 0, 0, 0.07) 76%, transparent 77%, transparent 100%), linear-gradient(to right, var(--main-color), var(--secondary-color)); } .not-found-page .error-container > span.four:before, .not-found-page .error-container > span.four:after { content: ''; display: block; position: absolute; border-radius: 999px; } .not-found-page .error-container > span.four:before { width: 43px; height: 156px; left: 60px; bottom: -43px; background: linear-gradient(128deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.07) 40%, transparent 41%, transparent 100%), linear-gradient(116deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.07) 50%, transparent 51%, transparent 100%), linear-gradient(to top, var(--main-color), var(--secondary-color), #4A6278, #007acc, #007acc); } .not-found-page .error-container > span.four:after { width: 137px; height: 43px; transform: rotate(-49.5deg); left: -18px; bottom: 36px; background: linear-gradient(to right, var(--main-color), var(--secondary-color), #4A6278, #007acc, #007acc); } .not-found-page .error-container > span.zero { vertical-align: text-top; width: 156px; height: 156px; border-radius: 999px; background: linear-gradient(-45deg, transparent 0%, rgba(0, 0, 0, 0.06) 50%, transparent 51%, transparent 100%), linear-gradient(to top right, var(--main-color), var(--secondary-color), #4A6278, #007acc, #007acc); overflow: hidden; animation: bgshadow 5s infinite; } .not-found-page .error-container > span.zero:before { content: ''; display: block; position: absolute; transform: rotate(45deg); width: 90px; height: 90px; background-color: transparent; left: 0px; bottom: 0px; background: linear-gradient(95deg, transparent 0%, transparent 8%, rgba(0, 0, 0, 0.07) 9%, transparent 50%, transparent 100%), linear-gradient(85deg, transparent 0%, transparent 19%, rgba(0, 0, 0, 0.05) 20%, rgba(0, 0, 0, 0.07) 91%, transparent 92%, transparent 100%); } .not-found-page .error-container > span.zero:after { content: ''; display: block; position: absolute; border-radius: 999px; width: 70px; height: 70px; left: 43px; bottom: 43px; background: #FDFAF5; box-shadow: -2px 2px 2px 0px rgba(0, 0, 0, 0.1); } .not-found-page .screen-reader-text { position: absolute; top: -9999em; left: -9999em; } @keyframes bgshadow { 0% { box-shadow: inset -160px 160px 0px 5px rgba(0, 0, 0, 0.4); } 45% { box-shadow: inset 0px 0px 0px 0px rgba(0, 0, 0, 0.1); } 55% { box-shadow: inset 0px 0px 0px 0px rgba(0, 0, 0, 0.1); } 100% { box-shadow: inset 160px -160px 0px 5px rgba(0, 0, 0, 0.4); } } /* demo stuff */ .not-found-page h1 { text-align: center; margin: 30px 15px; } .not-found-page .zoom-area { max-width: 490px; margin: 30px auto 30px; font-size: 19px; text-align: center; } .not-found-page .link-container { text-align: center; } .not-found-page a.more-link { text-transform: uppercase; font-size: 13px; background-color: #de7e85; padding: 10px 15px; border-radius: 0; color: #fff; display: inline-block; margin-right: 5px; margin-bottom: 5px; line-height: 1.5; text-decoration: none; margin-top: 50px; letter-spacing: 1px; } .chat-page { padding: 50px 0 30px 0; } /* chat box */ .text-main-success{ color: #40ADB0; } .text-main-danger{ color: #985053; } .bg-main{ background: #277093 !important; } .bg-main-success{ background: #40ADB0 !important; } .btn-main-success{ background: #40ADB0 !important; } .rounded-10{ border-radius: 10px; } .list-chat { max-height: 300px; height: 300px; } .bg-unfollow { background: #ECECEC !important; } .rounded-chat { border-top-left-radius: 30px; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; } .rounded-chat-rtl { border-top-right-radius: 30px; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; } .mw-70 { max-width: 75%; } .bottom-n-3 { bottom: -25px; } .chat { max-height: 380px; overflow: auto; } .single-user-chat { height: calc(100vh - 100px) } .bg-unfollow-Receipt { background: #ECECEC; } .btn-check:focus + .btn, .btn:focus{ box-shadow: 0 0 !important; } .w-80 { width: 80%; } .input-file { z-index: -1; position: absolute; opacity: 0; width: 25%; } .mn{ margin-left: -42px; margin-top: 2px; } .min-20{ min-width: 20%; } /* chat box */ /* Media for responsive */ @media (max-width: 1440px) {} @media (min-width: 1440px) and (max-width: 1465px) {} @media (min-width: 1465px) and (max-width: 1565px) {} @media (min-width: 1465px) and (max-width: 1665px) {} @media (min-width: 1440px) and (max-width: 1750px) {} @media (min-width: 1300px) and (max-width: 1375px) {} @media (min-width: 1200px) and (max-width: 1300px) {} @media (max-width: 1200px) {} @media (max-width: 991px) { .main-header { padding: 10px 0; } .navbar-light .navbar-toggler { border: none !important; box-shadow: none !important; color: var(--main-color); font-size: 25px; } .slider-text{ margin-top: 25px; text-align: center; } .search-in-index { margin-top: -122px; } .teacher-item { margin-bottom: 25px; } .teacher-single figure { width: 80px; height: 80px; } .teacher-single h5 { font-size: 13px; margin-bottom: 5px; } .auth { height: auto; } .auth-wrapper { flex-direction: column !important; } .auth-wrapper > div{ width: 100%; flex: 0 0 100%; } } @media (max-width: 768px) { .slider-text h1 { font-size: 20px; line-height: 33px; } .slider-text p { font-size: 14px; line-height: 26px; padding: 10px 13px; } .sec-header h4 { font-size: 20px; } .sec-header h5 { font-size: 16px; } .search-in-index .search-form .select2-container .select2-selection--single { height: 45px; } .search-in-index .search-form .select2-selection--single .select2-selection__rendered { line-height: 45px; } .search-in-index .search-form .select2-selection--single .select2-selection__arrow { height: 45px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { height: 14px !important; } .search-form .btn { height: 45px; } .search-form p { margin-top: 10px; margin-bottom: 0; font-size: 14px; } .search-in-index { padding-bottom: 20px; } .features { padding: 35px 0; } .sec-header { margin-bottom: 20px; } .feature-item figure { width: 50px; height: 50px; line-height: 50px; } .feature-item figure img { width: 31px; height: 30px; } .feature-item h3 { font-size: 15px; } .feature-item p, .feature-item span, .feature-item pre { font-size: 12px; line-height: 24px; } .feature-item { padding: 15px; } .feature-item::before { height: calc(100% - 45px); } .owl-nav-custom button { border-radius: 3px; padding: 4px 6px; margin-right: 9px; } .owl-nav-custom button i{ vertical-align: middle; } .course-item .hot { padding: 5px 10px; font-size: 13px; } .course-item .hot img { display: inline-block; width: 19px; height: 17px; margin-left: 5px; } .course-item figure { height: 200px; margin-bottom: 5px; } .course-item h3 { margin-bottom: 0; font-size: 14px; } .course-item p { font-size: 12px; line-height: 22px; } .course-item a.cat { font-size: 12px; padding: 7px 12px; } .course-item a.btn { font-size: 14px; } .teacher-item .title h4 { font-size: 16px; margin-bottom: 5px; } .teacher-item .title p { font-size: 12px; } .rating-teacher { font-size: 16px; } .date-price { font-size: 14px; } .date-price span { font-size: 12px; } .promo-text { text-align: center; } .promo-text h3 { font-size: 24px; margin-bottom: 10px; } .promo-text p { font-size: 14px; } .promo-text a { width: 100%; font-size: 15px; } .promo-img { height: 290px; margin-top: 20px; } .qoute-div p { font-size: 12px; line-height: 22px; } .author-blog figure { height: 40px !important; } .contact-text h4 { font-size: 22px; } .contact-text p { font-size: 16px; } .contact-form .form-group input.form-control { height: 45px; } .contact-form .form-group .ico { top: 7px; } .page-header h1 { font-size: 15px; } .page-header h1 svg { height: 23px; margin-left: 5px; } .page-header .select2-container--default .select2-selection--single .select2-selection__rendered { font-size: 14px; } .page-header .btn { font-size: 14px; } .single-title, .side-left h4 { font-size: 17px; } .single-image { height: 275px; } .play-btn a { width: 80px; height: 80px; line-height: 80px; font-size: 38px; } .desc-single > p { font-size: 14px; } .desc-single ul li { padding: 10px 15px; } .text-stripped p, .text-stripped span, .text-stripped pre, .text-stripped blockquote, .text-stripped li, .text-stripped > *, .text-stripped td, .text-stripped td { font-size: 12px; } .teachers-single h4 { font-size: 14px; } .tag-item { padding: 6px 10px; } .tag-item h6{ font-size: 11px; } .tag-item span { font-size: 12px; } .teacher-single { padding: 10px 12px; } .teacher-single .d-flex { flex-direction: column; } .teacher-single .flex-grow-1 { margin-right: 0 !important; text-align: center; padding: 15px 0; width: 100%; } .rating-stars { margin-bottom: 10px; } .auth .d-table-cell { padding: 25px 15px !important; } .vcode { flex-wrap: wrap; } .vcode .form-control { flex: 0 0 14%; width: 14%; } } @media (max-width: 576px) {} @media (max-width: 450px) { .page-header [class*=col] { flex: 0 0 100%; text-align: center; } .page-header h1 { margin-bottom: 10px; } .page-header .justify-content-end { justify-content: center !important; } .share-single { flex-direction: column; } .share-single .title img { height: 36px; } .share-single .title { font-size: 16px; margin-bottom: 5px; } .social-list li a { width: 37px; height: 37px; line-height: 33px; } .detial-item .value { font-size: 14px; } .course-details a { font-size: 16px; } } @media (max-width: 380px) { .prices { display: flex; flex-direction: column; } .prices li { flex: 0 0 100%; margin-bottom: 10px; } } /* Media for responsive */