/* LOGIN */
	.login-screen {
		padding: 20px 0;
	}
	.login-forgot,
	.login-form {
		max-width: 500px;
	}
	.login-forgot input,
	.login-form input {
		border: 1px solid #afafaf;
	}
	.login-forgot .group.forgot,
	.login-form .group.forgot {
		margin-top: 20px;
	}
	.login-form .loginMessage {
		margin-top: 15px;
	}
	#login-forgot {
		display: none;
	}
	.show-forgot,
	.show-login {
		cursor: pointer;
		color: #bc442d;
	}
/* ^ LOGIN */
/* REGISTER */
	.register-screen {
		padding: 20px;
		background: #efefef;
	}
	.register-form input[type="text"] {
		border: 1px solid #999;
		background: #fff;
	}
	.register-form {
		max-width: 1400px;
	}
	.register-form .registerMessage {
		margin-top: 15px;
	}
/* ^ REGISTER */
/* PASSWORD */
	.xfamilyPassword button,
	.familyPassword input[type="text"],
	.familyPassword input[type="password"] {
		display: block;
		margin: auto auto;
		width: 100%;
		margin: 0px 0 20px;
		padding: 20px;
		border: none;
		border: 1px solid #eaeaea;
		padding-bottom: 1.25em;
		color: #000;
	}
	.familyPassword #passwordReq {
		margin-bottom: 20px;
	}
	.familyPassword #passwordReq li {
		color: red;
	}
	.familyPassword #passwordReq li.valid {
		color: green;
	}
	.familyPassword #password {
		margin-bottom: 5px;
	}
	.familyPassword .show {
		margin-bottom: 20px;
	}
	.familyPassword .show input {
		margin-right: 15px;
	}
	.xfamilyPassword .btn {
		display: inline-block;
		background: #1fb5bf;
		border: 1px solid darken(#1fb5bf, 5%);
		padding: 15px 20px;
		color: white;
		margin-right: .5em;
		box-shadow: inset 0px 1px 0px fadeout(white, 80%); 
		cursor: pointer;
		border-radius: 20px;
	}
	.familyPassword .view {
		font-size: 14px;
		color: #00afb8;
		text-align: center;
	}
/* ^ PASSWORD */
/* ACCOUNT */
	.familyFunction {
		width: 55%;
		margin-right: 5%;
	}
	.familyControls {
		width: 40%;
	}
	.familyClasses ul {
		margin: 10px 0 30px 25px;
	}
	.familyClasses .button {
		display: block;
		max-width: 350px;
		text-align: center;
	}
	.familyControlsWrapper  { }
	.familyControlsWrapper .familyControl  {
		margin: 20px 0 0px 0;
		border: 1px solid #000;
		background: #efefef;
		border-radius: 10px;
		padding: 20px;
		cursor: pointer;
		align-items: center;
	}
	.familyControlsWrapper .familyControl.active,
	.familyControlsWrapper .familyControl:hover  {
		-webkit-transition: all 0.25s ease;
		-moz-transition: all 0.25s ease;
		-o-transition: all 0.25s ease;
		transition: all 0.25s ease;
		background: #dfdfdf;
		border: 1px solid #bc442d;
	}
	.familyFunction .eventRegistered {
		margin: 10px 0;
		padding: 10px 0;
		border-top: 1px solid #e9e9e9;
	}
	.familyFunction .eventRegistered .registeredName {
		font-weight: bold;
	}
	
	.familyControlsWrapper .familyControl .familyControlTitle {
		font-weight: bold;
		margin-bottom: 15px;
	}
	.familyControlsWrapper .familyControl .familyControlLeft {
		width: 20%;
		text-align: center;
	}
	.familyControlsWrapper .familyControl .familyControlRight {
		width: 80%;
	}
	.familyControlsWrapper .familyControl .familyControlLeft i {
		color: #bc442d;
		font-size: 50px;
	}
/* ^ ACCOUNT */
/* EDIT PERSON */
	.editPerson {
		display: flex;
		flex-wrap: wrap;
		padding: 20px;
		border-bottom: 1px solid #999;
		border-top: 1px solid #999;
		margin: 20px 0;
	}
	.editPerson:nth-of-type(2) {
		background: #f9f9f9;
	}
	.editPerson .col input {
		padding: 5px 5px;
		margin: 0 5px;
		border: 1px solid #afafaf;
	}
	.editPerson .col input.required {
		border: 1px solid red;
	}
	.editPerson .personTitle {
		color: #bc442d;
		font-weight: bold;
		width: 100%;
		margin-bottom: 5px;
	}
	.editPerson .personForms li span {
		color: #999;
		font-size: 16px;
	}
	.editPerson .personName {
		color: #000;
		font-weight: bold;
		font-size: 21px;
		width: 100%;
		margin-bottom: 5px;
	}
	.editPerson .removePerson {
		float: right;
		color: #930000;
		font-size: 16px;
		margin-top: 10px;
		cursor: pointer;
	}
	.editPerson .lname,
	.editPerson .fname {
		width: 48%;
		margin-right: 2%;
		margin-bottom: 10px;
	}
	.editPerson .email,
	.editPerson .dob {
		width: 48%;
		margin-right: 2%;
	}
	.editPerson label {
		display: block;
		font-size: 19px;
		color: #666;
		margin-bottom: 3px;
		margin-left: 3px;
	}
	.personButtons {
		margin: 10px 0;
	}
	.personButtons .savePersons {
		background: #581195;
		color: #fff;
		text-align: center;
		cursor: pointer;
		padding: 8px 0;
	}
	.personButtons .addPerson {
		background: #9eb922;
		color: #fff;
		text-align: center;
		cursor: pointer;
		padding: 8px 0;
	}
	.personButtons .savePersons:hover {
		background: #350a5a;
		-webkit-transition: all 0.25s ease;
		-moz-transition: all 0.25s ease;
		-o-transition: all 0.25s ease;
		transition: all 0.25s ease;
	}
	.personButtons .addPerson:hover {
		background: #7a8f1a;
		-webkit-transition: all 0.25s ease;
		-moz-transition: all 0.25s ease;
		-o-transition: all 0.25s ease;
		transition: all 0.25s ease;
	}
/* ^ EDIT PERSON */
/* TOOLTIP */
	.tooltip{
		position: absolute;
		z-index: 999999;
		display: none;
		padding-top: 8px;
	}

	.tooltip-arrow{
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 8px solid #274D71;
		top: 0px;
		left: 50%;
		margin-left: -10px;
		position: absolute;
	}
	.tooltip-content{
		font-size: 12px;
		color: #fff;
		border: 1px solid #2b2b2b;
		background: #2b2b2b;
		line-height: 18px;
		border-radius: 3px;
		position: relative;
		min-width: 200px;
	}
	.tooltip-content *{
		color: #fff;
	}
	.tooltip-title{
		line-height: 32px;
		color: #fff;
		font-size: 14px;
		line-height: 2;
		padding-left: 8px;
		background: #01c0c8;
	}

	.tooltip-inner{
		padding: 15px 8px;
		min-width: 100px;
	}

	.tooltip-center .tooltip-arrow{
		left: 50%;
		margin-left: -10px;
	}


	/* down */
	.tooltip-down{
		padding-top: 0;
		padding-bottom: 8px;
	}
	.tooltip-down .tooltip-arrow{
		top: auto;
		bottom: 0;
		border-bottom: 0;
		border-top: 8px solid #2b2b2b;
	}


	/* right */
	.tooltip-right{
		padding: 0 8px 0 0;
	}
	.tooltip-right .tooltip-arrow{
		top: 50%;
		margin-top: -10px;
		left: auto;
		right: 0;
		border-right: 0;
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		border-left: 8px solid #2b2b2b;
	}


	/* left */
	.tooltip-left{
		padding: 0 0 0 8px;
	}
	.tooltip-left .tooltip-arrow{
		left: 0;
		top: 50%;
		margin-top: -10px;
		margin-left: 0;
		border-left: 0;
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		border-right: 8px solid #2b2b2b;
	}

/* ^ TOOLTIP */
/* FORM */
	.familyFormBlock {
		margin: 30px 0;
	}
	.familyFormBlock .form-after {
		display: none;
	}
/* ^ FORM */