body {
	font-family : 'open sans', gt_walsheimregular, sans-serif;
	font-size: 15px;
    line-height: 1.3;
	color: #271d5c;
    margin: 0 !important;
    padding: 0 !important;
}
pre {
	font-family : Consolas, Courier New;
	font-size: 11px;
	color: #271d5c;
    margin: 0 !important;
    padding: 0 !important;
}
h1 {
    font-size: 28px;
}
h2 {
    font-size: 24px;
}
h3 {
    font-size: 17px;
}
h4 {
    font-size: 15px;
    font-weight: bold;
}

.nav-bar {
    position: absolute;
    top: 0;
    right: 0;
    height: 90px;
    left: 0;
	margin: 0 !important;
    overflow: auto;
	background: #fff;
    text-align: right;
}

.nav_table {
    border-collapse: collapse;
    width: 100%;
}
.nav-table a, .nav-table a:visited, .nav-table a:active {
    text-decoration: none;
    outline: 0;
}
.nav-table a:focus, .nav-table a:hover {
    text-decoration: underline;
    outline: 1px solid #20C6df;
}

.nav-bar img {
	height : 60px;
    margin: 14px;
    padding: 0 !important;
}
.nav-links {
    text-align: right;
    padding-right: 10px;
}
.nav-links a, .nav-links a:visited, .nav-links a:active {
    float: right;
    color: #fff;
	background: #251b5b; /*linear-gradient(180deg, #f1f1f1, #f8f9fa);*/
    padding: 8px 16px;
    height: 36px;
    margin: 3px 0 3px 6px;
    border-radius: 20px;
    text-decoration: none;
    outline: 0;
}

.nav-links a:focus, .nav-links a:hover {
    text-decoration: underline;
    outline: 1px solid #20C6df;
}
a.act, a:visited.act {
    text-decoration: none;
    border: 0;
    color: inherit !important;
    outline: 0;
}

a:focus.act, a:hover.act, a:active.act {
    text-decoration: underline;
    outline: 1px solid #20C6df;
}

a.href, a:active.href, a:active.href, a:visited.href {
    color: #0f6ffd !important;
    text-decoration: underline !important;
    outline: none;
}
a:focus.href {
    outline: 1px solid #20C6df !important;
}
a:hover.href {
    color: #0c59ca !important;
}

.top-bar {
    position: absolute;
    top: 90px;
    right: 0;
	height: 40px;
    left: 0;
	margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
	background: #251b5b; /*linear-gradient(90deg, #372b82, #e10e59, #f39a33)*/
    text-align: center;
}

@-webkit-keyframes admin-message {
    0% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    50% {
        color: #251b5b;
        background: #fff; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    100% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
}
@-moz-keyframes admin-message {
    0% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    50% {
        color: #251b5b;
        background: #fff; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    100% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
}
@-o-keyframes admin-message {
    0% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    50% {
        color: #251b5b;
        background: #fff; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    100% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
}
@keyframes admin-message {
    0% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    50% {
        color: #251b5b;
        background: #fff; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    100% {
        color: #251b5b;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
}
.operator-details-heading {
    float: right;
    background: white;
    margin: 2px;
    padding: 3px;
    height: 36px;
    line-height: 1;
}
.operator-name-heading {
    color: #251b5b;
    font-size: 12pt;
}
.searching_data {
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 10px;
    overflow: auto;
    text-align: center;
}
.web-title {
    float: left;
    color: #fff;
    font-size: 17px;
    font-weight: bold;
    padding: 7px;
    margin: 2px;
    height: 36px;
    letter-spacing: 1px;
}
.sub-result {
    float: left;
    color: #fff;
    font-size: 14px;
    padding: 8px;
    margin: 4px;
    height: 36px;
    letter-spacing: 1px;
}
.admin-message {
    -webkit-animation: admin-message 2s linear infinite;
    -moz-animation: admin-message 2s linear infinite;
    -o-animation: admin-message 2s linear infinite;
    animation: admin-message 2s linear infinite;
}

.main-data {
    position: absolute;
    top: 130px;
    right: 0;
    bottom: 0;
    left: 0;
	margin: 0 !important;
    padding: 0 !important;
    overflow: auto;
    text-align: center;
}

.login-instructions {
    width: initial;
    font-size: 11pt;
    text-align: left;
}
.login-instructions .active {
    color: #006700;
    font-size: 12pt;
}
.login li, .login-instructions li {
    padding: 3px;
}
.login .active {
    color: #006700;
}
i.actioned {
    font-size: 12pt;
}

div, td {
    font-size: 11pt;
    padding: auto;
}
.pad10 {
    padding: 10px !important;
}
.pad5 {
    padding: 5px;
}
.pad4 {
    padding: 4px;
}
.pad3 {
    padding: 3px;
}
.pad2 {
    padding: 3px;
}
.pad0 {
    padding: 0 !important;
}
.marginR3 {
    margin-right: 3px;
}
.margin2 {
    margin: 2px;
}
.bold {
    font-weight: bold;
}
.not_bold {
    font-weight: normal !important;
}
.perc100 {
    width: 100%;
}
.perc100eye {
    width: calc(100% - 30px);
}
.perc50 {
    width: 50%;
}
.perc45 {
    width: 45%;
}
.perc40 {
    width: 40%;
}
.perc37 {
    width: 37%;
}
.perc35 {
    width: 35%;
}
.perc25 {
    width: 25%;
}
.width60 {
    width: 60px;
}
.width70 {
    width: 70px;
}
.width75 {
    width: 75px;
}
.width130 {
    width: 130px;
}
.attend_left {
    width: 145px !important;
}
.exclude_left {
    width: 137px !important;
}
.left {
    text-align: left !important;
}
.center {
    text-align: center !important;
}
.right {
    text-align: right !important;
}
.top {
    vertical-align: top !important;
}
.middle {
    vertical-align: middle !important;
    margin: auto !important;
}
.bottom {
    vertical-align: bottom !important;
}

input[type="text"], input[type="password"], input[type="number"], input[type="date"], input[type="time"], input[type="file"], select, textarea {
    color: #271d5c;
    border: 1px inset #eee;
    padding: 3px;
    background: #f9f9fb;
    border-radius: 5px;
    font-weight: normal;
    font-size: 11pt;
    min-height: 30px;
}
.input {
    color: inherit; /* #22d;*/
    font-weight: normal;
    font-size: 11pt;
}
select {
    width: 100%;
}
.multi_select {
    width: unset;
    height: unset;
}
.text-input {
    width: 100% !important;
}
.number-input {
    width: 80px !important;
    text-align: center;
}
.date-input {
    width: 115px !important;
}
.time-input {
    width: 80px !important;
}
.textarea-input {
    color: #271d5c;
    white-space: pre-wrap; /* normal pre-line pre-wrap */
    font-size: 15px;
    min-width: 500px;
    width: 100%;
    min-height: 200px;
    height: 100%;
    border: 1px inset #eee;
    padding: 3px 3px 3px 6px;
    border-radius: 5px;
    margin: 0;
}
.form_row {
    padding: 3px;
}
.form_row:active, .form_row:checked, .form_row:focus {
    color: #fff;
    background: #271d5c;
}
.inactive_answer {
    color: #700;
    background: #faa;
}
button, submit, input[type="submit"] {
    background: #271d5c;
    border: 1px outset white;
    padding: 8px 16px;
    color: #f0f0f4;
    border-radius: 20px;
    font-size: 15px;
    min-width: 100px;
    box-shadow: none;
    white-space: nowrap; /* normal pre-line pre-wrap */
    outline: 1px solid inherit;
}
.countdown {
    color: #20C6df;
}
.countdown_30 {
    color: #fa0;
}
.countdown_10 {
    color: #f33;
}
button:hover, input[type="submit"]:hover {
    /*box-shadow: 0 1px 3px #271d5c;*/
    outline: 1px solid #20C6df !important;
}
button:active, input[type="submit"]:active {
    /*border: 1px inset white;
    box-shadow: none;*/
    outline: 1px solid #20C6df !important;
}
input[type=checkbox]{
	position     : relative;
	cursor       : pointer;
	width        : 17px;
	height       : 17px;
    margin       : 9px 3px 9px 10px;
    padding: 0;
}
input[type=checkbox]:before {
	content          : "";
	display          : block;
	position         : absolute;
	width            : 18px;
	height           : 18px;
	top              : 0;
	left             : 0;
	border           : 1px inset #fff;
	border-radius    : 3px;
	background-color : #f9f9fb;
}
input[type=checkbox]:checked:after {
	content           : "";
	display           : block;
	position          : absolute;
	width             : 5px;
	top               : 2px;
	left              : 6px;
	height            : 11px;
	border            : solid #271d5c;
	border-width      : 0 2px 2px 0;
	-webkit-transform : rotate(45deg);
	-ms-transform     : rotate(45deg);
	transform         : rotate(45deg);
}

input[type="radio"] {
    margin: 8px 5px -3px 9px;
    background-color: #f9f9fb;
    border-radius: 10px;
    cursor: pointer;
    position: relative;
    width   : 17px;
    height  : 17px;
    -webkit-appearance: none;
    border: 1px inset white;
}
input[type="radio"]:after {
    background-color: transparent;
    border-radius: 10px;
    content: '';
    display: block;
    position: relative;
    left    : 1px;
    top     : 1px;
    width   : 13px;
    height  : 13px;
    margin-bottom: 5px;
}
input[type="radio"]:checked:after {
    background: radial-gradient(circle, #fff, #20C6df, #271d5c, #271d5c); /* 20C6df */
}

.disabled, input[type="text"][disabled], input[type="password"][disabled], input[type="date"][disabled], input[type="time"][disabled], input[type="number"][disabled] {
    /*color: #fff;
    background: #271d5c;*/
}
.disabled .form_row:active, .disabled .form_row:checked {
    background: #f0f0f4;
    color: #271d5c;
}
.duration_block {
    border: 1px inset #fff;
    border-radius: 5px;
    padding: 0;
    margin: 3px;
    background: #f0f0f4;
}
.secure {
    -webkit-text-security: square;
}
.center-block {
    display: inline-block;
    text-align: center;
}
.small.greyed {
    font-size: 10pt;
    color: #666;
}
.small {
    font-size: 10pt !important;
}
.attend_ref {
    font-size: 10pt !important;
    color: #ccc;
}
.tiny {
    font-size: 8pt;
}
.eyeball {
    cursor: pointer;
    font-size: 14pt;
    margin-left: 5px;
}
.text-red {
    color: red !important;
}
.text-green {
    color: #006800 !important;
}
.float-left {
    float: left;
}
.float-right {
    float: right;
}
.nowrap {
    white-space: nowrap;
}
.wrap_careless {
    overflow-wrap: break-word !important;
    word-break: break-all;
}
.email_str {
    font-family: Consolas, Courier New;
    color: #44f;
}
.active-badge {
    font-size: 14pt;
}
.inactive {
    color: #ccc !important;
}
.larger {
    font-size: 12pt;
}
.logged-in {
    color: #0A0 !important;
}
.logged-out {
    color: #A00 !important;
}
.logged-any {
    -webkit-animation: flash-logged-any 1s infinite;
    -moz-animation: flash-logged-any 1s infinite;
    -o-animation: flash-logged-any 1s infinite;
    animation: flash-logged-any 1s infinite;
}
@-o-keyframes flash-logged-any {
}
@-moz-keyframes flash-logged-any {
}
@-webkit-keyframes flash-logged-any {
}
@keyframes flash-logged-any {
    0% {
        color: #A00;
    }
    50% {
        color: #0A0;
    }
    100% {
        color: #A00;
    }
}

.modal_panel {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #161136;
    opacity: 0.35;
    filter: alpha(opacity = 35);
}
.attendance_limiter {
    width: 765px !important;
}
.exclusion_upload_limiter {
    width: 600px !important;
}
.message_board {
    display: none;
    position: absolute;
    text-align: center;
    font-weight: bold;
    color: #c00;
    font-size: 13pt;
    border: 3px double #666;
    background: #fff;
    box-shadow: 0 2px 10px #000;
    padding: 10px;
    margin: auto !important;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    -webkit-transform: translate(-50%, -50%);
    cursor: pointer;
}
.confirm_popup_manual {
    position: absolute;
    text-align: center;
    border: 3px double #666;
    background: #fff;
    box-shadow: 0 2px 10px #000;
    padding: 10px;
    color: #000;
}
.confirm_popup {
    display: none;
    position: absolute;
    text-align: center;
    border: 3px double #666;
    background: #fff;
    box-shadow: 0 2px 10px #000;
    padding: 10px;
    color: #000;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    -webkit-transform: translate(-50%, -50%);
}
.confirm_button {
    color: #271d5c;
    background: #f0f0f4;
    /*display: inline-block;
    padding: 4px;
    margin: 5px;
    border: 2px outset #ddd;
    color: #fff;
    text-decoration: none;
    min-width: 60px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 11pt !important;
    white-space: nowrap;*/ /* normal pre-line pre-wrap */
}
.remove-row, .add-row {
    cursor: pointer;
}
i.row-manipulate {
    padding: 5px;
    font-size: 15pt;
}
.confirm_button.yes {
    background: #006800;
    color: #fff;
    border-color: #0c0;
}
.confirm_button.yes:hover {
    text-decoration: none;
    background: #0a0;
}
.confirm_button.no {
    background: #680000;
    color: #fff;
    border-color: #c00;
}
.confirm_button.no:hover {
    text-decoration: none;
    background: #a00;
}
.add-row {
    color: #006800;
}
.add-row:hover {
    text-decoration: none;
    color: #0a0;
}
.remove-row {
    color: #680000;
}
.remove-row:hover {
    text-decoration: none;
    color: #a00;
}

.close {
    background: #fff !important;
    color: #680000 !important;
}
.close:hover {
    text-decoration: none;
    color: #a00 !important;
}
.td_table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    color: #271d5c;
    background: #f0f0f0 !important;
}
.td_table.center {
    margin: 0 auto;
}
.clear_table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    color: #271d5c;
    margin: 2px auto;
}
.th_tr {
}
.th {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    color: #fff;
    background: #271d5c;
    border: 1px solid #ccc;
    padding: 5px;
    font-weight: bold;
    z-index: 999;
}
.th_ns {
    top: 0;
    color: #fff;
    background: #271d5c;
    border: 1px solid #ccc;
    padding: 5px;
    font-weight: bold;
}
.td_h {
    font-size: 11pt;
    /*white-space: nowrap;*/
    border: 1px solid #ccc;
    padding: 3px;
}
.td_n {
    font-size: 11pt;
    /*white-space: nowrap;
    border: 1px solid #ccc;*/
    padding: 3px;
}
.td_b {
    font-size: 11pt;
    /*white-space: nowrap;*/
    border-bottom: 1px solid #ccc;
    padding: 3px;
}
.edit_form_title {
    border: 1px solid #0c081a;
	background: #271d5c;
    color: #fff;
    font-weight: bold;
    text-align: center;
    cursor: move !important;
    padding: 5px;
}
.td_d {
    width: 100%;
    border: 1px solid #ccc;
    padding: 3px;
}
.td_p {
    border: 1px solid #fff;
    background: #fff !important;
    padding: 10px 0 0 0;
    text-align: center;
}
.listing_div {
    min-width: 400px;
    max-width: 700px;
    max-height: 400px;
    overflow: auto visible;
    border: 1px inset white;
}
.alert_div {
    max-width: 75%;
}
.confirm_dialog {
    font-size: 11pt;
}
.pointer {
    cursor: pointer;
}
.upDown {
    cursor: ns-resize !important;
}
.leftRight {
    cursor: ew-resize !important;
}
.upDownLeftRight {
    cursor: move !important;
}
.block-option {
    padding: 0;
    margin: 1px 0 0 0;
    cursor: pointer;
    font-size: 12pt;
    background: #fff;
    border-radius: 5px;
    border: 1px outset #ccc;
    color: #008;
    text-decoration: none;
    min-width: 23px;
    margin-left: 5px;
}
.block-icon {
    padding: 3px 3px 0 4px;
    margin: 0 0 0 0;
}

@-webkit-keyframes clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@-moz-keyframes clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@-o-keyframes clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.spinner {
    -webkit-animation: clockwise 1s linear infinite;
    -moz-animation: clockwise 1s linear infinite;
    -o-animation: clockwise 1s linear infinite;
    animation: clockwise 1s linear infinite;
    padding: 1px 0 0 0;
}

.head_0 {
    color: #fff;
    background: #2d2170;
    border: 1px solid #666;
    padding: 5px;
}
.head_1 {
    color: #fff;
    background: #271d5c;
    border: 1px solid #ccc;
    padding: 5px;
}

.stripe_0 {
	background: #f0f0f0;
}
.stripe_0:hover {
	background: #f3f3f3;
}
.stripe_1 {
	background: #fcfcfc;
}
.stripe_1:hover {
	background: #ffffff;
}

/* START CP Admin Specific */
.campaign-color {
    color: #D00;
}
.campaign-bg {
    background: linear-gradient(90deg, #Fdd, #fee, #fdd) !important;
}
.campaign-div {
    border: 2px solid #D00;
    color: #D00;
}
.campaign-div:hover {
    border: 2px solid #f44;
    color: #D00 !important;
}
.campaign-div-on {
    border: 2px solid #A00;
    background: #D00;
    color: #fff;
}
.campaign-div-on:hover {
    background: #F33 !important;
    color: #fff;
}
@-o-keyframes flash-campaign-any {
}
@-moz-keyframes flash-campaign-any {
}
@-webkit-keyframes flash-campaign-any {
}
@keyframes flash-campaign-any {
    0% {
        color: #D00;
    }
    50% {
        color: #CCC;
    }
    100% {
        color: #D00;
    }
}
.campaign-any {
    -webkit-animation: flash-campaign-any 1s infinite;
    -moz-animation: flash-campaign-any 1s infinite;
    -o-animation: flash-campaign-any 1s infinite;
    animation: flash-campaign-any 1s infinite;
}


.active-color {
    color: #0A0;
}
.active-any {
    -webkit-animation: flash-active-any 1s infinite;
    -moz-animation: flash-active-any 1s infinite;
    -o-animation: flash-active-any 1s infinite;
    animation: flash-active-any 1s infinite;
}
@-o-keyframes flash-active-any {
}
@-moz-keyframes flash-active-any {
}
@-webkit-keyframes flash-active-any {
}
@keyframes flash-active-any {
    0% {
        color: #0A0;
    }
    50% {
        color: #ccc;
    }
    100% {
        color: #0A0;
    }
}

.campaign-pause {
    color:  royalblue
}
.campaign_date  { /* date input */
    width: 110px !important;
    white-space: nowrap; /* normal pre-line pre-wrap */
}
.start, .campaign-play {
    color: #006800;
    text-align: right;
}
.end, .campaign-stop {
    color: #680000;
    text-align: left;
}
.campaign-pause, .campaign-play, .campaign-stop {
    font-size: 13pt;
}
.no-count-color {
    color: #888 !important;
}
.operator_details {
    width: 100%;
    /*max-height: 200px;
    overflow: auto visible;*/
    padding: 0 5px 15px 5px;
}
/* END CP Admin Specific */

.circle-back {
    background: white;
    border-radius: 12px;
    padding: 3px;
}
.warning-triangle {
    color: #ff0;
    background: #f00;
    border-radius: 9px;
    font-size: 12pt;
    text-shadow: 0 0 5px #f00;
}
.act {
    cursor: pointer;
}
.easter-egg {
    cursor: default !important;
}
.drill-eye {
    color: #46e;
    font-size: 14pt;
    padding: 4px 8px 2px 8px;
}
.drill-eye:hover {
    color: #46e;
    background: #ddf;
}
.rag_b {
    color: #007;
    background: #aaf;
}
.rag_b:hover {
    color: #007;
    background: #ccf;
}
.rag_r {
    color: #770000;
    background: #FFB8B8;
}
.rag_r:hover {
    color: #700;
    background: #fce2e2 !important;
}
.rag_a {
    color: #753A00;
    background: #FFEAB3;
}
.rag_a:hover {
    color: #a60;
    background: #fff4cc !important;
}
.rag_g {
    color: #005700;
    background: #99ff99;
}
.rag_g:hover {
    color: #060;
    background: #e3ffe3 !important;
}
.perc-cell {
    text-align: center;
    padding: 3px 10px 3px 10px;
    min-width: 45px;
}
.key-stage-info {
    margin: -1px 0 5px 5px;
    padding: 3px 6px 2px 5px;
    font-size: 10pt !important;
    /*white-space: nowrap;*/
    font-weight: normal !important;
}

/* START DATA COLLECTION */
.cp_spaced {
    padding-right: 20px;
    padding-left: 20px;
}
.cp_tabs {
    text-align: center;
    padding: 0;
    margin: 0;
    vertical-align: middle;
    height: 63px;
    border-top: 5px solid #271d5c;
}
.cp_back_button {
    /*float: right;*/
    margin: 10px 5px 10px 0;
    min-width: 120px;
}
.cp_save_button {
    /*float: right;*/
    margin: 10px 0 10px 5px;
    min-width: 120px;
}

.cp_tab {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    z-index: 100;
    color: #271d5c;
    background: #20C6df; /*linear-gradient(-45deg, #ddf, #f0f0ff, #ddf);*/
    font-size: 17px;
    text-align: left;
    cursor: pointer;
    line-height: 1;
    padding: 10px;
    vertical-align: middle;
    font-weight: bold;
    border-top: 1px solid #fff;
}
.cp_data {
    position: relative;
    left: 0;
    right: 0;
    height: 300px;
    padding: 0 0 0 0; /* 13px */
    overflow: auto;
}
.cp_profile {
    /*background: #20C6df; /*linear-gradient(-45deg, #ddf, #f0f0ff, #ddf);*/
    /*padding-bottom: 30px;*/
}
.cp_inform {
    border: 1px inset #eee;
    background: #fff; /*linear-gradient(-45deg, #fff, #f8f8f8, #fff);*/
    margin: 10px;
    padding: 10px;
    border-radius: 5px;
}
.cp_block {
    border: 1px inset #eee;
    background: #fff; /*linear-gradient(-45deg, #fff, #f8f8f8, #fff);*/
    margin: 10px;
    padding: 5px 5px 40px 5px;
    border-radius: 5px;
}
.column-cell {

}
.radio-span {
    text-align: center !important;
}
label {
    padding: 0;
}
.radio-label {
    border: 1px dotted #ccc;
    padding-right: 10px;
    padding-bottom: 6px;
    cursor: pointer;
}
.checkbox-label {
    border: 1px dotted #ccc;
    padding-right: 10px;
    cursor: pointer;
}
.radio-block {
    display: inline-block;
    text-align: left;
}
.radio-option {
    float: right;
    border: 1px dotted grey !important;
}
.radio-0 {
    width: 30px;
    height: 24px;
}
.radio-1 {
    width: 24px;
    height: 30px;
}
/* AND DATA COLLECTION */


.copy_direct {
    cursor: grab !important;
}
.copied {
    cursor: grabbing !important;
    color: royalblue !important;
    background: yellow !important;
    /* font-style: italic !important; */
    text-decoration: underline !important;
}

.cohort-color {
    color: #d0d;
}
.cohort-bg {
    background: linear-gradient(90deg, #ece, #fdf, #ece) !important;
}
.operator-color {
    color: #08d;
}
.operator-bg {
    background: linear-gradient(90deg, #adf, #def, #adf) !important;
}
.debug-color {
    color: #a60000;
}
.submitted-color {
    color: #006428;
}


@-webkit-keyframes debug-info {
}
@-moz-keyframes debug-info {
}
@-o-keyframes debug-info {
}
@keyframes debug-info {
    0% {
        color: #fff;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    30% {
        color: #251b5b;
        background: #fff; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    70% {
        color: #fff;
        background: #251b5b; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
    100% {
        color: #fff;
        background: #20C6df; /*linear-gradient(0deg, #f39a33, #b00000, #f39a33);*/
    }
}
.flash-debug-info {
    margin: 2px;
    padding: 3px;
    border-radius: 10px;
    -webkit-animation: debug-info 2s linear infinite;
    -moz-animation: debug-info 2s linear infinite;
    -o-animation: debug-info 2s linear infinite;
    animation: debug-info 2s linear infinite;
}

.note_present {
	font-size: 19px;
	color: #251b5b !important;
}

.search_result {
    /*
    background: #ff0;
    */
    font-style: italic;
    color: #558;
    background: rgba(255, 255, 130, 0.75);
    border: 1px solid #ff8080;
}

.cp_block.key_holder {
    vertical-align: top !important;
    padding-bottom: 5px;
}
.key_block {
    display: inline-block;
    border: 1px inset #eee !important;
    border-radius: 5px;
    margin: 5px;
    padding: 5px;
    vertical-align: top;
    max-width: 350px;
}
.key_row {
}
.key_head {
    font-size: 10.5pt;
    font-weight: bold;
    text-align: center;
}
.key_answer {
    font-size: 10pt;
    text-align: right;
    font-weight: bold;
    /*padding: 2px 4px 1px 1px;*/
    padding-left: 3px;
    white-space: nowrap; /* normal pre-line pre-wrap */
    vertical-align: middle !important;
}
.key_help {
    font-size: 9pt;
    color: #444;
    text-align: left;
    /*padding: 4px 2px 1px 0;*/
    padding-left: 3px;
    width: 100%;
    vertical-align: middle !important;
}


/* START ATTENDANCE SHEETS */
.missing_data {
    color: #800;
}
.up_to_date {
    color: #080;
}
.attendance_data {
    position: relative;
    margin-top: 20px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 10px;
    overflow: auto;
    text-align: center;
    border: 1px solid #ddd;
}
.weekend {
    min-height: 30px;
    color: #666;
    background: #ddd;
}
.target-day {
    color: #251b5b;
    background: #6cdef3;
    border: 1px outset #6cdef3;
}
.past-day {
    color: #fff;
    background: #251b5b;
    border: 1px outset #251b5b;
}
.future-day {
    color: #fff;
    background: #09032c;
    border: 1px outset #09032c;
}
.not-monitored {
    color: #20C6df;
}
.wrong-school {
    color: #09032c;
    background: #20C6df;
    border: 1px inset #20C6df !important;
    margin: 0;
    padding: 2px;
    border-radius: 5px;
}
.editor_details {
    display: inline-block;
    text-align: center;
    margin: 1px;
    border-radius: 5px;
    width: 100%;
    font-size: 8pt;
}
.editor_details_date {
    width: 160px;
}
.push-top {
    margin-top: 2px !important;
}
.ok-mark {
    color: #09032c;
    background: #f0f0f4;
    border: 1px inset #f0f0f4;
    margin: 0;
    padding: 3px;
    border-radius: 5px;
}
.bad-mark {
    color: #fff;
    background: #f00;
    border: 1px inset #f00;
    margin: 0;
    padding: 3px;
    border-radius: 5px;
}
.missing-mark {
    color: #fff;
    background: #f00;
    border: 1px inset #f00 !important;
    margin: 0;
    padding: 3px;
    border-radius: 5px;
}
.missing-mark-ok {
    color: #fff;
    background: #800;
    border: 1px inset #800 !important;
    margin: 0;
    padding: 3px;
    border-radius: 5px;
}
.note-icon {
    color: #0044aa;
    background: #fff;
    padding: 4px 5px 3px 4px;
    border-radius: 20px;
    font-size: 8pt;
    text-shadow: none;
    margin-left: 3px;
}
@-o-keyframes note-icon-flash {
}
@-moz-keyframes note-icon-flash {
}
@-webkit-keyframes note-icon-flash {
}
@keyframes note-icon-flash {
    0% {
        color: #0044aa;
        background: #fff;
    }
    40% {
        color: #0044aa;
        background: #fff;
    }
    45% {
        color: #fff;
        background: #f00;
    }
    55% {
        color: #000;
        background: #ff0;
    }
    60% {
        color: #0044aa;
        background: #fff;
    }
    100% {
        color: #0044aa;
        background: #fff;
    }
}
.note-icon-flash {
    padding: 5px 5px 3px 5px;
    border-radius: 20px;
    font-size: 8pt;
    text-shadow: none;
    margin-left: 3px;
    -webkit-animation: note-icon-flash 0.75s infinite;
    -moz-animation: note-icon-flash 0.75s infinite;
    -o-animation: note-icon-flash 0.75s infinite;
    animation: note-icon-flash 0.75s infinite;
}
.no-entry {
    color: #3377dd;
    padding: 3px;
    border-radius: 20px;
    font-size: 10pt;
    font-weight: bold;
}
.confirm {
    color: forestgreen;
    background: #fff;
    padding: 3px 3px 2px 3px;
    border-radius: 20px;
    font-size: 10pt;
    text-shadow: none;
    margin-left: 3px;
}
@-o-keyframes confirm-flash {
}
@-moz-keyframes confirm-flash {
}
@-webkit-keyframes confirm-flash {
}
@keyframes confirm-flash {
    0% {
        color: forestgreen;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
    }
    40% {
        color: forestgreen;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
    }
    45% {
        color: #fff;
        background: forestgreen;
        border-radius: 20px;
        font-size: 10pt;
    }
    55% {
        color: #f00;
        background: #ff0;
        border-radius: 20px;
        font-size: 10pt;
    }
    60% {
        color: forestgreen;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
    }
    100% {
        color: forestgreen;
        background: #fff;
        border-radius: 20px;
        border-radius: 20px;
        font-size: 10pt;
    }
}
.confirm-flash {
    text-shadow: none;
    padding: 3px 2px 2px 2px;
    -webkit-animation: confirm-flash 0.75s infinite;
    -moz-animation: confirm-flash 0.75s infinite;
    -o-animation: confirm-flash 0.75s infinite;
    animation: confirm-flash 0.75s infinite;
}
.not-confirm {
    color: #f00;
    background: #fff;
    padding: 3px 3px 2px 3px;
    border-radius: 20px;
    font-size: 10pt;
    text-shadow: none;
    margin-left: 3px;
}
@-o-keyframes not-confirm-flash {
}
@-moz-keyframes not-confirm-flash {
}
@-webkit-keyframes not-confirm-flash {
}
@keyframes not-confirm-flash {
    0% {
        color: #f00;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
    40% {
        color: #f00;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
    45% {
        color: #fff;
        background: #f00;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
    55% {
        color: #000;
        background: #ff0;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
    60% {
        color: #f00;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
    100% {
        color: #f00;
        background: #fff;
        border-radius: 20px;
        font-size: 10pt;
        text-shadow: none;
    }
}
.not-confirm-flash {
    padding: 3px 2px 2px 2px;
    -webkit-animation: not-confirm-flash 0.75s infinite;
    -moz-animation: not-confirm-flash 0.75s infinite;
    -o-animation: not-confirm-flash 0.75s infinite;
    animation: not-confirm-flash 0.75s infinite;
}

.error-div {
    font-weight: normal !important;
    background: #F00;
    color: #FF0 !important;
}

/* EXCLUSION ICONS */
.excl_ref {
    color: #fff;
    background: #b00;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 4px 4px 4px;
}
@-o-keyframes flash_excl_ref {}
@-moz-keyframes flash_excl_ref {}
@-webkit-keyframes flash_excl_ref {}
@keyframes flash_excl_ref {
    0% {
        color: #fff;
        background: #b00;
    }
    50% {
        color: #b00;
        background: #fff;
    }
    100% {
        color: #fff;
        background: #b00;
    }
}
.excl_ref.flash, .excl_ref:checked, .excl_ref:active {
    -webkit-animation: flash_excl_ref 1s infinite;
    -moz-animation: flash_excl_ref 1s infinite;
    -o-animation: flash_excl_ref 1s infinite;
    animation: flash_excl_ref 1s infinite;
}

.excl_not {
    color: #b00;
    background: yellow;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 7px 4px 8px;
}
@-o-keyframes flash_excl_not {}
@-moz-keyframes flash_excl_not {}
@-webkit-keyframes flash_excl_not {}
@keyframes flash_excl_not {
    0% {
        color: #b00;
        background: yellow;
    }
    50% {
        color: yellow;
        background: #b00;
    }
    100% {
        color: #b00;
        background: yellow;
    }
}
.excl_not.flash, .excl_not:checked, .excl_not:active {
    -webkit-animation: flash_excl_not 1s infinite;
    -moz-animation: flash_excl_not 1s infinite;
    -o-animation: flash_excl_not 1s infinite;
    animation: flash_excl_not 1s infinite;
}

.excl_res {
    color: #b00;
    background: #ff0;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 7px 4px 8px;
}
@-o-keyframes flash_excl_res {}
@-moz-keyframes flash_excl_res {}
@-webkit-keyframes flash_excl_res {}
@keyframes flash_excl_res {
    0% {
        color: #b00;
        background: #ff0;
    }
    50% {
        color: #ff0;
        background: #b00;
    }
    100% {
        color: #b00;
        background: #ff0;
    }
}
.excl_res.flash, .excl_res:checked, .excl_res:active {
    -webkit-animation: flash_excl_res 1s infinite;
    -moz-animation: flash_excl_res 1s infinite;
    -o-animation: flash_excl_res 1s infinite;
    animation: flash_excl_res 1s infinite;
}

.excl_req {
    color: #b00;
    background: #fff;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 4px 3px 4px;
}
@-o-keyframes flash_excl_req {}
@-moz-keyframes flash_excl_req {}
@-webkit-keyframes flash_excl_req {}
@keyframes flash_excl_req {
    0% {
        color: #b00;
        background: #fff;
    }
    50% {
        color: #fff;
        background: #b00;
    }
    100% {
        color: #b00;
        background: #fff;
    }
}
.excl_req.flash, .excl_req:checked, .excl_req:active {
    -webkit-animation: flash_excl_req 1s infinite;
    -moz-animation: flash_excl_req 1s infinite;
    -o-animation: flash_excl_req 1s infinite;
    animation: flash_excl_req 1s infinite;
}

.excl_waiting {
    color: #fff;
    background: #0044aa;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 5px 4px 4px;
}
@-o-keyframes flash_excl_waiting {}
@-moz-keyframes flash_excl_waiting {}
@-webkit-keyframes flash_excl_waiting {}
@keyframes flash_excl_waiting {
    0% {
        color: #fff;
        background: #0044aa;
    }
    50% {
        color: #0044aa;
        background: #fff;
    }
    100% {
        color: #fff;
        background: #0044aa;
    }
}
.excl_waiting.flash, .excl_waiting:checked, .excl_waiting:active {
    -webkit-animation: flash_excl_waiting 1s infinite;
    -moz-animation: flash_excl_waiting 1s infinite;
    -o-animation: flash_excl_waiting 1s infinite;
    animation: flash_excl_waiting 1s infinite;
}

.excl_ready {
    color: #fff;
    background: #0044aa;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 5px 4px 4px;
}
@-o-keyframes flash_excl_ready {}
@-moz-keyframes flash_excl_ready {}
@-webkit-keyframes flash_excl_ready {}
@keyframes flash_excl_ready {
    0% {
        color: #fff;
        background: #0044aa;
    }
    50% {
        color: #0044aa;
        background: #fff;
    }
    100% {
        color: #fff;
        background: #0044aa;
    }
}
.excl_ready.flash, .excl_ready:checked, .excl_ready:active {
    -webkit-animation: flash_excl_ready 1s infinite;
    -moz-animation: flash_excl_ready 1s infinite;
    -o-animation: flash_excl_ready 1s infinite;
    animation: flash_excl_ready 1s infinite;
}

.excl_done {
    color: #0044aa;
    background: #fff;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 4px 4px 4px;
}
@-o-keyframes flash_excl_done {}
@-moz-keyframes flash_excl_done {}
@-webkit-keyframes flash_excl_done {}
@keyframes flash_excl_done {
    0% {
        color: #0044aa;
        background: #fff;
    }
    50% {
        color: #fff;
        background: #0044aa;
    }
    100% {
        color: #0044aa;
        background: #fff;
    }
}
.excl_done.flash, .excl_done:checked, .excl_done:active {
    -webkit-animation: flash_excl_done 1s infinite;
    -moz-animation: flash_excl_done 1s infinite;
    -o-animation: flash_excl_done 1s infinite;
    animation: flash_excl_done 1s infinite;
}

.excl_ban {
    color: #b00;
    background: #fff;
    font-size: 13pt;
    border-radius: 10px;
}
@-o-keyframes flash_excl_ban {}
@-moz-keyframes flash_excl_ban {}
@-webkit-keyframes flash_excl_ban {}
@keyframes flash_excl_ban {
    0% {
        color: #b00;
        background: #fff;
    }
    50% {
        color: #fff;
        background: #b00;
    }
    100% {
        color: #b00;
        background: #fff;
    }
}
.excl_ban.flash, .excl_ban:checked, .excl_ban:active {
    -webkit-animation: flash_excl_ban 1s infinite;
    -moz-animation: flash_excl_ban 1s infinite;
    -o-animation: flash_excl_ban 1s infinite;
    animation: flash_excl_ban 1s infinite;
}

.excl_miss {
    color: #f00;
    background: #fff;
    font-size: 8pt;
    border-radius: 10px;
    padding: 4px 5px 3px 4px;
}
@-o-keyframes flash_excl_miss {}
@-moz-keyframes flash_excl_miss {}
@-webkit-keyframes flash_excl_miss {}
@keyframes flash_excl_miss {
    0% {
        color: #f00;
        background: #fff;
    }
    50% {
        color: #fff;
        background: #f00;
    }
    100% {
        color: #f00;
        background: #fff;
    }
}
.excl_miss.flash, .excl_miss:checked, .excl_miss:active {
    -webkit-animation: flash_excl_miss 1s infinite;
    -moz-animation: flash_excl_miss 1s infinite;
    -o-animation: flash_excl_miss 1s infinite;
    animation: flash_excl_miss 1s infinite;
}

.optional_form {
    font-size: 6pt;
    color: transparent;
}
.mandatory_form {
    font-size: 6pt;
    color: red;
}
.partial_form {
    font-size: 6pt;
    color: blue;
}
.authorised_message {
    text-align: center;
    border: 1px inset #fff;
    margin: 1px;
    border-radius: 5px;
}
.authorised_yes {
    background: #070;
    color: #9f9;
}
.authorised_no {
    background: #700;
    color: #faa;
}
.text-transparent {
    color: transparent !important;
    text-shadow: none !important;
}
.additional_free_text {
    width: 250px;
    height: 102px;
    margin: 0;
}
.additional_free_text_hide {
    width: 250px;
    height: 106px;
    margin: 0;
}
.monospaced {
    font-family: Consolas, Courier New, serif !important;
    font-size: 9pt;
    white-space: pre-wrap; /* normal pre-line pre-wrap */
    color: inherit;
}

/*  Exclusion Tabs */
.exclusion_block {
    border: 1px inset #fff;
    border-radius: 5px;
    padding: 0;
    margin: 3px;
    background: #f0f0f4;
}
.inner-tab-button {
    display: inline-block;
    cursor: pointer;
    background: linear-gradient(0deg, #eee, #eee, #eee, #eee, #eee, #eee, #ddd);
    border: 1px outset white;
    border-top: 0px;
    border-radius: 0px 0px 7px 7px;
    margin-left: 5px !important;
    padding: 5px 4px 1px 4px !important;
    margin-bottom: 1px !important;
    min-width: 110px;
}
.inner-tab-button:hover {
    background: linear-gradient(0deg, #eee, #eee, #eee, #eee, #eee, #eee, #fff);
}
.live-tab {
    box-shadow: 0px -2px 10px #fff, 0px 1px 6px #888;
}
.active-tab {
    background: linear-gradient(0deg, #cec, #cec, #cec, #cec, #efe, #cec);
}
.active-tab.live-tab {
    background: linear-gradient(0deg, #9e9, #9e9, #9e9, #9e9, #bfb, #9e9);
}
.active-tab:hover, .active-tab:focus {
    background: linear-gradient(0deg, #7d7, #7d7, #7d7, #7d7, #9f9, #7d7);
}
.inactive-tab {
    background: linear-gradient(0deg, #ecc, #ecc, #ecc, #ecc, #fee, #ecc);
}
.inactive-tab.live-tab {
    background: linear-gradient(0deg, #e99, #e99, #e99, #e99, #fbb, #e99);
}
.inactive-tab:hover, .inactive-tab:focus {
    background: linear-gradient(0deg, #e88, #e88, #e88, #e88, #faa, #e88);
}
.exclusion_block_inner {
    overflow: hidden;
    height: 114px;
    padding: 3px;
}
.child-submit, .child-cancel, .upload-submit, .upload-cancel {
    min-height: 60px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
}
.child-submit:hover, .upload-submit:hover {
    box-shadow: 0px 0px 2px 2px #9e9;
}
.child-submit:focus, .upload-submit:focus {
    outline: 1px outset #0a0;
    outline-offset: 1px;
}
.child-cancel:hover, .upload-cancel:hover {
    box-shadow: 0px 0px 2px 2px #e99;
}
.child-cancel:focus, .upload-cancel:focus {
    outline: 1px outset #a00;
    outline-offset: 1px;
}
.top-down {
    margin-top: 4px !important;
}
.ib {
    color: #259125;
    padding: 2px 0 0 1px;
    font-size: 11pt;
}
.ob {
    color: #bb0101;
    padding: 2px 0 0 1px;
    font-size: 11pt;
}
button:disabled, button[disabled] {
    background: #888;
}
.doc_message {
    font-weight: bold;
    color: #0044aa;
}
/* END ATTENDANCE SHEETS */