/* lwa */
.lwa{
	margin-bottom: 0;
}
.account-sign-in.lwa{
	margin-bottom: 16px;
}

/* Theme login modal - the "gt3-modal" template in plugins/login-with-ajax/.
   Login With Ajax ships its own overlay mechanics (fixed positioning, .active
   toggling) in templates/login-with-ajax.css using !important throughout, so
   the overrides below have to match that weight. */
.gt3-lwa-modal .lwa-modal-popup{
	box-sizing: border-box !important;
	align-items: stretch !important;
	max-width: 560px !important;
	min-height: 0 !important;
	padding: 50px 40px !important;
	border-radius: 8px !important;
}
.gt3-lwa-modal .lwa-modal-content{
	margin: 0 !important;
}
.gt3-lwa-modal .lwa-wrapper{
	width: 100%;
}
.gt3-lwa-modal .lwa-modal button,
.gt3-lwa-modal .lwa-modal a{
	transition: 0s !important;
    -webkit-transition: 0s !important;
    -moz-transition: 0s !important;
    -ms-transition: 0s !important;
}
.gt3-lwa-modal .lwa-modal form:hover button,
.gt3-lwa-modal .lwa-modal form:hover a{
	transition: 400ms !important;
    -webkit-transition: 400ms !important;
    -moz-transition: 400ms !important;
    -ms-transition: 400ms !important;
}
.gt3-lwa-modal .lwa-modal .lwa-register{
	margin-top: 0;
}

/* Close button. The lwa-close-modal class is what the plugin's JS binds to;
   lwa-modal-close is kept so the dynamic colour rule generated in
   core/registrator/css-js.php keeps painting the cross. */
.gt3-lwa-modal .lwa-close-modal{
	display: block;
	top: 18px !important;
	right: 18px !important;
	width: 20px;
	height: 20px;
	color: transparent !important;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
}
.lwa-modal-close:before,
.lwa-modal-close:after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	margin-left: -1px;
	width: 3px;
}
.lwa-modal-close:after{
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
}
.lwa-modal h3{
	text-align: center;
	margin-bottom: 30px;
}
.lwa-modal input.input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
}
.lwa-modal input.input{
	margin-bottom: 30px;
}
.lwa-modal .remember-me{
	text-align: left;
}
.lwa-modal .remember-me .remember-me-checkbox{
	margin-right: 10px;
}
.lwa-modal .remember-me label{
	vertical-align: middle;
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    font-size: 14px;
}
.lwa-modal .lost-password{
	text-align: right;
	font-size: 14px;
}
.lwa-submit-wrapper{
	margin-top: 30px;
	text-align: center;
}
.lwa-submit-wrapper button{
	min-width: 50%;
	margin-bottom: 5px;
}
.lwa-bottom-text{
	text-align: center;
	font-size: 14px;
}
.lwa-modal .cancel-button-wrapper{
	text-align: center;
}
.lwa-modal .cancel-button-wrapper a{
	color: #fd4851;
}
.lwa-modal .lwa-meta{
	text-align: center;
	font-size: 14px;
	margin-top: 30px;
}
/* Status pill. Matched against the plugin's own `.lwa span.lwa-status` rules,
   which are all !important, so these need the same specificity and weight. */
.lwa span.lwa-status,
.lwa-status{
	padding: 13px 25px !important;
	border-radius: 22px !important;
	border: none !important;
	margin-bottom: 15px !important;
}
.lwa span.lwa-status.lwa-status-confirm,
.lwa-status.lwa-status-confirm{
	background-color: #3ed376 !important;
	color: #ffffff !important;
}
.lwa span.lwa-status.lwa-status-invalid,
.lwa-status.lwa-status-invalid{
	background-color: #fd4851 !important;
	color: #ffffff !important;
}
.lwa-status a{
	color: inherit;
	text-decoration: underline;
}
@media only screen and (max-width: 600px){
	/* Below 40rem the plugin turns .lwa-modal-popup itself into a full-screen
	   fixed panel, so the modal is sized by the viewport rather than by us. */
	.gt3-lwa-modal .lwa-modal-popup{
		padding: 60px 20px 34px !important;
	}
	.gt3-lwa-modal .lwa-close-modal{
		top: 14px !important;
		right: 14px !important;
	}
	.lwa-modal h3{
		font-size: 24px;
		margin-bottom: 15px;
	}
	.lwa-modal input.input{
		margin-bottom: 20px;
	}
	.lwa-modal .lwa-meta{
		margin-top: 20px;
	}
	.lwa-modal .remember-me{
		text-align: center;
	}
	.lwa-modal .lost-password{
		text-align: center;
		margin-top: 10px;
	}
	.lwa-submit-wrapper{
		margin-top: 20px;
	}
	.gt3_header_builder__login-modal_footer{
		margin-top: 0;
		padding: 15px 20px;
		margin: 25px -20px -30px;
	}
}
