@font-face {
	font-family: 'open_sauce_twoitalic';
	src: url('../fonts/opensaucetwo-italic-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-italic-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_twoextrabold';
	src: url('../fonts/opensaucetwo-extrabold-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-extrabold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_twomedium';
	src: url('../fonts/opensaucetwo-medium-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-medium-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_tworegular';
	src: url('../fonts/opensaucetwo-regular-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_twobold';
	src: url('../fonts/opensaucetwo-bold-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_twoblack';
	src: url('../fonts/opensaucetwo-black-webfont.woff2') format('woff2'), url('../fonts/opensaucetwo-black-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'open_sauce_sanslight';
	src: url('../fonts/opensaucesans-light-webfont.woff2') format('woff2'),
		url('../fonts/opensaucesans-light-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}


html, body {
	position: relative;
	width: 100%;
	height: 100%;
}

body {
	color: #333;
	padding: 0;
	background: #ecf0f4;
	margin: 0;
	box-sizing: border-box;
	font-family: 'open_sauce_tworegular';
}

a {
	color: rgb(0, 100, 200);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a:visited {
	color: rgb(0, 80, 160);
}

label {
	display: block;
}

input, button, select, textarea {
	font-family: inherit;
	font-size: inherit;
	-webkit-padding: 0.4em 0;
	padding: 0.4em;
	margin: 0 0 0.5em 0;
	box-sizing: border-box;
	border: 1px solid #ccc;
	border-radius: 2px;
}

input:disabled {
	color: #ccc;
}

button {
	color: #333;
	background-color: #f4f4f4;
	outline: none;
}

button:disabled {
	color: #999;
}

/*button:not(:disabled):active {
	background-color: #ddd;
}*/

button:focus {
	border-color: #666;
}

.user-heading {
	padding: 15px;
	text-align: center;
}

.capital-case {
	text-transform: capitalize;
}

.fixed-version {
	border-radius: 1em;
	font-family: 'open_sauce_tworegular';
	font-size: 14px;
	color: #FFF !important;
	background: #4d3fff;
	padding: 5px 10px;
	cursor: pointer;
	float: right;
	margin: 16px 20px 0 0;
	border-radius: 16px;
}

.fixed-version:hover {
	border-radius: 1em;
	color: #FFF;
	background: #4d3fff;
	border-radius: 16px;
	padding: 5px 10px;
	text-decoration: none;
	cursor: pointer;
}

.card-title {
	font-size: 20px;
	font-family: 'open_sauce_tworegular';
	letter-spacing: -0.29px;
	line-height: 24px;
	color: #202428;
	padding-top: 15px;
	font-weight: 400;
}

.form-holder label {
	color: #414750;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0;
}

.form-holder input {
	background-color: #ecf0f4 !important;
	border: none !important;
	border-radius: 6px;
	margin: 8px 0 0;
	height: 40px;
}

.btn-login {
	background-color: #474bff;
	font-family: 'open_sauce_tworegular';
	border: 1px solid #474bff;
	border-radius: 8px;
	font-size: 14px;
	width: 379px;
	height: 48px;
}

.btn-login .card-title {}

.btn-login:hover, .btn-login:focus {
	background-color: #474bff;
	border: 1px solid #474bff;
}

.btn-login:not(:disabled):not(.disabled).active, .btn-login:not(:disabled):not(.disabled):active, .show>.btn-login.dropdown-toggle {
	background-color: #474bff;
	border: 1px solid #474bff;
}

.card-holder {
	max-width: 379px;
}

.card-footer {
	padding: 1.09375rem 1.875rem;
	background-color: #fff;
	border-top: none;
	margin: 0 auto;
	text-align: center;
}

.btn-logout {
	background: transparent;
	font-family: 'open_sauce_twobold';
	color: #474bff;
	letter-spacing: 0;
	border: none;
	float: right;
	margin-top: 25px;
	margin-right: 48px;
	font-size: 14px;
	padding: 0;
}

.btn-logout:hover {
	background: transparent;
	color: #474bff;
	box-shadow: none;
}

.padding-0 {
	padding: 0 !important
}

.username {
	color: #272828;
	letter-spacing: 0;
	border: none;
	float: right;
	padding-top: 23px;
	margin-right: 32px;
	font-size: 14px;
}

.onelern-one {
	color: #00358e;
}

.logo-container {
	/*	margin-left: 30px;*/
}

.logo-container-height {
	height: 64px !important;
	border: none;
}

.border-none {
	border: none !important;
}

.page-title {
	padding: 20px 25px 10px 0 !important;
}

.book-name {
	font-size: 28px;
	font-family: 'open_sauce_tworegular';
	color: #272828;
	letter-spacing: -0.4px;
}

.books-container {
	/*padding: 0 25px;*/
}

.table-hr-bg {
	background-color: #dae0e9 !important;
	border-radius: 16px;
	height: 72px;
}

.next-icon {
	background: url(./images/ic-next.png);
	outline: none !important;
	border: none !important;
	width: 25px;
	height: 25px;
	position: relative;
	background-size: 100%;
	background-repeat: no-repeat;
	border: none;
	margin-bottom: 0;
}

.chapter-name {
	float: left;
	font-size: 18px;
	font-family: 'open_sauce_twomedium';
	letter-spacing: -0.4px;
	color: #414750;
	text-transform: uppercase;
	padding: 20px 0 20px 0;
}

.book {
	cursor: pointer;
}

/*{
	color: #11bce9;
}

{
	display: flex;
	justify-content: start;
	align-items: center;
}*/

.login-card {
	background-color: #fff;
	padding: 120px 0 100px 0;
	border: none;
	border-radius: 4;
	box-shadow: none;
}

.login-card .card-header, .login-card .card-footer {
	padding-top: 0;
}

.bg-white {
	background: #fff;
}

.chapters-table {
	border-radius: 16px;
	overflow: hidden;
	margin-bottom: 40px;
}

.chapters-table th {
	text-transform: uppercase;
	font-family: 'open_sauce_twomedium';
	font-size: 12px;
	letter-spacing: normal;
	color: #272828;
}

.chapters-table td {
	font-size: 16px;
	letter-spacing: normal;
	color: #393b45;
}

.chapters-table tbody tr:hover {
	background: #474bff;
}

.chapters-table tbody tr:hover td {
	color: #fff;
}

.chapters-table td, .chapters-table th {
	padding: 1.7em 0.75rem;
	text-align: left;
}

.login-card .card-body {
	padding-top: 22px;
}

.mt-32 {
	margin-top: 32px;
}

.login-card .form-control:focus {
	box-shadow: none;
}

.login-card .form-group {
	position: relative;
}

/* logo */

.logo-container {
	background-image: url("./images/logo_onelern.png");
	background-repeat: no-repeat;
	background-size: 100%;
	width: 36%;
	height: 34px;
	margin-left: 24px;
}