/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */

.login-bg {
	background: url(../../app-assets/images/bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}
.custom-file-upload input[type="file"] {
    display: none;
}
.bg-dash-1 {
	background-image:linear-gradient(45deg, #F44336, #EF9A9A);
	background-repeat: repeat-x;
}
.bg-dash-2 {
	background-image:linear-gradient(45deg, #E91E63, #F48FB1);
	background-repeat: repeat-x;
}
.bg-dash-3 {
	background-image:linear-gradient(45deg, #9C27B0, #9C27B0);
	background-repeat: repeat-x;
}
.bg-dash-4 {
	background-image:linear-gradient(45deg, #673AB7, #673AB7);
	background-repeat: repeat-x;
}
.bg-dash-5 {
	background-image:linear-gradient(45deg, #3F51B5, #9FA8DA);
	background-repeat: repeat-x;
}
.bg-dash-6 {
	background-image:linear-gradient(45deg, #2196F3, #2196F3);
	background-repeat: repeat-x;
}
.bg-dash-7 {
	background-image:linear-gradient(45deg, #218ab9, #81D4FA);
	background-repeat: repeat-x;
}
.bg-dash-8 {
	background-image:linear-gradient(45deg, #009688, #04635a);
	background-repeat: repeat-x;
}
.bg-dash-9 {
	background-image:linear-gradient(45deg, #4CAF50, #A5D6A7);
	background-repeat: repeat-x;
}
.bg-dash-10 {
	background-image:linear-gradient(45deg, #8BC34A, #C5E1A5);
	background-repeat: repeat-x;
}
.bg-dash-11 {
	background-image:linear-gradient(45deg, #CDDC39, #E6EE9C);
	background-repeat: repeat-x;
}
.bg-dash-12 {
	background-image:linear-gradient(45deg, #FF9800, #d27f05);
	background-repeat: repeat-x;
}
.bg-dash-13 {
	background-image:linear-gradient(45deg, #00C853, #4CAF50);
	background-repeat: repeat-x;
}
.filter-dropdown, .student-dropdown {
	position: absolute;
    top: 100%;
    left: 0;
    max-width: 600px;
	width: 100%;
    background: #fff;
    padding: 1rem;
    z-index: 10;
	box-shadow:0 4px 24px 0 rgb(34 41 47 / 10%);
	border-radius: 0.428rem;
	margin-top:0.5rem;
}
.filter-dropdown .form-control {
	width:100% !important;
}
.student-dropdown {
	left:76px;
	max-height:300px;
	overflow-y:auto;
}
.student-dropdown li {
	padding:5px 10px;
	cursor:pointer;
}
.student-dropdown li:hover {
	background:#f0f0f0;
}
#DataTables_Table_0_wrapper .dataTables_length, #DataTables_Table_0_wrapper .dataTables_filter, 
#DataTables_Table_1_wrapper .dataTables_length, #DataTables_Table_1_wrapper .dataTables_filter, 
#DataTables_Table_2_wrapper .dataTables_length, #DataTables_Table_2_wrapper .dataTables_filter,
#DataTables_Table_3_wrapper .dataTables_length, #DataTables_Table_3_wrapper .dataTables_filter, 
#DataTables_Table_4_wrapper .dataTables_length, #DataTables_Table_4_wrapper .dataTables_filter,
#DataTables_Table_5_wrapper .dataTables_length, #DataTables_Table_5_wrapper .dataTables_filter,
#DataTables_Table_6_wrapper .dataTables_length, #DataTables_Table_6_wrapper .dataTables_filter {
	display:none;
}
thead.bg-primary tr th {
	background:#7367f0 !important;
	color:#ffffff;
}
thead.bg-warning tr th {
	background:#ff9f43 !important;
	color:#ffffff;
}
.module-header {
	max-height:190px;
}
.module-title {
	font-size:1.4rem;
}
.filter {
	border:1px solid #ff9f43;
	padding:3px 6px;
	border-radius:0.358rem;
}
.filter a {
	color:#ff9f43;
}
/* Teacher Dashboard */
.class-teacher {
	width:1.5rem;
	height:1.5rem;
}
.time-table tbody tr td {
	padding:1rem 0.5rem !important;
}
.time-table .lunch {
	writing-mode: vertical-rl;
	text-orientation: upright;
}
.time-table .active-class {
	color:#fff !important;
	animation: blinking 1s infinite;
}
@keyframes blinking {
  0% {
    background-color: #ff3d50;
  }
  100% {
    background-color: #222291;
  }
}
.resources .transaction-item:hover {
	background:rgba(115, 103, 240, 0.12) !important;
	cursor:pointer;
}
.resources .transaction-item .media-body .feather {
	width:20px;
	height:20px;
}
.mr-10 {
	margin-right:10px !important;
}

/* School Definition CSS */
.selected {
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    height: 24px;
    background: #7367f0;
    text-align: center;
    line-height: 24px;
    color: #fff;
}
#school-definition .type {
	position:relative;
	color:#6E6B7B;
	display:block;
}
#school-definition a.location .card {
	background:#e3e1ff;
}
#school-definition a.type:hover .card, #school-definition a.location:hover .card{
	background:#d7d4fd !important;
}
#school-definition a.location .avatar .avatar-content{
	width:100px;
	height:auto;
} 
#school-definition a.location .flag-icon {
	width: 100%;
    height: 3rem;
	background-position: left;
}
.divider-text.custom {
	padding: 3px 16px;
    border-radius: 16px;
}
.divider .divider-text.custom.bg-primary:before, .divider .divider-text.custom.bg-primary:after {
	border-top:1px solid #7367f0;
}
.divider .divider-text.custom.bg-info.bg-darken-2:before, .divider .divider-text.custom.bg-info.bg-darken-2:after {
	border-top:1px solid #00a1b5;
}
.divider .divider-text.custom.bg-warning:before, .divider .divider-text.custom.bg-warning:after {
	border-top:1px solid #ff9f43;
}
.divider .divider-text.custom.bg-danger:before, .divider .divider-text.custom.bg-danger:after {
	border-top:1px solid #ea5455;
}
.divider .divider-text.custom.bg-danger:before, .divider .divider-text.custom.bg-danger:after {
	border-top:1px solid #ea5455;
}
.classes {
	width: 85px;
    height: 85px;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 50%;
	color:#7367f0 !important;
	font-size:1.2rem;
	font-weight:bold;
	flex-direction:column;
	border: 0 !important;
    box-shadow: -2px 2px 18px 1px rgb(0,0,0,0.15) inset !important;
}
.classes .default {
	margin-top:10px;
}
.classes.active {
	background-color:#7367f0 !important;
	color:#fff !important;
	box-shadow: -2px 2px 18px 1px rgb(255,255,255,0.15) inset !important;
}

/* Class CSS */
ul.value_filters {
  margin: 0;
  padding: 0;
}
ul.value_filters li {
  display: inline-block;
  width: 50px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  height: 22px;
  padding: 0px 2px;
}
ul.value_filters li .checkbox {
height:22px;
}
ul.value_filters li .checkbox label {
white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* Receipt generation CSS */
#basic-list-group .list-group-item, #multiple-list-group-a .list-group-item, #multiple-list-group-b .list-group-item, #multiple-list-group-c .list-group-item, #multiple-list-group-d .list-group-item, #multiple-list-group-e .list-group-item, #multiple-list-group-f .list-group-item, #multiple-list-group-g .list-group-item, #multiple-list-group-h .list-group-item, #multiple-list-group-i .list-group-item, #multiple-list-group-j .list-group-item, #multiple-list-group-k .list-group-item, #multiple-list-group-l .list-group-item {
	cursor: grab;
    background-color: #f5f5f5 !important;
}
#multiple-list-group-c, #multiple-list-group-d, #multiple-list-group-e, #multiple-list-group-f, #multiple-list-group-g, #multiple-list-group-h, #multiple-list-group-i, #multiple-list-group-j,  #multiple-list-group-k,  #multiple-list-group-l, #multiple-list-group-m, #multiple-list-group-n {
	min-height:1rem;
}

/* Student View CSS */
.student-info-tab .nav-link {
	padding:1rem;
}
.sp5 {
	padding:5px 10px;
}

/* Teacher View CSS */
.teacher-info-tab .nav-link {
	padding:1rem;
	color:#fff;
}
.teacher-info-tab .nav-link:after {
	background:#ff9f43 !important;
}
.teacher-info-tab .nav-link.active {
	color:#fff !important;
}
.section-defnition .nav-tabs .nav-link.active {
	border:1px solid;
}
.section-defnition .nav-tabs .nav-link {
    border-width: 1px;
    border-style: solid;
    border-left: none;
    border-color: #ededed;
}

/* Parent Portal Css */
.card-hover:hover {
	box-shadow: 0 10px 20px rgba(0,0,0,.20), 0 4px 8px rgba(0,0,0,.20);
}
.blink {
	animation: 1s linear infinite blink_effect;
    border: 1px solid #ea5455;
	border-radius: 0.25rem;
    padding: 4px 8px;
}
@keyframes blink_effect {
  0% {
    visibility: hidden;
  }
  50% {
    visibility: hidden;
  }
  100% {
    visibility: visible;
  }
}
.card-right-content {
	width: calc(100% - 45px);
}
.card-right-content h5 {
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
    padding-left: 10px;
}
.mb-5px {
	margin-bottom:5px;
}
.subject-legend {	
	margin-right:14px;
	border-right:1px dotted #888888;
	padding-right:14px;
	font-weight:500;
}
.legend .subject-legend:last-child {
	border-right:none;
}
.subject-legend span:first-child {
	margin-right:8px;
}
.subject-legend .one{
	width:16px;
	height:16px;
	background:#3b4d61;
}
.subject-legend .two{
	width:16px;
	height:16px;
	background:#8a307f;
}
.subject-legend .three{
	width:16px;
	height:16px;
	background:#f99b1f;
}
.subject-legend .four{
	width:16px;
	height:16px;
	background:#61b146;
}
.subject-legend .five{
	width:16px;
	height:16px;
	background:#7a2048;
}
.teacher {
	display:flex;
	align-items:center;
    font-style: italic;
	font-weight:200;
}
.notes-wrapper {
	transform: translate(0,0);
    max-height: 300px;
    overflow: auto;
}
.notes-wrapper .notes {
	margin-bottom: 10px;
}
.notes-wrapper .notes::after {
    display: block;
    clear: both;
    content: "";
}
.notes-wrapper .notes, .notes-wrapper .notes-msg {
	display: block;
}
.notes-wrapper .notes .notes-info {
	display: flex;
	align-items:center;
	justify-content:space-between;
    font-size: 0.8rem;
    margin-bottom: 2px;
}
.notes-wrapper .notes .notes-img {
	float: left;
    height: 40px;
    width: 40px;
}
.notes-wrapper .notes .notes-msg {
	border-radius: 0.3rem;
    background-color: #d2d6de;
    border: 1px solid #d2d6de;
	color: #444;
    margin: 5px 0 0 50px;
    padding: 5px 10px;
    position: relative;
}
.notes-wrapper .notes .notes-msg::after, .notes-wrapper .notes .notes-msg::before {
    border: solid transparent;
    border-right-color: #d2d6de;
    content: " ";
    height: 0;
    pointer-events: none;
    position: absolute;
    right: 100%;
    top: 15px;
    width: 0;
}
.notes-wrapper .notes .notes-msg::before {
    border-width: 6px;
    margin-top: -6px;
}
.notes-wrapper .notes .notes-msg::after {
    border-width: 5px;
    margin-top: -5px;
}
.notes-wrapper .notes.right .notes-img {
	float:right;
}
.notes-wrapper .notes.right .notes-msg {
	background-color: #40b7ad;
    border-color: #40b7ad;
    color: #fff;
	margin-left: 0;
    margin-right: 50px;
}
.notes-wrapper .notes.right .notes-msg::after, .notes-wrapper .notes.right .notes-msg::before { 
	border-left-color: #40b7ad;
	border-right-color: transparent;
    left: 100%;
    right: auto;
}
.news-bg {
	min-height:250px;
	height:auto;
	position:relative;
}
.carousel .news-bg {
	background-image:linear-gradient(to bottom, #6dd5ed, #2193b0);
}
.sy-subject {
	font-weight:bold;
	color:#fff;
	padding:6px 12px;
	border-radius:4px;
	white-space:nowrap;
}
.subject-1 {
	background:#3b4d61;
}
.subject-2 {
	background:#8a307f;
}
.subject-3 {
	background:#f99b1f;
}
.subject-4 {
	background:#61b146;
}
.subject-5 {
	background:#7a2048;
}
/* Progress Card*/
.progress-card {
	border:2px solid #218fce;
}
.progress-card-header {	
	background:#218fce;
	padding:6px;
}
.school-logo {
	background:#fff;
	padding:6px
}
.school-logo img {
	width:100%;
}
.school-name {
	font-size:20px;
	font-weight:bold;
	color:#fff;
	padding:6px
}
.exam-name {
	background:#fcf083;
	color:#333;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	padding:4px;
	border-radius:30px 0 0 30px;
}
.progress-card-title {
	background:#fff;
	padding:6px;
}
.aca-year {
	background:#fcf083;
	color:#333;
	border-radius:0 30px 30px 0;
	padding:4px;
	text-align:center;
}
.progress-title {
	background:#218fce;
	color:#fff;
	border-radius:30px 0 0 30px;
	padding:4px;
	text-align:center;
	text-transform:uppercase;
	font-weight:bold;
}
.student-info {
	background:#fff;
	padding:0 6px;
	font-size:12px;
}
.student-basic-info label {
	margin-bottom:0;
	color:#333;
	font-weight:bold;
}
.student-basic-info .form-control {
	background:#fcf083;
	color:#333;
	text-transform:uppercase;
	font-weight:bold;
	height:30px;
	margin-bottom:6px;
	font-size:12px;
}
.student-pic {
	background:#f2f2f2;
	padding:6px;
	max-height:100px;
}
.student-pic img{
	width:100%;
	height:100%;
}
.student-marks-info {
	background:#218fce;
	padding:10px 6px;
}
.student-marks-chart {
	background:#fcf083;
	padding:6px;
}
.signatures {
	background:#fff;
	padding:6px;
}
.signature-box {
	text-align:Center
}
.signature-img {
	height:100px;
	max-width:100%;
}
.signature-holder {
	border-top:1px dashed #333;
	color:#333;
	font-size:12px;
	font-weight:bold;
	padding-top:6px;
}
.instruction-title {
	background:#218fce;
	margin-bottom:4px;
	padding:4px;
	color:#fff;
	font-weight:bold;
	text-transform:uppercase;
	text-align:center;
}
.grade-area {
	padding:6px;
}
.grade {
	position:relative;
	border-radius:0 30px 30px 0;
	text-align:center;
	color:#fff;
	font-size:12px;
	font-weight:bold;
	margin-bottom:6px;
	padding:4px 1px;
	height:32px;
	line-height:24px;
}
.grade-right {
	position:absolute;
	right:1px;
	top:1px;
	border-radius:50%;
	background:#fff;
	width:30px;
	height:30px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.grade-1 {
	background:#49a144;
}
.grade-1 .grade-right {
	color:#49a144;
}
.grade-2 {
	background:#70a740;
}
.grade-2 .grade-right {
	color:#70a740;
}
.grade-3 {
	background:#c3a133;
}
.grade-3 .grade-right {
	color:#c3a133;
}
.grade-4 {
	background:#45bcaa;
}
.grade-4 .grade-right {
	color:#45bcaa;
}
.grade-5 {
	background:#0d7698;
}
.grade-5 .grade-right {
	color:#0d7698;
}
.grade-6 {
	background:#f0c833;
}
.grade-6 .grade-right {
	color:#f0c833;
}
.grade-7 {
	background:#eb6b20;
}
.grade-7 .grade-right {
	color:#eb6b20;
}
.grade-8 {
	background:#f13d41;
}
.grade-8 .grade-right {
	color:#f13d41;
}
.coscholastic-area {
	padding:6px;
}
.grade-legend {
	display:flex;
	align-items:center;
	text-transform:uppercase;
	font-size:12px;
	margin-bottom:6px;
}
.progress-legend {
	color:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	border-radius:50%;
	margin-right:6px;
}
.legend-1 {
	background:#40a44d;
}
.legend-2 {
	background:#c3a63f;
}
.legend-3 {
	background:#eed01d;
}
.legend-4 {
	background:#ec6e1a;
}
.legend-5 {
	background:#f63e43;
}
/*Home Page New Carousel Indictors */
.home #carouselExampleCaptions li {
	background-color:rgba(0,0,0,0.3);
}
.home #carouselExampleCaptions li.active {
	background-color:#000;
}

@media screen and (max-width: 768px) {
	.subject-legend {
	width: 38%;
    margin-bottom: 10px;	
	}
}