body {font-family: 'Source Sans Pro', sans-serif; font-size: 14px; background: #00abbd;}

.container_16 {
	margin-left: auto;
	margin-right: auto;
	width: 1200px;
}
.container_16 .grid_1 {
	width: 55px;
}	
.container_16 .grid_2 {
	width: 130px;
}	
.container_16 .grid_3 {
	width: 205px;
}
.container_16 .grid_4 {
	width: 280px;
}	
.container_16 .grid_5 {
	width: 355px;
}	
.container_16 .grid_6 {
	width: 430px;
}	
.container_16 .grid_7 {
	width: 505px;
}

.container_16 .grid_8 {
	width: 580px;
}
.container_16 .grid_9 {
	width: 655px;
}

.container_16 .grid_10 {
	width: 730px;
}

.container_16 .grid_11 {
	width: 805px;
}

.container_16 .grid_12 {
	width: 880px;
}
.container_16 .grid_13 {
	width: 955px;
}

.container_16 .grid_14 {
	width: 1030px;
}

.container_16 .grid_15 {
	width: 1105px;
}
.container_16 .grid_16 {
	width: 1180px;
}

.header_wrap {background: #fff;}
.logo {padding: 10px 0; text-align: center;}
.love {text-align: center;}

.love_wrap {padding: 10px 0; background: #00abbd; border-bottom: 1px solid #019cac; -webkit-box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75); box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75);}

.content_wrap {border-top: 1px solid #00b6c9; padding: 20px 0;}

a {text-decoration: none; color: inherit;}

.footer_wrap {padding: 10px 0; background: #662d91; -webkit-box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75); box-shadow: inset 0px 15px 18px -24px rgba(0,0,0,0.75); color: #fff; line-height: 30px; padding-bottom: 30px; text-align: center; font-size: 16px;}

div.registerButton, div.loginButton, div.completeButton {display:block; color: #00abbd; border: 1px solid #0099a9;  border-radius: 10px; box-sizing:border-box; padding: 10px 20px; text-align: center; font-size: 18px; line-height: 26px; margin-bottom: 10px; background: #fff;} 
div.registerButton span, div.loginButton span, div.completeButton span {display: block; font-size: 30px; font-weight: bold; line-height: 46px; }
div.registerButton a, div.loginButton a, div.completeButton a {margin: 10px auto; display: block; background: #ec008c url(../images/useradd.png) no-repeat left 16px center; border-radius: 5px; line-height: 40px; padding-left: 30px; width: 100px; color: #fff; text-transform: uppercase; font-weight: bold;}
div.loginButton a {background: #8dc63f url(../images/login.png) no-repeat left 16px center;}
div.completeButton a {background: #662d91 url(../images/complete.png) no-repeat left 16px center; width: 270px;}

.footer_wrap ul{list-style: none; font-size: 0; line-height: 0; margin: 10px 0; padding: 0; text-align: center;}
.footer_wrap ul li{display: inline-block; list-style: none; font-size: 14px; line-height: 16px; margin: 0; padding: 0; border-right: 1px solid #fff; font-weight: bold;}
.footer_wrap ul li:last-child {border: 0;}
.footer_wrap ul li a {display: block; color: #fff; padding: 0 10px;}


.need-help {font-size: 22px; color: #bef7fd; line-height: 42px;}

.signup {border-radius: 10px; box-shadow: 0 0 5px rgba(0,0,0,0.5);}
.signup > div:first-child {border-radius: 10px 10px 0 0; background: #ec008c; font-size: 30px; color: #fff; font-weight: bold; line-height: 70px; padding: 0 20px;}
.signup > div:nth-child(2),.signup > div:nth-child(3) {background: #fff; padding: 0 20px; color: #00abbd;}
.signup > div:nth-child(2) {padding-top: 10px;}
.signup > div:nth-child(2) > div {font-size: 20px; padding-top: 10px; font-weight: bold; height: 60px; text-transform:uppercase; position: relative; padding-left: 60px;}
.signup > div:nth-child(2) > div:first-child {line-height: 40px;}
.signup > div:nth-child(2) > div:nth-child(5) {line-height: 40px; height: 50px;}
.signup > div:nth-child(2) > div img {position: absolute; left: 5px; top: 10px;}
.signup > div:nth-child(2) > div span {font-size: 18px; font-weight: normal; text-transform:none;}
.signup > div:nth-child(3) {padding: 0px 20px 20px 100px; border-radius: 0 0 10px 10px; line-height: 24px; font-size: 12px;}

.registration {border-radius: 0px; box-shadow: none; border-left: 1px solid #01bacd; padding-left: 10px;}
.registration > div:first-child {background: none; border-radius: 0; padding: 0; line-height: 40px; margin-bottom: 10px;}
.registration > div:nth-child(2),.registration > div:nth-child(3) { background: none; padding:0; color: #fff;}
.registration > div:nth-child(2) {padding: 0 5px;}
.registration > div:nth-child(2) > div {padding-left: 35px; font-size: 16px; padding-top: 5px;}
.registration > div:nth-child(2) > div span {font-size: 14px;}
.registration > div:nth-child(2) > div img {width: 26px; height: 26px; left:0;}
.registration > div:nth-child(2) > div:first-child {line-height: 22px; height: 60px;}
.registration > div:nth-child(2) > div:nth-child(4) {height: 70px;}
.registration > div:nth-child(2) > div:nth-child(5) {line-height: 22px; height: 60px;}
.registration > div:nth-child(3) {padding-left: 10px;}

.whiteback:not(.myAccount) {padding: 10px; background: #fff; border-radius: 10px; border: 2px solid #029fb0;}
.registerHeader {color: #fff; font-size: 36px; font-weight: bold; line-height: 40px; padding: 10px 0;}
.registerHeader span {font-size: 22px; line-height: 28px; font-weight: normal; display: block;}
.registerForm > .grid_12 > .grid_5, .registerForm > .grid_12 > .grid_7 {font-size: 18px; font-weight: bold; color: #fff; line-height: 50px;}
.registerForm input[type=radio] {margin-right: 10px;}

.whiteback > div:nth-child(1), .myAccount > form > div:nth-of-type(1) {float: left; width: 50%; box-sizing: border-box; padding-right: 10px}
.whiteback > div:nth-child(2), .myAccount > form > div:nth-of-type(2) {float: left; width: 50%; box-sizing: border-box; padding-left: 10px;}
.whiteback label {display: block; color: #00abbd; font-size: 15px; font-weight: bold; line-height: 24px;}
.whiteback label span {font-weight: normal;}
.whiteback label.gender {line-height:60px; margin-bottom: 9px;}
.whiteback label.gender input[type=radio] {margin: 0 0 0 10px;}


.whiteback input[type=text],.whiteback input[type=password], .whiteback textarea, .whiteback select {display: block; margin: 0 0 15px 0; border: 1px solid #b3b5c5; padding: 0 5px 0 35px; line-height: 30px; font-family: inherit; width: 100%; box-sizing: border-box; height: 30px;}
.whiteback textarea {resize: none; height: 120px;}
.whiteback select {padding: 0;}
.dob {height: 69px;}
.dob select {width: 30%; float: left; margin-right: 10px;}

.required {text-align: right; line-height:30px; font-size: 12px; color: #00abbd;}

.whiteback h1 {font-size: 20px; font-weight: bold; color: #00abbd; line-height: 40px; padding: 0; margin: 0;}
.relevant {float: left; line-height: 30px; margin: 0 30px 10px 10px; font-size: 15px; color: #00abbd; width: 160px;}
.relevant input[type=checkbox] {margin: 0 10px 0 0; border-color: #00abbd;}

.myAccount {border-bottom: 1px solid #7ad3dd;}
.myAccount label{color: #fff;}
.myAccount h1 {color: #fff; font-size: 36px; font-weight: bold; line-height: 46px;}
.myAccount p {color: #fff; font-size: 18px; font-weight: normal; line-height: 28px;}
.myAccount h1 span{ font-size:18px; font-weight: normal;}
.myAccount h2 {color: #fff; font-size: 24px; font-weight: bold; line-height: 44px; margin-bottom: 20px; border-bottom: 1px solid #7ad3dd; margin-top: 20px;}

.saveChanges {display: block; float: right; margin: 5px 0 10px;}

.contact {line-height: 30px; margin: 0 30px 10px 10px; font-size: 15px; color: #00abbd;}
.contact input[type=checkbox] {margin: 0 10px 0 0; border-color: #00abbd;}
.contact.floatleft {float: left;}

a.register {float: right;}

.need-help2 {font-size: 22px; color: #fff; line-height: 42px;}

.user {background: url(../images/user.png) no-repeat 8px center #fff;}
.phone {background: url(../images/phone.png) no-repeat 8px center #fff;}
.calendar {background: url(../images/calendar.png) no-repeat 5px center #fff;}
.envelope {background: url(../images/envelope.png) no-repeat 5px center #fff;}
.card {background: url(../images/card.png) no-repeat 5px center #fff;}
.password {background: url(../images/password.png) no-repeat 5px center #fff;}
textarea.envelope {background: url(../images/envelope.png) no-repeat 5px 10px #fff;}
.cardnumber {height: 69px;}

.overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.7)}
.overlay > div {background: #fff; width: 580px; padding: 10px; margin: 30px 0 0 -290px; box-sizing:border-box; border-radius: 10px; box-shadow: 0 0 4px #777; position: absolute; left: 50%; top: 0;}
.loginForm {font-size: 0; line-height: 0; text-align: right;}
.loginForm label {width: 100%; line-height: 40px; font-size: 18px; color: #00abbd; font-weight: bold; display: block; text-align: left;}
.loginForm input {width: 100%; padding: 0 5px; margin: 0 0 20px; border: 1px solid #c2c2c2; font-family: inherit; font-size: 16px; line-height: 40px; box-sizing:border-box; text-align: left;}
.loginForm a {display: inline-block; margin: 5px; background: #ebebeb; border-radius: 5px; line-height: 40px; width: auto; padding: 0 20px; color: #404141; text-align: center; font-size: 16px; }
.loginForm a:first-of-type {padding: 0 0 0 30px; width: 100px; color: #fff; text-transform: uppercase; font-size: 18px; font-weight: bold; background: #8dc63f url(../images/login.png) no-repeat left 16px center;}
.loginForm a:last-of-type {margin-right: 0;}
.loginForm div {font-size: 16px; color: #990000; text-align: center; line-height: 40px; font-weight: bold;}

.alreadyMember {height: 100px; color: #fff; font-size: 20px; line-height: 26px; padding: 20px 0;}
.alreadyMember a{font-size: 16px; text-decoration:underline; display: block;}

.morefrom {background: #fff; padding: 20px 0; color: #00abbd; font-size: 18px; text-align: center;}
.morefrom img {display: block; margin: 20px auto;}

@media (min-width: 480px) {
	.mobile {display: none !important;}
}

@media (max-width: 479px) {
	.desktop {display: none !important;}
	
	.container_16 {
	  margin-left: auto;
	  margin-right: auto;
	  width: 320px;
	}
	.grid_1,
	.grid_2,
	.grid_3,
	.grid_4,
	.grid_5,
	.grid_6,
	.grid_7,
	.grid_8,
	.grid_9,
	.grid_10,
	.grid_11,
	.grid_12,
	.grid_13,
	.grid_14,
	.grid_15,
	.grid_16 {
	  margin-left: 5px;
	  margin-right: 5px;
	  width: 310px !important;
	}
	
	.grid_1 img,
	.grid_2 img,
	.grid_3 img,
	.grid_4 img,
	.grid_5 img,
	.grid_6 img,
	.grid_7 img,
	.grid_8 img,
	.grid_9 img,
	.grid_10 img,
	.grid_11 img,
	.grid_12 img,
	.grid_13 img,
	.grid_14 img,
	.grid_15 img,
	.grid_16 img {
		max-width: 100% !important;
		height: auto !important;
	}
	
	.alpha,
	.omega {
	  margin-left: 0;
	  margin-right: 0;
	}
	
	.prefix_1, .prefix_2, .prefix_3 { padding:0 !important;}
	
	a.registerButton {font-size: 15px; padding: 10px 0;}
	a.registerButton span {font-size: 24px;}
	
	.need-help {text-align: center; margin-bottom: 10px;}
	
	.signup > div:first-child {font-size: 24px; padding: 0 10px;}
	.signup > div:nth-child(2) {padding: 0 5px;}
	.signup > div:nth-child(2) > div {padding-left: 35px; font-size: 16px; padding-top: 5px;}
	.signup > div:nth-child(2) > div span {font-size: 14px;}
	.signup > div:nth-child(2) > div img {width: 26px; height: 26px; left:0;}
	.signup > div:nth-child(2) > div:first-child {line-height: 30px;}
	.signup > div:nth-child(2) > div:nth-child(4) {height: 70px;}
	.signup > div:nth-child(2) > div:nth-child(5) {line-height: 30px; height: 60px;}
	.signup > div:nth-child(3) {padding-left: 10px;}
	
	.registerHeader {font-size: 30px;}
	.registerHeader span {font-size: 18px;}
	.registerForm > .grid_5, .registerForm > .grid_7 {font-size: 16px; line-height: 40px;}
	
	.whiteback > div:first-child, .myAccount > form > div:nth-of-type(1) {float: none; width: 100%; padding:0;}
	.whiteback > div:nth-child(2), .myAccount > form > div:nth-of-type(2) {float: none; width: 100%; padding:0;}
	.myAccount > form > div:nth-of-type(2) .gender {display: none;}
	
	.relevant {width: 130px; margin: 0 0 10px 10px; font-size:12px;}
	.relevant:nth-child(2), .relevant:nth-child(5), .relevant:nth-child(7) {margin: 0 10px 10px 0;}
	
	.contact {margin: 10px; font-size: 12px;}
	.contact.floatleft {float: none;}
	a.register {float: none; margin: 10px auto; width: 201px; display: block;}
	
	.need-help2 {text-align: center; margin: 10px 0;}
	
	.overlay > div {width: 300px; margin-left: -150px;}	
	.loginForm a:first-of-type {display: block; margin: 10px auto;}
	.loginForm a:nth-of-type(2) {display: block; margin: 0 auto; float: left;}
	.loginForm a:nth-of-type(3) {display: block; margin: 0 auto; float: right; width: 80px;}
	
	
	.myAccount h1 span{display: block;}
	.myAccount p span:first-child {display: block; line-height: 40px; font-size: 24px;}
}
	.hidden {display: none;}