/*  apply_css_stylesheet.php - Antoine Robinson 23rd September 2021 - Part of Online Student Application System    */
@import url('../../../global/fonts/sohopro/stylesheet.css');

*{
	margin:0;
	padding:0;
}

@font-face {
    font-family:dosis;
	src: url('../../../global/fonts/dosis/dosis-semibold.ttf');
    src: url('../../../global/fonts/dosis/dosis-semibold.ttf') format('opentype'),
	url('../../../global/fonts/dosis/dosis-semibold.ttf') format('truetype');
}

@font-face {
    font-family:asap;
    src: url('../../../global/fonts/asap/asap-regular.ttf') format('opentype'),
	url('../../../global/fonts/asap/asap-regular.ttf') format('truetype');
}

@font-face {
	font-family:open-sans;
	src: url('../../../global/fonts/open-sans/opensans-regular.ttf'),
	url('../../../global/fonts/open-sans/opensans-regular.ttf') format('truetype')	;
}

/* @font-face {
	font-family:heading-pro;
	src: url('../../../global/fonts/heading-pro/HeadingCompressedPro-Regular.otf'),
	url('../../../global/fonts/heading-pro/HeadingCompressedPro-Bold.otf') format('opentype')	;
} */

body{
	font:1.2em 'Soho Pro', sans-serif;
	font-family: 'Soho Pro', sans-serif;
	line-height: 130%;
	color:white;
	background-color:#f1eef7;	  /* #FAF9F6 (live) #eceaff (test)   E4FF89 (test_previous) */	
	width: 100%;	
	margin: 0;
	overflow: hidden;
	margin-left: 0;
	min-width: 340px !important;
	font-weight: bold;
}
.clearboth{
	clear:both;
}

#darken_background, #darken_background2, #darken_background3 {
	display: none;
	position: absolute;
	z-index: 3150;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	filter:alpha(opacity=30);
	-moz-opacity: 0.3;
	opacity: 0.3;
}

#darken_background2 {
	z-index: 600;
}

#darken_background3 {
	z-index: 900;
}

#idx_initialscreen {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #5C3F84;
	color: #EEE2FF;
	
}

#img_large_wykelogo, #img_large_vprtl_logo {
	position: absolute;
}

#img_large_vprtl_logo.hidden {
	display: none !important;
}

#img_large_vprtl_logo, #img_large_wykelogo {
	-webkit-filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5));
	filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));	
}


#container{
	margin: 0;
	height: 100%;	
	overflow: hidden;
	/* background: url('../images/college_purple_wallpaper2.jpg') center; */
	background-color: #2b2340;
	position: fixed;
}

#container a {
	color:#382354;
	text-decoration:none;
}
#container a:hover, #footer a:hover{	
	color:#5C3F84;
}


#img_logo {
	position: absolute;
	top: 16px;
	right: 170px;
	z-index: 3100;
}


#mainlogo {
	position: absolute;
	margin: 0;
	z-index: 3100;
	top: 3px;
}

#mainscreen {
	position: absolute;
	width: 100%;
	background-color: transparent;
	overflow: hidden;		
    -moz-box-shadow:    	0px 2px 3px rgba(0,0,0,0.6) inset;
	-webkit-box-shadow: 	0px 2px 3px rgba(0,0,0,0.6) inset;
	box-shadow: 0px 2px 3px rgba(0,0,0,0.6) inset;
	z-index: 1000;
	
}


#wykemenu {
	width: 100% !important;
	overflow-x: hidden;
	background-color:#EEE6F2;
	text-align: left;
	
}


#div_pageheading_wrapper {	
	top: 0px;	
	padding: 0px 20px 10px 0px;	
	margin: 5px 0px 5px 10px;
	z-index: 3100;
	width: 100%;
	min-height: 20px;
	height: 50px;
	z-index: 10000;
	font-size: 1.2em;
	vertical-align: top;
}

#div_pageheading, .div_pageheading {
	position: relative;
	color: white;	
	font-size: 1.1em;
	background-color: rgba(56, 1, 86, 0.8);  /* LIVE */ 
	/* border: 10px solid #FAF4FF; */
	background-color: transparent;
	opacity: 1 !important;
	border-radius: 3px;
	text-shadow: 2px 2px 3px black;
	margin-top: 5px;
	z-index: 10000;
}

#div_pageheading {
	max-width: 30%;
	margin-right: 10px;
	height: auto;
	line-height: 1em;
}

.div_pageheading {
	margin: 20px 0px 20px -35px;
}

#div_revbuttons {
	margin-top: 20px;
}

.div_review {
}

#div_reviewhelp td {
	vertical-align: top;
}


.heading_image {
	height: 30px;
	margin-top: 8px;
	margin-bottom: -5px;
	margin-right: 15px;
	-webkit-filter: drop-shadow(2px 2px 3px #000);
	filter: drop-shadow(2px 2px 3px #000);	
}





#div_banner {
	border: 1px solid blue;
	width: 100%;
	height: 20px;	
}

/*Content*/

#content{
	position: absolute;
	width: 100%;
	height: 100%;
	font-size: 0.8em;
	margin:0;
	top: 0;
	padding:10px 10px 0px 10px;
	line-height:130%;	
	overflow-y: hidden;
	overflow-x: hidden;
	clear: both;
	background-color: transparent;
	background-color: #524582 !important;
	z-index: 3000;
}

#content ol li,#content ul li{
	margin-left:20px; /* changed from 20px because it ruins the tabber tabs */
}

#loginAs {
	font-size: 0.8em;	
}

/*Footer*/
#footer{
	position: fixed;
	border-bottom: none;
	height: aut0;
	color:#fff;
	width: 100%;
	bottom: 0px;	
	z-index: 20000;
	font-weight: normal;
	font-size: 0.8em;	
    padding: 0px 100px 2px 10px;
	vertical-align: middle;
	background-color: transparent;	
    -moz-box-shadow:    	0px -2px 3px rgba(0,0,0,0.6) ;
	-webkit-box-shadow: 	0px -2px 3px rgba(0,0,0,0.6) ;
	box-shadow: 0px -2px 3px rgba(0,0,0,0.6);
	z-index: 5000;
}
/*Element Styles*/
h1, h2, h3, h4, h5, h6 h7, h2_light{
	color:white;
	padding:5px 0;
	font-weight: normal;
	line-height: 1.2em;
}
h1{
	font-size:1.5em;
}
h2, h2_light{
	font-size:1.4em;
}

h2_light {
	color: rgba(255, 255, 255, 0.5);
}

h3, .greeting {
	background-color:#723B87;
	color: white;
	padding-left: 10px;
	font-size:1.2em;
	margin-top: 5px;
	line-height: 1.3em;
}
h4 {
	color: white;
	font-size:1.3em;
}
h5{
	font-size:1.1em;
	font-weight: bold;
}

h5_dark {
	color: #6C587A;  	
}

h6{
	font-size:1em;
	font-weight:bold;
}
h7{
	font-size:1em;
}
h7 span{
	font-size:1em;
	font-weight:bold;
}
p{
	margin:4px 0 10px 0;
}

ul {
	list-style-type:disc;
	font-size:1.0em;
	margin:0 0 0 5px;
}
li {
	padding:1px;
}

a {
	color: rgba(240, 229, 255, 0.8) !important;
	transition-duration: 0.3s;
}

a:hover {
	color:  rgba(213, 183, 255, 1) !important;
}

#footer a{
	color:#fff;
}

a img{
	border:none;
	transition-duration: 0.2s;
}

a img:hover {
  -webkit-filter: drop-shadow(1px 1px 2px #222);
	filter: drop-shadow(1px 1px 2px #222);
	opacity: 0.8;
}

dt{
	color:#5C3F84;
	font-weight:bold;
	font-size:14px;
	padding:2px 0;
}
dd{
	padding-left:25px;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
}

button:focus {
	outline-color: #8888cc !important;
	outline-width: 3px !important;	
}

input[type=button] {
	padding: 2px 5px;
}

input[type=text], input[type=password] {
	padding: 4px 6px 3px 6px;
	transition-duration: 0.2s;
}

input[type=text].not(.login_input) {
	border: 1px solid rgba(48, 31, 71, 0.8);
	border-radius: 3px;
	height: 20px;
	background-color: rgba(255, 255, 255, 0.7);
	color: #462C89 !important;
	transition-duration: 0.2s;
}

textarea {
	width: 99%;
	font:1.1em 'Trebuchet MS', Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 10px !important;
	border: 2px solid rgba(83, 63, 91, 0.8);
	color: #462C89;
	background-color: rgba(255, 255, 255, 0.7);
}

.newsheading1 {
	font-size: 1.3em !important;
	color: #421F51 !important;
}

.newsheading2 {
	font-size: 1.1em !important;
	color: rgba(83, 39, 102, 0.9) !important;
}



.greeting {	
	padding: 5px 8px;
}

#progresscircle, #progresscircle2, #pleasewait, #largemessage {
	border-radius: 2px;
	z-index: 12000;
	padding: 40px;
	font-weight: bold;
	color: white !important;	
	font-size: 1.1em;
	line-height: 1.5em;	
	display: none;
	position: fixed;
	top: 30%;
	background-color: rgba(51, 16, 79, 0.9);
	max-width: 70%;
	border: none;
}

#pleasewait.errormsg, #div_smt_approval {
	background-color: rgba(127, 47, 33, 0.9) !important;
}

#pleasewaitMsg {
	text-align: center;
}

#div_progresscircle2 {
	position: relative;
	margin-top: 50px;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: auto;
}

.prog_spinner {
	margin-top: 80px;
}

.phonenum {
	color: inherit;
}




.checkbox {
	border: 1px solid rgba(48, 31, 71, 0.8);
	width: 55px !important;
	vertical-align: middle;
	height: 40px !important;
	margin-top: 5px;
	margin-bottom: 5px;
	background-color: rgba(255, 255, 255, 0.1) !important;
}


.checkbox_small {
	border: 1px solid rgba(48, 31, 71, 0.8) !important;
	width: 30px !important;
	vertical-align: middle;
	height: 25px !important;
	margin-top: 5px;
	margin-bottom: 0px;
}


.underline {
	text-decoration: underline;
}

.strike {
	text-decoration: line-through;
}

.italic {
	font-style: italic;	
}

.bold {
	font-weight: bold;
}


/*******LOGIN and PASSWORD CHANGE boxes*************/


#pleasewaitMsg {
	text-align: center;
}

#progress_img {
	margin-right: 10px;
	vertical-align: middle;
}

#div_testing {
	margin-top: 100px;
	margin-left: 30px;
	color: white;
	font-size: 0.8em;
}

.td_leftpad {
	padding-left: 12px;	
}

.td_centre {
	text-align: center;
}

#div_login_section {
	position: absolute;
	visibility: hidden;
	opacity: 0;
	width: 250px;	
}

#div_login_section_a, #div_login_section_b {
	width: 235px;
}

#div_login_error {
	font-size: 1.2em;
	color: red;
	height: 30px;
	vertical-align: top;
}

.red_border {
	border: 1px solid red;
}

.logon_field {
	color: rgb(184, 173, 204);
	width: 210px;
	height: 40px;
	padding-bottom: 5px;
	border-bottom: 1px solid white;
	vertical-align: bottom;
	margin-bottom: 20px;
}

.logon_icon {
	margin-top: 10px;
	margin-right: 10px;
}

.logon_label {
	position: absolute;
	margin-top: 15px;
	margin-left: 5px;
}

.field_clearbutton {
	position: absolute;
	margin-top: 17px;
	left: 193px;
	opacity: 0.7;
	visibility: hidden;
}

.field_clearbutton:hover {
	opacity: 1;
}


.field_errmessage {
	position: absolute;
	margin-top: -10px;
	left: 160px;
	font-size: 0.6em;
	color: #ff0000;
}

.error_field {
	border-bottom: #ff0000 1px solid;
}

.logon_input {
	position: absolute;
	background-color: transparent;
	border: none;
	box-shadow: none;
	margin-top: 12px;
	margin-left: -2px;
	height: 23px;
	width: 135px;	
	color: white;
	font-size: 1em;
}



.logon_input:focus {
	border: none;
}

.logon_input:disabled {
	color: #EEE2FF;
}

#div_viewselfie {
	margin-right: 25px;
}


.btn_login {	
	color: rgba(53, 36, 76, 0.7);	
	border: 1px solid #cbc;
	background-color: #cbc;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	font-size: 1.1em;
	padding: 12px 65px;
	transition-duration: 0.4s;
	border-radius: 5px;
	font-weight: bold;
	-moz-box-shadow:   1px 1px 3px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
}

#btn_changepass {
	padding: 12px 30px;
}

#btn_reqreset {
	padding: 12px 30px;
}

#btn_update_email {
	padding: 12px 30px;	
}

.btn_login:hover, .btn_login:active{
	cursor: pointer;
	background-color: #F8F2FF;
	border-color: #F8F2FF;
	-moz-box-shadow:   2px 2px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.3);
	box-shadow: 2px 2px 3px rgba(0,0,0,0.3);
	color: rgba(53, 36, 76, 1);	
}

#img_up_arrow {
	background: url('../images/up_arrow_white.png') no-repeat;
	object-fit: cover;
	 height: 20px;
	 width: 20px;
}

.btn_login:hover #img_up_arrow {
	background: url('../images/up_arrow_purple.png') no-repeat;
}

#div_attachment_area li {
	
}



.templates_area, .attachments_area {
	margin-right: 30px;
}




/*----------------------------
    The file upload form
-----------------------------*/


#drops{
    background-color: #2E3134;
    padding: 40px 50px;
    margin-bottom: 30px;
    border: 20px solid rgba(0, 0, 0, 0);
    border-radius: 0px;
    border-image: url('../images/border-image.png') 25 repeat;
    text-align: center;
    text-transform: uppercase;

    font-size:16px;
    font-weight:bold;
    color:#7f858a;
}

#drops a{
    background-color:#007a96;
    padding:12px 26px;
    color:#fff;
    font-size:14px;
    border-radius:0px;
    cursor:pointer;
    display:inline-block;
    margin-top:12px;
    line-height:1;
}

#drops a:hover{
    background-color:#0986a3;
}

#drops input{
    display:none;
}

 .attachment_area  {
	margin-top: 20px;
	margin-left: -10px !important;
	height: auto;
	overflow-y: hidden;
	padding-left: 10px;
	border: none;
	background-color: transparent;
	max-width: 95%;
}

.attachment_area ul{
	width: 95%;
    list-style:none;
    margin:0 0px;
    font-size: 1em;
	list-style-image: url('../images/document_icon.png');
	list-style-position: outside;
}

.attachment_area ul li{    
    position: relative;
    height: 30px;
}

.attachment_area ul li:hover {
	
}

.attachment_area ul li input{
    display: none;
}

.attachment_area ul li p{
    width: 80%;
    overflow: hidden;
    white-space: nowrap;
    color: white;
    position: absolute;
    top: 0px;
    left: 20px;
}

.attachment_area ul li i{
    font-weight: normal;
    font-style:normal;
    color:#7f7f7f;
    display:block;
}

.attachment_area ul li canvas{
    top: 15px;
    left: 32px;
    position: absolute;
}

.btn_remattach {
    width: 20px;
    height: 12px;
    background: url('../images/icons.png') no-repeat;
    position: absolute;
    top: 12px;
    left: 5px;
    cursor:pointer;
}

.btn_remattach:hover{
    background: url('../images/icons.png') no-repeat bottom;
}

.attachment_area ul li.working .btn_remattach{
    height: 16px;
    background-position: 0 -12px;
}

.attachment_area ul li.error p{
    color:red;
}

.download {
	background-color: transparent;
	padding: 5px 10px;
	margin-right: 5px;
	border-radius: 0px;
	font-size: 1em;
	vertical-align: middle;
	margin-top: 0px;
	cursor: pointer;
	transition-duration: 0.3s;
	color: rgba(255, 255, 255, 0.8);
}

.download:hover {
	color: white !important;
	text-decoration: underline !important;
}

.download a {	
	font-weight: bold;
}

.download a:hover {	
	font-style: normal;
}



#div_register, .div_contactwyke {
	margin-left: -5px;
}

.div_contactwyke {
	color: #EEE2F8 !important;
}

.login_msg_text {
	font-size: 0.9em;
	color: white;
	margin: 20px 0px;
}

.login_msg_text_small {
	font-size: 0.75em;
	color: white;
	margin: 20px 0px;
}

#div_login_welcome .login_msg_text {
	font-size: 1.5em;
	line-height: 1.2em;
}

#span_resetemail {
	font-style: italic;
}

input[type=button].btn_cancel {
	display: block;
	padding-left: 5px; padding-right: 5px;
	background-color: #642828;
	color: #eee;
}
input[type=button].btn_cancel:hover, input[type=button].btn_cancel:active {
	cursor: pointer;
	background-color: #b00000;
	color: white;
}

#loggedin_user {	
}

#btn_msgClose .btn_return{
	border: none;
	background-color: transparent;
	color: white;
	font-size: 1.2em;
}


.closebutton {
	vertical-align: top;
	margin: 0 0 5px 0px;
}

.closeButton, .applyButton, .closeButtonSmall, .applyButtonSmall {
	position: relative;
	float: right;
	background-color: transparent;
	font-weight: bold;
	padding: 0;
	color: #cc1111;
	border: 1px solid #cc1111;
	border-radius: 0px;
	cursor: default;
	text-align: center;
	top: 50px;
	vertical-align: middle !important;
}

.closeButton, .applyButton {
	right: 0px;
	top: 5px;
	height: 16px; width: 16px;
	font:13px 'Trebuchet MS', Verdana, Geneva, Arial, Helvetica, sans-serif;
}

.closeButton:hover, .applyButton:hover, .closeButtonSmall:hover, .applyButtonSmall:hover {
	background-color: #cc1111 !important;
	color: white;	
	font-weight:bold;  	
	box-shadow: none;
}

 .btn_return:hover{
	color: #EA6764 !important;
	color: white;
}

.div_checkbox {
	vertical-align: top;
	height: 40px;
	cursor: default;
	background-color: transparent;
}


.lesson_heading {		
	font-size: 1.1em;
	font-weight: bold;	
}

.div_period {
	margin: 0px 25px 5px 0px;	
}


.box_1col, .box_2col, .btn_review, .btn_bookapt, .div_bookapt, .btn_dispapps, .div_dispapps {
	vertical-align: top;
	margin-right: 0px;
	margin-bottom: 20px;	
	border-radius: 3px;
	padding: 5px;
	-moz-box-shadow:   1px 1px 2px rgba(0,0,0,0.5);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	background-color: #6C5D82;
	border: 1px solid #5A1175;
	color: white;
}

.btn_dispapps {
	max-width: 200px !important;
}


.box_1col {
	width: 25%;
}

.div_0col {
	width: 100px;	
}

.div_1col {
	width: 30%;
}

.div_2col {
	width: 100%;
}

.div_3col {
	width: 100%;
}

.box_content {
	padding: 5px 10px !important;
	vertical-align: top !important;
}

.box_pathways, .box_details {
	cursor: pointer;
}

.div_textarea {
	height: auto !important;
	min-height: 35px;
	vertical-align: top;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-right: 10px;
}

.cb_selection {
	margin-top: -16px;	
	cursor: default;
}

.cb_selection_disabled {
	cursor: default;	
}

#div_save_submit {	
	position: absolute;
	top: 23px;
	right: 20px;
	padding: 0px;
	z-index: 5000;
}

#btn_submit {
	border: 3px solid #006600;
	background-color: #006600;
	color:  #eeffee;
	font-size: 2em;
	font-weight: bold;
	padding: 15px 15px;	
	vertical-align: middle;
	text-align: center;
	border-radius: 3px;
	transition-duration: 0.3s;
	cursor: pointer !important;
	margin-right: 50px;
	letter-spacing: -0.02em;
	float: left;
	height: auto;
	-moz-box-shadow:   1px 1px 3px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
}

#btn_submit:hover {
	border-color:  #009900;
	background-color: #009900;
	color: white;
	cursor: pointer;
}


.viewButton, .btn_backtolist, .btn_action {
	font-size: 0.8em;
	padding-left: 2px !important;
	padding-right: 2px !important;
	margin-top: 5px;
	margin-bottom: 0;
	transition-duration: 0.3s;
	background-color: transparent;
}

 .btn_action{
	margin-left: 5px;
	height: 30px !important;
	/* margin-top: -5px; */
	background-color: #ab2173;
	padding: 9px 30px 3px 30px !important;
	cursor: default;
	font-size: 0.9em;
	transition-duration: 0.2s;
	cursor: pointer;
}

.btn_action2 {
	margin-left: 10px;
	transition-duration: 0.2s;
}


.btn_action:hover {
	/* border-color: #b8a2d7;
	border-top-color: #a699b7;  */
	background-color: #2b2340;
}

.btn_action2:hover {
	-webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.7));
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.7));	
}


.btn_action:active {
	background-color: #2b2340;
	cursor: default;
	border-radius: 3px;
}

.btn_action2:active {
	-webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));
	filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));		
}

.btn_action_green {
	padding: 8px 7px 0px 7px !important;
	margin-right: 10px;
	border: 1px solid rgba(56, 35, 84, 0.6);
	border-radius: 3px;
	color: #196023;
	border-color: #196023 !important;
	background-color: #196023;
	color: rgba(255, 255, 255, 0.9);
	cursor: pointer;
}

.btn_action_green:hover {	
	background-color: #148924 !important;
	border-color: #148924 !important;
}

.btn_savetick, .btn_savetick_light {
	vertical-align: middle;
	color: #005500;
	font-size: 1.4em;
	font-weight: bold;
	cursor: default;
}

.btn_savetick_light {
	color: #99DB99;
}

#btn_save {
	background-color: transparent;
}

#btn_save:hover {
	background-color: rgba(99, 206, 111, 0.2);
}

#btn_savedetails {
	float: right;
	font-size: 1.2em;
	margin-top: -2px;
}

.btn_savetick:hover, .btn_savetick_light:hover {
	color: #00CC00;
	transition-duration: 0.3s;
}

.btn_savetick:active, .btn_savetick_light:active {
	color: #00E000;	
}

#btn_savedetails:active {
	color: #00E000;	
}

.div_topright_button {	
	position: absolute;
	top: 23px;
	right: 35px;
	padding: 0px;
	z-index: 5000;
}

#btn_downloadfrm {
	width: 170px;	
}

.btn_general, .optionbtn {
	display: inline-block;
	background-color: #604C7F;
	padding: 5px 10px;
	border-radius: 4px;
	width: auto;
	font-size: 1.2em;
}

.links_div .imglink:hover, .btn_general:hover, .optionbtn:hover {
	cursor: pointer;
	background-color: #705893;
	color: rgba(255, 255, 255, 1);
}




.tbl_row1 {
	background-color: rgba(223, 220, 226, 0.8);	

}

.tbl_row2 {
	background-color: rgba(235, 226, 235, 0.8);
}


.tbl_row1ly {
	background-color: rgba(223, 220, 226, 0.5);	
	color: #555;
}

.tbl_row2ly {
	background-color: rgba(235, 226, 235, 0.5);
	color: #555;
}

.tbl_hspacing {
	border-spacing: 0px 2px !important;
}

.tbl_hspacing  th {
}



#div_feedback_instructions {
	margin-top: -20px !important;
	margin-bottom: 20px;
}

.div_question {
	margin-top: 10px;
	width: 97.5%;
}



.icn_submenu {
	position: absolute;
	left: 10px;	
	vertical-align: middle;
	width: 6px;
	color: rgba(255, 255, 255, 0.3) !important;
	transform: rotate(0deg);
	background-color: transparent !important;
	padding: 0;
	font-weight: bold;
}

.icn_submenu:hover {
	background-color: transparent !important;
}

.rotate90 {
	transform: rotate(90deg);
}

.rotate180 {
	transform: rotate(180deg);
}


#div_rh_buttons {
	position: absolute;
	right: 50px;
	top: 15px;
	z-index: 10000;
	vertical-align: top;
	text-align: right;
}

#btn_home {
	position: absolute;
	right: 30px;
	z-index: 10000;
	background-color: #2b2340;
	padding-left: 36px !important;
    padding-right: 36px !important;
}

#btn_signin {
	position: relative;
}

#btn_signin::before {
	content: '';
	display: block;
    position: absolute;
    border-style: solid;
    border-width: 15px 0 0 20px;
    border-color: transparent transparent transparent #524582;
    bottom: 0;
    left: 0;
}


/************ DASHBOARD PAGE ******************/

#div_appl_buttons, #div_vacancies {
	vertical-align: top;
	margin-left: -20px;
	overflow: auto;
   height: auto !important;
}


.btn_application, .btn_vacancy {
	float: left;	
	vertical-align: top;
	width: 100%;
	min-width: 150px;
	max-width: 300px;
	min-height: 150px;
	border: 1px solid white;
	border-radius: 3px;
	padding: 20px;
	margin: 10px;
	cursor: pointer;
	text-align: center;
	color: rgba(255, 255, 255, 0.8);
}

.btn_application:hover, .btn_vacancy:hover {
	-moz-box-shadow:   1px 1px 5px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 5px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 5px rgba(0,0,0,0.7);	
}

.btn_appl_heading {
	font-size: 1.3em;
	font-weight: bold;
	color: white;
}

.btn_vacancy {
	border-color: rgb(49, 42, 71);
	background-color: rgb(49, 42, 71);
}

.btn_vacancy.vac_readonly {
	border-color: #9391BC;
	background-color: rgb(49, 42, 71, 0.7);
}

.btn_vacancy.app_started {
	background-color: rgba(199, 196, 255, 0.5);
}

.btn_application {
	border-color: rgb(55, 38, 63);
	background-color: rgb(55, 38, 63);
}

.btn_application .app_submitted {
	background-color: rgba(55, 38, 63, 0.7);
}

.btn_vacancy:hover{
	border-color: rgb(49, 42, 71);
	background-color: rgb(66, 58, 91);
}

.btn_application:hover {
	background-color: rgb(76, 56, 86);
}


.btn_vacancy:hover, .btn_vacancy:hover .btn_appl_heading, .btn_application:hover, .btn_application:hover .btn_appl_heading {
	color: white !important;
}


.disable-select, .sectitle, .div_section, #div_login_section, #fdConfirmEmail, #fdConfirmPassword {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none;   /* Chrome/Safari/Opera */
    -khtml-user-select: none;    /* Konqueror */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* Internet Explorer/Edge */
    user-select: none;           /* Non-prefixed version, currently supported by any browser but < IE9 */
}

.btn_addentry, .btn_close {	
	font-weight: bold;
	font-size: 2em;
	color:white;
	z-index: 1000;
	float: right;
	margin-right: 10px;
	cursor: default;
	height: 24px;
	width: 24px;
	vertical-align: middle;
	text-align: center;
	transition-duration: 0.2s;
	margin-top: 2px;
}

.btn_close {
	margin: -5px -5px 0px 5px;
	font-size: 1.6em;
	color: #421F51;
	color: white;
}

.btn_addentry:hover {
	color:#CDB2F7;
}

.btn_close:hover {
	color:#DB7A7A;
}

.btn_addentry:active {
	color:#9F84CE;
}

.btn_close:active {
	color: #D85858;
}

/************Academic and course sections ******************/

#div_academic_section {
	margin-top: -20px;
}

.div_subjrow, .div_courserow {
	width: 90%;
	background-color: transparent;
	margin-left: -30px;
	padding-left: 20px;
	padding-right: 40px;
	margin-top: -6px;	
	padding-top: 5px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px rgba(255, 255, 255, 0.5) dashed;
}

.div_subjrow2, .div_courserow2 {	
	background-color: transparent;
}

.lbl_course, .lbl_subject {
	background-color: rgba(48, 31, 71, 0.5) !important;
	padding: 2px 10px 4px 10px;
	margin-bottom: -5px;
	border-radius: 3px;
	margin-top: -1px;
}


.btn_removecourse, .btn_addcourse {
	background-color: transparent !important;
	margin-right: 10px;
	color: #bb1a36 !important;
	border: 1px solid #bb1a36 !important;
	border: none !important;
	font-size: 1.2em !important;
}

.btn_removecourse:hover {
	background-color: #9b394a !important;
	color: white !important;
	padding: 0px 3px;
}

.btn_addcourse {
	color: #412b4d !important;
	font-size: 1.5em !important;
	vertical-align: top;
	-moz-box-shadow:   1px 1px 3px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
}

.btn_addcourse:hover {
	background-color: #412b4d !important;
	color: white !important;
}

.crs_removed, .crs_removed textarea {
	background-color: #a2937d;
	font-style: italic;
}

.crs_removed textarea {
	border: none;
}


.btn_submit, .btn_add {
	font-size: 0.85em;
	background-color: transparent;
	border: 2px solid #2E7206;
	color: #2E7206;
	padding: 8px 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	vertical-align: top;
	-moz-box-shadow:   1px 1px 3px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
}

.button_link {
}

.btn_add {
	border: 2px solid #301F47;
	background-color: #301F47 !important;
	color: white !important;
	transition-duration: 0.3s;
	margin-top:  30px;
}

.btn_add:hover {
	border-color: #4A3370 !important;
	background-color:  #4A3370 !important;
}




/************Links section ******************/
#links_div {
	margin-top: 0px; margin-bottom: 0px;
	padding-top: 5px;
}

#links_div img {
	height: 30px;
}

#links_div .imglink {
	text-align: center;
	padding: 5px 2px;
	width: 95px;
	height: 50px;
	margin: 5px 3px 0 3px;	
	background-color: transparent;
	border: solid 1px #D7C9E0;
	/* text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.4), 1px 1px 0px rgba(0, 0, 0, 0.5); */
	vertical-align: top;
	font-size: 0.8em;
	cursor: default;
}

#links_div .imglink:hover {
	cursor: default;
	background-color: #F6EFF9;
	border: solid 1px #9488A0;
}

#links_div a:hover {
	text-decoration: none;
}
	
#search_div {
	margin-top: 0;
	width: 100%;
}

#searchbox {
	height: 50px;
	width: 70% !important;
	margin-left: 0;
}

#searchbox table {
	margin-top: 0 !important;
	visibility: hidden;	
	width: 100% !important;
}

#searchbox .gcs-input-box {
	border: none !important;
}

#searchbox .gsib_a {
	visibility: hidden !important;
}

#searchbox input[type=text] {
	visibility: visible;
	padding: 5px 10px !important;
	width: 100% !important;
	border: 1px solid black !important;
}

#searchbox input[type=image] {
	margin-top: 5px !important;
	visibility: visible;
}

#div_displayarea {
	position: fixed;
	top: 0;
	color: white;
	padding: 0px 10px 10px 40px;	
	overflow: auto;
	line-height: 1.5em;
}

.div_dashbox {
}


/******Miscellaneous Class Styles ************/

.inline {
	display: inline-block;
	zoom: 1;
	*display: inline;
}

.left, .floatleft {
	float:left;
}

.right, .floatright {
	float:right;
}

.input_errmsg {
	color: #aa0000;
	font-weight: bold;
	font-size: 0.7em !important;
}

.box_message {
	color: #aa0000;
	font-size: 0.9em !important;
	font-weight: bold;
	text-align: center;
}

img.left , img.right {
	margin:5px 8px;
}
.w50{
	width:49%;
}
.blue{
	color:#5C3F84;
}
.indent{
	margin: 0px 0px 0px 20px;	
}
.highlight{
	color:#0088CE; /*0088CE*/
	font-weight:bold;
}

.rowhdrtable {
	background-color: #EFEBE4  ; 
}
.row1table {
	background-color: #F1FFC0   ; 
}
.row2table {
	background-color: #F7F5F1     ; 
}
.highlighttable{
	color:#0088CE; 
	font-weight:bold;
	background-color: #e8e2d9; 
	border-style: none;
	border-bottom: #e8e2d9 ;	
	border : none ;	
	border-collapse: collapse;
}
	
.high_flyer{
	background-color:#F2AB50 ;
}

.studenttext {
	background-color: #F6C78A; /*was BAFEBA*/
}
.readonlytext {
	background-color: #EFEBE4; /*was BAFEBA*/
}
#entryform studenttext {
	background-color: #F6C78A; /*was BAFEBA*/
}

.form_popup {
	background-color:#EFEBE4    ;	  /*was efebe4 or FAF9F6*/
	margin-left: 2.5em;
	margin-top: 0.5em;

}
.button {
    /*border: 1px solid #006;*/
    background: #CFC1E1  ;
	font-size: 10px;
	border-bottom: #D85035 ; /*D85035 Wyke red*/
	width: 80px;
	cursor: pointer ;
}

.linespace {	
	line-height: 1.3em;
}

.floatright {
	float: right;
}

.background_red {
	border: solid 2px #dd0000 !important;
	/* background-color: #EFDCDF !important; */
}

.background_amber {
	border: solid 2px #dd8800 !important;
	/* background-color: #EFEFDF !important; */
}

.subtitle {
	font-weight: bold;
	margin-bottom: 5px;
}

.small, small {
	font-size: 0.9em;
}

.smaller, smaller {
	font-size: 0.8em;
}

.large, large {
	font-size: 1.3em;
}

.larger, larger {
	font-size: 1.6em;
}

.width30 {
	width: 30px;
}

.width50 {
	width: 50px;
}
.width70 {
	width: 70px;
}

.grey {
	color: #AAA;
}

.red {
	color: #FF5555 !important;
}

.link {
	
}

.strong {
	font-weight: bold;
}

.link_light, .link_dark {
	font-size: 1em;
	color: #CBBCDB;
	cursor: pointer;
	transition-duration: 0.2s;
}

.link_light:hover {
	color: white !important;
}

.link_dark {
	font-size: 1em;
	color: #502560  !important;
}

.link_dark:hover {
	text-decoration: none !important;
	color: rgba(122, 83, 137, 0.8) !important;
}

#lnk_signout, #lnk_changepass {
	color: rgba(255, 255, 255, 0.6);
	font-size: 1em;	
	margin-left: 20px;	
}

#lnk_signout:hover, #lnk_changepass:hover {
	color: white;
}

.dropshadow {
  -webkit-filter: drop-shadow(1px 1px 2px #222);
  filter: drop-shadow(1px 1px 2px #222);
}



.headingtext {	
	color: white;	
	font-size:1.5em;	
	line-height: 1.3em;
	margin-bottom: 0px;
	opacity: 0.8;
}

#sign_in_text {
	font-size: 1.2em;	
}

.td_centre, .centre, .textcentre {
	text-align: center !important;
}

.fullwidth {
	width: 100%;
}

.top {
	vertical-align: top;
}

.middle {
	vertical-align: middle !important;
}

.textleft {
	text-align: left !important;
}

.gap_above {
	margin-top: 10px;
}
.gap_above_small {
	margin-top: 5px;
}

.no_gap_above {
	margin-top: 0px !important;
}

.gap_below {
	margin-bottom: 10px !important;
}

.gap_below_small {
	margin-bottom: 5px !important;
}

.left_margin_20 {
	margin-left: 20px !important;
}

.right_margin_20 {
	margin-right: 20px !important;
}

.left_margin_10 {
	margin-left: 10px !important;
}

.left_margin_5 {
	margin-left: 5px !important;
}

.right_margin_10 {
	margin-right: 10px !important;
}

.no_right_margin {
	margin-right: 0 !important;
}

.top_margin_min5 {
	margin-top: -5px !important;	
}

.bottom_margin_min5 {
	margin-bottom: -5px !important;	
}

.att_figure_col {
	width: 25%;
	padding: 0px 20px;
	margin-left: -20px;
	margin-right: -20px;
	text-align: center;
	vertical-align: top;
	
}

.large_figure, .extra_large_figure {
	vertical-align: top;
	font-size: 2vw;
	line-height: 1em;
	font-weight: bold;
	text-shadow: 0 0 3px rgba(255, 255, 255, 0.3), -1px -1px 0px rgba(255, 255, 255, 0.3),1px 1px 0px rgba(0, 0, 0, 0.3), 0 0 5px rgba(0, 0, 0, 0.3);
}

.lightgreen {
	color: #44ff44;
}

.darkgreen {
	color: #008800;
}

.extra_large_figure {
	font-size: 3em;
}

.width20 { width: 20px !important; }
.width40 { width: 40px !important; }
.width50 { width: 500px !important; }
.width100 { width: 100px !important; }
.width200 { width: 200px !important; }

.text_dimmer {
	opacity: 0.7;	
}

.input_errmsg, .inputerror {
	color: #ff3333;
	font-weight: bold;
	font-size: 0.8em !important;
}


.tbl_stulist, #tbl_erecords {
	margin-bottom: 20px !important;
}


.tbl_stulist th{
	font-size: 0.9em;
	text-align: left;
	padding-left: 10px;
    color: white !important;
	background-color: transparent !important;
}

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

.th_sort_selected {
	text-decoration: underline;
}

.tbl_stulist td {
	border-top: white 1px solid;
	border-bottom: rgba(191, 173, 147, 0.7) 1px solid;
	padding: 0 5px;
	font-size: 0.9em;
    height: 12px;
}

.tbl_bor_sep {
	border-collapse: separate !important;
	border-spacing: 2px !important;
}

.th_coursetitle {
	min-width: 400px !important;
}

.tr_no_btm_brd td {
	border-bottom: none !important;
}

.nocolour {
	color: #6C587A !important;
}

.iframe_format {
	width: 100%;
	border: none;
	
}

.tran_background {
	background-color: transparent !important;
}

.border_white {
	border: white solid 1px !important;
}

.div_coursetitle {
	border: 2px solid rgba(255, 255, 255, 0.4);
	background-color: rgba(255, 255, 255, 0.1);
	padding: 5px 10px 5px 10px;
	max-width: 600px;
	border-radius: 5px;
	margin: 10px 0px 10px -10px;
}

/******timetable formatting *******/

.tbl_timetable {
	position: absolute;
	border: none !important;
	border-top: 1px solid #381f47;	
	padding: 0 20px 20px 20px;
	color:#5C3F84;
	left: 0px;
	margin: 0px 20px 20px 20px;
}

.tbl_timetable_headerrow {
	border-top: none;
}

.tbl_timetable th{
	border-top: none !important;
	border-bottom: none;
	padding-bottom: 5px;
	color: white !important;
	background-color: #987FAE !important;
	border-left: none !important;
	border-right: none !important;
}

.tbl_timetable th:hover {
}

.tbl_timetable td {
	padding: 6px 6px 6px 6px !important;
	border-top: white 1px solid !important;
	border-bottom: rgba(173, 167, 186, 0.5) 1px solid !important;
	font-size: 0.8em;
	line-height: 1.2em;
}



/******attendance mark formatting *******/


.top_border_2 {
	border-top: 3px solid #67597A !important;
}

.tbl_attmarks {	
	border-spacing: 1px 0px;
	margin-bottom: 20px !important;
}

.tbl_attmarks tr {
	margin-bottom: 5px;
}

/*
.tbl_attmarks tr:hover td {
	background-color: #EFEFEF !important;
} */

.tbl_attmarks_grid {
	border-spacing: 1px 0px;
}

.tbl_attmarks_grid tr {
	margin-bottom: 2px;
}

.tbl_attmarks_grid th {
	text-align: left;
	line-height: 1em;
	padding-left: 3px;
}

.tbl_attmarks_grid .weekdate {	
	letter-spacing: -0.1em;
	font-size: 0.8em;
	text-align: center;
	padding-left: 0;
}

.tbl_attmarks_grid td {	
	font-size: 0.8em;
	padding: 2px 5px !important;
	height: 15px;
}

.tbl_attmarks td {
	padding: 2px 1px;
	text-align: center;
	cursor: default;
}

.td_attmarks_mark, .div_attmarks_mark {
	text-align: center !important;
	transition-duration: 0.2s;
	border: 1px solid white;
	border-color: transparent;
}

.tbl_attmarks_grid .td_attmarks_mark {
	min-width: 20px;
	font-size: 1em;
}

.td_attmarks_markcell {
	padding: 1px !important;
	font-size: 0.9em !important;
	width: 5px !important;
	text-align: center !important;
}

.th_attmarks_period {
	width: 5px !important;
	min-width: 10px;
	max-width: 5px !important;
	padding: 0 !important;
	text-align: center !important;
	background-color: yellow;
}

.tbl_attmarks td.td_attmarks_week {
	text-align: left !important;
	padding-left: 5px;
	max-width: 70px;
}

.td_attmarks_spacer {
	padding: 0;
	width: 1px;
	max-width: 1px !important;
	font-size: 1px;
	background-color: #F4F1F8 !important;
	border-color: #F4F1F8 !important;
	visibility: hidden;
}

.td_attmarks_red {
	color: #89483C;
	background-color: #E5C6C0  !important;
}

.td_attmarks_green {
	color: #48893C;
	background-color: #C3E2BE    !important;
}

.td_attmarks_amber {
	color: #84662E;
	background-color: #FFE3BA    !important;
}

.td_attmarks_blue {
	color: #2D4982;
	background-color: #BAD1FF    !important;
}


.td_attmarks_repabs {
	background-color: rgba(59, 103, 247, 0.3) !important;
}


/*** late marks ***/

.td_attmarks_late {
	background-size: 95% 95%;
	background-repeat: no-repeat;
}

.td_attmarks_late05 { background-color: #E2DFB7   !important; }
.td_attmarks_late10 { background-color: #D8CDAD   !important;  }
.td_attmarks_late15 { background-color: #D1C192    !important;  }
.td_attmarks_late20 { background-color: #D3BE94    !important;  }
.td_attmarks_late25 { background-color: #D8BD97    !important;  }
.td_attmarks_late30 { background-color: #DBAF83    !important;  }

.td_attmarks_late35 {
	background-color: #DD9D6E    !important;
	color: white !important;
}

.td_attmarks_late40 {
	background-color: #E2885A    !important;
	color: white !important;
}

.td_attmarks_late45 {
	background-color:  #E56D44    !important;
	color: white !important;
}

.td_attmarks_late50 {	
	background-color: #E84D2E    !important;
	color: white !important;
}

.td_attmarks_late55 {	
	background-color: #EA2917    !important;
	color: white !important;
}

.td_attmarks_late60 {
	background-color: #ED0000    !important;
	color: white !important;
}

.att_approved {
	border: 2px solid #2DAD35 !important;
}
.att_rejected {
	border: 2px solid #BA3230 !important;
}
.att_pending {
	border: 2px solid #EAAA3C !important;
}
.att_direct {
	border: 2px solid #1A631E !important;
}

.div_attmarks_mark {
	width: 18px;
	margin: 0px 5px 0px 10px;
	padding: 0px 0px 0px 0px !important;
	height: 22px;
	cursor: default;
	vertical-align: top !important;
	font-size: 1.1em;
}

.div_attkey_row {
	margin-top: 2px;
	margin-bottom: 2px;
	font-size: 0.9em;
}



.td_attmarks_mark:hover, .td_attmarks2_mark:hover {	
	border-color: #081644 !important;
	font-weight: bold;
}



.tbl_rowdivide {
	background-color: transparent !important;
	border-bottom: none;
	border-top: solid 1px #5C3F84;
}



.tbl_rowdivide td {
	color: #EBE0FC !important;
	padding-top:15px !important;
	font-weight: bold;
	font-size: 1.2em;
	letter-spacing: 0.1em;
	border: none !important;
	background-color: transparent !important;
}

.tbl_rowsubtotal {
	background-color: #E6D1Fa  ;
	font-weight: bold;
	border-top: solid 2px #5C3F84;
	border-bottom: solid 2px #5C3F84;
	height: 2px;
}

.tbl_rowftr {
	background-color: #CFC1E1  ;
	font-weight: bold;
	border-top: double #5C3F84;
	border-bottom: double #5C3F84;
}


/****** Monitoring group formatting *****/

.dashbox_discipline  .box_content {
	padding: 0px !important;
	text-align: center;	
	margin-top: 0px;
	margin-bottom: 0px;
	margin-right: -10px;
	height: auto;
	text-align: left !important;
}

.dashbox_discipline .dashbox_erectotals {
	padding: 5px 10px !important;
	border: 1px solid rgba(108, 93, 130, 1);
	
	border-bottom: none;
	border-right: none;
	width: auto;
	margin-top: -1px;
	margin-right: 10px;

}

.mongroup_first {
	border-left: 1px solid rgba(108, 93, 130, 1) !important;
}

.mongroup {
	text-align: center !important;
	padding: 6px 2px 4px 2px;
	margin-right: -4px;
	border: none;
	border-left: 1px solid rgba(108, 93, 130, 0.7);
	border-bottom: 1px solid rgba(108, 93, 130, 0.5);	
	-moz-box-shadow:    	0px 1px 1px rgba(0,0,0,0.5) inset; 
	-webkit-box-shadow: 	0px 1px 1px rgba(0,0,0,0.5) inset; 
	box-shadow: 0px 1px 1px rgba(0,0,0,0.5) inset; 
	background-color: #E6DCEA;	
}

.mongroup_title {
	line-height: 1.2em;
	font-size: 0.9vw;
	height: 50px;
	font-weight: bold;
}

.mongroup_stat {
	font-size: 1vw;
}

.mongroup_red {
	background-color:#AD4545 !important;
    color: #FFCCCC;
}

.mongroup_green {
	background-color: #3E9B3E !important;
	color: #CCFFCC;
}
.att_red {
	color: #b00000;
}

.att_amber {
	color: #d88201;
}

.att_green {
	color: #00a000;
}

/****** eRecord box formatting *******/

.div_erecbox {
	border: 1px solid #6C5D82;
	padding: 0px;
	float: left;
	margin-right: 20px;
	background-color: #6C5D82;
	cursor: default;
	width: 100%;
	margin-bottom: 30px;
}

.div_erecbox_titlebar {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-color: inherit;
	padding: 3px 10px;
	color: white;
}

.div_erecbox_content {
	height: 100%;
	width: 100%;
	padding: 0;
	background-color: rgba(235, 226, 235, 0.8);
	color: #6C587A;  
	vertical-align: top;
}

.div_erecbox_col1 {
	width: 15vw;
}

.div_erecbox_col2 {
	border-left-style: solid;
	border-left-width: 1px;	
	border-color: inherit;	
}

.div_erecbox_column {
	height: 100%;
	vertical-align: top;
	padding: 5px;
}

.clearfloat:after {
	clear: right;
}

.dashbox_intapp, .dashbox_unconfirmed, .dashbox_confirmed {
	border: 1px solid #432749;
	color: white;
	background-color: #785B7F;
}


.dashbox_unconfirmed {
	border: 1px solid #41422E;	
	background-color: #77775F;
	transition-duration: 0.4s;
}

.dashbox_confirmed {
	border: 1px solid #26472B;	
	background-color: #597C5F;
	transition-duration: 0.4s;
}

.dashbox_intapp .div_erecbox_content, .dashbox_unconfirmed .div_erecbox_content, .dashbox_confirmed .div_erecbox_content {
	color: white;
	background-color: transparent;
	font-size: 1.2em;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}


.tbl_summary, .tbl_help {
	font-size: 0.9em;
	color:#5C3F84;
	border: none !important;
	border-top: 1px solid #381f47;	
	padding: 0 20px 0px 0px;
	color:#5C3F84;
	margin: 0px 0px 30px 0px;
	border-spacing: 2px 2px;
}

.tbl_help {
	border-collapse: collapse;
}

.tbl_summary th, .tbl_help th {
	font-size: 1em;
	text-align: left;
	color: white;
	padding: 4px 0px 4px 2px;	
	line-height: 1em;
}

.tbl_summary td, .tbl_help td{
	border-top: white 1px solid;
	border-bottom: rgba(0,0,0 0.5) 1px solid;
	padding: 0 5px;
	font-size: 1em;
}


td.commentbox{
	/*width:98%;*/	
    padding: 0;
}

td.commentbox-teacher {	
	min-width: 300px;
	padding: 5px 7px;
}
td.commentbox-student{
	background-color:#f2e2f3  !important; 
	padding: 5px 7px;
}

td.commentbox-tutor{
	vertical-align:top;
	background-color: #CFC9E8;	
	padding: 5px 7px;		
}


.tutor_commentbox {
	background-color: #E2D5EF !important;
}

.tutor_commentbox_refauth {
	border: 1px solid #003F99;
	background-color: #CCE2FF !important;
}



/**********Attendance RAG colour styles************/
.attend_red {
	/* background-color: #ffcaca; */
	color: #dd0000 !important;
}
.attend_amber {
	/* background-color: #ffeeca ; */
	color: #e07101 !important;
}
.attend_green {
	/* background-color: #caffca; */
	color: #00aa00 !important;
}

.attend_redlight {
	/* background-color: #ffcaca; */
	color: #FF4F4F !important;
}
.attend_amberlight {
	/* background-color: #ffeeca ; */
	color: #FF9C02 !important;
}
.attend_greenlight {
	/* background-color: #caffca; */
	color: #00FF00 !important;
}

.btn_review, .btn_general {
	display: inline-block;
	text-align: center;
	border:none;
	margin-right: 4px;
	cursor: pointer;
	transition-duration: 0.3s;
	background-color:#4C3D66;
	color: white;
	font-size: 1.1em;
	margin-bottom: 0px;
	padding: 5px 15px;
	border: 1px solid white;
	border-color: transparent;
}

.btn_review:hover, .btn_bookapt:hover, .btn_dispapps:hover, .btn_general:hover {
	background-color: #584777;
}

#btn_upload {
	margin-top: -40px !important;
}

.btn_bookapt.btn_bookapt_unavail, .btn_bookapt.btn_bookapt_unavail:hover {
	cursor: default;
	background-color: rgba(61, 49, 79, 0.8);
	color: rgba(255, 255, 255, 0.6);
	box-shadow: none;
}

.btn_review.btn_active {
	background-color: #6F5793;
	border-color: #3F2C5B;
}

.btn_review_help {
	background-color: #76587A;
}

.btn_review_help:hover {
	background-color: #8A698E;
}

.btn_review_help.btn_active {
	background-color: #85548C;
	border-color: #4F2954;
}

.btn_bookapt, .div_bookapt, .btn_dispapps {
	margin-top: 0px;		
	width: 130px;	
	margin-left: 20px;
	margin-top: 10px;	
	padding: 5px 10px;
	min-height: 20px;
	line-height: 1.5em !important;
}

.div_bookapt {
	width: 60%;
	cursor: default;
	box-shadow: none;
	border-color: #EDFFFA;
	background-color: rgba(91, 127, 119, 0.8);
}

.div_bookapt2 {
	border-color: #F2EDFF;
	background-color: rgba(101, 87, 132, 0.8);
}

.btn_cancelapt, .btn_reschedapt {
	cursor: pointer;
	transition-duration: 0.3s;
}

.btn_cancelapt:hover, .btn_reschedapt:hover {
	opacity: 0.7;	
}

.div_helptext {
	width: 91%;
	max-width: 800px;
	margin-left: 10px;
	margin-bottom: 20px;
	border: rgba(255, 255, 255, 0.7) dashed 1px;
	border-radius: 5px;
	padding: 10px;
	font-size: 0.9em;
	background-color: rgba(255, 255, 255, 0.1);
}


/*** TABLE CSS TESTING ***/

.table    { display: table }
.tr       { display: table-row }
.thead    { display: table-header-group }
.tbody    { display: table-row-group }
.tfoot    { display: table-footer-group }
.col      { display: table-column }
.colgroup { display: table-column-group }
.td, .th   { display: table-cell }
.caption  { display: table-caption }


#testtable {
	height: 400px;
	width: 90%;
	overflow-y: scroll;
	overflow-x: scroll;
}

.testtable {
	margin-top: 20px;
}

.headcol {
	margin-right: 0px;
	background-color: grey;
	border-color: transparent !important;
}

.testtable .thead {
}

.testtable .th {
	padding: 10px;
	border: 1px solid purple;
	background-color: grey;
	border-color: transparent !important;
}


.testtable .td {
	padding: 10px;
	border: 1px solid grey;
	cursor: pointer;
}

.testtable .td:hover  {
		background-color: white;
		color: grey;
}


.div_formfield, .div_formfield_narrow, .div_formfield2 {
	vertical-align: top;
	margin: 5px 20px 10px 0px;
	font-size: 1.2em;
	padding-right: 10px;
	max-width: 115%;
}

.div_formfield2 {
	width: auto !important;
	padding: 0px;
	margin-right: 10px;
}

.div_formfield_narrow {
}

.maxwidth800{
	max-width: 800px;
}

.div_guidetext {
	font-size: 1.2em;
	color:white;
	margin-top: 20px;
	margin-bottom: 10px;
	font-weight: bold;
}

.div_guidetext_large {
	position: relative;
	padding: 40px;
	background-color: #2b2340;
	max-width: 83%;
}

.div_guidetext_large::before {
	display: block;
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 50px 0 0 75px;
	border-color: transparent transparent transparent #524582;
	bottom: 0;
	left: 0;

}

.div_guidetext_large::after {
	display: block;
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 0 75px 50px 0;
	border-color: transparent #524582 transparent transparent;
	right: 0;
	top: 0;
}

.div_fieldlabel {
	font-weight: normal;	
	color: rgba(238, 229, 255, 0.9);
	/* letter-spacing: -0.05em; */
	font-weight: bold;
}

.asterisk {
	display: inline-block;
	vertical-align: top;
	font-size: 0.9em;
	top: -20px;
	margin-bottom: 0px;
}

.div_fieldinput {
	font-size: 1em;	
}


.div_fieldinput input, .div_fieldinput select, .div_fieldinput2 input, .div_fieldinput2 input, .div_fieldinput textarea, .dd_general {
	text-align: left;
	background-color: rgba(255, 255, 255, 0.1);
	color: white;
	font-size: 1.1em;
	line-height: 1.3em;
	border: 1px solid rgba(255, 255, 255, 0.5);
	margin-top: 5px;
	padding: 5px 10px;
	font-weight: normal;
	max-width: 105%;
}


.div_fieldinput select option, .dd_general option {
	color: rgb(39, 28, 56);
	font-size: 1em;
}

.div_fieldinput input, .div_fieldinput2 input, .div_fieldinput2 input {
	max-width: 100%;
}


.div_fieldinput select,.div_fieldinput2 select, .dd_general {
	padding-top: 3px !important;
	height: 40px !important;
	background-color: rgba(255, 255, 255, 0.2);
}


.div_fieldinput input:focus, .div_fieldinput select:focus, .div_fieldinput2 input:focus,  .div_fieldinput textarea:focus {
	outline: 1px solid white;
	color: white;
}


.div_fieldinput input:disabled, .div_fieldinput select:disabled, .div_fieldinput textarea:disabled, .div_fieldinput2 input:disabled, .div_fieldinput2 select:disabled, .div_textarea {
	font-family:asap;
	background-color: transparent !important;
	color: rgb(246, 242, 255) !important;
	font-size: 1.3em !important;
	line-height: 1.3em;
	border: 1px solid rgba(255, 255, 255, 0.5);
	margin-top: 5px;
	padding: 5px 10px;
}

select.fieldinput:disabled {
	padding-top: 3px !important;
	height: 47px !important;
	border: 1px solid rgba(255, 255, 255, 0.3);
	color: white !important;
}

.div_fieldinput textarea:disabled {
	font-size: 0.9em !important;
}


.picker select, .picker select:focus  {
	color: rgb(39, 28, 56);
	border: 1px solid rgb(39, 28, 56);
}

.dd_general, .grade_dd select, .fdcs_course {
	font-size: 0.9em;
	letter-spacing: -0.02em;
}

#fdEthnic, #fdNationality {
	letter-spacing: -0.4px !important;
	font-size: 0.9em !important;
}

.option_desc {
	font-weight: bold;
	padding-left: 10px;
	padding-right: 5px;
}

.subtext {
	margin-left: 15px;
	font-size: 1.1em;
	color:rgb(237, 232, 244);
}

.subtitle, .sectitle{
	color: #ab2173;
    background-color: white;
    font-size: 1.6em;
    border: none;
    border-radius: 0;
    position: relative;
	display: inline-block;
	padding: 10px 20px;
	margin-left: -15px;
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: 1.4em;
	font-weight: bold;
	width: auto;
	transition-duration: 0.2s;
}

.subtitle, .sectitle::after {
	display: block;
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 15px;
    height: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 20px 20px;
    border-color: transparent transparent #524582 transparent;
}

.sectitle.sec_complete {
	border: 2px solid rgb(26, 53, 29);
	background-color: rgba(201, 255, 205, 0.6);
	color: rgb(26, 53, 29);
}

.sectitle.sec_locked {
	background-color: rgba(255, 255, 255, 0.6);
}

.sectitle.sec_locked.sec_complete {
	background-color: rgba(201, 255, 205, 0.6);
}

.sectitle:not(.sec_locked):hover {
	background-color: rgba(255, 255, 255, 0.8);
	cursor: pointer;
}

.sectitle.sec_complete:not(.sec_locked):not(.sec_open):hover {
	background-color: rgba(201, 255, 205, 0.9);
	cursor: pointer;
}

.sectitle.sec_open {
	color: white;
    background-color: #ab2173;
    font-size: 1.6em;
    border: none;
    border-radius: 0;
    position: relative;
}

.sectitle.sec_open::after {
	display: block;
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 15px;
    height: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 20px 20px;
    border-color: transparent transparent #524582 transparent;
}

.sectitle.sec_open:hover  {
	background-color: rgba(39, 28, 56, 0.5);	
}

.sectitle.sec_open.sec_complete {
	border-color: white;
	background-color: rgba(35, 71, 39, 0.8);	
}

.sectitle.sec_open.sec_complete:hover {
	background-color: rgba(44, 89, 48, 0.9);	
}

.sectitle.sec_open.sec_open:not(#sectitle1) {
	margin-top: 20px;
}

.div_rectitle {
	margin: 15px 40px 30px 0px;	
	font-size: 1.6em;
	letter-spacing: 0.15em;
	color: white;		
	font-weight: bold;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.8);	
}

.div_rectitle2 {
	margin: 20px 40px 30px 0px;	
	font-size: 1.5em;
	letter-spacing: 0.1em;
	color: #453059;
	background-color: rgba(255, 255, 255, 1);
	padding: 5px 15px;
	font-weight: bold;
	-moz-box-shadow:   1px 1px 3px rgba(0,0,0,0.7);	
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
	box-shadow: 1px 1px 3px rgba(0,0,0,0.7);	
}

.div_complete {
	position: absolute;
	left: 25%;
	color: #00cc00;
	font-size: 1.5em;
	padding-top: 10px;
}

.div_pagesection_b {
	margin: 15px 20px -25px -20px;
	padding: 10px 20px;	
	padding-bottom: 80px;
	width: 99%;
	background-color: rgba(65, 78, 142, 0.3) !important;
	border-top: solid 2px rgba(52, 64, 114, 0.5);
}

.div_secopenclose {
	margin-left: -40px;
	margin-right: 25px;
}

.btn_secopenclose.sec_locked {
	visibility: hidden;
}

.btn_secopenclose:not(.sec_locked):hover {
	/* opacity: 0.5; */
	cursor: pointer;
}

.btn_removerec {
	margin-top: -10px;
	vertical-align: middle;
	background-color:#663D49;	
}

.btn_removerec:hover {
	background-color: #754653;
}

.btn_addrec {
	vertical-align: middle;
	margin-bottom: 20px;
}

.btn_addrec span {
	margin-bottom: -20px;
}

hr {
	margin-top: 10px; margin-bottom: 10px;
	color: #a68e71;
}

.hr_divider {
	color: #432A47 !important;	
}

.divideline, .divideline2 {
	width: 100%;
	margin-left: -25px;
	height: 1px;
	border-bottom: 2px dashed rgba(255, 255, 255, 0.5);
	margin-bottom: 10px;
}

.divideline2 {
	width: 99%;
	margin-left: -30px;
}


#div_uploadhelp {
	margin-top: 20px;
	z-index: 1000;
}

.btn_closebox {
	position: absolute;
	top: -2px;
	right: -2px;
	font-size: 1.5em;
	color: black;
	cursor: pointer;
	padding:  4px 8px;
	transition-duration: 0.3s;
	background-color: rgba(255, 255, 255, 0.7);	
}


.btn_closebox:hover {	
	font-weight:bold;
	background-color: rgba(255, 216, 216, 0.7);
}

.hidden {
	display: none;
}

.novis {
	visibility: hidden;
}


#ul_attachmentarea li {	
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: break-all;
}


.circle-plus.sec_closed .vertical {
	transition: all 0.5s ease-in-out;
	transform: rotate(-90deg);
}
.circle-plus.sec_closed .horizontal {
	transition: all 0.5s ease-in-out;
	transform: rotate(-90deg);
}

.circle-plus.sec_open .vertical {
	transition: all 0.5s ease-in-out;
	transform: rotate(90deg);
}
  
.circle-plus.sec_open .horizontal {
	transition: all 0.5s ease-in-out;
	transform: rotate(90deg);
	opacity: 0;
}
  
  
.circle-plus .circle {
	position: relative;
	width: 46px;
	height: 26px;
	pointer-events: none;
}
  
.circle-plus .circle .horizontal {
	position: absolute;
	background-color: #ab2173;
	width: 30px;
	height: 5px;
	left: 50%;
	margin-left: -15px;
	top: 50%;
	margin-top: -2.5px;
}
  
.circle-plus .circle .vertical {
	position: absolute;
	background-color: #ab2173;
	width: 5px;
	height: 30px;
	left: 50%;
	margin-left: -2.5px;
	top: 50%;
	margin-top: -15px;
}


.appform_title {
	font-weight: bold;
    font-size: 40px;
    margin-bottom: 20px;
}