@import url('https://fonts.googleapis.com/css2?family=Amiko:wght@400;700&display=swap');
body{ background: #EFEFEF; font-size: 14px; overflow-x: hidden; font-family: 'Amiko', sans-serif; color: #000; letter-spacing: 0; font-weight: 300;}
a, a:link, a:visited, a:hover, a:active, button, button:hover, i, i:hover, h6, h6:hover, :hover, img, .form-control:focus{ box-shadow: none; text-decoration:none; outline:none; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
img{ max-width:100%;} input, textarea, button, input:focus, textarea:focus, button:focus{outline: none;}
a, a:hover, a:focus{color:inherit;}
ul{list-style: none; padding: 0px; margin: 0px;}
p{line-height: 24px; margin-bottom: 15px; color: #414141;}
h5, h4, h3, h2{letter-spacing: 0.5px;}
h1{font-size: 30px; color: #000; font-weight: 700; letter-spacing: 0.5px; text-transform: capitalize;}
header{background: #262F55; padding: 10px 0px; color: #fff; box-shadow: 0px 7px 7px rgb(0 0 0 / 15%);}
header .logo{filter: brightness(0) invert(1); max-height: 52px;}
.header-dp{width: 60px; height: 60px; border-radius: 100%; display: inline-block; border: 2px solid #0498E4;}
.header-dp img{width: 56px; height: 56px; object-fit: cover; border-radius: 50%;}
header .premium{filter: brightness(0) invert(1);}
header .premium:hover{filter: none;}
.header-appear {position: fixed; width: 100%; top: 0px; z-index: 15; box-shadow: 0px 0px 20px rgb(0 0 0 / 15%); border: none;}
.dropdown-menu { padding:0px;font-size: 0.875rem;line-height: 22px; color: #5c5776; border: none; box-shadow: 0 10px 30px 0 rgba(31, 45, 61, 0.1); border-radius: 0.5rem; left: auto; right: 0; overflow: hidden;}
.dropdown-menu { display: block; visibility: hidden; opacity: 0; transform: translateY(20px); transition: all 0.3s ease-in; }
.dropdown:hover > .dropdown-menu { transform: scaleY(1); opacity: 1; visibility: visible; }
.dropdown-submenu:hover > .dropdown-menu { transform: scaleY(1); opacity: 1; visibility: visible; }
.avatar-md { width: 56px; height: 56px; border-radius: 50%;}
.avatar img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 50%; overflow: hidden;}
.avatar { position: relative; display: inline-block; width: 3rem; height: 3rem; font-size: 1rem; }
.avatar-online:before { background-color: green;}
.avatar-indicators:before { content: ""; position: absolute; bottom: 0px; right: 5%; width: 30%; height: 30%; border-radius: 50%; border: 2px solid #fff;display: table; }
.dropdown-divider{margin: 0px;}
.profile-dropdown{padding: 0px; text-align: left; margin: 0px; list-style: none;}
.profile-dropdown li a{padding: 4px 25px;}
.profile-dropdown li a:hover{background: #0498E4; color: #fff;}
.profile-dropdown li i{padding-left: 8px;}
header .dropdown{display: inline-block;}
.dropdown .dropdown-item h5{font-size: 16px;}
header .dropdown-item{padding:10px 10px 0px;}
.notification{margin-right: 30px; font-size: 20px; top: 6px;}
.notification sup{position: absolute; width: 18px; left: 10px; height: 18px; background: #0498E4; border-radius: 50%; text-align: center; line-height: 20px; font-size: 10px;}
.notification .dropdown-menu{width: 350px;}
.notification .dropdown-item{white-space: inherit; padding: 8px 20px 8px 40px; position: relative;}
.notification .dropdown-item h6{font-size: 14px; color: #414141; margin-bottom: 0px; padding-right: 50px; line-height: 20px;}
.notification .dropdown-item p{color: #414141; margin-bottom: 0px; font-size: 12px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}
.not-read{position: absolute; left: 12px; top: 8px; color: #c4c4c4;}
.read .not-read{color: #0498E4;}
.not-time{position: absolute; right: 15px; top: 8px; color: #414141; font-size: 12px;}
.read .not-time{font-weight: 700; color: #000;}
.dropdown-item.read h6, .dropdown-item.read .not-class{color: #000;}
.notification .dropdown-item img{max-width: 35px; margin-right: 10px;}
.not-class{position: relative; left: 50px; color: #414141; font-size: 12px;}
.sidebar{-webkit-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;position: fixed; top: 80px; left: 0; height: 100%; width: 250px; background: #fff; box-shadow: 0px 8px 20px rgba(103, 103, 103, 0.10); z-index: 333333; display: block; -webkit-box-align: center; -ms-flex-align: center; align-items: center;  color: #e9e9e9; text-align: left;  overflow-y: auto;}
.sidebar-closed{-webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%);}
.sidebar-opened{	-webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0);}
.sidebar li{list-style: none; font-size: 14px;  color:#414141; padding: 10px 25px; border-bottom: 1px solid #ddd;}
.sidebar li:hover{color:#0498E4;}
#menu-wrapper{float: left; margin-right: 20px;}
.main-list{padding: 60px 0px;}
.list-box{text-align: center; background: linear-gradient(#0498E4, #00A8FF); position: relative; overflow: hidden; border-radius: 11px;
box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.10); padding: 20px 0px; transition: all 0.3s ease-in-out;}
.list-box img{background: #06ABFF; padding: 8px; border-radius: 11px; margin-bottom: 12px;}
.list-box h6{color: #fff; margin: 0px;}
.list-box:hover{transform: translateY(-20px); box-shadow: 0 8px 30px 0 rgb(0 0 0 / 20%);}
.greenbox{background: linear-gradient(#0DD59D, #20EBB2);}
.greenbox img{background: #20EBB2;}
.redbox{background: linear-gradient(#FF3B30, #FF6259);}
.redbox img{background: #FF6259;}
.lightgreenbox{background: linear-gradient(#4CD964, #78FF8F);}
.lightgreenbox img{background: #78FF8F;}
.skybluebox{background: linear-gradient(#11D3FA, #45E0FF);}
.skybluebox img{background: #45E0FF;}
.violetbox{background: linear-gradient(#9962FF, #AF86FB);}
.violetbox img{background: #AF86FB;}
.kids-live{background: #FFC824; border-radius: 11px; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.10); color: #fff; padding: 30px 50px;
position: relative;}
.telescope{position: absolute; bottom:0px; right: 20%;}
.telescope img{max-width: 220px;}
.kids-live h4{line-height: 34px;}
.kids-live button{line-height: 40px; background: #0498E4; border-radius: 30px; color: #fff; border: none; min-width: 150px; height: 40px; margin-top: 10px;}
.kids-live button:hover{background: #262F55;}
.teacher-box{padding: 20px; margin-bottom: 30px; border-radius: 11px; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04); background: #fff; min-height: 258px; position: relative;}
.pad-60{padding: 60px 0px;}
.avater-teacher{border-radius: 50%; margin-right: 20px; overflow: hidden; border: 1px solid #0498E4; }
.teacher-box-content{min-height: 50px; color: #414141; position: relative;}
.teacher-box-content p{margin: 0px;}
.teacher-title h5{font-size: 16px;}
.teacher-title h6{font-size: 12px; margin: 0px;}
.techer-box-footer{border-top: 1px solid #e8e8e8; padding-top: 20px; text-align: right; position: absolute; bottom: 20px; width: 90%;}
.techer-box-footer button{padding: 2px 20px;}
.techer-box-footer .join-now{min-width: 100px; height: 34px; border-radius: 30px; background: #0498E4; color: #fff; border: none; line-height: 34px;}
.techer-box-footer .schedule{ border-radius: 30px; background: #263656; height: 34px; border: none; line-height: 34px; color: #fff;}
.techer-box-footer .join-now:hover{background: #262F55;}
.techer-box-footer .schedule:hover{background: #0498E4;}
.teacher-box-content ul{display: flex;}
.teacher-box-content ul li{overflow: hidden; border-radius: 6px; display: inline-block; position: relative; width: 100%; max-width: 90px; margin: 4px;}
.teacher-box-content ul li img:hover{filter: grayscale(100%);}
.teacher-box-content ul li:first-child{margin-left: 0px;}
.teacher-box-content ul li:last-child{margin-right: 0px;}
.gallery-overlay{background: rgba(0, 0, 0, 0.75); position: absolute; left: 0; right: 0; bottom: 0; top: 0; text-align: center;  }
.gallery-overlay label{color: #fff; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); line-height: 14px; cursor: pointer;}
.gallery-overlay label span{font-size: 10px;}
.pad-rht100{padding-right: 100px;}
.pdf-icon{position: absolute; right:0px; top:0px;}
.techer-box-footer .receipt{ border-radius: 30px; background:linear-gradient(#4CD964, #00FF2B); height: 34px; border: none; line-height: 34px; color: #fff;}
.techer-box-footer .receipt:hover{background:linear-gradient(#00FF2B, #4CD964);}
footer{background: #fff; padding: 30px 0px;}
footer img{max-height: 80px;}
footer li{list-style: none;}
footer li a:hover{color: #0498E4;}
.copy-right{background: #262F55; color: #fff; text-align: center; padding: 14px 15px 10px;}
.copy-right p{margin-bottom: 0px; color: #fff;}
#topcontrol{font-size: 24px; color: #0498E4;}
/* *********inner pages***************/
.inner-page{padding: 60px 0px;}
.inner-page h1{text-align: center; margin-bottom: 30px;}
.liveclass-box{position: relative; min-height: 180px; margin-bottom: 30px; background: #fff; border-radius: 11px; padding: 20px;  box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04);}
.liveclass-box h5{font-size: 18px; margin: 0px;}
.liveclass-box h6{font-size: 12px;}
.liveclass-box p{color: #414141; font-size: 14px;}
.techer-box-footer .btn-disable{pointer-events: none; cursor: not-allowed; background: #c4c4c4;}
.gallery-box{position: relative; background: #fff; border-radius: 11px; padding: 20px; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04); margin-bottom: 30px;}
.gallery-box .teacher-box-content ul li{max-width: 100%;}
.gallery-details{padding: 60px 0px;}
.gallery-detail-box{margin: 0px; margin-bottom: 40px; background: #fff; border-radius: 10px; overflow: hidden; position: relative; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04);}
.zero{margin: 0px; padding: 0px;}
.gallery-content{padding: 20px;}
.gallery-details h1{margin-bottom: 25px;}
.gallery-content label{margin-bottom: 0px; margin-right: 20px; color: #414141;}
.gallery-content label i{margin-right: 5px;}
.comment-box{display: flex; margin-bottom: 15px;}
.comment-img{margin-right: 10px;}
.comment-img img{max-width: 38px; border: 2px solid #0498E4; border-radius: 50%;}
.comment-text{width: 100%; position: relative;}
.comment-box .form-control{margin-bottom: 0px; border-radius: 30px; padding-right: 50px;}
.comment-box i{position: absolute; top: 12px; right: 20px; color: #0498E4;}
.comment-text p{background: #f4f4f4; padding: 5px 10px; border-radius: 6px;}
.gallery-img{position: relative; overflow: hidden;}
.gallery-img img{height: 350px; width: 100%; object-fit: cover;}
.bx-shadow{box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04);}
.gallery-recent{border-radius: 10px; overflow: hidden; position: relative; background: #fff; margin-bottom: 30px;}
.gallery-recent .gallery-content{padding: 10px 20px;}
.gallery-recent .gallery-content p{margin-bottom: 0px;}
.gallery-recent .gallery-content label:last-child{float: right;}
.gallery-recent a:hover{color: #0498E4;}
.gallery-recent img{width: 100%; height: 200px; object-fit: cover;}
.announcement-holiday{padding: 0px; padding-top: 20px; position: relative; overflow: hidden;}
.announcement-holiday h5, .announcement-holiday h6{padding: 0px 20px;}
.announcement-holiday img{transition: 0.3s all ease-in-out; width: 100%;}
.announcement-holiday:hover img{filter: grayscale(100%);}
/* .announcement-box{min-height: 200px;} */
.attendence-box{padding: 20px; background: #fff; border-radius: 10px; position: relative; margin-bottom: 30px;}
.icon-done{position: absolute; right: 20px; top: 12px;}
.attendence-table{background: #fff; border-radius: 10px; position: relative; margin-bottom: 30px; padding-top: 20px;}
.attendence-table h5{font-size: 18px; padding: 0px 20px;}
.attendence-table .table img{max-width: 25px;}
.attendence-table .table td{padding: 10px 20px; color: #414141;}
.present{color: #4CD964 !important;}
.abcent{color: #FF3B30 !important;}
.attendence-table .table tr:last-child td{border: none;}
.width-95{width: 95%;}
.download-btn{position: absolute; right: 10px; top: 8px;}
.download-btn button{background: #0498E4; color: #fff; border-radius: 30px; border: none; min-width: 100px; height: 34px; line-height: 34px; margin-left: 8px;}
.download-btn button:hover{background: #262F55;}
.attendence-table .table th{padding: 10px 20px; background: rgba(4, 153, 228, 0.2); color: #000; font-weight: 700;}
.library-select{margin-bottom: 30px;}
.library-select label{font-size: 18px;}
.library-box{position: relative; overflow: hidden; border-radius: 11px; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.2); margin-bottom: 30px;}
.library-box img{width: 100%; height: 270px; object-fit: cover; transition: all 0.3s ease-in-out;}
.library-box:hover img{transform: scale(1.1);}
.attendence-table td h6{color: #262F55; font-size: 14px; font-weight: 700;}
.attendence-table td p{color: #414141;}
.table-attchment{position: absolute; right: 10px; color: #262F55; top: 5%;}
.table-attchment i{color: #0498E4;}
.weekplan td{position: relative;}
.table-attchment:hover{color: #0498E4;}
.login{background: #262F55; padding: 15px 30px; border-radius: 11px; text-align: center; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.5);
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 400px;}
.login img{filter: brightness(0) invert(1); max-height: 100px; margin-bottom: 20px;}
.login input{border-radius: 30px; padding: 10px 20px; height: 42px; border: none; line-height: 42px;}
.login button{width: 100%; border: 1px solid #0498E4; border-radius: 30px; background: #0498E4; color: #fff; text-transform: uppercase;
height: 42px; margin-bottom: 15px; line-height: 42px;}
.login button:focus{background: #262F55; color: #0498E4;}
.login p{color: #AFAFAF;}
.login p a{color: #fff;}
.login p a:hover{color: #0498E4;}
.login h6{font-size: 14px; color: #fff; text-decoration: underline;}
.login h6:hover{ color: #0498E4;}
.student-selection{background: #fff; border-radius: 11px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 400px; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.04);}
.student-selection h6{padding: 10px 20px; border-bottom: 1px solid #ebebeb; margin: 0px;}
.welcome-radio{position: relative; width: 100%; height: 85px; margin: 0px; display:block !important; opacity: 1 !important; cursor: pointer; padding: 15px 20px;border-bottom: 1px solid #ebebeb;
padding-left: 100px;}
.welcome-radio input {position: absolute;opacity: 0; cursor: pointer;}
.welcome-radio .checkmark {position: absolute;top: 0px;left: 0px; height: 85px;width: 100%; padding: 10px 20px;}
.welcome-radio:hover input ~ .checkmark {background: #f5f5f5;}
.welcome-radio input:checked ~ .checkmark {background: #f5f5f5;}
.welcome-radio p{position: absolute; left: 25%; top: 20%;}
.welcome-radio img{position: absolute; border: 3px solid #ebebeb; border-radius: 50%;}
.welcome-radio input:checked ~ .checkmark img{border-color: #0498E4;}
.student-selection button{margin: 12px; background: #0498E4; color: #fff; border: none; border-radius: 30px; width: 94%; height: 42px; line-height: 42px;;}
.student-selection button:hover, .student-selection button:focus{background: #262F55;}
.library-details{padding: 60px 0px;}
.library-details img{border-radius: 11px;  box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.20);}
.library-details h5{font-size: 18px;}
.library-details h3{font-weight: 700; font-size: 24px;}
.library-details h6{font-size: 12px; margin-bottom: 20px;}
.recently-added{padding-bottom: 30px;}
.recently-added h4{font-size: 24px; margin-bottom: 20px; font-weight: 700;}
.booking-box{padding: 20px; margin-bottom: 30px; border-radius: 11px; box-shadow: 0px 8px 10px rgb(103 103 103 / 4%); background: #fff; position: relative;}
.booking-box button{background:#0498E4; padding: 6px 20px; min-width: 160px; border-radius:5px; color: #fff; border: none; box-shadow: 0px 8px 10px rgba(103, 103, 103, 0.20); margin-top: 15px;}
.booking-box button:hover, .booking-box button:focus{background: #262F55;}
#yourBtn{display: inline-block; margin-left: 10px; width: 26px; height: 26px; border-radius: 50%; background: #0498E4; color: #fff;
text-align: center; line-height: 30px; cursor: pointer;}
.profile-box{padding: 20px; box-shadow: 0px 8px 10px rgb(103 103 103 / 4%); background: #fff; position: relative; border-bottom: 10px solid rgba(4, 153, 228, 0.2);}
.profile-box img{border: 2px solid #0498E4; box-shadow: 0px 8px 6px rgb(103 103 103 / 20%); border-radius: 50%;}
.profile-box h5{font-size: 18px;}
.profile-box h6{font-size: 14px; font-weight: 700;}
.brd-rds-top11{border-top-left-radius: 11px; border-top-right-radius: 11px;}
.brd-rds-bot11{border-bottom-left-radius: 11px; border-bottom-right-radius: 11px;}
.profile-box i{position: absolute; right: 20px; top: 20px;}
.profile-box table{margin: 0px;}
.profile-box table td{border: none;}
.brd-rds-top0{border-top-left-radius: 0px; border-top-right-radius: 0px;}
.weekplan{padding-top: 0px; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.weekplan .table th{border-top-left-radius: 20px; border-top-right-radius: 20px; border: none;}
.weekplan-dates{background: #fff; border-radius: 30px; text-align: center; box-shadow: 0px 8px 10px rgb(103 103 103 / 4%); line-height: 32px; margin-bottom: 30px;
padding: 8px 20px;}
.weekplan-left{float: left; font-size: 22px; color:#0498E4; padding-top: 4px;}
.weekplan-right{float: right; font-size: 22px; color:#0498E4; padding-top: 4px;}
.weekplan-dates h5{display: inline-block; margin: 0px; font-size: 18px; color: #414141; font-weight: 700;}
.weekplan-left i:hover, .weekplan-right:hover{color: #262F55;}
.weekplan td p{margin: 0px;}
.report-table h5 button{position: absolute; right: 15px; top: 10px; margin: 0px; font-size: 12px; border: none; border-radius: 30px; background: #0498E4; color: #fff; padding: 8px 16px;}
.report-table h5 button:hover{background: #262F55;}
.attachment-btn{border: none; background: none; font-size: 12px; color: #263656; position: absolute; right: 10px; top: 10px;}
.attachment-btn i{color: #0498E4; margin-right: 5px;}
.attachment-btn #yourBtn{background: none; color: #263656; width: auto; height: auto;}
.home-work .table button{float: right; border: none; border-radius: 30px; background: #0498E4; color: #fff;
font-size: 12px; font-weight: 300; padding: 4x 20px; min-width: 120px;}
.home-work .table button:hover{background: #262F55; color: #fff;}
.answer-thumb{float: left;}
.home-work{min-height: 220px;}
.home-work .answer-thumb img{max-width: 52px; border: 2px solid #dbdbdb; border-radius: 10px;}
.answer-delete{float: right; color: #263656; padding-top: 10px;}
.answer-delete i{color: #0498E4; margin-right: 4px;}
.behaviour-table table td{text-align: center;}
.behaviour-table table td i{color: #FFE713;}
.inbox-btn button{max-width: 150px; width: 100%; padding: 9px 12px; background: #fff; border: none; border-radius:8px; margin-right: 10px;}
.inbox-btn button.sentmail{background: #1D4F57; color: #fff;}
.inbox-btn button.composs{background: #0DD59D; color: #fff;}
.inb-searchbox{position: relative;}
.inb-searchbox input{width: 100%; padding: 10px 20px; border-radius: 30px; background: #f5f5f5; border: 1px solid #ddd;}
.inb-searchbox i{position: absolute; right: 20px; top: 16px; cursor: pointer; color: #999;}
.mail-box{position: relative; background: #f5f5f5; border-radius: 10px; border: 1px solid #ddd; padding: 15px; margin-bottom: 10px; cursor: pointer;}
.mail-box h5{font-size: 16px; font-weight: 700; color: #414141; padding-right: 70px;}
.mail-box p{font-size: 14px; margin: 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.mail-date{position: absolute; right: 15px; top: 15px; font-size: 12px;}
.mail-box.unread{background: #fff;}
.mail-box.unread h5{color: #000;}
.mail-box:hover{opacity: 0.7;}
.inbox-details{background: #fff; border: 1px solid #ddd; padding: 15px; border-radius: 10px; margin-top: 30px; position: relative;}
.inbox-details h6{font-size: 12px; color: #414141; margin-bottom: 12px;}
.inbox-details h4{font-size: 16px; font-weight: 700; margin-bottom: 15px;}
.inbox-details h5{font-size: 14px; margin-bottom: 30px;}
.inbox-details p{font-size: 12px; line-height: 20px;}
.line-1{position: absolute; width: 100%; height: 1px; background: #ddd; left: 0px; top: 105px;}
.inbox-details label span:hover{text-decoration: underline; cursor: pointer;}
.reply-btn{margin-top: 30px;}
.reply-btn button{min-width: 150px; color: #fff; border-radius: 8px; background: #262F55; border: none; padding: 8px 12px;
box-shadow: 0px 7px 7px rgb(0 0 0 / 15%);}
.reply-btn button:hover{opacity: 0.8;}
.inbox-details select, .inbox-details input, .inbox-details textarea{width: 100%; border-radius: 5px; margin: 0px;}
.inbox-details button{margin-top: 10px; min-width: 150px; border-radius: 5px; border: none; padding: 8px 12px;
box-shadow: 0px 7px 7px rgb(0 0 0 / 15%); background: #0DD59D; color: #fff;}
.inbox-details button:hover{opacity: 0.8;}
.examination button{float: right; background: none; border: none; font-size: 16px;}
.examination button:hover{color: #262F55;}
.feeTable .table th{background: #ACFFBA;}
.feeTable .table tr:last-child{border-top: 1px solid #dee2e6;}
.min-height500{min-height: 600px;}

