.navbar-back {
  float: left;  
  margin-left:20px;
  width: 40px;
  height: 64px;
  vertical-align:middle;
}

.navbar-back img{
  margin-top:15px;
  width:28px;     
}
.navbar-backX {
  float: left;  
  margin-left:15px;
  width: 40px;
  height: 64px;
  vertical-align:middle;
}

.navbar-backX img{
  margin-top:15px;
  width:28px;     
}


/* preregistration page */

.prereg_window {
    width: 640px;
    height:85vh;
    overflow-y:visible;
}

.prereg_layout{
    position: relative;
    top:0px;
    width: 640px;
    height: 100%;
    background-color: #fff;
    overflow:visible;
}

.prereg_item_join{
    position: relative; 
    top:0px;
    left:0px;
    width:100%;
    height:33%;  
    border:none;
    float: left;
    background-color:#fff;
}

.prereg_item_activate{
    position: relative; 
    top:64px;
    left:0px;
    width:100%;
    height:33%;   
    border:none;
    float: left;
    background-color:#fff;
}

.prereg_item_renew{
    position: relative; 
    top:64px;
    left:0px;
    width:100%;
    height:33%;   
    border:none;
    float: left;
    background-color:#fff;
}


.prereg_item_join:hover, .prereg_item_join:hover div.prereg_item_subtext, 
.prereg_item_renew:hover, .prereg_item_renew:hover div.prereg_item_subtext{
    background-color:#ea1d26;
    color:#fff;
}


.prereg_item_activate:hover, .prereg_item_activate:hover div.prereg_item_subtext{
    background-color:#07d5f1;
    color:#fff;
}

.prereg_item_activate:hover div.prereg_item_subtext_underline,
.prereg_item_join:hover, .prereg_item_join:hover div.prereg_item_subtext_underline, 
.prereg_item_renew:hover, .prereg_item_renew:hover div.prereg_item_subtext_underline{
    border-bottom: solid 3px #fff;
}

.prereg_itemtext, 
.renew_itemtext {
    font-family: OpenSans-ExtraBold;
    font-weight: bolder;
    font-size: 40pt;
    line-height:42pt;
    margin-top:12%;
    padding-left:20%;
    width:100%;
    text-align:left;
}

.activate_itemtext {
    font-family: OpenSans-ExtraBold;
    font-weight: bolder;
    font-size: 40pt;
    line-height:42pt;
    margin-top:12%;
    padding-left:20%;
    width:100%;
    text-align:left;
}


.prereg_renewtext {
    font-family: OpenSans-ExtraBold;
    font-weight: bolder;
    font-size: 40pt;
    margin-top:12%;
    padding-left:20%;
    width:100%;
    text-align:left;
}

.prereg_item_subtext{
    font-weight: bolder;
    font-size: 15pt;
    margin-top:3%;
    text-align:left;
    padding-left:20%;
    color:#000;
    width:100%;
}

.prereg_item_subtext_underline{
    border-bottom: solid 3px #000;
    height:5%;
    width:75px;
    text-align:left;
    margin-left:20%;

}

.join_now_headertext{
    text-align: center;
    font-weight: bold;
    font-size: 19pt;
    position:relative;
    top: 50px;
}


#join_now_panel, #renew_panel {
    background-color:#ea1d26;
    text-align: center;
    height:100%;
    color: #fff;
    position:relative;
    top:0px;
    left:0vw;
    
}

#activate_panel{
    background-color:#07d5f1;
    text-align: center;
    height:100%;
    color: #fff;
    position:relative;
    top:0px;
    left:0vw;
}

#join_now_panel_close, #activate_panel_close{
    position:relative;
    top: -10%;
    width:100%;
}

#join_now_panel_close img{
    position:absolute;
    top: 290px;
    width:68px;
    left:calc(320px - 34px);
}

#renew_panel_close{
    position:relative;
    top: 15%;
    width:100%;
}

#join_now_panel_closeX, #activate_panel_closeX{
    position:relative;
    top: -25%;
    left: 92%;
    width:40px;
    height: 40px;
    color: #fff;
    font-size:20pt;
}


#renew_panel_closeX{
    position:relative;
    top: 5%;
    left: 90%;
    width:40px;
    height: 40px;
    color: #fff;
    font-size:20pt;
}


.activate_panel_bottom{
    position:relative;
    top: -50vh;
}

.join_now_panel_itemtext, .activate_panel_itemtext, .renew_panel_itemtext{
    font-family: OpenSans-ExtraBold;
    font-weight: bolder;
    font-size: 40pt;
    line-height:38pt;
    position:relative;
    top: -10vh;
    padding-left:20%;
    width:100%;
    text-align:left;

}

.join_now_panel_subtext{
    font-weight: bolder;
    font-size: 15px;
    position: relative;    
    top: -70px;
    text-align:left;
    color:#fff;
    padding-left:20%;
    width:100%;
}

.activate_panel_subtext, .renew_panel_subtext{
    font-weight: bolder;
    font-size: 15px;
    position: relative;    
    margin-top: -9vh;
    text-align:left;
    color:#fff;
    padding-left:20%;
    width:100%;
}

.join_now_panel_underline{
    position: relative;    
    top: -70px;
    border-bottom: solid 3px #fff;
    width:75px;
    height:15px;
    text-align:left;
    left:20%;
    margin-bottom:10%;
}


.activate_panel_underline, .renew_panel_underline{
    position: relative;    
    top: 35%;
    border-bottom: solid 3px #fff;
    width:75px;
    height:15px;
    text-align:left;
    left:20%;
    margin-bottom:10%;
}

.join_now_panel_bottom, .activate_panel_bottom{
    position:relative;
    top: -5%;
}

.renew_panel_bottom{
    position:relative;
    top: 20%;
}

.regcode_txt, .cardNum_txt{
    position:relative;
    top:10px;
    left:0px;
    width:60%;
    height:63px;
    font-size: 14pt;
    border-style:solid;
    border-color:#fff;
    border-width:4px;
    color:#fff;
    background-color:#ea1d26;
}


.activate_cardNum_txt{
    position:relative;
    top:10px;
    left:0px;
    width:60%;
    height:63px;
    border-style:solid;
    border-color:#fff;
    border-width:4px;
    font-size: 14pt;
    padding-left:10px;
    color:#fff;
    background-color:#07d5f1;
    margin-left: auto;
    margin-right: auto;
}

.activate_panel_bottom_text{
    text-align:left;
    width:270px;
    position:relative;
    left: 20%;
}

.renew_panel_bottom_text, .join_now_panel_bottom_text{
    text-align:left;
    width:270px;
    position:relative;
    left: 20%;
}

.join_now_panel_or_line{
    display:inline-block;
    width:150px;
    height:50px;
    padding-top:10px;
    margin-top:20px;
    margin-bottom:10px;
}

.join_now_panel_hr_left{
    color:#fff;
    float:left;
    height:2px;
    margin-top:10px;
    width:50px;
    border:none;
    border-top: 2px solid #fff;

}

.join_now_panel_hr_right{
    color:#fff;
    float:right;
    margin-top:10px;
    width:50px;
    border:none;
    border-top: 2px solid #fff;
}


#lnkSignMeUp{
    width:206px;
    height:54px;
    padding-top:18px;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
}

#lnkReturnJoinNow, #lnkReturnRenew{
    width:206px;
    height:54px;
    padding-top:18px;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
}

.join_now_panel_error, .activate_panel_error, .renew_panel_error{
    position:absolute;
    top:50%;
    left:0vw;
    width:60%;
    left:20%;
    text-align:center;
}

#join_now_panel_error_msg{
    width:100%;
}

.activate_panel_login_window, .renew_panel_login_window, .renew_panel_forgotpassword_window, .activate_panel_forgotpassword_window, .renew_panel_forgotpassword_window{
    position:absolute;
    top:45%;
    left:10%;
    width:80%;
    text-align:left;
}

#lnkActivate{
    width:206px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}

.activate_panel_login_hi, .forgotpassword_txt{
    text-align: center;
    font-size: 15px;
}

.activate_panel_login_login_email, .renew_panel_login_email{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
}

.activate_panel_login_login_password, renew_panel_login_voucher{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
}


.activate_panel_logingo{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 60%;
    top: 200px;
}

.lnkReturnActivatePanel{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 0px;
    top: 200px;
}


.lnkReturnActivate{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left:35%;
    top: 100px;

}


.activate_panel_login_password_forgot, renew_panel_login_passwordForgot{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
    text-align:center;
}

.activate_panel_login_email_box{
    color:#07d5f1;
    width:100%;
    border:none;
}

.activate_panel_login_password_box{
    color:#07d5f1;
    width:100%;
    border:none;
}

.activate_panel_login_window a, #renew_panel_error_msg a, #join_now_panel_error_msg a, #activate_panel_error_msg a, .renew_panel_login_password_forgot a{
    color: #fff;
    text-decoration:underline;
    text-align:center;
}

.activate_panel_login_password_forgot{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
    text-align:center;
}

.renew_panel_login_password_forgot{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
    text-align:center;
}

.activate_panel_login_hi{
    text-align: left;
    font-size: 15px;
}

#lnkActivate{
    width:206px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}

.activate_panel_login_login_email, .renew_panel_login_email, .renew_panel_login_password{
    margin-top: 10px;
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:10px;
    width:100%;
}


#activate_panel_error_msg, #activate_panel_continue_msg, #renew_panel_error_msg, #renew_panel_continue_msg{
    width:100%;
    text-align:center;
}


#activate_panel_login_error_msg{
    position:absolute;
    margin-top: 5vw;
    text-align:center;
    width:100%;
}
 
.activate_panel_Continue, .renew_panel_Continue{
    position:absolute;
    top:50%;
    left:5vw;
    width:23vw;
    text-align:left;

}


.lnkReturnContinueActivate{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 2vw;
    top: 5vw;
}

.lnkReturnContinueRenew{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 2vw;
    top: 5vw;
}

 .lnkActivateContinue{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 12.3vw;
    top: 5vw;
}

.lnkRenewContinue{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 12.3vw;
    top: 5vw;
}

.lnkReturnActivateForgotpassword{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 2vw;
    top: 8vw;
}

.lnkReturnRenewForgotpassword{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 0px;
    top: 8vw;
}

.activate_panel_forgotpasswordgo{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 12.3vw;
    top: 8vw;
}

.renew_panel_forgotpasswordgo{
    position:absolute;
    width:9vw;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 17vw;
    top: 8vw;
}


 #renew_panel_forgotpassword_error_msg, #activate_panel_forgotpassword_error_msg{
    position:absolute;
    width:100%;
    margin-top: 120px;
}

.renew_panel_forgotpasswordContinue, .activate_panel_forgotpasswordContinue{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    margin-left: 30%;
    margin-top: 50px;
}

#lnkRenew{
    width:206px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}

.renew_panel_login_window{
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    width:80%;
    text-align:left;
}

.renew_panel_login_login_email, .renew_panel_login_login_password, .renew_panel_login_login_voucher{
    margin-top: 1vw;
    display:inline-block;
    margin-bottom:0.5vw;
    width:100%;
    text-align:left;
}

.renew_panel_login_email_box{
    color:#ea1d26;
    width:100%;
    border:none;
}

.renew_panel_login_password_box, .renew_panel_login_voucher_box{
    color:#ea1d26;
    width:100%;
    border:none;
}


.renew_panel_logingo{
    position:absolute;
    width:30%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 70%;
    top: 15vw;
}

#lnkReturnRenewLogin{
    position:absolute;
    width:30%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#ea1d26;
    font-weight:bold;
    font-size:18px;
    left: 0px;
    top: 15vw;
}

#renew_panel_login_error_msg{
    position:absolute;
    top: 130%;
    text-align:center;
    width:100%;
 }


/* end of pregistration page*/


/* old signup page */


.signup_header{
    width:640px; 
    position:relative;
    top:20px;
    margin-bottom:20px;
}

.signup_header_header{
    width:640px; 
    position:relative;
    margin-bottom:10px;
    text-align:center;
    font-size:23pt;
}

.signup_header_details{
    width:620px; 
    position:relative;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
    font-size:14pt;
}

.signup_links{
    width: 640px;
    position:relative;
    text-align:center;
    font-size:14pt;
}

.signup_AppStore{
    width:162px;
    position:relative;
    left: 20px;
    top: 20px;
}

.signup_AppStore img{
    width:162px;
    height:53px;
}

.signup_GooglePlay{
    width:160px;
    position: relative;
    top: -30px;
    left: 456px;
}

.signup_GooglePlay img{
    width:160px;
    height:52px;
}

/* end of old signup page */



/* signup stuff */

.signup_window {
    width: 640px;
    overflow-y:visible;
}

.signup_banner {
    position:relative;
    top:20px;
    width: 640px;
}

.signup_banner img {
    width: 640px;
}


input[type="checkbox"] {
    display:none;
}   

input[type="checkbox"] + label span {
    display: inline-block;
    float:left;
    width:21px;
    height:21px;
    margin:-1px 4px 0px 0px;
    vertical-align:middle;
    background: url(../Images/Main/chkboxes.png) left top no-repeat;
    cursor:pointer;
}

input[type="checkbox"]:checked + label span {
    background: url(../Images/Main/chkboxes.png) left -21px top no-repeat;
}   

/* end of signup stuff */

/* signup 1 page */

#allreg{
    position:relative; 
}

.regvis{
    display:inline-block;
    height:100vh; 
    width:640px;
    margin-left: auto;
    margin-right: auto;
    width:99%;
    z-index: 10;
    position: relative;
    top:0px;
}

#reg1 {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.reghdr{
    position:absolute;
    top:10px;
    left:0px;
    width:640px;
    float:left;
    height: 40px;
    margin-bottom:20px;
}

.reghdr img{
    width:100%;
}

.signup_video {
	width: 640px;
	height: 360px;
	color: #282828;
	position: absolute;
	top: 120px;
	font-size: 30pt;
	font-weight: bold;
	border: solid 1px blue;
}

iframe#sup_video {
	width: 640px;
	height: 360px;
}

.reg1_form1 {
	position: relative;
	top: 500px;
	left: 0px;
	width: 100%;
}

.signuphdr{
    width: 100%; 
    color: #282828;
    position: absolute;
    top: 130px;
    font-size: 30pt;
    font-weight:bold;
}


.signuphdr1 {
	width: 100%;
	color: #282828;
	position: relative;
	top: 490px;
	/*font-size: 1em; */
	font-family: HelveticaNeue-Bold;
	font-size: 30pt;
	border-bottom: solid 1px #282828;
}

.reg1_form{
    position:relative;
    top: 510px;
    left:0px;
    width: 100%;
}

.input_text_bold{
    position:relative;
    top:10px;
    margin:0px 0px 10px 0px;
    width:100%;
    float: left; 
    font-size: 25pt;
    font-weight:bold;
}

.input_text_italic {
	font-size: 10pt;
	font-weight: normal;
	font-style: italic;
	position: relative;
	color: #575757;
	width: 100%;
	top: 10px;
	margin-bottom: 5px;
}

.input_txt {
	position: relative;
	top: 10px;
	width: 640px;
	line-height: 40px;
	height: 60px;
	border: #787878 1px solid;
	color: #575757;
	border-radius: 10px;
	padding-left: 5px;
	font-size: 15pt;
}

input:focus {
	outline: none;
}

.input_txt_lc {
	position: relative;
	top: 10px;
	width: 640px;
	line-height: 40px;
	height: 60px;
	border: #787878 1px solid;
	color: #575757;
	border-radius: 10px;
	padding-left: 5px;
	font-size: 15pt;
	text-transform: lowercase;
}

.k-dropdown-wrap.k-state-default, .k-dropdown-wrap.k-state-disabled {
	background-color: #fff;
	height: 50px;	
	line-height: 60px;
	font-size: 15pt;
	border: #787878 1px solid;
	border-radius: 10px;
	padding-top: 10px;

}

.k-widget.k-dropdown.k-header.ddlDate, .k-widget.k-dropdown.k-header.customDDL {
	background-color: #fff;
}

div.k-popup .k-item {
	font: 15pt normal HelveticaNeue-Bold, Arial, Helvetica, sans-serif;
}

.k-widget.k-dropdown.k-header.ddlDate3 {
	background-color: #fff;
}

.k-select {
	padding-top: 10px;
}

.k-dropdown-wrap .k-select {
	width: 3.9em;
}

.k-icon.k-i-arrow-s {

}

.k-dropdown-wrap.k-state-default {
	left:0px;
}

/* new stuff */


[data-role="popup"] {
	background-color: #fff !important;
	border-radius: 10px !important;
}

	[data-role="popup"] ul li[class="k-item k-state-hover"], [data-role="popup"] ul li[class="k-item k-state-selected k-state-focused"] {
		background-color: #787878 !important;
		border-color: #787878 !important;
		color: #fff;
		border-radius: 10px;
	}

/*end of new stuff */

.gender_Template {
	font-size: 15pt;
	color: #575757;
	background-color: #fff;
}


.institution_typeTemplate {
}

.date_Template {
	font-size: 15pt;
	color: #575757;
	background-color: #fff;
}

.city_Template, .living_status_Template {
	font-size: 15pt;
	color: #575757;
	background-color: #fff;
}

.ddlDate {
	width: 200px;
	margin-right: 13px;
}

.ddlDate3 {
	width: 200px;
}

.customDDL {
	width: 640px;
	margin-top:10px;
	font-size:15pt;
}

.input_line_date {
	position: relative;
	top: 10px;
	left: 0vw;
	width: 100%;
}


.input_line_continue {
	position: relative;
	top: 50px;
	left: 0vw;
	width: 100%;
	margin-bottom: 20px;
}


#firstname:-ms-input-placeholder,
#lastname:-ms-input-placeholder,
#address3:-ms-input-placeholder,
#studyaddress_postcode:-ms-input-placeholder {
	color: #575757;
}

#firstname::-webkit-input-placeholder,
#lastname::-webkit-input-placeholder,
#address3::-webkit-input-placeholder,
#studyaddress_postcode::-webkit-input-placeholder {
	color: #575757;
}
#firstname::-moz-placeholder,
#lastname::-moz-placeholder,
#address3::-moz-placeholder,
#studyaddress_postcode::-moz-placeholder {
	color: #575757;
}
#firstname:-moz-placeholder,
#lastname:-moz-placeholder,
#address3:-moz-placeholder,
#studyaddress_postcode:-moz-placeholder {
	color: #575757;
}

#email:-ms-input-placeholder {
	color: #575757;
}
#email::-webkit-input-placeholder {
	color: #575757;
}
#email::-moz-placeholder {
	color: #575757;
}
#email:-moz-placeholder {
	color: #575757;
}

#emailcheck:-ms-input-placeholder {
	color: #575757;
}
#emailcheck::-webkit-input-placeholder {
	color: #575757;
}
#emailcheck::-moz-placeholder{
}
#emailcheck:-moz-placeholder {
	color: #575757;
}

#password:-ms-input-placeholder {
	color: #575757;
}
#password::-webkit-input-placeholder {
	color: #575757;
}
#password::-moz-placeholder {
	color: #575757;
}
#password:-moz-placeholder {
	color: #575757;
}

input#gotopage2 {
    background: #07d5f1 url(../Images/Main/continue_black.png) no-repeat left 170px top 15px;
    position:relative;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color: #000;
    background-color: #07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 220px;
    bottom: 0px;
    border:none;
overflow:hidden;
}



/*end of signup1 page*/

/* signup2 page */

#reg2 {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.reg2_form{
    position:relative;
    top: 190px;
    left:0px;
    width: 100%;
}

.reg_bottom2{
    position:relative;
    width:100%;
   top: 100px;
}

#returntopage1{
    background: #07d5f1 url(../Images/Main/back_black.png) no-repeat left 10px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color: #000;
    background-color: #f6e800;
    font-weight:bold;
    font-size:18px;
    left: 0px;
    bottom: 10px;
}

input#gotopage3 {
    background: #07d5f1 url(../Images/Main/continue_black.png) no-repeat left 170px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    color: #000;
    background-color: #07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 440px;
    bottom: 10px;
    overflow:hidden;
}

/* end of signup2 page */

/* signup3 page */

#reg3 {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.reg3_form{
    position:relative;
    top: 200px;
    left:0px;
    width: 100%;
}

.reg_bottom3{
    position:relative;
    width:100%;
   top: 100px;
}

#returntopage2{
    background: #07d5f1 url(../Images/Main/back_black.png) no-repeat left 10px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color: #000;
    background-color: #f6e800;
    font-weight:bold;
    font-size:18px;
    left: 0px;
    bottom: 10px;
}

input#gotoPage4 {
    background: #07d5f1 url(../Images/Main/continue_black.png) no-repeat left 170px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    color: #000;
    background-color: #07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 440px;
    bottom: 10px;
    overflow:hidden;
}


#ext_stud_ref:-ms-input-placeholder{
  background: url(../Images/Main/redA.png) no-repeat left 110px top 7px;
}
#ext_stud_ref::-webkit-input-placeholder {
  background: url(../Images/Main/redA.png) no-repeat left 110px top 7px;
}
#ext_stud_ref::-moz-placeholder{
  background: url(../Images/Main/redA.png) no-repeat left 110px top 7px;
}
#ext_stud_ref:-moz-placeholder{
  background: url(../Images/Main/redA.png) no-repeat left 110px top 7px;
}

/* end of signup3 page */

/* regPhoto page */

#regPhoto {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.regPhoto_form{
    position:relative;
    top: 190px;
    left:0px;
    width: 100%;
}

.regPhoto_top{
    position:relative;
    top: 20px;
    left:0px;
    width: 100%;
    text-align:center;
    font-size: 20pt;
}

.regPhoto_top img{
   display:block;
   margin-left: auto;
   margin-right: auto;
   width: 15%;
}

.regPhoto_bottom{
    position:relative;
    width:100%;
    top: 670px;
}

.next_stepPhoto{
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    color: #000;
    background-color: #07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 440px;
    top: -80px;
}

#returntopage3{
    background: #07d5f1 url(../Images/Main/back_black.png) no-repeat left 10px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#f6e800;
    color: #000;
    font-weight:bold;
    font-size:15pt;
    left: 0px;
    top: -80px;
}

#gotoFinish {
    background: #07d5f1 url(../Images/Main/continue_black.png) no-repeat left 170px top 15px;
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    color: #000;
    background-color: #07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 440px;
    bottom: 10px;
    overflow:hidden;
}

.regPhoto_get{
   position:absolute;
   width:80%;
   top: 420px;
   left: 10%;
}

.updatePhoto{
   position:absolute;
   width:100%;
   top: 0px;
   text-align:center;
   text-decoration:underline;
}

.select_photo{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color: #000;
    font-weight:bold;
    font-size:15pt;
    left: 25%;
    top: 0px;
}

.useCamera{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color: #000;
    background-color: #f6e800;
    font-weight:bold;
    font-size:15pt;
    left: 10%;
    top: 10px;
}

#existing_photo_background{
    position:absolute;
    top: 40px;
    left:192px;
    width:256px;
    height: 340px;
}

.preview-container{
    width:256px;
}

.preview-container img {
    width:256px;
}

.jcrop-preview{
     width:256px;
     /* height: 340px;  */
    
     position:relative;
     left:0px;
}

.crop_message{
    position:relative;
    top: 20px;
    width:256px;   
    text-align:center;
}

.rotate_btn{
    width:167px; 
    position:absolute;
    top:-240px;      
    left: calc(50% - 84px);     
}


/* end of regPhoto page */

/* regMembership */


#regMem {
	position: relative;
	width: 680px;
	top: 17px;
	margin-left: auto;
	margin-right: auto;
}

.regMem_form {
	position: relative;
	top: 240px;
	left: 0px;
	width: 640px;
	color: #a5a5a5;
	font-weight: normal;
}

.buynow {
	background-color: #ed1718;
	color: #fff;
	font-size:20pt;
	display: block;
	width: 429px;
	height: 68px;
	position: absolute;
	border: 0px;
	top: 240px;
	left: 100px;
	border: 0px;
}

.containerMem {
	display: block;
	position: relative;
	padding-left: 45px;
	margin-bottom: 5px;
	cursor: pointer;
	font-size: 22px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: none;
}


/* Hide the browser's default radio button */
.containerMem input {
	position: absolute;
	opacity: 0;
}

/* Create a custom radio button */
.checkmarkMem {
	background: #eee url(../../Images/Main/radio_off.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
	background-color: #eee;
	border-radius: 50%;
}

.containerMem:hover input ~ .checkmarkMem {
	background: #eee url(../../Images/Main/radio_checked.png) no-repeat top 0px left;
}

.containerMem input:checked ~ .checkmarkMem {
	background: #fff url(../../Images/Main/radio_checked.png) no-repeat top 0px left;
}

.checkmarkmEM_checked {
	background: #eee url(../../Images/Main/radio_checked.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
	background-color: #eee;
	border-radius: 50%;
}

.checkmarkMem {
	background: #eee url(../../Images/Main/radio_off.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
	background-color: #eee;
	border-radius: 50%;
}


.laybuy_text {
	color: #7c7c7c;
	font-size: 12pt;
	width: 50vw;
	position: relative;
	left: 45px;
	padding-bottom: 10px;
}

	.laybuy_text img {
		width: 100px;
	}

.laybuy_whatsthis {
	color: #7c7c7c;
	font-size: 10pt;
	position: relative;
	top: -45px;
	left: 360px;
	text-decoration: underline;
}

	.laybuy_whatsthis:hover {
		cursor: pointer;
		cursor: hand;
	}

.laybuy_whatsthis a {
	color: #7c7c7c;
	font-size: 10pt;
	position: relative;
	text-decoration: underline;
}

.buynow {
	width: 320px;
	background-color: #ed1718;
	height: 60px;
	border: none;
	color: #fff;
	position: relative;
	top: 10px;
}

	.buynow:hover {
		background-color: #d20001;
	}

.laybuy_btn {
	width: 320px;
	height: 50px;
	top: 50px;
	left: 100px;
	border: none;
	position: relative;
	background-color: transparent;
}

	.laybuy_btn img {
		width: 320px;
		border: none;
		position: relative;
		top: 0px;
		left: -10px;
	}

		.laybuy_btn img:hover {
			cursor: pointer;
			cursor: hand;
		}


/* end of regMembership */

/* 2 degrees stuff */

.reg_twodegrees_reghdr {
	position: absolute;
	top: 30px;
	left: 0px;
	width: 640px;
	float: left;
	height: 40px;
	margin-bottom: 20px;
}

.reg_twodegrees_reghdr img {
	width: 100%;
}

.reg_twodegrees_header {
	width: 600px;
	position: relative;
	top: 140px;
	left: -20px;
	margin: 0 auto;
	font-size: 20pt;
	font-weight: bold;
	text-align: center;
}

	.reg_twodegrees_header img {
		width: 640px;
		margin-bottom: 20px;
	}

.reg_twodegrees_header_text {
	width: 600px;
	position: relative;
	top: 120px;
	left: 20px;
	font-size: 20pt;
	font-weight: bold;
	text-align: center;
}

.reg_twodegrees_text {
	position: relative;
	left: 0px;
	top: 150px;
	width: 640px;
	font-size: 15pt;
	text-align: center;
}

.reg_twodegrees_option_text {
	width: 640px;
	text-align: center;
	position: relative;
	top: 170px;
	color: #009ed8;
	font-size: 17pt;
}

.twodegreesOffersList {
	width: 640px;
	position: relative;
	top: 190px;
	color: #a5a5a5;
}


.reg_container2d {
	display: block;
	position: relative;
	padding-left: 45px;
	margin-bottom: 15px;
	cursor: pointer;
	font-size: 12pt;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: none;
}

	/* Hide the browser's default radio button */
	.reg_container2d input {
		position: absolute;
		opacity: 0;
	}

/* Create a custom radio button */
.reg_checkmark2d {
	background: #fff url(../../Images/Main/twodegreesunchecked.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
}

.reg_container2d:hover input ~ .reg_checkmark2d {
	background: #fff url(../../Images/Main/twodegreesChecked.png) no-repeat top 0px left;
}

.reg_container2d input:checked ~ .reg_checkmark2d {
	background: #fff url(../../Images/Main/twodegreesChecked.png) no-repeat top 0px left;
}

.reg_checkmark2d_checked {
	background: #fff url(../../Images/Main/twodegreesChecked.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
}

.reg_checkmark2d {
	background: #fff url(../../Images/Main/twodegreesunchecked.png) no-repeat top 0px left;
	position: absolute;
	top: 0;
	left: 0;
	height: 34px;
	width: 34px;
}

.reg_twodegrees_next {
	width: 512px;
	height: 50px;
	background-color: #009ed8;
	color: #fff;
	font-size: 15pt;
	border: none;
	margin-top: 30px;
	margin-left: 64px;
	position: relative;
	top: 160px;
}

.reg_twodegrees_tac {
	width: 640px;
	position: relative;
	left: 0px;
	top:220px;
	margin: 0 auto;
	color: #282828;
	font-size: 10pt;
	clear: both;
}


/* end of 2 degrees stuff */


/* finishReg page */

#regFinsh {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.regFin_form{
    position:relative;
    top: 200px;
    left:0px;
    width: 100%;
}

.regfinCard{
    position:absolute;
    top:100px;
    left: 5%;
    width:90%;
    height:500px;
}

.regfinCard img{
    width:100%;
    float:left;
}


.reg_conf_details{
    position:absolute;
    top:500px;
    height:340px;
    left: 5%;
    width:90%;
    padding-left:10px;
    padding-top:10px;
    background-color: #f8f8f8;
}

.reg_conf_top{
    font-weight:bold;
}

.reg_conf_detail_line{
    position:relative;
    top:10px;
    width:100%;
    float:left;
    margin-bottom:10px;
}
.reg_conf_detail_line_lhs{
    width:120px;
    float:left;
}

.reg_conf_detail_line_rhs{
    width:390px;
    float:left;
}


.regFin_bottom{
    position:relative;
    width:100%;
    top: 100px;
}

.edit_step{
    position:absolute;
    top:40px;
    left: 35%;
    width:30%;
    height:54px;
    line-height:54px;
    text-align:center; 
    font-size: 15pt;
    background-color: #b7f200;
    color:#000;
}

.reg_correct{
    position:absolute;
    top:960px;
    left: 20%;
    width:60%;
    height:54px;
    line-height:54px;
    text-align:center; 
    background-color: #ed1718;
    color:#fff;
    margin-bottom:40px;
    font-size: 15pt;
}


/* end of finishReg page */


/* RegEnd page */

#regEnd {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.regEnd_form{
    position:relative;
    top: 220px;
    left:0px;
    width: 100%;
}

#horiz_align300{
    position:absolute;
    top:100px;
    left:170px;
    width: 300px; 
}

.regEnd_body{
    position:absolute;
    top:280px;
    width: 640px; 
    text-align: center; 
    font-style: italic; 
    color: #282828; 
    position:relative;

}

.check_deals{
    position:absolute;
    top:20px;
    left: 240px;
    float: left; 
    font-weight:bold;
    text-align: center;
}

.gotodeals_container{
    position:relative; 
    top:-30px; 
    left: 220px; 
    width: 297px; 
    height: 140px; 
    overflow: auto; 
    clear:both;

}

.gotodeals {
    position:absolute;
    top:20px;
    left: 10px;
    width:60%;
    height:54px;
    line-height:54px;
    text-align:center; 
    background-color: #f6e800;
    color:#000;
    margin-bottom:40px;
    font-size: 15pt;
}

.regEnd_arrow{
    float: right; 
    margin-top: 60px; 
    margin-right:180px;
}


.regEnd_arrow img{
    width: 40px;

}

/* end of RegEnd page */

/*  login page */

#login_page {
    position: relative;
    width:640px;
    height: 100vh;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

#login_panel{
    background-color:#fff;
    text-align: center;
    height:100%;
    color: #000;
    position:relative;
    top:0px;
    left:0vw;
}

#reset_panel{
    background-color:#fff;
    text-align: center;
    height:100%;
    color: #000;
    position:relative;
    top:0px;
    left:0vw;
}

.login_panel_header{
    position: relative;
    top: 20px;
    left:10%;
    width: 80%;
    height: 50px;
    text-align: left;
    font-size: 15pt;
    font-weight:bold;
}

.login_input_txt{
    position:relative;
    top:10px;
    left:0%;
    width:80%;
    height:63px;
    font-size: 14pt;
    border-style:solid;
    border-color:#acacac;
    border-width:1px;
    color:#000;
    background-color:#fff;
    padding-left:10px;
}


#forgot_password_panel {
    background-color:#fff;
    text-align: center;
    height:100%;
    color: #000;
    position:absolute;
    top:50px;
    left:0vw;
}

#txtEmail:-ms-input-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px top 10px;
  color: #757575;
}
#txtEmail::-webkit-input-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color:  #757575;
}
#txtEmail::-moz-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color: #757575;
}
#txtEmail:-moz-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color:  #757575;
}

#txtPassword:-ms-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px top 10px;
  color: #757575;
}
#txtPassword::-webkit-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}
#txtPassword::-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color: #757575;
}
#txtPassword:-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}


.login_password_forgot{
    position:relative;
    top: 20px;
    left: 10%;
    width:40%;
    height:30px;
    text-align: left;
    font-size: 15pt;
    color: #acacac;
}


.login_password_forgot a{
    color: #acacac;
}

.login_panel_needhelp{
    position:relative;
    top: -10px;
    left: 50%;
    width:40%;
    height:30px;
    text-align: right;
    font-size: 15pt;

}

.login_panel_needhelp a{
    color: #acacac;
}

.reset_panel_ResetPassword_header{
    text-align: center;
    font-size: 15px;
}

.login_panel_loginBtn{
    position:relative;
    width:60%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#ea1d26;
    color:#fff;
    font-weight:bold;
    font-size:18px;
    left: 20%;
    top: 20px;
}

.login_panel_message{
    position:absolute;
    margin-top: 50px;
    text-align:center;
    width:100%;
}

.forgot_password_panel_txt{
    text-align: center;
    font-size: 15px;
}

#forgot_password_panel_forgotpasswordgo{
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#ea1d26;
    color:#fff;
    font-weight:bold;
    font-size:18px;
    left: 420px;
    top: 120px
}

.forgot_password_panel_ReturnForgotpassword{
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#ea1d26;
    color:#fff;
    font-weight:bold;
    font-size:18px;
    left: 20px;
    top: 120px;
}

.forgot_password_panel_forgotpasswordContinue{
    position:absolute;
    width:200px;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    margin-left: 30%;
    margin-top: 50px;
}


#forgot_password_panel_forgotpassword_error_msg{
    position:absolute;
    width:100%;
    height: 50px;
    margin-top: 120px;
}


.reset_panel_changepassword_button{
    position:absolute;
    width:40%;
    height:54px;
    line-height:54px;
    text-align:center;
    background-color:#fff;
    color:#07d5f1;
    font-weight:bold;
    font-size:18px;
    left: 30%;
    top: 400px;
}

#reset_panel_message{
    position:absolute;
    width:100%;
    margin-top: 120px;
}


#txtRPEmail:-ms-input-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px top 10px;
  color: #757575;
}
#txtRPEmail::-webkit-input-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color:  #757575;
}
#txtRPEmail::-moz-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color: #757575;
}
#txtRPEmail:-moz-placeholder {
  background: url(../Images/Main/email-icon.png) no-repeat right 10px bottom 8px;
  color:  #757575;
}

#txtRPNewPassword:-ms-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px top 10px;
  color: #757575;
}
#txtRPNewPassword::-webkit-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}
#txtRPNewPassword::-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color: #757575;
}
#txtRPNewPassword:-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}


#txtRPVerifyPassword:-ms-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px top 10px;
  color: #757575;
}
#txtRPVerifyPassword::-webkit-input-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}
#txtRPVerifyPassword::-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color: #757575;
}
#txtRPVerifyPassword:-moz-placeholder {
  background: url(../Images/Main/Password-icon.png) no-repeat right 10px bottom 3px;
  color:  #757575;
}


.forgot_password_panel_changepassword_button{
    position:absolute;
    width:60vw;
    height:2.5em;
    line-height:2.5em;
    text-align:center;
    background-color:#ea1d26;
    color:#fff;
    font-weight:bold;
    font-size:1.25em;
    left: 20vw;
    top: 350px;
}

/*  end of login page */


/* MYCard page */

#mycard_page {
    position: relative;
    width:640px;
    height:1400px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

#mycard {
    position: relative;
    width:640px;
    top: 17px;
    margin-left: auto;
    margin-right: auto;
}

.mycard_top{
    width: 100%; 
    color: #282828;
    position: absolute;
    top: 30px;
    left: 20px;
    font-size: 30pt;
    font-weight:bold;
}

.mycardcontainer {
	position: absolute;
	top: 100px;
	left: 20px;
	width: 600px;
	height: 500px;

}

	.mycardcontainer img {
		width: 600px;
		float: left;
		border: solid 1px #aaaaaa;
		-moz-border-radius: 10px;
		border-radius: 10px;
	}

.expired_card {
    position: relative;
    top: -379px;
    height: 380px;
    width: 600px;
}

.mybackcardcontainer {
	position: relative;
	top: 460px;
	left: 20px;
	width: 600px;
	height: 500px;
}

	.mybackcardcontainer img {
		width: 600px;
		float: left;
	}


.mycard_details{
	position:relative;
    top:400px;
    height:400px;
    left: 20px;
    width:600px;
    padding-left:10px;
    padding-top:10px;
    background-color: #f8f8f8;
}

.mycard_top{
    position:relative;
    top:10px;
    left:0px;
    width:100%;
    font-weight:bold;
}

.mycard_details_top{
    position:relative;
    top:10px;
    left:0px;
    width:100%;
    font-size:15px;
    font-weight:bold;
}

.mycard_detail_line{
    position:relative;
    top:10px;
    width:100%;
    float:left;
    margin-bottom:10px;
}
.mycard_detail_line_lhs{
    width:120px;
    float:left;
}

.mycard_detail_line_rhs{
    width:450px;
    float:right;
}

.mycard_edit_step{
    position:absolute;
    top:320px;
    left: 35%;
    width:30%;
    height:54px;
    line-height:54px;
    text-align:center; 
    font-size: 15pt;
    background-color: #b7f200;
    color:#000;
}

.mycard_reprint_etc{
    position:relative;
    top:440px;
    height:100px;
    left: 20px;
    width:600px;
    padding-left:10px;
    padding-top:10px;
}

.mycard_renew{
    position:absolute;
    top:0px;
    left: 20%;
    width:60%;
    height:54px;
    line-height:54px;
    text-align:center; 
    font-size: 15pt;
    background-color: #f6e800;
    color:#000;
}

.mycard_reprint{
    position:absolute;
    top:0px;
    left: 20%;
    width:60%;
    height:54px;
    line-height:54px;
    text-align:center; 
    font-size: 15pt;
    background-color: #f6e800;
    color:#000;
}

.mycard_reprint_successful{
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100px;
    text-align:center;
}

/* end of MYCard page */

/*   regpay  page */

.reg_pay_button{
    width: 500px;
    float:left;
    margin-left:0px;
    margin-top:20px;
}

.reg_pay_retry{
    background: url(../Images/Main/TryPaymentAgain.png) no-repeat top right;
    width:219px;
    height:57px;
    position:relative;
    border:none;
}

/* end of regpay page*/