html, body {
    font-weight: 300;
    overflow-x: hidden !important;
    font-size: 15px;
    min-height: 100%;
}

html {
    background-color: #ededed;
}

body {
    background-color: transparent;
}

html.splash {
    background: url(../img/background.png);
    background-size: cover;
    background-position: center center;
}

html.splash #main-nav-bottom {
    background: none;
    border: none;
}

html.splash #side-nav-btn {
    border: none;
    color: #ffffff;
}

html.splash #side-nav-btn.active {
    color: #292b2c;
}

html.splash #side-nav-btn ul li {
    background: #ffffff;
}

html.splash #side-nav-btn.active ul li {
    background: #292b2c;
}

html.splash #useful-docs-btn,
html.splash #lbToggleMsgBtn {
    background: none;
    color: #ffffff;
}

html.splash #useful-docs-btn .btn-tooltip,
html.splash #lbToggleMsgBtn .btn-tooltip {
    background-color: transparent;
    border: none;
    color: #ffffff;
}

.splash-title {
    font-size: 3rem;
}

.card-block-splash-content {
    min-height: 411px;
}

.splash-tab-content {
    min-height: 520px;
}

.display-none {
    display: none;
}

.search-ddl {
    width: 500px !important;
}

.splash .container-fluid {
    padding: 0px 25px;
    width: 1200px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top: 54.5px;
}

.splash #felSplash_panSplashC2KLogin div:first-child,
.splash #felSplash_panSplashNonC2KLogin div:first-child {
    width: 100% !important;
    margin-left: 0 !important;
    -webkit-flex: auto;
    -ms-flex: auto;
    flex: auto;
    max-width: 100%;
}

.splash #felSplash_panSplashC2KLogin .card,
.splash #felSplash_panSplashNonC2KLogin .card {
    box-shadow: none !important;
    border: 1px solid #dddddd !important;
    background-color: #fafafa;
}

.home-col {
    display: block;
    float: left;
    width: 40%;
}

.home-col:first-child {
    width: 60%;
}

.home-col .nav-tabs .nav-item {
    font-size: 1.25rem;
    padding: 10px 0px;
    margin-bottom: -2px;
}

.home-col .md-pills.pills-ins .nav-item .nav-link {
    color: #ffffff;
}

.home-col .md-pills.pills-ins .nav-item .nav-link.active {
    background: #ffffff;
    box-shadow: none;
    border-radius: 0px;
    color: #292b2c;
}

#main-nav {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
}

#main-nav {
    font-size: 1.5em;
}

#main-nav-top {
    display: block;
    z-index: 1001;
    background: #0c334d;
    border-top: 2px solid #EF95BC;
    color: #ffffff;
    padding: .5rem 1rem;
    width: 100%;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
}

#main-nav-top .main-nav-title,
#main-nav-top a {
    font-size: 1.5rem;
    line-height: 2.5rem;
}

#main-nav-top .title-admin {
    color: #fff;
}

#hlLogout {
    font-size: 1.25rem !important;
}

#ccea-logo {
    position: absolute;
    font-size: 66px;
    line-height: 54px;
    margin-top: -9px;
}

.main-nav-title {
    margin-left: 81px;
}

.change-lang-btn {
    font-size: 0.8rem !important;
    padding: 0 1rem;
    margin: 0;
    color: #0c334d !important;
    vertical-align: top;
}

.change-lang-btn i {
    font-size: 1.5rem;
    margin-top: -0.4rem;
}

.change-lang-btn.en {
    background: #EF95BC;
}

.change-lang-btn.ga {
    background: #F3B619;
}

#app-switcher-btn {
    display: inline-block;
    color: #fff;
    font-weight: 400;
    background-color: rgba(0,0,0,0.2);
    font-size: 15px;
    vertical-align: top;
    line-height: 52px;
    padding: 0px 15px;
    text-align: center;
    cursor: pointer;
    position: absolute;
    top: 2px;
    margin-left: 20px;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#app-switcher-btn i {
    font-size: 1.5em;
}

#app-switcher-btn:hover,
#app-switcher-btn.active {
    color: #0a2d44;
    background-color: #EF95BC;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#app-switcher-options {
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.8);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#app-switcher-options.active {
    opacity: 1;
    visibility: visible;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#app-switcher-container {
    display: block;
    position: absolute; 
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

#app-switcher-title {
    display: block;
    width: 100%;
    text-align: center;
    color: #fff;
    margin-bottom: 30px;
    opacity: 0;
    margin-top: 30px;
}

#app-switcher-options.active #app-switcher-title {
    opacity: 1;
    margin-top: 0px;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#app-switcher-title h2 {
    margin: 0;
}

#app-switcher-options ul {
    display: block;
    width: 630px;
    height: 630px;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#app-switcher-options ul li {
    display: block;
    float: left;
    font-size: 1.5em;
    width: 300px;
    height: 300px;
    color: #fff;
    position: relative;
    overflow: hidden;
    margin-top: 30px;
    transition: all 0.3s ease 0.3s;
	-webkit-transition: all 0.3s ease 0.3s;
	-o-transition: all 0.3s ease 0.3s;
    opacity: 0;
}

#app-switcher-options.active ul li {
    margin-top: 0;
}

#app-switcher-options ul li:hover {
    background: #000 !important;
    transition: all 0.3s ease 0s !important;
	-webkit-transition: all 0.3s ease 0s !important;
	-o-transition: all 0.3s ease 0s !important;
}

#app-switcher-options ul li div {
    display: block;
    position: absolute;
    text-align: center;
    width: 100%;
    padding: 15px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
}

.app-icon, .app-title {
    display: inline-block !important;
    height: auto !important;
    vertical-align: middle;
}

.app-icon {
    font-size: 58px !important;
    margin-right: 10px;
}

.app-title {
    max-width: 196px !important;
    font-size: 24px !important;
    line-height: 32px;
    text-align: left;
    font-weight: 500;
}

.app-watermark {
    font-size: 400px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.05;
    z-index: 0;
}

#task-exemp-option .app-watermark {
    color: #fff;
    opacity: 0.05;
}

#task-exemp-option:hover .app-watermark {
    opacity: 0.1;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#task-support-option .app-watermark {
    color: #000;
    opacity: 0.05;
}

#task-support-option:hover .app-watermark {
    color: #fff;
    opacity: 0.1;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

#interactive-lop-option .app-watermark {
    color: #fff;
    opacity: 0.1;
}

#app-switcher-options.active #task-exemp-option {
    background-color: #0c334d;
    margin: 0px 30px 30px 0px;
    opacity: 1;
    transition: background-color 0.3s ease 0s, margin 0.2s ease 0.2s, opacity 0.2s ease 0.2s;
	-webkit-transition: background-color 0.3s, ease 0s margin 0.2s ease 0.2s, opacity 0.2s ease 0.2s;
	-o-transition: background-color 0.3s ease 0s, margin 0.2s ease 0.2s, opacity 0.2s ease 0.2s;
}

#app-switcher-options.active #cancel-option {
    margin: 0px 0px 30px 0px;
    cursor: pointer;
    opacity: 1;
    transition: background-color 0.3s ease 0s, margin 0.2s ease 0.8s, opacity 0.2s ease 0.8s;
	-webkit-transition: background-color 0.3s, ease 0s margin 0.2s ease 0.8s, opacity 0.2s ease 0.8s;
	-o-transition: background-color 0.3s ease 0s, margin 0.2s ease 0.8s, opacity 0.2s ease 0.8s;
}

#cancel-option i {
    font-size: 60px
}

#app-switcher-options.active #task-support-option {
    background-color: #11cae9;
    margin: 0px 30px 0px 0px;
    opacity: 1;
    transition: background-color 0.3s ease 0s, margin 0.2s ease 0.4s, opacity 0.2s ease 0.4s;
	-webkit-transition: background-color 0.3s, ease 0s margin 0.2s ease 0.4s, opacity 0.2s ease 0.4s;
	-o-transition: background-color 0.3s ease 0s, margin 0.2s ease 0.4s, opacity 0.2s ease 0.4s;
}

#app-switcher-options.active #interactive-lop-option {
    background-color: #002049;
    color: #cfbafc  !important;
    opacity: 1;
    transition: background-color 0.3s ease 0s, margin 0.2s ease 0.6s, opacity 0.2s ease 0.6s;
	-webkit-transition: background-color 0.3s, ease 0s margin 0.2s ease 0.6s, opacity 0.2s ease 0.6s;
	-o-transition: background-color 0.3s ease 0s, margin 0.2s ease 0.6s, opacity 0.2s ease 0.6s;
}

#app-switcher-options a {
    text-decoration: none;
}

#fs-btn,
#fs-exit-btn {
    padding: .25rem;
    font-size: 2rem;
    line-height: 1rem;
    margin: 0 .5rem;
    cursor: pointer;
    display: inline-block;
}

#fs-exit-btn {
    display: none;
}

#main-nav-bottom {
    background: #ffffff;
    border-bottom: 1px solid #d2d2d2;
}

.admin-nav #main-nav-bottom {
    font-size: 15px;
}

#side-nav-btn {
    margin: 0;
    width: 320px;
    padding: 15px;
    border-right: 1px solid #d2d2d2;
    cursor: pointer;
    height: 66px;
}

#side-nav-btn ul {
    margin: 0;
    width: 24px;
}

#side-nav-btn ul,
#side-nav-btn span {
    display: inline-block;
}

#side-nav-btn span {
    margin-left: 15px;
}

#side-nav-btn ul li {
    width: 100%;
    height: 3px;
    background: #292b2c;
    margin: 4px 0px;
}

#side-nav-btn ul li:first-child {
    margin-top: 0px !important;
}

#side-nav-btn ul li:last-child {
    margin-bottom: 0px !important;
}

#side-nav-btn.active ul li {
    transform: scaleX(0.65);
    -ms-transform-origin: center; /* IE 9 */
    -webkit-transform-origin: center; /* Chrome, Safari, Opera */
    transform-origin: center;
}

#side-nav-btn.active ul li:first-child {
    transform: scaleX(1);
    transition: none !important;
}

#side-nav-btn.active ul li:last-child {
    transform: scaleX(0.25);
}

#side_nav {
    position: fixed;
    width: 320px;
    left: -320px;
    height: 100%;
    background: #ffffff;
    border-right: 1px solid #d2d2d2;
    overflow: hidden;
}

#side_nav .side-nav-content {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

#side_nav .row {
    padding: 15px;
}

#side_nav ul li a {
    padding: 5px 15px;
    font-size: 1.15em;
    display: block;
    margin-bottom: 5px;
}

#cbRangeFrom + label,
#cbRangeTo + label,
#cbYear1 + label, 
#cbYear2 + label,
#cbTerm1 + label,
#cbTerm2 + label {
    display: block;
    clear: both;
}

a,
#lbOpenTaskOrder,
#lbOpenSubmission {
    color: #292b2c;
}

#side_nav ul li a i {
    font-size: 1.25em;
}

.side-nav-filter {
    margin: 0px;
}

.side-nav-filter li label {
    max-width: 240px;
}

.side-nav-filter li a {
    padding: 0 !important;
    margin: 0 !important;
    font-size: 20px !important;
}

.top-level {
    border-bottom: 1px solid #dddddd;
    font-size: 1.15em;
    padding: 15px;
}

.top-level:first-child,
.top-level-first {
    border-top: 1px solid #dddddd;
}

.top-level.collapsible {
    padding: 0;
}

.top-level span.filter-section-title {
    cursor: pointer;
    padding: 15px;
    display: block;
}

.top-level i {
    font-size:1.5em;
}

.top-level.open {
    background: #f7f7f7;
}

.top-level.open i {
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
    transform: rotate(180deg);
}

.top-level.open .filter-section-title {
    -webkit-box-shadow: 0 10px 8px -8px rgba(0,0,0,0.29);
	   -moz-box-shadow: 0 10px 8px -8px rgba(0,0,0,0.29);
	        box-shadow: 0 10px 8px -8px rgba(0,0,0,0.29);
}

.top-level.open .second-level,
.second-level .form-group.open .third-level {
    display: block;
}

.second-level {
    display: none;
    padding: 15px;
}

.third-level {
    display: none;
    padding: 0px 0px 0px 35px;
}

.second-level a {
    box-shadow: none !important;
    font-size: 0.8em !important;
    padding: 0.35em 0 0 !important;
    color: #52c990 !important;
    z-index: 2;
}

.second-level a i {
    font-size: 1em;
}

.second-level .see-less,
.second-level .open .see-more {
    display: none;
}

.second-level .open .see-less {
    display: block;
}

#side_nav,
#main_container {
    padding: 120px 0px 0px;
}

#side_nav.menu-open {
    left: 0px;
    z-index: 1;
}

#side_nav .form-group {
    margin-bottom: 0;
}

#side_nav .form-inline .form-group {
    margin: 1rem 1.75rem 1rem 0rem;
}

/* Radio With gap - adapted from mdb.css for radiobuttonlist compatibility */
.with-gap [type="radio"]:checked + label:before {
  border-radius: 50%;
  border: 2px solid #4285F4; 
}

.with-gap [type="radio"]:checked + label:after {
  border-radius: 50%;
  border: 2px solid #4285F4;
  background-color: #4285F4;
  z-index: 0;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5); 
}

/* Task/Exemp Radio Buttons */
.with-gap.filter-by-task [type="radio"] + label:before {
    border: 2px solid #0c334d;
}

.with-gap.filter-by-task [type="radio"]:checked + label:after {
    border: 2px solid #0c334d;
    background-color: #0c334d;
}

.with-gap.filter-by-exemplification [type="radio"] + label:before {
    border: 2px solid #EF95BC;
}

.with-gap.filter-by-exemplification [type="radio"]:checked + label:after {
    border: 2px solid #EF95BC !important;
    background-color: #EF95BC !important;
}
/* END Task/Exemp Radio Buttons */

/* Task/Exemp Checkboxes - adapted from mdb.css for checkboxlist compatibility */
#side_nav_content input[type="checkbox"]:not(:checked) + label:before,
.filled-in input[type="checkbox"]:not(:checked) + label:before {
    width: 0;
    height: 0;
    border: 3px solid transparent;
    left: 6px;
    top: 10px;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 20% 40%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

#side_nav_content input[type="checkbox"]:not(:checked) + label:after,
.filled-in input[type="checkbox"]:not(:checked) + label:after {
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #5a5a5a;
    top: 0px;
    z-index: 0;
}

#side_nav_content input[type="checkbox"] + label:before, 
#side_nav_content input[type="checkbox"] + label:after,
.filled-in input[type="checkbox"] + label:before, 
.filled-in input[type="checkbox"] + label:after {
    content: '';
    left: 0;
    position: absolute;
    transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
    z-index: 1;
}

#side_nav_content input[type="checkbox"] + label:after,
.filled-in input[type="checkbox"] + label:after {
    border-radius: 2px;
}

#side_nav_content input[type=checkbox]:checked+label:before,
.filled-in input[type=checkbox]:checked+label:before {
    top: 0;
    left: 1px;
    width: 8px;
    height: 13px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

#side_nav_content input[type=checkbox]:checked+label:after,
.filled-in input[type=checkbox]:checked+label:after {
    top: 0;
    width: 20px;
    height: 20px;
    border: 2px solid #0c334d;
    background-color: #0c334d;
    z-index: 0;
}

#side_nav_content .partial input[type=checkbox]:checked + label:before {
    display: none;
}
#side_nav_content .partial input[type=checkbox]:checked + label:after {
    background-color:rgba(12, 51, 77, 0.6);
}

/* END Task/Exemp Checkboxes */

#lbClearFilters {
    padding: 1rem;
    background: #eeeeee;
    color: #616161;
    width: 100%;
    display: block;
}

#lbClearFilters:hover {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
}

#side_nav #filterBlocker {
    background: rgba(255,255,255, 0.9);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#side_nav #filterBlockerMsg {
    transform: translate(-50%, -50%);
    position: absolute;
    left: 50%;
    top: 50%;
    width: 90%;
    padding: 1.5rem;
    background: #dddddd;
    border: 1px solid #cccccc;
}
#divSearchContainer #searchBlocker {
    background: #fff;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

#main_container.menu-open {
    /*transform: translateX(320px);*/
    margin-left: 320px;
    overflow-x: hidden;
}

/* Useful Docs styles */
/*.task-exemp-search #useful-docs {
    position: absolute;
    width: 385px;
    border: 1px solid #d3d3d3;
    border-right: 0 !important;
    background: #ffffff;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    right: -451px;
    margin-top: -67px;
}

.task-exemp-search #useful-docs:hover{
	right: -68px;
	transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

.task-exemp-search #useful-docs i {
    margin-left: -67px;
    font-size: 1.5em;
    padding: 15px;
    position: absolute;
}

.task-exemp-search .useful-docs-content {
    display: inline-block;
    float: left;
}*/

.task-exemp-search #useful-docs h4 {
    padding: 20px 20px 0;
    font-weight: 400;
}
.task-exemp-search #useful-docs h5 {
    padding-top: 10px;
    font-weight: 400;
}
.task-exemp-search #useful-docs h6 {
    margin: 10px 0 0 0;
    font-weight: 400;
}
.task-exemp-search #useful-docs ul {
    padding: 0 20px;
}
.task-exemp-search #useful-docs li {
	font-size: 0.6em;
    list-style:none;
}
.task-exemp-search #useful-docs a {
	text-decoration: none;
	color: #333333;
}
.task-exemp-search #useful-docs a:hover {
	text-decoration: underline;
}
/* END Useful Docs styles */

#upanSearch {
    position: absolute;
    height: 66px;
    margin-left: 320px;
    margin-top: -66px;
    z-index: 0;
}

#panSearch {
    /*display: inline;*/
}

#txtSearch {
    display: block;
    float: left;
    height: 66px;
    width: 100%;
    position: relative;
    padding: 0px  141px 0px 15px;
    border: none !important;
    box-shadow: none;
    box-sizing: inherit;
    font-size: inherit;
}

/*#search-btn-wrapper {
    position: absolute;
    right: -60px;
}*/

#search-btn,
#useful-docs-btn,
#lbToggleMsgBtn,
#btt-btn {
    display: block;
    font-size: 32px;
    line-height: 32px;
    padding: 15.5px;
    margin-top: 0;
    cursor: pointer;
    height: 66px;
}

#search-btn,
#useful-docs-btn,
#lbToggleMsgBtn {
    position: absolute;
}

#search-btn a {
    color: #0c334d;
}

#btt-btn {
    position: fixed;
    bottom: 25px;
    right: 0;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    border-right: none !important;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.08),0 2px 10px 0 rgba(0,0,0,.06);
    z-index: 10;
}

#btt-btn:hover {
    background-color: #fcfcfc;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
}

#btt-btn.show {
    opacity: 1;
    visibility: visible;
}

#search-btn {
    right: 63px;
}

#useful-docs-btn {
    right: 0px;
    background-color: #212121;
    color: #ffffff;
}

#lbToggleMsgBtn {
    right: 0px;
    background-color: #dddddd;
    color: #0c334d;
}

#lbToggleMsgBtn i.icon-comment {
    display: inline-block;
}

#lbToggleMsgBtn.msg-hide i.icon-comment {
    display: none;
}

#lbToggleMsgBtn i.icon-comment-hide {
    display: none;
}

#lbToggleMsgBtn.msg-hide i.icon-comment-hide {
    display: inline-block;
}

#useful-docs-modal .modal-content {
    border: none !important;
    border-radius: 0 !important;
}

#results-per-page p,
#results-per-page select,
#arrange-results-by p,
#arrange-results-by select {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0;
}

#results-per-page select,
#arrange-results-by select {
    background: #dbdbdb;
    font-size: 1em;
    padding: 10px;
    border: none;
    text-align: center;
}

.mint {
    background-color: #EF95BC !important;
}

.text-mint {
    color: #EF95BC !important;
}

i.icon-communication {
    color: #3fb3b9;
}
i.icon-maths {
    color: #f3a21e;
}
i.icon-uict {
    color: #c85c9f;
}

.task-card,
.exemplification-card,
.linked-exemplification-card,
.foundation-card,
.foundation-video-card {
    cursor: pointer;
    box-shadow: none;
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

.border-top-purple,
.foundation-card,
.foundation-video-card {
    border-top: 2px solid #551771;
}

.border-top-navy,
.task-card {
    border-top: 2px solid #0c334d;
}

.border-top-mint,
.exemplification-card,
.linked-exemplification-card {
    border-top: 2px solid #EF95BC;
}

.linked-exemplification-card {
    padding-top: 0 !important;
}

.card-container .icons i.icon-task {
    color: #0c334d !important;
}

.card-container .icons i.icon-exemplification {
    color: #EF95BC !important;
}

#panResults .card-container {
    position: relative;
    display: flex;
}

.card-container .card {
    padding-top: 1.5rem;
    flex: 1 0 100%;
}

.card-container .icons {
    position: absolute;
    z-index: 1;
    right: 1.25rem;
    padding: 1rem 1.25rem 0 0;
}

.card-container .icons i.icon-gaeilge,
.card-container .icons i.icon-gaeilge {
    color: #ffeb3b !important;
}

.task-card .card-title a {
    display: block;
}

.task-details .nav-tabs,
.useful-docs-modal-content .nav-tabs,
.order-details .nav-tabs,
#panSchoolSubmission .nav-tabs {
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #dddddd;
}

.task-details .md-pills li,
.useful-docs-modal-content .md-pills li,
.order-details .md-pills li {
    padding: 0;
    vertical-align: middle;
    width: 33.33%;
}

#panSchoolSubmission .md-pills li {
    padding: 0;
    vertical-align: middle;
    width: 20%;
}

#panSchoolSubmission .themed-tabs .light-tabs li {
    width: 33%;
}

#panSchoolSubmission .themed-tabs .light-tabs li a {
    font-size: 1.25rem;
    background-color: #dddddd;
}

#panSchoolSubmission .themed-tabs .light-tabs li a.active,
#panSchoolSubmission .themed-tabs .light-tabs li a.comm-nav-link.active,
#panSchoolSubmission .themed-tabs .light-tabs li a.um-nav-link.active {
    background-color: #ffffff !important;
}

#panSchoolSubmission .themed-tabs .light-tabs li a.comm-nav-link.active {
    border-top: 3px solid #3fb3b9;
}

#panSchoolSubmission .themed-tabs .light-tabs li a.um-nav-link.active {
    border-top: 3px solid #f3a21e;
}

#panSchoolSubmission .tabs-wrapper {
    margin: 0 1.5rem;
}

#panSchoolSubmission .classic-tabs li a i {
    margin-right: .25rem;
}

#panSchoolSubmission .classic-tabs li:first-child {
    margin-left: 0;
}

.classic-tabs li:first-child {
    margin-left: 1.5rem;
}

.task-details .md-pills .nav-item .nav-link.active,
.useful-docs-modal-content .md-pills .nav-item .nav-link.active,
.order-details .md-pills .nav-item .nav-link.active,
#panSchoolSubmission .md-pills .nav-item .nav-link.active {
    border-bottom: 1px solid #ffffff;
    border-top: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
}

.useful-docs-modal-content .md-pills .nav-item .nav-link.active,
#panSchoolSubmission .md-pills .nav-item .nav-link.active {
    background-color: #ffffff !important;
}

#panSchoolSubmission .md-pills .nav-item .nav-link,
#panSchoolSubmission .md-pills .nav-item .nav-link.active {
    color: #292b2c;
    font-size: 1.25rem;
}

#panSchoolSubmission .themed-tabs .tab-content {
    border-top: none;
    padding: 0;
}

.md-pills.pills-ins .nav-item .nav-link i {
    font-size: 1.25em;
} 

.md-pills.pills-ins .nav-item .nav-link span {
    display: none;
}

.md-pills.pills-ins .nav-item .nav-link.active span {
    display: inline-block;
    font-size: 1.25em;
}

.comm-bg {
    background: #3fb3b9 !important;
}

.um-bg {
    background: #f3a21e !important;
}

.uict-bg {
    background: #c85c9f !important;
}

.comm-color {
    color: #3fb3b9 !important;
}

.um-color {
    color: #f3a21e !important;
}

.uict-color {
    color: #c85c9f !important;
}

.comm-nav-link.active,
.um-nav-link.active,
.uict-nav-link.active {
    background: none !important;
}

.comm-nav-link.active,
.card-comm .tab-skill-title,
.view-comm .tab-skill-title {
    color: #3fb3b9 !important;
}

.um-nav-link.active,
.card-maths .tab-skill-title,
.view-maths .tab-skill-title {
    color: #f3a21e !important;
}

.uict-nav-link.active,
.card-ict .tab-skill-title,
.view-ict .tab-skill-title {
    color: #c85c9f !important;
}

.tab-skill-title {
    font-size: 1.25rem;
    margin-bottom: .5rem;
    display: inline-block;
}

.task-details .tab-content,
.useful-docs-modal-content .tab-content,
.order-details .tab-content {
    padding: 15px 0px;
}

.useful-docs-modal-content .tab-content {
    border: 1px solid #dddddd;
    background-color: #ffffff;
    border-top: none;
    padding: 1rem 1rem;
}

.task-details .row,
.useful-docs-modal-content .row,
.order-details .row {
    margin-bottom: 0px;
}

.task-details .indicator {
    background-color: #f2f2f2;
    width: auto;
    height: 28px;
    line-height: 28px;
    font-size: 14px;
    padding: 0px 10px;
    display: inline-block;
    position: relative;
    margin-right: 5px;
    margin-bottom: 5px;
    border-radius: 5px;
    vertical-align: bottom;
}

.task-details .indicator:first-child {
    font-weight: 500;
    background-color: #dbdbdb;
}

.indicator-pbl {
    /*background-color: yellow !important;*/
}
.indicator-comm {
    color: #fff !important;
    background-color: #3fb3b9 !important;
}
.indicator-maths {
    color: #fff !important;
    background-color: #f3a21e !important;
}

.btn-navy {
    background-color: #0c334d;
}

.btn-ks3 {
    background-color: #4CB1C1;
}

.btn-admin-nav {
    background-color: transparent;
    color: #0c334d !important;
    box-shadow: none;
    border-radius: 0px;
}

.btn-admin-nav:hover {
    background-color: #0c334d;
    color: #fff !important;
}

.animate {
    transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease;
}

.hidden {
    display: none !important;
}

.margin-top {
    margin-top: 15px;
}

.margin-top-2em {
    margin-top: 2em;
}

.margin-top-3em {
    margin-top: 3em;
}

.margin-bottom {
    margin-bottom: 15px;
}

/* Key Stage Radio Buttons */
.with-gap.filter-key-stage-foundation-video {
    margin-left: 30px;
}
#filterIndent {
    float: left;
    margin-left: 0.5em;
}

.with-gap.filter-key-stage-foundation [type="radio"] + label:before,
.with-gap.filter-key-stage-foundation-video [type="radio"] + label:before {
    border: 2px solid #551771;
}

.with-gap.filter-key-stage-foundation [type="radio"]:checked + label:after,
.with-gap.filter-key-stage-foundation-video [type="radio"]:checked + label:after {
    border: 2px solid #551771;
    background-color: #551771;
}

.with-gap.key-stage-ks1-ks2 [type="radio"] + label:before,
.with-gap.filter-key-stage-ks1-ks2 [type="radio"] + label:before {
    border: 2px solid #eb407a;
}

.with-gap.key-stage-ks1-ks2 [type="radio"]:checked + label:after,
.with-gap.filter-key-stage-ks1-ks2 [type="radio"]:checked + label:after {
    border: 2px solid #eb407a;
    background-color: #eb407a;
}

.with-gap.key-stage-ks3 [type="radio"] + label:before,
.with-gap.filter-key-stage-ks3 [type="radio"] + label:before {
    border: 2px solid #44afc1;
}

.with-gap.key-stage-ks3 [type="radio"]:checked + label:after,
.with-gap.filter-key-stage-ks3 [type="radio"]:checked + label:after {
    border: 2px solid #44afc1;
    background-color: #44afc1;
}
/* END Key Stage Radio Buttons */

.filled-in input[type="checkbox"]:checked + label:after {
    border: 2px solid #0c334d;
    background-color: #0c334d;
}

#lvCardsPager {
    margin: 0 auto;
}

.themed-tabs .light-tabs li a.active  {
    border: none;
    background-color: white;
    z-index: +2;
    border-left: 1px solid #eceeef;
    border-right: 1px solid #eceeef;
}
.themed-tabs .light-tabs li a.tab-navy-border.active  {
    border-top: 3px solid #0c334d;
}
.themed-tabs .light-tabs li a.tab-mint-border.active  {
    border-top: 3px solid #EF95BC;
}
.themed-tabs .light-tabs li a.tab-purple-border.active  {
    border-top: 3px solid #551771;
}
.themed-tabs .light-tabs li a {
    border: none;
    z-index: +2;
    background-color: #eee;
    font-size: 15px;
    border-radius: 0;
    border-top: 3px solid #cccccc;
    color: #292b2c;
    padding: .75rem 3rem;
}
.classic-tabs li {
    margin-right: .5rem;
}
.themed-tabs .tab-content {
    box-shadow: none;
    margin-top: -1px;
    border-top: 1px solid #eceeef;
}

.container-fluid {
    padding: 25px;
}

#sideNavBlocker .progress {
    width: 100%;
    top: 118px;
    left: 0;
    position: fixed; 
    background-color: #0c334d;
    border-radius: 0px;
}

.admin-default-progress {
    position: absolute !important;
    top: 113px !important;
}

.admin-progress {
    position: absolute !important;
    top: 119px !important;
}

#sideNavBlocker .progress .indeterminate {
    background-color: #EF95BC;
}

body.admin #sideNavBlocker {
    position: fixed !important;
}

#sideNavBlocker {
    visibility: hidden;
    /*background-color: rgba(12, 51, 77, 0);*/
    background: none;
    width: 100%;
    height: 100%;
    position: absolute;
    display: table;
    z-index: 1001;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
}
#sideNavBlocker.block-nav {
    visibility: visible;
    /*background-color: rgba(12, 51, 77, 0.5);*/
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
}

.card-open-btn {
    display: none;
}

#txtUsername:focus:not([readonly]),
#txtPassword:focus:not([readonly]),
.admin-input:focus:not([readonly]) {
    border-bottom: 1px solid #5a5a5a !important;
    box-shadow: 0 1px 0 0 #5a5a5a !important;
}

textarea.admin-input:focus {
    height: 12em;
}

label[for="SearchControl1_rblTaskExemp_0"]{
    margin-right: 0.5rem;
}

label[for="SearchControl1_rblTaskExemp_1"]{
    margin-left: 0.5rem;
}

.admin-rdo-btn [type="radio"]:checked + label:before {
    border: 2px solid #5a5a5a !important;
}

.admin-rdo-btn [type="radio"]:checked + label:after {
    border: 2px solid #5a5a5a !important;
    background-color: #5a5a5a !important;
}

.admin-rdo-btn .ks-12 [type="radio"]:checked + label:before {
    border: 2px solid #eb407a !important;
}

.admin-rdo-btn .ks-12 [type="radio"]:checked + label:after,
.ks12-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #eb407a !important;
    background-color: #eb407a !important;
}

.admin-rdo-btn .ks-3 [type="radio"]:checked + label:before {
    border: 2px solid #44afc1 !important;
}

.admin-rdo-btn .ks-3 [type="radio"]:checked + label:after,
.ks3-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #44afc1 !important;
    background-color: #44afc1 !important;
}

.admin-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #5a5a5a !important;
    background-color: #5a5a5a !important;
}

.task-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #0c334d !important;
    background-color: #0c334d !important;
}

.exemp-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #EF95BC !important;
    background-color: #EF95BC !important;
}

#SearchControl1_cblLevels td {
    padding-right: .5rem;
}

#SearchControl1_divAdvancedSearch,
#searchTranslatedTask_divAdvancedSearch,
#searchLinkedTask_divAdvancedSearch {
  background-color: #f8f8f8;
    padding: 1rem .5rem;
    border: 1px solid #e0e0e0;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #5a5a5a !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus  {
    border-bottom: 1px solid #5a5a5a !important;
    box-shadow: 0 1px 0 0 #5a5a5a !important;
}

.select2.select2-container.select2-container--default.select2-container {
    width: 100% !important;
}

select.browser-default {
    padding: .65rem;
}

.pt-0 {
    padding-top: 0 !important;
}

.pr-0 {
    padding-right: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.pl-0 {
    padding-left: 0 !important;
}

#panConfirmDelete {
    padding: 30px;
    border:1px solid #555;
    background: #fff;
}

#SearchControl1_rblTaskExemp {
    background-color: rgba(0,0,0,0.05);
    padding: .5rem 1rem;
    display: inline-block;
    vertical-align: middle;
    margin-top: -10px;
    border: 1px solid rgba(0,0,0,0.15);
}

#SearchControl1_rblTaskExemp label {
    margin-bottom: 0 !important;
}

.admin-step-card {
    border-radius: 0 0 2px 2px;
}

.task-step-header {
    color: #ffffff;
    background-color: #0c334d;
    border-radius: 2px 2px 0px 0px;
}

.exemp-step-header {
    color: #000000;
    background-color: #EF95BC;
    border-radius: 2px 2px 0px 0px;
}

.foundation-step-header {
    color: #fff;
    background-color: #551771;
    border-radius: 2px 2px 0px 0px;
}

#divMode,
#divGenre,
#divTaskType,
#divKandU,
#divDF,
.admin-comm,
.admin-maths,
.admin-ict {
    display: block;
    width: 100%;
    padding-bottom: 0 !important;
}

#divMode,
#divGenre,
#divTaskType,
.admin-comm,
.ud-comm {
    background: rgba(63, 179, 185, 0.1);
}

#divKandU,
.admin-maths,
.ud-maths {
    background: rgba(243, 162, 30, 0.1);
}

#divDF,
.admin-ict,
.ud-ict {
    background: rgba(200, 92, 159, 0.1);
}

#divMode .admin-rdo-btn [type="radio"]:checked + label:before,
#divGenre .admin-rdo-btn [type="radio"]:checked + label:before,
#divTaskType .admin-rdo-btn [type="radio"]:checked + label:before,
.admin-comm .admin-rdo-btn [type="radio"]:checked + label:before {
    border: 2px solid #3fb3b9 !important;
}

.admin-comm .admin-rdo-btn [type="radio"]:checked + label:after {
    border: 2px solid #3fb3b9 !important;
    background-color: #3fb3b9 !important;
}

.comm-cbx input[type="checkbox"]:checked + label:after,
.admin-comm input[type="checkbox"]:checked + label:after,
#divMode .admin-rdo-btn [type="radio"]:checked + label:after,
#divGenre .admin-rdo-btn [type="radio"]:checked + label:after,
#divTaskType .admin-rdo-btn [type="radio"]:checked + label:after {
    border: 2px solid #3fb3b9 !important;
    background-color: #3fb3b9 !important;
}

.admin-maths .admin-rdo-btn [type="radio"]:checked + label:before {
    border: 2px solid #f3a21e !important;
}

.admin-maths .admin-rdo-btn [type="radio"]:checked + label:after {
    border: 2px solid #f3a21e !important;
    background-color: #f3a21e !important;
}

.admin-ict .admin-rdo-btn [type="radio"]:checked + label:before {
    border: 2px solid #c85c9f !important;
}

.admin-ict .admin-rdo-btn [type="radio"]:checked + label:after {
    border: 2px solid #c85c9f !important;
    background-color: #c85c9f !important;
}

.um-cbx input[type="checkbox"]:checked + label:after,
#divKandU .admin-cbx  input[type="checkbox"]:checked + label:after,
.admin-maths .admin-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #f3a21e !important;
    background-color: #f3a21e !important;
}

.uict-cbx input[type="checkbox"]:checked + label:after,
#divDF .admin-cbx  input[type="checkbox"]:checked + label:after,
.admin-ict .admin-cbx  input[type="checkbox"]:checked + label:after {
    border: 2px solid #c85c9f !important;
    background-color: #c85c9f !important;
} 

#divMode h5,
#divGenre h5,
#divTaskType h5,
.admin-comm h5,
#divKandU h5,
.admin-maths h5,
#divDF h5,
.admin-ict h5 {
    color: #ffffff;
    font-size: 1rem;
    padding: .5rem;
}

.ud-comm div,
.ud-maths div,
.ud-ict div {
    padding: 15px;
}

.ud-comm h4,
.ud-maths h4,
.ud-ict h4 {
    padding: 15px;
}

.ud-comm ul li,
.ud-maths ul li,
.ud-ict ul li {
    padding: .25rem 0;
}


#divMode h5,
#divGenre h5,
#divTaskType h5,
.admin-comm h5,
.ud-comm h4,
.card-comm .indicator.card-skill-color {
    background: #3fb3b9;
}

.ud-comm h5 {
    color: #3fb3b9;
}

#divKandU h5,
.admin-maths h5,
.ud-maths h4,
.card-maths .indicator.card-skill-color {
    background: #f3a21e;
}

.ud-maths h5 {
    color: #f3a21e;
}

#divDF h5,
.admin-ict h5,
.ud-ict h4,
.card-ict .indicator.card-skill-color {
    background: #c85c9f;    
}

.ud-ict h5 {
    color: #c85c9f;    
}

.card-comm .indicator.card-skill-color,
.card-maths .indicator.card-skill-color,
.card-ict .indicator.card-skill-color {
    color: #ffffff;
}

.admin-task-exemp-form h5 {
    font-size: 1.15rem;
    margin: 1rem 0;
}

.admin-task-exemp-form #divRequirements .requirement-im {
    font-weight: 400;
}

#divAoL table,
#cblTaskPlatform,
#divExempSkill table td,
#divExempAoL table td {
    width: 100%;
}

#divAoL table td,
#cblTaskPlatform td {
    width: 33.33%;
}

.admin-task-exemp-form textarea.md-textarea {
    padding-top: 0;
}

#upanStep2 table {
    width: 100%;
}

#upanStep2 table td,
#divExempSkill table td,
#divExempAoL table td {
    padding-right: 1.5rem;
    padding-bottom: .5rem;
    vertical-align: top;
    width: 25%;
}

#divCblLevels table td,
#repRblActivityLevels_ctl00_panRblLevelsBySkill table td,
#divRblLevels table td {
    padding-right: 1.5rem;
    padding-bottom: .5rem;
}

input[disabled="disabled"]:not(:checked) + label:before {
    border: none !important;
}

input[disabled="disabled"]:not(:checked) + label:after {
    background-color: rgba(0,0,0,0.05) !important;
    border: 2px solid rgba(0,0,0,0.2) !important;
}

input[disabled="disabled"]:not(:checked) + label {
    color: rgba(0,0,0,0.5);
}

.admin-upload-btn {
    position: relative;
    font-size: .9rem;
    padding: .5rem;
}

.admin-upload-btn input {
    width: 100%;
    height: 100%;
}

.sortable-upload ul,
.sortable-upload ul li,
.sortable-upload li {
    margin: 0;
}

.sortable-upload ul li {
    background: rgba(12, 51, 77,0.15);
    width: 100%;
    padding: .25rem;
    margin-bottom: 10px;
}

.sortable-upload ul li:nth-child(even) {
    background: rgba(12, 51, 77,0.05);
}

.sortable-upload ul li a {
    margin-left: 10px;
}

.sortable-upload ul li a span {
    color: #292b2c;
    font-weight: 400;
}

#divCbPublish {
    display: inline-block;
    margin-bottom: 0;
    padding-bottom: 0;
}

#divCbPublish label {
    margin-bottom: 0;
}

#lblOldCommentary {
    width auto;
    margin: 0 auto 1.5rem;
    padding: 1rem;
    background: #f8f8f8;
    border: 1px solid #cccccc;
    max-width: 920px;
    width: 96%;
}

#lblOldCommentary.wordtable table {
    border: none;
}

.LoP-toggle-btn {
    width: 100%;
    display: block;
    padding: 15px;
    background: #f5f5f5;
    border: 1px solid #ccc;
    color: #292b2c;
}

.LoP-toggle-btn i {
    float: right;
    font-size: 1.5rem;
}

.LoP-table-container {
    border: 1px solid #ccc;
    border-top: none;
}

#divLoP table {
    width: 100%;
}

#divLoP table th {
    width: 25%;
}

#divLoP table th,
#divLoP table td {
    vertical-align: top;
    padding: .5rem;
}

#divLoP table th:last-child {
    width: 50%;
}

.modal-evidence .modal-footer {
    border-top: none;
}

.modal-evidence h4 {
    margin: 1rem 0;
}

.modal-evidence ul li,
.admin-evidence ul li,
.modal-lop-table ul li {
    list-style: disc;
    margin: 0 0 0 1.5rem;
}

.view-ict .modal-lop-table td {
    padding-top: 2rem;
}

.view-ict .modal-lop-table tr td:first-child {
    padding-top: .5rem;
}

.modal-lop-table td,
.admin-evidence td {
    font-family: "Roboto", sans-serif !important;
}

.modal-lop-table td p,
.admin-evidence td p {
    font-size: 1rem !important;
}

.modal-lop-table td h1,
.admin-evidence td h1 {
    font-size: 2rem !important;
}

.modal-lop-table td h2,
.admin-evidence td h2 {
    font-size: 1.5rem !important;
}

.modal-lop-table td h3,
.admin-evidence td h3 {
    font-size: 1.25rem !important;
}

.modal-lg {
    max-width: 960px;
}

.lop-header {
    font-weight: 300;
}

#lblDescription {
    display: block;
    padding: .5rem;
    background: rgba(12, 51, 77, 0.1);
}

.admin-task-exemp-form textarea.md-textarea,
#alerts-container textarea.md-textarea {
    border: 1px solid #cccccc;
    overflow-y: auto;
}

#alerts-container textarea.md-textarea {
    padding: 0;
    min-height: 5.5rem;
}

#divLoP table tr td:nth-last-child(2) {
    border-right: none !important;
}

#divLoP table tr td:nth-last-child(1) {
    border-left: none !important;
}

#alerts-container table {
    width: 100%;
}

#alerts-container table th {
    width: 10%;
    background: #f0f0f0;
}

#alerts-container table th:first-child {
    width: 2%;
}

#alerts-container table td:first-child [type=checkbox]+label {
    padding-left: 0;
}

#alerts-container table th:nth-child(2),
#alerts-container table th:nth-child(3) {
    width: 30%;
}

#alerts-container table th,
#alerts-container table td {
    border: 1px solid #ffffff;
    padding: .5rem;
    vertical-align: top;
}

#gvAlerts th {
    background: #0c334d !important;
    color: #ffffff;
}

#gvAlerts tr {
    background: #f0f0f0;
}

#gvAlerts tr:nth-child(odd) {
    background: #ffffff;
}

#gvAlerts td .btn:first-child {
    background-color: #0c334d;
}

#gvAlerts td .btn:last-child {
    background-color: #C00;
}

.tbl_data.table th,
.tbl_data.table td {
    border-top: none !important;
    border-right: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
    border-left: none !important;
}

.tbl_data.table td {
    vertical-align: middle;
}

.tbl_search {
    width: 100%;
}

.tbl_search td {
    width: 30%;
}

.tbl_search td:last-child {
    width: 10%;
}

.tbl_search td input[type="text"],
.tbl_search td select.browser-default {
    width: 90%;
}

#admin-user-search {
    border: 1px solid #e0e0e0;
    padding: 1rem .5rem;
}

.alert-msg {
    width: 100%;
    padding: 1.5rem;
    background: #dddddd;
    border: 1px solid #cccccc;
    margin-bottom: 1.5rem;
}
.alert-msg h4 {
    color: #0c334d;
}
.alert-msg p {
    margin-bottom: 0;
}
.alert-msg a {
    color: #0275d8;
}
.alert-msg a:hover {
    text-decoration: underline;
}

.card-container .icons i[data-title]:hover:after,
.card-container .icons i[data-title]:hover:after {
    content: attr(data-title);
    font-family: "Roboto", sans-serif;
    z-index: 1620;
    position: absolute;
    background: #212121;
    color: #ffffff;
    border-radius: 2px;
    display: block;
    width: auto;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
    padding: .5rem;
    font-size: 14px;
    top: -1.25rem;
    right: 1.25rem;
    white-space: nowrap;
}

h4.icons {
    height: 1.5rem;
}

.card-container {
    padding: 1.25rem;
    width: 25%;
}

.menu-open .card-container {
    width: 33.33%;
}

.ksfoundation {
    background-color: #551771 !important;
}

.ks12 {
    background-color: #eb407a !important;
}

.ks3 {
    background-color: #44afc1 !important;
}

.task-exemp-search .card-block {
    display: flex;
    flex-direction: column;
}

.task-card .card-title,
.exemplification-card .card-title {
    /*height: 4rem;*/
    line-height: 1.25em;
    overflow: hidden;
    text-overflow: ellipsis;
    /*white-space: nowrap;*/
}

.card-inner {
    /*height: 28rem;*/
    overflow-y: auto !important;
    overflow-x: hidden;
    flex: 1 0 auto;
}

.updated-created {
    padding-top: 1.25rem;
    border-top: 1px solid #dddddd;
    height: 2.5rem;
}

#lvCardsPager a,
#lvCardsPager span.active {
    display: block;
    float: left;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #292b2c;
    background-color: none;
    border-radius: 2px;
}

#lvCardsPager a:hover {
    background-color: #dddddd;
}

#lvCardsPager span.active,
#lvCardsPager span.active:hover {
    background-color: #607d8b;
    color: #ededed;
    font-weight: 500;
}

#lvCardsPager span.active {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
}

.modal-downloads {
    padding: .5rem !important;
    background-color: #eeeeee;
}

.modal-downloads .file-download,
.modal-downloads .file-download a,
.modal-downloads .file-download span {
    display: block;
}

.modal-downloads .file-download a {
    font-weight: 500;
    color: #292b2c;
}

.modal-downloads .file-download span {
    font-size: .9rem;
}

.modal-downloads .file-download {
    margin-bottom: .5rem;
    padding-left: 35px;
    min-height: 38px;
}

.pdf, .im-pdf,
.doc, .docx, .im-doc, .im-docx,
.link,
.mp3, .wav,
.mp4, .mpg, .mov, .avi,
.ppt, .pptx, .im-ppt, .im-pptx,
.xls, .xlsx, .im-xls, .im-xlsx,
.zip, .im-zip,
.png, .gif, .jpg, .jpeg,
.file-download {
    background-repeat: no-repeat;
    background-size: auto 38px;
    background-position: left center;
}

.file-download {
    background-image: url(../img/icons/file.png);
}

.pdf {
    background-image: url(../img/icons/pdf.png) !important;
}
.im-pdf {
    background-image: url(../img/icons/im/pdf.png) !important;
}

.doc, .docx {
    background-image: url(../img/icons/doc.png) !important;
}

.im-doc, .im-docx {
    background-image: url(../img/icons/im/doc.png) !important;
}

.link {
    background-image: url(../img/icons/www.png) !important;
}

.mp3 {
    background-image: url(../img/icons/mp3.png) !important;
}

.wav {
    background-image: url(../img/icons/wav.png) !important;
}

.mp4 {
    background-image: url(../img/icons/mp4.png) !important;
}

.mpg {
    background-image: url(../img/icons/mpg.png) !important;
}

.mov {
    background-image: url(../img/icons/mov.png) !important;
}

.avi {
    background-image: url(../img/icons/avi.png) !important;
}

.ppt, .pptx {
    background-image: url(../img/icons/ppt.png) !important;
}

.im-ppt, .im-pptx {
    background-image: url(../img/icons/im/ppt.png) !important;
}

.xls, .xlsx {
    background-image: url(../img/icons/xls.png) !important;
}

.im-xls, .im-xlsx {
    background-image: url(../img/icons/im/xls.png) !important;
}

.zip {
    background-image: url(../img/icons/zip.png) !important;
}

.im-zip {
    background-image: url(../img/icons/im/zip.png) !important;
}

.png {
    background-image: url(../img/icons/png.png) !important;
}

.gif {
    background-image: url(../img/icons/gif.png) !important;
}

.jpg, .jpeg {
    background-image: url(../img/icons/jpg.png) !important;
}

.modal-lop-table {
    min-width: 100%;
}

.modal-lop-table th,
.modal-lop-table td,
.admin-evidence th,
.admin-evidence td {
    border: 1px solid #ffffff;
    padding: .5rem;
    vertical-align: top;
}

.admin-evidence th,
.modal-lop-table th {
    background-color: #dddddd;
}

.info-under-evidence {
    background-color: #dddddd;
    margin: 0 1px;
    padding: .5rem;
    display: block;
}

#unpublished-exemp .card {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
}

#unpublished-exemp table {
    width: 100%;
}

#unpublished-exemp table th,
#unpublished-exemp table td {
    border: 1px solid #ffffff;
    padding: .5rem;
    vertical-align: middle;
}

#unpublished-exemp table th {
    background-color: #0c334d;
}

#unpublished-exemp table th,
#unpublished-exemp table th a {
    color: #EF95BC;
}

#unpublished-exemp-header a {
    color: #d32f2f;
}

#unpublished-exemp-content .card-block {
    max-height: 490px;
    overflow-y: auto;
}

#lblPublishStatus {
    padding: .5rem;
    color: #ffffff;
    border-radius: 2px;
}

.pupil-expectations-textarea {
    margin-bottom: 1rem;
}

#panOrderForm .card {
    box-shadow: none;
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding: 1.25rem;
}

#panOrderForm table {
    width: 100%;
}

#panOrderForm table,
#panOrderForm table th,
#panOrderForm table td {
    border: none;
}

#panOrderForm table th,
#gvOrderBasket td {
    vertical-align: top;
}

#gvOrderItems td {
    vertical-align: middle;
}

a.underline:hover {
    text-decoration: underline;
}

#panOrderForm table th {
    background-color: #0c334d;
    color: #ffffff;
    vertical-align: top;
}

#order-basket {
    position: fixed;
    right: 5px;
}

.menu-open #order-basket {
    width: 28%;
}

#order-basket .md-pills.pills-ins .nav-item .nav-link.active {
    background-color: #ffffff;
}

#order-basket .md-pills .nav-item .nav-link.active {
    color: #0c334d;
}

#order-basket .order-details .tab-content {
    background-color: #ffffff;
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    max-height: 365px;
    overflow-y: auto;
    padding: 1.25rem
}

#school-details h5 {
    font-size: 1rem;
    margin-bottom: 0;
}

#order-basket table th,
.empty-basket td {
    background-color: #ffffff;
    color: #0c334d;
}

#order-basket-footer {
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    background-color: #ffffff;
    margin: 0;
    padding: 1.85rem .5rem;
}

#gvOrderItems {
    margin-top: -1px;
}

#gvOrderItems td {
    width: 12%;
    padding: .5rem;
}

.order-no-file {
    background-color: #dddddd;
    border: 1px solid #cccccc !important;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

#order-items-header {
    background: #ffffff;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

#order-items-header ul {
    width: 100%;
    margin-bottom: -1px;
}

#order-items-header ul li {
    width: 12%;
    border-left: 1px solid #dddddd;
    padding: .5rem;
    display: inline-block;
    height: 4rem;
    vertical-align: bottom;
}

#order-items-header ul li:first-child {
    width: 20%;
    border-left: none;
}

#order-items-header ul li:last-child {
    width: 6%;
}

#order-items-header ul li.order-item-title {
    width: 25%;
}

#order-items-header ul li.order-item-mpn {
    width: 25%;
    text-align: center;
}

#order-items-header ul li.order-item-mpn span {
    display: block;
}

#order-items-header ul li.order-item-mpn div {
    display: block;
    float: left;
    width: 50%;
}

#order-info-tooltip div {
    display: none;
    position: absolute;
    width: 320px;
    background: #ffffff;
    border: 1px solid #dddddd;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
    padding: .5rem;
    top: 4rem;
    right: 1rem;
}

#order-info-tooltip i:hover + div {
    display: block;
}

#order-items-header.stick #order-info-tooltip i:hover + div {
    display: block;
    right: 0;
    margin-top: -1px;
}

#order-items-header.stick {
    position: fixed;
    top: 116px;
}

.text-navy {
    color: #0c334d;
}

.ks1-2-heading,
.ks3-heading {
    padding: .5rem;
    color: #ffffff;
}

.ks1-2-heading {
    background-color: #eb407a;
}

.ks3-heading {
    background-color: #44afc1;
}

.useful-docs-modal-content .tab-content ul li span {
    margin-bottom: .5rem;
    display: block;
}

.useful-docs-modal-content .tab-content a {
    color: #292b2c;
    width: 100%;
    display: block;
    margin-bottom: .5rem;
    padding-left: 35px;
    min-height: 38px;
}

.useful-docs-modal-content .tab-content a:hover {
    background-color: rgba(0,0,0,0.03);
}

#txtOrderContactEmail-label,
#txtOrderContactEmail-label:after {
    position: relative;
    top: 0;
    font-size: 1rem;
}

#btnOrderSubmit:disabled,
#btnOrderSubmit.disabled {
    opacity: 0.5;
    box-shadow: none;
}

.md-form .prefix.active {
    color: #292b2c;
}

.ul-disc ul,
.ul-disc ul li,
ul.list-style-disc,
ul.list-style-disc li {
    list-style-type: disc;
    margin-left: 1.25rem;
}

.ul-disc ul li,
ul.list-style-disc li {
    padding-left: .25rem;
}

#order-success-modal .modal-content,
#splash-error-modal .modal-content {
    border-radius: 0px;
    border: none;
}

.btn {
    cursor: pointer;
}

#lblStepHeaderTitle {
    font-size: 1.5rem;
}

.task-info {
    position: relative;
    height: 6rem;
    overflow: hidden;
    margin-bottom: 1rem;
}

/*.task-info::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1.5rem;
    background: -webkit-linear-gradient(
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 75%
    ); 
    background-image: -moz-linear-gradient(
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 75%
    );
    background-image: -o-linear-gradient(
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 75%
    );
    background-image: linear-gradient(
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 75%
    );
    background-image: -ms-linear-gradient(
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 75%
    );
}*/

.task-exemp-card p {
    margin-bottom: 1.5rem;
}

.admin-menu {
    margin-top: -.5rem;
}

#admin-menu-btn {
    box-shadow: none;
    font-size: 27px;
    line-height: 54px;
    padding: 0px 1rem;
}

.admin-menu .dropdown-menu {
    left: auto;
    right: 0;
}

.admin-menu .dropdown-menu a {
    font-size: 1.25rem !important;
}

.admin-menu .dropdown-item.active, .admin-menu .dropdown-item:active {
    background-color: #EF95BC;
    color: #0c334d;
}

#task-ordering-info {
    background-color: #f5f5f5;
    border: 1px solid #dddddd;
    color: #666666 !important;
    box-shadow: none;
}

#task-ordering-info:hover {
    background-color: #f0f0f0;
}

#task-ordering-info i {
    transform: rotate(-180deg);
} 

#task-ordering-info.collapsed i {
    transform: rotate(0deg);
}

.btn-tooltip {
    display: none;
    position: absolute;
    width: 189px;
    padding: 15px 5px;
    font-size: 1.15rem;
    text-align: center;
    top: 66px;
    font-weight: 500;
}

#useful-docs-btn .btn-tooltip {
    background-color: #212121;
    right: 0px;
    color: #ffffff;
}

#lbToggleMsgBtn .btn-tooltip {
    background-color: #dddddd;
    right: 0px;
    color: #0c334d;
    border-left: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

#useful-docs-btn:hover .btn-tooltip,
#lbToggleMsgBtn:hover .btn-tooltip {
    display: block;
}

#gvUnpublishedExemp {
    width: 100%;
}

#gvUnpublishedExemp th,
#gvUnpublishedExemp td {
    padding: .5rem;
    border: 1px solid #ffffff;
    vertical-align: top;
}

#gvUnpublishedExemp th {
    background-color: #0c334d;
    color: #EF95BC;
}

#gvUnpublishedExemp th:last-child {
    width: 200px;
}

#gvUnpublishedExemp textarea {
    border: none;
    border-bottom: 1px solid #ccc;
}

#gvUnpublishedExemp .btn {
    font-size: 1.5rem;
    padding: .5rem 1rem;
}

#auto-unpublished-exemp-key i {
    font-size: 1.5rem;
    vertical-align: bottom;
    display: inline-block;
}

#lbUnpublish {
    box-shadow: none;
    color: #636c72 !important;
    background-color: none;
    padding: .5rem;
    border-radius: 2px;
    margin: -.1rem 0 0 .5rem !important;
    vertical-align: middle;
}

.task-platform i {
    font-size: 3.5rem;
    color: #c85c9f;
    margin-right: 1rem;
}

.task-platform i:last-child {
    margin-right: 0;
}

#lbViewAutoUnpubModal {
    font-size: 27px;
    line-height: 54px;
    padding: 0px 1rem !important;
    vertical-align: middle;
    position: fixed;
    right: .5rem;
    margin-top: -38px;
    z-index: 1000;
    transform: translateX(-3px);
}

#gvUnpublishedExemps {
    width: 100%;
}

#gvUnpublishedExemps th {
    background-color: #b71c1c;
    color: #ffffff;
    vertical-align: top;
}

#gvUnpublishedExemps th,
#gvUnpublishedExemps td {
    border: 1px solid #ffffff;
    padding: .5rem;
}

/*-----------------------------------------------------------*/
/* BEGIN STYLING FOR OLD COMMENTARY TABLES PASTED FROM MS WORD */
/*-----------------------------------------------------------*/

.wordtable {
    
    margin: 0;
    line-height: 1.2;
    /*border-collapse:collapse;*/
}

    .wordtable table {
        width: auto !important;
        border: 1px solid #777777;
    }

    .wordtable p {
        margin: 0 3px;
        padding: 0 4px;
    }

    .wordtable td {
        /*padding:0 !important;
    border:0 !important;
    border-right:0 !important;*/
    }

    .wordtable ul {
        margin-right: 5px;
        margin-top: 2px;
    }

/*-----------------------------------------------------------*/
/* END STYLING FOR OLD COMMENTARY TABLES PASTED FROM MS WORD */
/*-----------------------------------------------------------*/

/*-----------------------------------------------------------*/
/* BEGIN STYLING FOR VALIDATION HIGHLIGHTING */
/*-----------------------------------------------------------*/

.highlight-error {
    display: none;
}

    .highlight-error[style*=visible] + input,
    .highlight-error[style*=visible] + select,
    .highlight-error[style*=visible] + textarea,
    .highlight-error[style*=visible] + table,
    .highlight-error[style*=visible] + ul,
    .highlight-error[style*=visible] + div,
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_texteditor,
    .highlight-error[style*=visible] + span.highlight-error-span + textarea,
    .validation-error {
        background-color: #ffebee !important;
    }

    .highlight-error[style*=visible] + div {
        padding-bottom: 1rem;
    }
    
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_buttoncontainer {
        background-color: #ffcdd2 !important;
    }

    .highlight-error[style*=visible] + table,
    .highlight-error[style*=visible] + ul,
    .highlight-error[style*=visible] + div,
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_buttoncontainer input {
        border: none !important;
    }

    .highlight-error[style*=visible] + select,
    .highlight-error[style*=visible] + div select,
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_texteditor,
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_buttoncontainer {
        border: 1px solid #CC0000 !important;
    }
    .highlight-error[style*=visible] + div .ajax__html_editor_extender_texteditor {
        border-top: none !important;
    }

    .highlight-error[style*=visible] + div h5 {
        background-color: #CC0000 !important;
        color: #ffffff;
        padding: .5rem;
    }

    .admin-task-exemp-form h5 .error-msg,
    .admin-task-exemp-form span.highlight-error-span .error-msg {
        display: none;
        visibility: hidden;
        margin-top: -.25rem;
    }
    .highlight-error[style*=visible] + div h5 .error-msg,
    .highlight-error[style*=visible] + span.highlight-error-span .error-msg {
        display: block;
        visibility: visible;
    }

    .highlight-error[style*=visible] + input,
    .highlight-error[style*=visible] + textarea,
    .highlight-error[style*=visible] + div input,
    .highlight-error[style*=visible] + div textarea,
    .highlight-error[style*=visible] + span.highlight-error-span + textarea {
        border-bottom: 1px solid #CC0000 !important;
    }

    .highlight-error[style*=visible] + span.highlight-error-span {
        color: #CC0000 !important;
    }

/*-----------------------------------------------------------*/
/* END STYLING FOR VALIDATION HIGHLIGHTING */
/*-----------------------------------------------------------*/

/*-----------------------------------------------------------*/
/* BEGIN STYLING FOR SCHOOL SUBMISSION */
/*-----------------------------------------------------------*/

#ss-wrapper strong {
    font-weight: 700;
}
.ss-bordered-grey {
    border: 1px solid #ddd;
}
.ss-bordered-black {
    border: 1px solid #000;
}
.ss-denumber {
    display: table;
    width: 100%;
    line-height: 2.25rem;
}
.ss-denumber li:first-of-type {
    border-left: none;
}
.ss-denumber li {
    display: table-cell;
    border-left: 1px solid #ddd;
    text-align: center;
}
.ss-color-grey {
    color: #ccc;
}
.ss-tab-footer-title {
    font-weight: 700;
    border-bottom: 1px solid #000;
    padding: 5px;
}

.ss-intro,
.ss-tab-footer {
    margin: 1.5rem 0 0;
    padding: 0;
    /*border: 1px solid #dddddd;*/
    font-size: 1.15rem;
}

.ss-table.table thead th,
.ss-table td {
    border: 1px solid #777777;
    padding: 1rem;
    vertical-align: top;
}

.ss-table.table thead th {
    background-color: #dddddd;
}

.ss-table td p {
    font-size: 1.15rem;
    margin-bottom: none;
}

.ss-table a {
    margin-left: 0 !important;
    font-weight: 500;
}

.ss-table tbody tr {
    cursor: pointer;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

.ss-table tbody tr:hover {
    background-color: #f3f3f3;
    transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
}

/*-----------------------------------------------------------*/
/* END STYLING FOR SCHOOL SUBMISSION */
/*-----------------------------------------------------------*/

.print-tab-wrapper,
.print-tab-label {
    display: none;
}

.print-page {
    display: inline-block;
    padding: 0 .5rem;
    background: #fafafa;
    border: 1px solid #eee;
    border-radius: 2px;
    color: #888;
    margin-left: .5rem;
    cursor: pointer;
}

.print-page:hover {
    background: #eee;
    border: 1px solid #292b2c;
    color: #292b2c;
}

@media screen and (max-width: 1759px) {
    .card-container {
        width: 33.33%;
    }
}

@media screen and (max-width: 1410px) {    
    .menu-open .card-container {
        width: 50%;
    }
}

@media screen and (max-width: 1279px) {    
    #order-basket,
    .menu-open #order-basket,
    #order-search-results {
        position: relative;
        width: 100% !important;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 1.5rem;
        right: 0;
    }
    
    #order-basket .order-details .tab-content {
        max-height: 250px;
    }
}

@media screen and (max-width: 1199px) {
    #gvUnpublishedExemp th:last-child {
        width: 137px;
    }
    
    #gvUnpublishedExemp .btn {
        font-size: 1.25rem;
        padding: .25rem .5rem;
    }
    
    .splash .container-fluid {
        width: 100%;
    }
}

@media screen and (max-width: 1099px) {
    .menu-open .card-container {
        width: 100%;
    }
    
    .menu-open .task-card .card-title,
    .menu-open .exemplification-card .card-title {
        white-space: normal;
    }
    
    .menu-open .card-inner {
        height: auto;
    }
}

@media screen and (max-width: 1050px) {
    .card-container {
        width: 50%;
    }
}

@media screen and (max-width: 1024px){
    #main_container.menu-open .home-col {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .splash #main_container.menu-open .container-fluid {
        position: relative;
        transform: translate(0,0);
        left: 0;
        top: 0;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .modal-lg {
        max-width: 720px;
    }
    
    .splash .container-fluid .home-col {
        width: 100%;
    }
}

@media screen and (max-width: 767px) {    
    .card-container {
        width: 100%;
    }
    
    .task-card .card-title,
    .exemplification-card .card-title {
        white-space: normal;
    }
    
    .card-inner {
        height: auto;
    }
}

@media screen and (max-height: 767px) {    
    .splash .container-fluid {
        position: relative;
        transform: translate(0,0);
        left: 0;
        top: 0;
        margin-top: 0;
    }
}


@media print {
    
    @page  
    { 
        size: auto;
        margin: 0mm;  
    } 
    
    html, body {
        font-size: 9pt !important;
    }
    
    .card-container .indicator {
        font-size: 8pt !important;
    }
    
    #ccea-logo {
        line-height: 38px;
        font-size: 50px;
    }
    
    .main-nav-title {
        margin-left: 60px;
    }
    
    body.modal-open {
        font-size: 10pt !important;
    }
    
    .card-inner,
    .task-info {
        height: auto !important;
    }
    
    h4::first-letter {
        margin-top: 0;
    }
    
    .modal-open #main-nav,
    #side_nav,
    .modal-open #divContentContainer,
    .modal-open button.close,
    .modal-open .nav-tabs,
    #main-nav-top .float-right,
    #fs-btn,
    #fs-exit-btn,
    #main-nav-bottom,
    #btt-btn,
    #panResults .margin-top-2em,
    .print-page {
        display: none !important;
    }
    
    #panResults .row.margin-top,
    .modal-content,
    .modal-body,
    .tabs-wrapper,
    .tab-content,
    .task-details,
    .modal-open .row {
        display: block;
    }
    
    #main-nav {
        position: absolute;
    }
    
    #main_container,
    #main_container.menu-open {
        padding: 54px 0px 0px 0px;
        margin: 0;
    }
    
    .modal.show .modal-dialog {
        margin: 0;
    }
    
    .modal-open .modal {
        overflow: visible !important;
    }
    
    .modal-lg {
        max-width: 100% !important;
    }
    
    .modal-open #modal {
        padding: 0 !important;
        margin: 0;
        width: 100% !important;
        display: block;
    }
    
    #modal,
    .modal {
        position: relative !important;
    }
    
    .modal-open .modal-content .container-fluid .col-md-6 {
        -webkit-box-flex: 0 !important;
        -webkit-flex: 0 0 50% !important;
        -ms-flex: 0 0 50% !important;
        flex: 0 0 50% !important;
        max-width: 49% !important;
        display: inline-block;
        vertical-align: top;
    }
    
    .modal-body .nav-item {
        max-width: 45%;
    }
    
    .task-details .tab-content {
        border: none !important;
    }
    
    .modal-open .task-details .tab-pane {
        display: block !important;
        opacity: 1 !important;
    }
    
    .modal-backdrop.show {
        opacity: 0;
    }
    
    .card-container {
        display: inline-block;
        vertical-align: top;
    }
    
    .print-tab-wrapper {
          display: block;
          position: relative;
          height: 39px;
          width: 100%;
          border-bottom: 1px solid #ddd;
          z-index: 0;
          margin: 1.5rem 0 1rem;
      }
      
      .print-tab-label {
          display: block;
          float: left;
          width: 33.33%;
          border-top: 1px solid #ddd;
          border-right: 1px solid #ddd;
          border-bottom: 1px solid #fff !important;
          border-left: 1px solid #ddd;
          background: #fff;
          padding: 10px;
          font-size: 18px;
          line-height: 18px;
          text-align: center;
          box-sizing: border-box;
          z-index: 1;
      }

    .task-details .tab-pane:nth-of-type(2) .print-tab-label{
      margin-left: 33.33%;
    }

    .task-details .tab-pane:nth-of-type(3) .print-tab-label{
      margin-left: 66.66%;
    }
    
    .modal .row mb-2 {
        margin-bottom: 0;
    }
}

@media print and (orientation: landscape) {
    .card-container {
        width: 33% !important;
    }
}

@media print and (orientation: portrait) {
    .card-container {
        width: 49% !important;
    }
}