.user_points_table {
	 text-align: center !important;
 }
.user_points_table th{
	padding-right: 20px !important;
}
.user_points_table .chapter_titel {
	text-align: left !important;
}
.table_info{
	font-size: 12px;
	line-height: 1.2;
}
.table_info i{
	margin: 1px;
	font-size: 16px;
	color: #ea582a;
}
.solved {
	background-color: rgba(25, 135, 84, 0.70) !important;
}

.unsolved {
	background-color: rgba(255, 193, 7, 0.70) !important;
}

.not_unlocked {
	background-color: rgba(220, 53, 69, 0.70) !important;
}

.bg-color-orange {
	background-color: #ea562abf;
	color: white;
}
.struct_button {
	padding: 2px 6px !important;
	border: 1px solid #ea582a !important;
	background-color: white;
	color: #ea582a;
	font-weight: bold;
	text-decoration: none;
}

body, html {
	padding: 0px;
	margin: 0px;
	font-family: helvetica, arial, sans-serif !important;
	font-size: 14px;
	color: #333;
}
body{
	font-size: 14px !important;
}
html {
	overflow-y: scroll;
}

h1 {
	color: #444;
	font-size: 20px !important;
	font-weight: bold !important;
	line-heigt: 1.3 !important;
}

h2 {
	color: #444;
	font-size: 18px;
}

h3 {
	font-size: 14px !important;
	font-weight: bold !important;
	color: #333 !important;

}



dt {
	font-weight: bold;
}

a:active, a {
	outline: none;
}

:focus {
	-moz-outline-style: none;
}

:-moz-any-link:focus {
	outline: none;
}

a img {
	border: 0px;
}

.message td{
	padding:10px 30px 0px 0px;
}

.message td select , .width_300px{
	width: 300px;
}
.width_100px{
	width: 100px;
	text-align: center;
}


.clear {
	clear: both;
	height: 0px;
	margin: 0px;
	padding: 0px;
	width: 974px;
}

.inside {
	margin-top: 10px;
	margin-bottom: 10px;
	width: 964px;
	padding-left: 10px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	/*overflow: hidden;*/
}

.article {
	margin-top: 20px;
	padding-top: 10px;
	border-top: 1px solid #eee;
}

.infobox {
	display: none;
	border: 1px solid #333;
	padding: 5px;
	font-size: 12px;
}

.infobox h2 {
	margin-top: 0px;
	margin-bottom: 10px;
	padding: 0px;
}

.infobox p {
	padding-left: 20px;
	margin: 5px;
}

.infobox a {
	color: #000;
	font-weight: bold;
}

#header {
	/* background-image: url(../img/nav_bg.png); */
	background-position: bottom;
	background-repeat: repeat-x;
	background-color: #f7f7f7;
	/* border-top: 1px solid #ccc; */
	text-align: center;
	width: 100%;
	height: 95px;
	padding-top: 10px;
	overflow: hidden;
}

#header .inside {
	background-position: bottom;
	width: 974px;
	background-position: bottom;
	background-repeat: repeat-x;
}

#logo {
	float: left;
	margin-top: 0px;
}

#change_course {
	float: left;
}

#header h1 {
	float: left;
	margin-left: 80px;
	color: #444;
	margin-top: 10px;
	font-weight: normal;
}

#header a {
	color: #444;
	text-decoration: none;
	font-weight: bold;
}

#header a:hover {
	color: #777;
}

#form_course {
	width: 180px;
}

#menue {
	float: left;
	list-style: none;
	padding: 0px;
	margin: 0px;
}

#menue li {
	float: left;
	padding-top: 15px;
	margin-left: 20px;

}

.menue .act_pos {
	/* border-bottom: 1px solid #ea582a !important;*/
	color: #ea582a !important;
	font-weight: bold !important;
}

#user {
	float: right;
	border: 1px solid #ea582a;
	padding: 5px;
	margin-top: 8px;
}

#infobox_error h2 {
	color: darkred;
}

#infobox_notice h2 {
	color: #444;
}

#infobox_feedback h2 {
	color: #008000;
}

#content {
	clear: both;
	margin-top: 0px;
	text-align: center;
}

#content a {
	color: #ea582a;
	font-weight: bold;
	text-decoration: none;
}

#content .inside {
	margin-top: 0px;
	padding-top: 0px;
}

#content .fullscreen {
	text-align: left;
}

#loading_functions {
	width: 100%;
	height: 20px;
	margin: 0px;
	text-align: center;
}

#loading_functions span {
	display: none;
}

#wait_dialog {
	display: none;
}

.ui-widget-header {
	background-image: none;
	background-color: #ea582a;
}

#course_act {
	border: 1px solid #ddd;
	text-align: center;
	padding: 3px;
	font-size: 12px;
	margin-bottom: 20px;
}

#side_menue {
	width: 200px;
	float: left;
	padding: 0px;
	margin: 0px;
	overflow: hidden;

}

#side_menue hr {

	border: 1px solid #eee;
}

#sub_menue {
	padding: 0px;
	margin: 0px;
	list-style: none inside;
	margin-top: 15px;
}

#sub_menue a {
	color: #333;
	font-weight: normal;
}

#sub_menue li {
	padding-top: 10px;
	border-bottom: 1px solid #ddd;
	margin-bottom: 5px;
}

#sub_menue li:first-child {
	padding-top: 0px;
}

#support {
	margin-top: 50px;
	font-size: 12px;
}

#support a {
	font-weight: normal;
	color: #777;
}

#contact-persons {
	font-size: 12px;
}

#contact-persons h2 {
	margin-bottom: 10px;
}

#contact-persons .contact-person img{
	max-width: 100%;
	margin: 10px 0;
	border: 1px solid #eeeeee;
	padding: 2px;
}

#site_tips {
	margin-top: 50px;
	font-size: 12px;
}

#site_tips a {
	font-weight: normal;
	/*color: #333;*/
}

#site_tips ul {
	padding-left: 15px;
}

h3 {
	width: 100%;
	border-bottom: 1px solid #ddd;
}

#content_small {
	min-height: 600px;
	width: 720px;
	float: left;
	margin-left: 20px;
	border-left: 1px solid #ddd;
	padding-left: 20px;
	margin-bottom: 20px;
	overflow: visible;
	padding-bottom: 20px;
}

#content_small .advice {
	border: 1px solid #ea582a;
	margin: 20px;
	padding: 10px;
	background-color: #f7f7f7;
	margin-bottom: 40px;
}

#news {
	border: 1px solid #ea582a;
	margin: 20px;
	padding: 10px;
	background-color: #f7f7f7;
	margin-bottom: 40px;
}

#news h2 {
	margin: 0px;
	padding: 0px;
}

#login label {
	clear: left;
	float: left;
	width: 130px;
	margin-top: 20px;
}

#login input {
	float: left;
	margin-right: 30px;
	margin-top: 20px;
}

#login input[type="text"], #login input[type="password"] {
	width: 160px;
}

#login_logindata {
	clear: left;
	margin-left: 132px;
	padding-top: 15px;
}

#login_logindata a {
	font-size: 0.9em;
	color: #999;
}

.browser_advice {
	margin-top: 30px;
	padding: 10px;
	border: 1px solid #999;
	font-size: 14px;
}

#footer {
	clear: both;
	width: 100%;
	height: 30px;
	bottom: 0px;
	margin: 0px;
	margin-top: 40px;
	padding: 0px;
	text-align: center;
	font-size: 12px;
}

#footer .inside {
	border-top: 1px solid #ddd;
	padding-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

#change_course {
	margin-left: 40px;
	margin-top: 10px;
}

#footer a {
	color: #333;
	text-decoration: none;
}

/* ---------------------------------------------------------------------------*/
/* Notifications							      */
/* ---------------------------------------------------------------------------*/

#notifications {
	top: 20px;
	left: 50%;
	width: 400px;
	margin-left: -200px;
	background: #fff;
	background: -webkit-linear-gradient(#fff, #dbdbdb);
	background: -moz-linear-gradient(#fff, #dbdbdb);
	background-attachment: fixed;
	border-radius: 6px;
	-webkit-box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.5) 0px 4px 30px;
	-moz-box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.5) 0px 4px 30px;
	box-shadow: white 0px -1px 0px inset, rgba(0, 0, 0, 0.5) 0px 4px 30px;
	overflow: hidden;
	position: fixed;
	z-index: 9999;
	max-height: 529px;
	overflow-y: hidden;
	text-shadow: white 0px 1px 0px;
	font: normal 12px HelveticaNeue, Helvetica, Arial, sans-serif;
	-webkit-text-stroke: 1px transparent;
}

.notification {
	position: relative;
}

.notification.more {
	border-bottom: 1px solid #c1c1c1;
	-webkit-box-shadow: white 0px 1px 0px;
	-moz-box-shadow: white 0px 1px 0px;
	box-shadow: white 0px 1px 0px;
}

.notification.error {
	background: #fa565d;
	background: -webkit-linear-gradient(#fa565d, #d1363d);
	background: -moz-linear-gradient(#fa565d, #d1363d);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.notification.error * {
	color: white !important;
	text-shadow: rgba(0, 0, 0, 0.4) 0px 1px 1px !important;
}

.notification.error .left:after {
	background: rgba(255, 255, 255, 0.5) !important;
	box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 1px !important;
}

.notification.click {
	cursor: pointer;
}

.notification .hide, .modal .hide {
	position: absolute;
	display: block;
	right: 5px;
	top: 7px;
	cursor: pointer;
	color: white;
	font-weight: bold;
	width: 12px;
	height: 12px;
	background: url(/assets/default/extern/img/icon-close.png) no-repeat;
	opacity: 0.7;
	display: none;
	text-indent: -999px;
	overflow: hidden;
}

.modal .hide:before {
	position: relative;
	top: 3px;
}

.notification .hide:before, .modal .hide:before {
	content: "x";
}

.notification .hide:hover {
	opacity: 1;
}

.notification .right, .notification .left {
	width: 350px;
	height: 100%;
	float: left;
	position: relative;
}

.notification .time {
	font-size: 9px;
	position: relative;
}

.notification .right .time {
	margin-left: 10px;
	margin-top: -8px;
	margin-bottom: 10px;
	opacity: 0.4;
}

.notification .left {
	height: 100%;
	width: 30px;
	padding: 10px;
	position: absolute;
	padding-top: 0px;
	padding-bottom: 0px;
	overflow: hidden;
}

.notification .right {
	margin-left: 50px;
}

.notification .right .inner {
	padding: 10px;
}

.notification .left:after {
	content: '';
	background: #c1c1c1;
	-moz-box-shadow: white 1px 0px 0px;
	-webkit-box-shadow: white 1px 0px 0px;
	box-shadow: white 1px 0px 0px;
	width: 1px;
	height: 100%;
	position: absolute;
	top: 0px;
	right: 0px;
}

.notification .img {
	width: 30px;
	background-size: auto 100%;
	background-position: center;
	height: 30px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: rgba(255, 255, 255, 0.9) 0px -1px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 2px;
	-moz-box-shadow: rgba(255, 255, 255, 0.9) 0px -1px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 2px;
	box-shadow: rgba(255, 255, 255, 0.9) 0px -1px 0px inset, rgba(0, 0, 0, 0.2) 0px 1px 2px;
	border: 1px solid rgba(0, 0, 0, 0.55);
	position: absolute;
	top: 50%;
	margin-top: -15px;
}

.notification .img.border {
	box-shadow: none;
	border: none;
}

.notification .img.fill {
	top: 0px;
	margin: 0px;
	border: none;
	left: 0px;
	width: 100%;
	height: 100%;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 0px inset, black -1px 0px 16px inset;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 0px inset, black -1px 0px 16px inset;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 0px inset, black -1px 0px 16px inset;
	background-color: #333;
}

.notification:first-child .img.fill {
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
	border-top-left-radius: 5px;
}

.notification:last-child .img.fill {
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.notification .left > .icon {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	text-align: center;
	line-height: 50px;
	font: normal 40px/28px 'EntypoRegular';
	text-shadow: white 0px 1px 0px;
}

.notification.big .left > .icon {
	font-size: 60px;
	line-height: 38px;
}

.notification:after {
	content: ".";
	visibility: hidden;
	display: block;
	clear: both;
	height: 0;
	font-size: 0;
}

.notification h2 {
	font-size: 14px;
	margin: 0px;
}

.animated {
	-webkit-animation: 1s ease;
	-moz-animation: 1s ease;
	-ms-animation: 1s ease;
	-o-animation: 1s ease;
	animation: 1s ease;
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	-o-animation-fill-mode: both;
	animation-fill-mode: both;
}

.animated.fast {
	-webkit-animation-duration: 0.4s;
	-moz-animation-duration: 0.4s;
	-ms-animation-duration: 0.4s;
	-o-animation-duration: 0.4s;
	animation-duration: 0.4s;
}

@-webkit-keyframes fadeInLeftMiddle {
	0% {
		opacity: 0.5;
		-webkit-transform: translateX(-400px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInLeftMiddle {
	0% {
		opacity: 0.5;
		-moz-transform: translateX(-400px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-ms-keyframes fadeInLeftMiddle {
	0% {
		opacity: 0.5;
		-ms-transform: translateX(-400px);
	}

	100% {
		opacity: 1;
		-ms-transform: translateX(0);
	}
}

@-o-keyframes fadeInLeftMiddle {
	0% {
		opacity: 0.5;
		-o-transform: translateX(-400px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInLeftMiddle {
	0% {
		opacity: 0.5;
		transform: translateX(-400px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInLeftMiddle {
	-webkit-animation-name: fadeInLeftMiddle;
	-moz-animation-name: fadeInLeftMiddle;
	-ms-animation-name: fadeInLeftMiddle;
	-o-animation-name: fadeInLeftMiddle;
	animation-name: fadeInLeftMiddle;
}

@-webkit-keyframes flipInX {
	0% {
		-webkit-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
	}

	40% {
		-webkit-transform: perspective(400px) rotateX(-10deg);
	}

	70% {
		-webkit-transform: perspective(400px) rotateX(10deg);
	}

	100% {
		-webkit-transform: perspective(400px) rotateX(0deg);
		opacity: 1;
	}
}

@-moz-keyframes flipInX {
	0% {
		-moz-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
	}

	40% {
		-moz-transform: perspective(400px) rotateX(-10deg);
	}

	70% {
		-moz-transform: perspective(400px) rotateX(10deg);
	}

	100% {
		-moz-transform: perspective(400px) rotateX(0deg);
		opacity: 1;
	}
}

@-ms-keyframes flipInX {
	0% {
		-ms-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
	}

	40% {
		-ms-transform: perspective(400px) rotateX(-10deg);
	}

	70% {
		-ms-transform: perspective(400px) rotateX(10deg);
	}

	100% {
		-ms-transform: perspective(400px) rotateX(0deg);
		opacity: 1;
	}
}

@-o-keyframes flipInX {
	0% {
		-o-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
	}

	40% {
		-o-transform: perspective(400px) rotateX(-10deg);
	}

	70% {
		-o-transform: perspective(400px) rotateX(10deg);
	}

	100% {
		-o-transform: perspective(400px) rotateX(0deg);
		opacity: 1;
	}
}

@keyframes flipInX {
	0% {
		transform: perspective(400px) rotateX(90deg);
		opacity: 0;
	}

	40% {
		transform: perspective(400px) rotateX(-10deg);
	}

	70% {
		transform: perspective(400px) rotateX(10deg);
	}

	100% {
		transform: perspective(400px) rotateX(0deg);
		opacity: 1;
	}
}

.flipInX {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInX;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInX;
	-ms-backface-visibility: visible !important;
	-ms-animation-name: flipInX;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInX;
	backface-visibility: visible !important;
	animation-name: flipInX;
}

@font-face {
	font-family: 'EntypoRegular';
	src: url('/assets/default/glyphs/entypo-webfont.eot');
	src: url('/assets/default/glyphs/entypo-webfont.eot?#iefix') format('embedded-opentype'), url('/assets/default/glyphs/entypo-webfont.woff') format('woff'), url('/assets/default/glyphs/entypo-webfont.ttf') format('truetype'), url('/assets/default/glyphs/entypo-webfont.svg#EntypoRegular') format('svg');
	font-weight: normal;
	font-style: normal;

}

.mail_subject {
	margin-bottom: 20px;
	width: 545px;
}

.studycard-editor {
	width: 718px;
}

.studycard-preview-list {
	padding-left: 0px;
	border: 1px solid #111;
}

li.studycard-preview {
	list-style: none;
	border-bottom: 1px solid #111;
}

li.studycard-preview .title {
	padding: 7px;
	cursor: pointer;
}

li.studycard-preview.studycard_liOpen .title {
	border-bottom: 1px solid #111;
}

li.studycard-preview .content {
	display: none;
}

li.studycard-preview .front {
	border-bottom: 1px dashed #bbb;
	padding: 7px;
	padding-left: 26px;
}

li.studycard-preview .back {
	border-bottom: 1px solid #bbb;
	padding: 7px;
	padding-left: 26px;
}

li.studycard-preview .options {
	padding: 7px;
	padding-left: 26px;
}

.studycard-preview-list .studycard_expander {
	display: inline-block;
	margin-top: 2px;
}

.studycard-preview-list .struct_liClosed .studycard_expander {
	background: url("../img/struct_excol_closed.gif") no-repeat scroll 50% 50% transparent;
	height: 1em;
	width: 15px;
}

.studycard-preview-list .struct_liOpen .studycard_expander {
	background: url("../img/struct_excol_open.gif") no-repeat scroll 50% 50% transparent;
	height: 1em;
	width: 15px;
}

.pull-right {
	float: right;
}}

/* ---------------------------------------------------------------------------*/
/* Studycards					      */
/* ---------------------------------------------------------------------------*/

.study_cards_area .flipbox {
	text-align: left;
	font-size: 12px;
	line-height: initial;
	vertical-align: baseline;
	width: 500px;
	height: 357px;
	overflow: hidden;
	display: block;
	background: white;
	border: 1px dotted grey;
	margin: 0 0 10px 0;
	color: #333;
}

.study_cards_area .flipbox .studycard-header {
	padding: 10px;
}

.study_cards_area .flipbox .studycard-header .title {
	font-size: 16px;
	text-align: center;
}

.study_cards_area .flipbox .col-50 {
	width: 210px;
	display: inline-block;
}

.study_cards_area .flipbox .col-100 {
	width: 460px;
}

.study_cards_area .flipbox *[class^='col-'] {
	padding: 20px;
}

.study_cards_area .flipbox img {
	max-width: 100%;
}

.studycard_form *[id^='img-preview-'] {
	max-height: 100px;
	max-width: 100px;
	border: 1px dashed gray;
	margin: 0 20px;
}

.studycard_form *[id^='img-input-'] {
	display: none;
}

.studycard_form *[id^='img-delete-'] {
	display: none;
}

.clearer {
	clear: both;
}

.pull-left {
	float: left;
}

.pull-right {
	float: right;
}

div[aria-label="Insert link"] .mce-combobox > div
{
	display: none;
}

input[aria-label="Width"]
{

}

/* ---------------------------------------------------------------------------*/
/* modal_file_browser_style				      */
/* ---------------------------------------------------------------------------*/
.modal-dialog{
	margin-top: 10%;
}
.modal-title {
	margin-bottom: 0;
	line-height: 1.5;
	width: 100%;
	text-align: center;
}

.modal-body iframe{
	width: 100%;
	height: 400px;
	border: none;
}

/* ---------------------------------------------------------------------------*/
/* panel_styles			      */
/* ---------------------------------------------------------------------------*/


/* ---------------------------------------------------------------------------*/
/* upgrade html elements to bootstrap (small css fixes)			      */
/* ---------------------------------------------------------------------------*/


#login {
	width: 40%;
}

#loginSubmit {
	float: right;
	position: relative;
	top: -34px;
	left: 26px;
}

#change_course {
	width: 300px!important;
}

#create_course_button {
	position: relative;left: 18.8%;
}

#suchen_input {
	width: 200px!important;
}

.btn-primary {
	padding: .375rem .75rem!important;
	font-size: 1rem!important;
}

.create_chapter {
	width: 350px;
}


.pagination-user .page-item.active .page-link{
	color: white !important;
}
/* ---------------------------------------------------------------------------*/
/* upgrade html elements to bootstrap (small css fixes)			      */
/* ---------------------------------------------------------------------------*/

.loader_small {
	margin: auto;
	float: right;
	display: flex;
	border: 2px solid #f3f3f3; /* Light grey */
	border-top: 2px solid #3498db; /* Blue */
	border-radius: 50%;
	width: 16px;
	height: 16px;
	animation: spin 1s infinite;
}
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}