﻿body {
	color: #333333;
	font-size: 14px;
	line-height: 1.5em;
	margin: 0;
	background-color: #F6F8FA
}

* {
	margin: 0;
}

.container {
	margin: 0;
	padding: 0;
	width: auto
}


.bf-container .tabbable {
	padding: 25px;
	/*margin-top: 10px;*/
}
.bf-label--primary {
	color: #4a4a4a;
	font-size: 13px;
}
.bf-label {
	font-family: Circular-Medium,Arial,Trebuchet MS,sans-serif;
	font-weight: 500;
}
.s-org-sign-in .custom-background-image {
	align-items: center;
	display: flex;
	background-position: center;
	background-size: cover;
	height: 100%;
	justify-content: center;
	width: 100%
}

	.s-org-sign-in .custom-background-image.bf-container {
		padding: 0
	}

.s-org-sign-in .center-container {
	align-items: center;
	display: flex;
	height: 100%;
	justify-content: center
}

.s-org-sign-in .s-sign-in-sign-up-container {
	background-color: white;
	box-shadow: 0 0 75px 0 rgba(221, 221, 221, 0.55);
	padding: 50px;
	width: 580px
}

@media only screen and (max-width: 766px) {
	.s-org-sign-in .s-sign-in-sign-up-container {
		margin: auto;
		max-height: 800px;
		overflow-y: auto;
		overflow-y: overlay;
		width: 500px
	}
}

@media only screen and (max-width: 579px) {
	.s-org-sign-in .s-sign-in-sign-up-container {
		box-shadow: none;
		padding: 20px;
		width: 100%
	}
}

.s-org-sign-in .s-sign-in-sign-up-container .user-fields-required {
	font-size: 14px
}

@media only screen and (max-width: 768px) {
	.s-org-sign-in .s-sign-in-sign-up-container .tabbable {
		min-width: 100%
	}
}

@media only screen and (max-width: 480px) {
	.s-org-sign-in .s-sign-in-sign-up-container .tabbable {
		padding: 0
	}
}

@media only screen and (max-width: 768px) {
	.s-org-sign-in .s-sign-in-sign-up-container .s-country-selector-sign-up {
		background-position-x: 96%;
		margin-bottom: 20px
	}
}

.s-org-sign-in .s-sign-in-sign-up-container select::-ms-expand {
	display: none
}

.s-org-sign-in .s-sign-in-sign-up-container .s-sign-in-signup-header {
	text-align: center
}

	.s-org-sign-in .s-sign-in-sign-up-container .s-sign-in-signup-header .s-logo-container {
		padding: 10px 0 30px;
		text-align: center;
		width: 100%
	}

		.s-org-sign-in .s-sign-in-sign-up-container .s-sign-in-signup-header .s-logo-container .s-logo {
			margin: auto;
			max-height: 100px;
			max-width: 250px;
			width: auto
		}

			.s-org-sign-in .s-sign-in-sign-up-container .s-sign-in-signup-header .s-logo-container .s-logo > a {
				display: inline-block
			}

		.s-org-sign-in .s-sign-in-sign-up-container .s-sign-in-signup-header .s-logo-container .client-logo {
			max-height: 100px;
			max-width: 100%
		}


.s-org-sign-in .s-signin-container .password-label-container {
	align-items: center;
	display: flex;
	justify-content: space-between;
	width: 100%
}

	.s-org-sign-in .s-signin-container .password-label-container > a {
		font-size: 13px;
		line-height: 21px
	}

.s-org-sign-in .s-signin-container form {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between
}

.s-org-sign-in .s-signin-container .bf-input {
	font-size: 14px;
	margin-bottom: 25px;
	width: 100%
}

.s-org-sign-in .s-signin-container input[type="submit"] {
	margin-top: 25px;
	padding: 15px 20px;
	width: auto !important
}

.s-org-sign-in .s-signin-container input[type="checkbox"] {
	margin-right: 10px
}

.s-org-sign-in .s-signin-container #saml-login input[type="submit"] {
	height: auto;
	line-height: 24px;
	margin: 0 auto;
	text-transform: inherit;
	white-space: normal
}

.s-org-sign-in .s-signin-container .form-input-group {
	width: 214px
}

@media only screen and (max-width: 768px) {
	.s-org-sign-in .s-signin-container .form-input-group {
		width: 100%
	}
}

.s-org-sign-in .s-signin-container .form-input-group > .bf-label {
	text-align: left;
	width: 100%
}

.s-org-sign-in .s-signin-container .info-checkbox {
	clear: both;
	display: flex;
	flex-direction: row
}

	.s-org-sign-in .s-signin-container .info-checkbox .marketing-optin {
		font-size: 14px
	}

@media only screen and (max-width: 480px) {
	.s-org-sign-in .s-signin-container .info-checkbox label {
		text-align: left;
		width: calc(100% - 30px)
	}

	.s-org-sign-in .s-signin-container .info-checkbox input[type="checkbox"] {
		vertical-align: top
	}
}

.s-org-sign-in .s-signin-container .s-organization-name {
	margin-top: 30px
}

.s-org-sign-in .s-signin-container .s-organization-slug {
	align-items: center;
	display: flex;
	justify-content: center
}

.s-org-sign-in .s-signin-container .s-half-width {
	display: inline-block;
	width: 50%
}

	.s-org-sign-in .s-signin-container .s-half-width p {
		color: #4a4a4a;
		font-size: 14px
	}

.s-org-sign-in .s-signin-container .s-signin-submit,
.s-org-sign-in .s-signin-container .s-sign-up-submit {
	text-align: center;
	width: 100%
}

.s-org-sign-in .s-footer-details {
	margin-top: 20px
}

	.s-org-sign-in .s-footer-details p {
		color: #4a4a4a;
		font-size: 14px
	}

		.s-org-sign-in .s-footer-details p:nth-of-type(2) {
			font-size: 12px;
			padding-top: 4px
		}

	.s-org-sign-in .s-footer-details a {
		font-size: 14px
	}

		.s-org-sign-in .s-footer-details a:hover {
			text-decoration: none
		}

.s-org-sign-in .s-password-character-min,
.s-org-sign-in .s-password-character-minimum {
	background: white;
	border-radius: 4px;
	box-shadow: 4px 4px 24px -2px #e6e6e6;
	color: #4a4a4a;
	display: none;
	padding: 10px 15px;
	position: absolute;
	width: 175px
}

	.s-org-sign-in .s-password-character-min:after,
	.s-org-sign-in .s-password-character-minimum:after {
		border-color: white transparent;
		border-style: solid;
		border-width: 15px 15px 0;
		bottom: -8px;
		content: "";
		left: 50px;
		position: absolute
	}

.link-to-login,
.link-to-saml-login {
	display: block;
	font-size: 14px;
	margin: 20px auto
}

.saml-signin-buttons > button {
	display: block !important;
	line-height: 26px !important;
	margin: 25px auto 20px auto;
	padding-left: 15px !important;
	padding-right: 15px !important
}

button.button,
input.button[type='submit'] {
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
	align-items: center;
	border: none;
	border-radius: 4px;
	color: white;
	display: inline-flex;
	font-family: "Circular-Book", "Arial", "Trebuchet MS", sans-serif;
	font-size: 14px;
	justify-content: center;
	line-height: 20px;
	min-width: 175px;
	padding: 15px 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-transform: capitalize
}



	button.button:hover,
	input.button[type='submit']:hover {
		cursor: pointer
	}

	button.button.primary,
	input.button.primary[type='submit'] {
		background-color: #4462c9
	}

		button.button.primary:focus,
		input.button.primary[type='submit']:focus {
			background-color: #1d3163
		}

		button.button.primary:hover,
		input.button.primary[type='submit']:hover {
			background-color: #1d3163
		}

.Select.bf-input--primary > .Select-control,
input[type=email].bf-input--primary,
input[type=password].bf-input--primary,
input[type=text].bf-input--primary,
textarea.bf-textarea--primary {
	background-color: #fff;
	border: 1px solid #cecece;
	border-radius: 6px;
	color: #4a4a4a;
	font-size: 16px;
	transition: border-color .2s ease-in 0s
}

.Select.bf-input > .Select-control, input[type=email].bf-input, input[type=number].bf-input, input[type=password].bf-input, input[type=search].bf-input, input[type=text].bf-input, input[type=url].bf-input, textarea.bf-textarea {
	font-family: Circular-Book,Arial,Trebuchet MS,sans-serif;
	height: 40px;
	margin: 0;
	padding: 5px 15px;
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}

.bf-container {
	background-color: #f8fafc;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
}

.text-danger {
	color: #ff4747 !important;
}
