/* Module Colours */

.context_module_item.indent_1 > div.ig-row .module-item-title:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D .cls-2 %7B fill: %23397ccf; %7D %3C/style%3E%3C/defs%3E%3C!-- Generator: Adobe Illustrator 28.7.0, SVG Export Plug-In . SVG Version: 1.2.0 Build 136) --%3E%3Cg%3E%3Cg id='Layer_1'%3E%3Cg id='Circle'%3E%3Cpath class='cls-2' d='M50,0h0c27.6,0,50,22.4,50,50h0c0,27.6-22.4,50-50,50h0C22.4,100,0,77.6,0,50h0C0,22.4,22.4,0,50,0Z'/%3E%3C/g%3E%3Cg id='OUTLINES'%3E%3Cpath class='cls-1' d='M50,45.2c-.2,0-.4,0-.6,0l-32.5-9.7c-.9-.2-1.4-1-1.4-1.9s.6-1.7,1.4-1.9l32.5-9.7c.4-.1.8-.1,1.1,0l32.5,9.7c.8.2,1.4,1,1.4,1.9s-.6,1.7-1.4,1.9l-32.5,9.7c-.2,0-.4,0-.6,0ZM24.5,33.5l25.5,7.6,25.5-7.6-25.5-7.6-25.5,7.6Z'/%3E%3Cpath class='cls-1' d='M35.5,54.6c-.2,0-.5,0-.7-.1-3.1-1.2-5-2.2-5.1-2.3-.6-.3-1-1-1-1.7v-13c0-1.1.9-2,2-2s2,.9,2,2v11.8c.8.4,2,.9,3.5,1.5,1,.4,1.6,1.5,1.2,2.6-.3.8-1.1,1.3-1.9,1.3h0Z'/%3E%3Cpath class='cls-1' d='M51.9,57.2c-1.1,0-2-.9-2-2s.9-2,2-2c6.4,0,12.9-2.8,15.4-4v-11.8c0-1.1.9-2,2-2s2,.9,2,2v13c0,.7-.4,1.4-1.1,1.8-.4.2-9.3,5-18.4,5Z'/%3E%3Cpath class='cls-1' d='M48.5,82.2c-3.7,0-7.1-1.4-9.7-4l-6.2-6.2c-2.6-2.6-4-6.1-4-9.7s1.4-7.1,4-9.7c5.4-5.4,14.1-5.4,19.5,0l6.2,6.2c5.4,5.4,5.4,14.1,0,19.5h0c-2.6,2.6-6.1,4-9.7,4h0ZM42.3,52.4c-2.5,0-5,1-6.9,2.9-1.8,1.8-2.9,4.3-2.9,6.9s1,5.1,2.9,6.9l6.2,6.2c1.8,1.8,4.3,2.9,6.9,2.9s5.1-1,6.9-2.9h0c3.8-3.8,3.8-10,0-13.8l-6.2-6.2c-1.9-1.9-4.4-2.9-6.9-2.9Z'/%3E%3Cpath class='cls-1' d='M36.2,74.8c-.5,0-1-.2-1.4-.6-.8-.8-.8-2.1,0-2.8l16.7-16.7c.8-.8,2-.8,2.8,0s.8,2,0,2.8l-16.7,16.7c-.4.4-.9.6-1.4.6h0Z'/%3E%3Cpath class='cls-1' d='M44.6,66.5c-.5,0-1-.2-1.4-.6l-10.6-10.6c-.8-.8-.8-2,0-2.8.8-.8,2-.8,2.8,0l10.6,10.6c.8.8.8,2,0,2.8s-.9.6-1.4.6h0Z'/%3E%3Cpath class='cls-1' d='M56.8,60.1l-3.9-3.9-16.7,16.7,3.9,3.9c4.6,4.6,12.1,4.6,16.7,0s4.6-12.1,0-16.7Z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-size: 1.5rem 1.5rem; 
    display: inline-block;
    width: 1.5rem; 
    height: 1.5rem; 
    vertical-align: middle;
    text-align: left;
    content:"";
}

.context_module_item.indent_3 > div.ig-row .module-item-title:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23ff6900; %7D .cls-1, .cls-2 %7B stroke-width: 0px; %7D .cls-2 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cg id='Circle'%3E%3Crect class='cls-1' x='0' y='0' width='100' height='100' rx='50' ry='50'/%3E%3C/g%3E%3Cg id='OUTLINES'%3E%3Cpath class='cls-2' d='M23.35,78.65c-.52,0-1.03-.2-1.41-.59-.55-.55-.73-1.37-.46-2.11l10.62-28.84c.1-.27.26-.52.46-.72l23.51-23.51c2.09-2.09,4.87-3.24,7.82-3.24s5.73,1.15,7.82,3.24l5.4,5.4c2.09,2.09,3.24,4.87,3.24,7.82s-1.15,5.73-3.24,7.82l-23.51,23.51c-.2.21-.45.36-.72.46l-28.84,10.62c-.23.08-.46.12-.69.12ZM35.69,48.92l-8.97,24.36,24.36-8.97,23.2-23.2c1.33-1.33,2.07-3.11,2.07-4.99s-.73-3.66-2.07-4.99l-5.4-5.4h0c-1.33-1.33-3.11-2.07-4.99-2.07s-3.66.73-4.99,2.07l-23.2,23.2ZM52.19,66.03h0,0Z'/%3E%3Cpath class='cls-2' d='M70.74,49.48c-.51,0-1.02-.2-1.41-.59l-18.22-18.22c-.78-.78-.78-2.05,0-2.83.78-.78,2.05-.78,2.83,0l18.22,18.22c.78.78.78,2.05,0,2.83-.39.39-.9.59-1.41.59Z'/%3E%3Cpath class='cls-2' d='M49.12,66.78c-.89,0-1.84-.24-2.68-1.08-1.57-1.57-1.06-3.54-.75-4.72.06-.23.14-.55.18-.78-.24.04-.55.12-.78.18-1.18.3-3.15.82-4.72-.75-1.57-1.57-1.06-3.54-.75-4.72.06-.23.14-.54.18-.78-.24.04-.55.12-.78.18-1.18.3-3.15.82-4.72-.75-1.57-1.57-1.06-3.54-.75-4.72.08-.31.2-.76.21-.98-.69-.79-.66-1.98.09-2.74.78-.78,2.05-.78,2.83,0,1.57,1.57,1.05,3.54.75,4.72-.06.23-.14.54-.18.78.24-.04.55-.12.78-.18,1.18-.31,3.15-.82,4.72.75,1.57,1.57,1.06,3.54.75,4.72-.06.23-.14.54-.18.78.24-.04.55-.12.78-.18,1.18-.3,3.15-.81,4.72.75,1.57,1.57,1.06,3.54.75,4.72-.06.23-.14.55-.18.79.24-.04.55-.12.79-.18,1.18-.3,3.16-.81,4.72.75.78.78.78,2.05,0,2.83-.75.75-1.95.78-2.74.08-.23,0-.68.12-.99.21-.55.14-1.27.33-2.04.33ZM33.84,47.94h0,0Z'/%3E%3Cg%3E%3Cpolygon class='cls-2' points='35.15 72.31 27.72 64.77 23.35 76.65 35.15 72.31'/%3E%3Cpath class='cls-2' d='M23.35,78.65c-.52,0-1.03-.2-1.41-.59-.55-.55-.73-1.37-.46-2.11l4.37-11.88c.24-.64.79-1.12,1.45-1.26.67-.14,1.37.06,1.85.55l7.42,7.53c.48.48.68,1.18.53,1.84-.15.66-.62,1.21-1.26,1.44l-11.8,4.34c-.23.08-.46.12-.69.12ZM28.51,68.42l-1.79,4.85,4.82-1.78-3.04-3.08Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-size: 1.5rem 1.5rem; 
    display: inline-block;
    width: 1.5rem; 
    height: 1.5rem; 
    vertical-align: middle;
    text-align: left;
    content:"";
}

.context_module_item.indent_4 > div.ig-row .module-item-title:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %2334d171; %7D .cls-2 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3C!-- Generator: Adobe Illustrator 28.7.0, SVG Export Plug-In . SVG Version: 1.2.0 Build 136) --%3E%3Cg%3E%3Cg id='Layer_1'%3E%3Cg id='Circle'%3E%3Cpath class='cls-1' d='M50,0h0c27.6,0,50,22.4,50,50h0c0,27.6-22.4,50-50,50h0C22.4,100,0,77.6,0,50h0C0,22.4,22.4,0,50,0Z'/%3E%3C/g%3E%3Cg id='OUTLINES'%3E%3Cpath class='cls-2' d='M39.6,70c-.3,0-.7,0-1-.3-.8-.4-1.1-1.3-1-2.1l4.4-21.5c0-.4.3-.8.6-1.1l16.4-14.5c.6-.6,1.6-.7,2.3-.2s1.1,1.3,1,2.1l-4.4,21.5c0,.4-.3.8-.6,1.1l-16.4,14.5c-.4.3-.8.5-1.3.5h0ZM45.8,47.6l-3,14.9,11.4-10.1,3-14.9s-11.4,10.1-11.4,10.1Z'/%3E%3Cpath class='cls-2' d='M50,82c-17.7,0-32-14.4-32-32s14.3-32,32-32,32,14.4,32,32-14.3,32-32,32ZM50,22c-15.4,0-28,12.6-28,28s12.6,28,28,28,28-12.6,28-28-12.6-28-28-28Z'/%3E%3Cpolygon class='cls-2' points='47.9 43 57 48.3 60.4 32 47.9 43'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-size: 1.5rem 1.5rem; 
    display: inline-block;
    width: 1.5rem; 
    height: 1.5rem; 
    vertical-align: middle;
    text-align: left;
    content:"";
}

.context_module {
    border-top: none;
    background-color: transparent;
    min-width: auto;
    margin-bottom: 3vh;
    box-shadow: 0px 0px 5px #00000036;
    border-radius: 10px;
    margin-left: 5%;
    margin-right: 6%;
    padding: 0px !important;
}

.ig-header {
    margin-top: 15px;
    background-color: #ffffff !important;
    padding: 12px 6px;
    color: var(--ic-brand-font-color-dark);
    position: relative;
    display: flex;
    border-radius: 10px 10px 0px 0px;
    flex-wrap: wrap;
    box-shadow: 0px 3px 5px #00000012;
    font-family: Trebuchet MS, sans-serif;
    letter-spacing: 0.05rem;
    border: none !important;
}

.context_module_item.indent_0 > div.ig-row

{ background-color: #ffffff;
  font-family: Trebuchet MS;
  font-size: 1rem;
  color: #3B3838;
  font-weight: lighter;
  margin-bottom: 1vh;
  box-shadow: 0px 0px 4px #0000001a;
  letter-spacing: 0.05rem;
  transition: all 0.25s ease;
    }

.context_module_item.indent_0 > div.ig-row:hover {
  box-shadow: 0px 0px 4px #0000000d;
}

.context_module_item.indent_1 > div.ig-row

{ background-color: #F0F6FF;
    font-family: Trebuchet MS;
    font-size: 1rem;
    color: #000000;
    font-weight: lighter;
    margin-bottom: 1vh;
    letter-spacing: 0.05rem;
    transition: all 0.25s ease;
    }

.context_module_item.indent_1 > div.ig-row:hover {
  background-color: #F6FAFF;
}

.context_module_item.indent_2 > div.ig-row {
    background-color: #FFFCE6;
    font-family: Trebuchet MS;
    font-size: 1rem;
    color: #000000;
    font-weight: lighter;
    margin-bottom: 1vh;
    margin-top: 1vh;
    letter-spacing: 0.05rem;
    transition: all 0.25s ease;
}

.context_module_item.indent_2 > div.ig-row:hover {
    background-color: #FFFDF1;
}

.context_module_item.indent_3 > div.ig-row {
    background-color: #FFF0E6;
    font-family: Trebuchet MS;
    font-size: 1rem;
    color: #000000;
    font-weight: bolder;
    margin-bottom: 1vh;
    letter-spacing: 0.05rem;
    transition: all 0.25s ease;
}

.context_module_item.indent_3 > div.ig-row:hover {
  background-color: #FFF8F3;
}

.context_module_item.indent_4 > div.ig-row {
    background-color: #EEF9F3;
    font-family: Trebuchet MS;
    font-size: 1rem;
    color: #000000;
    font-weight: lighter;
    margin-bottom: 1vh;
    letter-spacing: 0.05rem;
    transition: all 0.25s ease;
}

.context_module_item.indent_4 > div.ig-row:hover {
  background-color: #F2FCF7
}

.context_module_item.indent_5 > div.ig-row .module-item-title:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23143256; %7D .cls-1, .cls-2 %7B stroke-width: 0px; %7D .cls-2 %7B fill: %23fff; %7D %3C/style%3E%3C/defs%3E%3Cg id='Circle'%3E%3Ccircle class='cls-1' cx='50' cy='50' r='50'/%3E%3C/g%3E%3Cg id='OUTLINES'%3E%3Cpath class='cls-2' d='M62.34,66.18c-.51,0-1.02-.2-1.41-.59l-4.72-4.72-10.21,4.31c-.75.31-1.62.15-2.19-.43l-8.47-8.47c-.58-.58-.75-1.44-.43-2.19l4.31-10.21-4.72-4.72c-.78-.78-.78-2.05,0-2.83,4.58-4.58,10.06-4.12,13.01-3.87.63.05,1.23-.14,1.68-.52,6.97-6.02,15.43-10.18,24.45-12.02l2.73-.56c1.22-.25,2.47.13,3.35,1.01.88.88,1.25,2.13,1,3.35l-.56,2.73c-1.84,9.02-6,17.47-12.02,24.45-.39.45-.58,1.06-.53,1.68.25,2.94.71,8.42-3.87,13.01-.39.39-.9.59-1.41.59ZM56.67,56.51c.52,0,1.03.2,1.41.59l4.12,4.12c1.73-2.6,1.68-5.41,1.43-8.29-.14-1.69.4-3.38,1.48-4.63,5.57-6.46,9.42-14.28,11.12-22.63l.47-2.28-2.28.47c-8.35,1.7-16.18,5.55-22.63,11.12-1.26,1.08-2.94,1.62-4.63,1.48-2.88-.25-5.69-.3-8.29,1.43l4.12,4.12c.58.58.75,1.44.43,2.19l-4.31,10.21,6.57,6.57,10.21-4.31c.25-.11.52-.16.78-.16Z'/%3E%3Cpath class='cls-2' d='M22.33,79.69s-.09,0-.14,0c-1.1-.01-1.99-.91-1.98-2.02.05-5.72,3.6-15.09,9.25-17.37,1.63-.66,4.86-1.24,8.23,2.19h0c3.37,3.44,2.72,6.66,2.04,8.27-2.37,5.57-11.68,8.93-17.41,8.93ZM32.02,63.78c-.41,0-.76.1-1.05.22-3.02,1.22-5.8,6.87-6.55,11.52,4.66-.66,10.37-3.34,11.64-6.34.34-.8.58-2.08-1.21-3.9h0c-1.15-1.17-2.09-1.5-2.83-1.5Z'/%3E%3Cpath class='cls-2' d='M66.63,38.88c1.46-1.53,4.11-5.07,1.83-7.35-2.29-2.29-5.89.53-7.35,2.05s-.92,3.46.61,4.92c1.53,1.46,3.46,1.91,4.92.38Z'/%3E%3Cpath class='cls-2' d='M36.27,63.89c7.15,7.29-6.36,13.87-14.06,13.8.07-7.7,6.91-21.08,14.06-13.8Z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 1.5rem 1.5rem; 
    display: inline-block;
    width: 1.5rem; 
    height: 1.5rem; 
    vertical-align: middle;
    text-align: left;
    content:"";
}

.context_module_item.indent_5 > div.ig-row {
    background-color: #F0F6FF;
    font-family: Trebuchet MS;
    font-size: 1rem;
    color: #000000;
    font-weight: lighter;
    margin-bottom: 1vh;
    letter-spacing: 0.05rem;
    transition: all 0.25s ease;
}

.context_module_item.indent_5 > div.ig-row:hover {
    background-color: #F6FAFF;
}

.context_module_item.indent_5 .type_icon {
    padding-left: 0px !important;
}

.context_module_item.indent_5 > div.ig-row a.ig-title {
    color: #ffffff !important;
}

.context_module_item.indent_5 > div.ig-row .ig-type-icon {
    color: #ffffff !important;
}

/* Module link colour - Different Colours */

context_module_item.indent_1 .ig-list .ig-row a.ig-title a::after {
    color: #ffffff;
}

/* Misc */

.ic-app-header__menu-list-item.ic-app-header__menu-list-item--active .ic-app-header__menu-list-link {
    border-radius: 1rem 0rem 0rem 1rem;
    margin-left: 0.5rem;
    box-shadow: -2px 0px 20px #1432561a;
}

.icon-white {
    color: white
}

.ig-title {
    font-weight: bold;
    font-family: Trebuchet MS
}

.publish-icon.publish-icon-published {
    color: #143256;
}

.published-status.published {
    color: #143256;
}

.ig-published:not(.student-view) .ig-type-icon {
    color: #143256;
}

.ig-type-icon {
    color: #CBCBCB;
}

.ig-list .icon-drag-handle {
    color: #DFD2D2;
}

.ig-list .ig-row.ig-published:not(.student-view):before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: -1px;
    left: -1px;
    width: 0.25rem;
    height: calc(100% + 2px);
    background-color: #143256;
    border-top: 0px solid #ffffff;
    border-bottom: 0px solid #ffffff;
}

.al-trigger-gray {
    color: #000000;
    border-radius: 3px;
    outline: none;
}

.published-status.hiddenState {
    font-weight: normal;
    color: #ffffff;
}

.publish-icon {
    outline-width: 0.125rem;
    outline-color: transparent;
    outline-style: solid;
    display: inline-block;
    color: #143256;
    cursor: pointer;
    border-radius: 3px;
    outline: none;
    padding: 2px 4px;
}

.item-group-condensed .ig-row {
    border-top-width: 0;
    border-radius: 0;
    background: #fff;
    border-bottom: 0px
}

/* Module Indents Spacing */

.context_module_item.indent_1 .type_icon {
    padding-left: 0px;
}

.context_module_item.indent_2 .type_icon {
    padding-left: 0px;
}

.context_module_item.indent_3 .type_icon {
    padding-left: 0px;
}

.context_module_item.indent_4 .type_icon {
    padding-left: 0px;
}

.publish-icon.publish-icon-unpublish {
    color: 00DAA1;
}

/* Link Colour */

.link_holder a:link {
    color: #3B3838;
}

/* Indents Replacer */

.indent_item_link {
  font-size: 0;
}

.indent_item_link::after {
  content: "Next Colour";
  font-size: 0.9rem;
  vertical-align: bottom;
}

.outdent_item_link {
  font-size: 0;
}
.outdent_item_link::after {
  content: "Previous Colour";
  font-size: 0.9rem;
  vertical-align: bottom;
}

/* Page Titles */

.pages.show .page-title {
  font-size: 3vmin;
  color: #828282;
  font-family: "Century Gothic";
}

/* Canvas Header */

.ic-app-nav-toggle-and-crumbs {
    padding-top: 3vh;
    padding-bottom: 3vh;
    padding-right: 4vw;
}

#easy_student_view.mr3 {
    margin-right: !important;
}

#easy_student_view.btn.mr3 {
    margin-right: !important;
}

.btn mr3 {
    margin-right: !important;
}

#easy_student_view {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
  padding-top: 0.8rem !important;
  padding-bottom: 0.8rem !important;
  font-size: 0;
  font-family: "Century Gothic" !important;
  font-weight: bold;
  font-size: 1.8vmin;
  color: #000000;
  background-color: #FEDD00;
  border: 0.15rem solid #FEDD00;
  border-radius: 0.4em;
  margin-right: 0rem !important;
  text-transform: uppercase;
  letter-spacing: 0.04rem;

}

#easy_student_view:hover {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
  padding-top: 0.8rem !important;
  padding-bottom: 0.8rem !important;
  font-size: 0;
  font-family: "Century Gothic";
  font-weight: bold;
  font-size: 1.8vmin;
  color: #000000;
  background-color: #ffffff;
  border: 0.15rem solid #FEDD00; 
  border-radius: 0.6em;
  margin-right: 0rem !important;
}

.icon-student-view {
  display: none !important;
}

/* Menu buttons test */

.button-sidebar-wide {
  margin-right: 4vw;
  font-size: 1.8vmin;
  color: #ffffff;
  background-color: #143256;
  border: 0.15rem solid #143256; 
  border-radius: 0.6em;
}

.button-sidebar-wide:hover {
  margin-right: 4vw;
  font-size: 1.8vmin;
  color: #143256;
  background-color: #ffffff;
  border: 0.15rem solid #143256; 
  border-radius: 0.6em;
}

/* WEEK TABS */

.week-tab {
  background-color: #583B96;
  color: #ffffff;
  border: 0rem;
  border-radius: 2rem;
  box-shadow: 0px 0px 0.5rem 0.3rem #DEDEDE;
  width: 92%;
  height: 10rem;
  line-height: 10rem;
  text-align: center;
  vertical-align: middle;
  font-family: 'Century Gothic';
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
  font-size: 1rem;
  text-decoration: none;
}

.week-tab:hover {
  background-color: #583B96;
  color: #ffffff;
  border: 0rem;
  border-radius: 2rem;
  box-shadow: 0px 0px 0.5rem 0.3rem #DEDEDE;
  width: 94%;
  height: 10.5rem;
  line-height: 10rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
  font-size: 1rem;
  text-decoration: none;
}

a.week-tab {
  background-color: #583B96;
  color: #ffffff;
  border: 0rem;
  border-radius: 2rem;
  box-shadow: 0px 0px 0.5rem 0.3rem #DEDEDE;
  width: 92%;
  height: 10rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
  font-size: 1rem;
  text-decoration: none;
}

/* WEEK PAGE CIRCLES */

.week-circle {
  background-color: #00CC99;
  color: #ffffff;
  border: 0.2rem solid #FFFFFF;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #3BF1C3;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
}

.week-circle:hover {
  background-color: #31D9AF;
  color: #ffffff;
  border: 0.3rem solid #FFFFFF;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #3BF1C3;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
}

.week-circle-past:hover {
  background-color: #ffffff;
  color: #00CC99;
  border: 0.3rem solid #FFFFFF;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #3BF1C3;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
}

.week-circle-future:hover {
  background-color: #ffffff;
  color: #6B6B6B;
  border: 0.3rem solid #FFFFFF;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #DEDEDE;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
}

/* WEEK LINK CIRCLES */

a.week-circle {
  background-color: #00CC99;
  color: #ffffff;
  border: 0.2rem solid #FFFFFF;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #3BF1C3;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
  display: block;
}

a.week-circle-past {
  background-color: #ffffff;
  color: #00CC99;
  border: 0.2rem solid #ffffff;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #3BF1C3;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
  display: block;
}

a.week-circle-future {
  background-color: #ffffff;
  color: #6B6B6B;
  border: 0.2rem solid #ffffff;
  border-radius: 50%;
  box-shadow: 0px 0px 0px 0.2rem #DEDEDE;
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.9rem;
  text-align: center;
  vertical-align: middle;
  font-family: "Century Gothic";
  margin-left: auto;
  margin-right: auto;
  font-size: 1rem;
  text-decoration: none;
  display: block;
}

/* DIV TABLE */

.column {
  float: left;
  width: 33.33%;
}

.row:after {
  content: "";
  display: table;
  clear: both;
  width: 100%;
}

.week-tracker-link {
   display: block;
   link-decoration: none;
}

.header-light {
    font-weight: 100;
    font-family: Garamond;
}

/* COURSE TEMPLATES */

.element_toggler_terms {
    font-family: "Century Gothic", sans-serif;
    margin-left: 6%;
    margin-right: 6%;
    font-size: 1.8vmin;
    background-color: #ffffff;
    padding: 20px;
    margin-bottom: 2vh;
    color: #000000;
    box-shadow: 0px 0px 5px 0.2rem #efefef;
    transition: all 0.25s ease;
}

.element_toggler_terms:hover {
    font-family: "Century Gothic", sans-serif;
    margin-left: 6%;
    margin-right: 6%;
    font-size: 1.8vmin;
    background-color: #ffffff;
    padding: 20px;
    margin-bottom: 2vh;
    color: #000000;
    box-shadow: 0px 0px 5px 0.2rem #f9f9f9;
}

.icon-mini-arrow-down {
    color: #000000;
}

.Text-block-bolder {
    font-family: "Century Gothic", sans-serif;
    letter-spacing: 0.02em;
    font-weight: 900;
}

/* Nav Header */

.course-title {
    display: none !important;
}

.header-container {
    padding-top: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 2vh;
    box-shadow: 0px 0px 10px #0000001f;
    vertical-align: middle;
    border-radius: 10vw;
}

.header-table {
    background-color: transparent !important;
}

.nav-button-text {
    color: #000000;
    font-family: Century Gothic;
    font-size: 1.2vmin;
    font-weight: 900;
}

.header-nav-button {
    border-radius: 2rem;
    background-color: #ffffff;
    color: #000000;
    font-family: Century Gothic;
    font-size: 0.8rem;
    transition: all 0.25s ease;
    margin-left: 1vw;
    margin-right: 1vw;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    border: 0.2rem solid transparent;
    font-weight: 900;
    vertical-align: middle;
    text-align: center;
}

.header-nav-button:hover {
    border-radius: 2rem;
    background-color: #f0f6ff;
    font-family: Century Gothic;
    color: #143256;
    font-size: 0.8rem;
    margin-left: 5vw;
    margin-right: 5vw;
    border: 0.2rem solid transparent;
    padding-top: 2rem;
}

.header-nav-button:active {
    border-radius: 2rem;
    background-color: #f0f6ff;
    font-family: Century Gothic;
    color: #143256;
    font-size: 0.8rem;
    margin-left: 5vw;
    margin-right: 5vw;
    border: 0.2rem solid #ffffff;
    padding-top: 2rem;
}

.header-nav-button:hover .nav-button-text {
    color: #143256;
}

.header-nav-button:active {
    border-radius: 2rem;
    background-color: #f0f6ff;
    font-family: Century Gothic;
    color: #143256;
    font-size: 0.8rem;
    margin-left: 5vw;
    margin-right: 5vw;
    border: 0.2rem solid #143256;
    padding-top: 2rem;
}

.header-svg {
    margin-right: 0.5rem;
}

/* Page Header */

.header-Navy {
    background-color: #143256 !important;
}

.header-section-blue {
    background-color: #f0f6ff;
}

.header-section-green {
    background-color: #EEF9F3 !important;
}

.header-section-yellow {
    background-color: #FFFCE6 !important;
}

.header-section-red {
    background-color: #FDF2F4 !important;
}

.header-section-orange {
    background-color: #FFF0E6 !important;
}

.header-image-homepage {
    width: 100%;
    text-align: left;
    float: left;
}

.header-image {
    width: 100%;
    text-align: left;
    float: left;
}

.header-title {
    font-weight: 100;
    font-family: "Garamond", serif !important;
}

.header-subtitle {
    font-family: "Garamond", serif !important;
}

.header-description {
    letter-spacing: 0.05em;
    font-family: Century Gothic;
    margin-right: 2.2%;
}

/* interactive activities pages */

.header-section-grey {
    background-color: #f0f6ff;
}

.content-section-grey {
    background-color: #f0f6ff;
}

.learn-dropdown {
    background-color: #143256;
}

.explore-dropdown {
    background-color: #143256;
}

.apply-dropdown {
    background-color: #143256;
}

.content-dropdown {
    background-color: #ffffff;
    box-shadow: 0px 5px 5px #0000001f;
    transition: all 0.25s ease;
}

/* queries */

@media (max-width: 80em) {
    .nav-button-text {display: none; }
}

.ui-icon-extlink {
    display: none !important;
}

/* Overlay */

.text-overlay-centered {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'TW Cen MT';
    font-weight: 900;
    font-size: 3.5vmin;
    width: 90%;
}

.button-overlay-centered {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 3vh;
    background-color: #ffffff;
    color: #143256;
    letter-spacing: 0.02em;
    padding-left: 1.2vmin;
    padding-right: 1.2vmin;
    padding-top: 0.5vmin;
    padding-bottom: 0.5vmin;
    border: solid 0.125rem #ffffff;
    border-radius: 0.6em;
    display:inline-block;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    transition: all 0.25s ease;
    font-family: Century Gothic;
    font-weight: 900;
    font-size: 1.6vmin;
}

.button-overlay-centered:hover {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 3vmin;
    background-color: transparent;
    color: #ffffff;
    letter-spacing: 0.02em;
    padding-left: 1.6vmin;
    padding-right: 1.6vmin;
    padding-top: 0.7vmin;
    padding-bottom: 0.7vmin;
    border: solid 0.125rem #ffffff;
    border-radius: 0.6em;
    display:inline-block;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    font-size: 1.4vmin;
}

.background-image {
  position: relative;
  text-align: center;
  color: white;
}

#cont {
    width: 100%;
    height: 6rem;
    background: #ffffff;
    position: relative;
    border-radius: 20px 20px 0 0;
    -webkit-border-radius: 20px 20px 0 0;
    text-align: center;
    box-shadow: 0px -0.5rem 1rem #0000000f;
    margin-top: 2rem
}

.interactives_text {
    color: black;
    font-weight: 900;
    top: 60px;
    right:0;
    left:0;
    text-align: center;
    position: absolute;
}

.circle {
    background: white;
    position: absolute;
    top: -2rem;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 4rem;
    height: 4rem;
    -webkit-border-radius: 20rem;
    border-radius: 20rem;
}

.course-header-container-blue {
    width: 100%;
    background-color: #f0f6ff;
    padding-top: 2rem;
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}

.course-header-container-green {
    width: 100%;
    background-color: #EEF9F3;
    padding-top: 2rem;
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}

.course-header-container-yellow {
    width: 100%;
    background-color: #FFFCE6;
    padding-top: 2rem;
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}

.course-header {
    width: 42.5%;
    display: inline-block;
    padding-left: 7.5%;
    font-weight: 900;
    line-height: 2.6rem;
    color: #000000;
    font-size: 2rem;
    font-family: garamond;
    text-align: left;
    vertical-align: top;
}

.course-subheader {
    width: 48%;
    display: inline-block;
    padding-left: 1%;
    font-size: 1rem;
    text-align: left;
    font-weight: 900;
    color: #000000;
}

.primary-header-container {
    width: 100%;
    background-color: #143256;
}

.primary-header {
    position: absolute;
    width: 100%;
    z-index: 1;
    margin-top: 2rem;
}

.primary-header-title {
    font-weight: 100;
    font-family: "Garamond", serif !important;
    font-size: 2.2rem;
    color: #FFFFFF;
    margin-left: 7.5%;
    font-family: Garamond;
}

.primary-header-image-container {
    overflow: hidden;
    width: 100%;
    z-index: 0;
    position: relative;
}

.primary-header-image {
    width: 40%;
    text-align: left;
    float: left;
    object-fit: cover;
    height: 10rem;
    left: 0;
    position: relative;
    margin-left: 60%;
}

.accordion {
    font-size: 1.2rem;
}

.course-subheader {
    display: block;
    width: 92.5%;
    padding-left: 7.5%;
    padding-top: 1rem;
}

.primary-header-image {
    width: 80%;
    margin-left: 20%;
}

/*KS2 BASE MENU*/

.base-banner-nav {
    background-color: #fff;
    vertical-align: middle;
    padding: 1vh 0.5vh;
    margin: 1em 0em;
    border-radius: 0.6em; 
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    box-shadow: 0px 0px 10px #0000001f;
}

.base-banner-header {
    background-color: #143256;
    vertical-align: middle;
    padding: 0vh 5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.base-banner-middle {
    display: block !important;
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    display: block !important;
}

.base-banner-footer {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 2vh 0vh 0vh;
    border-radius: 0.6em;
}

.base-content-menubox {
    flex-wrap: wrap;
    display: flex !important;
    position: relative;
    background-color: #fafafa;
    vertical-align: middle;
    padding: 5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
    justify-content: center;
}

.base-content-termbox {
    flex-wrap: wrap;
    display: flex;
    position: relative;
    vertical-align: middle;
    justify-content: center;
    padding: 0vh 0vh 1vh 0vh;
}

.base-content-greybox {
    background-color: #fafafa;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.base-content-box-KS2 {
    background-color: #fffce6;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.base-content-box-KS3 {
    background-color: #f0f6ff;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.base-content-box-KS4 {
    background-color: #eef9f3;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.base-content-box-KS5 {
    background-color: #fff0e6;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

/*KS2 BASE STYLES*/

.base-style-banner {
    color: #fff;
    font-size: 2em; 
    font-family: Garamond;
    font-weight: bold;
    /*text-transform: uppercase;*/
    letter-spacing: 0.02em;
}

.base-style-title-w {
    color: #fff;
    font-size: 2.5vh; 
    font-family: Garamond;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.base-style-title {
    color: #414042;
    font-size: 3vh; 
    font-family: Garamond;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.base-style-text {
    color: #414042;
    font-size: 2vh; 
    font-family: 'Dubai', sans-serif;
    font-weight: normal;
}

.base-button-text {
    color: #143256;
    font-size: 1.1vh;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    letter-spacing: 0.01em;
}

.base-nav-img {
    display: inline-block;
    vertical-align: middle;
}

/*KIH SEN CONTENT*/

.kih-banner-main {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044241/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}

.kih-banner-middle {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044243/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    border-radius: 0.6em;
}

.kih-banner-footer {
    display: block !important;
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 2vh 0vh 0vh;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044242/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
    border-radius: 0.6em;
}

/*KS2 BASE BUTTONS*/

.base-button-weeks {
    display: inline-block;
    background-color: #fff;
    vertical-align: middle;
    text-align: center;
    margin: 1vh;
    box-shadow: 0vh 0vh 1vh #0000001f;
    transition: all 0.25s ease;
    border-radius: 0.6em;
}

.base-button-weeks:hover {
    box-shadow: 0vh 0vh 1vh #0000000d;
    opacity: 0.75;
    transition: all 0.25s ease;
    transform: scale(1.05);
}

.base-button-weeks img {
    width: 100% !important;
}

.base-button {
    background-color: #143256;
    color: #fff;
    letter-spacing: 0.02em;
    padding: 0.7rem 0.7rem 0.6rem 0.7rem;
    border: solid 0.125rem #fff;
    border-radius: 0.6em;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 1.5vh;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    transition: all 0.25s ease;
}

.base-button:hover {
    background-color: #fff;
    color: #143256;
}

/*KIH SEN CONTENT*/

.kih-banner-main {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044241/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
}

.kih-banner-middle {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044243/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    border-radius: 0.6em;
}

.kih-banner-footer {
    display: block !important;
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 2vh 0vh 0vh;
    background-image: url('https://weyeducation.instructure.com/courses/17064/files/16044242/preview');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
    border-radius: 0.6em;
}

/*NAV*/

.base-button-nav {
    background-color: #fff;
    padding: 0.8vh 0rem;
    margin: 0vh 0.5vh;
    display: inline-block;
    vertical-align: middle;
    width: 11.5%;
    text-align: center;
    transition: all 0.25s ease;
    border-radius: 0.6em;
}

.base-button-nav:hover, .KS2:hover, .KS3:hover, .KS4:hover, .KS5:hover {
    background-color: #fafafa;
}

.week-carousel-box {
    flex-wrap: wrap;
    display: flex !important;
    position: relative;
    background-color: #fafafa;
    vertical-align: middle;
    padding: 1vh 0.5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
    justify-content: center;
}

.week-carousel-button {
    display: inline-block;
    background-color: #fff;
    vertical-align: middle;
    text-align: center;
    margin: 0.25em;
    border: solid 0.125rem #fff;
    border-radius: 0.25em;
    box-shadow: 0em 0em 1em #0000001f;
    transition: all 0.25s ease;
    border-radius: 0.25em;
}

.week-carousel-button:hover {
    box-shadow: 0vh 0vh 1vh #0000000d;
    opacity: 0.75;
    transform: scale(1.2);
}

.week-carousel-button img {
    width: 100% !important;
}

.square-button {
    display: inline-block;
    background-color: #fff;
    vertical-align: middle;
    text-align: center;
    margin: 1vh;
    box-shadow: 0em 0em 0.25em #0000001f;
    transition: all 0.25s ease;
    border-radius: 0.6em;
}

.square-button:hover {
    box-shadow: 0vh 0vh 1vh #0000000d;
    opacity: 0.75;
    transform: scale(1.05);
}

.square-button img {
    width: 100% !important;
}

.square-disable {
    display: inline-block;
    background-color: #f0f6ff !important;
    vertical-align: middle;
    text-align: center;
    margin: 1vh;
    background-color: #f0f6ff !important;
    border: solid 0.125rem #143256 !important;
    box-shadow: 0em 0em 0.25em #0000001f;
    border-radius: 0.25em;
}

.grey-button {
    margin: 1rem 1rem;
    background-color: #fff;
    color: #000;
    letter-spacing: 0.02em;
    padding: 0.8rem 0.9rem 0.7rem 0.9rem;
    border: solid 0.125rem #bfbfbf;
    border-radius: 0.6em;
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.8rem;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    transition: all 0.25s ease;
}

.grey-button:hover {
    margin: 1rem 1rem;
    background-color: #bfbfbf;
    color: #fff;
    letter-spacing: 0.02em;
    padding: 0.8rem 0.9rem 0.7rem 0.9rem;
    border-radius: 0.6em;
    display: inline-block;
    transform: scale(1.05);
}

.navy-button {
    margin: 1rem 1rem;
    background-color: #fff;
    color: #143256;
    letter-spacing: 0.02em;
    padding: 0.8rem 0.9rem 0.7rem 0.9rem;
    border: solid 0.125rem #143256;
    border-radius: 0.6em;
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.8rem;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    transition: all 0.25s ease;
}

.navy-button:hover {
    margin: 1rem 1rem;
    background-color: #143256;
    color: #fff;
    letter-spacing: 0.02em;
    padding: 0.8rem 0.9rem 0.7rem 0.9rem;
    border-radius: 0.6em;
    display: inline-block;
    transform: scale(1.05);
}

/*TERM TOGGLERS*/

.accordion {
    color: #414042;
    font-size: 1.8vmin;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    letter-spacing: 0.01em;
    background-color: #fafafa;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    transition: all 0.25s ease;
}

.accordion-arrow img {
  transition: all 0.3s;
  max-width: 100%;
}

.accordion-arrow:hover img {
  transform: scale(1.1) rotate(90deg);
}

.accordion-shrink img {
  transition: all 0.3s;
  max-width: 100%;
}

.accordion-shrink:hover img {
  transform: scale(1.1) rotate(180deg);
}

/*HEADER BANNER RESPONSIVE*/

.heading-container {
    background-color: #143256;
    vertical-align: middle;
    border-radius: 0.6em;
    display: flex !important;
    align-items: center;
    max-height: 10em;
    overflow: hidden;
}

.heading-title-container {
    z-index: 1;
    position: absolute;
    width: 90%;
    /*overflow: hidden;*/
}

.heading-image-container {
    z-index: 0;
    position: relative;
    width: 100%;
    border-radius: 0.6em;
    /*overflow: hidden;*/
}

.heading-image-container img {
    display: block !important;
    margin-left: auto;
}

.p-header {
    color: #fff;
    text-indent: 1.5em;
    font-size: 2em;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    letter-spacing: 0.02em;
}

/*MIDDLE BANNER RESPONSIVE*/

.middle-container {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    display: flex !important;
    justify-content: space-between;
    align-items: center;
}

.middle-title-container {
    width: 50%;
}

.p-middle {
    color: #fff;
    font-size: 1.5em; 
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.middle-icon-container {
    text-align: right;
    width: 3em;
}

.middle-icon-container img {
    width: 100% !important;
}

/*COURSE BANNER RESPONSIVE*/

.course-container {
    background-color: #fafafa;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    display: flex !important;
    justify-content: flex-start;
    align-items: center;
}

.course-title-container {
    width: 100%;
}

.course-icon-container {
    display: block !important;
    text-align: left;
    width: 6em;
    margin: 0vh 4vh 0vh 0vh;
}

.course-icon-container img {
    width: 100% !important;
}

.p-course-title {
    color: #000;
    font-size: 1.5em;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.p-course-text {
    color: #000;
    font-size: 1em;
    font-family: 'Dubai', sans-serif;
    font-weight: normal;
}

.course-widget-image {
    border-radius: 2rem;
    width: 100%;
}

.course-widget-title {
    font-family: 'TW Cen MT';
    font-weight: 900;
}

/*INNER ACCORDION RESPONSIVE*/

.emodel-container {
    vertical-align: middle;
    padding: 0vh 5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
    display: flex !important;
    justify-content: space-between;
    align-items: center;
}

.accordion-container {
    color: #414042;
    background-color: #fafafa;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    transition: all 0.25s ease;
}

.inner-container {
    vertical-align: middle;
    display: flex !important;
    justify-content: space-between;
    align-items: center;
}

.inner-title-container {
    vertical-align: middle;
    display: flex !important;
    justify-content: flex-start;
    align-items: center;
}

.inner-title-container img {
    width: 3em !important;
}

.p-term {
    color: #000;
    font-size: 1em; 
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    letter-spacing: 0.01em;
}

.interactive-container {
    background-color: #fafafa;
    color: #414042;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
    display: flex !important;
    justify-content: flex-start;
    align-items: center;
    transition: all 0.25s ease;
}

.interactive-info-container {
    width: 100%;
    color: #414042;
    font-size: 2vh;
    font-family: 'Dubai', sans-serif;
    font-weight: normal;
}

/*CLUB BASE MENU*/

.club-banner-nav {
    background-color: #fff;
    vertical-align: middle;
    padding: 1vh 0.5vh;
    margin: 1em 0em;
    border-radius: 0.6em; 
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    box-shadow: 0px 0px 10px #0000001f;
}

.club-banner-header {
    background-color: #143256;
    vertical-align: middle;
    padding: 0vh 5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.club-banner-middle {
    background-color: #dbe2ec;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.club-banner-footer {
    background-color: #143256;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 2vh 0vh 0vh;
    border-radius: 0.6em;
}

.club-content-menubox {
    flex-wrap: wrap;
    display: flex;
    position: relative;
    background-color: #fafafa;
    vertical-align: middle;
    padding: 5vh;
    margin: 1em 0em;
    border-radius: 0.6em;
    justify-content: center;
}

.club-content-termbox {
    flex-wrap: wrap;
    display: flex;
    position: relative;
    vertical-align: middle;
    justify-content: center;
    padding: 0vh 0vh 1vh 0vh;
}

.club-content-greybox {
    background-color: #fafafa;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

.club-content-bluebox {
    background-color: #f0f6ff;
    vertical-align: middle;
    padding: 0.8em 3em;
    margin: 1em 0em;
    border-radius: 0.6em;
}

/*CLUB BASE STYLES*/

.club-style-banner {
    color: #fff;
    font-size: 2em; 
    font-family: Garamond;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.club-style-title {
    color: #414042;
    font-size: 3vh; 
    font-family: Garamond;
    font-weight: bold;
    letter-spacing: 0.02em;
}

.club-style-text {
    color: #414042;
    font-size: 2vh; 
    font-family: 'Dubai', sans-serif;
    font-weight: normal;
}

/*CLUB BASE BUTTONS*/

.club-button-weeks {
    display: inline-block;
    background-color: #fff;
    vertical-align: middle;
    text-align: center;
    margin: 1vh;
    box-shadow: 0vh 0vh 1vh #0000001f;
    transition: all 0.25s ease;
    border-radius: 0.6em;
}

.club-button-weeks:hover {
    box-shadow: 0vh 0vh 1vh #0000000d;
    opacity: 0.75;
}

.club-button {
    background-color: #fff;
    color: #143256;
    letter-spacing: 0.02em;
    padding: 0.7rem 0.7rem 0.6rem 0.7rem;
    border: solid 0.125rem #143256;
    border-radius: 0.6em;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    font-size: 1.5vh;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    transition: all 0.25s ease;
}

.club-button:hover {
    background-color: #143256;
    color: #fff;
}

.club-footer-button {
    background-color: #143256;
    color: #fff;
    letter-spacing: 0.02em;
    padding: 0.7rem 0.7rem 0.6rem 0.7rem;
    border: solid 0.125rem #fff;
    border-radius: 0.6em;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 1.5vh;
    font-family: 'Dubai', sans-serif;
    font-weight: bold;
    text-transform: uppercase; 
    transition: all 0.25s ease;
}

.club-footer-button:hover {
    background-color: #fff;
    color: #143256;
}

.button-text {
    text-align: left;
}

.profile-container {
    width: 100%;
    flex-wrap: wrap;
    display: flex;
    position: relative;
    align-items: center;
}

.container-photo {
    width: 50%;
}

.container-photo img {
    width: 50%;
    display: block;
    margin-left: auto;
    padding: 2vh 6vh;
}

.container-info {
    width: 50%;
}

/*BG COLOURS*/

.bg-yellow {
    background-color: #FFFCE5 !important;
}

.bg-blue {
    background-color: #EBF2FA !important;
}

.bg-mint, .bg-green {
    background-color: #EBFAF1 !important;
}

.bg-orange {
    background-color: #FFF0E5 !important;
}

.bg-navy {
    background-color: #D0DDEC !important;
}

/*WEEK NUMBER REPLACER*/

.interhighcurrentweek, .current-week {
  font-size: 0;
}

.interhighcurrentweek::after {
  content: "Week 28";
  text-align: right;
  font-size: 1.5vw;
  color: #7f7f7f;
  margin-right: 6%;
  font-family: "Century Gothic";
  line-height: initial;
}

.base-style-week::after {
    content: "Week 28";
    color: #fff;
    font-size: 2.5vh;
    font-family: Garamond;
    font-weight: bold;
    text-align: right;
}

/*KEEP Week LOWERCASE*/

.current-week::after {
    content: "Week 28";
    font-size: 2.5vh;
}

/*CHANGE CLASS to WEEK NUMBER, 01, 02, 03, to 33, 34, 35.*/

.week28 {
    background-color: #f0f6ff !important;
    border: solid 0.125rem #143256 !important;
    border-radius: 0.6em;
}

/*TERM DISPLAY, from NONE to BLOCK to show TERM, from BLOCK to NONE to hide TERM*/

.term01 {display: none;}

.term02 {display: none;}

.term03 {display: block;}

/*Discovery Assignments*/

.css-moeo4d {
    padding: 0.25rem !important;
    background-color: rgb(245, 245, 245);
    height: 100%;
}
    
.css-v4a1zm {
    border-radius: 4px;
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0.0625rem 0.125rem, rgba(0, 0, 0, 0.1) 0px 0.0625rem 0.1875rem;
    transition: all 300ms ease 0s;
    max-width: 100% !important;
    margin: 0rem !important;
    border: 1px solid rgb(199, 205, 209);
}
    
.css-xwy9rq {
    box-sizing: border-box;
    padding: 0.5rem !important;
    transition: all 300ms ease 0s;
    min-height: 100%;
    width: 100% !important;
}

.user_content, iframe {
    width: 100% !important;
}

iframe {
    width: 100% !important;
}

/*JMR TERMS MEDIA QUERIES*/

@media screen and (max-width: 857px) {
    .base-button-weeks, .club-button-weeks, .square-button, .square-disable, .sld-button-menu, .course-title-container, .interactive-info-container, .heading-image-container img {width: 100% !important; }
    .course-container, .interactive-container {flex-direction: column;}
    .course-title-container, .interactive-info-container {width: 100%;}
    .course-icon-container {display: none;}
    .base-nav-img {width: 50% !important; }
    .week-carousel-button {width: 12% !important; }
    .profile-container {flex-direction: column; }
    .container-info, .container-photo {width: 100%;}
    .container-photo img {width: 70%; display: block; margin-left: auto; margin-right: auto; padding: 2vh; }
    .base-style-title, .base-style-text, .button-text {text-align: center; }
    .heading-image-container img {width: 80% !important; opacity: 0.3;}
}

@media screen and (min-width: 858px) and (max-width: 1139px) {
    .base-button-weeks, .club-button-weeks, .sld-button-menu {width: 45% !important; }
    .base-nav-img, .square-button, .square-disable {width: 30% !important; }
    .week-carousel-button {width: 8% !important; }
    .container-info, .container-photo {width: 100%;}
    .container-photo img {width: 70%; display: block; margin-left: auto; margin-right: auto; padding: 2vh; }
    .base-style-title, .base-style-text, .button-text {text-align: center; }
    .interactive-info-container {width: 100% !important;}
    .heading-image-container img {width: 40% !important; }
}

@media screen and (min-width: 1140px) and (max-width: 1516px) {
    .base-button-weeks, .sld-button-menu {width: 30% !important; }
    .club-button-weeks {width: 23% !important; }    
    .base-nav-img, .square-button, .square-disable {width: 20% !important; }
    .week-carousel-button {width: 4% !important; }
    .heading-image-container img {width: 30% !important;}
}

@media screen and (min-width: 1517px) {
    .base-button-weeks, .sld-button-menu {width: 23% !important; }
    .club-button-weeks {width: 18% !important; }    
    .base-nav-img, .square-button, .square-disable {width: 15% !important; }
    .week-carousel-button {width: 2% !important; }
    .heading-image-container img {width: 20% !important;}
}

/*JMR GENERAL MEDIA QUERIES*/

@media screen and (max-width: 480px) {
    .mobile { display: inline-block; }
    .tablet, .desktop { display: none; }
}

@media screen and (min-width: 481px) and (max-width: 1374px) {
    .mobile, .desktop { display: none; }
    .tablet { display: inline-block; }
}

@media screen and (min-width: 1375px) {
    .mobile, .tablet { display: none; }
    .desktop { display: inline-block; }
}

/*CS MEDIA QUERIES*/

@media only screen and (max-width:1700px){
    .primary-header-image {width: 50%; margin-left: 50%; }
}

@media only screen and (max-width:1600px){
    .primary-header-image { width: 80%; margin-left: 30%; }
}

@media only screen and (max-width:1500px){
    .primary-header-image { width: 80%; margin-left: 30%; }
}

@media only screen and (max-width:1400px){
    .primary-header-image { width: 100%; margin-left: 30%;}
}

@media only screen and (max-width:1200px){
    .course-header { display: block; width: 92.5%; }
}

@media only screen and (max-width:1000px){
    .primary-header-image {width: 90%; margin-left: 10%; }
}

@media only screen and (max-width:900px){
    .primary-header-image { width: 100%; margin-left: 0; }
}