@import url("https://use.typekit.net/ald1ask.css");



body, .sub-nav li a, .sub-nav dd a, .tabs dd a {
	font-family: 'open-sans', sans-serif !important;
}

h2, h3, h4, h5 {
	font-family: 'myriad-pro', sans-serif !important;
}

h1 {
	color: #1a7789 !important;
}

.subheader {
	text-transform: uppercase !important;
	color: #919090;
font-weight: 400 !important;
}

#hybrid-bar, .tab-bar{
margin: 0 !important;
border-radius: 0 !important;
}

/* reset profile icon to full size */
#profile-drop {
width: auto !important;
height: auto !important;
margin-right: 0px !important;
}

#left-off-canvas-toggle, {
position: static !important;
}

ul.off-canvas-list li {
	border-bottom: 1px solid #f2f0f0;
}

.side-menu-heading-link, #side-menu h3, #overflow-nav {
background-color: rgb(234, 245, 247);
}

.news-list .card, .news-list article, .calendar-list li {
	margin-top: 5px;
	background: #f7f7f7 !important;
}

#left-menu{
border-radius: 0 !important;
}

body.sbx-body .off-canvas-wrap.move-right :not(.left-open) #left-menu {
top: 0;
right: 0;
left: 0;
}

#notifications{
top:0 !important;
right: 0 !important;
justify-content: center;
}

/* NOTIFCATIONS PANEL */ 
#notifications:has(a[data-unread]:not([data-unread="0"])) {
  background-color: #ea0a06 !important;
 clip-path: inset(0 0 0 3px); 
}

#notifications:has(a[data-unread]:not([data-unread="0"])):hover {
  background-color: red !important;
}


#left-off-canvas-toggle{
top:0 !important;
right: 0 !important;
left: 0 !important
}

.logo-wrapper {
background-color: rgb(0, 125, 145) !important;
border-radius: 0 !important;
}

.left-off-canvas-menu h3, .left-off-canvas-menu h4 {
	color: #1a7789 !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
}







/* Timetable Grey Breaks */

.timetable:not(.no-hover) tr td:nth-child(4),
.timetable:not(.no-hover) tr td:nth-child(7) {
  background: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 6px,
    rgba(0, 0, 0, 0.06) 6px,
    rgba(0, 0, 0, 0.06) 12px
  );
}

/* --- MOBILE VIEW --- */
/* Target only the 2nd column on smaller screens */
@media (max-width: 767px) {
  .no-hover tr:nth-child(4) td:nth-child(2),
  .no-hover tr:nth-child(7) td:nth-child(2) {
    background: repeating-linear-gradient( 45deg, transparent, transparent 6px, rgba(0, 0, 0, 0.06) 6px, rgba(0, 0, 0, 0.06) 12px ) !important;
  }
}

/* --- DESKTOP VIEW --- */
/* Target all cells in the row EXCEPT the first column on larger screens */
@media (min-width: 768px) {
  .no-hover tr:nth-child(4) td,
  .no-hover tr:nth-child(7) td {
    background: repeating-linear-gradient( 45deg, transparent, transparent 6px, rgba(0, 0, 0, 0.06) 6px, rgba(0, 0, 0, 0.06) 12px ) !important;
  }
}







/*  SUMMATIVE REPORT */
.summative-report .summative-content .card img{
display: none;
}

.summative-report .card img{
border-radius: 5px;
}

.summative-report .card .year{
margin-bottom: 0.75rem;
}

.summative-report .class-page{
background: #00859b;
}

.summative-report .summative-content{
margin-bottom: 5px;
}

.summative-report .summative-content h3.name {
font-size: 3rem;
}

.summative-report .summative-content .introduction p {
font-size: 1rem;
}

.summative-report .folder-title{
margin-top: 50px;
background: #00859b;
border-radius: 5px;
padding: 5px;
}

.summative-report .folder-title .left h4{
color: white;
}

.summative-report .summary{
padding-left: 10px;
}

.summative-report .header-content{
padding: 10px;
height: 100%;
}

.summative-report .header-content {
    position: relative;
    height: 100vh;           /* Full page height */
    width: 100%;
    text-align: center;
}

.summative-report .header-content div {
    position: absolute;
    top: 15%;               /* Adjust this to move text higher or lower */
    left: 50%;
    transform: translateX(-50%);
    width: 80%;             /* Control text wrapping */
    text-align: center;
  }

.summative-report .header-content img {
    position: absolute;
    top: 50%;               /* Vertical center */
    left: 50%;              /* Horizontal center */
    transform: translate(-50%, -50%); /* Perfect center */
    max-width: 60%;         /* Bigger image */
    height: auto;
  }

.summative-report .header-content h2.school-name{
font-size: 0.75rem;
}

.summative-report .left h4[data-test^="summative-preview-summary-folder-title"] {
    padding-left: 10px !important;
}

.summative-report p[data-test="summative-preview-student-year"] {
    font-size:20px !important;
padding-left: 5px;
}





:root {
            --sbx-config-container-corner-radius: var(--sbx-border-radius-m);
            --sbx-config-field-corner-radius: var(--sbx-border-radius-s);
            --sbx-config-container-drop-shadow: var(--sbx-shadow-s);
                --sbx-config-color-body-background-r: 245;
        --sbx-config-color-body-background-g: 245;
        --sbx-config-color-body-background-b: 245;
        --sbx-config-color-body-background-h: 0;
        --sbx-config-color-body-background-s: 0%;
        --sbx-config-color-body-background-l: 96.1%;
        --sbx-config-color-body-background-a: 1;
        --sbx-config-color-body-background:   hsla(
            var(--sbx-config-color-body-background-h),
            var(--sbx-config-color-body-background-s),
            var(--sbx-config-color-body-background-l),
            var(--sbx-config-color-body-background-a)
        );
            --sbx-config-color-body-background-contrast-r: 0;
        --sbx-config-color-body-background-contrast-g: 0;
        --sbx-config-color-body-background-contrast-b: 0;
        --sbx-config-color-body-background-contrast-h: 0;
        --sbx-config-color-body-background-contrast-s: 0%;
        --sbx-config-color-body-background-contrast-l: 0%;
        --sbx-config-color-body-background-contrast-a: 1;
        --sbx-config-color-body-background-contrast:   hsla(
            var(--sbx-config-color-body-background-contrast-h),
            var(--sbx-config-color-body-background-contrast-s),
            var(--sbx-config-color-body-background-contrast-l),
            var(--sbx-config-color-body-background-contrast-a)
        );
            --sbx-config-color-accent-r: 0;
        --sbx-config-color-accent-g: 120;
        --sbx-config-color-accent-b: 140;
        --sbx-config-color-accent-h: 188.6;
        --sbx-config-color-accent-s: 100%;
        --sbx-config-color-accent-l: 27.5%;
        --sbx-config-color-accent-a: 1;
        --sbx-config-color-accent:   hsla(
            var(--sbx-config-color-accent-h),
            var(--sbx-config-color-accent-s),
            var(--sbx-config-color-accent-l),
            var(--sbx-config-color-accent-a)
        );
            --sbx-config-color-accent-contrast-r: 255;
        --sbx-config-color-accent-contrast-g: 255;
        --sbx-config-color-accent-contrast-b: 255;
        --sbx-config-color-accent-contrast-h: 0;
        --sbx-config-color-accent-contrast-s: 0%;
        --sbx-config-color-accent-contrast-l: 100%;
        --sbx-config-color-accent-contrast-a: 1;
        --sbx-config-color-accent-contrast:   hsla(
            var(--sbx-config-color-accent-contrast-h),
            var(--sbx-config-color-accent-contrast-s),
            var(--sbx-config-color-accent-contrast-l),
            var(--sbx-config-color-accent-contrast-a)
        );
            --sbx-config-color-accent-text-r: 255;
        --sbx-config-color-accent-text-g: 255;
        --sbx-config-color-accent-text-b: 255;
        --sbx-config-color-accent-text-h: 0;
        --sbx-config-color-accent-text-s: 0%;
        --sbx-config-color-accent-text-l: 100%;
        --sbx-config-color-accent-text-a: 1;
        --sbx-config-color-accent-text:   hsla(
            var(--sbx-config-color-accent-text-h),
            var(--sbx-config-color-accent-text-s),
            var(--sbx-config-color-accent-text-l),
            var(--sbx-config-color-accent-text-a)
        );
            --sbx-config-color-accent-text-contrast-r: 0;
        --sbx-config-color-accent-text-contrast-g: 0;
        --sbx-config-color-accent-text-contrast-b: 0;
        --sbx-config-color-accent-text-contrast-h: 0;
        --sbx-config-color-accent-text-contrast-s: 0%;
        --sbx-config-color-accent-text-contrast-l: 0%;
        --sbx-config-color-accent-text-contrast-a: 1;
        --sbx-config-color-accent-text-contrast:   hsla(
            var(--sbx-config-color-accent-text-contrast-h),
            var(--sbx-config-color-accent-text-contrast-s),
            var(--sbx-config-color-accent-text-contrast-l),
            var(--sbx-config-color-accent-text-contrast-a)
        );
            --sbx-config-color-active-r: 224;
        --sbx-config-color-active-g: 242;
        --sbx-config-color-active-b: 255;
        --sbx-config-color-active-h: 205.2;
        --sbx-config-color-active-s: 100%;
        --sbx-config-color-active-l: 93.9%;
        --sbx-config-color-active-a: 1;
        --sbx-config-color-active:   hsla(
            var(--sbx-config-color-active-h),
            var(--sbx-config-color-active-s),
            var(--sbx-config-color-active-l),
            var(--sbx-config-color-active-a)
        );
            --sbx-config-color-active-contrast-r: 0;
        --sbx-config-color-active-contrast-g: 0;
        --sbx-config-color-active-contrast-b: 0;
        --sbx-config-color-active-contrast-h: 0;
        --sbx-config-color-active-contrast-s: 0%;
        --sbx-config-color-active-contrast-l: 0%;
        --sbx-config-color-active-contrast-a: 1;
        --sbx-config-color-active-contrast:   hsla(
            var(--sbx-config-color-active-contrast-h),
            var(--sbx-config-color-active-contrast-s),
            var(--sbx-config-color-active-contrast-l),
            var(--sbx-config-color-active-contrast-a)
        );
            --sbx-config-color-menu-background-r: 0;
        --sbx-config-color-menu-background-g: 125;
        --sbx-config-color-menu-background-b: 145;
        --sbx-config-color-menu-background-h: 188.3;
        --sbx-config-color-menu-background-s: 100%;
        --sbx-config-color-menu-background-l: 28.4%;
        --sbx-config-color-menu-background-a: 1;
        --sbx-config-color-menu-background:   hsla(
            var(--sbx-config-color-menu-background-h),
            var(--sbx-config-color-menu-background-s),
            var(--sbx-config-color-menu-background-l),
            var(--sbx-config-color-menu-background-a)
        );
            --sbx-config-color-menu-background-contrast-r: 255;
        --sbx-config-color-menu-background-contrast-g: 255;
        --sbx-config-color-menu-background-contrast-b: 255;
        --sbx-config-color-menu-background-contrast-h: 0;
        --sbx-config-color-menu-background-contrast-s: 0%;
        --sbx-config-color-menu-background-contrast-l: 100%;
        --sbx-config-color-menu-background-contrast-a: 1;
        --sbx-config-color-menu-background-contrast:   hsla(
            var(--sbx-config-color-menu-background-contrast-h),
            var(--sbx-config-color-menu-background-contrast-s),
            var(--sbx-config-color-menu-background-contrast-l),
            var(--sbx-config-color-menu-background-contrast-a)
        );
            --sbx-config-color-menu-foreground-r: 255;
        --sbx-config-color-menu-foreground-g: 255;
        --sbx-config-color-menu-foreground-b: 255;
        --sbx-config-color-menu-foreground-h: 0;
        --sbx-config-color-menu-foreground-s: 0%;
        --sbx-config-color-menu-foreground-l: 100%;
        --sbx-config-color-menu-foreground-a: 1;
        --sbx-config-color-menu-foreground:   hsla(
            var(--sbx-config-color-menu-foreground-h),
            var(--sbx-config-color-menu-foreground-s),
            var(--sbx-config-color-menu-foreground-l),
            var(--sbx-config-color-menu-foreground-a)
        );
            --sbx-config-color-menu-foreground-contrast-r: 0;
        --sbx-config-color-menu-foreground-contrast-g: 0;
        --sbx-config-color-menu-foreground-contrast-b: 0;
        --sbx-config-color-menu-foreground-contrast-h: 0;
        --sbx-config-color-menu-foreground-contrast-s: 0%;
        --sbx-config-color-menu-foreground-contrast-l: 0%;
        --sbx-config-color-menu-foreground-contrast-a: 1;
        --sbx-config-color-menu-foreground-contrast:   hsla(
            var(--sbx-config-color-menu-foreground-contrast-h),
            var(--sbx-config-color-menu-foreground-contrast-s),
            var(--sbx-config-color-menu-foreground-contrast-l),
            var(--sbx-config-color-menu-foreground-contrast-a)
        );
            --sbx-config-color-menu-hover-r: 0;
        --sbx-config-color-menu-hover-g: 105;
        --sbx-config-color-menu-hover-b: 122;
        --sbx-config-color-menu-hover-h: 188.4;
        --sbx-config-color-menu-hover-s: 100%;
        --sbx-config-color-menu-hover-l: 23.9%;
        --sbx-config-color-menu-hover-a: 1;
        --sbx-config-color-menu-hover:   hsla(
            var(--sbx-config-color-menu-hover-h),
            var(--sbx-config-color-menu-hover-s),
            var(--sbx-config-color-menu-hover-l),
            var(--sbx-config-color-menu-hover-a)
        );
            --sbx-config-color-menu-hover-contrast-r: 255;
        --sbx-config-color-menu-hover-contrast-g: 255;
        --sbx-config-color-menu-hover-contrast-b: 255;
        --sbx-config-color-menu-hover-contrast-h: 0;
        --sbx-config-color-menu-hover-contrast-s: 0%;
        --sbx-config-color-menu-hover-contrast-l: 100%;
        --sbx-config-color-menu-hover-contrast-a: 1;
        --sbx-config-color-menu-hover-contrast:   hsla(
            var(--sbx-config-color-menu-hover-contrast-h),
            var(--sbx-config-color-menu-hover-contrast-s),
            var(--sbx-config-color-menu-hover-contrast-l),
            var(--sbx-config-color-menu-hover-contrast-a)
        );
            --sbx-config-color-component-heading-background-r: 235;
        --sbx-config-color-component-heading-background-g: 152;
        --sbx-config-color-component-heading-background-b: 19;
        --sbx-config-color-component-heading-background-h: 36.9;
        --sbx-config-color-component-heading-background-s: 85%;
        --sbx-config-color-component-heading-background-l: 49.8%;
        --sbx-config-color-component-heading-background-a: 1;
        --sbx-config-color-component-heading-background:   hsla(
            var(--sbx-config-color-component-heading-background-h),
            var(--sbx-config-color-component-heading-background-s),
            var(--sbx-config-color-component-heading-background-l),
            var(--sbx-config-color-component-heading-background-a)
        );
            --sbx-config-color-component-heading-background-contrast-r: 255;
        --sbx-config-color-component-heading-background-contrast-g: 255;
        --sbx-config-color-component-heading-background-contrast-b: 255;
        --sbx-config-color-component-heading-background-contrast-h: 0;
        --sbx-config-color-component-heading-background-contrast-s: 0%;
        --sbx-config-color-component-heading-background-contrast-l: 100%;
        --sbx-config-color-component-heading-background-contrast-a: 1;
        --sbx-config-color-component-heading-background-contrast:   hsla(
            var(--sbx-config-color-component-heading-background-contrast-h),
            var(--sbx-config-color-component-heading-background-contrast-s),
            var(--sbx-config-color-component-heading-background-contrast-l),
            var(--sbx-config-color-component-heading-background-contrast-a)
        );
            --sbx-config-color-component-heading-text-r: 0;
        --sbx-config-color-component-heading-text-g: 0;
        --sbx-config-color-component-heading-text-b: 0;
        --sbx-config-color-component-heading-text-h: 0;
        --sbx-config-color-component-heading-text-s: 0%;
        --sbx-config-color-component-heading-text-l: 0%;
        --sbx-config-color-component-heading-text-a: 1;
        --sbx-config-color-component-heading-text:   hsla(
            var(--sbx-config-color-component-heading-text-h),
            var(--sbx-config-color-component-heading-text-s),
            var(--sbx-config-color-component-heading-text-l),
            var(--sbx-config-color-component-heading-text-a)
        );
            --sbx-config-color-component-heading-text-contrast-r: 255;
        --sbx-config-color-component-heading-text-contrast-g: 255;
        --sbx-config-color-component-heading-text-contrast-b: 255;
        --sbx-config-color-component-heading-text-contrast-h: 0;
        --sbx-config-color-component-heading-text-contrast-s: 0%;
        --sbx-config-color-component-heading-text-contrast-l: 100%;
        --sbx-config-color-component-heading-text-contrast-a: 1;
        --sbx-config-color-component-heading-text-contrast:   hsla(
            var(--sbx-config-color-component-heading-text-contrast-h),
            var(--sbx-config-color-component-heading-text-contrast-s),
            var(--sbx-config-color-component-heading-text-contrast-l),
            var(--sbx-config-color-component-heading-text-contrast-a)
        );
            --sbx-config-login-form-background-r: 0;
        --sbx-config-login-form-background-g: 0;
        --sbx-config-login-form-background-b: 0;
        --sbx-config-login-form-background-h: 0;
        --sbx-config-login-form-background-s: 0%;
        --sbx-config-login-form-background-l: 0%;
        --sbx-config-login-form-background-a: 0.4;
        --sbx-config-login-form-background:   hsla(
            var(--sbx-config-login-form-background-h),
            var(--sbx-config-login-form-background-s),
            var(--sbx-config-login-form-background-l),
            var(--sbx-config-login-form-background-a)
        );
            --sbx-config-login-form-background-contrast-r: 255;
        --sbx-config-login-form-background-contrast-g: 255;
        --sbx-config-login-form-background-contrast-b: 255;
        --sbx-config-login-form-background-contrast-h: 0;
        --sbx-config-login-form-background-contrast-s: 0%;
        --sbx-config-login-form-background-contrast-l: 100%;
        --sbx-config-login-form-background-contrast-a: 1;
        --sbx-config-login-form-background-contrast:   hsla(
            var(--sbx-config-login-form-background-contrast-h),
            var(--sbx-config-login-form-background-contrast-s),
            var(--sbx-config-login-form-background-contrast-l),
            var(--sbx-config-login-form-background-contrast-a)
        );
            --sbx-config-login-form-foreground-r: 255;
        --sbx-config-login-form-foreground-g: 255;
        --sbx-config-login-form-foreground-b: 255;
        --sbx-config-login-form-foreground-h: 0;
        --sbx-config-login-form-foreground-s: 0%;
        --sbx-config-login-form-foreground-l: 100%;
        --sbx-config-login-form-foreground-a: 1;
        --sbx-config-login-form-foreground:   hsla(
            var(--sbx-config-login-form-foreground-h),
            var(--sbx-config-login-form-foreground-s),
            var(--sbx-config-login-form-foreground-l),
            var(--sbx-config-login-form-foreground-a)
        );
            --sbx-config-login-form-foreground-contrast-r: 0;
        --sbx-config-login-form-foreground-contrast-g: 0;
        --sbx-config-login-form-foreground-contrast-b: 0;
        --sbx-config-login-form-foreground-contrast-h: 0;
        --sbx-config-login-form-foreground-contrast-s: 0%;
        --sbx-config-login-form-foreground-contrast-l: 0%;
        --sbx-config-login-form-foreground-contrast-a: 1;
        --sbx-config-login-form-foreground-contrast:   hsla(
            var(--sbx-config-login-form-foreground-contrast-h),
            var(--sbx-config-login-form-foreground-contrast-s),
            var(--sbx-config-login-form-foreground-contrast-l),
            var(--sbx-config-login-form-foreground-contrast-a)
        );
    }
