/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,300&family=Montserrat&display=swap'); */
/*======================================
		DEFAULT THEME
========================================*/

/*---  FONT STYLES ---*/

@font-face {
   font-family: 'Material Icons';
   font-style: normal;
   font-weight: 400;
   src: url(https://nlpkube2.nexterp.in/nlp/fonts/material/MaterialIcons-Regular.eot); /* For IE6-8 */
   src: local('Material Icons'), 
        local('MaterialIcons-Regular'),
        url(https://nlpkube2.nexterp.in/nlp/fonts/material/MaterialIcons-Regular.woff2) format('woff2'),
        url(https://nlpkube2.nexterp.in/nlp/fonts/material/MaterialIcons-Regular.woff) format('woff'),
        url(https://nlpkube2.nexterp.in/nlp/fonts/material/MaterialIcons-Regular.ttf) format('truetype');
}
/* @font-face {
  font-family: 'TraditionalArabic';
  src: url('https://nlpkube1.nexterp.in/nlp/fonts/traditional/TraditionalArabic.eot');
  src: url('https://nlpkube1.nexterp.in/nlp/fonts/traditional/TraditionalArabic.ttf');
   src: url('https://nlpkube1.nexterp.in/nlp/fonts/traditional/TraditionalArabic.svg');
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/traditional/TraditionalArabic.woff');
  font-weight: normal;
  font-style: normal;
} */
@font-face {
  font-family: "TraditionalArabic";
  src: url("https://nlpkube2.nexterp.in/nlp/fonts/traditional/trado.eot"); /* IE9 Compat Modes */
  src: url("https://nlpkube1.nexterp.in/nlp/fonts/traditional/trado.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */    
    url("https://nlpkube2.nexterp.in/nlp/fonts/traditional/trado.woff") format("woff"), /* Modern Browsers */
    url("https://nlpkube2.nexterp.in/nlp/fonts/traditional/trado.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}
@font-face {
    font-family: 'latomedium';
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/lato/lato-medium-webfont.eot');
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/lato/lato-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/lato/lato-medium-webfont.woff2') format('woff2'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/lato/lato-medium-webfont.woff') format('woff'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/lato/lato-medium-webfont.ttf') format('truetype'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/lato/lato-medium-webfont.svg#latomedium') format('svg');
    font-weight: '500';
    font-style: normal;

}

@font-face {
    font-family: 'googlesans';
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/googlesans/google-sans-regular.eot');
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/googlesans/google-sans-regular.eot?#iefix') format('embedded-opentype'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/googlesans/google-sans-regular.woff2') format('woff2'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/googlesans/google-sans-regular.woff') format('woff'),
         url('https://nlpkube1.nexterp.in/nlp/fonts/googlesans/google-sans-regular.ttf') format('truetype');
    font-weight: '500';
    font-style: normal;

}
@font-face {
    font-family: 'Outfit';
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Light.eot?#iefix') format('embedded-opentype'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Light.woff') format('woff'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Light.ttf') format('truetype'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Light.svg#') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Regular.eot?#iefix') format('embedded-opentype'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Regular.woff') format('woff'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Regular.ttf') format('truetype'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Regular.svg#') format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Medium.eot?#iefix') format('embedded-opentype'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Medium.woff') format('woff'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Medium.ttf') format('truetype'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Medium.svg#') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-SemiBold.eot?#iefix') format('embedded-opentype'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-SemiBold.woff') format('woff'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-SemiBold.ttf') format('truetype'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-SemiBold.svg#') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Bold.eot?#iefix') format('embedded-opentype'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Bold.woff') format('woff'), url('https://nlpkube1.nexterp.in/nlp/fonts/outfit/Outfit-Bold.ttf') format('truetype'), url('https://nlpkube2.nexterp.in/nlp/fonts/outfit/Outfit-Bold.svg#') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Storybook';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/storybook/Storybook.eot?#iefix') format('embedded-opentype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/storybook/Storybook.ttf') format('truetype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/storybook/Storybook.woff') format('woff'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/storybook/Storybook.svg#Storybook') format('svg');
    font-weight: 100;
    font-style: normal;
} 

@font-face {
    font-family: 'Garamond';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/garamond/Garamond.eot?#iefix') format('embedded-opentype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/garamond/Garamond.ttf') format('truetype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/garamond/Garamond.woff') format('woff'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/garamond/Garamond.svg#Storybook') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Mangal';
    src: url('https://nlpkube1.nexterp.in/nlp/fonts/mangal/Mangal-Regular.eot?#iefix') format('embedded-opentype'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/mangal/Mangal-Regular.woff2') format('woff2'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/mangal/Mangal-Regular.woff') format('woff'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/mangal/Mangal-Regular.ttf') format('truetype'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/mangal/Mangal-Regular.svg#Mangal-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Impact';
    src: url('https://nlpkube2.nexterp.in/nlp/fonts/impact/Impact.eot?#iefix') format('embedded-opentype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/impact/Impact.ttf') format('truetype'),
        url('https://nlpkube1.nexterp.in/nlp/fonts/impact/Impact.woff') format('woff'),
        url('https://nlpkube2.nexterp.in/nlp/fonts/impact/Impact.svg#Impact') format('svg');
    font-weight: normal;
    font-style: normal;
}
:root {
    --mainbg: #F2F3F3;          /* Using same variable for backgrounds*/
  --green-text: #1973E8;
  --orange-color: #FF8000;
  --light-orange: #FC9821;
  --active-blue-color: #1D9FD9;
  --light-grey: #737373;
  --legend-border: #CACACA;
  --black-text: #12344d;   /* #37474F */
  --lightgrey: rgba(0,0,0,0.56);
  --yellow-bg: #FFD32F;
  --blue-color: #2680EB;
  --lighten-grey: #707070;
  --white-color: #ffffff;       /* removed from TWS*/
  --red-btn-color: #FC4500;
  --blackText: #000000;         /* removed from TWS*/
  --tablehead-text: #455A64;
  --shadow-container: 0 1px 1px 0 rgba(0, 28, 36, .3), 1px 1px 1px 0 rgba(0, 28, 36, .15), -1px 1px 1px 0 rgba(0, 28, 36, .15);
  
  --light-black-text: rgba(0,0,0,.87);
  
  --primarybgcolorlight: 0, 122, 255;

  /* --primarybgcolorlight14 : rgba(0, 122, 255, 0.078);
  --primarybgcolorlight29 : rgba(0, 122, 255, 0.161);
  --primarybgcolorlight50 : rgba(0, 122, 255, 0.314);
  --primarybgcolorlight08 : rgba(0, 122, 255, 0.031); */
  --lightgraybgcolor : #fafafa;
  --iconcolor : #5b5b5b;
  
  --pace-student-bg : #8bd582;
  --pace-staff-bg : #ffce37;
  --pace-parent-bg : #7a96ab;
  --error-color: #dd2c00;
  
  --header-color: #fafafb;
  --list-hover: rgb(0 122 255/0.07);
  --border-color: #c5c5c7;
  --active-hover: 25, 115, 232;

  /* Arabic font sizes */ 
  --ar_fontsizebody: 16px;        /* Default body font size */
  --ar_fontsizelabel:18px;        /* Small headings font size */
  --ar_fontsizeheading:20px;      /* Headings font size */
  --ar_fontsizemainheading:22px;  /* MainHeadings font size */
  --default-fontsize: 14px;       /* Default body font size */
  --default-font14: 14px;       /* Default body font size */
  
  /* Theme Concept */
  /* background colors */
	--primarybgcolor: #1973E8; /* #81B214 */
	--primary-bg-color: #1973E8; /* #81B214 */
	--secondary-bg-color:#ffffff;
	--trinity-bg-color:#000000;
	
	/* Text Colors */
	--primary-text-color: #12344d; /*  #37474F */
	--secondary-text-color:#ffffff;
	--trinity-text-color:#1973E8;
  
	/*====== NLP 3.0 New Colors Starts: ======*/
	/* Bg Colors */
	--asidemenubg: #262E39;
	--asidemenubgprimarycolor: #000000;
	--asidemenubgsecondarycolor: #ffffff; 
	--asidestripbg:#262E39;
	
	/* Text Colors */
	--asidemenutextdefaultcolor: #bfc5ce;
	--asidemenutextprimarycolor: #000000;	
	--asidemenutextsecondarycolor: #ffffff;
	
	/* Borders, Heading,Active BG */
	--moduleheadingbg:#38414D;
	--asidemenuactive:#3F4E64;	
	--asidemenuactivetext:#ffffff;	
	--asidemenuprimarybordercolor:#172230;
	--asidemenusecondarybordercolor:#5A6570;
	--asidemenucurrnt:#FFFFFF;
	--asidetooltipbg:#222A36;
	--layer:transparent;
	/*====== NLP 3.0 New Colors Ends: ======*/		
}


/*---  NORMAL STYLES ---*/

.translate-cloak .content_area_wrapper,
.translate-cloak .md-open-menu-container,
.translate-cloak .md-dialog-container,
.translate-cloak md-backdrop,
.translate-cloak .breadcrumb  {
	display: none !important;
}

.material-icons {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;  /* Preferred icon size */
      display: inline-block;
      line-height: 1;
      text-transform: none;
      letter-spacing: normal;
      word-wrap: normal;
      white-space: nowrap;
      direction: ltr;

      /* Support for all WebKit browsers. */
      -webkit-font-smoothing: antialiased;
      /* Support for Safari and Chrome. */
      text-rendering: optimizeLegibility;

      /* Support for Firefox. */
      -moz-osx-font-smoothing: grayscale;

      /* Support for IE. */
      font-feature-settings: 'liga';
}
/* material icons outlined css */
@font-face {
  font-family: 'Material Icons Outlined';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialiconsoutlined/v90/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUce.woff2) format('woff2');
}
.material-icons-outlined {
  font-family: 'Material Icons Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* material symbols outlined css */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 100 700;
  src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v74/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format('woff2');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
}


.profile_inner {
    color: var(--secondary-text-color);
    border-radius: 50%;
    font-size: 15px;
    font-weight: 600;
    height: 36px;
    line-height: 30px; 
    text-align: center;
    width: 36px;
    border: 2px solid transparent;
    box-sizing: border-box;
    text-transform: uppercase;
    background-color: var(--primary-bg-color);
}
html[lang="ar"] .profile_inner {
    line-height: 36px;
}

* {
    outline: none !important;
}
body,
html {
    overflow: hidden;
}
html[lang="en"],
html[lang="en"] body {
  font-family: Outfit, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

html[lang="en"] body {
    font-size: var(--default-font14);	
}

body {
	font-family: Outfit, sans-serif;
    font-weight: 400;
    color: var(--primary-text-color);
    background: var(--secondary-bg-color) none repeat scroll 0 0; 
}
pre {
    /* font-family: 'Lato', sans-serif; */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Lato, Cantarell, "Helvetica Neue", sans-serif;
    margin: 0;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    word-break: break-all;
}
.font-arabic input,
.font-arabic textarea {
	font-family: 'TraditionalArabic', serif !important;
	direction: rtl;
	font-weight: 600;
}
::-webkit-input-placeholder {
    text-transform: capitalize;
}
::-moz-placeholder {
    text-transform: capitalize;
}
:-ms-input-placeholder {
    text-transform: capitalize;
}
:-moz-placeholder {
    text-transform: capitalize;
}
.placeholder ::-webkit-input-placeholder{
	text-transform: none;
}
.placeholder ::-moz-placeholder {
	text-transform: none;
}
.placeholder :-ms-input-placeholder {
	text-transform: none;
}
.placeholder :-moz-placeholder {
	text-transform: none;
}
/* added for NLP scroll bar */
.hideDoubleScroll .niceScroll {
    overflow: auto !important;
}

.loader-block {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
}
.loader-block img {
	width: 90px;
}
.md_tab_transport_options .md-tab {
	padding:13px 0px !important;
}
.md_tab_transport_options .md-tab span {
	padding: 17px 24px !important;
}
/* Menu settings */
.menu-settings {
    width: 350px;
    min-height: calc(100vh - 61px);
    max-height: inherit;
    position: fixed;
    right: -110%;
    top: 61px;
    background-color: var(--secondary-bg-color);
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
    box-shadow: -5px 10px 15px rgb(0 0 0 / 14%);
    height: calc(100vh - 61px);
}
.menu-settings md-list {
    overflow: auto;
    overflow: auto;
    height: calc(100% - 112px);
    max-height: calc(100% - 112px);
}
.menu-settings md-list md-list-item {
    padding: 0;
    min-height: 44px;
}
.menu-settings md-list-item .md-list-item-inner:before, .menu-settings md-list-item:before {
    display:none;
}
/* .menu-settings::before {
    content: "";
    position: absolute;
    right: 34px;
    top: -9px;
    width: 16px;
    height: 16px;
    background-color: var(--secondary-bg-color);
    border: solid 1px #ebebeb;
    border-bottom: 0;
    border-right: 0;
    transform: rotate(45deg);
    z-index: -1;
} */
/* Theme Notification Ends */

/* Live Reports Dialog Starts */
.tsReportsDialog {
	max-width: 80%;
	min-width: 80%;
	max-height: 80%;
	min-height: 80%;
}
.tsReportsDialog.customDialog .md-toolbar-tools {
	border-bottom: solid 1px rgba(0, 0, 0, 0.12);
    min-height: 52px;
}
.tsReportsDialog.customDialog .md-toolbar-tools h2 {
	 font-size: var(--default-font14);
	 font-weight: 500;
}
.tsReportsHeader {
	min-height: 48px;
    font-weight: bold;
    font-size: var(--default-fontsize);
    padding: 0 24px;
    box-shadow: 0px 3px 6px rgb(0 0 0 / 29%);
    position: relative;
    background-color: var(--secondary-bg-color);
}
.tsReportsItem {
    padding: 0 16px;
    min-height: 48px;
    background-color: var(--secondary-bg-color);
    margin: 2px 0;
}
.tsReportsDialog md-dialog-content {
    background-color: var(--mainbg);
} 
.tsReportsContent {
    overflow: auto;
    overflow-y: overlay;
    padding: 0 8px;
}
.tsReportsDialog .md-button.goToExams {
	margin: 0 0 0 10px;
    border: solid 1px var(--primary-bg-color);
    min-height: 30px;
    line-height: 30px;
    color: var(--trinity-text-color);
    text-transform: capitalize;
}
.tsReportsDialog .md-button.goToExams md-icon {
    margin-right: 3px;
    color: unset !important;
}
.tsReportsDialog .md-button.goToExams[disabled] {
    border-color: #bfc5ce;
    color: #bfc5ce;
}
.tsReportsItem .grey-text {
    margin-top: 2px;
}
.tsReportsItem .proctoringButton {
	margin: 0 0 0 10px;
	width:40px; 
	display: inline-block;
}
.tsStatus {
    padding: 5px;
    font-size: 12px;
    border-radius: 4px;
    min-width: 70px;
    text-align: center;
}
.tsStatus.tscompleted {
    color: #FF6868;
    background: #FFE9E9;
}
.tsStatus.tspending {
    background: #ECFFF6;
    color: #029F50;
}
.tsrMobileContent {
	display: none;	
} 
.tsReportsDialog.customDialog md-dialog-actions .md-button {
	text-transform: capitalize;
}
.mandate-exam {
	background: #0FBFFF !important;
}
.group-exam{
	background: #FA937F !important;
}
.scholastic-exam{
	background: #9FABE4 !important;
}
.co-scholastic-exam{
	background: #2E5D9E !important;
}
.miss-config-exam{
	background: #EF6191 !important;
}
/* Live Reports Dialog Ends */

/* Rubrics evaluation dialog */
md-dialog.rubicsEvaluationDialog {
	min-width: calc(100% - 124px);
    height: calc(100% - 124px);
    max-height: calc(100% - 124px);
    color: black;
} 
md-dialog.rubicsEvaluationDialog md-toolbar .md-toolbar-tools {
    border: none;
    padding: 0 20px 0 24px;
}
md-dialog.rubicsEvaluationDialog md-toolbar .md-toolbar-tools h2 {
    font-size: 16px !important;
}
md-dialog.rubicsEvaluationDialog md-dialog-content {
    padding: 0 0 0 24px;
}
.rubicsEvaluationTableHeader {
    min-height: 40px;
    background-color: #EFF2F5;
    border-radius: 6px;
    padding: 0 16px;
    font-weight: 700;
    margin-right: 24px;
    margin-bottom: 4px;
    margin-top: 24px;
}
.rubicsEvaluationContent {
	padding-right: 24px;
	overflow: auto;
	overflow-y: overlay;	
	scrollbar-width: thin;
} 
.rubicsEvaluationItem {
    padding: 15px 16px;
    border: 1px solid #CDD7E2;
    border-radius: 6px;
    margin: 4px 0;
} 
.rubicsEvaluationItemTop .flex-15 {
    max-height: 36px;
}
.reAccordionDiv {
    width: 24px;
    display: inline-block;
}
.md-button.erAccordionButton {
    width: 24px;
    height: 24px;
    min-height: 24px;
    background-color: #EFF2F5 !important;
    padding: 0;
    color: #677986;
    margin: 8px 0 0 0;
}
.md-button.erAccordionButton md-icon {
    color: unset;
    font-size: 18px;
    height: 18px;
    min-height: 18px;
    width: 18px;
    min-width: 18px;
}
.rubicsEvaluationPerformance {
    margin: 12px 0 0 8px;
}
.rePerformanceLevel {
    background-color: var(--secondary-bg-color);
    box-shadow: 0px 3px 6px #B4C2D314;
    border: 1px solid #CDD7E2;
    border-radius: 6px;
    padding: 12px;
    max-width: 220px;
    min-width: 220px;
    font-weight: 600;
    font-size: var(--default-fontsize);
    margin: 8px 8px 0 0;
    cursor: pointer;
    overflow: hidden;
    position: relative;
}
md-icon.selectevaluationRubicsCheck {
    width: 16px;
    height: 16px;
    background-color: #CACACA;
    border-radius: 20px;
    margin: 0 12px 0 0;
    color: green;
    font-size: 0;
    min-width: 16px;
    min-height: 16px;
}
.rubicsPerformanceText {
    font-weight: normal;
    font-size: 12px;
    margin-top: 4px;
}
.rubicsEvaluationItemTop {
    font-size: var(--default-font14);
}
.rubicsEvaluationItemTop p {
    font-size: var(--default-fontsize);
}
.rePerformanceLevel.selected {
    border-color: var(--primary-bg-color);
    background-color: rgb(0 122 255 / 8%);
}
.rePerformanceLevel.selected md-icon.selectevaluationRubicsCheck {
    background-color: var(--primary-bg-color);
    color: white;
    font-size: 16px;
    animation: selectEvaluationRubicsIcon 0.3s;
    -webkit-animation: selectEvaluationRubicsIcon 0.3s;
}
@keyframes selectEvaluationRubicsIcon { 0% { font-size:0; } 100% { font-size: 16px; } }
@-webkit-keyframes selectEvaluationRubicsIcon { 0% { font-size:0; } 100% { font-size: 16px; } }
.rubricsTableIndex {
    min-width: 16px;
    padding-right: 4px;
    box-sizing: border-box;
    color: #737373;
}
.rubicsEvaluationItem input {
    border: 1px solid #CACACA;
    border-radius: 8px;
    width: 90px;
    height: 32px;
    max-height: 32px;
    line-height: 32px;
    box-sizing: border-box;
    padding: 0 0 0 12px;
    font-weight: 700;
    font-size: var(--default-fontsize);
}
.rubicsEvaluationFooter {
    border-radius: 6px;
    background-color: #F0F6E2;
    margin-right: 24px;
    font-weight: 700; 
    border: 1px solid #EFF2F5;
	padding: 5px 16px;
	font-size: var(--default-font14);
}
.rubricsTotal {
    background-color: #E1EBC9;
    width: 90px;
    height: 36px;
    border-radius: 8px;
    place-content: flex-start;
    padding: 0 12px;
}
/* Rubrics Arabic */
html[lang="ar"] md-dialog.rubicsEvaluationDialog md-dialog-content {
    padding: 0 24px 0 0
} 
html[lang="ar"] {
	margin-right: 0;
    margin-left: 24px;
}
html[lang="ar"] .rubicsEvaluationContent {
	padding-right: 0;
    padding-left: 24px;
}
html[lang="ar"] .rubicsEvaluationItem input {
	padding: 0 12px 0 0;
}
html[lang="ar"] .rubicsEvaluationPerformance {
	margin-right: 8px;
    margin-left: 0;
}
html[lang="ar"] md-icon.selectevaluationRubicsCheck {
    margin-right: 0;
    margin-left: 12px;
}
html[lang="ar"] .rubicsEvaluationTableHeader {
	margin-left: 24px;
	margin-right: 0;
}
html[lang="ar"] .rubicsEvaluationFooter {
	margin-left: 24px;
	margin-right: 0;
}
/*========= Rubrics Ends =========*/

/*========= Rubrics Sidebar Starts =========*/
.rubricSidebar {
    position: absolute;
    right: -500px;
    top: 0;
    z-index: 22;
    background-color: var(--secondary-bg-color);
    padding: 1px;
    height: 100%;
    width: 450px;
    transition: ease-in-out all 0.3s;
    -webkit-transition: ease-in-out all 0.3s;
    border-left: 1px solid #E5E5E5;
}
.rubricSidebar.isOpenRubricSidebar {
	right: 0;
}
.rubricSidebarBg {
    background-color: #d0e8f6;
    border-radius: 6px;
    margin: 13px;
    margin-right: 16px;
}
.rubricSidebar p {
	color: #212121;
}
.rubricSidebarHeader {
    min-height: 48px;
    padding: 4px 16px;
    padding-right: 12px;
}
.rubricSidebarHeader h2 {
    font-size: 16px;
}
.rubricSidebarContainer {
    padding: 16px;
    padding-top: 0;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #D0E8F6;
    scrollbar-color: #918d8d #D0E8F6;
}
.rubricSidebarContainer::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.rubricSidebarContainer::-webkit-scrollbar-thumb {
    background-color: #918d8d;
    border-radius: 8px;
}
.rubricSidebarTop h3 {
    font-size: 16px;
}
.rubricSidebarTop p {
    font-size: 12px;
    margin-top: 5px;
}
.rubricSidebarListItem {
    box-shadow: 0px 3px 6px #B4C2D314;
    border: 1px solid #CDD7E2;
    border-radius: 6px;
    background-color: var(--secondary-bg-color);
    padding: 12px;
    margin-top: 8px;    
}
.rubricSidebarListItem h4 {
    margin-bottom: 4px;
}
.rubricSidebarTable {
    margin: 12px 0;
    font-weight: bold;
    font-size: var(--default-font14);
}
.rubricSidebarTableHeader {
    margin-bottom: 8px;
}
.rubricsSidebarLevel {
    font-weight: bold;
    font-size: 12px;
}
.rubricSidebarTableData input {
    border: 1px solid #CACACA;
    border-radius: 8px;
    height: 36px;
    width: 90px;
    padding: 0 0 0 12px;
    box-sizing: border-box;
}
.md-button.rubricsSidebarLevelButton {
    width: 24px;
    height: 24px;
    padding: 0;
    min-height: 24px;
    background-color: #EFF2F5 !important;
    font-size: 16px;
    margin-left: 8px;
}
.md-button.rubricsSidebarLevelButton md-icon {
    font-size: 16px;
    width: 16px;
    min-width: 16px;
    min-height: 16px;
    height: 16px;
    line-height: 16px;
    color: var(--black-text);
}
.rubricsSidebarLevelItem.selected {
    border-color: var(--primary-bg-color);
}
.rubricsSidebarLevelItem.selected md-icon {
    background-color: var(--primary-bg-color);
    color: white;
    font-size: 16px;
    animation: selectEvaluationRubicsIcon 0.3s;
    -webkit-animation: selectEvaluationRubicsIcon 0.3s;
}
.rubricsSidebarLevelItem {
    box-shadow: 0px 3px 6px #B4C2D314;
    border: 1px solid #CDD7E2;
    border-radius: 6px;
    margin-top: 8px;
    padding: 12px;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
}
.rubricsSidebarLevelItem h5 {
    font-size: var(--default-fontsize);
    margin-bottom: 4px;
}
.rubricsSidebarLevelItem p {
    font-weight: normal;
}
.rubricsSidebarLevel {
    font-weight: bold;
    font-size: 12px;
}
.rubricSidebarFooter {
    padding: 12px 16px 6px 16px;
    font-weight: bold;
    font-size: var(--default-font14);
    box-shadow: 0px -3px 6px #899CB260;
    border-radius: 0px 0px 6px 6px;
    background-color: #F0F6E2;
}
.rubricsStudentTotalScore {
    width: 90px;
    height: 36px;
    background-color: #E1EBC9;
    border-radius: 8px;
    line-height: 36px;
    padding: 0 0 0 12px;
    box-sizing: border-box;
    margin-top: 4px;
}
.rubricSidebarFooterBottom .md-button {
    text-transform: capitalize;
    color: black;
    margin-top: 0;
    margin-bottom: 0;
    min-width: 60px;
    background-color: transparent !important;
}
.md-toast-content .md-primary.md-button.customBtn {
    /* background: var(--green-text); */
    text-transform: capitalize;
    margin-right: 10px;
    height: 28px;
    min-height: 28px;
    line-height: 28px;
    font-weight: 500;
    color:var(--primary-bg-color);
}
.md-toast-content .md-primary.md-button.customBtn:hover{
  background:none !important;	
}
/*========= Rubrics Sidebar Ends =========*/
.md-custom-tooltip .md-content {
    color: var(--secondary-text-color);
    background: var(--trinity-bg-color) !important;
    max-width: 360px;
    white-space: normal;
    padding: 10px;
    box-shadow: 0px 2px 10px #00000033;
    font-weight: normal;
    box-sizing: border-box;
    font-size: 12px;
}
.break-all {
	word-break: break-all;
}
/* Reports Header Starts */
.reportTitledesc {
    padding: 51px 0 0px 67px;
}
.reportTitledesc h2 {
    font-size: 16px;
    font-weight: 700;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    color: var(--black-text);
}
.reportTitledesc p {
    font-size: var(--default-fontsize);
    color: #8A8A8E;
    text-transform: none;
    font-weight: 500;
}
.reportsHeaderSpace {
    margin-top: 61px !important;
}
.isStudent .footerMain {
    display: block;
}
.coachingcenterLogin .content_area_wrapper md-toolbar.md-header-cust, 
.coachingcenterLogin .lmsbody md-toolbar.lmsheader, 
.coachingcenterLogin .lmsbody .header-nav-band,
body.topSearchForNLP .content_area_wrapper .coachingcenterLogin md-toolbar.md-header-cust,
body .coachingcenterLogin md-toolbar.md-header-cust {
    width: 100%;
    background-color: var(--header-color) !important;
}
.coachingcenterLogin .enhanced-table md-table-pagination {
    width: 100%;
}
/* Reports Header Ends */

/* Session Alert Message Starts */
.sessionAlert {
    position: fixed;
    right: 150px;
    margin: auto;
    z-index: 21;
    top: 0;
    width: 95px;
}
button.md-button.sessionAlertButton {
    padding: 0 8px;
    line-height: 20px;
    min-height: 20px;
    margin: 0;
    border-radius: 0;
    background-color: #fcc552 !important;
    overflow: unset;
    text-transform: capitalize;
    font-size: 12px;
    height: 20px;
    position: relative;
    top: 0;
    display: flex;
    align-items: center;
    place-content: center;
    min-width: 95px;
}
button.md-button.sessionAlertButton md-icon {
    margin: 0 2px 0 0px;
    height: 16px;
    width: 16px;
    min-height: 16px;
    min-width: 16px;
}
.sessionAlertBlock {
   position: fixed;
   right: 150px;
   width: 480px;
   font-size: var(--default-fontsize);
   line-height: 16px;
   background-color: #fcc552;
   top: -100%;
   border-radius: 6px 0 6px 6px;
   padding: 4px 0 4px 6px;
   transition: ease-in-out 0.5s all;
   z-index: 1;
   border: 1px solid #e0d9c1;
   border-top: none;
   box-shadow: 0px 2px 4px #0000000F;
   min-height: 40px;
}
.sessionAlertBlock button.md-button.onSessionAlertToggle {
    margin-right: 0;
    margin: 0;
}
.sessionAlertBlockMessage {
    padding: 0 0 0 8px;
}
.sessionAlertBlockMessage a {
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}
.sessionAlertBlockMessage a:hover {
	text-decoration: none;
}
.sessionAlert.showSessionAlert .sessionAlertBlock {
    top: 20px;
} 
.commonPageInstruction{
	background: var(--header-color);
    padding: 8px 24px;
}
.commonPageInstruction p{
	font-size: 14px;
}   
/* Session Alert Message Ends */
@media only screen and (min-width: 1024px) {
	/* Chrome Style */
	.hideDoubleScroll .niceScroll::-webkit-scrollbar-thumb,
	.hideDoubleScroll md-content::-webkit-scrollbar-thumb,
	.hideDoubleScroll md-dialog-content::-webkit-scrollbar-thumb,
	.hideDoubleScroll md-menu-content::-webkit-scrollbar-thumb,
	.hideDoubleScroll .verticalScroll::-webkit-scrollbar-thumb,
	.hideDoubleScroll .niceScroll::-webkit-scrollbar-thumb {
	     background-color: #bfbfbf;
	}
	/* Firefox style */
	.hideDoubleScroll .niceScroll,
	.hideDoubleScroll md-content,
	.hideDoubleScroll md-dialog-content,
	.hideDoubleScroll md-menu-content,
	.hideDoubleScroll .verticalScroll,
	.hideDoubleScroll .niceScroll {
	    scrollbar-color: initial;
        overflow: auto !important;
        scrollbar-width: auto;
    }
} 

/* notification Menu Starts */
.notificationMenu {
    position: fixed;
    right: -370px;
    width: 310px;
    height: calc(100% - 60px);
    top: 60px;
    background-color: var(--asidemenubg);
    color: var(--asidemenubgsecondarycolor);
    box-shadow: -5px 10px 15px rgb(0 0 0 / 14%);
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
    font-weight: 500;
}
.notificationMenu::before {
    content: "";
    position: absolute;
    right: 80px;
    top: -5px;
    width: 16px;
    height: 16px;
    background-color: var(--asidemenubg);
    border-bottom: 0;
    border-right: 0;
    transform: rotate(45deg);
    z-index: -1;
    border: solid 1px var(--asidemenusecondarybordercolor);
}
.notificationMenu .nicescroll-rails div,
.notificationMenu::-webkit-scrollbar-thumb {
    background-color: #5A6570 !important;
}
.notificationMenu.toggleNotification,
.notificationMenu.toggleDiscussionFeed {
	right: 0; 
} 
/* .notificationContent .md-tab {
	font-size: var(--default-font14);
	padding-top: 0;
	text-transform: capitalize;
}
.notificationContent md-tabs-canvas,
.notificationContent md-pagination-wrapper {
	height: 30px;
} */
.notificationContent {
    background-color: var(--asidestripbg);
}
.Notificationstatus {
	width: max-content;
	padding: 0 7px;
	height: 18px;
	line-height: 18px;
	border-radius: 3px;	
	text-align: center;
	color: var(--secondary-text-color);	
	font-weight: 500;
}
.Notificationstatus.high {
	background-color: #E82E2E;
}
.Notificationstatus.medium {
	background-color: #EFAD29;
}
.Notificationstatus.low {
	background-color: #ccc;
}
.feedHeader {
	border-bottom: solid 1px var(--asidemenusecondarybordercolor);
    height: 48px;
    min-height: 48px;
    background-color: var(--moduleheadingbg);
    color: var(--asidemenubgsecondarycolor);
    padding: 0 6px 0 16px;
}
#nlpHeader md-toolbar:not(.md-menu-toolbar) .notificationMenu .feedHeader .showNotificationButton,
#nlpHeader md-toolbar:not(.md-menu-toolbar) .userNameDetails .openProfileButton {
	background-color: var(--asidemenubgsecondarycolor);
    width: 24px;
    height: 24px;
    min-height: 24px;
    color: var(--asidemenuactive);
    padding: 0;
}
.top_header_wrap .md-button.showNotificationButton[aria-label="Notification"] i,
.top_header_wrap .md-button[aria-label="Next Academy"] i {
    font-size: 24px;
}
#nlpHeader md-toolbar:not(.md-menu-toolbar) .notificationMenu .feedHeader md-icon,
#nlpHeader md-toolbar:not(.md-menu-toolbar) .userNameDetails .md-button.md-icon-button md-icon {
    color: unset !important;
    min-width: 18px;
    min-height: 18px;
    height: 18px;
    width: 18px;
    font-size: 18px;
}
.discussion-list {
	font-weight: 600;
	padding: 4px 8px;
	width: 100%;
}
.discussion-list::-webkit-scrollbar-thumb {
	background-color: var(--asidemenumodulebordercolor) !important;
}
.discussion-list ul {
    margin: 0;
    padding: 0;
    width: 100%;
}
.discussion-list ul li {
	display: inline-block;
    width: 100%;
    vertical-align: top;
    position: relative;
    border: solid 1px var(--asidemenusecondarybordercolor);
    padding: 0 6px;
    cursor: pointer;
    margin: 4px 0;
    border-radius: 6px;
    color: var(--asidemenutextsecondarycolor);
    font-size: var(--default-fontsize);
}
.discussion-list ul li p {
    color: unset;
    font-weight: 500;
}
.discussion-list ul li span {
    font-size: 11px;
    font-weight: normal;
}

.discussion-list ul li.alreadyread{
	background: #F4F7F7;
	font-weight: 500;
} 

.discriptionwidth {
	width: calc(100% - 60px);
    padding: 4px 0;
}
.clearAllButton {
	width: 100%;
    margin: 0;
    color: var(--asidemenubgprimarycolor);
    background-color: var(--asidemenubgsecondarycolor) !important;
    border-radius: 0;
    min-height: 40px;
}
#nlpHeader md-toolbar:not(.md-menu-toolbar) .clearAllButton md-icon {
    color: var(--asidemenubgprimarycolor) !important;
}
.emptyNotificationMessage img {
    width: 55px;
    height: auto;
    margin-bottom: 12px;
}
/* Select Language menu */
.selectLanguage {
	padding: 0 8px !important;
    /* padding: 0 32px 0 16px !important;   
    font-weight: 500;  */
}
.profileMenu h6 {
	color: var(--asidemenubgsecondarycolor);
    margin-bottom: 8px;
    font-size: 11px;
    text-transform: uppercase;
    margin-left: 8px;
}
.selectLanguage md-select {
	margin: 0;
    width: 100%;
    border: solid 1px var(--asidemenutextdefaultcolor);
    color: var(--asidemenutextsecondarycolor);
    border-radius: 4px;
    padding: 0 12px;
    margin-bottom: 16px;
}
.selectLanguage md-select.md-green-theme:not([disabled]):focus .md-select-value {
	color: var(--asidemenutextsecondarycolor);
	border-color: transparent !important;
}
.selectLanguage md-icon {
	margin: 0 16px 0 0 !important;
    width: 18px !important;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    line-height: 18px;
}
.selectLanguage md-select .md-select-value .md-select-icon {
    width: 20px;
    margin: 0;
    height: 20px;
    display: flex;
    align-items: center;
    place-content: center;
    padding-bottom: 2px;
    box-sizing: border-box;
    color: var(--asidemenutextdefaultcolor);
}
.int-icon{
	width: 32px;
	height: 32px;
	border-radius: 50%;
    background-color: #C86AF7;
    margin-right: 12px;
}
html[lang="ar"] .int-icon{
    margin-right: 0px;
    margin-left: 12px;
}
.int-icon i{
	font-size: 18px;
}
/* ============ Student Activation Section Starts: ============ */
.studentActivationBar {
   	position: absolute;
    top: 10px;
    right: 175px;
    z-index: 12;
    min-height: 50px;
}
.studentActivationBar .md-button {
	background-color: var(--primary-bg-color) !important;
    color: var(--secondary-text-color);
    font-weight: bold;
}
.md-button.md-icon-button md-icon{
	 color: var(--iconcolor);
}
.mdIconColorGrey{
	color: var(--iconcolor) !important;
}
/* .activationDialog md-dialog {
    max-width: 390px;
    box-sizing: border-box;
    min-width: 390px;
}
.activationDialog .activationLogo {
	max-height: 82px;
	margin: 0 auto;
	display: block;
}
.activationDialog .needHelp {
	color: #1D9FD9;	
	cursor: pointer;
	text-decoration: underline;
}
.activationDialog .md-button {
	text-transform: capitalize;
	min-width: 70px;
	font-weight: 700;
}
.activationDialog .md-button.activeButton {
	color: var(--trinity-text-color);
	font-weight: 600; 
}
.activationDialog .floatingSelect md-input-container.md-input-invalid {
	border-color: #E14843 !important;
}
.activationDialog .floatingSelect md-input-container.md-input-invalid .material-icons {
	color: #E14843 !important;
}
.activationSuccess {
    margin: 10px 0;
}
.activationSuccess md-icon {
    width: 72px;
    height: 72px;
    min-width: 72px;
    min-height: 72px;
    font-size: 60px;
    border: solid 2px var(--trinity-text-color);
    border-radius: 100%;
    line-height: 72px;
    color: var(--trinity-text-color);
    margin-bottom: 12px;
}
.activationSuccess .md-button {
    background-color: var(--primary-bg-color) !important;
    color: var(--secondary-text-color);
    font-weight: bold;
    width: 100%;
    line-height: 40px;
    min-height: 40px;
}
.activationContact md-input-container {
	margin: 10px 0;
    width: 100%;
}
.activationContact .textMessage md-input-container .md-input {
	height: 75px !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
	line-height: 20px;
	overflow: auto;
}
.textMessage md-input-container.md-input-focused label:not(.md-no-float), 
.textMessage md-input-container.md-input-has-placeholder label:not(.md-no-float), 
.textMessage md-input-container.md-input-has-value label:not(.md-no-float), 
.textMessage .md-input-focused label:not(.md-no-float), 
.textMessage .md-input-has-placeholder label:not(.md-no-float), 
.textMessage .md-input-has-value label:not(.md-no-float) {
	bottom: 73px !important;
}
.textMessage .md-placeholder, 
.textMessage  label:not(.md-no-float):not(.md-container-ignore) {
	bottom: 80px !important;
} */
/* ============ Student Activation Section Ends: ============ */

/* notification Menu Ends */
@media only screen and (min-width: 1024px) {
	::-webkit-scrollbar {
	  width: 8px;
	  height: 6px;  
	}
	::-webkit-scrollbar-thumb { 
	    background: #bfbfbf;
	    border-radius: 8px;
	}
}
 /*--- Scrollbar Color for Firefox > 64 ----*/
 
md-content,
md-dialog-content,
md-menu-content,
.niceScroll,
.verticalScroll {
	scrollbar-color: rgba(0, 0, 0, 0.3) #fff;
  	scrollbar-width: thin;
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0
}
h1,
h2,
h3,
h4,
h5,
h6,
strong {
    font-weight: 600;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
}
.clearfix::before,
.clearfix::after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.align-center {
    text-align: center !important;
}
html[lang="en"] .align-left {
    text-align: left !important;
}
html[lang="en"] .align-right {
    text-align: right !important;
}
html[lang="en"] .fontsize12 {
    font-size: 12px !important;
}
html[lang="en"] .fontsize14 {
    font-size: 14px !important;
}
html[lang="en"] .fontsize16 {
    font-size: 16px !important;
}
html[lang="en"] .fontsize18 {
    font-size: 18px !important;
}
.fontsize24 {
    font-size: 24px !important;
}
.black {
    background-color: #000 !important
}
.black-text {
    color: #000 !important
}
.white {
    background-color: var(--secondary-bg-color) !important
}
.white-text {
    color: var(--secondary-text-color) !important
}
.white-text-light {
    color: rgba(255, 255, 255, 0.54) !important;
}
.text-light {
	color: rgba(0,0,0,0.45) !important;
}
.light-grey-text {
	color: #cacaca;
} 
.transparent {
    background-color: transparent !important
}
.transparent-text {
    color: transparent !important
}
.icon16 {
    width: 16px;
}
.icon32 {
    width: 32px;
}
.icon40 {
    width: 40px;
}
.icon24 {
    width: 24px;
}
.icon56 {
    width: 56px;
}
html[lang="en"] .ml-0 {
    margin-left: 0 !important;
}
html[lang="en"] .ml-5 {
    margin-left: 5px !important;
}
html[lang="en"] .ml-10 {
    margin-left: 10px;
}
html[lang="en"] .ml-15 {
    margin-left: 15px;
}
html[lang="en"] .ml-20 {
    margin-left: 20px !important;
}
html[lang="en"] .ml-25 {
    margin-left: 25px !important;
}
html[lang="en"] .ml-30 {
    margin-left: 30px !important;
}
html[lang="en"] .ml-40 {
    margin-left: 40px;
}
html[lang="en"] .ml-65 {
    margin-left: 65px !important;
}
html[lang="en"] .mr-0 {
    margin-right: 0 !important;
}
.mt-0 {
    margin-top: 0 !important
}
.mt-10 {
    margin-top: 10px !important
}
.mt-15 {
    margin-top: 15px !important
}
.mt-20 {
    margin-top: 20px !important
}
.mt-25 {
    margin-top: 25px;
}
.mt-30 {
    margin-top: 30px !important
}
.mt-50 {
    margin-top: 50px !important
}
.mt-70 {
    margin-top: 70px !important
}
.mar40 {
    margin: 40px !important;
}
.mt-3 {
    margin-top: 3px !important;
}
.mt-5 {
    margin-top: 5px !important;
}
.mt-7 {
    margin-top: 7px !important;
}
.mrt-15 {
    margin-top: -15px !important;
}
.mrt-36 {
    margin-top: -36px !important;
}
.m-10 {
    margin: 10px;
}
.m-15 {
    margin: 15px;
}
.p-t-8{
    padding-top: 8px !important;
}
html[lang="en"] .p-t-8{
    padding-top: 8px !important;
}
html[lang="en"] .mr-5 {
    margin-right: 5px !important;
}
html[lang="en"] .mr-10 {
    margin-right: 10px !important;
}
html[lang="en"] .mr-15 {
    margin-right: 15px !important;
}
html[lang="en"] .mr-20 {
    margin-right: 20px !important;
}
html[lang="en"] .mr-25 {
    margin-right: 25px !important;
}
html[lang="en"] .mr-30 {
    margin-right: 30px !important;
}
html[lang="en"] .mr-35 {
    margin-right: 35px !important;
}
html[lang="en"] .mr-50 {
    margin-right: 50px !important;
}
html[lang="en"] .mr-75 {
    margin-right: 75px !important;
}
.mb-0 {
    margin-bottom: 0 !important
}
.mb-5 {
    margin-bottom: 5px !important
}
.mb-10 {
    margin-bottom: 10px !important
}
.mb-15 {
    margin-bottom: 15px !important
}
.mb-20 {
    margin-bottom: 20px !important
}
.mb-25 {
    margin-bottom: 25px !important
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-40 {
    margin-bottom: 40px !important;
}
.mb-50 {
    margin-bottom: 50px !important;
}
.mb-70 {
    margin-bottom: 70px !important;
}
.mb-25 {
    margin-bottom: 25px !important;
}
.mtb-10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
.mtb-20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
.mtb-30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
.ptb-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
.ptb-2{
	padding-top: 2px !important;
    padding-bottom: 2px !important;
}
.ptb-7 {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}
.ptb-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.ptb15 {
	padding-top: 15px !important;
	padding-bottom: 15px !important;
}
html[lang="en"] .pl-0 {
    padding-left: 0 !important;
}
html[lang="en"] .pl-5 {
    padding-left: 5px !important;
}
html[lang="en"] .pl-10 {
    padding-left: 10px !important;
}
html[lang="en"] .pl-30 {
    padding-left: 30px;
}
.pl-5 {
    padding-left: 5px !important;
}
.pb-5 {
    padding-bottom: 5px !important;
}
.pb-0 {
    padding-bottom: 0px !important;
}
.pb-10 {
    padding-bottom: 10px !important;
}
.pb-15 {
    padding-bottom: 15px !important;
}
.pb-20 {
    padding-bottom: 20px !important;
}
.pb-25 {
    padding-bottom: 25px !important;
}
.pb-30 {
    padding-bottom: 30px;
}
.pt-0{
	padding-top: 0px !important;
}
.pt-5{
	padding-top: 5px !important;
}
.pt-10{
	padding-top: 10px !important;
}
.pt-15 {
    padding-top: 15px !important;
}
.pt-20 {
    padding-top: 20px !important;
}
.pt-25 {
    padding-top: 25px !important;
}
.pt-45 {
    padding-top: 45px !important;
}
html[lang="en"] .pr-5 {
    padding-right: 5px !important;
}
html[lang="en"] .pr-10 {
    padding-right: 10px !important;
}
html[lang="en"] .pr-15 {
    padding-right: 15px !important;
}
html[lang="en"] .pr-20 {
    padding-right: 20px !important;
}
html[lang="en"] .pr-24 {
    padding-right: 24px !important;
}
html[lang="en"] .pr-25 {
    padding-right: 25px !important;
}
html[lang="en"] .pr-30 {
    padding-right: 30px !important;
}
html[lang="en"] .pr-50 {
    padding-right: 50px;
}
.well {
    padding: 30px;
}
.maxheight-auto {
    max-height: inherit !important;
}
html[lang="en"] .pull-right {
    float: right;
}
html[lang="en"] .text-left {
    text-align: left !important
}
html[lang="en"] .text-right {
    text-align: right !important
}
.pointer {
    cursor: pointer;
}
.yellow-bg {
    background: #FDEFB7 !important;
}
.mtb-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.space-normal {
    white-space: normal !important;
}
.remove-whitespace {
    white-space: normal !important;
    min-width: 50px;
}
html[lang="en"] .pl-15 {
    padding-left: 15px !important;
}
.plr-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.mlr-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
}
.mlr-1 {
    margin-left: 1px !important;
    margin-right: 1px !important;
}
.mlrn-20 {
    margin-left: -20px !important;
    margin-right: -20px !important;
}
.plr-1 {
    padding-left: 1px !important;
    padding-right: 1px !important;
}
.plr20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}
.ptb5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
.ptb45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
}
.width100 {
    width: 100% !important;
}
.width90 {
    width: 90%;
}
.pad0 {
    padding: 0 !important;
}
.pad5 {
    padding: 5px !important;
}
.pad10 {
    padding: 10px !important;
}
.mar0 {
    margin: 0 !important;
}
.mar5 {
    margin: 5px !important;
}
.mar10 {
    margin: 10px !important;
}
.mar15 {
    margin: 15px !important;
}
.pad15 {
    padding: 15px !important;
}
.pad20 {
    padding: 20px !important;
}
.pad24 {
     padding: 24px !important;
 }
.pad25 {
    padding: 25px !important;
}
html[lang="en"] .pl-25 {
    padding-left: 25px !important;
}
html[lang="en"] .pl-20 {
    padding-left: 20px !important;
}
@media (max-width:767px){
	html[lang="en"] .mr-xs-0 {
		margin-right: 0 !important;
	} 
	html[lang="en"] .pr-xs-0 {
		padding-right: 0 !important;
	} 
}
.shadow-none {
	box-shadow: none !important;
}
.text-capitalize {
    text-transform: capitalize !important;
}
.text-uppercase {
    text-transform: uppercase !important;
}
.text-normal {
    text-transform: none !important;
}
.text-center {
    text-align: center !important;
}
.text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-black {
    color: rgba(0, 0, 0, 0.87) !important;
}
.text-dark {
    color: rgba(0, 0, 0, 0.6) !important;
}
.bor-rad-50 {
    border-radius: 50%;
}
.border-radius0 {
    border-radius: 0 !important;
}
.border-radius5 {
    border-radius: 5px;
}
.border-radius4 {
    border-radius: 4px;
}
.border-radius8 {
    border-radius: 8px;
}
.dark-blue-bg {
    background: #143d5b !important;
}
.text-grey {
    color: #646464
}
.text-lighten-grey{
	color: var(--lighten-grey);
}
.text-yellow {
    color: #f9a938 !important;
}
.text-blue{
	color: var(--blue-color) !important;
}
.text-black{
	color: var(--blackText);
}
.text-green {
    color: var(--trinity-text-color) !important;
}
.text-dark-green {
    color: #29a03d !important;
}
.text-orange {
    color: #FFA500 !important;
}
.text-red {
    color: #F83F47 !important;
}
.dark-yellow {
    color: #ce8842 !important;
}
.light-yellow {
    color: #F5BA14 !important;
}
.dark-greenish {
    color: #49C2CA !important;
}
.dark-blue {
    color: #1d9fda !important;
}
.light-grey-bg {
    background: #f7f7f7 !important;
}
.grey-bg-normal {
    background: #dcdcdc !important;
}
.green-bg {
    background: #1CBE5C !important;
}
.lightblue-bg {
    background: #0FB2B2 !important;
}
.lightgreen-bg{
	background-color: #e8faee !important;	
}
.orange-bg {
    background: #F4BD34 !important;
}
.red-bg {
    background: #f00 !important;
}
.darkblue-bg {
    background: #194B93 !important;
}
.light-pink-bg {
    background: #FFEBEC !important;
}
.ping-bg{
	background-color: #C86AF7 !important;
}
.font-normal {
    font-weight: normal !important;
}
.overflow-hide {
    overflow-y: hidden;
}
.overflow-x-hidden{
	overflow-x:hidden;
}
.overflow-auto {
    overflow-y: auto;
    scrollbar-width: auto;
    scrollbar-color: initial;
}
.overflow-unset {
	overflow: unset;
}
.no-border-top {
    border-top: none !important
}
.no-border {
    border: none !important;
}
.no-border-radius {
    border-radius: 0 !important;
}
.no-border-bottom {
    border-bottom: none !important
}
.no-bg {
    background: none !important;
}
.color-unset {
	color: unset !important;
}
.icon_20 {
	width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 20px;
    min-height: 20px;
    min-width: 20px;
}
.border {
    border: 1px solid var(--border-color);
}
.border-top {
    border-top: 1px solid var(--border-color) !important;
}
.border-bottom {
    border-bottom: 1px solid var(--border-color) !important;
}
html[lang="en"] .border-right {
    border-right: 1px solid var(--border-color) !important;
}
html[lang="en"] .border-left {
    border-left: 1px solid var(--border-color) !important;
}
.blue-bg {
    background: #387ddc;
}
.white-bg {
    background: var(--secondary-bg-color) !important
}
.valign-top {
    vertical-align: top;
}
.valign-middle {
    vertical-align: middle;
}
.font36 {
    font-size: 36px !important;
}
.font34 {
    font-size: 34px !important;
}
.font30 {
    font-size: 30px !important;
}
.font24 {
    font-size: 24px !important;
}
.font21 {
    font-size: 21px;
}
.font20 {
    font-size: 20px !important;
}
html[lang="en"] .font16 {
    font-size: 16px;
}
html[lang="en"] .font14 {
    font-size: 14px !important;
}
html[lang="en"] .font13 {
    font-size: 13px !important;
}
html[lang="en"] .font12 {
    font-size: 12px !important;
}
html[lang="en"] .font11 {
    font-size: 11px !important;
}
.grey-text {
    color: rgba(0, 0, 0, 0.6) !important;
}
.dark-grey-bg {
    background: #aaa !important;
}
.pad10 {
    padding: 10px !important;
}
.pad30 {
    padding: 30px !important;
}
.plr30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
}
body .pt-0,
.pt-0 {
    padding-top: 0 !important
}
body .pb-0,
.pb-0 {
    padding-bottom: 0 !important;
}
.ptb-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
.cursor-pointer,
.cursor-pointer * {
    cursor: pointer !important;
}
.cursor-default {
    cursor: default !important;
}
.fontBold {
    font-weight: 700 !important
}
.relative {
    position: relative;
}
.fixed {
    position: fixed !important;
}
.static {
    position: static !important;
}
.display-block {
    display: block !important;
}
.inline-block {
    display: inline-block;
}
.md-button md-icon {
    font-size: 22px;
    min-width: 22px;
    width: 22px;
    min-height: 22px;
    height: 22px;
    line-height: 22px;
}
.minheight50 {
    min-height: 50px;
}
.minheight60 {
    min-height: 60px;
}
.minheight70 {
    min-height: 70px;
}
.minheight90 {
    min-height: 90px;
}
.minheight90p{
	min-height: 90%;
}
.minheight100p {
    min-height: 100% !important;
}
.minheight-auto{
	min-height: auto !important;
}
.height-full {
    min-height: 100vh;
}
.height-auto {
    height: auto !important;
}
.height60 {
    min-height: 60px !important;
    height: 60px !important;
}
.width-full {
    width: 100% !important;
}
.max-width100 {
    max-width: 100%;
}
.width-auto {
    width: auto !important;
}
.no-max-height {
    max-height: inherit !important;
}
.height-136 {
    height: calc(100% - 136px);
    min-height: inherit;
}
.height-110 {
    height: calc(100% - 110px) !important;
    min-height: inherit;
}
.height-95 {
    height: calc(100% - 95px) !important;
    min-height: inherit;
}
.height-85 {
    height: calc(100% - 85px);
    min-height: inherit;
}
.height-75 {
    height: calc(100% - 75px);
    min-height: inherit;
}
.height-40 {
    height: calc(100% - 40px);
}
.h100 {
    height: 100%
}
@media only screen and (max-width: 1024px) { 
	.mobileTooltipNone {
		display: none;
	}
}
/* multiple line in select options Starts */
.multilinesInSelect {
    max-width: 300px;
}
.multilinesInSelect md-option {
    min-height: 48px;
    height: auto;
    padding-top: 5px;
    padding-bottom: 5px;
    box-sizing: border-box;
}
.multilinesInSelect md-option .md-text {
    text-wrap: wrap;
}
/* multiple line in select options Ends */
.valign-wrapper {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}
.valign-wrapper .valign {
    display: block
}
.center {
    text-align: center;
    vertical-align: middle
}
.dtable {
    display: table;
}
.sm-heading {
    font-weight: 600;
    font-size: var(--default-fontsize);
    color: rgba(0, 0, 0, .54);
}
.sm-icon {
    font-size: 21px !important;
    height: auto;
    line-height: inherit;
    min-height: inherit;
}
.no-underline {
	text-decoration: none;
}
.word-break {
	word-wrap: break-word !important;
}
ul.list-u-roman li {
	list-style: upper-roman;
}
ul.list-l-roman li {
	list-style: lower-roman;
}
ul.list-disc li {
	list-style: disc;
}
ul.list-decimal li {
	list-style: decimal;
}
ul.list-circle li {
	list-style: circle;
}

/*--- COMMON STYLES ----*/

.menu-overlay {
	background: rgba(0, 0, 0, 0.56) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: all 0.2s ease-in-out 0s;
    width: 100%;
    z-index: -1;
    opacity: 0;
}
.togglenav .menu-overlay {
	opacity: 1;
    z-index: 13;
    transition: all 0.2s ease-in-out 0s;
}
.top_header_bg_color {
    background: #0b93d1;
}
.click-link {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
    cursor: pointer;
}
.ngfade {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    opacity: 1
}
.ngfade .ng-enter,
.ngfade .ng-leave {
    -webkit-transition: all 1s ease;
    transition: all 1s ease
}
.togglebar,
body.togglenav .togglebar {
    -webkit-transition: all .3s ease-out!important;
    -o-transition: all .3s ease-out!important
}
.ngfade .ng-enter {
    opacity: 0
}
.ngfade .ng-enter-active,
.ngfade .ng-leave {
    opacity: 1
}
.ngfade .ng-leave-active {
    opacity: 0
}
.nicescroll-cursors {
    border: none!important;
    transition: none;
}
.nicescroll-rails div {
    transition: none !important;
    background-color: #bfbfbf !important; 
    border: 0 !important;
}
.nicescroll-rails {
    z-index: 8 !important;
    opacity: 1 !important;
}
.menuslider_box {
    min-height: 128px
}
.close_pop {
    position: absolute;
    top: 25px;
    right: 25px
}
body.togglenav .main_box_container {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 100%
}
body.togglenav #side-wrapper {
    -webkit-transform: translate3d(-268px, 0, 0);
    transform: translate3d(-268px, 0, 0)
}
body.togglenav .togglebar {
    transition: all .3s ease-out!important;
    transform: rotate(180deg)!important;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg)
}
.togglebar {
    will-change: transform;
    transition: all .3s ease-out!important;
    transform: rotate(0)!important
}
.togglenav .left_navigation .toggle_icon {
	background-color: #f2f2f2 !important;
    width: 33px;
    height: 24px;
    padding: 0;
    min-height: 24px;
    border-radius: 0;
    will-change: transform;
    -webkit-transition: all .3s ease-out!important;
    -o-transition: all .3s ease-out!important;
    transition: all .3s ease-out!important;
}
.togglenav .left_navigation .toggle_icon {
    transform: rotateY(180deg)!important;
    -webkit-transform: rotateY(180deg)!important;
    -moz-transform: rotateY(180deg)!important;	
}
.togglenav .left_navigation .toggle_icon i {
    min-height: 20px;
    vertical-align: middle;
}
.toggle_icon {
    transform: rotateY(0)!important;
    -webkit-transform: rotateY(0)!important;
    -moz-transform: rotateY(0)!important;
    will-change: transform;
    -webkit-transition: all .3s ease-out!important;
    -o-transition: all .3s ease-out!important;
    transition: all .3s ease-out!important;
}

/*--- MDPICKERS PICKERS ---*/

.md-dialog-container .mdp-datepicker .mdp-datepicker-date-wrapper,
.mdp-calendar-days .md-icon-button.md-accent,
.md-dialog-container .mdp-calendar-days .md-icon-button.md-accent:hover,
.md-dialog-container .mdp-timepicker .mdp-timepicker-time,
.md-dialog-container .mdp-timepicker .mdp-clock-switch-container .md-primary,
.md-dialog-container .mdp-timepicker .mdp-clock-switch-container .md-icon-button.md-primary:hover {
    color: var(--secondary-text-color) !important;
}
.mdp-datepicker-select-year .repeated-year .md-button.current {
    font-size: 26px;
}
.mdp-datepicker md-dialog-actions .md-button,
.mdp-timepicker md-dialog-actions .md-button,
.cust-btn .md-button {
    background: none !important;
}
mdp-calendar .mdp-calendar-monthyear {
    font-size: 16px;
    font-weight: 600;
}
.datewrapper md-input-container,
.timewrapper md-input-container {
    width: 100%;
}
.selection-border .md-select-value {
    border-color: transparent !important;
}
.custom-date mdp-date-picker .md-button.md-icon-button,
.custom-time mdp-time-picker .md-button.md-icon-button {
    margin: 0;
    padding: 0;
    position: absolute;
    right: 0;
    top: 10px;
    z-index: 1;
}
.mdp-timepicker md-dialog-actions .md-button:not(.md-primary),
.mdp-datepicker md-dialog-actions .md-button:not(.md-primary) {
    color: rgba(0, 0, 0, 0.35);
}
.mdp-calendar .md-button.md-raised[disabled] {
    color: rgba(0, 0, 0, 0.38);
}

html[lang="ar"] .mdp-datepicker .layout-align-space-between-center.layout-row {
    direction: ltr;
}

/*--- PACE LOADER ---*/

.pace-running {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 105;
}
.pace-restrict.pace-running {
    height: 100%;
}
.pace {
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.pace.pace-inactive {
    background: none;
    display: none;
}
.pace.pace-inactive .pace-activity {
    display: none;
}
.pace .pace-progress {
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 3px;
    transition: all .5s ease 0s;
}

/*---  MAIN HEADER STYLES ---*/

header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1
}
.md-icon-button.menu-btn {
 	height: 36px;
 	padding: 0 ;
    width: 36px;   
}
.menu-btn img {
    border-radius: 50%;
    height: 36px;
    width: 36px;
}
.main-logo {
    margin-left: 4px;
    margin-right: 10px;
}
.main-logo img {
    max-height: 31px;	
    display: block;
}
.collapsible {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    margin: .5rem 0 1rem
}
.collapsible-header {
    display: block;
    cursor: pointer;
    min-height: 3rem;
    line-height: 3rem;
    padding: 0 1rem;
    background-color: var(--secondary-bg-color);
    border-bottom: 1px solid #ddd
}
.collapsible-header i {
    width: 2rem;
    font-size: 1.6rem;
    line-height: 3rem;
    display: block;
    float: left;
    text-align: center;
    margin-right: 1rem
}
.collapsible-body {
    display: none;
    border-bottom: 1px solid #ddd;
    box-sizing: border-box
}
.collapsible-body p {
    margin: 0;
    padding: 2rem
}
.top_header_wrap .session_text {
    font-size: var(--default-fontsize);
    color: #757575;
    font-weight: 300;
    margin-right: 25px;
    min-width: inherit;
}
.top_header_wrap .session_text span {
    color: #424242;
    font-weight: 400
} 
.schoolDetails {
	height: 80px;
	padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--border-color);
}
.left_navigation a .school_name span{
	/* autoprefixer: off */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: inherit;
	font-weight: 500;
}
button.md-button.search_opens_NLP {
    min-width: 80px;
    border-radius: 8px;
    height: 30px;
    line-height: 30px;
    min-height: 30px;
    text-align: left;
    margin-right: 5px !important;
    margin-left: 5px !important;
    font-size: var(--default-font14);
    display: flex;
    text-transform: capitalize;
    color: var(--legend-border);
    padding: 0 8px;
    border: solid 1px var(--border-color);
    background-color: var(--white-color) !important;
}
button.md-button.search_opens_NLP i {
    margin: 0 4px 0 0;
    min-width: 16px;
    font-size: var(--default-font14);
    width: 14px;
    height: 14px;
    min-height: 14px;
}
button.md-icon-button.search_opens md-icon {
    display: unset;
}
/* Sort List Starts */
md-virtual-repeat-container:has(.topSearchbar) {
    box-shadow: 0 2px 3px 0px rgba(0, 0, 0, .25) !important;
    background-color: transparent !important;
    border-radius: 0 0 5px 5px;
   min-height: 100px !important;
}
md-virtual-repeat-container:has(.topSearchbar) .md-virtual-repeat-scroller {
    background-color: white;
    margin-top: 48px;
}
.headerSelectionFilter {
    margin: 0 2px;
    width: 400px;
    background-color: white;
    min-height: 48px;
    font-size: var(--default-fontsize);
    padding: 0 12px;
    position: absolute;
    top: 52px;
    right: -500px;
    z-index: 102;
    border-bottom: solid 2px var(--border-color);
    box-shadow: 0 -2px 5px rgba(0, 0, 0, .25);
    border-radius: 5px 5px 0 0;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
}
.headerSelectionFilter.showFilterOptions {
    right: 88px;
}
.hsfList {
    overflow: auto;
}
.hsfItem {
    min-width: max-content;
    width: 38px;
    text-align: center;
    border-radius: 10px;
    min-height: 28px;
    border: solid 1px var(--border-color);
    line-height: 18px;
    padding: 5px 8px;
    box-sizing: border-box;
    cursor: pointer;
    margin-right: 6px;
    position: relative;
    overflow: hidden;
}
.hsfItem.selected {
    border-color: var(--primary-bg-color);
    background-color: var(--primary-bg-color);
    color: var(--secondary-text-color);
}
.hsfList::-webkit-scrollbar {
    height: 4px;
}
.hsfList::-webkit-scrollbar-thumb {
    cursor: pointer;
}
/* Sort List Ends */
.top_header_wrap.top_search {
    position: fixed;
    top: 12px;
    right: -500px;
    z-index: 13;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    width: 400px;
    padding: 0;
    min-height: unset;
}
.top_header_wrap.top_search.in {
    right: 90px;
}
.top_search_wrap {
	background: #efefef;
    width: 100%;
    height: 40px;
    display: inline-block;
    margin: 0 auto;
    position: relative;
    border-radius: 8px;
}
.back_search {
    position: fixed;
    right: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    display: none;
}
.top_header_wrap.top_search.in .back_search {
	display: block;
}
.top_header_wrap.top_search .searchIcon {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
.top_header_wrap.top_search .searchIcon i {
    font-size: 16px;
    min-height: 16px;
    line-height: 16px;
}
.top_search_wrap md-autocomplete {
	display: inline-block;
    width: 100%;
    background: none;
    border: solid 2px var(--primary-bg-color);
    border-radius: 8px;
    position: relative;
    z-index: 2;
}
.top_search_wrap md-autocomplete md-autocomplete-wrap {
    box-shadow: none;
    background: transparent;
}
.top_search_wrap input {
    border: none;
    background: 0 0;
    outline: 0;
    width: calc(100% - 125px);
    height: 38px !important;
    padding: 5px 5px 5px 35px !important;
    font-size: 75%;
    font-family: Outfit, sans-serif;
}
.top_search_wrap input::-webkit-input-placeholder {
    color: rgba(0,0,0,.54) !important
}
.top_search_wrap input::-moz-placeholder {
    color: rgba(0,0,0,.54) !important
}
.top_search_wrap input:-ms-input-placeholder {
    color: rgba(0,0,0,.54) !important
}
md-toolbar.top_header_wrap {
    z-index: 10;
    min-height: 60px;
    background: var(--header-color) !important;
    /* border-bottom: solid 1px var(--border-color); */
}
.top_header_wrap .md-toolbar-tools {
    height: auto !important;
    min-height: auto !important;
    padding: 0;
}

#nlpHeader md-toolbar:not(.md-menu-toolbar) md-icon {
	fill: rgba(0,0,0,0.64) !important;
	color: rgba(0,0,0,0.64) !important;
	opacity: 1;
}
.language-wrap img {
    width: 20px;
    margin: 0 10px;
}
.md-virtual-repeat-container.md-autocomplete-suggestions-container {
	max-height: 350px !important;
}
.md-autocomplete-suggestions-container ul.custom-template li {
	line-height: inherit;
	padding: 4px 15px;
	height: 38px;
	border-bottom: none;
}
.md-autocomplete-suggestions-container ul.custom-template li .item-metadata {
	display: block;
	font-size: 12px;
	color: rgba(0,0,0,0.6);
}
.md-autocomplete-suggestions-container ul.custom-template li .item-metadata md-icon{
	font-size: 18px;
	height: 18px;
	min-height: 18px;
	line-height: 16px;
	width: 18px;
	min-width: 18px;
}
.md-autocomplete-suggestions-container ul.custom-template li .highlight {
	color: #000;
	font-weight: 600;
}
.autocomplete-custom-template.custom-template .item-title, 
.autocomplete-custom-template.custom-template .item-metadata {
	line-height: inherit;
}
.custom-template .type-icon {
	width: 18px;
    height: 18px;
    min-width: inherit;
    min-height: inherit;
    color: rgba(0,0,0,.74);
    font-size: 20px;
}
.autocomplete-custom-template.custom-template .item-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}
md-virtual-repeat-container .asideMenuAutoComplete.topSearchbar md-list-item .md-list-item-text p {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: black !important;
}
md-virtual-repeat-container .asideMenuAutoComplete md-list-item.auto-complete-list-active .md-list-item-text h3 {
	padding-right: 70px;
}
.activeStudent {
	padding: 0 4px;
    border-radius: 20px;
    font-size: 12px;
    color: #ffffff;
    line-height: 14px;
    position: absolute;
    right: 0;
    top: 9px;
    background: #f2760a;
    font-weight: 700;
}
.activeStudent.active {background: #499f46 !important}
/*---  SIDENAV STYLES ---*/

.side-nav .collapsible,
.side-nav.fixed .collapsible {
    border: none;
    box-shadow: none
}
.side-nav .collapsible li,
.side-nav.fixed .collapsible li {
    padding: 0
}
.side-nav .collapsible-header,
.side-nav.fixed .collapsible-header {
    background-color: transparent;
    border: none;
    line-height: inherit;
    height: inherit;
    padding: 0 30px
}
.side-nav .collapsible-header:hover,
.side-nav.fixed .collapsible-header:hover {
    background-color: rgba(0, 0, 0, .05)
}
.side-nav .collapsible-header i,
.side-nav.fixed .collapsible-header i {
    line-height: inherit
}
.side-nav .collapsible-body,
.side-nav.fixed .collapsible-body {
    border: 0;
    background-color: var(--secondary-bg-color)
}
.side-nav .collapsible-body li a,
.side-nav.fixed .collapsible-body li a {
    padding: 0 37.5px 0 45px
}
.collapsible.popout {
    border: none;
    box-shadow: none
}
.collapsible.popout > li {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
    margin: 0 24px;
    transition: margin .35s cubic-bezier(.25, .46, .45, .94)
}
.collapsible.popout>li.active {
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    margin: 16px 0
}
#side-wrapper,
.truncate,
body.nerp_da {
    overflow: hidden
}
.content_area_wrapper,
.left_navigation,
.left_navigation .menu_list {
    position: absolute;
    transition: all 1s ease
}
.togglenav .left_navigation {
    left: 0;
}
.togglenav .content_area_wrapper {
    width: 100%;
    left: 0
}
.left_navigation { 
    width: 340px;
    background-color: var(--secondary-bg-color);
    left: -350px; 
    height: calc(100% - 0px);
    z-index: 14;
    box-shadow: none;
	border-top: 1px solid var(--border-color);
	top:0px;
} 

/* .service_errors:not(.hide) ~ div .left_navigation,
body.errorVisible .left_navigation,
body.notification .left_navigation,
body.staticBanner .left_navigation {
    top: 50px;
} */
.left_navigation .menu_list {
    left: 0;
    top: 82px;
    width: 100%;
    height: calc(100% - 82px);
}
.left_navigation .menu_list.sub_menu_list,
.left_navigation.in .main_menu_list {
    left: -100%;
    opacity: 0
}
.left_navigation.in .sub_menu_list.in {
    left: 0;
    opacity: 1;
}
.left_navigation md-list {
    padding: 10px 0 30px 0; 
}
.left_navigation md-list md-list-item {
    width: 100%;
    cursor: pointer;
    box-sizing: border-box; 
    display: block;
    min-height: inherit;
    padding: 0;
}
.left_navigation md-list md-list-item div::after {
    content: "";
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid rgba(0,0,0,.5);
    display: inline-block;
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -5px;
}
.left_navigation md-list md-list-item:hover div span,
.left_navigation md-list md-list-item:hover md-icon {
    color: var(--secondary-text-color);
}
.left_navigation md-list.inner-level md-list-item:hover div span,
.left_navigation md-list.inner-level md-list-item:hover md-icon {
    color: rgba(0,0,0,.87);
}
.left_navigation md-list.inner-level md-list-item {
	border-left: 5px solid transparent;
}
.left_navigation md-list md-list-item:hover div::after {
	border-left: 5px solid #fff;
}
.left_navigation md-list md-list-item a div::after  {	 
    border-top-width: 4px;
    border-left-width: 4px;
    border-bottom-width: 4px;
    margin-top: -4px;
}
.left_navigation md-list md-list-item div {
	padding: 10px 20px;
}
.left_navigation md-list md-list-item div img {
    max-width: 24px;
    display: inline-block;
    vertical-align: middle;
    max-height: 24px;
}
.left_navigation md-list md-list-item div span {
    font-size: var(--default-fontsize);
    padding: 0 8px;
    display: inline-block;
    text-transform: capitalize;
    vertical-align: middle;
}
.left_navigation md-list md-list-item:before,
.left_navigation md-list md-list-item.active img,
.left_navigation md-list md-list-item .md-secondary-container,
.left_navigation md-list md-list-item .md-ripple-container,
.left_navigation md-list md-list-item.active div::after {
    display: none;
}
.left_navigation md-list md-list-item.active md-icon {
	font-size: 28px;
	width: 28px;
	height: 28px;
	min-width: inherit;
	min-height: inherit;
	transform: rotate(-90deg);
	margin-left: -7px;
}
.left_navigation md-list md-list-item.active span {
     padding: 0;
    text-transform: uppercase;
	font-weight: 600;
}
.left_navigation a {
	text-decoration: none;
	vertical-align: middle;
	color: var(--primary-text-color);
	padding: 0 16px;
	display: block;
}
.left_navigation md-list md-list-item a div {
    padding-left: 25px;
}
/* .left_navigation .nicescroll-rails {
    opacity: 0 !important;
} */
.search-wrap md-input-container {
    background: #f2f2f2;
    margin: 17px 15px;
    box-sizing: border-box;
    border: 1px solid var(--border-color);
}
.search-wrap md-input-container md-icon {
    color: rgba(0,0,0,.54);
    top: 6px;
}
.search-wrap md-input-container input {
    border: none;
}
.bottom-scroll {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	background: var(--secondary-bg-color);
}
.bottom-scroll a{
	display: none;
	text-decoration: none;
}

/*--- LEFT NAV NEW STYLES ---*/

.menu-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: none;
}
.menu-nav md-list md-list-item div {
    padding: 8px 0;
}
.menu-nav md-list md-list-item div.menu-list-header {
    padding: 10px 18px;
    position: relative;
}
.menu-nav md-list .menu-list-header span {
    max-width: calc(100% - 50px) 
}
.menu-nav .menu-list-header md-icon {
    position: absolute;
    right: 10px;
    font-size: 20px;
    min-width: inherit;
    min-height: inherit;
    width: auto;
    height: auto;
    top: 14px;
    transition: all .1s ease-in-out 0s;


}
.menu-nav .menu-active .menu-list-header md-icon {
    transform: rotate(-180deg);
    color: var(--trinity-text-color);
}
.menu-nav ul li {
    padding: 0px 16px;
}
.menu-nav ul li:hover,
.menu-nav ul li.active {
    background: rgba(129, 178, 20, 0.04);
}
.menu-nav ul li a {
    position: relative;
}
.menu-nav md-list md-list-item div::after {
    top: 26px
}
.menu-nav md-list md-list-item a div::after  {
    left: 10px;
    margin-top: -10px;
}
.menu-nav md-list md-list-item a div {
    padding-left: 8px;
}
.menu-nav md-list md-list-item div span {
    padding: 0 10px;
}
.menu-nav.left_navigation md-list md-list-item:hover {
    background-color: transparent;
}
.menu-nav md-list md-list-item:hover div span, 
.menu-nav md-list md-list-item:hover md-icon {
    color: var(--primary-text-color);
}
.menu-nav md-list md-list-item:hover div::after {
    border-left: 5px solid rgba(0,0,0,.5);
}
.menu-nav ul li:hover a span,
.menu-nav md-list md-list-item div.menu-list-header:hover span,
.menu-nav .menu-active ul li.active a span,
.menu-nav md-list .menu-active .menu-list-header span,
.menu-nav md-list md-list-item div.menu-list-header:hover md-icon {
    color: var(--trinity-text-color);
}
.menu-nav md-list .menu-active .menu-list-header i {
    color: var(--trinity-text-color);
}
.menu-nav .menu-active ul li.active div::after,
.menu-nav ul li:hover div::after  {
    border-left-color:  var(--primary-bg-color);
}
.menu-nav md-list md-list-item div.menu-list-header:after {
    display: none;
}
.menu-nav md-list .menu-active .menu-list-header,
.menu-nav md-list md-list-item div.menu-list-header:hover {
    background-color: #f6faee;
}
.menu-nav .menu-active ul {
    display: block;
}

/*--- CONTENT AREA STYLES ---*/

.content_area_wrapper {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12);
    margin: 0;
    left: 0;
    width: calc(100%);
    height: 100%;
    /* height: calc(100% - 61px); */
}
.content_area_wrapper.is_edu_footer{
	height: calc(100% - 40px);
	min-height: calc(100% - 40px);
    max-height: calc(100% - 40px);
}
md-content {
    background: var(--mainbg);
    height: 100%;
}
md-toolbar.md-header-cust {
    margin: 0;
    z-index: inherit;
}
md-toolbar.md-header-cust .md-toolbar-tools h2 {
    font-size: 16px;
    font-weight: 700;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
}

/*--- MDDATA TABLE STYLES ---*/

md-table-container {
    /* border: 1px solid var(--border-color); */
    max-width: 100%;
    border-bottom: none;
   /*  margin: 24px 24px 0 24px; */
    border-radius: 6px 6px 0px 0px;
	scrollbar-width: thin;
	scroll-margin-top: 20px;
}
md-table-container table.md-table {
	overflow: unset;
}
md-table-container .md-custom-table .md-head {
	position: sticky;
    top: 0;
    z-index: 2;
}
md-table-container::-webkit-scrollbar-track {
  top: 40px;
}
md-table-container::-webkit-scrollbar-thumb {
  background: #888; 
  width: 8px;
}
 
table.md-custom-table.clone,
.clone + md-table-container {
    border-bottom: 1px solid var(--border-color);
    /* border-top: 1px solid var(--border-color); */
}
.clone + md-table-container {
    border-top: none;
}
.md-custom-table .md-checkbox-column .md-icon,
.md-custom-table .md-checkbox-cell .md-icon {
    border-radius: 50%;
    border-width: 0;
}
.md-custom-table .md-checkbox-column md-checkbox.md-checked .md-icon::after,
.md-custom-table .md-checkbox-cell md-checkbox.md-checked .md-icon::after {
    top: 3px;
	width: 6px;
	height: 12px;
	border-color: #fff;
	left: 7px;
}
.md-custom-table .md-checkbox-cell md-checkbox .md-container::before {
	background-color: #E0E0E0;
}
.enhanced-table .md-custom-table td.md-cell.md-checkbox-cell {
    text-align: center;
}
.enhanced-table .md-custom-table.md-row-select td.md-cell:nth-child(2), 
.enhanced-table .md-custom-table.md-row-select th.md-column:nth-child(2) {
    padding: 0 12px 0 0 !important;
}
.md-custom-table .md-checkbox-column md-checkbox .md-container::before {
    background: var(--secondary-bg-color);
    border: 1px dashed rgba(0,0,0,.54);
}

/* table.md-custom-table thead, tbody tr {
  display: table;
  width: 100%;
  table-layout: fixed;
}
table.md-custom-table tbody {
  display: block;
  overflow-y: auto;
  table-layout: fixed;
  max-height: 820px;
} */

table.md-custom-table th.md-column {
    color: rgba(0, 0, 0, 0.87);
    font-size: var(--default-font14);
    position: relative;
    font-weight: 500;
    /* padding-bottom: 15px !important;
    padding-top: 15px !important; */
    box-sizing: border-box;
    transition: none;
    text-align: left;
    text-transform: capitalize;
}
table.md-custom-table td.md-cell {
    border-top: none;
    border-bottom: 1px solid var(--border-color);
    font-size: var(--default-font14);
    padding-bottom: 8px !important;
    padding-top: 8px !important;
    white-space: nowrap;
    text-transform: capitalize;
    text-align: left;
    background: var(--white-color);
    font-weight:400;
}
table.md-custom-table td.md-cell pre {
    /* font-family: 'Lato', sans-serif; */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Lato, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    margin: 0;
}
.md-custom-table tbody .md-row:nth-child(2n),
.md-custom-table tbody .md-row:nth-child(2n+1) {
    background-color: var(--secondary-bg-color);
}
.md-custom-table.md-table:not(.md-row-select) td.md-cell:first-child,
.md-custom-table.md-table:not(.md-row-select) th.md-column:first-child {
    text-align: left;
    padding-left: 30px;
    padding-right: 30px;
}
.md-custom-table .md-cell .profile-img {
    display: inline-block;
    line-height: 44px;
    margin-right: 5px;
    vertical-align: middle;
    width: 44px;
    border-radius: 44px;
    max-height: 44px;
    height: 44px;
    max-width: 44px;
}
.md-custom-table .profile-img img {
    border-radius: 50%;
    max-width: 44px;
    max-height: 44px;
    display: block;
    margin: 0 auto;
}
table.md-table tbody.md-body > tr.md-row,
table.md-table tfoot.md-foot > tr.md-row {
    height: 48px;
}
.md-custom-table .md-body-list .text-left .int-icon .item-img img {
    border-radius: 50%;
    width: 31.5px;
    height: 31.5px;
    display: block;
    margin: 0 auto;
}
.profile-img + span label {
    color: rgba(0, 0, 0, 0.87);
}
.report-table .md-cell span {
    display: inline-block;
    font-size: var(--default-fontsize);
    text-align: left;
    vertical-align: middle;
}
.report-table .md-cell span.profile-img + span {
    width: 78%;
    display: inline-block;
    white-space: normal;
    font-weight: 500;
    text-transform: capitalize;
}
.md-custom-table.table-text-wrap td.md-cell {
    white-space: normal;
}
table.md-table th.md-column .md-sort-icon {
    min-height: 16px;
    min-width: 16px;
}
table.md-table thead.md-head + .md-table-progress md-progress-linear {
    top: -2px;
}
table.md-table tbody.md-body > tr.md-row.yellow-bg:hover {
    background: #FDEFB7 !important;
}
.md-sort-icon svg {
    width: 16px;
}
.report-table .md-cell a {
    display: block;
    text-decoration: none;
}
.report-table .md-cell .profile-img + span label {
    display: block;
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}
table.fixed thead tr:last-child th {
    vertical-align: bottom;
}
table.fixed + table thead tr th > span {
    display: inline-block;
}
table.fixed + table tbody tr:first-child td {
    border-top: none;
}
.fixed + table.md-custom-table tr:last-child td.md-cell {
    border-bottom: 1px solid var(--border-color);
}
.nicescroll-rails-vr {
    z-index: 8 !important;
}
.md-custom-table th.clone {
    border-bottom: 1px solid var(--border-color);
}
/* md-table-container.excel-data-table {
    width: 100%;
} */
md-progress-linear.md-inline {
    bottom: 13px !important;
}
.link-row tbody tr {
    cursor: pointer;
}
.md-custom-table .md-cell mdp-date-picker md-input-container,
.md-custom-table .md-cell mdp-time-picker md-input-container {
    margin: 5px 0;
}
.md-custom-table .md-cell mdp-date-picker .md-button.md-icon-button,
.md-custom-table .md-cell mdp-time-picker .md-button.md-icon-button {
    top: 0;
}
.md-table-pagination {
    font-size: var(--default-fontsize);
    border-bottom: 1px solid var(--border-color);
    border-top: none;
    border-left: 1px solid var(--border-color);
    border-right: 1px solid var(--border-color);
}

/*--- SETTINGS CARDS STYLES ---*/

.list-wrap.mt-50.settings-wrap {
    margin-top: 15px !important;
    padding: 10px;
}
.settings-wrap .list-item {
    cursor: pointer;
    display: inline-block;
    height: auto;
    margin: 1%;
    min-height: 180px;
    padding-top: 20px;
    position: relative;
    vertical-align: middle;
    width: 14.3%;
    border-radius: 0;
}
.settings-wrap .list-header {
    padding: 15px 0 0;
    text-align: center;
}
.settings-wrap .icon-img {
    background: transparent;
    border-radius: 5px;
    height: 80px;
    line-height: 75px;
    margin: 0 auto;
    position: relative;
    width: 80px;
}
.settings-wrap .icon-img img {
    width: 80px;
    height: 80px;
}
.settings-wrap .icon-img i {
    color: var(--secondary-text-color);
    font-size: 56px;
    transition: all 0.2s ease 0s;
    line-height: 100px;
}
.settings-wrap i.icon-convert-to-leave span:before,
.settings-wrap i.icon-student-fee-dues span:before,
.settings-wrap i.icon-fee-challan span:before,
.settings-wrap i.icon-leave-master span:before,
.settings-wrap i.icon-department-designation span:before {
    color: var(--secondary-text-color);
}
.settings-wrap .list-header h3 {
    color: #133e5e;
    font-size: var(--default-fontsize);
    font-weight: 400;
    line-height: 18px;
    margin: 15px 0 0;
}
.settings-wrap .custom-icon {
    line-height: 90px;
}
.settings-wrap .custom-icon i {
    font-size: 48px;
}
.settings-wrap a.link {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
    cursor: pointer;
}
.settings-wrap md-card {
    width: 12%;
}
.card-grid-view.settings-wrap {
    margin: 0;
    padding: 15px;
}
.settings-wrap .card-content {
    min-height: 100px;
}
.settings-wrap md-card-content {
    background: #f5f5f5 none repeat scroll 0 0;
}
.settings-wrap .card-content > img {
    margin: 0 auto;
    max-height: 80px;
}

/*--- WELCOME BLOCK STYLES ---*/

.welcome_block img {
    margin-bottom: 30px;
}
.welcome_block h3.md-headline {
    font-size: 30px;
    font-weight: 300;
    margin: 0 0 0;
    padding-bottom: 0;
}
.welcome_block p.paragraph {
    color: rgba(0, 0, 0, 0.87);
    font-size: var(--default-fontsize);
    margin: 15px 0;
    /* text-transform: capitalize; */
}
.no-data {
    text-align: center;
    height: calc(100% - 1px);
}
.no-data md-icon {
    /* color: #d7d7d7; */
    height: 80px;
    margin-top: 0;
    margin-bottom: 10px;
    width: 200px;
    background: url('https://nlpkube1.nexterp.in/nlp/images/errorimage.svg') no-repeat center center/55px;
    font-family: inherit;
    font-size: 0 !important;
    
}
.no-data h2,
.no-data h3 {
    color: rgba(34, 34, 34, 0.6);
    font-size: 18px;
}

/*--- NO RECORDS STYLES ---*/

.no-records {
    background: url(https://nlpkube1.nexterp.in/nlp/images/errorimage.svg) no-repeat center center #F2F2F2;
    max-height: 500px;
    height: 100%;
    min-height: 420px;
}
.empty-data h3 {
    font-weight: 400;
    color: rgba(34, 34, 34, 0.6);
    margin-top: 20px;
    /* text-transform: capitalize; */
    text-align: center;
}

/*--- MDTOAST STYLES  ---*/

md-toast {
    position: fixed;
}
md-toast .md-toast-content {
    bottom: 0;
    border-radius: 4px;
    color: var(--secondary-text-color);
    font-size: var(--default-fontsize);
    min-height: 56px;
    padding-left: 15px;
    padding-right: 15px;
    max-width: inherit;
    text-transform: capitalize;
}
md-toast.md-left {
	left: 74px;
}
html[lang="ar"] md-toast.md-right {
    right: auto;
    left: 0;
}

/*--- ADDWRAP SECTION STYLES ---*/

.add-wrap {
    padding: 25px 24px 5px;
}
.add-wrap.min-padding {
    padding-top: 5px;
    padding-bottom: 5px;
    z-index: 3;
}
.md-icon-button:hover md-icon {
    opacity: .75;
}
.add-wrap .md-select-value .md-select-icon::after {
    top: 5px;
}
.add-wrap .custom-date mdp-date-picker .md-button.md-icon-button,
.add-wrap .custom-time mdp-time-picker .md-button.md-icon-button {
    top: -5px
}
.add-wrap .auto-complete md-input-container {
    margin: 0;
}
.add-wrap .auto-complete md-progress-linear.md-inline {
    bottom: -1px !important;
}
.add-wrap mdp-date-picker md-input-container,
.add-wrap mdp-time-picker md-input-container {
    margin: 0;
}

/*---CUSTOM FORM ELEMENTS STYLES ---*/

md-input-container .md-errors-spacer {
    min-height: inherit;
}
md-input-container input {
    text-transform: none;
}
md-input-container md-select .md-select-value,
md-option .md-text,
.md-primary md-label span,
md-input-container label {
    /* text-transform: capitalize; removed each word first leter getting capital*/
}
md-input-container .md-input[disabled],
md-input-container md-select[disabled] .md-select-value:not(.md-select-placeholder) {
    color: rgba(0, 0, 0, 0.87) !important;
    margin-bottom: 0;
}
md-input-container md-select[disabled] .md-select-value .md-select-icon::after {
    color: rgba(0, 0, 0, 0.54) !important;
}
md-input-container .error-msg{
    /* position: absolute;
    top: 35px; */
    text-transform: capitalize;
    font-size: 11px;
} 
md-input-container md-icon {
    color: rgba(0, 0, 0, 0.24);
}
md-radio-button .md-label,
md-checkbox .md-label {
    color: rgba(0, 0, 0, .87)
}
md-checkbox.md-checked .md-icon::after{
	border-color: #fff !important;
}
md-radio-button.md-checked .md-label,
md-checkbox.md-checked .md-label,
md-radio-button.md-checked .md-label span,
md-checkbox.md-checked .md-label span {
    color: #000000;
}
.radio-tab md-radio-button.md-checked .md-label span {
    color: var(--secondary-text-color);
}
md-select[ng-disabled="true"] span,
md-select[ng-disabled="true"] span.md-select-icon {
    color: rgba(0, 0, 0, 0.87) !important;
    cursor: not-allowed;
}
md-select-menu md-content .md-checkbox-enabled[selected],
md-select-menu md-content .md-checkbox-enabled[selected]:focus {
    color: rgba(0, 0, 0, 0.87);
}
md-select-menu md-content .md-checkbox-enabled {
    color: rgba(0, 0, 0, 0.54);
}
.md-button[disabled] {
    cursor: not-allowed !important;
}
md-slider[disabled] .md-track-fill {
    display: block;
}

/*--- CARD VIEW STYLES ---*/

.card-grid-view {
    margin-top: 5px;
}
.card-grid-view md-card {
    border-radius: 0;
    display: inline-block;
    margin: 1%;
    vertical-align: top;
    width: 12%;
    position: relative;
}
.card-grid-view md-card-title-text {
    max-width: 100%;
}
.card-grid-view md-card-title-text .md-headline {
    font-size: var(--default-fontsize);
    font-weight: 600;
    text-transform: capitalize;
    line-height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-grid-view md-card-title-text .md-headline-tt {
	font-size: var(--default-fontsize);
    font-weight: 600;
    line-height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.settings-wrap.card-grid-view md-card-title-text .md-headline {
    min-height: 36px;
    white-space: normal;
    overflow: auto;
}
.card-grid-view .card-code {
    border: 1px solid var(--border-color);
    border-radius: 50%;
    height: 62px;
    line-height: 62px;
    margin: 10px auto;
    text-align: center;
    text-transform: uppercase;
    width: 62px;
}
.card-grid-view .card-content {
    align-items: center;
    display: flex;
    min-height: 130px;
    text-align: center;
}
.card-code p {
    color: var(--secondary-text-color);
    font-size: 24px;
    font-weight: 400;
}
.card-content > img {
    margin: 20px auto;
    max-width: 100%;
    max-height: 90px;
}
.card-grid-view md-card-title {
    padding: 13px;
}
.card-grid-view .md-menu .md-icon-button {
    height: auto;
    margin: 0;
    min-height: inherit;
    padding: 0;
    position: absolute;
    right: 0;
    top: 6px;
    width: auto;
}
.card-grid-view .md-menu md-icon {
    color: var(--secondary-text-color) !important;
}
.card-grid-view .clickable {
    cursor: pointer;
}
.card-grid-view .footer-heading {
    border-top: 1px solid var(--border-color);
}
.card-grid-view .footer-heading .md-headline {
    color: rgba(0, 0, 0, 0.87);
    font-size: var(--default-fontsize);
    font-weight: 400;
    text-align: left;
    text-transform: capitalize;
}
.card-grid-view md-card-actions {
    border-top: 1px solid var(--border-color);
    margin: 0;
    padding: 13px;
}
.footer-data label {
    color: rgba(0, 0, 0, 0.5);
    display: block;
    font-size: var(--default-fontsize);
    margin-bottom: 1px;
}
.card-grid-view .footer-data p {
    color: #58697e;
    font-size: 18px;
    font-weight: 300;
}
.card-grid-view .md-sublabel {
    color: rgba(0, 0, 0, .54);
    font-size: var(--default-fontsize);
}
.footer-data h5 {
    color: #58697e;
    font-size: var(--default-fontsize);
    font-weight: 400;
}
.card-grid-view .chart {
    height: 80px;
    margin: 0 auto;
    position: relative;
    width: 80px;
}
.card-grid-view .chart .text-wrap {
    border-radius: 50%;
    display: table;
    height: 80px;
    left: 50%;
    margin-left: -40px;
    margin-top: -40px;
    position: absolute;
    top: 50%;
    width: 80px;
    z-index: 2;
}
.card-grid-view .text-wrap > h3 {
    color: var(--secondary-text-color);
    display: table-cell;
    font-size: 22px;
    font-weight: 400;
    line-height: 18px;
    text-align: center;
    vertical-align: middle;
}
.card-grid-view .bg-image {
    background-size: 100% 100%;
    min-height: 130px;
    background-repeat: no-repeat;
}
.card-grid-view .bg-image.icon-black .md-menu md-icon {
    color: #000 !important;
}
.card-grid-view .footer-data.custom-data p {
    font-size: var(--default-fontsize);
    padding-right: 2px;
    text-transform: uppercase;
    word-break: break-all;
}

/*--- FORMLY STYLES ---*/

.formly_wrapper {
    width: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-grid-row-align: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
}
.formly_wrapper .formly-field,
.formly_wrapper .date {
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
    width: 31%;
    position: relative;
}
.formly-field-datepicker md-datepicker .md-datepicker-button {
    margin: 0;
    padding: 0;
}
.formly_wrapper .checkbox.formly-field-textarea,
.formly-field-datepicker md-input-container {
    width: 100%;
}
.formly_wrapper .width30 md-input-container,
.formly_wrapper .date md-input-container {
    display: block;
}
.formly_wrapper .date .md-datepicker-input-container {
    box-sizing: border-box;
    left: 0;
    padding-left: 55px;
    position: absolute;
    top: 25px;
    width: 100%;
    margin-left: 0;
}
.formly_wrapper .checkbox.formly-field-checkbox md-checkbox {
    margin-bottom: 0;
}
.formly_wrapper .date .md-datepicker-input-container input {
    width: 100%;
    max-width: inherit;
}
.formly_wrapper .radio {
    margin: 35px 0px;
    width: 100%;
}
.formly_wrapper .radio label {
    padding-left: 0px !important;
    position: relative;
    top: -32px;
}
.formly_wrapper label,
.formly_wrapper .md-label {
    text-transform: capitalize;
}
.formly_wrapper .checkbox md-input-container,
.formly_wrapper .radio md-input-container {
    width: 95%;
}
.formly_wrapper .radio md-radio-group {
    display: inline-block;
    margin-left: -22px;
}
.formly_wrapper .radio md-radio-group md-radio-button {
    margin-right: 10px;
    min-width: 125px;
    display: inline-block;
}
.formly_wrapper .date mdp-date-picker .md-icon-button {
    margin: 0;
    position: absolute;
    right: 0;
    padding: 0;
    top: 20px;
    z-index: 1;
}
.formly-field-datepicker md-input-container label:first-child {
    display: none;
}

/*--- NOTIFICATION MENU STYLES ---*/

.notify-btn {
    display: none;
}
.custom-mdmenu md-list-item:hover .notify-btn {
    display: block;
}
.custom-mdmenu md-list-item:hover {
    background: #eee;
}
.top_header_wrap .md-menu .md-button.md-icon-button {
    overflow: visible
}
.img-icon {
    border-radius: 50%;
    height: 45px;
    line-height: 45px;
    margin-right: 15px;
    text-align: center;
    width: 45px;
    min-width: 45px;
    margin-top: 0;
}
.img-icon.img {
    line-height: 70px;
}
.img-icon img {
    width: 30px;
    height: 30px;
}
.img-icon md-icon {
    color: var(--secondary-text-color);
    font-size: 20px;
    height: auto;
    line-height: 20px;
    min-height: inherit;
    min-width: inherit;
    width: auto;
}
.notify-list .attach-icon {
    font-size: 18px;
    margin-left: 10px;
    line-height: inherit;
    min-height: inherit;
    min-width: inherit;
    width: auto;
    height: auto;
    color: rgba(0, 0, 0, .54);
}
.custom-mdmenu .subheader {
    border-bottom: 1px solid var(--border-color);
    padding: 5px 0 5px 20px;
}
.custom-mdmenu .subheader h3 {
    font-size: 16px;
}
.notify-list md-list {
    max-height: 427px;
    margin-bottom: 50px;
}
.notify-list .clear-btn {
    bottom: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}
#list-wrapper {
    /* max-height: 300px; */
    overflow-y: auto;
    overflow-x: hidden;
}
.md-button.md-icon-button.showNotificationButton {
    overflow: visible;
}
.notification-count {
    border-radius: 18px;
    color: var(--secondary-text-color);
    font-size: 9px;
    min-height: 18px;
    line-height: 18px;
    text-align: center;
    min-width: 18px;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    top: 2px;
    right: 2px;
}
.notification-count {
    background:#F2760A;
}
.notify-list md-list-item .md-list-item-inner {
    width: 96% !important;
}
.notify-list md-list-item.md-2-line .md-list-item-text h3 {
    font-size: var(--default-fontsize);
}
.notify-list md-list-item.md-2-line .md-list-item-text p {
    font-size: 12px;
}
.notify-list md-list-item:nth-child(2n) {
    background: #f6f7f8 none repeat scroll 0 0;
}
.notify-list md-list-item {
    border-bottom: 1px solid var(--border-color);
    min-height: 60px;
}
.notify-list md-list-item.md-2-line::before,
.notify-list md-list-item.md-2-line > .md-no-style::before {
    min-height: 60px;
}
.notify-list md-list-item._md-button-wrap > div.md-button:first-child {
    padding: 0 10px;
}
.notify-btn.md-button.md-icon-button {
    width: inherit;
}
md-menu-content.custom-mdmenu.notification::before,
md-menu-content.custom-mdmenu.notification::after {
    right: 115px;
}
.no-notification {
    height: auto;
    min-height: inherit;
    text-align: center;
}
.no-notification md-icon {
    font-size: 80px;
    height: auto;
    width: auto;
    color: rgba(0, 0, 0, .54);
}
.no-notification h2 {
    font-weight: 400;
    font-size: var(--default-fontsize);
    text-transform: capitalize;
    color: rgba(0, 0, 0, .54);
}
md-menu-content.custom-mdmenu.notification {
    overflow: visible !important;
    min-width: 384px;
    max-width: 384px;
}
.check-list li .md-label span {
    display: block;
    word-break: break-all;
}
.nicescroll-rails {
    transition: none !important;
}
.priority-level {
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 0px 5px;
	background: var(--secondary-bg-color);
	text-transform: capitalize;
	min-width: 56px;
	text-align: center;
}
.priority-level.high {
	border-color: #F83F47;
	color: #F83F47;
}
.priority-level.medium {
	border-color: #00bcd4;
	color: #00bcd4;
}
.priority-level.low {
	border-color: #ccc;
	color: rgba(0,0,0,0.54);
}
.notify-list md-list-item .md-list-item-inner .download-btn {
	width: 24px;
	height: 24px;
	min-height: 24px;
	line-height: 24px;
}
.notify-list md-list-item .md-list-item-inner .download-btn md-icon{
	line-height: 24px;
	font-size: 16px;
}
.notify-list md-list-item .md-list-item-inner .close-record {
	width: 24px;
	height:24px;
	min-height:	24px;
	line-height: 24px;
	position: absolute;
	right: -6px;
	top: 1px;
}
.notify-list md-list-item .md-list-item-inner .close-record md-icon {
	font-size: 18px;
	line-height: 24px;
}

/*--- 503 ERROR PAGE STYLES ---*/

.restricted-area {
    max-width: 500px;
    text-align: center;
    width: 100%;
}
.restricted-area h1 {
    color: #566781;
    font-size: 25px;
    font-weight: 300;
    text-align: center;
}
.restricted-area p {
    color: rgba(0, 0, 0, 0.75);
    font-size: 16px;
    font-weight: 400;
    margin: 15px 0;
}
.restricted-area a {
    color: #345995;
    font-size: 16px;
    text-decoration: none;
}
.restricted-area md-icon {
    font-size: 22px;
    color: #345995;
}
.fullDocViewer {
    width: 100%;
    margin: 0px auto;
    position: fixed;
    display: block;
    top: 60px;
    z-index: 999;
    height: 100%;
}

/*--- SERVER ERRORS STYLES ---*/

.service_errors {
    cursor: pointer;
    padding: 7px 10px 7px 16px; 
    border-radius: 5px;
}

.service_errors .md-button {
    margin: 0;
}
.service_errors .md-button md-icon.black-text {
    color: rgba(0,0,0,0.54) !important;
}
.service_errors h2 {
    margin-bottom: 5px;
}
.service_errors #otherErrorPanDiv {
    font-size: 12px;
    width: 100%;
}
html[lang="en"] footer.footer-section {
    width: calc(100% - 64px);
    left: 64px;
}
html[lang="ar"] footer.footer-section {
    width: calc(100% - 64px);
    right: 64px;
    left: auto;
}
/* .service_errors:not(.hide) ~ div .content_area_wrapper,
body.errorVisible .content_area_wrapper:not(.wizards-wrapper),
body.notification .content_area_wrapper:not(.wizards-wrapper),
body.staticBanner .content_area_wrapper:not(.wizards-wrapper){
    height: calc(100% - 100px);
}
body.notification.errorVisible .content_area_wrapper:not(.wizards-wrapper),
body.notification.staticBanner .content_area_wrapper:not(.wizards-wrapper),
body.errorVisible.staticBanner .content_area_wrapper:not(.wizards-wrapper) {
	height: calc(100% - 150px);
}
body.notification.errorVisible.staticBanner .content_area_wrapper:not(.wizards-wrapper) {
	height: calc(100% - 200px);
} */
.service_errors a {
    text-decoration: underline;
    color: inherit;
}
div#errorDisplayDiv {
    /* background: #666; */
    cursor: default;
}

/*--- PREVIEW MODAL ---*/

.preview-height {
    height: calc(100% - 50px);
    display: flex;
}
md-dialog.preview-modal {
    box-shadow: none;
    flex-direction: column;
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    height: 100%
}
md-dialog.preview-modal.md-default-theme,
md-dialog.preview-modal {
    background: transparent;
}
.preview-modal .custom-dialog md-toolbar .md-toolbar-tools {
    background: #555;
}
md-dialog.preview-modal md-dialog-content {
    align-items: center;
    display: flex;
    height: 100%;
    min-width: 100%;
    overflow: hidden;
}
.center-alignment {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
#outerLayer {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
}
#templateId {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    padding: 2px;
}
.center-alignment.no-center {
    position: static;
    transform: none;
}
.tc_bg {
    height: 990px;
}

/*--- CUSTOM BUTTON STYLES ---*/

.button {
    height: 32px;
    line-height: inherit;
    min-height: inherit;
    min-width: inherit;
    padding: 0;
    width: 32px;
}
html[lang="en"] .button:last-child {
    margin-right: 0;
}
html[lang="ar"] .button:last-child {
    margin-left: 0;
}
html[lang="ar"] .fabtooltip, html[lang="ar"] .discussionFabtooltip {
	-webkit-transform: translate(70px, 0px);
	transform: translate(70px, 0px);
}

.button md-icon {
    height: auto;
    line-height: inherit;
    min-height: inherit;
    font-size: 18px;
}
.button i {
    font-size: 22px;
}
.md-dark {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    border: 1px solid var(--border-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: rgba(0, 0, 0, 0.87) !important;
    margin-right: 20px;
}
.footer-btns {
    /* margin-right: 16px; */
    text-align: right;
}
.footer-btns .md-button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    font-size: var(--default-fontsize);
    font-weight: 600;
}
.footer-btns .md-button.text-dark {
    color: rgba(0,0,0,.87) !important;
}
.browse-btn {
    height: auto;
    line-height: inherit;
    margin-left: 20px;
    min-height: inherit;
    padding: 5px;
    width: auto;
}
.btn-wrap {
    margin-bottom: 30px;
    margin-right: 20px;
    margin-top: 30px;
}
.btn-wrap button {
    margin-left: 30px;
    margin-right: 0;
}
.md-dark.md-button:hover:not([disabled]) {
    background-color: #f9f9f9;
}
.md-button.md-fab.md-mini {
	z-index: 1;
}

/*---CUSTOM SUBHEADER STYLES ---*/

.md-subheader-cust {
    border-bottom: medium none;
    z-index: inherit;
    padding: 6px 25px;
}
.md-header-cust {
    min-height: 60px;
}
.md-header-cust .md-toolbar-tools {
    height: 60px;
    max-height: 60px;
}
.md-header-cust .md-toolbar-tools md-icon.material-icons {
    line-height: inherit;
    min-height: inherit;
    font-size: 21px;
}
.md-toolbar-tools .md-button.md-primary {
    color: var(--secondary-text-color);
}
md-content .increment_button.md-button md-icon.material-icons {
    color: #000 !important;
}
.md-header-cust .md-toolbar-tools,
.panel-widget .md-toolbar-tools {
    font-size: 15px;
    padding: 0 30px;
    text-transform: uppercase;
}
.md-toolbar-tools > .md-button:first-child {
    margin-left: 0;
}
.header-nav-band .md-toolbar-tools {
	padding-left: 25px;
}
.header-nav-band .md-toolbar-tools .md-icon-button {
    margin-right: 2px;
	height: 26px;
	line-height: 26px;
	margin-left: 0px;
	min-height: 26px;
	min-width: inherit;
	padding: 2px 0;
	text-align: left;
	width: 26px;
}
.md-header-cust .md-icon-button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
    height: 26px;
    line-height: 26px;
    margin: 0;
    min-height: 24px;
    min-width: inherit;
    padding: 0;
    text-align: left;
    width: 26px;
}

/*--- HEADER TABS STYLES ---*/

.header-tabs md-tabs-canvas,
.header-tabs md-pagination-wrapper {
    height: 50px;
}
.header-tabs .md-tab {
    line-height: 32px;
}
.header-tabs md-ink-bar {
    height: 4px;
}
md-tabs.header-tabs:not(.md-no-tab-content):not(.md-dynamic-height) {
    min-height: inherit;
}
md-toolbar.md-green-theme:not(.md-menu-toolbar) .header-tabs md-icon {
    color: rgba(0,0,0,0.54);
    fill: rgba(0,0,0,0.54);
}

/*--- MD DIALOG STYLES ---*/

.custom-dialog .md-toolbar-tools h2,
.custom-dialog .md-toolbar-tools h3 {
    font-size: 16px;
    text-transform: capitalize;
    font-weight: 600;
}
md-dialog md-dialog-actions .md-button {
    background: none !important;
}
.md-dialog-content-body p {
    font-size: var(--default-font14);
    text-transform: none;
}
.custom-dialog .add-wrap {
    padding-left: 20px;
    padding-right: 20px;
}
.md-button.md-cancel-button.md-primary {
	color: rgba(0, 0, 0, 0.5);
}


/*--- SWITCH STYLES ---*/

.switch-view md-switch {
    display: inline-block;
    height: inherit;
    margin: 0;
    vertical-align: middle;
}
.switch-view span {
    color: rgba(0, 0, 0, .54);
    display: inline-block;
    font-weight: 400;
    text-align: left;
    width: 60px;
    line-height: 22px;
}

/*--- MENU SETTINGS STYLES ---*/
.helpCenter {
    position: absolute;
    right: 83px;
    top: 23px;
    width: 24px;
    height: 24px;
    z-index: 11;
}
html[lang="ar"] .helpCenter { 
	right: auto;
	left: 83px;
}
.rightMenuSettings md-list md-list-item.logOut {
	margin-top: 15px;
	padding-top: 15px;
	border-top: solid 1px var(--asidemenusecondarybordercolor);
}
.rightMenuSettings md-list::-webkit-scrollbar-thumb {
	background-color: var(--asidemenusecondarybordercolor);
}
.rightMenuSettings md-menu-item md-menu {
    padding: 0;
}
.rightMenuSettings a.md-button {
    background: none !important;
    text-transform: capitalize;    
    font-size: var(--default-fontsize);
    min-width: 100%;
    margin: 0;
    height: 40px;
    text-align: inherit;
    padding: 0 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    font-weight: 600;
    border-radius: 6px;
} 
.rightMenuSettings a.md-button:hover {
    background-color: var(--asidemenuactive) !important;
    color: var(--asidemenubgsecondarycolor);
}

.rightMenuSettings md-list md-icon,
.rightMenuSettings md-list i  { 
    color: unset !important;
    fill: unset !important;   
    margin-right: 16px;
    font-size: 20px;
    width: 20px;
    min-width: 20px;
    min-height: 20px;
    line-height: 20px;
    height: 20px;
}
.profileMenu .rightMenuSettings a.md-button i, .profileMenu .rightMenuSettings md-list-item span i {    
    margin-right: 10px;
}
.menu-level {
    padding: 0;
}
.menu-level a md-icon {
    color: #00bcd4;
    font-size: 21px;
    line-height: 36px;
    margin-left: 5px;
    margin-right: 0;
    min-height: inherit;
}
.menu-level a.md-active md-icon {
    color: var(--secondary-text-color);
}
.menu-level a.md-button>span {
    display: inline-block;
    max-width: 85%;
    overflow-wrap: break-word;
    vertical-align: top;
    width: 100%;
    font-size: var(--default-fontsize);
}


/*--- MDCHIPS STYLES ---*/

md-chips md-chip.md-focused {
    color: rgb(66, 66, 66);
}
md-chips .md-chips.md-removable.md-focused {
    box-shadow: none;
}
md-chips.custom-chips .md-chips md-chip {
    background: transparent;
    border: 1px solid #ccc;
    line-height: 29px;
}

/*--- STEPPER STYLES ---*/

/*--- Inline Stepper Tabs Styles Starts---*/

md-tabs-content-wrapper,
[md-swipe-left], 
[md-swipe-right] { 
	touch-action: pan-y; 
}

.modal-tabs.inline-tabs .md-tab h3 > label {
    position: relative;
    padding: 0 7px 0 0;
    box-sizing: border-box;
    margin-left: -3px;
    background: #fafafa;
    z-index: 2;
}
.modal-tabs.inline-tabs .md-tab::after{
	margin-top: 0;
}
.modal-tabs.inline-tabs .md-tab[disabled="disabled"] h3 label {
	opacity: 1;
}
.modal-tabs.inline-tabs .md-tab[disabled="disabled"] h3 span label {
    background: rgba(0,0,0,0.38);
    opacity: 1;
}
.modal-tabs.inline-tabs .md-tab.md-completed:not(.md-active) .completed-state, 
.modal-tabs.inline-tabs .md-tab.md-active .current-state,
.modal-tabs.inline-tabs .md-tab:not(.md-active):not(.md-completed) h3 .normal-state {
    display: inline-block;
}
.modal-tabs.inline-tabs .md-tab h3 span {
    vertical-align: middle;
}

/*--- Inline Stepper Tabs Styles Ends---*/

md-tabs {
    border-radius: 0;
}
.md-tab {
    font-size: var(--default-fontsize);
}
.custom-tab .md-tab {
    font-weight: 500;
}
.custom-tab md-input-container label,
.custom-tab .md-select-value.md-select-placeholder,
.custom-tab .md-select-value.md-select-placeholder span {
    color: rgba(34, 34, 34,.75);
}
md-tabs.modal-tabs md-tabs-wrapper {
    padding: 30px 0 20px;
}
.custom-dialog md-tabs.modal-tabs md-tabs-wrapper {
    padding: 25px 0 10px;
}
.modal-tabs .md-tab.md-disabled {
    opacity: 1;
    pointer-events: none !important;
}
.modal-tabs .md-tab h3 {
    font-size: var(--default-fontsize);
    font-weight: normal;
    text-transform: capitalize;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
}
.modal-tabs .md-tab h3 span {
    border-radius: 50%;
    box-sizing: border-box;
    display: block;
    height: 30px;
    line-height: 30px;
    margin: 0 auto;
    overflow: hidden;
    padding: 5px;
    position: relative;
    text-align: center;
    width: 30px;
    z-index: 2;
}
.modal-tabs .md-tab:first-child h3::before,
.modal-tabs .md-tab:last-of-type h3::before {
    width: 50%;
}
.modal-tabs .md-tab:first-child h3::before {
    left: calc(50% + 8px);
}
.modal-tabs .md-tab h3 span label {
    border-radius: 50%;
    display: block;
    height: 18px;
    width: 18px;
    line-height: 18px;
    cursor: pointer;
    font-size: 12px;
}
.modal-tabs .md-tab[disabled="disabled"] h3 label {
    opacity: 0.5;
}
.modal-tabs md-tabs-canvas,
.modal-tabs md-pagination-wrapper {
    height: auto;
    width: 100% !important;
    text-align: center;
    margin: 0 auto;
}
.modal-tabs md-pagination-wrapper {
    height: auto;
    position: relative;
}
.modal-tabs .md-tab.md-active h3 {
    font-weight: 400;
}
.modal-tabs .md-tab.md-active h3 span {
    font-weight: normal;
}
.modal-tabs .md-tab h3 span md-icon {
    font-size: var(--default-fontsize);
    line-height: inherit;
    min-width: inherit;
    width: auto;
}
.modal-tabs .md-tab h3 .current-state,
.modal-tabs .md-tab h3 .completed-state,
.modal-tabs .md-tab.md-active .normal-state,
.modal-tabs .md-tab.md-completed:not(.md-active) .current-state,
.modal-tabs .md-tab.md-completed:not(.md-active) .normal-state,
.modal-tabs md-ink-bar {
    display: none;
}
.modal-tabs .md-tab.md-completed:not(.md-active) .completed-state,
.modal-tabs .md-tab.md-active .current-state {
    display: block;
}
.modal-tabs .md-tab h3::before {
    box-sizing: border-box;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: 15px;
    width: 100%;
    background: #a6a6a6;
}
.modal-tabs .md-tab::after {
    content: "";
    height: 1px;
    margin-top: -12px;
    position: absolute;
    top: 50%;
    z-index: 1;
    width: 0;
    transition: all .5s ease 0s;
}
.modal-tabs md-tab-item.md-tab {
    overflow: visible;
}
.modal-tabs .md-completed::after {
    width: 100%;
}
.modal-tabs .md-ripple-container,
.modal-tabs .md-tab:first-child::before,
.modal-tabs .md-tab:last-of-type::after,
.modal-tabs md-input-container .md-errors-spacer {
    display: none
}
.modal-tabs md-tab-item.md-tab {
    pointer-events: none;
}
.modal-tabs md-tab-item.md-tab.md-completed {
    pointer-events: inherit;
}
/* .modal-tabs md-tab-item.md-tab.md-completed.md-active + .md-tab,
.modal-tabs md-tab-item.md-tab.md-completed.md-active + .md-completed + .md-tab {
    pointer-events: auto;
} */
.md-dark.md-button + .md-raised {
    margin-right: 0;
}
.empty-content {
    display: flex;
    min-height: 350px;
}


/*--- ACCORDIAN STYLES ---*/

.item.disabled {
    opacity: 0.6;
    pointer-events: none;
}
.user.tile {
    border: 1px solid var(--border-color);
    border-bottom: none;
}
md-item:last-child .user.tile,
md-item:last-of-type .user.tile {
    border-bottom: 1px solid var(--border-color);
}
.item .user {
    background-color: var(--secondary-bg-color);
}
.item .user:first-child {
    margin-top: 0;
}
.item .user .expanded {
    display: none;
    color: #666;
    box-shadow: none;
}
.item .folded {
    padding: 15px 30px;
    cursor: pointer;
    transition: background .2s ease;
}
.folded.active {
    color: rgba(0, 0, 0, 0.87);
    display: block;
    border-bottom: 1px solid var(--border-color);
}
.folded.active md-icon {
    color: rgba(0, 0, 0, 0.54);
}
.folded md-icon {
    display: none;
}
.folded:not(.active) md-icon.down-icon,
.folded.active md-icon.up-icon {
    display: inline-block;
}

/*--- ACCORDIAN MENU STYLES ---*/

.accordian-menu .item .folded {
    padding: 0;
}
.accordian-menu .item .user {
    margin-bottom: 0;
    background: inherit;
}
.accordian-menu .user.tile {
    border-radius: 0;
    box-shadow: inherit;
    border: inherit !important;
}
.accordian-menu .user.tile.selected {
    border: inherit !important;
}
.accordian-menu.left-menu .expanded .md-button {
    padding-left: 40px;
}

/*--- LANDING PAGE STYLES ---*/

.styling-wrap {
    background: #f6f7f8 none repeat scroll 0 0;
    font-size: var(--default-fontsize);
    font-weight: 400;
    margin-bottom: 10px;
    margin-top: 50px;
    max-width: 768px;
    padding: 20px;
    text-align: center;
    width: 100%;
}
.styling-wrap p {
    margin: 10px 0;
}
.styling-wrap p:first-child {
    font-size: 24px;
}
.styling-custom-button {
    font-size: 16px;
    min-width: 200px;
    padding: 5px 10px;
}
md-slider .md-slider-wrapper {
    cursor: pointer;
}

/*--- CUSTOM TOOLTIP STYLES ---*/

.tooltip {
    display: none;
    position: absolute;
    background-color: #222;
    padding: 5px 3px;
    color: var(--secondary-text-color);
    font-size: 10px;
    z-index: 100;
    min-width: 100px;
    text-align: center;
    max-width: 460px;
}
.tooltip-show {
    display: inherit;
}
.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
}
.tooltip-down .tooltip-arrow {
    border-bottom: 5px solid #222222;
    border-left: 5px solid rgba(0, 0, 0, 0);
    border-right: 5px solid rgba(0, 0, 0, 0);
    left: 50%;
    margin-left: -5px;
    top: -5px;
    z-index: 9;
}
.tooltip-top .tooltip-arrow {
    bottom: -5px;
    left: 50%;
    margin-left: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #222;
    z-index: 9;
}
.tooltip-right .tooltip-arrow {
    left: -5px;
    top: 50%;
    margin-top: -5px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #222;
    z-index: 9;
}
.tooltip-left .tooltip-arrow {
    right: -5px;
    top: 50%;
    margin-top: -5px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #222;
    z-index: 9;
}

/*--- CUSTOM MDMENU STYLES  ---*/
 
.custom-mdmenu {
    overflow: auto;
    height: calc(100% - 56px);
}
.custom-mdmenu ul {	
    display: flex;
    flex-direction: row;
    flex-flow: wrap;
    margin: 0;	
    padding: 16px;
    padding-top: 6px;
}
.custom-mdmenu ul li {
   	width: 33.33%;
    list-style-type: none;
    padding: 10px 6px;
	
}
.custom-mdmenu ul li a {
    box-sizing: border-box;
    color: var(--primary-text-color);
    display: block;
    text-decoration: none; 
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.custom-mdmenu ul li a i{
    width: 36px;
}
.custom-mdmenu h3 {
    font-size: 12px;
    font-weight: 500; 
    margin: 10px auto;    
}
.icon-image i {
    font-size: 36px;
}
.icon-image img {
    width: 36px;
    height: 36px;
}
md-menu-content.custom-mdmenu::before,
md-menu-content.custom-mdmenu::after {
    border-bottom: 10px solid #fff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    position: absolute;
    right: 80px !important;
    top: -9px;
    z-index: 1;
}
md-menu-content.custom-mdmenu::after {
    border-bottom: 12px solid var(--border-color);
    border-left: 11px solid transparent;
    border-right: 10px solid transparent;
    top: -12px;
    z-index: 0;
}

/*--- CUSTOM CARDS STYLES ---*/

.card-views .adm-process h3 {
    color: rgba(0, 0, 0, 0.87);
    font-size: var(--default-fontsize);
    padding: 10px 0;
    text-align: center;
    min-width: 105px;
}
.card-views .adm-check {
    background: #adc8e5;
}
.card-views .adm-check .md-checked {
    background: #00bcd4;
}
.card-views .adm-check .md-checked .md-label {
    opacity: 1;
}
.card-views .adm-check .md-label {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    display: block;
    margin-left: 50px;
    min-height: 150px;
    opacity: 0.5;
    padding: 20px 30px 10px;
    text-align: center;
}
.card-views .adm-check md-checkbox {
    display: block;
    min-height: 150px;
    width: 100%;
}
.card-views .circle-code {
    background-color: #5bcceb;
    border-radius: 50%;
    color: var(--secondary-text-color);
    font-size: 18px;
    height: 42px;
    line-height: 44px;
    margin: 15px auto 5px;
    width: 42px;
}
.card-views .adm-check .md-container {
    left: 15px;
}
.card-views .adm-check .md-primary:not([disabled]):not(.md-checked) .md-icon {
    display: none;
}
.card-views > div {
    display: inline-block;
    margin: 1%;
    vertical-align: middle;
    width: 18%;
}
.content-view .md-header-cust,
.map-widget .md-header-cust {
    z-index: inherit;
}

/*--- LEFT MENU STYLES ---*/

.left-menu md-list {
    padding: 0;
}
.left-menu md-item,
.left-menu md-item-content {
    display: block;
}
.left-menu .md-button.md-primary {
    border-left: 6px solid rgba(0, 0, 0, 0);
    border-radius: 0;
    color: rgba(0, 0, 0, 0.87);
    margin: 0;
    padding: 8px 15px;
    text-align: left;
    width: 100%;
}
.left-menu .md-raised {
    width: inherit;
}
.content-view .md-header-cust {
    border-bottom: medium none;
    z-index: inherit;
}

/*--- WEBCAM UPLOAD STYLES ---*/

img-crop {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    overflow: hidden;
}
img-crop canvas {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    outline: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
.upload-croparea {
    overflow: hidden;
    width: 100%;
    height: 160px;
}
.cropped-img img {
    height: 160px;
    width: 160px;
    border-radius: 50%;
}
.upload-croparea img {
    margin: 0 auto;
    max-width: 100%;
    height: 100%;
}
.webcam-wrap {
    max-width: 300px;
}
.custom-cam video {
    max-width: 100%;
    height: inherit;
}

/*--- SELECT DROPDOWN STYLES ---*/

.select-dropdown {
    position: relative;
    z-index: 1;
}
.select-dropdown select {
    width: 100%;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 30px;
    color: rgba(0, 0, 0, .54);
    background-color: transparent;
    text-transform: capitalize;
    padding-left: 3px;
}
html[lang="ar"] .select-dropdown select {
	padding-left: 0;
	padding-right: 3px;
}
.select-dropdown select[disabled="disabled"],
.formly_wrapper .date md-datepicker[disabled="disabled"] input {
   	background-image: -webkit-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: -moz-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: -ms-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    border-bottom: none;
    background-position: bottom 0px left 0;
    background-repeat: repeat-x;
    background-size: 4px 1px;
    color: rgba(0, 0, 0, .87) !important
}
.select-dropdown select option {
    color: rgba(0, 0, 0, .87);
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    text-transform: capitalize;
}
.select-dropdown select option:disabled {
    color: rgba(0, 0, 0, .54);
}
.select-dropdown select.ng-not-empty {
    color: rgba(0, 0, 0, 0.87);
    border-color: rgba(0, 0, 0, 0.12);
}
.select-dropdown .ng-untouched.ng-invalid {
    box-shadow: none;
}
md-input-container.select-dropdown .ng-not-empty ~ label,
md-input-container.select-dropdown .ng-empty ~ label {
    bottom: inherit;
    color: rgba(34, 34, 34, 0.75) !important;
    font-size: 11px;
    opacity: 1;
    overflow: visible !important;
    position: absolute;
    top: -40px;
    z-index: 22;
    transition: all 0.5s ease 0s !important;
}
md-input-container.select-dropdown .ng-empty ~ label {
    color: rgba(34, 34, 34, 0.75) !important;
    font-size: var(--default-fontsize);
    top: 6px;
    transform: translate3d(0, 0px, 0) scale(1);
    transition: all 0.5s ease 0s !important;
}
md-input-container.select-dropdown .ng-empty[disabled] ~ label {
    color: rgba(34, 34, 34, 0.75) !important;
}
.select-dropdown label::after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #757575;
    bottom: -15px;
    content: "";
    position: absolute;
    right: 12px;
    z-index: 99;
    visibility: visible;
    transition: none !important;
}
md-input-container.select-dropdown .ng-empty ~ label::after {
    bottom: 5px;
    transition: none !important;
}
md-input-container.select-dropdown .ng-not-empty ~ label::after {
    border-top: 5px solid rgba(0, 0, 0, 0.87);
}
md-input-container.select-dropdown .ng-not-empty[disabled] ~ label::after {
    border-top: 5px solid #757575;
}

/*--- PRINTABLES CODE ---*/

.printableseditor {
    height: calc(100% - 85px);
}
.printableseditor .cke_inner,
.printableseditor .cke_reset {
    height: 100% !important;
}
.printableseditor .cke_reset .cke_contents.cke_reset {
    height: calc(100% - 125px) !important;
}
.editorbtns {
    padding: 15px 20px 0px;
}

/*--- FILTER MENU STYLES ---*/


md-select-menu .md-checkbox-enabled[selected] .md-icon:after {
    border-color: #fff;
}
.md-select-menu-container.md-active,
md-backdrop.md-select-backdrop,
.md-dialog-menu.md-dialog-is-showing md-backdrop.md-menu-backdrop {
    z-index: 102;
}
.md-dialog-container,
.md-virtual-repeat-container.md-autocomplete-suggestions-container,
md-tooltip,
.md-open-menu-container {
    z-index: 101;
}
.md-dialog-menu.md-dialog-is-showing .md-open-menu-container {
    z-index: 102;
}

/* md menu container is the first accessible block in any screen(after closing md menu container we can access other elements)  */
/* md-backdrop.md-menu-backdrop {
    z-index: 103;
}
.md-open-menu-container {
	z-index: 104;
} */

md-menu-content.filter-content {
    padding-top: 0;
    max-height: inherit;
    min-width: 450px;
    max-width: 450px;
    min-height: 280px;
}
.filter-content md-toolbar {
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 10px;
    min-height: 50px;
}
.filter-content .md-toolbar-tools {
    background: var(--secondary-bg-color);
    font-size: 16px;
    height: auto;
    padding: 7px 16px;
    min-height: inherit;
    max-height: 50px;
}
.filter-content .md-toolbar-tools h2,
.filter-content .md-toolbar-tools md-icon {
    color: rgba(0,0,0,.87) !important;
}
.filter-content md-menu-item > * {
    box-sizing: border-box;
}
.filter-content md-menu-item {
    margin-top: 10px;
    height: auto;
}
html[lang="ar"] .filter-content .navigationheader-legend, html[lang="ar"] .filter-content .lms-navigationheader-legend, html[lang="ar"] .filter-content .custom-input-field {
    margin-left: 0;
}




/*--- UNKNOWN STYLES ---*/

.gc_top md-menu .md-icon-button:hover md-icon {
    color: var(--secondary-text-color) !important;
}
h3.md-subhead {
    margin: 0;
    padding: 20px 25px;
    text-transform: capitalize;
}
md-slider .md-sign .md-thumb-text {
	color: var(--secondary-text-color);
}
/*======================================
		CUSTOM COMPONENTS
========================================*/

/*--- CHECKBOX STYLES ---*/

.checkbox-style ul {
    padding-left: 20px;
}
.checkbox-style md-checkbox {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    border: 1px solid #e1e1e1;
    padding: 15px 20px;
    margin-bottom: 0;
    width: 100%;
    min-width: 150px;
}
.checkbox-style > md-checkbox {
    width: auto;
    min-width: 200px;
}
.checkbox-style .md-icon {
    margin-left: 15px;
    border-radius: 50%;
    background: #EAEAEA;
    border-color: transparent !important;
}
.checkbox-style md-checkbox.md-checked .md-container .md-icon:after {
    border-color: #fff;
}
.checkbox-style md-checkbox .md-container.md-ink-ripple:before {
    display: none;
}

/*--- RADIO BUTTONS STYLES ---*/

.radio-style ul {
    padding-left: 20px;
}
.radio-style md-radio-button {
    background: var(--secondary-bg-color) none repeat scroll 0 0;
    border: 1px solid #e1e1e1;
    padding: 15px 20px;
    margin-bottom: 15px;
    width: 100%;
    min-width: 120px;
    text-align: center;
    text-transform: capitalize;
}
.radio-style .md-container {
    display: none
}
.radio-style .md-label {
    margin-left: 0;
}

/*--- FILE UPLOAD STYLES ---*/

.drop-area {
	position: relative;
}
.drop-box {
    background: #fefefe none repeat scroll 0 0;
    border: 1px dashed #ddd;
    box-sizing: border-box;
    cursor: pointer;
    min-height: 220px;
    padding: 10px;
    position: relative;
    text-align: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-grid-row-align: center;
    align-items: center;
    -webkit-align-content: center;
    align-content: center;
}
.drop-area md-icon {
    color: rgba(0, 0, 0, 0.3);
    font-size: 42px;
    height: auto;
    width: auto;
}
.drop-area .drop-text {
    font-size: var(--default-fontsize);
    font-weight: 400;
}
.drop-area .drop-text span {
    display: block;
    margin: 3px 0;
}
.droppable + div {
    width: 100%;
}
.drop-icon {
    width: 40px;
    height: 40px;
    margin: 10px auto;
    border-radius: 50%;
    border: 2px solid #ccc;
    box-sizing: border-box;
    text-align: center;
}
.drop-icon md-icon {
    font-size: 26px;
    margin: 0 auto;
    min-height: inherit;
    min-width: inherit;
    display: block;
    width: 26px;
    height: 26px;
    line-height: 38px;
}
.drop-box p {
    color: rgba(0, 0, 0, 0.4);
    margin: 2px 0;
}
.upload-files {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 100%;
}
.response {
    color: rgba(0, 0, 0, 0.6);
    list-style: outside none none;
    margin: 30px 0;
}
.response p {
    margin: 5px 0;
}
.progress {
    background: #ccc none repeat scroll 0 0;
    border-radius: 10px;
    display: block;
    width: 100%;
    height: 5px;
}
.programming .progress {
    background: rgb(32 174 91) none repeat scroll 0 0;
    border-radius: 10px;
    display: block;
    width: 100%;
    height: 5px;
}
.progress div {
    border-radius: 10px;
    height: 5px;
    transition: all 1s ease 0s;
    width: 0;
}
.sel-file img {
    width: 28px;
}
.err-content .sel-file > div {
    background: #f6f7f8 none repeat scroll 0 0;
    border: 1px solid var(--border-color);
    line-height: 14px;
    padding: 7px 15px;
}
.err-content .sel-file p {
    color: #00bcd4;
    font-weight: normal !important;
}
.entry-wrap {
    background: #f4f5f6 none repeat scroll 0 0;
    list-style: outside none none;
    margin: 0;
    padding: 25px;
}
.entry-wrap li {
    border-right: 1px solid var(--border-color);
    line-height: 24px;
    padding: 15px;
    text-align: center;
    font-size: 15px;
}
.entry-wrap li:last-child {
    border-right: none;
}
.entry-wrap li span {
    color: rgba(0, 0, 0, .54);
    display: block;
    font-size: 18px;
    font-weight: bold;
}
.entry-wrap li .md-icon-button {
    width: auto;
    height: auto;
    min-height: inherit;
    padding: 0;
}
.entry-wrap li span .md-icon-button md-icon {
    font-size: 18px;
    width: inherit;
    height: inherit;
    min-width: inherit;
    min-height: inherit;
}

/*--- INCREMENT/DECREMENT BUTTONS STYLES ----*/

.plus_minus ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}
.plus_minus ul li {
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
}
.increment_button {
    border-radius: 0px;
    line-height: 26px;
    margin: 0px 2px;
    min-height: inherit;
    min-width: inherit;
    opacity: 0.5;
    padding: 0px;
}
.increment_button .sm-icon {
    font-size: 18px !important;
    line-height: 22px;
    color: #000;
}
.plus_minus md-input-container .md-input {
    font-size: var(--default-fontsize);
    height: auto;
    line-height: 26px;
    margin-top: 0px;
    padding: 0px;
    text-align: center;
    /* width: 50px; */
    width: 100%;
}

/*--- THEME SETTING STYLES ---*/

.theme-settings {
    position: fixed;
    right: -200px;
    top: 200px;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
    z-index: 8;
}
.theme-settings.active {
    right: 0px;
}
.theme-settings .ts-button {
    position: absolute;
    left: -36px;
    height: 36px;
    width: 36px;
    top: 10px;
    background: #294040;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
    border-radius: 5px 0px 0px 5px;
    font-size: 19px;
    color: var(--secondary-text-color);
    line-height: 34px;
    text-align: center;
    cursor: pointer;
}
.theme-settings .ts-body {
    width: 200px;
    background: #294040;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
    border-radius: 5px 0px 0px 5px;
    padding: 15px;
    box-sizing: border-box;
    color: var(--secondary-text-color);
}
.theme-settings .ts-body .ts-title {
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 5px;
    margin-top: 10px;
    text-transform: uppercase;
}
.ts-themes ul {
    padding-left: 0;
}
.ts-themes li {
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height: 60px;
    box-shadow: none;
    opacity: .8;
    margin-right: 5px;
    margin-bottom: 10px;
    margin-left: 5px;
}
.ts-themes li a {
    display: block;
    width: 100%;
    height: 100%;
    border-bottom: 16px solid;
    text-align: center;
    background: var(--secondary-bg-color);
    line-height: 42px;
    box-sizing: border-box;
}

/*--- SWITCH BRANCH STYLES ---*/

.card-grid-view.branch-card md-card {
    width: 120px;
    margin: 0;
    border: 1px solid var(--border-color);
    box-shadow: none;
}
.card-grid-view.branch-card .card-content {
  	min-height:auto;
}
.card-grid-view.branch-card .card-content img {
    margin: 0 auto;
    width: 65%;
    height: auto;
}
.branch-content {
    width: 120px;
    white-space: nowrap;
    display: block;
    margin: 0 auto;
}
.branch-content p {
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 5px 0 0 0;
}

/*--- SESSION WISE DISABLE BUTTONS ---*/

md-switch[disable="disableIt"][disabled],
md-select[disable="disableIt"][disabled] {
    pointer-events: none;
    cursor: not-allowed;
}

/*--- FIXED FOOTER STYLES ---*/

.fixed-footer-table {
	margin-bottom: 57px;	
}
.fixed-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 8;
    background: var(--secondary-bg-color);
    margin: 0 !important;
    box-shadow: 0px 0px 6px rgba(0,0,0,.1);
}
.row-adjust .md-icon-button.md-button {
    margin: 0;
    padding: 5px;
    width: auto;
    height: auto;
    min-height: inherit;
}
.lh14 table.md-table tbody.md-body > tr.md-row {
    height: 38px;
}
.lh16 table.md-table tbody.md-body > tr.md-row {
    height: 44px;
}
.lh18 table.md-table tbody.md-body > tr.md-row {
    height: 48px;
}

.studentList {
	overflow: auto;
}
html[lang="ar"] .mb-4 {
	margin-bottom: 4px;
}


/*--- HELP TEXT STYLES ---*/

ol.help-text {
	margin: 0;
	padding-left: 15px;
}
ol.help-text li {
	padding: 5px 0px;
}
ol.help-text li ul {
	list-style-type: disc;
	padding-left: 30px;
}
md-tooltip .md-content {
    height: auto;
    line-height: 16px;
    font-size: 10px;
    padding: 5px;
}

/*--- HEADER POPUP STYLES ---*/

.custom-radio-list .profile-image {
    display: inline-block;
    height: 48px;
    margin-right: 10px;
    vertical-align: middle;
    width: 48px;
}
.custom-radio-list .profile-image img {
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: block;
    margin: 0 auto;
}
.custom-radio-list .profile-image + span label {
    color: rgba(0, 0, 0, 0.87);
    display: block;
    font-weight: 400;
    font-size: var(--default-fontsize);
}
.custom-radio-list span.profile-image + span {
	width: 55%;
    display: inline-block;
    white-space: normal;
    font-weight: 600;
    text-transform: capitalize;
    vertical-align: middle;
}
.custom-radio-list li {
    display: inline-block;
    vertical-align: middle;
    width: calc(33% - 20px);
    margin: 0 10px;
}
.custom-radio-list md-radio-button {
    margin-bottom: 0;
    padding: 10px 15px;
    text-align: left;
}
.custom-radio-list md-radio-button .md-label {
    width: 100%;
}

/*--- FORM TEXT FIELD STYLES ---*/

md-input-container.md-green-theme:not(.md-input-invalid).md-input-has-value label {
	color: rgba(0, 0, 0,.64);
}
md-input-container label,
md-input-container.md-green-theme label, 
md-input-container.md-green-theme .md-placeholder,
md-select.md-green-theme .md-select-value.md-select-placeholder,
md-select.md-green-theme[disabled] .md-select-value.md-select-placeholder,
md-input-container:not(.md-input-focused):not(.md-input-invalid) md-select.md-green-theme .md-select-value span:first-child::after,
md-input-container.md-green-theme:not(.md-input-focused):not(.md-input-invalid) label.md-required::after,
md-input-container.md-default-theme:not(.md-input-invalid).md-input-has-value label, 
md-input-container:not(.md-input-invalid).md-input-has-value label,
md-input-container.md-default-theme:not(.md-input-focused):not(.md-input-invalid) label.md-required::after, 
md-input-container:not(.md-input-focused):not(.md-input-invalid) label.md-required::after,
.formly-field md-select .md-select-value.md-select-placeholder {
	color: rgba(34, 34, 34,.75);
}
md-input-container.md-green-theme .md-input::-webkit-input-placeholder,
md-input-container .md-input::-webkit-input-placeholder {
	color: rgba(34, 34, 34,.75);
}

md-input-container.md-green-theme .md-input::-moz-placeholder,
md-input-container .md-input::-moz-placeholder {
  	color: rgba(34,34,34,0.75);
  	opacity: 1;
}
md-input-container.md-default-theme :-ms-input-placeholder.md-input, 
md-input-container :-ms-input-placeholder.md-input {
	color: rgba(34,34,34,0.75)
}
md-checkbox.md-green-theme[disabled] .md-label {
    color: rgba(0, 0, 0, 0.60);
}
input:-webkit-autofill, 
textarea:-webkit-autofill, 
select:-webkit-autofill {
    background-color: transparent !important;
}

md-input-container.md-green-theme .md-input[disabled], 
[disabled] md-input-container.md-green-theme .md-input,
md-select.md-green-theme[disabled] .md-select-value,
md-input-container.md-default-theme .md-input[disabled], 
md-input-container .md-input[disabled], 
[disabled] md-input-container.md-default-theme .md-input, 
[disabled] md-input-container .md-input,
md-select.md-default-theme[disabled] .md-select-value, 
md-select[disabled] .md-select-value {
	background-image: -webkit-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: -moz-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: -ms-linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .35) 50%, transparent 0%);
    color: rgba(0,0,0,.87);
}

md-input-container textarea.md-input {
	min-height: 30px;	
}

/*--- ERROR MESSAGE POPUP STYLES ---*/

md-dialog.error-message {
    overflow: visible !important;
}
md-dialog.error-message::before {
    content: '';
    width: 80px;
    height: 40px;
    background: var(--secondary-bg-color);
    position: relative;
    margin: 0 auto;
    border-radius: 50px 50px 0 0;
    margin-top: -40px;
    box-shadow: 0 7px 8px -15px rgba(0, 0, 0, .2);
}
.statusicon {
    border-radius: 50%;
    top: -30px;
    height: 60px;
    left: 50%;
    line-height: 60px;
    margin: 0 0 0 -30px;
    position: absolute;
    text-align: center;
    width: 60px;
}
.statusicon md-icon,
.statusicon i.fa {
    color: var(--secondary-text-color);
}
.statusicon i.fa {
    line-height: 60px;
    font-size: 26px;
}
.failurebg {
    background: #ff4948;
}
.error-button .md-error {
    background: #ff4948 none repeat scroll 0 0 !important;
    border: 1px solid #ff4948;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: var(--secondary-text-color);
    margin-bottom: 30px;
}
md-dialog md-dialog-actions .error-button {
    text-align: center !important;
}
.error-content {
    text-align: center;
    position: relative;
}
.error-content h3 {
    font-size: 20px;
    margin: 30px 0px;
}
.error-content h4 {
    font-size: 16px;
}
button.md-icon-button.todo-cancel { 
	position: absolute; 
	right: 10px; 
	top: 15px; 
}

/*--- QUESTION/SUGGESTIONS STYLES ---*/

.suggest-modal {
	max-height: 90%;
}
.tagline-txt {
	padding: 0 16px;
	margin-bottom: 10px;
}
.tagline-txt h3{
	font-weight: 300;
	font-size: 24px;
	line-height: 28px;
}
.custom-dialog.suggest-modal .md-toolbar-tools h3 {
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
}
.custom-dialog.suggest-modal .md-toolbar-tools md-icon {
	color: rgba(0,0,0,0.45) !important;
	font-size: 20px;
    margin-top: 10px;
    margin-right: 5px;
}
.phone-block {
	background: rgb(129, 178, 20);
    padding: 15px;
    color: var(--secondary-text-color);
}
.phone-block >span {
	border: 2px solid #fff;
	border-radius: 50%;
	padding:5px;
	box-sizing: border-box;;
	margin-right: 10px;
}
.phone-block h4{
	font-size: 24px;
    font-weight: 400;
}
.phone-block h4 span{
	font-size: var(--default-fontsize);
    display: block;
}
.suggest-modal .success-wrap ,
.suggest-modal .failure-wrap {
	padding: 20px;
	text-align: center;
}

.suggest-modal .failure-wrap  md-icon,
.suggest-modal .success-wrap md-icon{
	font-size: 65px;
	width: auto;
	height: auto;
	color: #d9534f;
	margin-bottom: 15px;
}
.suggest-modal .success-wrap md-icon{
	color: var(--trinity-text-color);
	text-align: center;
}
.suggest-modal .failure-wrap p {
    font-size: var(--default-fontsize);
    margin-top: 10px;
    color: rgba(0,0,0,.7);
}
.suggest-modal .success-wrap p {
    font-size: var(--default-fontsize);
    color: rgba(0,0,0,.7);
}
md-dialog.custom-dialog.support-access-model h3 {
    font-size: 16px;
    margin-right: 20px;
    text-transform: capitalize;
    color: black;
}
.expire-access {
    background: rgba(37, 128, 235, 0.12);
    border-radius: 6px;
    padding: 3px 10px;
    box-sizing: border-box;
    font-size: 12px;
    color: black;
    line-height: 18px;
}
md-dialog.custom-dialog.support-access-model p{
	font-size: var(--default-font14);
}
/*--- HELP MODAL STYLES ---*/

.custom-dialog .help-modal {
	min-width: 768px;
	max-width: 768px;
	max-height: 500px;
	position: relative;
}
.help-modal iframe{
	height: 380px;
    overflow-y: auto
}
#loadingMessage {
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: var(--secondary-bg-color);
    top: 0px;
    left: 0px;
    position: absolute;
}
#loadingMessage img {
    max-width: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.access-mode {
    position: fixed;
    right: -25px;
    top: 25px;
    transform: rotate(90deg);
    z-index: 1;
}
.access-mode-write {
    font-size: 8.5px;
    background: #009fcb;
    color: var(--secondary-text-color);
    display: block;
    padding: 2px;
    margin-right: 5px;
    white-space: nowrap;
    line-height: 11px;
}
.access-mode-read {
    font-size: 8.5px;
    background: #009D02;
    color: var(--secondary-text-color);
    display: block;
    padding: 2px;
    margin-right: 5px;
    white-space: nowrap;
    line-height: 11px;
}


/*--- HEADER BREADCRUMB STYLES ---*/
.nextAcademyVisible .breadcrumb{
	right: 180px;
}
.breadcrumb {
   position: absolute;
   right: 130px;
   top: 15px;
   z-index: 12;
   text-align: right;
   line-height: 16px;
   /* max-width: 24%; */
   animation: fadein 1.5s;
    -moz-animation: fadein 1.5s;
    -webkit-animation: fadein 1.5s;
    -o-animation: fadein 1.5s;
} 
body.notification .breadcrumb{
	top: 10px !important;
}
/* .service_errors:not(.hide) ~ .breadcrumb,
body.errorVisible .breadcrumb,
body.notification .breadcrumb,
body.staticBanner .breadcrumb,
.service_errors:not(.hide) ~ div .help-btn,
body.errorVisible .help-btn,
body.notification .help-btn,
body.staticBanner .help-btn {
   top: 115px;
}
body.notification.errorVisible .breadcrumb,
body.errorVisible.notification .help-btn,
body.notification.staticBanner .breadcrumb,
body.staticBanner.notification .help-btn,
body.errorVisible.staticBanner .breadcrumb,
body.staticBanner.errorVisible .help-btn {
    top: 165px;
}
body.notification.errorVisible.staticBanner .breadcrumb,
body.notification.errorVisible.staticBanner .help-btn {
    top: 215px;
} */
.help-btn {
    position: fixed;
    top: 60px;
    right: 5px;
    z-index: 3;
    margin-right: 6px !important;
}
.wizards-wrapper .help-btn {
    top: 7px;
}
.breadcrumb ul {
   margin: 0;
   padding: 0;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}
.breadcrumb li {
   display: inline-block;
   vertical-align: middle;
   font-size: var(--default-fontsize);
}
.zone-info label {
    display: block;
    font-size: 12px;
    margin-top: 1px;
}

.studentBanner{ 
}
.studentBanner .md-button{
	font-size: var(--default-font14);
	margin-left: 8px !important;
	min-width: max-content;
	line-height: 26px;
    min-height: 26px;
    text-transform: capitalize;
    font-weight: 600;
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}


.adbanner {
	width: 100%;
	cursor: default;
}
.adcontrol {
	display: none;
}
.service_errors.adwrapper {
    background: transparent !important;
    padding: 0;
}

.header-link {
    margin-right: 10px;
}
.header-link a {
    display: block;
    text-decoration: none;
}
.header-link img {
    max-width: 120px;
    display: block;
}
.no-pace .pace {
  user-select: inherit;
  pointer-events: auto;
}
.quizzer-frame {
  height: calc(100vh - 106px);
}
body.errorVisible .quizzer-frame,
body.notification .quizzer-frame,
body.staticBanner .quizzer-frame{
    height: calc(100vh - 160px);
}
body.notification.errorVisible .quizzer-frame,
body.notification.staticBanner .quizzer-frame,
body.errorVisible.staticBanner .quizzer-frame {
	height: calc(100vh - 210px);
}
body.notification.errorVisible.staticBanner .quizzer-frame {
	height: calc(100vh - 250px);
}
/* Next Academy icon styles */

a.md-icon-button.md-button.custom-training-icon {
    overflow: visible;
    position: relative;
}
a.md-icon-button.md-button.custom-training-icon label {
    position: absolute;
    z-index: 1;
    display: inline-block;
    top: 3px;
    font-size: 8px;
    background: #DB4437;
    color: var(--secondary-text-color);
    width: 24px;
    height: 12px;
    line-height: 12px;
    right: -9px;
}


.menuContent {
	width: 350px;
}
.menuContent::before { 
	right: 86px !important;
}
.menuHeader {
	padding: 16px 0 0 16px;
    align-items: center;
    font-weight: 600;
    font-size: 16px;
} 

.rightMenuSettings {
    width: 307px;
    min-height: calc(100vh - 61px);
    max-height: inherit;
    position: fixed;
    right: -110%;
    top: 60px;
    background-color: var(--asidemenubg);
    color: var(--asidemenutextdefaultcolor);
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
    box-shadow: -5px 10px 15px rgb(0,0,0,0.14);     
    height: calc(100vh - 61px);   
}
.rightMenuSettings.openSettings,
.rightMenuSettings.openProfile {
	right: 0;
} 
.defaultLayer {
    background: var(--layer);
    content: "";
    right: 0;
    position: fixed;
    top: 60px;
    transition: all 0.2s ease-in-out 0s;
    z-index: -2;
    opacity: 0;
} 
.profileMenuContent {
	background-color: var(--asidemenubg);
	position: relative;
	z-index: 1;
}
.emptyNotificationMessage {
    background-color: var(--asidemenubg);
    z-index: 1;
}
.profileMenu.openProfile .defaultLayer,
.notificationMenu.toggleNotification .defaultLayer {
    width: 100%;
    height: calc(100% - 60px);
    opacity: 1; 
    
}
.timeZone {
	padding: 10px;
	padding-top: 0;
    width: 100%;	
}
.appActionButtons {
    margin: 12px 16px;
}
.appImage img {
    display: block;
    width: auto;
    height: 40px;
}

.rightMenuSettings::before {
    content: "";
    position: absolute;
    right: 34px;
    top: -9px;
    width: 16px;
    height: 16px;
    background-color: var(--secondary-bg-color);
    border: solid 1px #ebebeb;
    border-bottom: 0;
    border-right: 0;
    transform: rotate(45deg);
    z-index: -1;
}
.profileMenu::before {
	top: -4px;
	background-color: var(--asidemenubg);
    border-color: var(--asidemenusecondarybordercolor);
}
 
.rightMenuSettings md-list {	
	overflow: auto;
	overflow: auto; 
    padding: 12px 8px;
}
 
.rightMenuSettings md-list md-list-item {
    padding: 0;
    min-height: 40px;  
    margin: 5px 0;  
}
.rightMenuSettings md-list-item .md-list-item-inner:before, 
.rightMenuSettings md-list-item:before {
	display: none;
}
.userNameDetails {
	border-bottom: solid 1px var(--asidemenusecondarybordercolor);
	padding: 0 16px;	
	padding-right: 6px;
	background-color: var(--moduleheadingbg);
	color: var(--asidemenubgsecondarycolor);
	z-index: 1;
	height: 62px;
	min-height: 62px;
	font-weight: 500;
}
.userNameDetails img {
	border-radius: 40px;
    max-width: 40px;
    max-height: 40px;
    width: auto;
    height: auto;	
}
.userNameDetails h3 {
	text-transform: capitalize;
	font-weight: 500;
	padding-bottom: 3px;
	/* autoprefixer: off */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: inherit;
    font-size: var(--default-font14);
}
.userNameDetails p { 
	font-size: 12px;
	font-weight: normal;
}
md-menu-content .profile-manage img{
    max-width:40px;
    width:100%;
    border-radius:50%;
}
.left_navigation h5.session_text{
	font-size: var(--default-fontsize);
	align-items: center;
	font-weight: 400;
}
.left_navigation h5.session_text span.sessionYear {
	font-weight: 600;
}
.md-select-menu-container.md-active{
z-index: 999 !important;
}
/* .service_errors:not(.hide) ~ div .left_navigation,
body.errorVisible .left_navigation,
body.notification .left_navigation,
body.staticBanner .left_navigation {
    top: 0px;
} */
/* @media only screen and (max-width: 992px) {   
   .content_area_wrapper {
       height: calc(100% - 0px)
   }
} */
/*--- MEDIA QUERY STYLES ---*/
/* header top space */
.header-space {
	height: calc(100vh - 60px);	
    margin-top: 60px;
    position: relative;
}

/* Alphbet colors */
.gc_inner {
    color: #fff;
    border-radius: 50%;
    font-size: 15px;
    font-weight: 600;
    height: 40px;
    line-height: 37px;
    margin-right: 17px;
    text-align: center;
    width: 40px;
    border: 2px solid transparent;
    box-sizing: border-box;
    min-width: 40px;
}

.alphabet_a {
  background-color: #F1759F;
}

.alphabet_b {
  background-color: #79888F;
}

.alphabet_c {
  background-color: #D35A8A;
}

.alphabet_d {
  background-color: #47AAA0;
}

.alphabet_e {
  background-color: #A083D2;
}

.alphabet_f {
  background-color: #B15278;
}

.alphabet_g {
  background-color: #59DFD2;
}

.alphabet_h {
  background-color: #A083D2;
}

.alphabet_i {
  background-color: #F175E5;
}

.alphabet_j {
  background-color: #8F798B;
}

.alphabet_k {
  background-color: #D35AC3;
}

.alphabet_l {
  background-color: #47AA47;
}

.alphabet_m {
  background-color: #919191;
}

.alphabet_n {
  background-color: #FB8E8E;
}

.alphabet_o {
  background-color: #6EAA47;
}

.alphabet_p {
  background-color: #9EA7FA;
}

.alphabet_q {
  background-color: #946D7A;
}

.alphabet_r {
  background-color: #7ACBF1;
}

.alphabet_s {
  background-color: #8993B8;
}

.alphabet_t {
  background-color: #89B4B0;
}

.alphabet_u {
  background-color: #9696FB;
}

.alphabet_v {
  background-color: #EE80AB;
}

.alphabet_w {
  background-color: #6DD1C7;
}

.alphabet_x {
  background-color: #84759D;
}

.alphabet_y {
  background-color: #F6B091;
}

.alphabet_z {
  background-color: #BDD27F;
}


@font-face {
  font-family: 'inventory';
  src:  url('https://nlpkube1.nexterp.in/nlp/fonts/inventory/inventory.eot?dh4r0w');
  src:  url('https://nlpkube1.nexterp.in/nlp/fonts/inventory/inventory.eot?dh4r0w#iefix') format('embedded-opentype'),
    url('https://nlpkube1.nexterp.in/nlp/fonts/inventory/inventory.ttf?dh4r0w') format('truetype'),
    url('https://nlpkube1.nexterp.in/nlp/fonts/inventory/inventory.woff?dh4r0w') format('woff'),
    url('https://nlpkube2.nexterp.in/nlp/fonts/inventory/inventory.svg?dh4r0w#inventory') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

i[class^="inv-"], i[class*=" inv-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'inventory' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.inv-formeditor:before {
  content: "\e90c";
}
.inv-appraisalcycle:before {
  content: "\e90d";
}
.inv-appraisalform:before {
  content: "\e90e";
}
.inv-questionscategory:before {
  content: "\e90f";
}
.inv-interviewfeeds:before {
  content: "\e910";
}
.inv-category:before {
  content: "\e900";
}
.inv-items:before {
  content: "\e901";
}
.inv-store:before {
  content: "\e902";
}
.inv-suppliers:before {
  content: "\e903";
}
.inv-kit:before {
  content: "\e904";
}
.inv-autonum:before {
  content: "\e905";
}
.inv-purchaseorder:before {
  content: "\e906";
}
.inv-goodsrecieptnote:before {
  content: "\e907";
}
.inv-purchase:before {
  content: "\e908";
}
.inv-payment:before {
  content: "\e909";
}
.inv-sale:before {
  content: "\e90a";
}
.inv-issue:before {
  content: "\e90b";
}
/* inputs and date picker floating custome styles */
.navigationheader {
	min-height: 56px;
	padding: 5px 24px 5px 24px;
}
.navigationheader .button{
	padding: 0;
	min-height: auto;
}
.custom-input-field .md-select-value{
  	border: 1px solid var(--legend-border) !important;
  	padding-left: 8px !important;
  	padding-bottom: 5px !important;
  	border-radius: 5px;
 	min-height: 31px !important;
}
.custom-input-field .md-select-value .md-select-icon:after {
    color: #737373;
}
.custom-input-field .info-btn {
   position: absolute !important;
   top: -7px !important;
   font-size: 11px;
   background: var(--white-color);
   padding: 0 5px 0 4px !important;
   z-index: 4 !important;
   left: 9px !important;
   bottom: auto !important;
   width: auto !important;
   color: var(--light-grey) !important;
}
.custom-input-field mdp-date-picker md-input-container .md-input{
  border-color: transparent;
  border-bottom: 0;
}
md-input-container .md-input.date-range{
	padding-right:30px;
} 
html[lang="ar"] md-input-container .md-input.date-range {
	padding-left:30px;
	padding-right:0;
} 
.custom-input-field md-input-container{
  border: 1px solid var(--legend-border);
  padding-left: 8px;
  margin-bottom: 0px;
  margin-top: 0px;
  border-radius: 5px;
  padding-right: 0;
  z-index: 0;
}
.custom-input-field md-select[disabled] .md-select-value.md-select-placeholder, 
.custom-input-field md-select[disabled] .md-select-value.md-select-placeholder {
	background-image: none !important;
	border: 1px dashed rgba(0,0,0,0.38) !important;
	color: rgba(0,0,0,0.38) !important;
}
.custom-input-field md-input-container .md-input{
  border-color: transparent;
  border-bottom: 0;
  min-height: 34px;
}
.custom-input-field .date-range-icon {
  top: 9px;
  right: 5px !important;
}
.custom-input-field .date-range-icon {
	color: var(--green-text);
}
.custom-input-field mdp-date-picker .md-button md-icon,
.custom-input-field mdp-time-picker .md-button md-icon{
  color: var(--iconcolor) !important;
  margin: 0;
}
.custom-date.custom-input-field mdp-date-picker .md-button.md-icon-button, 
.custom-time.custom-input-field mdp-time-picker .md-button.md-icon-button {
	right: 4px;
    top: 2px !important;
    width: auto;
}
.custom-date md-input-container.custom-input-field.md-icon-right {
    padding-right: 0;
}
.custom-input-field md-input-container.roundedstyle {
	padding: 0 !important;
    border: none !important;
}
.legend-button.md-button{
  border: 1px solid var(--legend-border);
  border-radius: 5px;
  z-index: 3;
  padding: 4px 10px;
  margin: 0;
  min-width: 140px;
  text-align: left;
}
.navigation-disable-btn{
  border: 1px dashed var(--legend-border);
  border-radius: 5px;
  z-index: 3;
  padding: 4px 10px;
  margin: 0;
  min-width: 140px;
  text-align: left;
  position: relative;
  height: 40px;
}
.navigation-disable-btn label{
	position: absolute;
    top: -7px;
    background: #fff;
    font-size: 9px;
    color: rgba(0,0,0,.64);
}
.daterangepicker{
  margin-top: 6px !important;
}
.daterangepicker .calendar{
  max-width: 300px !important;
}

md-input-container.custom-input-field{
	position: relative;
}
md-input-container.custom-input-field .md-input.date-range, 
.custom-input-field md-input-container .md-input.date-range {
    padding-right: 30px;
    max-width: 100%;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: var(--primary-text-color);
    padding-bottom: 2px !important;
}
.custom-date.custom-input-field mdp-date-picker md-input-container label, 
.custom-time.custom-input-field mdp-time-picker md-input-container label{
	position: absolute!important;
    top: -33px;
    font-size: 11px;
    background: var(--header-color);
    padding: 0 5px 0 4px;
    z-index: 4;
    left: 9px;
    color: var(--light-grey);
    width: auto;
    height: 14px;
    transition: unset;
}
.custom-date.custom-input-field mdp-date-picker md-input-container.md-input-has-value label,
.custom-time.custom-input-field mdp-time-picker md-input-container.md-input-has-value label,
.custom-date.custom-input-field mdp-date-picker md-input-container.md-input-focused label,
.custom-time.custom-input-field mdp-time-picker md-input-container.md-input-focused label{
	top: -5px;
	transform: none;
	transition: unset;
}
.custom-date.custom-input-field md-input-container:not(.md-input-invalid).md-input-has-value label,
.custom-time.custom-input-field md-input-container:not(.md-input-invalid).md-input-has-value label {
    width: auto;
    padding: 0 5px;
    background: var(--header-color);
}
.custom-date.custom-input-field mdp-date-picker md-input-container .md-input, 
.custom-time.custom-input-field mdp-time-picker md-input-container .md-input {
	border: 1px solid var(--legend-border);
    border-radius: 5px;
    padding: 6px 8px;
    min-height: 40px;
}
md-input-container.custom-input-field .md-placeholder, 
.custom-date md-input-container.custom-input-field .md-placeholder,
md-input-container.custom-input-field label:not(.md-no-float):not(.md-container-ignore),
.custom-date md-input-container.custom-input-field label:not(.md-no-float):not(.md-container-ignore){
    position: absolute!important;
    top: -33px;
    font-size: 11px !important;
    background: var(--header-color);
    padding: 0 5px 0 4px;
    z-index: 4;
    left: 9px;
    color: var(--light-grey);
    width: auto;
    height: 14px;
    transition: unset;
    line-height: 14px;
}
md-input-container.custom-input-field:not([md-no-float]) .md-select-placeholder span:first-child,
md-input-container.custom-input-field .md-select-placeholder span:first-child, 
.custom-formly-wrapper md-input-container:not([md-no-float]) .md-select-placeholder span:first-child{
	 opacity:0;
}
md-input-container.custom-input-field.md-input-has-placeholder label:not(.md-no-float){
	webkit-transform:  translate3d(0,27px,0) scale(1);
    transform: translate3d(0,27px,0) scale(1);
    opacity:1;
}
md-dialog-content md-input-container.custom-input-field.md-input-has-placeholder label:not(.md-no-float){
	webkit-transform:  translate3d(0,27px,0) scale(1);
    transform: translate3d(0,27px,0) scale(1);
    opacity:1;
}
md-input-container.custom-input-field.md-input-focused .md-placeholder, 
md-input-container.custom-input-field.md-input-focused label:not(.md-no-float):not(.md-container-ignore){
    top: -6px;
    transform: none;
    transition: unset;
}
md-input-container.custom-input-field.md-input-has-value .md-placeholder, 
md-input-container.custom-input-field.md-input-has-value label:not(.md-no-float):not(.md-container-ignore),
.custom-date md-input-container.custom-input-field.md-input-has-value .md-placeholder, 
.custom-date md-input-container.custom-input-field.md-input-has-value label:not(.md-no-float):not(.md-container-ignore){
    top: -6px;
    transform: none;
    transition: unset;
}
md-input-container.custom-input-field .md-input,
.custom-input-field md-input-container .md-input,
.cutom-date .custom-input-field md-input-container .md-input,
.cutom-date md-input-container.custom-input-field .md-input{
    border: 1px solid var(--legend-border) !important;
    padding-left: 8px;
    padding-bottom: 5px !important;
    border-radius: 5px;
    height: 40px;
}
p.custom-input-field{
	border: 1px solid var(--legend-border) !important;
    padding-left: 8px;
    padding-bottom: 5px !important;
    border-radius: 5px;
    height: 40px;
    line-height: 40px;
}
md-input-container.custom-input-field  textarea.md-input {
    min-height: 40px;
} 
md-input-container.custom-input-field .md-input.green-border,
.custom-input-field md-input-container .md-input.green-border {
	border: 1px solid var(--green-text) !important;
}
md-input-container.custom-input-field .md-input[disabled], 
md-input-container.custom-input-field md-select[disabled] .md-select-value:not(.md-select-placeholder),
.custom-input-field md-input-container .md-input[disabled], 
.custom-input-field md-input-container md-select[disabled] .md-select-value:not(.md-select-placeholder) {
    background: none !important;
    color: rgba(0, 0, 0, 0.87);
    cursor: not-allowed;
    pointer-events: none;
    border: 1px dashed var(--legend-border) !important;
}
md-input-container.custom-input-field .md-select-value .md-select-icon::after {
    top: 2px;
    font-size: 16px;
}
.custom-date.custom-input-field mdp-date-picker md-input-container .md-placeholder, 
.custom-date.custom-input-field mdp-date-picker md-input-container label:not(.md-no-float):not(.md-container-ignore),
.custom-time.custom-input-field mdp-time-picker md-input-container .md-placeholder, 
.custom-time.custom-input-field mdp-time-picker md-input-container label:not(.md-no-float):not(.md-container-ignore)
{
	padding-left: 0px;
    box-sizing: border-box;
}
.custom-date.custom-input-field mdp-date-picker md-input-container, 
.custom-time.custom-input-field mdp-time-picker md-input-container,
.custom-date.custom-input-field md-input-container{
	border: none;
    padding-left: 0;
    width: 100%;
}
md-input-container.md-icon-left.custom-input-field {
    padding-left: 0;
}
md-input-container.md-icon-left.custom-input-field md-icon {
    left: 8px;
    top: 10px;
    color: var(--iconcolor);
}
md-input-container.md-icon-left.custom-input-field .md-input {
    padding-left: 36px;
}

md-input-container.custom-input-field.md-input-focused label:not(.md-no-float), 
md-input-container.custom-input-field.md-input-has-placeholder label:not(.md-no-float), 
md-input-container.custom-input-field.md-input-has-value label:not(.md-no-float){
    width: auto;
    background: var(--white-color);
    padding: 0 4px;
    z-index: 2;
}
.add-wrap md-input-container.custom-input-field.md-input-focused label:not(.md-no-float), 
.add-wrap md-input-container.custom-input-field.md-input-has-placeholder label:not(.md-no-float), 
.add-wrap md-input-container.custom-input-field.md-input-has-value label:not(.md-no-float){
    background: var(--header-color);
}
.custom-input-field md-input-container .md-input.search-input{
	width: calc(100% - 35px) !important;
	border: 0px !important;
	margin-left: 30px !important;
}
.custom-input-field .md-button.md-icon-button{
	z-index: 3;
}
md-dialog-content md-input-container.select-dropdown.custom-input-field.md-input-has-placeholder label:not(.md-no-float) {
	    transform: translate3d(0,18px,0) scale(1);
	    -webkit-transform: translate3d(0,18px,0) scale(1);
}
/* floting menu (use 'custom-input-field floatingDown' two classess for input) */
.custom-input-field.floatingDown .md-placeholder, 
.custom-input-field.floatingDown label:not(.md-no-float):not(.md-container-ignore) {
    bottom: 44px;
    top: auto;
    transition: transform .4s cubic-bezier(.25,.8,.25,1),-webkit-transform .4s cubic-bezier(.25,.8,.25,1);
    -webkit-transition: transform .4s cubic-bezier(.25,.8,.25,1),-webkit-transform .4s cubic-bezier(.25,.8,.25,1);
	transform: translate3d(0,28px,0) scale(1); 
	-webkit-transform: translate3d(0,28px,0) scale(1);   
}
.custom-input-field.floatingDown.md-input-focused label:not(.md-no-float), 
.custom-input-field.floatingDown.md-input-has-placeholder label:not(.md-no-float), 
.custom-input-field.floatingDown.md-input-has-value label:not(.md-no-float) {
    top: inherit !important;
    bottom: 40px;
    transition: transform .4s cubic-bezier(.25,.8,.25,1),width .4s cubic-bezier(.25,.8,.25,1),-webkit-transform .4s cubic-bezier(.25,.8,.25,1) !important;
    -webkit-transition: transform .4s cubic-bezier(.25,.8,.25,1),width .4s cubic-bezier(.25,.8,.25,1),-webkit-transform .4s cubic-bezier(.25,.8,.25,1) !important;
    transform: translate3d(0,6px,0) scale(.75)  !important;
    -webkit-transform: translate3d(0,6px,0) scale(.75)  !important;
}
/*  Normal Select */ 
.select-dropdown.custom-input-field select.ng-empty,
.select-dropdown.custom-input-field select.ng-not-empty {
border: 1px solid var(--legend-border);
min-height: 40px;
border-radius: 5px;
padding-left: 8px;
}
md-input-container.select-dropdown.custom-input-field .ng-empty ~ label::after{
bottom: 12px;
}
md-input-container.select-dropdown.custom-input-field::before {
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #757575;
	bottom: 20px;
	content: "";
	position: absolute;
	right: 12px;
	z-index: 99;
	visibility: visible;
	transition: none !important;
}
md-input-container.select-dropdown.custom-input-field label::after{
    display: none;
}
md-input-container.select-dropdown.custom-input-field label.custom{
	top: -11px;
}
md-input-container.select-dropdown.custom-input-field .ng-not-empty ~ label{
	top: -4px;
	background: #fff;
	width: auto;
	left: 8px;
	padding: 0 5px;
	transform: scale(0.85);
}
md-input-container.select-dropdown.custom-input-field .ng-empty ~ label{
	font-size: var(--default-fontsize);
	line-height: 30px;
	top:-12px;
	height: 15px;
	transform:none;
	transition:inherit;
}
md-input-container.select-dropdown.custom-input-field select[disabled="disabled"] {
	background: none;
	border: 1px dashed rgba(0, 0, 0, 0.26);
}
.custom-input-field md-autocomplete[md-floating-label] md-input-container
{
	border: none;
    padding-left: 0;
    width: 100%;
}
.custom-input-field md-autocomplete[md-floating-label] md-input-container .md-placeholder, 
.custom-input-field md-autocomplete[md-floating-label] md-input-container label:not(.md-no-float):not(.md-container-ignore) {
    transform: none;
    line-height: 10px;
    position: absolute!important;
    top: -3px;
    font-size: 11px !important;
    background: var(--white-color);
    padding: 0 5px 0 4px;
    z-index: 4;
    left: 9px;
    color: var(--light-grey);
    width: auto;
    height: 14px;
    transition: unset;
}
.custom-input-field md-autocomplete md-autocomplete-wrap md-progress-linear.md-inline{
	bottom: -2px !important;
}
/*  Normal Select */
/* Formly Fields */ 
.custom-formly-wrapper .formly-field-input md-input-container input, 
.custom-formly-wrapper .formly-field-datepicker md-input-container input, 
.custom-formly-wrapper .formly-field-select md-input-container md-select,
.custom-formly-wrapper .formly-field md-input-container textarea.md-input,
.custom-formly-wrapper mdp-time-picker md-input-container input{
	border: 1px solid var(--legend-border) !important;
    padding-left: 8px;
    padding-bottom: 5px !important;
    border-radius: 5px;
    height: 40px;	
    box-sizing:border-box;
}
.custom-formly-wrapper .formly-field-select md-input-container md-select[disabled="disabled"] {
	background: none;
	border: 1px dashed rgba(0, 0, 0, 0.26) !important;
}
.custom-formly-wrapper .formly-field-select md-input-container md-select md-select-value{
	border-color: transparent !important;
	background:none;
}
.custom-formly-wrapper .formly-field-select md-input-container.md-input-focused md-select md-select-value{
	border-color:  transparent !important;
}
.custom-formly-wrapper .formly-field-input md-input-container label, .custom-formly-wrapper .formly-field-datepicker md-input-container label, .custom-formly-wrapper .formly-field-select md-input-container label,.custom-formly-wrapper .formly-field-textarea md-input-container label{
	position: absolute!important;
    top: -33px;
    font-size: 11px !important;
    background: var(--white-color);
    padding: 0 5px 0 4px;
    z-index: 4;
    left: 9px;
    color: var(--light-grey);
    width: auto !important;
    height: 14px;
    transition: unset;
}
.custom-formly-wrapper .formly-field-textarea md-input-container label{
	top:-18px;
}
.custom-formly-wrapper .formly-field-select md-input-container label,.custom-formly-wrapper .formly-field .formly-field-textarea md-input-container label{
	/* top: -9px !important; */
	opacity: 1;
    -webkit-transform: translate3d(0,28px,0) scale(1);
    transform: translate3d(0,28px,0) scale(1);
}
.custom-formly-wrapper .formly-field-textarea md-input-container label:not(.md-no-float):not(.md-container-ignore) {
    -webkit-transform: translate3d(0,27px,0) scale(1);
    transform: translate3d(0,27px,0) scale(1);
    font-size: 11px !important;
}
.custom-formly-wrapper md-input-container.custom-input-field.md-input-focused .md-placeholder, 
.custom-formly-wrapper md-input-container.custom-input-field.md-input-focused label:not(.md-no-float):not(.md-container-ignore), 
.custom-formly-wrapper .formly-field-datepicker mdp-date-picker md-input-container.md-input-focused label, 
.custom-formly-wrapper .formly-field-datepicker mdp-time-picker md-input-container.md-input-focused label{
	top: -6px;
    transform: none;
    transition: unset;
}
.custom-formly-wrapper md-input-container.md-input-focused label:not(.md-no-float), 
.custom-formly-wrapper md-input-container.md-input-has-placeholder label:not(.md-no-float), 
.custom-formly-wrapper md-input-container.md-input-has-value label:not(.md-no-float){
    width: auto;
    background: #fff;
    padding: 0 4px;
    z-index: 2;
}
.custom-formly-wrapper .formly-field-datepicker mdp-date-picker md-input-container.md-input-has-value label:not(.md-no-float),
.custom-formly-wrapper .formly-field-timepicker mdp-time-picker md-input-container.md-input-has-value label:not(.md-no-float){
	width: auto;
    background: #fff;
    padding: 0 4px;
    z-index: 2;
    -webkit-transform: translate3d(0,27px,0) scale(1);
    transform: translate3d(0,27px,0) scale(1);
}
.custom-formly-wrapper .formly-field-datepicker mdp-date-picker md-input-container.md-input-focused label:not(.md-no-float){
	-webkit-transform: translate3d(0,0,0) scale(1);
    transform: translate3d(0,0,0) scale(1);
}
.custom-formly-wrapper .formly-field-input md-input-container .md-placeholder, 
.custom-formly-wrapper .formly-field-input md-input-container label:not(.md-no-float):not(.md-container-ignore){
	-webkit-transform: translate3d(0,27px,0) scale(1);
    transform: translate3d(0,27px,0) scale(1);
}
.formly_wrapper.custom-formly-wrapper .date mdp-date-picker .md-icon-button {
    top: 21px;
}
.add-wrap.min-padding {
	min-height: 60px;
	box-sizing: border-box;
	background:#fff;
}
.add-wrap.min-padding .custom-input-field{
	margin-top:6px !important; 
	margin-bottom:7px !important;
}
.add-wrap.min-padding form .custom-input-field, .add-wrap.min-padding .mtb-0.custom-input-field  {
	margin-top:0px !important; 
	margin-bottom:0px !important;
}
.search-filter-h{
	min-height:57px;
}
md-input-container.md-icon-right.pr-0{
	padding-right:0px !important;
}

.custom-autosearch-field{
	border: 1px solid var(--legend-border) !important;
    max-width: 50%;
    border-radius: 5px;
    height: 40px;
}
.custom-autosearch-field md-input-container{
	margin:0px;
}
.custom-autosearch-field md-input-container .md-input{
	border:solid 0px transparent !important;
} 
.custom-autosearch-field md-input-container label, .custom-autosearch-field md-input-container.md-input-focused label{
    position: absolute;
    width: auto !important;
    background: #fff;
    transform: translate3d(0,30px,0) scale(1) !important;
    height: 14px;
    font-size: 11px !important;
    left: -40px;
    top: -40px;
}

/* Table Page UI changes */
md-content.bluegrey-bg{
	background: #f2f2f7 !important;
}
.enhanced-table{
    background: #f0f2f5;
    position: relative;
    padding-bottom:4px;
    margin: 24px 24px 0;
    width: auto;
}
.enhanced-table md-table-container{
	border: 0;
	/* margin-top: -4px; */
    border-radius: 6px 6px 0 0;
    margin: 0;
}
.table-header{
	/* box-shadow: 0px 2px 4px rgb(195 195 195); */
	/* background-color: var(--white-color); */
	width: 100%;
	height: 50px;
	/* border-top: solid 1px var(--border-color); */
	position: absolute;
	top: 0;
    /* border-radius: 6px 6px 0 0; */
	/* z-index: 1 */
}

.enhanced-table .md-custom-table .md-head th, .lms-table .md-head{	
    /* background: var(--white-color) !important; */
    background: none !important;
    border: 0;
}
.enhanced-table .md-custom-table .md-head tr{
	min-height: 48px;
    padding: 8px 24px;
    line-height: 16px;
    font-weight: 600;
    /* box-shadow: 0px 2px 4px rgb(195 195 195); */
    position: relative;
    z-index: 1;
    color: var(--tablehead-text);
}
.enhanced-table table.md-custom-table th.md-column{
	color: #37474f !important;
    font-weight: 500;
}
.enhanced-table table.md-custom-table th.md-column:first-child{
	padding: 0 16px 0 16px !important;
}
.enhanced-table.check-table table.md-custom-table th.md-column:first-child{
	padding: 0 16px !important;
}
.enhanced-table .md-custom-table td.md-cell:first-child{
	padding: 0 16px !important;
}
.md-custom-table td.md-cell.md-checkbox-cell {
    text-align: center;
}
.enhanced-table table.md-custom-table td.md-cell:last-child, .enhanced-table table.md-custom-table th.md-column:last-child {
	padding: 0 16px 0 0;
}
.enhanced-table table.md-custom-table.clone {
    /* padding: 0 10px; */
}
.enhanced-table .md-custom-table tbody:before {
    content: "-";
    display: block;
    line-height: 0px;
    color: transparent;
}
.enhanced-table .md-custom-table{
    border-collapse: separate;
    border-spacing: 0 0px !important;
    margin-top: 0px;
    /* border-top: solid 1px var(--border-color); */
    min-height: 50px;
}
.enhanced-table .md-custom-table td.md-cell{
	border: 0 !important;
	box-shadow: 0px 2px 4px -4px rgb(195 195 195);
}
.enhanced-table md-table-pagination{
	position: absolute;
	right: 0;
	bottom: 0;
    min-height: 40px;
    width: calc(100% - 64px);
    background-color: var(--lightgraybgcolor);
    position: fixed;
    box-shadow: 0px -2px 4px rgb(0 0 0 / 12%);
    padding: 0 24px;
    z-index: 1;
}
html[lang="ar"] .enhanced-table md-table-pagination{
	right:auto;
	left: 0;
}
.enhanced-table .md-table-pagination > *{
	height: 40px !important;
}
.enhanced-table .md-custom-table .md-head{
	background-color: var(--lightgraybgcolor);
	border:0px;
    border-radius: 6px 6px 0 0;
}

.footer-pagination{
	position: fixed;
	right: 0;
	bottom: 0;
    min-height: 40px;
    height: 50px !important;
    width: calc(100% - 64px);
    background-color: #fff;
    position: fixed;
    bottom: 0;
    box-shadow: 0px -2px 4px rgb(0 0 0 / 12%);
    padding: 0 24px;
    z-index: 5;
}
html[lang="ar"] .footer-pagination{
	right:auto;
	left:0;
}
.main-content .accordian-menu.left-menu~.content-view form[name="newStaffForm"] .footer-pagination,
.settingsTab .footer-pagination,
.purchase-bg .tab-height .footer-pagination  {
    width: calc(80% - 52px);
    z-index: 5;
}
.enhanced-table table.md-custom-table td.md-cell{
	border-bottom: 1px solid var(--border-color) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background-color: var(--white-color);
}
table.md-custom-table.clone,
.clone + md-table-container {
    border-bottom: 1px solid var(--border-color) !important;
}
.bottom_btn{
	position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}
.bottom_btn ~ md-table-pagination.md-table-pagination {
    padding-right: 265px;
    z-index: 0;
    height: 50px;
}
.icon-text-btn{
    -webkit-font-smoothing: antialiased;
    font-size: .875rem;
    line-height: 1.8rem;
    font-weight: 600;
    letter-spacing: .0892857143em;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 20px;
    padding: 0 16px;
    width: auto;
    max-width: 100%;
    height: 38px;
}
.icon-text-btn i{
    margin-left: -6px;
    margin-right: 9px;
    font-weight: 600;
    font-size: 20px;
}
html[lang="ar"] .icon-text-btn i{
    margin-left: 5px;
    margin-right: 0;
}
.add-wrap md-fab-speed-dial{
	height: 50px;
}
.fabtooltip {
	-webkit-transform: translate(-20px, 0px);
	transform: translate(-20px, 0px);
}
.md-up.md-scale md-fab-trigger .md-button.md-fab md-icon {transform: rotate(0);transition: transform .3s;}
.md-is-open.md-scale md-fab-trigger .md-button.md-fab md-icon{transform: scale(1.5) rotate(45deg);}

.add-wrap .md-button.md-green-theme.md-primary.md-raised, .md-button.md-green-theme.md-primary.md-fab{
    justify-content: center;
    align-items: center;
    display: flex;
}
.add-wrap md-fab-actions{
	margin-right: -60px;
}
.d-flex{
	display: flex !important;
}

.md-button.md-green-theme.md-primary.md-raised:not([disabled]):hover, .md-button.md-green-theme.md-primary.md-fab:not([disabled]):hover,
.md-button.md-green-theme.md-primary.md-raised:not([disabled]).md-focused,.md-button.md-green-theme.md-primary.md-fab:not([disabled]).md-focused{
	background: var(--primary-bg-color) !important;
}
.overlap{
	z-index: 1;
	position: relative;
}
.top70{
	top: 70px;
}
.add-wrap md-fab-speed-dial{
	z-index: 9 !important;
}
/* Tabs UI CSS */
.custom-tab .md-tab{
	text-transform: capitalize !important;
	font-size: 14px !important;
	font-weight: 600 !important;
}
.custom-tab.md-green-theme .md-tab {
    font-weight: 500;
    color: var(--primary-text-color);
    padding-left: 12px;
    padding-right: 12px;
}
.custom-tab.md-green-theme .md-tab.md-active{
	color: var(--green-text);
}
.custom-tab.md-green-theme .md-tab[disabled]{
	color: rgba(0,0,0,0.57);
}
.custom-tab.md-green-theme md-ink-bar{
	height: 3px;
}
md-tabs.custom-tabs-height md-tabs-content-wrapper,
md-tabs.custom-tabs-height md-tab-content,
md-tabs.custom-tabs-height md-tab-content > div{
    display:flex;
    flex-direction:column;
    height:100%;
}
md-dialog.custom-dialog.directToAcademy a.md-button.md-raised {
    border-radius: 3px;
    min-width: 166px;
    box-shadow: none !important;
    min-height: 32px;
    line-height: 32px;
    text-transform: capitalize;
}
md-dialog.custom-dialog.directToAcademy .close-icon {
    position: absolute;
    top: 8px;
    right: 8px;
}
md-dialog.custom-dialog.directToAcademy p {
    line-height: 20px;
    margin-bottom: 15px;
    text-align: center;
    font-size: var(--default-font14);
}
.enhanced-table md-table-pagination.width-80 {
    width: calc(80% - 50px);
}
html[lang="ar"] .enhanced-table md-table-pagination.width-80 {
    left: 0;
    right: auto;
}
html[lang="ar"] .principal_tabs .school-percentage .perecentage-data .font10 {
    font-size: 10px;
    min-height: 28px;
}
html[lang="ar"] .principal_tabs .content h4 {
    font-size: var(--default-fontsize);
}
html[lang="ar"] .principal_tabs .school-percentage .perecentage-data .font14 {
    font-size: 13px !important;
}

html[lang="ar"] .more-custom md-menu {
    left: 0;
    right: auto;
}
html[lang="ar"] .principalsection .principalsection-content {
    font-size: 14px !important;
}
html[lang="ar"] #classWiseAdmissionReport .custom-input-field {
	margin-left: 0;
}

html[lang="ar"] .new_tabs_custom md-tabs.principalTab md-tabs-wrapper md-tabs-canvas md-pagination-wrapper {
	width: 100% !important;
    display: flex;
}
html[lang="ar"] .new_tabs_custom md-tabs.tabs .md-tab {
    overflow: inherit;
}
html[lang="ar"] .new_tabs_custom md-tabs-canvas {
	direction: ltr;
}
html[lang="ar"] .pos-text.ar-valign {
    top:-3px !important;
}
.selectLanguage md-select md-select-value .md-text span {
    text-align: left;
}
html[lang="ar"] .assignment-topheader md-tabs md-tabs-wrapper md-tabs-canvas, html[lang="ar"] .assignment-topheader md-tabs md-tabs-wrapper md-tabs-canvas md-pagination-wrapper{
    width: auto !important;
}
.survey-add-question{
	width: calc(85.6% - 64px) !important;
    min-width: calc(85.6% - 64px);
}
.disabled-class{
   cursor: not-allowed !important;
   pointer-events: none;
   opacity: 0.60;
}
.proctoring-orange{
	color: orange !important;
}
/* Card Icon background Color */
.toolCardCircle{
	background: black;
}
.pronunciationtool-icon {
    background: #672659 !important;
}
.fluency-icon {
    background: #452CA8 !important;
}
.readingfluency-icon {
    background: #3798A6 !important;
}
.pronunciationword-icon {
    background: #672659 !important;
}
.wordstress-icon {
    background: #F18E43 !important;
}
.lexile-icon {
    background: #AE4D7C !important;
}
.grammar-icon {
    background: #FAA050 !important;
}
.sentencepronunciationtool-icon {
    background: #8E82C0 !important;
}
.intonationtool-icon {
    background: #1C9A6D !important;
}
.speedreading1-icon {
    background: #3097A0 !important;
}
.speedreading2-icon {
    background: #8D7D6B !important;
}
.listening-icon {
    background: #EC8874 !important;
}
.scanning-icon {
    background: #A981B7 !important;
}
.skimming-icon {
    background: #D44466 !important;
}
.fixation-icon {
    background: #289BC6 !important;
}
.programming_avishkaar-icon {
    background: #FFAF6C !important;
}
.programming_scratch-icon {
    background: #EC8874 !important;
}
.programming_ide-icon {
    background: #8D7D6B !important;
} 
.html_ide-icon {
    background: #B36673 !important;
} 
.collabora_writer-icon {
    background: #7C48A3 !important;
} 
.collabora_calc-icon {
    background: #29C757 !important;
} 
.collabora_impress-icon {
    background: #EF3F5C !important;
} 
.collabora_draw-icon {
    background: #E3A553 !important;
}
.painttool-icon {
	background: #98651D !important;
} 
.imageeditor-icon {
	background: #AE4D7C !important;
}
.essaywriting-icon {
	background: #2DA4C1 !important;
}
.scriptedconversation-icon {
	background: #5698CB !important;
}
.programming_sql-icon {
	background: #D6556B !important;
}
.vocabulary-icon {
	background: #777754 !important;
}
.lh-20{
	line-height: 20px;
}
/* Media query starts Here  */
@media only screen and (max-width: 1600px) {
    .settings-wrap .list-item {
        width: 17.3%;
    }
    .card-views > div {
        width: 23%;
    }
    .card-grid-view md-card {
        width: 17.7%;
    }
    .designCardSeven.card-grid-view .cardDesign .cardDesignRgt md-card-title-text {
	    max-width: calc(100% - 30px);
	}
	.designCardSeven.card-grid-view .cardDesign {
        width: calc(25% - 20px);
    }
}
@media only screen and (max-width: 1366px) {
    .no-records {
        background-size: 370px auto;
        max-height: 300px;
        min-height: 300px;
    }
    .settings-wrap .list-item {
        width: 22.5%;
    }
    .card-grid-view md-card {
        width: 22.7%;
    }
    .md-header-cust .md-toolbar-tools,
    .panel-widget .md-toolbar-tools {
        padding: 0 25px;
    }
    .pad20 {
        padding: 15px !important;
    }
    .pad30 {
        padding: 25px !important;
    }
    .pad50 {
        padding: 50px !important;
    }
    .add-wrap {
        padding: 20px 25px 5px;
    }
    md-toolbar.md-header-cust {
        min-height: 56px;
    }
    .welcome_block {
        height: calc(100% - 56px);
    }
    .header-tabs md-tabs-canvas,
    .header-tabs md-pagination-wrapper {
        height: 50px;
    }
    .header-tabs .md-tab {
        line-height: 32px;
    }
    .md-header-cust .md-toolbar-tools,
    .panel-widget .md-toolbar-tools {
        height: 60px;
        max-height: 60px;
    }
    table.md-custom-table th.md-column {
        padding-bottom: 15px !important;
        padding-top: 15px !important;
    }
	/* Date Range Mobile view updated  */
    .daterangepicker .calendar th, .daterangepicker .calendar td{
    	min-width: 18px !important;
    	font-size: 12px;
    }
    .daterangepicker.ltr .calendar{
    	padding: 5px 0px;
    }
    .daterangepicker .calendar{
    	max-width: 200px!important;
    }
    .daterangepicker.ltr .calendar.left{
    	margin-right: 0 !important;
    }
    .daterangepicker.ltr .calendar.right{
    	margin-left: 0 !important;
    }
    .daterangepicker td, .daterangepicker th{
    	width: 18px !important;
    	height: 18px !important;
    }
    .daterangepicker .calendar.right{
    	padding-right: 2px !important;
    }
    .daterangepicker.ltr .calendar.left .calendar-table{
    	padding-right: 0 !important;
    }
    .daterangepicker .ranges{
    	margin: 0 4px !important;
    }
    .daterangepicker .ranges ul {
    	margin: 15px 0px 5px !important;
    }
    /* Date Range Mobile view updated  */
    
    /* report grouping   */
    .designCardSeven .cardDesign {
		width: calc(33.3% - 16px) !important;
	}
	.designCardSeven .cardDesign.favcarddesiign{
		width: calc(20% - 16px) !important;
	}
	.left-menu-reports {
		width: 25% !important;
	}
	 /* end report grouping   */
}
@media only screen and (max-width: 1280px) {
    .card-views > div,
    .formly_wrapper .width30,
    .formly_wrapper .date {
        width: 30%;
    }
    .bulkButton.md-button {
        min-width: max-content;
    }
    .bulkButton.md-button.plr20 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}
@media screen and (height: 900px) and (width: 1440px) and (orientation: landscape) {
  .quizzer-frame {
    height: calc(100vh - 430px);
  }
  body.errorVisible .quizzer-frame,
  body.notification .quizzer-frame,
  body.staticBanner .quizzer-frame{
    height: calc(100vh - 480px);
  }
  body.notification.errorVisible .quizzer-frame,
  body.notification.staticBanner .quizzer-frame,
  body.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 530px);
  }
  body.notification.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 580px);
  }
}
@media screen and (height: 950px) and (width: 1280px) and (orientation: landscape){
  .quizzer-frame {
    height: calc(100vh - 480px);
  }
  body.errorVisible .quizzer-frame,
  body.notification .quizzer-frame,
  body.staticBanner .quizzer-frame{
    height: calc(100vh - 530px);
  }
  body.notification.errorVisible .quizzer-frame,
  body.notification.staticBanner .quizzer-frame,
  body.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 580px);
  }
  body.notification.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 630px);
  }
}
@media only screen and (min-width: 1280px) and (max-width: 1281px) and (min-height:630px) and (max-height: 632px) and (orientation: landscape),
only screen and (min-width: 962px) and (max-width: 963px) and (min-height:430px) and (max-height: 602px) and (orientation: landscape) {
  .quizzer-frame {
    height: calc(100vh - 203px);
  }
  body.errorVisible .quizzer-frame,
  body.notification .quizzer-frame,
  body.staticBanner .quizzer-frame{
    height: calc(100vh - 253px);
  }
  body.notification.errorVisible .quizzer-frame,
  body.notification.staticBanner .quizzer-frame,
  body.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 303px);
  }
  body.notification.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 353px);
  }
}
@media only screen and (min-width: 846px) and (max-width: 847px) and (min-height:331px) and (max-height: 332px) and (orientation: landscape) {
  .quizzer-frame {
    height: calc(100vh - 163px);
  }
  body.errorVisible .quizzer-frame,
  body.notification .quizzer-frame,
  body.staticBanner .quizzer-frame{
    height: calc(100vh - 213px);
  }
  body.notification.errorVisible .quizzer-frame,
  body.notification.staticBanner .quizzer-frame,
  body.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 263px);
  }
  body.notification.errorVisible.staticBanner .quizzer-frame {
  	height: calc(100vh - 313px);
  }
}
@media only screen and (max-width: 1100px) {
    /* 1024 view in Left Menu starts */
    .salaryStructureTable {
        overflow: auto;
    }
    .salaryStructureTable .accordian-table {
        min-width: 1250px;
    }
    .salaryStructureTable .enhanced-table, .attendance-status-list {
        min-width: 1200px;
    }
    .salaryStructureTable .enhanced-table md-table-container {
        overflow: hidden !important;
    }
    /* 1024 view in Left Menu ends */
}
@media only screen and (max-width: 1024px) {
    .card-grid-view md-card {
        margin: 1%;
        width: 22.6%;
    }
    md-content,
    .niceScroll,
    .md-body-list,
    md-dialog-content,
    md-table-container,
    md-menu-content {
        overflow-y: auto !important;
    }
    .nicescroll-rails {
        opacity: 0 !important;
    }
    .tableScroll md-table-container,
    md-table-container {
        overflow-x: auto !important;
    }
    .footer-btns .md-button {
        min-height: 30px;
        line-height: 30px;
        font-size: 12px;
    }
    .menu-level md-menu-item > a.md-button {
        line-height: 36px;
        min-height: 36px;
    }
    .md-menu .menu-btn.md-button {
        line-height: inherit;
        min-height: inherit;
    }
    md-toolbar.md-header-cust .md-toolbar-tools h2 {
        font-size: 16px;
    }
    .adbanner p {
	    font-size: var(--default-fontsize);
	}
    .adbanner p a {
	    margin-left: 0px !important;
	}
	.adbanner img {
	    margin-right: 5px !important;
	}
	.designCardSeven.card-grid-view .cardDesign {
        width: calc(50% - 20px);
    }
}
@media (min-width: 768px) and (max-width: 1024px){
	/* LMS Related */
	/* .courseplanchapter-details {
		left: 64px !important;
		height: calc(100% - 105px) !important;
	}
	.courseplanchapterMenu .courseplanchapter-details {
		left: 0 !important;
		height: 100% !important;
	} */
	.map-session-content {
		padding: 4px;
	}
	.lmsheader ul.menulist li {
		margin: 0 !important;
		padding: 0 !important;
	}
    .livelecturemobileview .lmslistview-pagination {
        left: 64px !important;
    }
    /* End */
    
    /* Rubrics Sidebar */
    .rubricSidebar {
    	width: 380px;
    } 
}
@media only screen and (max-width: 992px) {
    
    .content_area_wrapper {
        /* height: calc(100% - 60px) */
    }
    /* .service_errors:not(.hide) ~ div .content_area_wrapper,
    body.errorVisible .content_area_wrapper:not(.wizards-wrapper),
    body.notification .content_area_wrapper:not(.wizards-wrapper),
    body.staticBanner .content_area_wrapper:not(.wizards-wrapper){
        height: calc(100% - 100px);
    }
    body.notification.errorVisible .content_area_wrapper:not(.wizards-wrapper),
    body.notification.staticBanner .content_area_wrapper:not(.wizards-wrapper),
    body.errorVisible.staticBanner .content_area_wrapper:not(.wizards-wrapper) {
     	height: calc(100% - 150px);
    }
    body.notification.errorVisible.staticBanner .content_area_wrapper:not(.wizards-wrapper) {
     	height: calc(100% - 200px);
    } */
}
@media only screen and (max-width: 980px) {
    .settings-wrap .list-item {
        width: 30.5%;
    }
    md-tooltip {
        font-size: 10px;
    }
    .formly_wrapper .width30,
    .formly_wrapper .date {
        width: 45.5%;
    }
   
}
@media only screen and (max-width: 960px) {
    .custom-dialog .template-data {
        max-width: 100%;
    }
    .custom-dialog md-dialog-content {
        box-sizing: border-box;
        min-width: inherit !important;
        width: 100%;
    }
    md-dialog {
        min-width: 540px;
    }
    md-dialog[aria-label='appbanner'] {
      min-width: inherit;
    }
    .card-grid-view md-card {
        width: 31%;
    }
    .list-wrap.mt-50.settings-wrap {
        margin-top: 30px !important;
    }
    .settings-wrap .list-item {
        border-radius: 0;
    }
    .editorbtns {
        padding: 35px 20px 0px;
    }
    .zone-info {
    	font-size: 12px;
	}
	.breadcrumb {
		right: 104px;
		/* max-width: 26%; */
	}
	.main-content .accordian-menu.left-menu~.content-view form[name="newStaffForm"] .footer-pagination,
	.purchase-bg .tab-height .footer-pagination{
	    width: calc(70% - 46px);
	}
	.settingsTab .footer-pagination {
	    width: calc(80% - 46px);
	}
	 .survey-add-question{
	    width: calc(81.5% - 64px) !important;
        min-width: calc(81.5% - 64px);
	}
	#time_table_preview_page .mobile-timetable-overlay{
		width: 100%;
	}
	.cochingMenu{
		overflow-x: auto;
	}
}
@media only screen and (max-width: 767px) {
	.top_header_wrap.top_search {
	    width: 100%;
		top: 60px;	
		right: -100%;
	}
	.top_header_wrap.top_search.in {
	    right: 0;
	}
	.headerSelectionFilter.showFilterOptions {
	    right: 8px;
	    width: calc(100% - 16px);
	    top: 111px;
	}
    .settings-wrap .list-item {
        width: 47%;
    }
    .card-grid-view md-card {
        margin: 2%;
        width: 45.5%;
    }
    .service_errors {
      /* max-height: 51px;
      overflow-y: auto;
      padding: 5px 15px 5px 20px; */
    }
    .service_errors .md-icon-button {
      /* min-width: 28px; */
    } 
    .studentBanner .md-button {     
      margin: 6px 0 0 0 !important;
    }
    .top_header_wrap .md-toolbar-tools {
	    padding: 0 8px;
	    padding-top: 10px;
    } 
    menuContent::before {
	    right: 78px !important;
	}
	.rightMenuSettings::before {
		right: 25px;
	    /* top: -7px; */
	    width: 12px;
	    height: 12px;
	}
	.menuContent::before {
	    right: 67px !important;
	}
	.main-logo {
		margin: 0;
	}	
	.activationDialog md-dialog {
    	max-width: 90%;
		min-width: 90%;
	}
	.nextAcademyVisible .breadcrumb {
	    right: 160px;
	}
	.main-content .accordian-menu.left-menu~.content-view form[name="newStaffForm"] .footer-pagination {
	    width: calc(70% - 2px);
	}
	.purchase-bg .tab-height .footer-pagination,
	.settingsTab .footer-pagination {
	  	width: 100%;
	}
	
	html[lang="en"] footer.footer-section{
		width: 100%;
    	left: 0;
	}
	html[lang="ar"] footer.footer-section{
		width: 100%;
    	right: 0;
	} 
	
	.roleADMISSION_USER .modal-tabs md-pagination-wrapper {
    	display: flex;
    	align-items: flex-start;
    	-webkit-align-items: flex-start;
    }
    .roleADMISSION_USER .wizards-wrapper .top_header_wrap a {
    	max-width: initial;
    	flex: initial;
    	-webkit-flex: initial;
    }
	.roleADMISSION_USER .modal-tabs .md-tab h3 {
		font-size: 10px;
		white-space: normal;
	    line-height: 14px;
	}
    .roleADMISSION_USER .modal-tabs .md-tab:after {
    	display:none;
    }
    .roleADMISSION_USER .top_header_wrap .md-toolbar-tools {
    	padding-top: 15px;
    }
    .roleADMISSION_USER .wizards-wrapper .breadcrumb {
    	position: absolute;
    	right: 0;
	    line-height: 11px;
	    top: 0;
    }
    .roleADMISSION_USER .wizards-wrapper .breadcrumb span {
    	display: flex;
    }
    .roleADMISSION_USER .wizards-wrapper .breadcrumb span label {
    	margin-left: 5px;
    }
    .roleADMISSION_USER .wizards-wrapper .breadcrumb label .material-icons {
    	height: 20px;
	    width: 20px;
	    min-height: 20px;
	    min-width: 20px;
	    font-size: 20px
    }
}
@media only screen and (max-height: 768px) {
	md-menu-content.custom-mdmenu {
	    max-height: 80vh;
    }
}
@media only screen and (max-width: 640px) {
    md-dialog {
        min-width: 90%;
    }
    .md-table-pagination {
        padding: 0 5px;
    }
    .md-table-pagination > .buttons:not(:first-child),
    .md-table-pagination > .limit-select:not(:first-child) {
        margin-left: 15px;
    }
    .md-table-pagination > .buttons {
        margin-right: 0;
    }
    .proctroingTabBg .student-crads {
        width: calc(33% - 22px);
    }
    .add-wrap {
        padding: 25px 12px 5px;
    }
    
    /* Session Alert Message Starts */
    .sessionAlertBlock {
        width: 320px;
    }
    /* Session Alert Message Ends */

}
@media only screen and (max-width: 480px) {
    .card-grid-view md-card {
        margin: 0 0 5%;
        width: 100%;
    }
    .settings-wrap .list-item {
        display: block;
        margin: 0 auto 25px;
        width: 95%;
    }
    .custom-dialog md-dialog-content {
        min-width: inherit !important;
    }
    .md-table-pagination md-select {
        min-width: 26px;
    }
    .md-table-pagination > .buttons:not(:first-child),
    .md-table-pagination > .limit-select:not(:first-child) {
        margin-left: 12px;
    }
    .md-table-pagination > * {
        height: 42px;
    }
    .md-table-pagination {
        font-size: var(--default-fontsize);
        padding: 0 5px;
    }
    .md-table-pagination > .buttons {
        margin-right: 0;
    }
    .md-table-pagination > .buttons > .label + .md-button.md-icon-button {
        margin-left: 2px;
    }
    .md-table-pagination > .buttons > .md-button.md-icon-button {
        height: auto;
        margin: 0;
        padding: 0;
        width: auto;
    }
    .header-link {
      display: none;
    }
    .top_header_wrap .session_text {
    	display: none;
    }
    .rightMenuSettings
    {
    	width: 100%; 
    }
    .notificationMenu {
    	right: -110%;
    	width: 100%;
    }
    .left_navigation {
    	width: 100%;
    	left: -120%;
    }
    .custom-mdmenu ul {
        padding: 8px;
    	padding-top: 6px;
    }
   
    .proctroingTabBg .student-crads {
        width: calc(50% - 22px);
    }

    /* Session Alert Message Starts */
    .sessionAlertBlock {
        width: 210px;
    }
    /* Session Alert Message Ends */
}
@media all and (-ms-high-contrast: none),(-ms-high-contrast: active) {
    table.md-custom-table th.md-column {
        box-sizing: inherit;
        transition: all .2s ease;
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
    }
    .select-dropdown select::-ms-expand {
        display: none;
    }
    .left_navigation md-list md-list-item div img {
        max-width: 40px;
        width: 100%;
    }
    .select-dropdown select:focus::-ms-value {
        background-color: var(--secondary-bg-color);
        color: rgba(0, 0, 0, .87)
    }
    .select-dropdown label::after {
        right: 22px;
    }
    :not(.portrait).mdp-datepicker .mdp-datepicker-date-wrapper {
        box-sizing: content-box
    }
    .mdp-timepicker {
        max-width: 470px;
        width: 100%;
    }
}

/*=========== Common CSS Code Changes Start: ===========*/
html[lang="ar"] {
    direction: rtl;
    font-family: "TraditionalArabic";
} 
/*=========== Font Size CSS Code Changes Start: ===========*/

/* custom fonts */
html[lang="ar"] .font16,
html[lang="ar"] .fontsize16,
html[lang="ar"] .fontsize18,
html[lang="ar"] .font18  {
    font-size: var(--ar_fontsizemainheading) !important;
}
html[lang="ar"] .font14,
html[lang="ar"] .fontsize14,
html[lang="ar"] .font15 {
    font-size: var(--ar_fontsizelabel) !important;
}
html[lang="ar"] .font13,
html[lang="ar"] .font12, 
html[lang="ar"] .fontsize12  {
    font-size: var(--ar_fontsizebody);
} 

html[lang="ar"] button, 
html[lang="ar"] input, 
html[lang="ar"] select, 
html[lang="ar"] textarea,
html[lang="ar"] .md-button {
	font-size: var(--ar_fontsizebody);
	font-family: "TraditionalArabic";
} 

html[lang="ar"] body,
html[lang="ar"] .greyClass,
html[lang="ar"] .left_navigation md-list md-list-item div span,
html[lang="ar"] .left_navigation h5.session_text,
html[lang="ar"] .rightMenuSettings a.md-button,
html[lang="ar"] .custom-mdmenu h3,
html[lang="ar"] .lmsquicklink ul li p,
html[lang="ar"] .fee_collected_inr h3,
html[lang="ar"] .toolbar-input, 
html[lang="ar"] .report-table .md-cell span,
html[lang="ar"] table.md-custom-table td.md-cell, 
html[lang="ar"] table.md-custom-table th.md-column,
html[lang="ar"] .md-table-pagination,
html[lang="ar"] .md-tab,
html[lang="ar"] md-menu-content.customMdmenu md-menu-item>.md-button,
html[lang="ar"] .attendance-view p,
html[lang="ar"] .error_box .error_text,
html[lang="ar"] .courses-card-wrapper .courses-card .top-header .subjectstyle,
html[lang="ar"] .listView-wrapper h3,
html[lang="ar"] .lmslistview h3,
html[lang="ar"] .theme-settings.quick-settings .ts-themes li a,
html[lang="ar"] .fc-ltr, 
html[lang="ar"] .fc-axis,
html[lang="ar"] .custommultipleselect md-select-menu md-content md-optgroup md-option .md-text, 
html[lang="ar"] .custommultipleselect md-checkbox .md-label,
html[lang="ar"] .hw-userdetails,
html[lang="ar"] .cs_treeview ul li .listitem,
html[lang="ar"] .librarynewview ul li .resourceCount,
html[lang="ar"] ul.chapterresources li,
html[lang="ar"] ul.ec_videoType li,
html[lang="ar"] .md-body-1,
html[lang="ar"] .summarydetails,
html[lang="ar"] ul.lictureviewdetails li,
html[lang="ar"] .drop-area .drop-text,
html[lang="ar"] .llvideo-list md-list md-list-item .md-list-item-text h3,
html[lang="ar"] ul.md-tabs-style li,
html[lang="ar"] .radio-style .upload-radio md-radio-button,
html[lang="ar"] .resourcesCardView md-card .resource-content .heading,
html[lang="ar"] .homeworksection .homeworksection-content,
html[lang="ar"] ul.resourcesList li lable,
html[lang="ar"] ul.resourcesList li .resourceCount,
html[lang="ar"] ul.resourcesList h3,
html[lang="ar"] .lecture-details ul li,
html[lang="ar"] .ll-switch-btn .md-button.swipe-btn,
html[lang="ar"] .radio-wrapper md-radio-button,
html[lang="ar"] .width220,
html[lang="ar"] .chapter-session,
html[lang="ar"] .resource-heading,
html[lang="ar"] .newchaptersummary h3,
html[lang="ar"] .subheader-box h3,
html[lang="ar"] .listView-wrapper .listView-topheader,
html[lang="ar"] .sub-date-view p,
html[lang="ar"] .examcorner-menu ul li,
html[lang="ar"] .examcorner-menu ul h3,
html[lang="ar"] .qaList md-list md-list-item.md-3-line .md-list-item-text p,
html[lang="ar"] .qaList md-list md-list-item.md-3-line .md-list-item-text h4,
html[lang="ar"] .plus_minus md-input-container .md-input,
html[lang="ar"] .count-circle,
html[lang="ar"] .map_students h3,
html[lang="ar"] .tabs-wrapper .md-tab h3,
html[lang="ar"] .conversations-block,
html[lang="ar"] .edit-activate p,
html[lang="ar"] .live-report .headerTitle,
html[lang="ar"] .live-report .bodyList,
html[lang="ar"] .daterangepicker .ranges li,
html[lang="ar"] .lmscardview .lmscardviewcontent .resource-content .heading,
html[lang="ar"] .advanceBox,
html[lang="ar"] .settings-wrap.card-grid-view md-card-title-text .md-headline,
html[lang="ar"] .examination-dialog .modal-tabs .md-tab h3,
html[lang="ar"] .examination-dialog .text-wrap > span,
html[lang="ar"] .tree .md-headline ,
html[lang="ar"] .add-main-level label,
html[lang="ar"] .side-panel .panel-body .panel-title,
html[lang="ar"] .card-grid-view md-card-title-text .md-headline,
html[lang="ar"] .welcome_block p.paragraph,
html[lang="ar"] .custom-data-table.md-table td.md-cell,
html[lang="ar"] .custom-data-table.md-table th.md-column,
html[lang="ar"] .staff-dashboard-updated .attendance-view h3,
html[lang="ar"] .staff-dashboard-updated .quick-link h4, 
html[lang="ar"] .hc-chart-wrap.course-chat-wrap p label,
html[lang="ar"] .principalsection .principalsection-content,
html[lang="ar"] .user-manage.card-grid-view md-card-title-text .md-headline,
html[lang="ar"] .user-manage.card-grid-view .footer-data label,
html[lang="ar"] .card-grid-view md-card-title-text .md-headline,
html[lang="ar"] .replicate-tree li md-card md-card-content h3,
html[lang="ar"] ul.exam-types li,
html[lang="ar"] .principal_wrapper .topnav,
html[lang="ar"] .niceScrool .header,
html[lang="ar"] .niceScrool .mark_percentage table td:first-child,
html[lang="ar"] .chapter-list .chapter-data .chapter-img+span,
html[lang="ar"] .chapter-list .chapter-data .chapter-img+span label,
html[lang="ar"] .custom_studentlist md-list-item.md-2-line .md-list-item-text h3, 
html[lang="ar"] .custom_studentlist md-list-item.md-2-line>.md-no-style .md-list-item-text h3,
html[lang="ar"] .filter-error p,
html[lang="ar"] .question-type,
html[lang="ar"] .bread-crumb ul li p,
html[lang="ar"] .assessmentView,
html[lang="ar"] .lectureMenu md-list-item .md-button,
html[lang="ar"] .map-resources span,
html[lang="ar"] .hwevaluation-newstyle .totalScore,
html[lang="ar"] .session-header p,
html[lang="ar"] .otherFormatsCard .PostData p,
html[lang="ar"] .student-details h4,
html[lang="ar"] .modal-tabs .md-tab h3,
html[lang="ar"] .calender-view .cal-month-box .custom-cell span[data-cal-date],
html[lang="ar"] .student_assessment md-card,
html[lang="ar"] .announce-files.disc-comment-list h3,
html[lang="ar"] .comment-item p,
html[lang="ar"] .comment-item h4, 
html[lang="ar"] .announce-files h4,
html[lang="ar"] .disc-header h3,
html[lang="ar"] .activity-header h3,
html[lang="ar"] .student_data h3 small,
html[lang="ar"] .footer-data label,
html[lang="ar"] .card-grid-view .md-sublabel,
html[lang="ar"] .map-widget .md-header-cust h2 span,
html[lang="ar"] .template-name,
html[lang="ar"] .add-wrap-content .list-items li .md-label label,
html[lang="ar"] .custom-drag-content md-menu-item .md-button,
html[lang="ar"] .ar-font-increse,
html[lang="ar"] .folded h4,
html[lang="ar"] .sms-note,
html[lang="ar"] #composeForm .list-header h3,
html[lang="ar"] #composeForm .sm-heading,
html[lang="ar"] .compose-element .md-toolbar-tools h1, 
html[lang="ar"] .compose-element .md-toolbar-tools h2, 
html[lang="ar"] .compose-element .md-toolbar-tools h3  {
	font-size: var(--ar_fontsizebody);
}
html[lang="ar"] .dashboardliveStatus,
html[lang="ar"] .tool-tip .tooltip-text,
html[lang="ar"] .cs_treeview ul li,
html[lang="ar"] .ll-liveStatus  {
	font-size: 15px;
}
/* floatings items, 11px items, small size text items etc */ 
html[lang="ar"] .lmsheader ul.menulist li label,
html[lang="ar"] .lmsheader ul.menulist li.active label,
html[lang="ar"] .navigationheader-legend p,
html[lang="ar"] .custom-input-field p,
html[lang="ar"] .lms-navigationheader-legend p, 
html[lang="ar"] .navigationheader-legend .info-btn,
html[lang="ar"] .custom-input-field .info-btn,
html[lang="ar"] .lms-navigationheader-legend .info-btn,
html[lang="ar"] .custom-tab .custom-tab-header li .title,
html[lang="ar"] .searchBy p,
html[lang="ar"] .event-row h3,
html[lang="ar"] md-input-container .md-char-counter, 
html[lang="ar"] md-input-container .md-input-message-animation,
html[lang="ar"] .hwc_resources ul li,
html[lang="ar"] .cs_treeview.chapter-left-menu .chapter-list .sub-chapter-list,
html[lang="ar"] .header-nav-band ul.top_links li label,
html[lang="ar"] .videoStatus md-card md-card-content label,
html[lang="ar"] .videoStatus md-card .topHeader .liveStatus,
html[lang="ar"] .dropdownBorder p,
html[lang="ar"] .sub-date-view label,
html[lang="ar"] .md-caption,
html[lang="ar"] .completedClass,
html[lang="ar"] .legendStyle p,
html[lang="ar"] .pendingClass,
html[lang="ar"] .section-list-inner span label,
html[lang="ar"] .img-header,
html[lang="ar"] .cctv-block p,
html[lang="ar"] .pos-text,
html[lang="ar"] .staff-dashboard-updated md-select.custom-select-input .md-select-value span .md-text,
html[lang="ar"] .staff-dashboard-updated .chart .text-wrap-student p,
html[lang="ar"] .hc-chart-wrap p,
html[lang="ar"] .hc-chart-wrap.course-chat-wrap p,
html[lang="ar"] .custom-radio-tab md-radio-button .md-label,
html[lang="ar"] .attenance-details strong,
html[lang="ar"] .attenance-details p,
html[lang="ar"] .mark-details label,
html[lang="ar"] .circular-list .attend-per,
html[lang="ar"] .timetable-widget .custom-phases-content,
html[lang="ar"] .cal-week-box [data-event-class],
html[lang="ar"] .niceScrool .mark_percentage table th,
html[lang="ar"] .custom_studentlist md-list-item.md-2-line .md-list-item-text p, 
html[lang="ar"] .custom_studentlist md-list-item.md-2-line>.md-no-style .md-list-item-text p,
html[lang="ar"] .reportsHeader .title,
html[lang="ar"] .hwresource-card md-card .font10,
html[lang="ar"] .assessmentaction span,
html[lang="ar"] .headersubitems .viewitems .viewitemstyle,
html[lang="ar"] .studentlistcontent .searchinputbox .searchbox-font-adjust span,
html[lang="ar"] .studentlistcontent .searchinputbox .searcBox .md-input,
html[lang="ar"] .event-row p,
html[lang="ar"] .calendar-timetable th.fc-day-header.fc-widget-header,
html[lang="ar"] .fc-event-container > .week-event-list p,
html[lang="ar"] .custom-data-table th.md-column .sm-label,
html[lang="ar"] .examcorner-list .listView-content span.font10,
html[lang="ar"] .activity-feed-details li,
html[lang="ar"] .activity-feed-owner li label,
html[lang="ar"] .section-display li > span,
html[lang="ar"] .custom-checkbox-list md-checkbox .md-label p,
html[lang="ar"] .class-list md-radio-button .md-label label,
html[lang="ar"] .md-table-toolbar md-radio-button .md-label label,
html[lang="ar"] .report-table .md-cell .profile-img+span label,
html[lang="ar"] .ar-title-font md-card-title .card-info,
html[lang="ar"] .ar-title-font md-card-content .card-info,
html[lang="ar"] .calender_evnt p,
html[lang="ar"] .calender_evnt p span,
html[lang="ar"] .navigationheader-legend  {
	font-size: var(--default-font14);
}
html[lang="ar"] .lmsheader ul.menulist li label,
html[lang="ar"] .lmsheader ul.menulist li.active label,
html[lang="ar"] .class-section,
html[lang="ar"] .grid-dash-board md-grid-tile md-toolbar md-truncate,
html[lang="ar"] .examcornercardview h3,
html[lang="ar"] .chaptersessionlist .heading,
html[lang="ar"] .md-dialog-content-body p,
html[lang="ar"] .videoStatus md-card .topHeader p,
html[lang="ar"] .lms_coverflow coverflow-card .cover_content .cover_heading,
html[lang="ar"] .breadCrumb ul li,
html[lang="ar"] .cardGridView h3,
html[lang="ar"] .md-subhead,
html[lang="ar"] .calender-wrap h2,
html[lang="ar"] .filter-content .md-toolbar-tools h2,
html[lang="ar"] .student-heading h4,
html[lang="ar"] .item .custom_folded h4  {
	font-size: var(--default-fontsize);
} 
html[lang="ar"] .content_area_wrapper md-toolbar.md-header-cust .md-toolbar-tools h2,
html[lang="ar"] .lmsbody md-toolbar.lmsheader .md-toolbar-tools h2,
html[lang="ar"] .lmsbody .header-nav-band .md-toolbar-tools h2, 
html[lang="ar"] .userNameDetails h3,
html[lang="ar"] .widget-header,
html[lang="ar"] .school_name,
html[lang="ar"] .menuHeader,
html[lang="ar"] .details-content h3,
html[lang="ar"] .header-nav-band .md-toolbar-tools h3,
html[lang="ar"] .custom-dialog .md-toolbar-tools h2, 
html[lang="ar"] .custom-dialog .md-toolbar-tools h3,
html[lang="ar"] .customDialog .md-toolbar-tools h2,
html[lang="ar"] .attendance-chart .text-wrap h2 {
	font-size: var(--ar_fontsizemainheading) !important;
}
html[lang="ar"] .font11,
html[lang="ar"] .hint {
    font-size: 13px !important;
}
html[lang="ar"] .navigationheader-legend  {
	font-size: var(--default-font14);
}
html[lang="ar"] .navigationheader-legend p {
    font-size: 12px;
    top: -9px;
}
.header-nav-band .md-toolbar-tools h3 {
    font-size: 18px !important;
}
html[lang="ar"] .md-custom-table.md-table:not(.md-row-select) td.md-cell:first-child, 
html[lang="ar"] .md-custom-table.md-table:not(.md-row-select) th.md-column:first-child {
	text-align: right;
}
html[lang="ar"] .header-nav-band .md-toolbar-tools h3 {
    font-size: 20px !important;
}
/*=========== Font Size CSS Code Changes Ends: ===========*/

/* text alignments */
html[lang="ar"] .align-left {
    text-align: right !important;
}
html[lang="ar"] .align-right {
    text-align: left !important;
}
html[lang="ar"] .text-left {
    text-align: right !important;
}
html[lang="ar"] .text-right {
    text-align: left !important;
}
html[lang="ar"] .pull-right {
    float: left;
}

/* Borders */
html[lang="ar"] .border-right {
    border-left: 1px solid var(--border-color) !important;
}
html[lang="ar"] .border-left {
    border-right: 1px solid var(--border-color) !important;
} 

/* padding and margin */ 
html[lang="en"] .pr-0 {
    padding-right: 0 !important;
}
html[lang="ar"] .pr-0 {
	padding-left: 0 !important;
}
html[lang="ar"] .ml-0 {
    margin-right: 0 !important;
}
html[lang="ar"] .ml-5 {
    margin-right: 5px !important;
}
html[lang="ar"] .ml-10 {
    margin-right: 10px;
}
html[lang="ar"] .ml-15 {
    margin-right: 15px;
}
html[lang="ar"] .ml-20 {
    margin-right: 20px !important;
}
html[lang="ar"] .ml-25 {
    margin-right: 25px !important;
}
html[lang="ar"] .ml-30 {
    margin-right: 30px !important;
}
html[lang="ar"] .ml-40 {
    margin-right: 40px;
}
html[lang="ar"] .ml-65 {
    margin-left: 65px !important;
}
html[lang="ar"] .mr-0 {
    margin-left: 0 !important;
}
html[lang="ar"] .mr-5 {
    margin-left: 5px !important;
}
html[lang="ar"] .mr-10 {
    margin-left: 10px !important;
}
html[lang="ar"] .mr-15 {
    margin-left: 15px !important;
}
html[lang="ar"] .mr-20 {
    margin-left: 20px !important;
}
html[lang="ar"] .mr-25 {
    margin-left: 25px !important;
}
html[lang="ar"] .mr-30 {
    margin-left: 30px !important;
}
html[lang="ar"] .mr-35 {
    margin-left: 35px !important;
}
html[lang="ar"] .mr-50 {
    margin-left: 50px !important;
}
html[lang="ar"] .mr-75 {
    margin-left: 75px !important;
}
html[lang="ar"] .pl-0 {
    padding-right: 0 !important;
}
html[lang="ar"] .pl-5 {
    padding-right: 5px !important;
}
html[lang="ar"] .pl-10 {
    padding-right: 10px !important;
}
html[lang="ar"] .pl-15 {
    padding-right: 15px;
}
html[lang="ar"] .pl-30 {
    padding-right: 30px;
}
html[lang="ar"] .pr-5 {
    padding-left: 5px !important;
}
html[lang="ar"] .pr-10 {
    padding-left: 10px !important;
}
html[lang="ar"] .pr-15 {
    padding-left: 15px !important;
}
html[lang="ar"] .pr-20 {
    padding-left: 20px !important;
}
html[lang="ar"] .pr-25 {
    padding-left: 25px !important;
}
html[lang="ar"] .pr-50 {
    padding-left: 50px;
}
html[lang="ar"] .pl-15 {
    padding-right: 15px !important;
}
html[lang="ar"] .pl-25 {
    padding-right: 25px !important;
}
html[lang="ar"] .pl-20 {
    padding-right: 20px !important;
}
html[lang="ar"] .m-l-8  {
	margin-right: 8px;
}
html[lang="ar"] .m-r-8 {
	margin-left: 8px;
}
html[lang="ar"] .p-l-8 {
	padding-right: 8px;
}
html[lang="ar"] .p-l-12 {
	padding-right: 12px;
}
html[lang="ar"] .p-l-12 {
	padding-right: 12px;
}
html[lang="ar"] .m-r-12 {
	margin-left: 12px;
}
html[lang="ar"] .m-l-12 {
	margin-right: 12px;
}
html[lang="ar"] .p-l-16 {
	padding-right: 16px !important;
}
html[lang="ar"] .m-r-0 {
  margin-left: 0px !important;
  margin-left: 0rem !important;
}
html[lang="ar"] .p-r-0 {
  padding-left: 0px !important;
  padding-left: 0rem !important;
}
html[lang="ar"] .m-r-5 {
  margin-left: 5px !important;
  margin-left: 0.5rem !important;
}
html[lang="ar"] .p-r-5 {
  padding-left: 5px !important;
  padding-left: 0.5rem !important;
}
html[lang="ar"] .m-r-10 {
  margin-left: 10px !important;
  margin-left: 1rem !important;
}
html[lang="ar"] .p-r-10 {
  padding-left: 10px !important;
  padding-left: 1rem !important;
}
html[lang="ar"] .m-r-15 {
  margin-left: 15px !important;
  margin-left: 1.5rem !important;
}
html[lang="ar"] .p-r-15 {
  padding-left: 15px !important;
  padding-left: 1.5rem !important;
}
html[lang="ar"] .m-l-15 {
  margin-right: 15px !important;
  margin-right: 1.5rem !important; 
}
html[lang="ar"] .p-l-15 {
  padding-right: 15px !important;
  padding-right: 1.5rem !important; 
}
html[lang="ar"] .m-l-16 {
	margin-right: 16px;
}
html[lang="ar"] .m-r-20 {
  margin-left: 20px !important;
  margin-left: 2rem !important;
}
html[lang="ar"] .p-r-20 {
  padding-left: 20px !important;
  padding-left: 2rem !important;
}
html[lang="ar"] .m-r-25 {
  margin-left: 25px !important;
  margin-left: 2.5rem !important;
}
html[lang="ar"] .p-r-25 {
  padding-left: 25px !important;
  padding-left: 2.5rem !important;
}
html[lang="ar"] .m-r-30 {
  margin-left: 30px !important;
  margin-left: 3rem !important;
}
html[lang="ar"] .p-r-30 {
  padding-left: 30px !important;
  padding-left: 3rem !important;
}
html[lang="ar"] .m-r-35 {
  margin-left: 35px !important;
  margin-left: 3.5rem !important;
}
html[lang="ar"] .p-r-35 {
  padding-left: 35px !important;
  padding-left: 3.5rem !important;
}
html[lang="ar"] .m-r-40 {
  margin-left: 40px !important;
  margin-left: 4rem !important;
}
html[lang="ar"] .p-r-40 {
  padding-left: 40px !important;
  padding-left: 4rem !important;
}
html[lang="ar"] .m-r-45 {
  margin-left: 45px !important;
  margin-left: 4.5rem !important;
}
html[lang="ar"] .p-r-45 {
  padding-left: 45px !important;
  padding-left: 4.5rem !important;
}
html[lang="ar"] .m-r-50 {
  margin-left: 50px !important;
  margin-left: 5rem !important;
}
html[lang="ar"] .p-r-50 {
  padding-left: 50px !important;
  padding-left: 5rem !important;
}
html[lang="ar"] .m-l-0 {
  margin-right: 0px !important;
  margin-right: 0rem !important;
}
html[lang="ar"] .p-l-0 {
  padding-right: 0px !important;
  padding-right: 0rem !important;
}
html[lang="ar"] .m-l-5 {
  margin-right: 5px !important;
  margin-right: 0.5rem !important;
}
html[lang="ar"] .p-l-5 {
  padding-right: 5px !important;
  padding-right: 0.5rem !important;
}
html[lang="ar"] .m-l-10 {
  margin-right: 10px !important;
  margin-right: 1rem !important;
}
html[lang="ar"] .p-l-10 {
  padding-right: 10px !important;
  padding-right: 1rem !important;
}
html[lang="ar"] .m-l-20 {
  margin-right: 20px !important;
  margin-right: 2rem !important;
}
html[lang="ar"] .p-l-20 {
  padding-right: 20px !important;
  padding-right: 2rem !important;
}
html[lang="ar"] .m-l-25 {
  margin-right: 25px !important;
  margin-right: 2.5rem !important;
}
html[lang="ar"] .p-l-25 {
  padding-right: 25px !important;
  padding-right: 2.5rem !important;
}
html[lang="ar"] .m-l-30 {
  margin-right: 30px !important;
  margin-right: 3rem !important;
}
html[lang="ar"] .p-l-30 {
  padding-right: 30px !important;
  padding-right: 3rem !important;
}
html[lang="ar"] .m-l-35 {
  margin-right: 35px !important;
  margin-right: 3.5rem !important;
}
html[lang="ar"] .p-l-35 {
  padding-right: 35px !important;
  padding-right: 3.5rem !important;
}
html[lang="ar"] .m-l-40 {
  margin-right: 40px !important;
  margin-right: 4rem !important;
}
html[lang="ar"] .p-l-40 {
  padding-right: 40px !important;
  padding-right: 4rem !important;
}
html[lang="ar"] .m-l-45 {
  margin-right: 45px !important;
  margin-right: 4.5rem !important;
}
html[lang="ar"] .p-l-45 {
  padding-right: 45px !important;
  padding-right: 4.5rem !important;
}
html[lang="ar"] .m-l-50 {
  margin-right: 50px !important;
  margin-right: 5rem !important;
}
html[lang="ar"] .p-l-50 {
  padding-right: 50px !important;
  padding-right: 5rem !important;
} 
html[lang="ar"] .p-l-70{
	padding-right: 70px;
}


/* floating menu */
html[lang="ar"] .navigationheader-legend,
html[lang="ar"] .lms-navigationheader-legend,
html[lang="ar"] .custom-input-field {
	margin-right: 0;
	margin-left: 15px;
} 
html[lang="ar"] .navigationheader-legend .md-select-value,
html[lang="ar"] .custom-input-field .md-select-value,
html[lang="ar"] .lms-navigationheader-legend .md-select-value,
html[lang="ar"] md-input-container.navigationheader-legend .md-input,
html[lang="ar"] md-input-container.custom-input-field .md-input,  
html[lang="ar"] md-input-container.lms-navigationheader-legend .md-input,  
html[lang="ar"] .navigationheader-legend md-input-container .md-input,
html[lang="ar"] .lms-navigationheader-legend md-input-container .md-input,
html[lang="ar"] .custom-input-field md-input-container .md-input,
html[lang="ar"] .custom-date.navigationheader-legend mdp-date-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-date.navigationheader-legend mdp-date-picker md-input-container label:not(.md-no-float):not(.md-container-ignore), 
html[lang="ar"] .custom-time.navigationheader-legend mdp-time-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-time.navigationheader-legend mdp-time-picker md-input-container label:not(.md-no-float):not(.md-container-ignore),
html[lang="ar"] .custom-date.lms-navigationheader-legend mdp-date-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-date.lms-navigationheader-legend mdp-date-picker md-input-container label:not(.md-no-float):not(.md-container-ignore), 
html[lang="ar"] .custom-time.lms-navigationheader-legend mdp-time-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-time.lms-navigationheader-legend mdp-time-picker md-input-container label:not(.md-no-float):not(.md-container-ignore),
html[lang="ar"] .custom-date.custom-input-field mdp-date-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-date.custom-input-field mdp-date-picker md-input-container label:not(.md-no-float):not(.md-container-ignore), 
html[lang="ar"] .custom-time.custom-input-field mdp-time-picker md-input-container .md-placeholder, 
html[lang="ar"] .custom-time.custom-input-field mdp-time-picker md-input-container label:not(.md-no-float):not(.md-container-ignore)  {
	padding-left: 2px !important;
	padding-right:  8px;
	font-size: var(--default-font14);
}
html[lang="ar"] .navigationheader-legend .date-range-icon,
html[lang="ar"] .lms-navigationheader-legend .date-range-icon,
html[lang="ar"] .custom-input-field .date-range-icon {
   	right: auto !important;	
    left: 5px !important;
    direction: ltr;
}
html[lang="ar"] .navigationheader-legend p,
html[lang="ar"] .custom-input-field p, 
html[lang="ar"] .lms-navigationheader-legend p, 
html[lang="ar"] .navigationheader-legend .info-btn,
html[lang="ar"] .lms-navigationheader-legend .info-btn,
html[lang="ar"] .custom-input-field .info-btn {
	left: auto;
    right: 9px;	
}
html[lang="ar"] md-input-container.custom-input-field label:not(.md-container-ignore) {
	left: auto !important;
	right: 9px;
}
html[lang="ar"] md-input-container label:not(.md-container-ignore) {
	left: auto;
	right: 0;
}
html[lang="ar"] .custom-date.navigationheader-legend mdp-date-picker .md-button.md-icon-button,
html[lang="ar"] .custom-date.custom-input-field mdp-date-picker .md-button.md-icon-button, 
html[lang="ar"] .custom-date.lms-navigationheader-legend mdp-date-picker .md-button.md-icon-button, 
html[lang="ar"] .custom-time.navigationheader-legend mdp-time-picker .md-button.md-icon-button,
html[lang="ar"] .custom-time.lms-navigationheader-legend mdp-time-picker .md-button.md-icon-button,
html[lang="ar"] .custom-time.custom-input-field mdp-time-picker .md-button.md-icon-button {
	right: auto;
    left: 4px;
}
html[lang="ar"] .floatingSelect md-input-container.md-input-focused label:not(.md-no-float), 
html[lang="ar"] .floatingSelect md-input-container.md-input-has-placeholder label:not(.md-no-float), 
html[lang="ar"] .floatingSelect md-input-container.md-input-has-value label:not(.md-no-float), 
html[lang="ar"] .floatingSelect.md-input-focused label:not(.md-no-float), 
html[lang="ar"] .floatingSelect.md-input-has-placeholder label:not(.md-no-float), 
html[lang="ar"] .floatingSelect.md-input-has-value label:not(.md-no-float) {
    left: auto;
    right: 8px;
}
/*=========== Material CSS Code Changes Starts: ===========*/
/* Radio Group */ 
html[lang="ar"] md-radio-group.layout-gt-lg-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-gt-md-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-gt-sm-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-gt-xs-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-lg-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-md-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-sm-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-xl-row md-radio-button, 
html[lang="ar"] md-radio-group.layout-xs-row md-radio-button {
	margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] md-radio-button .md-label,
html[lang="ar"] md-checkbox .md-label {
	margin-left: 0;
    margin-right: 30px
}

html[lang="ar"] md-radio-button .md-container,
html[lang="ar"] md-checkbox .md-container {
	left: auto;
    right: 0;
}
html[lang="ar"] md-switch .md-container {
	margin-right: 0;
    margin-left: 8px;
}
html[lang="ar"] md-input-container .md-placeholder, 
html[lang="ar"] md-input-container label:not(.md-no-float):not(.md-container-ignore) {
	padding-left: 0;
	padding-right: 3px;
	-webkit-transform-origin: right top;
    transform-origin: right top;
    left: auto;
    right: 9px;
}

html[lang="ar"] md-input-container.md-icon-left {
    padding-right: 36px;
    padding-left: 0;	
} 
html[lang="ar"] md-input-container>md-icon {
	left: auto;
    right: 2px;	
}
html[lang="ar"] .md-toolbar-tools>.md-button:last-child {
	margin-right: 8px;
    margin-left: 0;
}
html[lang="ar"] md-select-menu[multiple] md-option.md-checkbox-enabled {
	padding-right: 40px;
    padding-left: 16px;
}
html[lang="ar"] md-select-menu[multiple] md-option.md-checkbox-enabled .md-container {
	left: auto;
    right: 0;	
    margin-left: 0;
    margin-right: 10px
}
html[lang="ar"] md-menu-item>.md-button {
	text-align: right;
}
html[lang="ar"] .custom-button-tooltip .md-button {
	text-align: right;
}
html[lang="ar"] .md-toolbar-tools > .md-button:first-child {
	margin-left: 8px;
    margin-right: 0;
}
html[lang="ar"] md-dialog .md-actions .md-button, 
html[lang="ar"] md-dialog md-dialog-actions .md-button {
	margin-right: 8px;
    margin-left: 0;
}
html[lang="ar"] md-menu-item>.md-button md-icon {
	margin-right: 0;
    margin-left: 16px;	
}
html[lang="ar"] md-list-item.md-no-proxy.md-button, 
html[lang="ar"] md-list-item .md-no-style.md-button {
	text-align: right;	
}
html[lang="ar"] .bottomBtn {
	right: auto;
	left: 16px; 
}
html[lang="ar"] .bottomBtn.custom-pos {
	right: auto;
    left: 16px;	
}
html[lang="ar"] md-radio-group.layout-gt-lg-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-gt-md-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-gt-sm-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-gt-xs-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-lg-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-md-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-sm-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-xl-row md-radio-button:last-of-type, 
html[lang="ar"] md-radio-group.layout-xs-row md-radio-button:last-of-type {
	margin-left: 0;
    margin-right: 0;	
}
html[lang="ar"] md-checkbox .md-icon {
	left: auto;
    right: 0;	
}
html[lang="ar"] md-tabs md-pagination-wrapper {
    left: auto;
    right: 0;
}
html[lang="ar"] .radio-group md-radio-button {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .material-icons {
    direction: rtl;
}
html[lang="ar"] md-tab-content.md-left:not(.md-active) {
    width: 0;
}
/*=========== Material CSS Code Changes Ends: ===========*/
html[lang="ar"] .prifile-img {
	margin-right: 0;
    margin-left: 12px;	
}
html[lang="ar"] .md-table-pagination .buttons {
    direction: ltr;
}
/*=========== Common CSS Code Changes Ends: ===========*/

/*=========== Header CSS Changes Start: ===========*/
html[lang="ar"] .content_area_wrapper md-toolbar.md-header-cust, 
html[lang="ar"] .lmsbody md-toolbar.lmsheader, 
html[lang="ar"] .lmsbody .header-nav-band {
	left: auto;
	right: 0;
}
html[lang="ar"] .breadcrumb {
	right: auto;
	left: 120px;
}
html[lang="ar"] .nextAcademyVisible .breadcrumb {
	left: 180px;
}
html[lang="ar"] .md-header-cust .md-toolbar-tools md-icon.material-icons.moduleIcon {
	margin-right: 0;
	margin-left: 8px;
}

html[lang="ar"] .custom-notification-menu {
   right: -100%;
}
html[lang="ar"] .custom-notification-menu.ng-hide {
    right: 0%;
    left: auto;
}
html[lang="ar"] .custom-notification-menu::before {
	left: 121px;
}
html[lang="ar"] .custom-notification-menu h4 md-menu {
	margin-right: 0 !important;	
}
html[lang="ar"] .custom-notification-menu h4 md-menu .md-button {
	margin-right: 0;
	padding-right: 0;
}
html[lang="ar"] .rightMenuSettings {
	left: -100%;
	right: auto;
}
html[lang="ar"] .rightMenuSettings.openSettings, 
html[lang="ar"] .rightMenuSettings.openProfile { 	
	left: 0;
	box-shadow: 5px 10px 15px rgba(0,0,0,0.14);
}
html[lang="ar"] .rightMenuSettings:before {
	right: auto !important;
	left: 37px;	 
}
html[lang="ar"] .settingsMenu:before { 
	left: 86px;	 
}
html[lang="ar"] .notificationMenu {
	right: auto;
    left: -110%;
    box-shadow: 0px 10px 15px rgba(0,0,0,0.14);
}
html[lang="ar"] .notificationMenu::before {
    right: auto;
    left: 86px;
}
html[lang="ar"] .notificationMenu.toggleNotification,
html[lang="ar"] .notificationMenu.toggleDiscussionFeed { 
	left: 0;
}
html[lang="ar"] .notification-count {
	margin-right: 5px;
    margin-left: 0;	
}
html[lang="ar"] .menuHeader,
html[lang="ar"] .userNameDetails {
	padding-left: 6px;
	padding-right: 16px;
}
html[lang="ar"] .userNameDetails .mr-10 {
	margin-left: 10px;
	margin-right: 0 !important;
}
html[lang="ar"] .rightMenuSettings a.md-button md-icon {
	margin-right: 0;
    margin-left: 16px;	
}

html[lang="ar"] .rightMenuSettings a.md-button md-icon[aria-label="Notification Arrow"] {
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);	
}
html[lang="ar"] .notificationContent [aria-labelledby="Discussion Feed"] .discriptionwidth {
	margin-left: 0 !important;
    margin-right: 5px;	
}
html[lang="ar"] .main-logo {
	margin-left: 10px;
	margin-right: 4px;
}
html[lang="ar"] .toggle_icon {
    transform: rotateY(180deg)!important;
    -webkit-transform: rotateY(180deg)!important;
    -moz-transform: rotateY(180deg)!important;
}
html[lang="ar"] .togglenav .left_navigation .toggle_icon {
	transform: rotateY(0deg)!important;
    -webkit-transform: rotateY(0deg)!important;
    -moz-transform: rotateY(0deg)!important;
}
html[lang="ar"] .top_search_wrap input {
	padding: 5px 50px 5px 10px !important;
}
html[lang="ar"] .top_search_wrap .back_search {
	left: auto;
	right:0;
}
html[lang="ar"] .lmsheader ul.menulist li i {
	margin-right: 0;
    margin-left: 6px;
    display: inline-block;
}
html[lang="ar"] .selectLanguage {
	/* padding:0 16px 0 32px !important; */
}
html[lang="ar"] .selectLanguage md-icon {
	margin: 0 0 0 16px !important;
}


/* Aside Menu */
html[lang="ar"] .left_navigation {
	left: auto;
    right: -410px;	
}
html[lang="ar"] .togglenav .left_navigation {
	right: 0;
}
html[lang="ar"] .menu-nav .menu-list-header md-icon {
	right: auto;
	left: 10px;
}
html[lang="ar"] .menu-nav md-list md-list-item a div::after {
	transform: rotateY(180deg)!important;
    -webkit-transform: rotateY(180deg)!important;
    -moz-transform: rotateY(180deg)!important;
    left: auto;
    right: 10px;
}
/*=========== Header CSS Changes Ends: ===========*/


/*=========== HomeWork CSS Code Changes Starts: ===========*/
html[lang="ar"] .hwc_resources p {
	margin-left: 0;
	margin-right: 10px;
}
html[lang="ar"] .addhomework-btn, 
html[lang="ar"] .addhomework-btn.custom-hwtbtn {
	right: auto;
	left: 16px;
}
html[lang="ar"] .listView-wrapper h3 {
	padding-left: 0;
	padding-right: 20px;
}
html[lang="ar"] .assign-type {
	margin-left: 0px;
	margin-right: 3px;
}
html[lang="ar"] .hw-userdetails {
	margin-right: 0px;
	margin-left: 10px;
}
html[lang="ar"] ul.homework-custom-resources-list li {
	margin-right: 0px;
	margin-left: 6px;
}
html[lang="ar"] .custom-info-input {
	margin-right: 0;
	margin-left: 15px;
}
html[lang="ar"] .iconposition {
    right: auto;
    left: -6px;	
}
html[lang="ar"] md-menu-content.md-menu-content-filter .navigationheader-legend,
html[lang="ar"] md-menu-content.md-menu-content-filter .lms-navigationheader-legend,
html[lang="ar"] md-menu-content.md-menu-content-filter .custom-input-field {
	margin-left: 0 !important;	
}
html[lang="ar"] .md-button.md-icon-button.more-tune-filter {
	margin-left: 0;
    margin-right: 10px;	
}
html[lang="ar"] .chaptersessionlist {
	box-shadow: -4px 0px 6px rgba(0,0,0,0.1);	
	padding-right: 0;
    padding-left: 10px;	
}
html[lang="ar"] .cs_treeview.chapter-left-menu li .chapterheading {
	padding: 0 24px 0 12px;	
}
html[lang="ar"] .cs_treeview .chapter-list .sub-chapter-list {
	padding: 0 20px 0 10px;
}
html[lang="ar"] .expandBtn {
	right: auto;
    left: 0;	
}
html[lang="ar"] .librarynewview ul li .resourceCount p span {
	display: inline-block;
}
 


/*=========== HomeWork CSS Code Changes Ends: ===========*/

/*=========== Course-Board CSS Changes Start: ===========*/
/* html[lang="ar"] .courses-card-wrapper .courses-card .coursemobilestyle {
	margin-left: 0 !important;
    margin-right: 1.5rem !important;
} */
html[lang="ar"] .courses-card-wrapper .courses-card .savecourse  {
	right: auto;
	left: -10px;
}
html[lang="ar"] .calender-llwrapper .lectureMenu {
	right: auto;
    left: 5px;	
}
html[lang="ar"] .lectureMenu md-list-item .md-button i,
html[lang="ar"] .lectureMenu md-list-item md-icon {
    margin-left: 10px !important;
    margin-right: 0 !important;
}
/*=========== Course-Board CSS Changes Ends: ===========*/

/*=========== Exam Tracker CSS Changes Start: ===========*/
html[lang="ar"] .lmslistview h3 {
	padding-right: 20px;
	padding-left: 0;
}

/*=========== Examination Settings CSS Changes Start: ===========*/
html[lang="ar"] .column-fix-table table tbody td {
    padding-left: 0;
    padding-right: 20px;
    font-size: var(--ar_fontsizebody);
}
html[lang="ar"] .column-fix-table table thead th {
    text-align: right;
    padding-left: 0;
    padding-right: 20px;
    font-size: var(--ar_fontsizebody);
}
html[lang="ar"] .group-list li {
    margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .group-list li span {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .tree li::before {
    left: auto;
    right: 50%;
}
html[lang="ar"] .tree  ul {
    padding-right: 0;
}
html[lang="ar"] .side-panel.active {
    right: auto;
    left: 0;
}
html[lang="ar"] .side-panel .panel-button {
    left: auto;
    right: -36px;
    border-radius: 0 5px 5px 0;
}
html[lang="ar"] .left-view {
    padding-right: 0;
}
html[lang="ar"] .modal-tabs .md-tab:first-child h3::before {
    right: calc(50% + 8px);
    left: auto;
}
html[lang="ar"] .modal-tabs .md-tab h3::before {
    left: auto;
    right: 0;
}
html[lang="ar"] .examination-dialog .column-left ul {
    padding-right: 0;
}
html[lang="ar"] .footer-btns {
    text-align: left;
}
html[lang="ar"] .radio-group md-radio-button {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] md-input-container.select-dropdown .ng-not-empty ~ label, md-input-container.select-dropdown .ng-empty ~ label {
    font-size: 12px;
}
html[lang="ar"] .left-menu .md-button.md-primary {
    text-align: right;
}
html[lang="ar"] .checkbox-space md-checkbox {
    margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] md-input-container .md-errors-spacer {
    float: left;
}
html[lang="ar"] ol.help-text {
    padding-left: 0;
    padding-right: 15px;
}
html[lang="ar"] .list-items ul {
    padding-right: 0;
}
html[lang="ar"] .md-dark {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .custom-data-table.md-table tr:first-child th.md-column:first-child, 
html[lang="ar"] .custom-data-table.md-table td.md-cell:first-child {
    text-align: right;
} 
html[lang="ar"] .replicate-tree li:last-child::before {
    border-right: none;
    border-left: 1px solid #ccc;
}
html[lang="ar"] .replicate-tree li::before, .replicate-tree li::after {
    right: auto;
    left: 50%;
}
html[lang="ar"] .replicate-tree li::after {
    left: auto;
    right: 50%;
    border-right: 1px solid #ccc;
    border-left: 0 none;
}
html[lang="ar"] ul.exam-types li:before {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .tree li > .level-add {
    transform: translateX(-180px);
}
html[lang="ar"] .replicate-tree ul {
    padding-right: 0;
}
html[lang="ar"] .exam-tree-view .angular-ui-tree > ol {
    padding-left: 0;
    padding-right: 20px;
}
html[lang="ar"] .exam-tree-view .heading-block p {
    border-right: 0 none;
    border-left: 1px solid var(--border-color);
}
html[lang="ar"] .exam-tree-view .tree-heading > div p {
    border-right: 0 none;
    border-left: 1px solid var(--border-color);
}
html[lang="ar"] .exam-tree-view .angular-ui-tree-nodes .angular-ui-tree-nodes {
    padding-left: 0;
    padding-right: 30px;
}
html[lang="ar"] .exam-tree-view .angular-ui-tree-nodes > li:before {
    left: auto;
    right: 12px;
}
html[lang="ar"] .exam-tree-view .tree-node-content.heirarcy-tree .tree-heading:after {
    left: auto;
    right: 30px;
}
html[lang="ar"] .exam-tree-view .angular-ui-tree-nodes > li:after {
    left: auto;
    right: -18px;
}
html[lang="ar"] .design-templates {
    font-size: 16px !important;
    font-family: "TraditionalArabic";
}
html[lang="ar"] md-input-container .md-errors-spacer .md-char-counter {
    direction: ltr;
}


/*=========== Examination Settings CSS Changes Ends: ===========*/

/*=========== HomeWork CSS Code Changes Starts: ===========*/

/*=========== Dashboard CSS Changes Starts: ===========*/
html[lang="ar"] .md-expand-icon {
	right: auto;
	left: 0;
}
html[lang="ar"] .custom-avatar {
	margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .grade-block p {
	margin-left: 0;
	margin-right: 3px;
}

html[lang="ar"] .staff-dashboard-updated .quick-link span {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .staff-dashboard-updated .attendance-view p span {
    left: auto;
    right: -12px;  
}
html[lang="ar"] .staff-dashboard-updated .attendance-view {
   text-align: right;
}
html[lang="ar"] .summary-series ul li {
    padding-left: 0;
    padding-right: 15px;
    font-size: var(--ar_fontsizebody);
    margin-bottom: 5px;
}
html[lang="ar"] .summary-series ul li span {
    left: auto;
    right: 0;
}
html[lang="ar"] .custom-radio-tab md-radio-group md-radio-button {
    margin-left: 0;
}
html[lang="ar"] .custom-radio-tab md-radio-button .md-label {
    margin-right: 0;
}
html[lang="ar"] .widget-select md-select .md-select-value {
   padding: 1px 6px 3px 2px!important;
   font-size: var(--default-font14);
}
html[lang="ar"] .summary-series ul li strong {
   text-align: left;
}
html[lang="ar"] .circular-list {
    margin-right: 0;
    margin-left: 11px;
}
html[lang="ar"] .calendar-menu md-icon {
    margin-right: 24px;
    margin-left: 0;
    border-right: 1px solid #ffffff4d;
    border-left: 0 none;
}
html[lang="ar"] .calendar-menu .md-button.calendar-menu-btn {
    padding-left: 0;
    padding-right: 20px;
}
html[lang="ar"] .setting-section {
    left: 0;
    right: auto;
}
html[lang="ar"] .custom-content .custom-right {
    padding-right: 0;
    padding-left: 48px;
}
html[lang="ar"] .series-info span {
    left: auto;
    right: 0;
}
html[lang="ar"] .series-info p {
    padding-left: 0;
    padding-right: 15px;
}
html[lang="ar"] .transaction-list ul li:before {
    left: auto ;
    right: 0;
}
html[lang="ar"] .transaction-list ul li {
    margin-right: 0;
    margin-left: 25px;
    padding-right: 15px;
    padding-left: 0;
}
html[lang="ar"] .radio-tab-photo md-radio-button:first-of-type .md-label {
    border-radius: 0 25px 25px 0;
}
html[lang="ar"] .radio-tab-photo md-radio-button:last-of-type .md-label {
    border-radius: 25px 0 0 25px;
}
html[lang="ar"] .statistics-count .count {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] ul.contact-person li:before {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] ul.chart-info li {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] ul.chart-info li:last-child {
    margin-left: 0;
}
html[lang="ar"] .md-list-item-text span:before {
    margin-right: 0;
    margin-left: 10px;
}
/*=========== Dashboard CSS Changes Ends: ===========*/

/*=========== Student List CSS Changes Ends: ===========*/ 
html[lang="ar"] table.md-table td.md-cell:last-child, 
html[lang="ar"] table.md-table th.md-column:last-child {	
	padding-right: 0;
	padding-left: 24px;
}
html[lang="ar"] table.md-table.md-row-select td.md-cell:nth-child(2), 
html[lang="ar"] table.md-table.md-row-select th.md-column:nth-child(2) {
    padding-right: 24px;
    padding-left: 24px;
}
html[lang="ar"] table.md-table th.md-column md-icon:not(:first-child) {
	margin-left: 0;
    margin-right: 8px;
}
html[lang="ar"] .md-table-pagination > .buttons:not(:first-child), 
html[lang="ar"] .md-table-pagination > .limit-select:not(:first-child) {
	margin-left: 0;
    margin-right: 20px;
}
html[lang="ar"] md-select.md-table-select {
	margin: 0 5px 0 0;
}
html[lang="ar"] .report-table .md-cell span,
html[lang="ar"] table.md-custom-table td.md-cell {
	text-align: right;	
}
html[lang="ar"] .md-custom-table md-switch:last-of-type {
    margin-right: 16px;
}
html[lang="ar"] .md-custom-table .md-cell .profile-img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .upload-header {
    padding-right: 10px;
    padding-left: 0;
}
html[lang="ar"] .text-cards md-card label {
    margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .text-cards md-card:before {
    left: auto;
    right: 25px;
}
html[lang="ar"] .hwcustom-date.legendStyle p {
    left: auto;
    right: 9px;
}
html[lang="ar"] .pastDateTime {
    direction: ltr;
    text-align: right;
}
html[lang="ar"] .submitionDate {
    display: inline-block;
    margin-left: 0;
    margin-right: 5px;
}
html[lang="ar"] .pastDateTime .hw-userdetails {
    direction: rtl;
}

/*=========== Student List CSS Changes Ends: ===========*/

/*=========== Student Details CSS Changes Starts: ===========*/

html[lang="ar"] .student-info img {
	margin-right: 0; 
}
html[lang="ar"] .img-preview-wrap-change {
	margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .theme-settings {
	right: auto;
    left: -200px;
}
html[lang="ar"] .theme-settings.active {
	right: auto;
	left: 0;  
}
html[lang="ar"] .theme-settings.quick-settings .ts-button {
    left: auto;
    right: -46px;
    border-radius: 0 5px 5px 0px;
}
html[lang="ar"] .theme-settings.quick-settings .ts-button i {
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);	
}
html[lang="ar"] .theme-settings.quick-settings .ts-themes ul {
	padding: 0 !important;
}
html[lang="ar"] .theme-settings.quick-settings .ts-themes ul li a{
	text-align: right;
}
html[lang="ar"] .theme-settings.quick-settings .ts-themes li a span {
	margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .custom-date mdp-date-picker .md-button.md-icon-button, 
html[lang="ar"] .custom-time mdp-time-picker .md-button.md-icon-button,
html[lang="ar"] .formly_wrapper .date mdp-date-picker .md-icon-button {
	right: auto !important;
    left: 0;
}
html[lang="ar"] .floatingSelect mdp-date-picker .md-button.md-icon-button, 
html[lang="ar"] .floatingSelect mdp-time-picker .md-button.md-icon-button {
    right: auto !important;
}

html[lang="ar"] .formly_wrapper .formly-field, 
html[lang="ar"] .formly_wrapper .date {
	margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .select-dropdown label::after {
	left: 12px;
	right:auto
}
html[lang="ar"] .img-preview-wrap-change {
	margin-right: 0;
	margin-left: 20px;
} 
html[lang="ar"] .pos-text {
	top: -16px;
}
/*=========== Student Details CSS Changes Ends: ===========*/

/*=========== Student Dashboard CSS Changes Starts: ===========*/
html[lang="ar"] .custom-tab .custom-tab-header li {
	/*float: right;*/
	padding: 0px 15px 0px 7px;
}
html[lang="ar"] .custom-calendar-header .md-select-value {
	padding-left: 2px !important;
	padding-right: 8px !important;
}
html[lang="ar"] .nav-btns span {
	font-size: var(--ar_fontsizeheading);
}
html[lang="ar"] .custom-tab .custom-tab-header li.quick-link-menu {
	right: auto;
	left: 0;
}
html[lang="ar"] .custom-tab .custom-tab-header li:first-child {
	margin-left: inherit;
}
html[lang="ar"] .fc {
	direction: rtl;
	text-align: right;
} 
html[lang="ar"] .calender-view .lecture-icon {
   	margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .fc-event-container > .day-event-list {
	border-right: 3px solid transparent;
}
html[lang="ar"] .fc-event-container .font11 {
	font-size: 14px !important;	
}
html[lang="ar"] .dropdownBorder .md-select-value {
	padding-left: 2px;
    padding-right: 8px;	
}
html[lang="ar"] .dropdownBorder p,
html[lang="ar"] .dropdownBorder .customLegend  {
	left: auto;
    right: 9px;	
    font-size: 12px;
    top: -10px;
}
html[lang="ar"] .dropdownBorder .date-range-icon {
    right: auto !important;
    left: 5px;
}
html[lang="ar"] .indicator.rightIcon {
	left: auto;
    right: -8px;
    margin-right: 0;
    margin-left: -8px;
    transform: translate(50%, -50%);
}
html[lang="ar"] .assig-status-text span md-icon {
	margin-left: 5px;
    margin-right: 0;
}
html[lang="ar"] .listView-wrapper .listView-topheader {
	padding-right: 8px;
    padding-left: 4px;
}
html[lang="ar"] .custom-greetings {
	right: auto;
    left: 60px;
}
html[lang="ar"] .qaList md-list .md-avatar {
    margin-right: 0;
    margin-left: 16px !important;
}
html[lang="ar"] .left-menu .md-button.active {
    border-left: 0 none;
    border-right: 6px solid var(--green-text);
}
html[lang="ar"] md-input-container.md-icon-right>md-icon:last-of-type {
    right: auto;
    left: 2px;
}
html[lang="ar"] .custom-select:after {
    right: auto;
    left: 5px;    
}
html[lang="ar"] .checkbox-block .select-all-btn .md-label {
    margin-right: 0;
}
html[lang="ar"] .heading-view span {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .custom-progress .select-list .layout-row span {
    direction: ltr;
}
html[lang="ar"] .live-lecture-custom .nav-btns {
    direction: ltr;
}
html[lang="ar"] .custom-calendar .calendar .fc-time-grid-container .fc-slats .fc-time {
    direction: ltr;
}
html[lang="ar"] .videoStatus md-card md-card-content p {
    direction: ltr;
    text-align: right;
}
html[lang="ar"] .feed-owner span {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .feed-owner ul li {
    padding-right: 0;
    padding-left: 15px;
}
html[lang="ar"] .feed-details li {
    padding-right: 0;
    padding-left: 15px;
}
html[lang="ar"] .attend-info .n-count {
    margin-left: 0;
    margin-right: 15px;
}
html[lang="ar"] .attend-info li {
    margin-right: 0;
    margin-left: -2px;
}
html[lang="ar"] .nav-btns .nab-tabs-calender {
    direction: ltr;
}
html[lang="ar"] .calender-view .cal-month-box .custom-cell span[data-cal-date] {
    margin-left: 0;
    margin-right: 10px;
}

/*=========== Student Dashboard CSS Changes Ends: ===========*/

/*=========== Principal CSS Changes Starts: ===========*/
/*
html[lang="ar"] .new_tabs_custom md-tabs.tabs .md-tab:after {
    right: auto;
    left: 0;
}
*/
html[lang="ar"] .principal_tabs md-input-container.md-icon-right>md-icon:last-of-type {
    right: auto;
    left: 2px;
}
html[lang="ar"] .principal_tabs md-input-container.md-icon-left {
    padding-right: 0;
}
html[lang="ar"] .principalsection .custom-padding {
    text-align: right;
}
html[lang="ar"] .select-header-searchbox .select-header input {
    margin-left: 0;
    margin-right: 5px;
}
html[lang="ar"] .recyclebin-search md-input-container.md-green-theme .md-input {
    padding-left: 0;
    padding-right: 30px;
}

/*=========== Principal Dashboard CSS Changes Ends: ===========*/

/*=========== SWS all CSS Changes Starts: ===========*/
html[lang="ar"]  .cs_treeview .chapter-list .sub-chapter-list:before {
    display: none;
}
html[lang="ar"]  .md-customTabs md-pagination-wrapper, 
html[lang="ar"]  .md-customTabs md-tabs-canvas {
    width: auto !important;
}
html[lang="ar"] .cs_treeview ul li {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .chapterResourcesList ul li::after {
	margin-left: 0;
    margin-right: 5px;
    transform: translate(-50%);
}
html[lang="ar"] .header-nav-band ul.top_links li i[class*="lms-"] {
	font-size: 18px !important;
	font-size: 1.8rem;
}
html[lang="ar"] .header-nav-band ul.top_links li label {
    bottom: 2px;
    font-size: var(--default-font14);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    line-height: 15px;
}
html[lang="ar"] .header-nav-band ul.top_links li {
	width: 70px;
}
 
html[lang="ar"] .newchaptersummary h3 {
	padding-top: 12px;
	padding-bottom: 12px;
}
/*
html[lang="ar"] .md-tab {
    float: right;
}
*/
html[lang="ar"] md-pagination-wrapper {
    left: initial;
    right: 0;
}
html[lang="ar"] .customList md-list-item {
	margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .customList md-list-item .md-avatar, 
html[lang="ar"] .customList md-list-item .md-list-item-inner img.md-avatar {
	margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] .subheader-box .radio-tabs .md-label {
	margin-right: -4px;
    margin-left: 0;
}
html[lang="ar"] .lms_coverflow coverflow-card .cover_content .resource_count {
	right: auto;
    left: 16px;
}
html[lang="ar"] .list-custom-icon {
	margin-right: 0;
}
html[lang="ar"] .dropdownBorder .customLegend {
	font-size: 12px !important;
}
html[lang="ar"] .dropdownBorder .customLegend .material-icons {
	font-size: 16px !important;
}
html[lang="ar"] .custom-apply-btn {
	right: auto;
    left: 0;
}
html[lang="ar"] .tool-tip {
	right: auto;
    /* left: 0; */
}
html[lang="ar"] .upload-btn {
	right: auto;
    left: 10px;
}
html[lang="ar"] .breadCrumb ul li {
    padding-right: 0;
    padding-left: 21px;
}
html[lang="ar"] .corner-btn-class {
    right: auto;
    left: 0;
}
html[lang="ar"] .inline-circle .letter-circle{
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .custom-info-btn {
    left: 5px;
    right: auto;
}
html[lang="ar"] .custom-info-btn .tool-tip {
    left: 0;
    right: auto;
}
html[lang="ar"] .assessmentView md-checkbox:last-of-type {
    margin-right: 16px;
}
/*=========== SWS all CSS Changes Ends: ===========*/

/*=========== Exam Corner CSS Changes Starts: ===========*/
html[lang="ar"] .examPositionClass {
	right: auto;
	left: -2px;
}
html[lang="ar"] .legendStyle .date-range-icon {
	right: auto !important;
    left: 5px;	
} 
html[lang="ar"]  .custom-date.hwcustom-date md-input-container, 
html[lang="ar"]  .custom-time.hwcustom-date md-input-container,
html[lang="ar"]  .legendStyle .md-select-value {
	padding-right: 8px;
    padding-left: 0;	
}
html[lang="ar"] .listView-wrapper .listView-content {
	border-left: 0;
	padding: 0 16px 0 16px;
	border-right: solid 0px;
}
html[lang="ar"] .assessment-circle {
	margin-right: 0;
    margin-left: 10px;	
}
html[lang="ar"] .positionClass {
	right: auto !important;
    left: 0;
    margin: 0;
}
html[lang="ar"] .examcorner-menu ul h3 span {
	float: right;
    margin-left: 10px;
    margin-right: 0px;
}
html[lang="ar"] .examcorner-menu ul li {
	padding: 0 10px 0 7px;
}
html[lang="ar"] .examcorner-menu ul li:before,
html[lang="ar"] .examcorner-menu ul li.subOne .text::before {
	left: auto;
    right: 0;
    margin-left: 0;
    margin-right: 15px;
} 
html[lang="ar"] .examcorner-menu ul li.three:before,
html[lang="ar"] .examcorner-menu ul li:before,
html[lang="ar"] .examcorner-menu ul li.subOne .text:before {
	border-left: 0;
    border-right: 6px solid;
}
html[lang="ar"] .examcorner-menu ul li .child-two ul li .text:before {
	left: auto;
    right: 0;
    margin-right: 15px;
    margin-left: 0;
}
html[lang="ar"] .examcorner-menu ul li .text {
	margin-left: 0;
	margin-right: 28px;
}


/*=========== Exam Corner CSS Changes Ends: ===========*/

/*=========== Exam Corner 2.0 CSS Changes Starts: ===========*/
html[lang="ar"] .ll-attendance .custom-padding {
	text-align: right;	
}
html[lang="ar"] .courseplanlistview .courseplanresourcetype {
	margin-left: 12px;
    margin-right: 5px;	
}
html[lang="ar"] .checkBoxClass {
	left: auto;
    right: 10px;	
}
html[lang="ar"] .resourcesselectionbox {
	margin-right: 0;
    margin-left: 10px;	
}
html[lang="ar"] .resourceposition {
	right: auto;
    left: -15px;	
}
html[lang="ar"] .cs_treeview ul li .chapterheading.specificsession {
	padding-left: 12px;
    padding-right: 24px;
}
html[lang="ar"] table.md-table.md-row-select td.md-cell:first-child, 
html[lang="ar"] table.md-table.md-row-select th.md-column:first-child {
	padding-left: 0;
    padding-right: 24px;	
}
html[lang="ar"] .summarydetailsckediter .button {
    left: 4px;
    right: auto;	
}
html[lang="ar"] .session-completed-card {
	margin-right: 5px;
    margin-left: 0;
}
html[lang="ar"] .session-completed-card md-icon {
	margin-right: 0;
    margin-left: 5px;	
}
html[lang="ar"] .cs_treeview.chapter-left-menu li .chapterheading md-icon,
html[lang="ar"] .cs_treeview ul li .smBtn md-icon {
	min-width: 20px;
    width: 20px;
    min-height: 20px;
    height: 20px;
}
html[lang="ar"] md-select.selectDropdowns {
	margin: 0 0 0 20px !important;	
}
html[lang="ar"] .mainTabs .material-icons {
	margin: 0px 0px 0px 5px !important;	
}
html[lang="ar"] .importConceptDialog .sidebar .tabLogo {
	margin: 0 0px 0 10px !important;
}
html[lang="ar"] .searchInput .searchBox {
	padding-right: 38px;
    padding-left: 10px;	
}
html[lang="ar"] .ll-btn-position {
   	right: auto;
    left: 10px;	
}

html[lang="ar"] ul.resourcesList li .courseplanresourcetype {
	margin-right: 0;
    margin-left: 16px;	
}
html[lang="ar"] .resources-radio-btn {
	left: auto;
    right: 0;	
}
html[lang="ar"] .thumbnile {
	margin-left: 8px;
    margin-right: 28px;	
}
html[lang="ar"] .live-video-view .closeBtn,
html[lang="ar"] .resourceDialog .md-button.md-icon-button.resourceCloseButton  {
	right: auto;
    left: -10px;	
}
html[lang="ar"] ul.selected-resource li {
	margin-right: 2px;
    margin-left: 8px;
    padding-right: 0;
    padding-left: 8px;
    border-right: 0;
    border-left: 1px solid rgb(204, 204, 204);	
}
html[lang="ar"] .radio-style .upload-radio .md-container {
	margin-right: 10px;
    margin-left: 0;
}
html[lang="ar"] .radio-style .upload-radio md-radio-button {
	padding-left: 20px;
    padding-right: 35px;
    text-align: right;	
}
html[lang="ar"] .radio-style .upload-radio .md-label {
	margin: 0;
}
html[lang="ar"] lable.scorm-info {
	margin-left: 0;
    margin-right: -30px;	
    top: 5px;
}
html[lang="ar"] .searchBy p {
	left: auto;
    right: 5px;	
}
html[lang="ar"] .listView-wrapper .listView-topheader {
	padding-left: 24px;
    padding-right: 24px;	
}
html[lang="ar"] .summarydetails md-input-container .md-input {
	padding-left: 40px;	
}
html[lang="ar"] .ll-video-player .video-player {
	margin-right: 0;	
}
html[lang="ar"] .resourceFixedBtn {
    right: auto;
    left: 16px;	
}
html[lang="ar"] .count-text {
    margin-right: 0;
    margin-left: 5px;	
}
html[lang="ar"] ul.label-info li div > p > span.label-indicator {
   	margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .blooms-taxonomy {
	padding-left: 0;
    padding-right: 30px;	
}
html[lang="ar"] table.md-custom-table th.md-column {
	text-align: right;	
}
html[lang="ar"] .radio-wrapper md-radio-button .md-container {
	margin-right: 10px;
    margin-left: 0;	
}
html[lang="ar"] .deviceInfo {
	right: auto;
    left: -25px;	
}
html[lang="ar"] .summarydetails md-input-container .md-input {
	padding-right: 15px;
    padding-left: 40px;	
}
html[lang="ar"] table.md-custom-table th.md-column {
	text-align: right;
}
html[lang="ar"] .concept-info-dialog ol.f {
	padding-left: 20px;
    padding-right: 30px;
}
html[lang="ar"] .concept-headings .inner-content {
    margin-left: 0;
    margin-right: 36px;	
}
html[lang="ar"] .md-button.plusIcon {
	margin-right: 0 !important;
    margin-left: 10px !important;	
}
html[lang="ar"] .concept-headings ul {
	padding-right: 0;	
}
html[lang="ar"] .concept-headings .inner-content ul li:after {
	left: auto;
    right: -24px;
}
html[lang="ar"] .concept-headings .inner-content ul li:before {
	left: 0;
    right: -24px;	
}
html[lang="ar"] .create_concept .concept-headings ul li:last-of-type {
	padding-left: 10px;
    padding-right: 18px;	
}
html[lang="ar"] .inner-content .search_ld md-list-item:after {
	left: auto;
    right: -24px;
}
html[lang="ar"] .inner-content .search_ld md-list-item:before {
    left: auto;
    right: -25px;	
}
html[lang="ar"] .laBel {
	margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .custom-sorting ul li:before {
    left: auto;
    right: 0;	
}
html[lang="ar"] .custom-sorting ul li{
	padding-right: 20px;
    padding-left: 10px;
}
html[lang="ar"] .importAndupload .importBtn, 
html[lang="ar"] .uploadBtn {
    margin-right: 8px;
    margin-left: 0;
    padding: 0 8px;
    width: auto;
}
html[lang="ar"] .resource-wrapper .resource-sequence .dragicon {
    margin-right: 0;
    margin-left: 15px;	
}
html[lang="ar"] .radio-custom md-radio-button .md-container{
	right: 15px;
    left: auto;
}
html[lang="ar"] .dropdown-border .md-select-value {
	padding-left: 2px;
    padding-right: 5px;	
}
html[lang="ar"] .bottom_btn {
	right: auto;
    left: 0;
}
html[lang="ar"] .activitywrapper .activitydescription .edit_button {
    right: auto;
    left: 0;	
}
html[lang="ar"] .resourcesCardView md-card .resource-image {
	margin-right: 0;	
} 
html[lang="ar"] .resourcesCardView md-card .resource-content .heading{
	line-height: 18px;
}
html[lang="ar"] .homeworksection .custom-padding {
	text-align: right;
}
html[lang="ar"] .fileFormat-btn md-checkbox .md-container {
	left: auto;
    right: 10px;	
} 
html[lang="ar"] .fileFormat-btn md-checkbox .md-label {
	margin-right: 0 !important;
    padding-left: 10px;
    padding-right: 35px;	
}
html[lang="ar"] .customadd-btn{
	right: auto !important;
    left: 16px;
}
html[lang="ar"]  .lmsnewradio md-radio-button {
    margin-right: 0 !important;
    margin-left: 25px !important;

} 
html[lang="ar"] .lmsnewradio md-radio-button .md-container {
	margin-right: 10px;
    margin-left: 0;
}
html[lang="ar"] .chapter-session .sessionicon {
	margin-right: 0 !important;
    margin-left: 5px !important;
}
html[lang="ar"] .service_errors#errorPan {
	align-items: flex-start;
    align-content: flex-start;
}
html[lang="ar"] .lmsheader ul.coursedashboard-menu {
    right: 33%;
    left: auto;
    transform: translate(10%, 0px);
}
html[lang="ar"] .disc-comment .md-icon-button {
  left: 4px;
  right: auto;
}
html[lang="ar"] .disc-comment-list .comment-img-circle {
  margin-right: 0px;
  margin-left: 10px;
}
html[lang="ar"] .disc-icon {
	margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .disc-header p {
    font-size: 14px !important;
}
html[lang="ar"] .comment-count, 
html[lang="ar"] .announce-files p {
  font-size: 16px !important;
}
html[lang="ar"] .descTitleContent p {
    font-size: 16px !important;
}
html[lang="ar"] .PostData p {
    font-size: 16px !important;
}
html[lang="ar"] .llheight95 {
    height: calc(100% - 98px);
}
html[lang="ar"] .announce-files img {
  margin-left: 10px;
  margin-right: 0;
}
html[lang="ar"] .ll-switch-btn .md-button.swipe-btn {
  font-size: 16px;
  line-height: 32px;
}
html[lang="ar"] .currentstudentimage {
	margin-left: 10px;
	margin-right: 0;
}
html[lang="ar"] .hwtracker-wrapper .hwtracker-content {
    border-right: 4px solid;
    border-color: #7FCF30;
    border-left: 0;	
}
html[lang="ar"] .arabicView .md-label {
  margin-right: 0 !important;
}
html[lang="ar"] .live-report .headerTitle,
html[lang="ar"] .live-report .bodyList {
    text-align: right;
}
html[lang="ar"] .live-report .bodyList .material-icons {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .md-button.google-button { 
    padding-right: 1px;
    padding-left: 8px;
}
html[lang="ar"] .custom-assignment {
    margin-right: 15px;
    margin-left: 0;
}
 
html[lang="ar"] .daterangepicker {
    width: max-content !important;
}
html[lang="ar"] .lmscardview .lmscardviewcontent .resource-content .heading {
    line-height: 20px;
}
html[lang="ar"] .custom-dialog md-toolbar .md-toolbar-tools p.font14.m-t-10 {
    margin-top: 0 !important;
}
html[lang="ar"] .assessment-tab .infoIcon .tool-tip  {
    right: 0;
    left: auto;
}
html[lang="ar"] .return-block p span {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .studentlistcontent {
    left: auto;
    right: 0;
}
html[lang="ar"] .iconBox {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .activityresourcetype {
    margin-right: 5px;
    margin-left: 12px;   
}
html[lang="ar"] .create-exam-view .examLabelName {
    margin: 0 0 0 10px;
}
html[lang="ar"] ul.label-info li div p.count {
    font-size: 16px !important;
}
html[lang="ar"] .custom-assignment-hwl md-checkbox {
    margin-left: 0;
    margin-right: 16px;
}
html[lang="ar"] mdp-date-picker md-input-container .md-input,
html[lang="ar"] mdp-time-picker md-input-container .md-input {
    direction: ltr;
    text-align: right;
}
html[lang="ar"] .symmary-cards:first-child {
    margin-left: 5px;
    margin-right: 0;
}
html[lang="ar"] .searchinputbox md-icon svg {
    margin: 0 auto;
}
html[lang="ar"] .studentlistcontent .searchinputbox .searchbox-font-adjust .studentactioncircle {
    min-width: 8px;
}

html[lang="ar"] .examtrackerIcon {
    margin: 0 0 0 4px;
}
html[lang="ar"] .discussion-card .postlinkTitle md-icon {
    right: auto;
    left: 10px;
}
html[lang="ar"] .discussion-card md-card.postLink {
    margin-right: 0;
}
html[lang="ar"] .discussion-card .disc-header .comment-img-circle {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] html[lang="ar"] .userComment .disc-comment .comment-img-circle {
    margin-right: 0;
    margin-left: 0;
    transform: translate(-15px,12px);
}
html[lang="ar"] .userComment .disc-comment-list .cmt-item {
    font-size: var(--default-font14);
    padding-right: 12px;
}
html[lang="ar"] .userComment .disc-comment-list .cmt-item:before {
    position: absolute;
    right: -2px;
    top: 6px;
}
html[lang="ar"] .fc-event-container > .week-event-list span {
    direction: ltr;
}
html[lang="ar"] .fc-event-container > .week-event-list p label.icon-custom {
    margin-right: 0;
    margin-left: 2px;
}
html[lang="ar"] .calendar-timetable .fc-agendaWeek-view .fc-time-grid .fc-slats td.fc-time {
    direction: ltr;
}
html[lang="ar"] .custom-dialog .custom-close {
    padding-left: 0;
    padding-right: 24px;
}
html[lang="ar"] .calendar-header .md-select-value {
    padding: 2px 8px 6px 2px !important;
}
html[lang="ar"] .modal-tabs.inline-tabs .md-tab h3>label {
    padding: 0 0 0 7px;
    margin-left: 0;
    margin-right: -3px;
}
html[lang="ar"] .evaluatuionheadersubitems .viewitemswrapper .border-left {
    border-right: 0 none !important;
}
html[lang="ar"] .lmsheader .custom-notification-menu {
    right: auto;
    left: 0;
}
html[lang="ar"] .lmsheader .custom-notification-menu.ng-hide {
    right: auto;
    left: -100%;
}
html[lang="ar"] .userComment .disc-comment textarea {
    padding: 10px 12px 5px 40px;
}
html[lang="ar"] .filterMain {
    margin-right: 0;
    margin-left: -21.5%;
}
html[lang="ar"] .feedType md-radio-button .md-container, 
html[lang="ar"] .feedType md-checkbox .md-container {
    left: 12px;
    right: auto;
}
html[lang="ar"] .feedType md-radio-button .md-label, 
html[lang="ar"] .feedType md-checkbox .md-label {
    margin-left: 30px;
    margin-right: 0;
}
html[lang="ar"] .feedType .disc-icon {
    margin-right: 10px;
    margin-left: 8px;
}
html[lang="ar"] .feedsCustomizeDate .date-range-icon {
    right: auto !important;
    left: 2px;
}
html[lang="ar"] .addIconButton {
    right: auto;
    left: 50px;
}
html[lang="ar"] .hwcreationmobileview .md-errors-spacer .md-char-counter {
    direction: ltr;
}
html[lang="ar"] .selectAll-class {
    margin: 15px 24px 10px 0;
}
html[lang="ar"] .material-icons.chapterIconColor {
    margin-right: 0;
    margin-left: 5px;
    direction: ltr;
}
html[lang="ar"] .createExamMobileView .create-exam-view .custom-check {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .createExamMobileView .create-exam-view .custom-check md-checkbox {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .createExamMobileView .create-exam-view .custom-check md-checkbox .md-label {
    margin-right: 0;
    margin-left: 30px;
}
html[lang="ar"] .createExamMobileView .create-exam-view .custom-check md-checkbox .md-container {
    right: 10px;
}
html[lang="ar"] .createExamMobileView .create-exam-view .settingGroup {
    margin-left: 20px;
    margin-right: 30px;
}
html[lang="ar"] .assessment-wraper .scrollDiv .fileFormat md-checkbox {
    margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] .resourcePopup-colose {
    right: auto !important;
    left: 5px;
}
html[lang="ar"] .menuPosition {
    right: auto;
    left: 0;
}
html[lang="ar"] .section-wise-score .question .tooltiptext {
    left: auto;
    right: 0;
}
html[lang="ar"] .section-wise-score .question .tooltiptext:after {
    left: auto;
    right: 50%;
    margin-left: 0;
    margin-right: -125px;
}
html[lang="ar"] .activity-feed-details li {
    padding-right: 0;
    padding-left: 15px;
}
html[lang="ar"] .activity-feed-details li::before {
    left: auto;
    right: -10px;
}
html[lang="ar"] .activity-feed-owner span {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .activity-feed-owner ul li {
    padding-right: 0;
    padding-left: 15px;
    display: inline-block;
}
html[lang="ar"] .go-to-activity md-icon {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}
html[lang="ar"] .activityContentview .activity-input-details md-input-container.md-icon-left {
    padding-right: 0;
}
html[lang="ar"] .disc-footer .userComment .disc-comment .md-icon-button {
    transform: rotate(180deg);
}
html[lang="ar"] .daterangepicker.opensright:after {
    left: auto;
    right: 25px;
}
html[lang="ar"] .daterangepicker.opensright:before {
    left: auto;
    right: 24px;
}
html[lang="ar"] .activity-feed-owner ul li::before {
    left: auto;
    right: -10px;
}
html[lang="ar"] .month-event p {
    padding-left: 0;
    padding-right: 18px;
}
html[lang="ar"] .evaluationfiles .custom-button-block {
    left: auto;
    right: 0;
    padding: 0 10px 0 0;
}
html[lang="ar"] .assign-type span {
    min-width: 22px;
}
html[lang="ar"] .fileuploadimage {
    margin-right: 0;
    margin-left: 8px;
}
html[lang="ar"] .emulatormenu li p {
    font-size: 13px !important;
    line-height: 17px;
}
html[lang="ar"] .custom-annotate canvas {
    direction: ltr;
}
html[lang="ar"] .pie-chart .chart-wrap h3 span {
    direction: ltr;
    display: inline-block;
}
html[lang="ar"] .mark_percentage .cirlce {
    margin: 0 0 0 5px;
}
html[lang="ar"] .iconBox.three md-icon {
    direction: ltr;
}
html[lang="ar"] .lmslistview .contentview span.profile-img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .animate.show-box {
    left: auto;
    right: 50%;
    margin-left: 0;
    margin-right: 145px;
}
html[lang="ar"] .animate.show-box::before {
    left: auto;
    right: -12px;
    border-right: 0 none;
    border-left: 12px solid rgba(1, 1, 1, 0.72);
}
html[lang="ar"] .session-wrapper .session-content .dragicon {
    margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .session-wrapper .sessiontype .md-button {
    margin-right: 0 !important;
    margin-left: 10px !important;
}
html[lang="ar"] .standardSearch .material-icons.search_icon {
    right: auto;
    left: 2px;
}
html[lang="ar"] .standards-list .folderIcon {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .filterContent {
    padding-left: 0;
    padding-right: 206px;
}
html[lang="ar"] .featureMain {
    right: auto;
    left: 10px;
}
html[lang="ar"] .featureMain .featureTour {
    left: 0;
}
html[lang="ar"] .feedNotification {
    right: auto;
    left: 0;
    border-radius: 0 8px 0 0;
}
html[lang="ar"] .feed-details li::before {
    left: auto;
    right: -10px;
}
html[lang="ar"] .feed-owner ul li::before {
    left: auto;
    right: -10px;
}
html[lang="ar"] .custoChips ul li .closeBtn {
    margin: 0 8px 0 0;
}
html[lang="ar"] .chipClose {
    margin: 0 6px 0 0 !important;
}
html[lang="ar"] .standardRight {
    border-right: 0 none !important;
    border-left: 1px solid var(--border-color) !important;
    padding-left: 0;
    padding-right: 10px;
}
html[lang="ar"] .questionOption-icon md-icon {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .tree-heading .md-icon-button md-icon, 
html[lang="ar"] .session-tree-view .tree-heading .md-icon-button md-icon{
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .tree-heading .buttons-section {
    right: auto; 
    left: 15px;
}
html[lang="ar"] .magnifying-icons .zoomLevel {
    direction: ltr;
}

/*=========== Exam Corner 2.0 CSS Changes Ends: ===========*/

/*=========== Annotation CSS Changes Starts: ===========*/
html[lang="ar"] .annotatefiles .custom-button-block {
    left: auto;
    right: 16px;
    padding-right: 10px;
    padding-left: 0;
}
html[lang="ar"] .rotateButton {
    margin: 0 0 0 10px !important;
}
html[lang="ar"] .magnifying-icons .md-button {
    margin-right: 5px;
    margin-left: 0;
}
html[lang="ar"] .annotate-action {
    right: auto;
    left: 0;
    padding-left: 0;
    padding-right: 10px;
}
html[lang="ar"] .md-button.annotated-btn {
    margin-left: 15px !important;
    margin-right: 0 !important;
}
html[lang="ar"] md-checkbox.annotated-btn {
    margin-right: 0 !important;
    margin-left: 10px !important;
}
html[lang="ar"] .dropdown-content {
    text-align: right;
}
html[lang="ar"] .colorSection span {
    margin-right: 0;
    margin-left: 4px;
}
html[lang="ar"] .submenu .ok {
    margin-right: 0;
    margin-left: 5px;
    right: auto;
    left: 0;
}
html[lang="ar"] .submenu md-slider-container>:last-child:not(md-slider) {
    margin-right: 10px;
    margin-left: 0;
}

/*=========== Annotation CSS Changes Ends: ===========*/


/*=========== NLP Settings CSS Changes Starts: ===========*/
html[lang="ar"] .count-circle {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .plus_minus.custom-sections ul {
	margin-left: 0;
    margin-right: 20px;
}
html[lang="ar"] .report-table .md-cell a.custom-anchor {
	margin-left: 0;
    margin-right: 10px;
}
html[lang="ar"] ul.custom-chip-list li {
	margin-right: 0;
    margin-left: 5px;
    padding-right: 10px;
    padding-left: 4px;
}
html[lang="ar"] ul.custom-chip-list li .md-icon-button {
	margin-right: 6px;
    margin-left: 0;
}
html[lang="ar"] ul.custom-chip-list {
	padding-right: 0;
}
html[lang="ar"] .user-chips md-chips.custom-chips md-chip {
	margin-top: 5px;
    margin-bottom: 5px;
}
html[lang="ar"] .md-chips.md-removable md-chip .md-chip-content {
	padding-right: 0;
    padding-left: 4px;
}
html[lang="ar"] .class-list-section ul li md-checkbox .md-label {
	padding-right: 40px;
    padding-left: 10px;
    margin-right: 0;
}
html[lang="ar"] .class-list-section md-checkbox .md-container {
	left: auto;
    right: 10px;
}
html[lang="ar"] .cctv-block p  {
	margin-top: 10px;
}
html[lang="ar"] .checkbox-style .md-icon {
	margin-right: 15px;
    margin-left: 0;
    left: auto;
    right: 0;
}
html[lang="ar"] .checkbox-style ul {
	padding-left: 0;
    padding-right: 0px;
}
html[lang="ar"] .list-items {
	padding-left: 0;
}
html[lang="ar"] .date-view ul li {
	border-right: none;
    border-left: solid 1px #ccc;
}
html[lang="ar"] .date-view ul {
	overflow: hidden;
}
html[lang="ar"] .date-view ul li .md-button {
	border-radius: 0 !important;
}
html[lang="ar"] .date-view ul li:last-child:hover,
html[lang="ar"] .date-view ul li:last-child .md-button.active,
html[lang="ar"] .date-view ul li:hover, .date-view ul li .md-button.active, 
html[lang="ar"] .date-view ul li:first-child:hover, 
html[lang="ar"] .date-view ul li:first-child .md-button.active {
    border-radius: 0;
}
html[lang="ar"] div > ul.tree-view > li::after, 
html[lang="ar"] div > ul.material-tree::after {
    left: auto;
    right: 8px;    
}
html[lang="ar"] ul.tree-view ul > li::before, 
html[lang="ar"] div > ul.material-tree li::before {
    left: auto;
    right: -26px;
}
html[lang="ar"] .calendar-menu:nth-last-child(1) md-checkbox {
    margin-right: 16px;
}
html[lang="ar"] ul.material-tree li md-checkbox {
    margin-right: 0 !important;
}
html[lang="ar"] ul.material-tree li {
    margin-right: 35px;
    margin-left: 0;
}
html[lang="ar"] ul.tree-view {
    padding-right: 0;
}
html[lang="ar"] .calendar-menu md-checkbox {
    margin-right: 0;
}
html[lang="ar"] .dropdown-menu .md-button {
    text-align: right;
}
html[lang="ar"] .auth-header md-checkbox {
    margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] .tabs-wrapper md-tab-content.md-left:not(.md-active) {
    transform: none !important;
}
html[lang="ar"] .listView-wrapper .listView-topheader .tool-tip {
    left: 0;
    right: auto   
}
html[lang="ar"] .school_name {
    font-size: 16px !important;
}
html[lang="ar"] .quick-link h4 {
    font-size: var(--default-font14);
    line-height: 14px;
}

html[lang="ar"] .direction-normal{
    direction: ltr;
    text-align: right;
    display: inline-block;
}
html[lang="ar"] input.date-range {
    direction: ltr;
    text-align: right;
}
html[lang="ar"] .direction-ltr {
    direction: ltr;
}
html[lang="ar"] .direction-rtl {
    direction: rtl;
    display: inline-block;
    text-align: right;
}
.calender-direction-ltr {
    display: flex;
    display: -webkit-flex;
    align-items: center;
}
html[lang="ar"] .calender-direction-ltr {
    direction: ltr;
}
html[lang="ar"] td.direction-normal {
    display: table-cell;
}
/*=========== NLP Settings CSS Changes Ends: ===========*/
/*=========== HOD CSS Changes Starts: ===========*/
html[lang="ar"] .custom_graph .highichart_percentage .cirlce {
    margin: 0 0 0 10px;
}
/*=========== HOD CSS Changes Ends: ===========*/

/*=========== Live Lecture CSS Changes Starts: ===========*/
html[lang="ar"] .lecture-icon {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .principal_tabs .nav-btns {
    direction: ltr;
}
html[lang="ar"] .time-and-date {
    direction: ltr;
    text-align: right;
}
/*=========== Live Lecture CSS Changes Ends: ===========*/

/*=========== Analytics CSS Changes Starts: ===========*/
html[lang="ar"] ul.analytics-progress.custom li:after {
    right: auto;
    left: 20px;
}
html[lang="ar"] ul.analytics-progress li .smcircle::before {
    left: auto;
    right: -12px;
}
html[lang="ar"] ul.analytics-progress.custom::before {
    left: auto;
    right: -30px;
}
html[lang="ar"] ul.analytics-progress::before {
    left: auto;
    right: -10px;
}
html[lang="ar"] ul.analytics-progress {
    margin: 0 15px 0 0;
    padding: 0 15px 0 0;
}
html[lang="ar"] ul.analytics-progress li {
    padding: 0 0 0 10px;
}
html[lang="ar"] .examCorner {
    margin: 0px 0 0px 4px;
}
html[lang="ar"] .custom_studentlist md-list-item .md-list-item-inner .md-avatar {
    margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] .niceScrool .mark_percentage table td,
html[lang="ar"] .niceScrool .mark_percentage table th {
    text-align: right;
}
html[lang="ar"] .chapter-list .chapter-data .chapter-img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .resource-wrap .radio-tabs .md-label {
    margin-right: 0;;
}
/*=========== Analytics CSS Changes Ends: ===========*/

/*=========== Fee CSS Changes Starts: ===========*/
html[lang="ar"] .themes-list li {
    margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .themes-list li:last-child {
    margin-left: 0;
}
html[lang="ar"] .reducedQuantity .md-input {
    float: right;
}
html[lang="ar"] .student_data h3 {
    margin-left: 0;
    margin-right: 20px;
}
html[lang="ar"] .item.item-acc md-checkbox .md-label {
    margin-right: 0;
}
html[lang="ar"] .custom-checkbox-list md-checkbox .md-label span {
    padding-left: 0;
    padding-right: 10px;
}
html[lang="ar"] .item.item-acc .card-grid-view .card-content p {
    text-align: right;
}
html[lang="ar"] .item.item-acc .card-grid-view md-card-title .material-icons {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}
html[lang="ar"] .custom-checkbox-list md-checkbox .md-label .md-icon-button {
    right: auto;
    left: 0;
}
html[lang="ar"] form[name="lateFineSettings"] .radio-group md-radio-button {
    margin: 0 0 0 25px !important;
}
html[lang="ar"] .gc_inner {
    margin-right: 0;
    margin-left: 17px !important;
}
html[lang="ar"] .item .custom_folded + .expanded {
    padding: 10px 10px 0 0;
}
html[lang="ar"] .schedule_category .card-grid-view .pastDateTime {
    text-align: center;
}
html[lang="ar"] .map-widget .checkbox-style ul {
    padding-right: 20px;
}
html[lang="ar"] .card-grid-view .md-menu .md-icon-button {
    right: auto;
    left: 0;
}
html[lang="ar"] .carousel-wrapper .slick-prev {
    right: auto;
    left: 40px;
}
html[lang="ar"] .carousel-wrapper .slick-next {
    right: auto;
    left: 0;
}
html[lang="ar"] .editPrint-tab .label-info md-list md-list-item {
    padding-left: 0;
    padding-right: 20px;
}
html[lang="ar"] .radioDue-certificate md-radio-button .md-label, html[lang="ar"] .radioDue-certificate md-checkbox .md-label {
    margin-right: 0;
}
html[lang="ar"] .template-selection md-radio-button .md-label, html[lang="ar"] .template-selection md-checkbox .md-label {
    margin-right: 0;
}
html[lang="ar"] .sort-card .md-label {
    margin-right: 0;
} 
html[lang="ar"] .pastDateTime span, html[lang="ar"] .pastDateTime strong {
    display: inline-block;
}
html[lang="ar"] .radioButton-space .radio-group md-radio-button {
    margin: 0 0 0 25px !important;
}
html[lang="ar"] md-input-container.studentName_search>label {
    right: 36px;
}
html[lang="ar"] .cusotm-notes ol {
    padding: 0 15px 0 0;
}
html[lang="ar"] .concessionAmount h4 span.ml-40 {
    margin-right: 0;
    margin-left: 40px;
}
html[lang="ar"] .drag-option span {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .drag-icon:before {
    left: auto;
    right: 0;
}
html[lang="ar"] .card-header {
    padding: 10px 15px 10px 15px;
}
html[lang="ar"] .right-align {
    float: right;
}
html[lang="ar"] .template-box .selected-list ul {
    padding: 0;
}
html[lang="ar"] .template-box .selected-list md-checkbox .md-label {
    margin-right: 0;
}
html[lang="ar"] .section-display li > md-menu {
    right: auto;
    left: -10px;
}

/*=========== Fee CSS Changes Ends: ===========*/

/*=========== Communications CSS Changes Starts: ===========*/
html[lang="ar"] .shadow-box .md-cell .approver-img {
    margin-right: 0;
    margin-left: 10px;
    text-align: center;
}
html[lang="ar"] .shadow-box  md-radio-button .md-label,
html[lang="ar"] .shadow-box md-checkbox .md-label  {
    margin-right: 0;
}
html[lang="ar"] .select-list-comm li .vehicle-icon {
    float: left;
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .select-list-comm .profile-img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .select-list-comm li md-checkbox .md-label {
    margin-right: 0;
}
html[lang="ar"] .custom-block-view li {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .custom-block-view li p span {
    margin-left: 0;
    margin-right: 5px;
}
html[lang="ar"] .folded ul {
    padding: 0;
}
html[lang="ar"] .folded li {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .switch-view span {
    text-align: right;
}
html[lang="ar"] .msg-wrap {
    padding-left: 0;
    padding-right: 15px;
    border-left: 0 none;
    border-right: 1px solid var(--border-color);
}
html[lang="ar"] #composeForm .checkbox-group md-checkbox {
    margin: 0 0 10px 25px;
}
html[lang="ar"] #composeForm .cat-list .list-item {
    margin-right: 0;
    margin-left: 3.5%;
}
html[lang="ar"] .sms-note {
    padding-left: 0;
    padding-right: 20px;
}
html[lang="ar"] .message-header img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .priority-chips, html[lang="ar"] .chip-style {
    padding-left: 0;
    padding-right: 10px;
}
html[lang="ar"] .sms-details-section, 
html[lang="ar"] .custom-block-view li, 
html[lang="ar"] .mode-chosen ul li span {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .mode-chosen ul li {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .summary-report .radio-wrapper md-radio-button {
    margin: 0 0 0 15px !important;
}
html[lang="ar"] .summary-report .radio-wrapper md-radio-button .md-container {
    margin-right: 0;
}
html[lang="ar"] ul.sms-sent {
    padding-right: 0;
}
html[lang="ar"] ul.sms-sent li::before {
    left: auto;
    right: 0;
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .settings-wrap.card-grid-view md-card-title-text .md-headline {
    overflow: inherit;
}
html[lang="ar"] .shadow-box {
    margin-right: 0;
    margin-left: 30px;
}
html[lang="ar"] .recommended-block:after {
    right: auto;
    left: 0;
    border-left: 0 none;
    border-right: 10px solid #99BCA8;
}
html[lang="ar"] .recommended-block span {
    left: auto;
    right: -26px;
}
html[lang="ar"] .recommended-block {
    right: auto;
    left: -10px;
}
html[lang="ar"] .md-chips md-chip .md-chip-remove-container {
    right: auto;
    left: 0px;
}
html[lang="ar"] .auto-chips .md-chips md-chip {
    padding-right: 12px;
    padding-left: 22px;
}
html[lang="ar"] button.chip-btn {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .droppable .drop-icon .material-icons,
html[lang="ar"] .drop-box .drop-icon .material-icons {
    direction: ltr;
}
html[lang="ar"] .positon-text {
    transform: translate(-20px, 8px);
}
/*=========== Communications CSS Changes Ends: ===========*/

/*=========== Accounting CSS Changes Starts: ===========*/
html[lang="ar"] .indicators li {
    margin-right: 0;
    margin-left: 30px;
}
html[lang="ar"] .indicators li:before, html[lang="ar"] .tree li md-card md-card-content .md-headline span, html[lang="ar"] .generated-circle {
    margin-left: 5px;
    margin-right: 0;
}
html[lang="ar"] .advance-search .search-icon {
    left: auto;
    right: 2px;
}
/*=========== Accounting CSS Changes Ends: ===========*/

/*=========== Leave CSS Changes Ends: ===========*/
html[lang="ar"] .item .user .expanded {
    padding: 0;
}
html[lang="ar"] .custom-datepicker .md-icon-button{
	right:auto;
	left:0px;
}
html[lang="ar"] .expiry-checkbox md-checkbox {
    margin-right: 0; 
    margin-left: 16px;
}
/*=========== Staff CSS Changes Starts: ===========*/
html[lang="ar"] span.task-icon {
    right: auto;
    left: 0;
}
html[lang="ar"] .library-card.student-card md-card-footer h3 {
    padding-right: 0;
    padding-left: 40px;
}
html[lang="ar"] .event-legends li {
    margin-right: 0;
    margin-left: 25px;
}
html[lang="ar"] .event-legends li span {
    position: absolute;
    left: -15px;
    top: 3px;
}
html[lang="ar"] .custom-cell .holiday h5 {
    margin-left: 0;
    margin-right: 40px;
}
html[lang="ar"] .chips-list-view li {
    padding: 0 15px 0 0;
}
html[lang="ar"] .transport-card md-card-footer img {
    margin-right: 0;
    margin-left: 15px;
}
/*=========== Staff CSS Changes Ends: ===========*/
/*=========== Student CSS Changes Starts: ===========*/
html[lang="ar"] .student-fee md-progress-linear {
    margin-top: 15px;
}
html[lang="ar"] .custom-labels span:first-child {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] #app_notification_alert,
html[lang="ar"] #alert_branch,
html[lang="ar"] #email_alert,
html[lang="ar"] #notification_alert {
    direction: ltr;
}
html[lang="ar"] .profileMenu .rightMenuSettings a.md-button i, 
html[lang="ar"] .profileMenu .rightMenuSettings md-list-item span i {    
    margin-left: 16px;
    margin-right: 0px;
}
html[lang="ar"] .attendance-list ul li {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .date-icon .custom-date .md-icon-button{
    right: auto !important;
}
html[lang="ar"] .status-progress ul li:before {
    left: auto;
    right: 65%;
}
html[lang="ar"] .promoted i.fa-bullhorn {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .listing-types ul li {
    margin-right: 0;
    margin-left: 10px;
    padding: 5px 10px 5px 25px;
}
html[lang="ar"] .listing-types ul li .md-icon-button.md-button {
    right: auto;
    left: 0;
}
html[lang="ar"] .transport-card md-card-header-text .roll-info {
    text-align: right;
}
html[lang="ar"] form[name="renewalAddSettingForm"] md-checkbox {
    margin-right: 0;
    margin-left: 16px;
}
/*=========== Student CSS Changes Ends: ===========*/
/*=========== Admission CSS Changes Starts: ===========*/
html[lang="ar"] .nextstepButton .md-button md-icon.material-icons {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}
html[lang="ar"] .adm-check .md-label {
	margin-right: 50px;
}
html[lang="ar"] .adm-check .md-container {
	right: 15px;
}
html[lang="ar"] .studentHouses md-radio-button .md-label, 
html[lang="ar"] .studentHouses md-checkbox .md-label {
    margin-right: 0;
}

/*=========== Admission CSS Changes Ends: ===========*/
/*=========== Attendance CSS Changes Starts: ===========*/
html[lang="ar"] .status-mark {
	margin-right: 0;
	margin-left: 20px;
}
html[lang="ar"] .set-status md-checkbox .md-label {
 	margin-right: 0;
}
html[lang="ar"] .set-status md-checkbox {
 	margin-right: 0 !important;
    margin-left: 20px !important;
 }
 html[lang="ar"] .attendance-status .font16 {
 	font-size: var(--ar_fontsizebody) !important;
 }
/*=========== Attendance CSS Changes Ends: ===========*/
html[lang="ar"] .add-button-visit {
    right: auto;
    left: 47px;
}
html[lang="ar"] .left-menu md-item-content .md-button.md-primary .badge {
    left: 16px;
    right: auto;
}
html[lang="ar"] .fine_select md-radio-button .md-container {
    left: auto;
    right: 23px;
}
html[lang="ar"] .fine_select md-radio-button .md-off, 
html[lang="ar"] .fine_select md-radio-button .md-on {
    top:-4px;
}
html[lang="ar"] .rightMenuSettings md-list md-list-item .md-button i.fa-angle-right {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}
html[lang="ar"] md-input-container.md-icon-left.navigationheader-legend .md-input {
    padding-left: 8px;
    padding-right: 36px;
}
html[lang="ar"] md-input-container.md-icon-left.navigationheader-legend {
    padding-right: 0;
    /*margin-left: 0;*/
}
html[lang="ar"] md-input-container.md-icon-left.navigationheader-legend md-icon {
    left: auto;
    right: 8px;
}

/*=========== Timetable CSS Changes Ends: ===========*/
html[lang="ar"] .new_timetable .creation_wrapper .left_wrap {
    float: left;
}
html[lang="ar"] .new_timetable .creation_wrapper .right_wrap {
    left: auto;
    right: 0;
}
html[lang="ar"] .flex-offset-20, html[lang="ar"] .offset-20 {
    margin-left: 0;
    margin-right: 20%;
}
html[lang="ar"] .parallel-subject md-radio-button .md-label, 
html[lang="ar"] .parallel-subject md-checkbox .md-label {
    margin-left: 0;
    margin-right: 0;
} 
html[lang="ar"] .parallel-subject .custom-radio-block md-radio-group md-radio-button {
    margin-left: 0;
}
html[lang="ar"] md-input-container.custom-input-field .md-input, 
html[lang="ar"] .custom-input-field md-input-container .md-input {
    padding-left: 0;
    padding-right: 8px;
}
html[lang="ar"] md-input-container.md-icon-left.custom-input-field .md-input {
    padding-left: 0;
    padding-right: 36px;
}
html[lang="ar"] md-input-container.md-icon-left.custom-input-field {
    padding-right: 0;
}
html[lang="ar"] .user-template span {
    text-align: right;
}
html[lang="ar"] .user-template .profile-img {
    margin-right: 0;
    margin-left: 10px;
}
/*=========== Performance Management CSS Changes Ends: ===========*/
html[lang="ar"] .custom-date.custom-input-field mdp-date-picker .md-button.md-icon-button, 
html[lang="ar"] .custom-time.custom-input-field mdp-time-picker .md-button.md-icon-button {
    left: 4px;
}
/*=========== Transport CSS Changes Ends: ===========*/
html[lang="ar"] .stops-menu .stops-menu-list .sort-icon + label {
    margin-right: 0;
    margin-left: 15px;
}
html[lang="ar"] .service-card-content .icon-vehicle,
html[lang="ar"] .service-card-details .service-card-content .profile-img {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .stops-menu .stops-menu-list .sort-icon {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .pie-legends p span {
    margin-right: 0;
    margin-left: 5px;
}
html[lang="ar"] .tracking-list {
    padding: 20px 30px 20px 0;
}
html[lang="ar"] .tracking-list li:before {
    left: auto;
    right: 7px;
}
html[lang="ar"] .tracking-list li span {
    left: auto;
    right: 0;
}
html[lang="ar"] .tracking-list li {
    padding-left: 0;
    padding-right: 40px;
}
html[lang="ar"] .route-information li img {
    margin-right: 0;
    margin-left: 20px;
}
html[lang="ar"] .fee-route.active {
    border-left: 0 none;
    border-right: 10px solid var(--green-text);
}
html[lang="ar"] .route-display li:before {
    left: auto;
    right: 0;
}
html[lang="ar"] .route-display li {
    padding: 20px 25px 20px 0;
} 
html[lang="ar"] .transport-fee .radio-group md-radio-button {
    margin: 0 0 5px 25px !important;
}
html[lang="ar"] .transport-fee md-radio-button .md-container.md-ink-ripple {
    left: auto;
    right: 0;
}
html[lang="ar"] #studentStaffTransportReport .radio-group md-radio-button {
	margin: 0px 18px 0px 0px !important;
}
html[lang="ar"] .manage-trip md-list-item .icon-vehicle, 
html[lang="ar"] .manage-trip md-list-item .md-avatar {
    margin-left: 10px;
    margin-right: 0;
}
html[lang="ar"] md-list-item .md-avatar, 
html[lang="ar"] md-list-item .md-avatar-icon, 
html[lang="ar"] md-list-item .md-list-item-inner .md-avatar, 
html[lang="ar"] md-list-item .md-list-item-inner .md-avatar-icon {
    margin-right: 0;
    margin-left: 16px;
}
html[lang="ar"] md-input-container.select-dropdown.custom-input-field::before {
    right: auto;
    left: 12px;
}
html[lang="ar"] .choose-code md-radio-button {
    margin: 20px 0 20px 20px !important;
}
html[lang="ar"] .advance-search md-menu {
    left: -15px;
    right: auto;
}
/*=========== Attendace CSS Changes Starts: ===========*/
html[lang="ar"] .attendance-calender.nav-btns {
    direction: ltr; 
    justify-content: start;
}
html[lang="ar"] .md-custom-select .md-select-placeholder span {
    margin-left: 0;
    margin-right: 9px;
}
/*=========== Inventory CSS Changes Ends: ===========*/
html[lang="ar"] .sales-radio-group .radio-group md-radio-button {
    margin: 15px 0 0 25px !important;
}
html[lang="ar"] .navigation-disable-btn label {
    right: 0;
} 
html[lang="ar"] .date-btn.navigationheader-legend mdp-date-picker .md-button.md-icon-button {
    right: auto;
    left: 14px;
}
html[lang="ar"] .inventory-sales .radio-group md-radio-button {
    margin: 0 18px 0 0 !important;
}
/*=========== Payroll CSS Changes Ends: ===========*/
html[lang="ar"] .payroll-set.radio-group md-radio-button {
    margin: 10px 0 0 30px !important;
}

html[lang="ar"] .fabtooltip, html[lang="ar"] .discussionFabtooltip {
	-webkit-transform: translate(70px, 0px);
	transform: translate(70px, 0px);
}
html[lang="ar"] .md-select-value>span:not(.md-select-icon) .md-text {
    font-size: var(--default-font14);
}
html[lang="ar"] .postHeader .comment-img-circle {
    margin-left: 10px;
    margin-right: 0;
}
html[lang="ar"] .custom-dialog.resource-publish md-toolbar .md-button.md-icon-button {
    margin: 0 0 0 10px;
}

/* -------------------New Changes Add----------------- */

html[lang="ar"] .question-correction .smBtn .custom-bgDefault,
html[lang="ar"] .question-correction .smBtn .correctAnswerGrey,
html[lang="ar"] .question-correction .smBtn .wrongAnswerGrey {
    margin-right: 0;
}
html[lang="ar"] .clearStandards {
    right: auto;
    left: auto;
}
html[lang="ar"] .navigationheader-legend md-input-container {
    margin-right: 8px;
}
html[lang="ar"] .create-exam-view .examLabelName {
    margin-bottom: 8px;
}
html[lang="ar"] .recycleBin .iconMargin .thumbnile {
    margin: 0;
}
html[lang="ar"] md-input-container.md-icon-left.custom-input-field md-icon {
    left: auto;
    right: 8px;
}
html[lang="ar"] #addSeparationProcedure md-input-container .md-input-messages-animation {
    clear: right;
}

html[lang="ar"] .performance-menu.student-performanceMenu .performance-details:after{
	right:auto;
}

/* -----------------09-05-22-------------- */

html[lang="ar"] .performance-menu.student-performanceMenu .performance-details:after{
	right:auto;
}
html[lang="ar"] .performance-details p span {
    left: auto;
    right: 0;
}
html[lang="ar"] .performance-details md-input-container {
    margin-right: 1px;
}
html[lang="ar"] .performance-details small {direction: ltr;}

html[lang="ar"] .nicescroll-rails-vr {
    z-index: 8!important;
    right: auto !important;
    left: 0 !important;
}
html[lang="ar"] .tab-inside h4 {
    margin-right: 0;
    margin-left: 10px;
}
html[lang="ar"] .studentDDStaus.custom-studentDDStaus p label {
    margin-left: 0;
    margin-right: 5px;
}
html[lang="ar"] .sDDBabul {top: 0;}
html[lang="ar"] .new_tabs_custom .schoolperformanceTab md-tabs.tabs .md-tab:after {
    left: auto;
    right: 0;
}
html[lang="ar"] .portfolio-header {
    padding: 10px 15px 10px 0;
}
html[lang="ar"] .highcharts-tooltip {
	direction: rtl;
	display: inline-block;
	text-align: right;
}
html[lang="ar"] .custom-homeworksection .custom-recipient-legend .md-select-icon {
  right: auto;
  left: 4px;
}
html[lang="ar"] .fab-btn{right: auto;left: 0;}
/* --------------------Payroll------------------- */
html[lang="ar"] .custom-note-payroll {
    left: auto;
    right: 0;
    padding-left: 0;
    padding-right: 20px;
}
a.md-button.md-primary.md-raised.custom-academy-btn {
    text-decoration: none;
    min-width: 137px;
    text-transform: capitalize;
    font-size: var(--default-fontsize);
    min-height: 24px;
    height: 24px;
    line-height: 24px;
    box-shadow: none;
}

html[lang="ar"] .rtlButtons.bottom_btn {
    left: 0;
}
html[lang="ar"] .select-dropdown.custom-input-field select.ng-empty,
html[lang="ar"] .select-dropdown.custom-input-field select.ng-not-empty {
	padding-left: inherit;
	padding-right: 8px;
}

/* ---------------- 14-10-22 ------------- */
html[lang="ar"] .menu_list i[class^="menu-"], html[lang="ar"] .menu_list i[class*=" menu-"] {
    direction: ltr;
}
md-tabs.modal-tabs .enhanced-table md-table-pagination {
    width: 100%;
    min-width: 100%;
}
.evaluation-wrapper .annotatefiles .custom-button-block {
    left: 64px;
}
html[lang="ar"] .evaluation-wrapper .annotatefiles .custom-button-block {
    left: auto;
    right: 64px;
}
.examcorner-pagination {
    right: 0;
}
html[lang="ar"] .examcorner-pagination {
    left: 0;
    right: auto;
}

.page-layout-wrapper {
    height: 100%;
}
.content_area_wrapper.is_edu_footer .enhanced-table md-table-pagination {
    bottom: 40px;
}
html[lang="en"] md-tooltip.img-tooltip .md-content {
	padding: 5px 5px 2px 0;
    max-width: 400px;
}
html[lang="en"] md-tooltip.img-tooltip .md-content img {
    max-width: 100%;
    width: 99%;
    height: auto;
}
.bulk_upload_wrap .fileupload-footer{
	width: calc(100% - 64px);
	right: 0;
}
html[lang="ar"] .bulk_upload_wrap .fileupload-footer {
    left: 0;
    right: auto;
}
html[lang="ar"]  footer.footer-section{
	left: 0;
}

.rightMenuSettings md-list md-list-item#studentMenu .md-list-item-inner {
    padding: 0;
}
.rightMenuSettings md-list md-list-item#studentMenu md-menu {
    display: flex;
    margin: inherit;
    width: 100%;
}
.rightMenuSettings  a.md-button.switchStudentButton {
    width: 100%;
    border: solid 1px var(--asidemenutextdefaultcolor);
    color: var(--asidemenutextsecondarycolor);
    height: 32px !important;
    min-height: 32px;
    border-radius: 4px;
}
.rightMenuSettings a.md-button.switchStudentButton:after {
    content: "";
    display: block;
    content: '\25BC';
    position: absolute;
    top: 0;
    speak: none;
    font-size: var(--default-fontsize);
    -webkit-transform: scaleY(.5) scaleX(1);
    transform: scaleY(.5) scaleX(1);
    bottom: 0;
    margin: auto;
    right: 16px;
}
md-menu-content.menu-level-switch {
    background: var(--asidemenubgsecondarycolor) !important;
    min-width: 292px;
    border-radius: 4px;
	padding: 8px 0;
}
md-menu-content.menu-level-switch md-menu-item {
    color: var(--asidemenutextprimarycolor) !important;
    font-size: var(--default-fontsize);
    height: auto;
    font-weight: 500;
    min-height: auto;
}
md-menu-content.menu-level-switch md-menu-item a {
    min-height: 32px;
    height: 32px;
    padding-top: 0;
    line-height: 32px;
}
md-menu-content.menu-level-switch md-menu-item a.md-active{
    background: #D1D4DA !important;
    font-weight: 600;
}
md-menu-content.menu-level-switch md-menu-item a:hover {
    background: #D1D4DA !important;
}
.rightMenuSettings a.md-button.switchStudentButton:hover {
    background: none !important;
}
/* NC Tools Dialog  */
md-dialog.custom-dialog.toolcornerDialog {
    max-height: 95%;
    height: 95%;
}
md-dialog.custom-dialog.toolcornerDialog .md-icon-button.closeBtn {
    position: absolute;
    right: 24px;
    margin: 0;
    color: #fff;
    top: 10px;
    z-index: 12;
}
md-dialog.custom-dialog.toolcornerDialog .md-icon-button.closeBtn md-icon {
    color: unset;
}
/* NC Tools Dialog  */
@media only screen and (max-width: 1600px) {
	html[lang="ar"] .custom-tab .custom-tab-header li {
	    width: 170px;
	}
}
@media only screen and (min-width: 1024px) and (max-width: 1399px) {
	html[lang="ar"] .custom-tab .custom-tab-header li {
		width: calc(12% - 15px);
        line-height: 17px;	
	}
} 
@media only screen and (max-width: 1023px) {
    html[lang="ar"] .filterMain.md-closed {
        left: auto;
        right: 0;
    }
    html[lang="ar"] .filterMain {
        left: auto;
        right: -360px;
        margin: 0;
    }
    
}

@media only screen and (max-width:768px) {
    html[lang="ar"] .exam-mobile-wrap .custom-date {
        margin-left: 5px;
    }
    html[lang="ar"] .mobileMarksHeader .sidePanelclose {
        right: auto;
        left: 10px;
    }
     /* Rubrics Sidebar */
    .rubricSidebar {
    	width: 100%;
	    right: -110%;
        position: fixed;
        border: none;
    }
    .rubricSidebarFullScreenButton {
    	display: none;
    }
    .rubricSidebarFooter {
  	    padding: 12px 0 6px 0;
    }
}

@media (max-width:767px){
	
	html[lang="ar"] .mr-xs-0 {
		margin-left: 0 !important;
	} 
	html[lang="ar"] .pr-xs-0 {
		padding-left: 0 !important;
	}
    html[lang="ar"] .resource-wrapper .resource-sequence .dragicon {
        margin-left: 10px;	
    }
    html[lang="ar"] .cs_treeview ul li {
        margin-left: 0;
    }
    html[lang="ar"] .custom-date.hwcustom-date md-input-container, 
    html[lang="ar"] .custom-time.hwcustom-date md-input-container, 
    html[lang="ar"] .legendStyle .md-select-value {
        padding-right: 0;
    }
    html[lang="ar"] .hwtlanding .hwcustom-date.custom-date md-input-container {
        margin-bottom: 12px !important;
    }
    html[lang="ar"] .hwtlanding .hwtfullview.pendingEvaluation {
        margin-top: 0;
    }
    html[lang="ar"] .hwcreationmobileview .fullView.width220 {
        margin-right: 1rem !important;
        margin-left: 0 !important;
    }
    html[lang="ar"] .navigationheader-legend {
        margin: 0px 0 12px 10px;
    }
    html[lang="ar"] .session span.profile-img {
        margin-left: 10px;
        margin-right: 0;
    }
    html[lang="ar"] #library .resourcesCardView md-card {
        min-height: auto;
    }
    html[lang="ar"] .homeworksection .homeworksection-content .custom-date md-input-container, 
    html[lang="ar"] .homeworksection .homeworksection-content .custom-time md-input-container {
        margin: 0;
    }
    html[lang="ar"] .custom-date mdp-date-picker .md-button.md-icon-button, 
    html[lang="ar"] .custom-time mdp-time-picker .md-button.md-icon-button {
        top: 0;
    }

    .mob-top-space {margin-top: 15px;}
    .evaluation-wrapper .annotatefiles .custom-button-block {
        left: 0;
    }
    html[lang="ar"] .evaluation-wrapper .annotatefiles .custom-button-block {
        left: auto;
        right: 0;
    }
    html[lang="ar"] .notificationAnimation1 {
	    right: -56px;
	}
	.coachingcenterLogin .lmsbody md-toolbar.lmsheader {
		left: 0;
	}
}
@media only screen and (max-width: 640px) {

    /*=========== Add Activity Responsive Changes Starts: ===========*/
     html[lang="ar"] .activity-content .activityContentview .navigationheader-legend,
     html[lang="ar"] .activity-content .activityContentview .lms-navigationheader-legend,
     html[lang="ar"] .activity-content .activityContentview .custom-input-field {
         margin-left: 0;
     }
     html[lang="ar"] .activity-content .activityContentview .lmsllmobile-view .inputhalfview {
         margin-left: -1px !important;
     }
     html[lang="ar"] .activity-content .activityContentview md-input-container.md-icon-left {
         padding-right: 0;
     }
     html[lang="ar"] .activity-content .activityContentview .custom-date mdp-date-picker .md-button.md-icon-button, 
     html[lang="ar"] .activity-content .activityContentview .custom-time mdp-time-picker .md-button.md-icon-button {
         right: auto !important;
         left: 4px;
     }
     
     html[lang="ar"] .tool-tip.hwlTooltip {
         left: auto !important;
         right: -150px;
     }
     html[lang="ar"] .hwtInputevalues .md-button.md-icon-button {
         margin-right: 0 !important;
         margin-left: 5px;
     }
     html[lang="ar"] md-checkbox .md-container {
         right: 0;
     }
     html[lang="ar"] .custom-dialog .md-toolbar-tools h3 {
         font-size: var(--ar_fontsizebody) !important;
     }
     .footer-btns .md-button { 
         font-size: 12px !important;
     }
     html[lang="ar"] .custom-dialog .md-toolbar-tools h2 {
         font-size: 18px !important;
     }
     html[lang="ar"] .resourcesCardView md-card .resource-content .heading {
         margin-bottom: 0;
     }
     html[lang="ar"] .hybrid-custom {
         margin-right: 0;
     }
     html[lang="ar"] .left_navigation {
         right: -100%;
     }
 }
 
/*  @media only screen and (max-width: 480px) {
     html[lang="ar"] md-tabs md-pagination-wrapper {
         left: 0;
         right: auto;
     }
     html[lang="ar"] md-tabs md-pagination-wrapper .md-tab {
         float: left;
     }
     .notificationAnimation1.mobileNotificationAnimation {
		left: 5px;
	}
	html[lang="ar"] .notificationAnimation1.mobileNotificationAnimation {
		right: 7px;
	}
	.notificationAnimation1.notificationAnimationStep5 {
		right: 37px;
	}
	html[lang="ar"] .notificationAnimation1.notificationAnimationStep5 {
	    left: 36px;
	}
 } */

/* LMS Related Style */
.principalsection-pagination,
.activitysection-pagination,
.resources-pagination,
.hwtracker-pagination,
.archivechapter-pagination {
	width: calc(100% - 64px) !important;
}
.lmslistview-pagination,
.collection-footer,
.qa_pagination {
	width: calc(100% - 64px) !important;
}
.resource-collection-dialog .resources-pagination {
	width: 100% !important;
}
.hwtracker-pagination.sws-pagination {
    left: 64px !important;
}
.discusionboard-pagination {
	left: 64px !important;
	transform: translate(0%, 0px) !important;
}
.md-table-pagination {
	border: 0;
}
.chaptersessiontabaction {
	width: calc(100% - 444px) !important;
}
.examcorner-pagination {
	width: calc(100% - 365px) !important; 
}
.examcorner-pagination.main-view {
	width: calc(100% - 280px) !important;
}
.fixedPagination {
	width: calc(100% - 327px) !important;
}
.rightContent .forums-pagination  {
	width: calc(100% - 284px);
}
.switch-version {
	right: 130px;
}
.custom-medical-bottom {
	width: calc(100% - 64px);
	right: 0;
}
.evaluationfiles .evalutionfilesfooter{
	width: calc(100% - 424px);
}
.evaluationfiles .custom-button-block span.text-hide {
    color: #fff;
}
.evaluationfiles .custom-button-block {
	left: 64px;
}
.custom-fullscreen .evaluationfiles .custom-button-block {
	left: 0px;
}
html[lang="ar"] .bubble-series ul li span {
    left: auto;
    right: 0;
}
html[lang="ar"] .bubble-series ul li {
    padding-left: 0;
    padding-right: 20px;
}
@media only screen and (max-width: 1279px) {
	.examcorner-pagination {
		width: calc(100% - 64px) !important;
	}
	
	/* Live Reports Dialog Starts */
	.tsrDesktopContent {
		display: none;	
	}
	.tsrMobileContent {
		display: flex;	
		padding: 5px 10px;
	}  	
	.tsrAccordionContent {
	    background-color: var(--secondary-bg-color);
	    padding: 10px 8px;
	}
	.tsrAccordionlabel {
	    min-width: 120px;
	    color: #757575;
	}
	.tsrCol {
	    min-width: 16px;
	    text-align: center;
	}
	.tsrMobileContent .folded {
	    padding: 8px;
	}
	
	.tsrMobileContent .folded h3 {
	    font-size: var(--default-font14);
	    font-weight: normal;
	}
	.tsrAccordionContentItem {
	    margin: 5px 0;
	}
	.tsrMobileContent .user .expanded {
	    color: black;
	}
	.tsReportsDialog .md-button.goToExams {
	    margin: 5px;
	}	
	.cochingMenu{
		padding: 0 16px;
		max-width:1396px;
	}
	/* Live Reports Dialog Ends */
}
@media only screen and (max-width: 1023px) {
	.llheigth48 {
		height: calc(100% - 48px);
	}
	.courseheight108 {
		height: calc(100% - 100px);
	}
	.courseplanchapter-details {
		height: calc(100% - 46px);
	}
	.rightMenuSettings {
	    min-height: calc(100vh - 105px);
	    height: calc(100vh - 105px);
	}
	.rightContent .forums-pagination  {
		width: calc(100% - 284px);
	}
	.lectureMenu.ng-hide {
		bottom: 40px !important;
	} 	
}
@media only screen and (max-width: 768px) {
	
	.mobileMenuShow .md-button.md-icon-button {
		z-index: 7;
	}
	.lmsllmobile-view.activityHeight {
	    min-height: 172px !important;
	}
	.courseplanchapter-details {
	    width: 320px;
   		min-width: 320px;
	}
	.courseplanchapter-details {
		height: 100%;
	} 
	.lmslistview-pagination {
		width: calc(100% - 64px) !important;
	}
	 .chaptersessiontabaction {
        width: calc(100% - 64px) !important;
    }
    .courseplanchapter-details {
		left: 64px;
	}
	.lectureMenu.ng-hide {
		width: calc(100% - 74px) !important;
	}
	
	/* Rubrics Starts*/
	md-dialog.rubicsEvaluationDialog {
	    max-width: 98%;
	    min-width: 98%;
	    height: 98%;
	    min-height: 98%;
	}	
	md-dialog.rubicsEvaluationDialog md-toolbar .md-toolbar-tools {
		padding: 0 8px 0 12px;
		background-color: white;
    	color: black;
	}
	md-dialog.rubicsEvaluationDialog md-toolbar .md-toolbar-tools .md-button md-icon {
    	color: black;
	}
	md-dialog.rubicsEvaluationDialog md-dialog-content {
		padding: 0 0 0 12px;
		font-size: 12px;
	}	
	.rubicsEvaluationTableHeader {
		margin-right: 12px;
	    margin-top: 12px;
	}
	.rubicsEvaluationContent {
	    padding-right: 12px;
	}
	.rubicsEvaluationTableHeader .flex-15, .rubicsEvaluationItem .flex-15 {
	    width: 20%;
	    min-width: 20%;
	    text-align: center;
	}	
	.rubicsEvaluationFooter {
		margin-right: 12px;
	}
	md-dialog.rubicsEvaluationDialog md-dialog-actions .md-button {
    	text-transform: capitalize;
	}
	/* Rubrics Arabic */
	html[lang="ar"] md-dialog.rubicsEvaluationDialog md-dialog-content {
	    padding: 0 12px 0 0
	} 
	html[lang="ar"] {
		margin-right: 0;
	    margin-left: 12px;
	}
	html[lang="ar"] .rubicsEvaluationContent {
		padding-right: 0;
	    padding-left: 12px;
	} 
	html[lang="ar"] .rubicsEvaluationPerformance {
		margin-right: 4px;
	    margin-left: 0;
	} 	
	html[lang="ar"] .rubicsEvaluationTableHeader {
		margin-left: 12px;
    	margin-right: 0;
	}
	html[lang="ar"] .rubicsEvaluationFooter {
		margin-left: 12px;
		margin-right: 0;
	}
	/* Rubrics Starts*/
	.tag-data {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: start;
        width: 100%;
        height: auto !important;
    }
    .tag-data-left {
        margin-bottom: 15px;
    }
    .tag-data-right {
        padding: 0 10px !important;
        width: 100%;
    }
}
@media (max-width: 959px) { 
	md-toast {
		width: calc(100% - 84px);
		left: 74px;
		margin-right: 0;
	}
	md-toast.md-left {
		width: calc(100% - 84px);
	}
    .enhanced-table md-table-pagination.width-80 {
        width: calc(70% - 45px) !important;
    }
    .list-items.checkbox-style li {
        width: auto;
    }
    .radio-tab md-radio-button {
        font-size: 12px !important;
    }
    .radio-tab .md-label {
        padding: 7px 10px;
    }
}
@media only screen and (max-width: 767px) { 
	.profile_inner {
		height: 30px;
		width: 30px;
		line-height: 26px;
		font-size: var(--default-font14);
	}
	#nlpHeader md-toolbar:not(.md-menu-toolbar) .notificationMenu .feedHeader .showNotificationButton, 
	#nlpHeader md-toolbar:not(.md-menu-toolbar) .userNameDetails .openProfileButton {
		width: 20px;
	    height: 20px;
	    min-height: 20px;
	}	
	.selectLanguage md-select {
		padding: 0 8px;
	}
	.userNameDetails {
		padding-left: 12px;
	}
	.enhanced-table md-table-pagination{ 
    	width: 100%;
	}
	.rightContent .forums-pagination  {
		width: 100%;
	}
	.custom-medical-bottom {
		width: 100%;
		padding: 0 12px;
	}
	.footer-pagination{
    	width: 100%; 
	}
	md-toast {
		left: 8px;
	    width: calc(100% - 16px);
	    right: 8px;
	}
	md-toast.md-left {
	    left: 8px;
    	width: calc(100% - 16px);
	}	 
	.lmslistview-pagination,
	.examcorner-pagination,
	.qa_pagination {
		width: 100% !important;
	} 
	
	/* Rubrics Starts */
	.rubicsEvaluationItem {
		padding: 12px;
	}
	.rubicsEvaluationFooter {
	    padding: 5px 12px;
	}
	.rePerformanceLevel {
		margin-right: 0;
    	max-width: 100%;
    	min-width: 100%;
	}
	/* Rubrics Ends */
	.cochingMenu{
		padding:0;
	}
	.forMobile {
		padding: 0 !important;
	}
	.coachingContent {
	    padding: 16px 0;
	}
}
@media only screen and (max-width: 640px) {
	.lmsmobileview-content {
		padding: 12px;
	}
	.custom-manage-chips ul li {
	    width: 230px;
	}
	.chaptersessiontabaction {
        width: 100% !important;
    }
	.fixedPagination {
		width: 100%;
		padding: 0;
	} 
	.lmslistview-pagination {
        width: 100%!important;
    }
    .resources-pagination {
		width: 100%!important;
	}
	
	/* Live Reports Dialog Starts */
    .tsrAccordionlabel {
	    min-width: 85px;
	}
	/* Live Reports Dialog Ends */
}

@media (max-width: 480px){	
	.custom-dialog md-dialog-content,
	.customDialog md-dialog-content {
	    min-width: inherit !important;
	}
	.hwtracker-bg {
	    height: calc(100% - 180px);
	}
	.notificationMenu::before {
		right: 65px;
	}
}
@media only screen and (max-width: 360px) {
	.currentstudent {
	    max-width: calc(100% - 74px);
	}
}

/* END */


/*** ----- Resources font icons --------*****/
@font-face {
  font-family: 'mgs';
  src:  url('https://nlpkube1.nexterp.in/nlp/fonts/mgs/mgs.eot?feeqdv');
  src:  url('https://nlpkube1.nexterp.in/nlp/fonts/mgs/mgs.eot?feeqdv#iefix') format('embedded-opentype'),
    url('https://nlpkube1.nexterp.in/nlp/fonts/mgs/mgs.ttf?feeqdv') format('truetype'),
    url('https://nlpkube1.nexterp.in/nlp/fonts/mgs/mgs.woff?feeqdv') format('woff'),
    url('https://nlpkube1.nexterp.in/nlp/fonts/mgs/mgs.svg?feeqdv#mgs') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

i[class^="mgs-"], i[class*=" mgs-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'mgs' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.mgs-ic_physicalbook:before {
  content: "\e93a";
}
.mgs-ic_swf:before {
  content: "\e927";
}
.mgs-ic_questionassessment:before {
  content: "\e928";
}
.mgs-ic_questions:before,
.mgs-ic_question:before {
  content: "\e929";
}
.mgs-ic_assessmentlibrary:before,
.mgs-ic_assessment:before {
  content: "\e92a";
}
.mgs-ic_addquestion:before {
  content: "\e92b";
}
.mgs-ic_adaptiveassessment:before,
.mgs-ic_adaptiveassessments:before {
  content: "\e92c";
}
.mgs-ic_standardassessments:before {
  content: "\e92d";
}
.mgs-ic_experiments:before {
  content: "\e92e";
}
.mgs-ic_examples:before {
  content: "\e92f";
}
.mgs-ic_summativeassessments:before {
  content: "\e930";
}
.mgs-ic_formativeassessments:before,
.mgs-ic_formativeassessment:before {
  content: "\e931";
}
.mgs-ic_explanations:before {
  content: "\e932";
}
.mgs-ic_integratedprojects:before {
  content: "\e933";
}
.mgs-ic_samples:before {
  content: "\e934";
}
.mgs-ic_beyondbook:before {
  content: "\e935";
}
.mgs-ic_quickcheck:before {
  content: "\e936";
}
.mgs-ic_textbookanswerkeys:before {
  content: "\e937";
}
.mgs-ic_teachermanual:before,
.mgs-ic_teachermanuals:before {
  content: "\e938";
}
.mgs-ic_questionbank:before {
  content: "\e939";
}

.mgs-ic_3d:before {
  content: "\e917";
}
.mgs-ic_attachment:before {
  content: "\e918";
}
.mgs-ic_coursebook:before {
  content: "\e919";
}
.mgs-ic_LTI:before {
  content: "\e91a";
}
.mgs-ic_note:before {
  content: "\e91b";
}
.mgs-ic_notebook:before {
  content: "\e91c";
}
.mgs-ic_others:before {
  content: "\e91d";
}
.mgs-ic_page:before {
  content: "\e91e";
}
.mgs-ic_post:before {
  content: "\e91f";
}
.mgs-ic_practicalgeometry:before {
  content: "\e920";
}
.mgs-ic_qrcode:before {
  content: "\e921";
}
.mgs-ic_resource:before,
.mgs-ic_externalresource:before {
  content: "\e922";
}
.mgs-ic_teachernote:before {
  content: "\e923";
}
.mgs-ic_testlet:before {
  content: "\e924";
}
.mgs-ic_whoteboard:before {
  content: "\e925";
}
.mgs-ic_zip:before {
  content: "\e926";
}

.mgs-ic_activity:before {
  content: "\e900";
}
.mgs-ic_assessments:before {
  content: "\e901";
}
.mgs-ic_assignment:before {
  content: "\e902";
}
.mgs-ic_audio:before {
  content: "\e903";
}
.mgs-ic_captivate:before {
  content: "\e904";
}
.mgs-ic_collection:before,
.mgs-ic_collections:before {
  content: "\e905";
}
.mgs-ic_document:before,
.mgs-ic_doc:before,
.mgs-ic_docx:before {
  content: "\e906";
}
.mgs-ic_ebook:before,
.mgs-ic_ebook_complete:before,
.mgs-ic_bookresource:before {
  content: "\e907";
}
.mgs-ic_embed:before {
  content: "\e908";
}
.mgs-ic_excercises:before,
.mgs-ic_exercisetemplate:before {
  content: "\e909";
}
.mgs-ic_html:before {
  content: "\e90a";
}
.mgs-ic_image:before {
  content: "\e90b";
}
.mgs-ic_mixed:before {
  content: "\e90c";
}
.mgs-ic_module:before {
  content: "\e90d";
}
.mgs-ic_moduletemplete:before,
.mgs-ic_moduletemplate:before {
  content: "\e90e";
}
.mgs-ic_pdf:before {
  content: "\e90f";
}
.mgs-ic_presentation:before,
.mgs-ic_ppt:before {
  content: "\e910";
}
.mgs-ic_scorm:before {
  content: "\e911";
}
.mgs-ic_spreadsheet:before {
  content: "\e912";
}
.mgs-ic_video:before,
.mgs-ic_livelecture:before {
  content: "\e913";
}
.mgs-ic_webreferences:before,
.mgs-ic_webreference:before {
  content: "\e914";
}
.mgs-ic_wiki:before,
.mgs-ic_k-12_wiki:before {
  content: "\e915";
}
.mgs-ic_worksheet:before {
  content: "\e916";
}
/*** ----- Resources font icons End--------*****/

/*** New Resource color styles ***/
.mgsresource_color_activity,
.mgsresource_color_integratedprojects {
  color: #8E9BFF !important;
}
.mgsresource_bg_activity,
.mgsresource_bg_integratedprojects {
  background: #8E9BFF1F !important;
}
.mgsresource_darkbg_activity,
.mgsresource_darkbg_integratedprojects {
  background: #8E9BFF !important;
}
.msgborder_color_activity,
.msgborder_color_integratedprojects {
  border-color: #8E9BFF !important;
}

.mgsresource_color_video,
.mgsresource_color_livelecture {
  color: #E25A5A !important;
}
.mgsresource_bg_video,
.mgsresource_bg_livelecture {
  background: #E25A5A1F !important;
}
.mgsresource_darkbg_video,
.mgsresource_darkbg_livelecture {
  background: #E25A5A !important;
}
.msgborder_color_video,
.msgborder_color_livelecture {
  border-color: #E25A5A !important;
}

.mgsresource_color_audio,
.mgsresource_color_swf,
.mgsresource_color_whiteboard {
  color: #8E9BFF !important;
}
.mgsresource_bg_audio,
.mgsresource_bg_swf,
.mgsresource_bg_whiteboard {
  background: #8E9BFF1F !important;
}
.mgsresource_darkbg_audio,
.mgsresource_darkbg_swf,
.mgsresource_darkbg_whiteboard {
  background: #8E9BFF !important;
}
.msgborder_color_audio,
.msgborder_color_swf,
.msgborder_color_whiteboard {
  border-color: #8E9BFF !important;
}

.mgsresource_color_scorm,
.mgsresource_color_formativeassessments,
.mgsresource_color_formativeassessment {
  color: #4C8FD2 !important;
}
.mgsresource_bg_scorm,
.mgsresource_bg_formativeassessments,
.mgsresource_bg_formativeassessment {
  background: #4C8FD21F !important;
}
.mgsresource_darkbg_scorm,
.mgsresource_darkbg_formativeassessments,
.mgsresource_darkbg_formativeassessment {
  background: #4C8FD2 !important;
}
.msgborder_color_scorm,
.msgborder_color_formativeassessments,
.mgsresource_color_formativeassessment {
  border-color: #4C8FD2 !important;
}

.mgsresource_color_assignment,
.mgsresource_color_physicalbook,
.mgsresource_color_note,
.mgsresource_color_samples {
  color: #7159B4 !important;
}
.mgsresource_bg_assignment,
.mgsresource_bg_physicalbook,
.mgsresource_bg_note,
.mgsresource_bg_samples {
  background: #7159B41F !important;
}
.mgsresource_darkbg_assignment,
.mgsresource_darkbg_physicalbook,
.mgsresource_darkbg_note,
.mgsresource_darkbg_samples {
  background: #7159B4 !important;
}
.msgborder_color_assignment,
.msgborder_color_physicalbook,
.msgborder_color_note,
.msgborder_color_samples {
  border-color: #7159B4 !important;
}

.mgsresource_color_document,
.mgsresource_color_doc,
.mgsresource_color_docx,
.mgsresource_color_coursebook,
.mgsresource_color_worksheet,
.mgsresource_color_summativeassessments {
  color: #1DB597 !important;
}
.mgsresource_bg_document,
.mgsresource_bg_doc,
.mgsresource_bg_docx,
.mgsresource_bg_coursebook,
.mgsresource_bg_worksheet,
.mgsresource_bg_summativeassessments {
  background: #1DB5971F !important;
}
.mgsresource_darkbg_document,
.mgsresource_darkbg_doc,
.mgsresource_darkbg_docx,
.mgsresource_darkbg_coursebook,
.mgsresource_darkbg_worksheet,
.mgsresource_darkbg_summativeassessments {
  background: #1DB597 !important;
}
.msgborder_color_document,
.msgborder_color_doc,
.msgborder_color_docx,
.msgborder_color_coursebook,
.msgborder_color_worksheet,
.msgborder_color_summativeassessments {
  border-color: #1DB597 !important;
}

.mgsresource_color_wiki,
.mgsresource_color_zip,
.mgsresource_color_beyondbook {
  color: #FF65E3 !important;
}
.mgsresource_bg_wiki,
.mgsresource_bg_zip,
.mgsresource_bg_beyondbook {
  background: #FF65E31F !important;
}
.mgsresource_darkbg_wiki,
.mgsresource_darkbg_zip,
.mgsresource_darkbg_beyondbook {
  background: #FF65E3 !important;
}
.msgborder_color_wiki,
.msgborder_color_zip,
.msgborder_color_beyondbook {
  border-color: #FF65E3 !important;
}

.mgsresource_color_collection,
.mgsresource_color_collections,
.mgsresource_color_post {
  color: #A17947 !important;
}
.mgsresource_bg_collection,
.mgsresource_bg_collections,
.mgsresource_bg_post {
  background: #A179471F !important;
}
.mgsresource_darkbg_collection,
.mgsresource_darkbg_collections,
.mgsresource_darkbg_post {
  background: #A17947 !important;
}
.msgborder_color_collection,
.msgborder_color_collections,
.msgborder_color_post {
  border-color: #A17947 !important;
}



.mgsresource_color_embed,
.mgsresource_color_others {
  color: #ED993E !important;
}
.mgsresource_bg_embed,
.mgsresource_bg_others {
  background: #ED993E1F !important;
}
.mgsresource_darkbg_embed,
.mgsresource_darkbg_others {
  background: #ED993E !important;
}
.msgborder_color_embed,
.msgborder_color_others {
  border-color: #ED993E !important;
}

.mgsresource_color_activities,
.mgsresource_color_testlet,
.mgsresource_color_moduletemplate,
.mgsresource_color_standardassessments{
  color: #61B86E !important;
}
.mgsresource_bg_activities,
.mgsresource_bg_testlet,
.mgsresource_bg_moduletemplate,
.mgsresource_bg_standardassessments {
  background: #61B86E1F !important;
}
.mgsresource_darkbg_activities,
.mgsresource_darkbg_testlet,
.mgsresource_darkbg_moduletemplate,
.mgsresource_darkbg_standardassessments {
  background: #61B86E !important;
}
.msgborder_color_activities,
.msgborder_color_testlet,
.msgborder_color_moduletemplate,
.msgborder_color_standardassessments {
  border-color: #61B86E !important;
}

.mgsresource_color_web,
.mgsresource_color_webreference,
.mgsresource_color_lti,
.mgsresource_color_captivate {
  color: #C1A31E !important;
}
.mgsresource_bg_web,
.mgsresource_bg_webreference,
.mgsresource_bg_lti,
.mgsresource_bg_captivate {
  background: #C1A31E1F !important;
}
.mgsresource_darkbg_web,
.mgsresource_darkbg_webreference,
.mgsresource_darkbg_lti,
.mgsresource_darkbg_captivate {
  background: #C1A31E !important;
}
.msgborder_color_web,
.msgborder_color_webreference,
.msgborder_color_lti,
.msgborder_color_captivate {
  border-color: #C1A31E !important;
}

.mgsresource_color_ebook,
.mgsresource_color_qrcode,
.mgsresource_color_quickcheck,
.mgsresource_color_question,
.mgsresource_color_questions {
  color: #09BDFB !important;
}
.mgsresource_bg_ebook,
.mgsresource_bg_qrcode,
.mgsresource_bg_quickcheck,
.mgsresource_bg_question,
.mgsresource_bg_questions,
.mgsresource_bg_ebook_complete,
.mgsresource_bg_bookresource {
  background: #D2F3FF1F !important;
}
.mgsresource_darkbg_ebook,
.mgsresource_darkbg_qrcode,
.mgsresource_darkbg_quickcheck,
.mgsresource_darkbg_question,
.mgsresource_darkbg_questions,
.mgsresource_darkbg_ebook_complete,
.mgsresource_darkbg_bookresource {
  background: #09BDFB !important;
}
.msgborder_color_ebook,
.msgborder_color_qrcode,
.msgborder_color_quickcheck,
.msgborder_color_question,
.msgborder_color_questions,
.msgborder_color_ebook_complete,
.msgborder_color_bookresource{
  border-color: #09BDFB !important;
}

.mgsresource_color_exercisetemplate,
.mgsresource_color_exercise,
.mgsresource_color_notebook {
  color: #818181 !important;
}
.mgsresource_bg_exercisetemplate,
.mgsresource_bg_exercise,
.mgsresource_bg_notebook {
  background: #8181811F !important;
}
.mgsresource_darkbg_exercisetemplate,
.mgsresource_darkbg_exercise,
.mgsresource_darkbg_notebook {
  background: #818181 !important;
}
.msgborder_color_exercisetemplate,
.msgborder_color_exercise,
.msgborder_color_notebook {
  border-color: #818181 !important;
}

.mgsresource_color_html,
.mgsresource_color_resource,
.mgsresource_color_externalresource,
.mgsresource_color_module,
.mgsresource_color_experiments {
  color: #9C35F6 !important;
}
.mgsresource_bg_html,
.mgsresource_bg_resource,
.mgsresource_bg_externalresource,
.mgsresource_bg_module,
.mgsresource_bg_experiments {
  background: #9C35F61F !important;
}
.mgsresource_darkbg_html,
.mgsresource_darkbg_resource,
.mgsresource_darkbg_externalresource,
.mgsresource_darkbg_module,
.mgsresource_darkbg_experiments {
  background: #9C35F6 !important;
}
.msgborder_color_html,
.msgborder_color_resource,
.msgborder_color_externalresource,
.msgborder_color_module,
.msgborder_color_experiments {
  border-color: #9C35F6 !important;
}

.mgsresource_color_assessments,
.mgsresource_color_assessment,
.mgsresource_color_practicalgeometry,
.mgsresource_color_mixed,
.mgsresource_color_adaptiveassessments,
.mgsresource_color_adaptiveassessment {
  color: #76A512 !important;
}
.mgsresource_bg_assessments,
.mgsresource_bg_assessment,
.mgsresource_bg_practicalgeometry,
.mgsresource_bg_mixed,
.mgsresource_bg_adaptiveassessments,
.mgsresource_bg_adaptiveassessment {
  background: #76A5121F !important;
}
.mgsresource_darkbg_assessments,
.mgsresource_darkbg_assessment,
.mgsresource_darkbg_practicalgeometry,
.mgsresource_darkbg_mixed,
.mgsresource_darkbg_adaptiveassessments,
.mgsresource_darkbg_adaptiveassessment {
  background: #76A512 !important;
}
.msgborder_color_assessments,
.msgborder_color_assessment,
.msgborder_color_practicalgeometry,
.msgborder_color_mixed,
.msgborder_color_adaptiveassessments,
.msgborder_color_adaptiveassessment {
  border-color: #76A512 !important;
}

.mgsresource_color_explanations {
  color: #9C35F6 !important;
}
.mgsresource_bg_explanations {
  background: #96d53e1f !important;
}
.mgsresource_darkbg_explanations {
  background: #9C35F6 !important;
}
.msgborder_color_explanations {
  border-color: #9C35F61F !important;
}

.mgsresource_color_examples {
  color: #C1A31E !important;
}
.mgsresource_bg_examples {
  background: #C1A31E1F !important;
}
.mgsresource_darkbg_examples {
  background: #C1A31E !important;
}
.msgborder_color_examples {
  border-color: #C1A31E !important;
}

.mgsresource_color_audiovideo {
  color: #2ca4e0 !important;
}
.mgsresource_bg_audiovideo {
  background: #2ca4e01f !important;
}
.mgsresource_darkbg_audiovideo {
  background: #2ca4e0 !important;
}
.msgborder_color_audiovideo{
  border-color: #2ca4e0 !important;
}

.mgsresource_color_jpg,
.mgsresource_color_png,
.mgsresource_color_jpeg  {
  color: #4C8FD2 !important;
}
.mgsresource_color_jpg.custom-jpg-color {
	color: #4C8FD2 !important;
}
.mgsresource_bg_jpg,
.mgsresource_bg_png,
.mgsresource_bg_jpeg {
  background: #4C8FD21F !important;
}
.mgsresource_darkbg_jpg,
.mgsresource_darkbg_png,
.mgsresource_darkbg_jpeg {
  background: #4C8FD2 !important;
}
.msgborder_color_jpg,
.msgborder_color_png,
.msgborder_color_jped {
  border-color: #4C8FD2 !important;
}

.mgsresource_color_image,
.mgsresource_color_teachernote {
  color: #4C8FD2 !important;
}
.mgsresource_bg_image,
.mgsresource_bg_teachernote {
	background: #4C8FD21F !important;
}
.mgsresource_darkbg_image,
.mgsresource_darkbg_teachernote {
	background: #4C8FD2 !important;
}
.msgborder_color_image,
.msgborder_color_teachernote {
  border-color: #4C8FD2 !important;
}

.mgsresource_color_ppt {
  color: #806eda !important;
}
.mgsresource_bg_ppt {
  background: #806eda1f !important;
}
.mgsresource_darkbg_ppt {
  background: #806eda !important;
}
.msgborder_color_ppt {
  border-color: #806eda !important;
}

.mgsresource_color_presentation,
.mgsresource_color_3d,
.mgsresource_color_teachermanual,
.mgsresource_color_teachermanuals,
.mgsresource_color_assessmentlibrary,
.mgsresource_color_assessment {
  color: #C5AE00 !important;
}
.mgsresource_bg_presentation,
.mgsresource_bg_3d,
.mgsresource_bg_teachermanual,
.mgsresource_bg_teachermanuals,
.mgsresource_bg_assessmentlibrary,
.mgsresource_bg_assessment {
  background: #C5AE001F !important;
}
.mgsresource_darkbg_presentation,
.mgsresource_darkbg_3d,
.mgsresource_darkbg_teachermanual,
.mgsresource_darkbg_teachermanuals,
.mgsresource_darkbg_assessmentlibrary,
.mgsresource_darkbg_assessment {
  background: #C5AE00 !important;
}
.msgborder_color_presentation,
.msgborder_color_3d,
.msgborder_color_teachermanual,
.msgborder_color_teachermanuals,
.msgborder_color_assessmentlibrary,
.msgborder_color_assessment {
  border-color: #C5AE00 !important;
}

.mgsresource_color_pdf,
.mgsresource_color_page {
  color: #EC0400!important;
}
.mgsresource_bg_pdf,
.mgsresource_bg_page {
  background: #EC04001F !important;
}
.mgsresource_darkbg_pdf,
.mgsresource_darkbg_page {
  background: #EC0400 !important;
}
.msgborder_color_pdf,
.msgborder_color_page {
  border-color: #EC0400 !important;
}

.mgsresource_color_spreadsheet,
.mgsresource_color_xlsx,
.mgsresource_color_attachment,
.mgsresource_color_xls,
.mgsresource_color_questionbank,
.mgsresource_color_addquestion {
  color: #718B9A !important;
}
.mgsresource_bg_spreadsheet,
.mgsresource_bg_xlsx,
.mgsresource_bg_attachment,
.mgsresource_bg_xls,
.mgsresource_bg_questionbank,
.mgsresource_bg_addquestion {
  background: #718B9A1F !important;
}
.mgsresource_darkbg_spreadsheet,
.mgsresource_darkbg_xlsx,
.mgsresource_darkbg_attachment,
.mgsresource_darkbg_xls,
.mgsresource_darkbg_questionbank,
.mgsresource_darkbg_addquestion {
  background: #718B9A !important;
}
.msgborder_color_spreadsheet,
.msgborder_color_xlsx,
.msgborder_color_attachment,
.msgborder_color_xls,
.msgborder_color_questionbank,
.msgborder_color_addquestion {
  border-color: #718B9A !important;
}

.mgsresource_color_notebook {
  color: #806eda !important;
}
.mgsresource_bg_notebook {
  background: #806eda1f !important;
}
.mgsresource_darkbg_notebook {
  background: #806eda !important;
}
.msgborder_color_notebook {
  border-color: #806eda !important;
}

.mgsresource_color_practicetest,
.mgsresource_color_knowledgestateassessment {
  color: #f29c47 !important;
}
.mgsresource_bg_practicetest {
  background: #f29c47 !important;
}
.mgsresource_darkbg_practicetest {
  background: #f29c47 !important;
}
.msgborder_color_assessment {
  border-color: #f29c471f !important;
}
.msgborder_color_practicetest {
  border-color: #f29c47 !important;
}

.mgsresource_color_homework {
  color: #4f9be4;
}
.mgsresource_bg_homework {
  background: #4f9be41f !important;
}
.mgsresource_darkbg_homework {
  background: #4f9be4 !important;
}
.msgborder_color_homework {
  border-color: #4f9be4 !important;
}


.mgsresource_color_activityquestion {
  color: #0ABDFB !important;
}
.mgsresource_bg_activityquestion {
  background: #0ABDFB1f !important;
}
.mgsresource_darkbg_activityquestion {
  background: #0ABDFB !important;
}
.msgborder_color_activityquestion {
  border-color: #0ABDFB !important;
}

.mgsresource_color_embed {
  color: #ED993F !important;
}
.mgsresource_bg_embed {
  background: #ED993F1f !important;
}
.mgsresource_darkbg_embed {
  background: #ED993F !important;
}
.msgborder_color_embed {
  border-color: #ED993F !important;
}

.mgsresource_color_classroomactivity {
  color: #62B86E !important;
}
.mgsresource_bg_classroomactivity {
  background: #62B86E1f !important;
}
.mgsresource_darkbg_classroomactivity {
  background: #62B86E !important;
}
.msgborder_color_classroomactivity {
  border-color: #62B86E !important;
}

.mgsresource_color_svn {
  color: #A358D6 !important;
}
.mgsresource_bg_svn {
  background: #A358D61f !important;
}
.mgsresource_darkbg_svn {
  background: #A358D6 !important;
}
.msgborder_color_svn {
  border-color: #A358D6 !important;
}

.mgsresource_color_s3 {
  color: #46C380 !important;
}
.mgsresource_bg_s3 {
  background: #46C3801f !important;
}
.mgsresource_darkbg_s3 {
  background: #46C380 !important;
}
.msgborder_color_s3 {
  border-color: #46C380 !important;
}

.msgdarkborder_question{
	border: 1px solid #718B9A !important;
}
.msgdarkborder_activityquestion{
	border: 1px solid #0ABDFB !important;
}
.msgdarkborder_assessment{
	border: 1px solid #C5AE00 !important;
}
.msgdarkborder_exercisetemplate{
	border: 1px solid #818181 !important;
}
.msgdarkborder_activity{
	border: 1px solid #8E9BFF !important;
}
.msgdarkborder_wiki{
	border: 1px solid #FF65E3 !important;
}
.msgdarkborder_html{
	border: 1px solid #9C35F6 !important;
}
.msgdarkborder_embed{
	border: 1px solid #ED993F !important;
}
.msgdarkborder_webrefrence{
	border: 1px solid #C1A31E !important;
}
.msgdarkborder_classroomactivity {
	border: 1px solid #62B86E !important;
}

.mgsresource_darkbg_quiz {
	background: #9d85e7;
}
.mgsresource_color_s3 {
  color: #9d85e7 !important;
}
.mgsresource_bg_quiz {
  background: #9d85e71f !important;
}
.msgborder_color_quiz {
  border-color: #9d85e7 !important;
}

ul.resourcesList li{
	padding: 0 20px;
	height: 48px;
	cursor: pointer;
	position: relative;
	border-bottom: solid 1px #0000001A;
	cursor: pointer;
}
ul.resourcesList li .courseplanresourcetype,
.resources-box  {
	width: 32px;
	height: 32px;
	min-width: 32px;
	background: #38D04F;
	border-radius: 50%;
	text-align: center;
	margin-right: 16px;
	border: 1px solid transparent;
	display: flex;
    align-items: center;
    justify-content: center;
}
ul.resourcesList li .courseplanresourcetype i,
ul.resourcesList li .resourcetype i {
	font-size: 18px;
    line-height: 32px;
    margin: 0;
}
ul.resourcesList .md-button {
  min-width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 0;
  border-radius: 0px;
  border-left: 5px solid transparent;
}
ul.resourcesList li .md-button{
	min-width: 68px;
}
ul.resourcesList li.recourceActive{
	background: rgba(129,178,20,0.07);
}
/* ul.resourcesList i[class*=lms-] {
  color: rgba(0, 0, 0, 0.54) !important;
} */
ul.resourcesList li.recourceActive .resourceCount,
ul.resourcesList li.recourceActive label {
	color: var(--trinity-text-color);
	font-weight: 600;
}
ul.resourcesList li i{
	font-size: 16px;
	margin-right: 8px;
	/* color: rgba(0,0,0,0.57); */
}
ul.resourcesList li label{
	font-size: var(--default-fontsize);
}
ul.resourcesList li .resourceCount{
	font-size: var(--default-fontsize);
	font-weight: 600;
}

/* Management Tag model popup common style */
md-dialog.managetags .md-toolbar-tools {
    min-height: 60px;
}
.tag-header{
	padding: 10px 24px;
	box-shadow: 0px 3px 6px #0000000F;
}
.tag-content{
	padding: 16px 24px 8px;
	background: #fff;
    box-shadow: inset 0px 3px 6px #0000000f;
    border-top: 1px solid #CACACA;
}
.tag-data {
    box-shadow: 0px 4px 8px #0000000A;
    border: 1px solid #CACACA;
    height: 112px;
    border-radius: 6px;
    padding: 12px 0;
    margin-bottom: 8px;
    background: #FBFBFB;
}
.tag-data:first-child {
    margin-top: 8px;
}
.tag-types {
    background: #E0E0E0;
    border: 1px solid #CACACA;
    border-radius: 0px 24px 24px 0px;
    padding: 12px 8px;
    margin-right: 20px;
    vertical-align: top;
    border-left: 0;
}

.tag-data-left {
	position: relative;
	min-width: 230px;
    max-width: 230px;	
}
.tag-data-left h3 {
    font-size: 16px;
}
.tag-data-text {
    width: calc(100% - 70px);
}
.tag-data-left::after {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    border-left: solid 1px #CACACA;
    height: 100%;
}
.tag-values {
    padding: 12px 0 0 12px;
}

.tag-values span {
    min-width: 60px;
    border: 1px solid #CACACA;
    border-radius: 2px;
    color: #1492E6;
    justify-content: center;
    font-size: 10px;
    padding: 2px;
    max-width: 60px;
    display: flex;
}
.tag-values span.mandatory {
    color: #F2711C;
    background: #FFECE2 0% 0% no-repeat padding-box;
    border: 1px solid #F2711C;
    border-radius: 2px;
    margin-left: 8px;
}
.tag-data-right {
	padding: 0 25px;
}
.active-tag {
    border: 1px solid var(--primary-bg-color) !important;
    background: rgba(var(--primarybgcolorlight), 0.161) !important;
}
.custom-hwc-chips {
	display: block;
	max-height: 65px;
}

.custom-hwc-chips ul {
	padding: 0;
	margin: 0 auto 0px;
}

.custom-hwc-chips ul li {
	vertical-align: middle;
	display: inline-flex;
	padding: 2px 5px 2px 10px;
	border: solid 1px var(--green-text);
	margin: 4px;
	max-width: 200px;
	text-transform: capitalize;
	line-height: 20px;
	background: #E4EFCB;
	border-radius: 83px;
}

.custom-hwc-chips ul li .tag-name {
	padding-right: 5px;
	width: calc(100% - 20px);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-transform: capitalize;
	margin-bottom: 0 !important;
	font-weight: 500;
}

.custom-hwc-chips .md-button.md-icon-button {
	height: inherit;
	min-height: inherit;
	width: 16px;
	min-width: inherit;
	line-height: inherit;
}

.custom-hwc-chips .md-button.md-icon-button md-icon {
	height: inherit;
	min-height: inherit;
	width: inherit;
	min-width: inherit;
	line-height: inherit;
	font-size: 18px !important;
	color: var(--primary-bg-color);
}

.manage-tags-count {
    width: 46px;
    padding: 0;
    margin-right: 10px;
    background: #ECF0F3;
    border: 2px solid #707070;
    border-radius: 0px 4px 4px 0px;
    min-width: 46px;
    min-height: 27px;
    padding-right: 6px;
    border-left: 0;
    height: 27px;
    overflow: unset;
    padding-left: 0;
    position: relative;
    display: flex;
    justify-content: right;
    align-items: center;
    margin-left: 8px;
}
.manage-tags-count md-icon {
    position: absolute;
    left: -15px;
    top: 0px;
    z-index: 1;
    margin: auto;
    bottom: 0;
    width: 32px;
    height: 28px;
}
.manage-tags-count span {
    vertical-align: top;
    line-height: 16px;
    font-size: 16px;
    font-weight: 700;
}
.tag-btn-action {
    box-shadow: 0px 2px 12px #00000014;
    z-index: 2;
}

.tag-manage-search {
	border-radius: 8px;
	position: relative;
}
.tag-manage-search md-select md-select-value {
    border: none !important;
    padding: 3px 12px 5px 12px !important;
}
.tag-manage-search md-select md-select-value .md-text {
    display: flex !important;
    align-items: center;
}
.tag-manage-search md-select {
    background-color: #E2A5000F;
    color: #212121;
    position: relative;
    border: solid 1px #E2A500;
    border-radius: 6px 0px 0px 6px;
}
.tag-manage-search md-input-container {
    padding: 0 !important;
    min-width: 204px;
    font-size: var(--default-font14);
    line-height: 20px;
}
.tag-manage-search md-autocomplete {
    height: 36px;
    border-radius: 8px;
    border: 1px solid #CACACA;
}
.tag-manage-search md-autocomplete-wrap {
    height: 36px;
    box-shadow: none;
}
.tag-manage-search md-autocomplete-wrap input {
    height: 36px;
    padding-left: 36px;
    z-index: 1;
}
.tag-manage-search .searchIcon {
	position: absolute;
	left: 10px;
    z-index: 1;
    bottom: 0;
    top: 0;
}
.viewChapters .md-button.tabgBtn {
    border-radius: 8px;
    text-transform: capitalize;
    height: 36px;
    min-height: 36px;
}
.manage-tags-count.smTag {
    width: 36px;
    min-width: 36px;
    min-height: 22px;
    height: 22px;
    border-width: 1px;
}
.manage-tags-count.smTag md-icon {
    width: 22px;
    height: 22px;
}

.manage-tags-count.smTag md-icon svg path {
    fill: #707070;
}
.manageTags{
	height: auto;
    min-height: auto !important;
    overflow: unset !important;
}
.tagsListView {
	display: inline-block;
    width: 100%;
}
.tagsListView strong {
    width: max-content;
}
.tabContent {
	margin: 6px;
    display: inline-block;
}
.advanced-search-section .tag-manage-search{
	margin-top: 6px;
    margin-bottom: 8px;
}
.advanced-search-section .tag-manage-search md-autocomplete {
    height: 40px;
    border-radius: 5px;
}
.advanced-search-section .tag-manage-search md-autocomplete-wrap {
    height: 40px;
}
.advanced-search-section .tag-manage-search md-autocomplete-wrap input {
    height: 40px;
}
.display-value > span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 48px;
}
.md-dialog-is-showing.bcs-dialog .md-select-menu-container.md-active, 
.md-dialog-is-showing.bcs-dialog md-backdrop.md-select-backdrop {
    z-index: 103;
}
.md-dialog-is-showing.bcs-dialog .md-dialog-backdrop ~ .md-dialog-backdrop {
    z-index: 102;
}
.md-dialog-is-showing.bcs-dialog > .md-dialog-container ~ .md-dialog-container {
    z-index: 102;
}
.custom-bcs-section {
    border: 1px solid var(--legend-border);
    padding-left: 8px;
    padding-bottom: 5px;
    border-radius: 5px;
    min-height: 40px;
    cursor: pointer;
    position: relative;
    padding-right: 5px;
}
/* .tableOutSideSpace {
    margin: 24px 24px 0;
}
.tableOutSideSpace .add-wrap {
    padding: 15px;
} */
.progressConfigurationDetails md-input-container.custom-input-field.md-input-focused label:not(.md-no-float), 
.progressConfigurationDetails md-input-container.custom-input-field.md-input-has-placeholder label:not(.md-no-float), 
.progressConfigurationDetails md-input-container.custom-input-field.md-input-has-value label:not(.md-no-float),
.progressConfigurationDetails md-input-container.custom-input-field .md-placeholder, 
.progressConfigurationDetails .custom-date md-input-container.custom-input-field .md-placeholder, 
.progressConfigurationDetails md-input-container.custom-input-field label:not(.md-no-float):not(.md-container-ignore), 
.progressConfigurationDetails .custom-date md-input-container.custom-input-field label:not(.md-no-float):not(.md-container-ignore),
.progressConfigurationDetails .custom-date.custom-input-field mdp-date-picker md-input-container label, 
.progressConfigurationDetails .custom-time.custom-input-field mdp-time-picker md-input-container label,
.progressConfigurationDetails .navigationheader-legend p {
    background: var(--mainbg);
}
.add-wrap .md-button.md-icon-button i,
.add-wrap md-icon.md-green-theme.md-primary,
.md-expand-icon .md-button.md-green-theme.md-primary md-icon, 
.add-wrap md-icon.md-green-theme,
.icon-img md-icon,
.coursemobilesearch md-icon,
.lmslibrary .contentView .md-button.md-green-theme.md-primary .lms-ic_lmsadd-to-session, 
.md-button md-icon.sm-icon,
.custom-input-field .date-range-icon,
.navigationheader-legend mdp-date-picker .md-button md-icon,
.navigationheader-legend mdp-time-picker .md-button md-icon,
md-icon.md-green-theme,
.md-button.md-green-theme.md-primary md-icon,
.md-button.md-green-theme.md-primary:not([disabled]) md-icon,
md-icon.md-green-theme.md-primary,
.button i {
    color: var(--iconcolor);
}
.resourceFixedBtn .md-button.md-green-theme.md-primary.md-fab md-icon {
    color: #ffffff !important;
}

/* /=================== Loader CSS Starts: ===================/ */
.dot-windmill                                 { width: 10px; height: 10px; border-radius: 5px; background-color: var(--primary-bg-color); transform-origin: 5px 15px; -webkit-transform-origin: 5px 15px; animation: dotWindmill 2s infinite linear; -webkit-animation: dotWindmill 2s infinite linear; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); position: absolute; top: 50%; left: 50%; z-index: 10; } 
.dot-windmill::before, .dot-windmill::after { content: ''; width: 10px; height: 10px; border-radius: 5px; background-color: var(--primary-bg-color); display: inline-block; position: absolute; top: 15px;  } 
.dot-windmill::before                         { left: -8.66px; } 
.dot-windmill::after                         { left: 8.66px; } 
@keyframes dotWindmill                         { 0% { transform: rotateZ(0deg) translate3d(0, 0, 0); -webkit-transform: rotateZ(0deg) translate3d(0, 0, 0); } 100% { transform: rotateZ(720deg) translate3d(0, 0, 0); -webkit-transform: rotateZ(720deg) translate3d(0, 0, 0); } }
@-webkit-keyframes dotWindmill                 { 0% { transform: rotateZ(0deg) translate3d(0, 0, 0); -webkit-transform: rotateZ(0deg) translate3d(0, 0, 0); } 100% { transform: rotateZ(720deg) translate3d(0, 0, 0); -webkit-transform: rotateZ(720deg) translate3d(0, 0, 0); } }
/* /=================== Loader CSS Ends: ===================/ */

/* Dot Pulse Loader Starts */
.dot-pulse {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: var(--primary-bg-color);
    color: var(--primary-bg-color);
    box-shadow: 9999px 0 0 -5px;
    animation: dot-pulse 1.5s infinite linear;
    animation-delay: 0.25s;
  }
  .dot-pulse::before, .dot-pulse::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: var(--primary-bg-color);
    color: var(--primary-bg-color);
  }
  .dot-pulse::before {
    box-shadow: 9984px 0 0 -5px;
    animation: dot-pulse-before 1.5s infinite linear;
    animation-delay: 0s;
  }
  .dot-pulse::after {
    box-shadow: 10014px 0 0 -5px;
    animation: dot-pulse-after 1.5s infinite linear;
    animation-delay: 0.5s;
  }
  
  @keyframes dot-pulse-before {
    0% {
      box-shadow: 9984px 0 0 -5px;
    }
    30% {
      box-shadow: 9984px 0 0 2px;
    }
    60%, 100% {
      box-shadow: 9984px 0 0 -5px;
    }
  }
  @keyframes dot-pulse {
    0% {
      box-shadow: 9999px 0 0 -5px;
    }
    30% {
      box-shadow: 9999px 0 0 2px;
    }
    60%, 100% {
      box-shadow: 9999px 0 0 -5px;
    }
  }
  @keyframes dot-pulse-after {
    0% {
      box-shadow: 10014px 0 0 -5px;
    }
    30% {
      box-shadow: 10014px 0 0 2px;
    }
    60%, 100% {
      box-shadow: 10014px 0 0 -5px;
    }
  }
/* Dot Pulse Loader Ends */


/* End */


/*start report card Grouping  */
.report-cards-grouping-main{
	padding:12px 24px;
	background:#ffffff;
}
.left-menu-reports {
	background: #DEE3F2;   
	padding: 16px 0px 0;
	width: 20%;
}
/* .report-card-grouping-list{
	background:#FBFCFF;
} */
.report-card-grouping-list .bookmark-section{
	background:#DEE3F3;
	padding:10px 20px;
}
.report-card-grouping-list .bookmark-section md-icon{
	font-size: 26px !important;
	line-height: 21px;
}
.md-report-headline{
	font-size: var(--default-font14);
	line-height:20px;
}
.left-menu-reports md-list md-list-item{
	padding: 0px;
}
.left-menu-reports md-list md-list-item .left-menu-report-list{
   	text-decoration: none;
    padding: 8px 15px;
    font-weight: 500;
    font-size: var(--default-font14);
     cursor: pointer;
    color: rgba(0,0,0,.87);
}

.reports-heading{
	padding-bottom:4px;
	font-size:16px;
	font-weight:bold;
}
.reports-sub-heading{
	padding-bottom: 16px;
	font-size:12px;
	line-height: 16px;
	color:#737373;
}
.report-md-input {
    height: 36px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: var(--shadow-container-u50cb8, 0 1px 1px 0 rgba(0, 28, 36, .3), 1px 1px 1px 0 rgba(0, 28, 36, .15), -1px 1px 1px 0 rgba(0, 28, 36, .15));
    border: none !important;
    border-top: 1px solid #c4ced6 !important;
    border-radius: 36px;
    max-width: 436px;
    position: relative;
    overflow: hidden;
}

.report-md-input input {
    border: none;
    width: 100%;
    height: 100%;
    background: none;
    padding: 0 40px;
    box-sizing: border-box;
}

.report-md-input .search-icon {
    position: absolute;
    left: 12px;
    top: 0;
    bottom: 0;
    margin: auto;
}
.report-md-input .close-icon {
    position: absolute;
    right: 12px;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 1;
    cursor: pointer;
}
.active-report{
	color: var(--primary-bg-color) !important;
	position:relative;
}
.feeCards-active-report{
	/* color: var(--primary-bg-color) !important; */
	background: transparent linear-gradient(180deg, #DBE4EF 0%, #DBE4EF 66%, #DBE4EF00 100%);
    border-radius: 8px;
   
}
.active-report:before{
	content: '';
    left: 2px;
    top: 12px;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-right: 4px solid transparent;
    border-left: 4px solid var(--primary-bg-color);
    position: absolute;
}
.card-grid-view.settings-wrap.designCardSeven{
	padding: 16px 0 0 32px;
}
.designCardSeven .cardDesign {
	position: relative;
    display: flex;
    flex-direction: row;
    text-align: left;
    padding: 0;
    min-width: 218px;
    width: 270px;
    min-height: 81px;
    height:auto;
    overflow: hidden;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 6px;
    margin: 0 16px 16px 0;
    box-shadow: var(--shadow-container);
    /* border-top: 1px solid rgba(0, 0, 0, .3) */
}
.designCardSeven .cardDesign.favcarddesiign{
	width: calc(16.6% - 16px);
}	
.designCardSeven .cardDesignCardIcon {
    border-radius: 0;
    height: auto;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    place-content: flex-end;
    min-width: 53px;
    min-height: 75px;
   /*  position: absolute;
    left: -4px; 
    top: -4px;
    opacity: 0.7; */
    margin: 2px;
    border-radius: 6px;
    padding: 0 !important;
    background: rgb(142, 130, 192);

}
.cardDesignCardIcon .card-content{
	min-height: 100%;
    margin: 0 auto;
}
.cardDesignCardIcon .card-content md-icon{
	width: 32px;
	height: 33px
}
.designCardSeven .cardDesignCardIcon img {
	 margin: -10px 0px 0px 0; 
  /*   max-width: 25px;
    max-height: 25px; */
/* transform: rotate(346deg); */
	width: 75px;
    height: 100%;
    margin: -10px 0px 0px 0;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    bottom: -13px;
    left: -12px;
    opacity: 0.5;
}

.card-grid-view md-card-title.cardDesignRgt {
   padding: 4px; 
    padding-left: 10px;
}

.cardDesignRgt .cardDesignCardTitle {
    place-content: flex-start;
    min-height: unset;	
    padding-right: 25px;
}
.bookmark-btn{

    min-width: 217px;
    width: 217px;
    min-height: 36px;
    line-height: 24px;
    background: #1C2533 0% 0% no-repeat padding-box;
    border-radius: 6px;
    color: #fff;
    padding: 0px 12px 0px 8px;
    border: none;

}
.bookmark-btn md-icon{
    color: #fff;
}
.bookmarkiconPosition{
	position: absolute;
    right: 0px;
    top: 0px;
    z-index:2;
}
.bookmarkiconPosition md-icon{
	color: #58739d !important;
}
 .bookmarked-bg{
	 background: #EFF2F5;
} 
 .cardSection *{
	 transition: all 0.3s ease-in-out 0s;
} 
.cardSection{
	margin-left:8px;
}
.cardDesign:hover{
	    transform: scale(1.05);
	    -web-kit-transform: scale(1.05);
}

/* .designCardSeven .cardDesign:hover .cardDesignCardIcon img {
    transform: translateY(1px);
   -web-kit-transform: translateY(1px);
} */

.designCardSeven .cardDesign:hover .cardDesignCardIcon {
    box-shadow: 2px 0 4px 0px rgb(0 0 0 / 26%);
}

.designCardSeven .cardDesign:hover {
   box-shadow: var(--shadow-container);
}
md-input-container.report-search-field.md-green-theme:not(.md-input-invalid).md-input-focused md-icon{
	    color: #58739d;
}
.required-settings{
	position: absolute;
    right: 0px;
    top: 10px;
}

md-input-container .md-input{
	font-family: Outfit, sans-serif;
}
.cardSection-pb16{
	padding:12px 0px 16px 16px;
}
.report-card-searching{
	padding: 16px 0px 25px 24px;
}
.fee-heading-no-sec{
	background: #fff;
    box-shadow: 0px 3px 6px #00000029;
    border: 2px solid #FFFFFF;
    min-width: 24px;
    min-height: 24px;
    border-radius: 50%;
    display: flex;
    line-height: 22px;
    text-align: center;
    margin-right: 8px;
    margin-top: -3px;
	
}
.fee-heading-no{
	width: 22px;
	height: 22px;
	border-radius:50%;
	display:block;
	margin:auto;
	color:#fff;
}
/* .cardDesignCardIcon{
	position:relative;
}
.cardDesignCardIcon:after{
	    position: absolute;
    content: '';
    top: -24px;
    bottom: 0;
    right: -18px;
    width: 40px;
    height: 40px;
    border: 4px solid rgb(255 255 255 / 30%);
    border-radius: 50%;

}
.cardDesignCardIcon:before{
	    position: absolute;
    content: '';
    bottom: -29px;
    left: -26px;
    width: 40px;
    height: 40px;
    border: 3px solid rgb(255 255 255 / 30%);
    border-radius: 50%;

} */
.subindexclor{
	color:#fff;
}
/*end report card Grouping  */

/*  New styles */
.searchBlock {
    border: 1px solid #CACACA;
    border-radius: 8px;
    box-sizing: border-box;
    margin-bottom: 0 !important;
}
.searchBlock .custom-input-field .md-select-value {
    border: none !important;
    background: rgba(0,0,0,0.1);
    border-radius: 5px 0px 0px 5px;
}
.searchBlock md-input-container {
    padding: 0 !important;
    height: 38px;
}
.searchBlock md-icon {
	position: unset !important;
}
.searchBlock md-input-container .md-input {
    border-color: transparent !important;
    min-height: 40px;
}
.searchBlock .munsetd-button.md-icon-button {
    background: var(--green-text) !important;
    border-radius: 0 5px 5px 0;
}
.searchBlock .md-button.md-icon-button i.icon-search {
    color: #fff;
}
.searchBlock .search-icon {
	width: 40px;
    background: var(--primarybgcolor);
    height: 32px;
    line-height: 32px;
    text-align: center;
    color: #fff;
    cursor: pointer;
    border-radius: 16px;
}
.search-icon-disabled {
	background: rgba(0,0,0,0.1);
    width: 40px !important;
    height: 32px !important;
    line-height: 32px !important;
    text-align: center;
    cursor: not-allowed;
    border-radius: 16px;
    margin-right: 4px !important;
    position: unset !important;
    font-size: 24px !important;
}

/**  End **/
.saveResourcePopup {
	background: rgba(251, 189, 8,0.12);
	border-radius: 6px;
	padding: 15px;
}
.saveResourcePopup p {
	font-weight: 500;
	line-height: 20px;
	color: #000;
}
/* Scratch Project Dialog css */
md-dialog.scratchProjectDailog {
    width: 95%;
    height: 95%;
    min-height: 95%;
    min-width: 95%;
    overflow: hidden;
}
