.row-eq-height {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display:         flex;
}

.comment-text p,
.answer-html p {
	margin: 0;
	padding: 0;
}

.comment-box {
	font-size: 80%;
	background-color:white;
	border: solid 1px #0000001f;
	box-shadow: 0px 2px 3px 0px #0000000a;
	padding:8px;
	overflow:hidden;
	z-index:10;
	border-radius: 4px;
	overflow-wrap: break-word;
}

.comment-text p,
.answer-html p {
    display: block;
	min-height: 1.47rem !important;
}

html {
	font-size: 110%;
}

.comment-text {
	white-space: pre-wrap;
}

/* .container {
	position: relative;
} */

.cdx-input.cdx-quote__text {
	min-height: unset;
	background-color: #F9F5F1;
}

.cdx-input.cdx-question__points {
	width: 4rem;
	background-color: white;
}

mark {
	padding-left:0;
	padding-right:0;
}

.answer-form mark {
	/* background-color: #FBFBAB; */
	background-color: inherit;
}

.answer mark {
	background-color: hsla(60, 92%, 57%, 0.4);
}

.highlight-hover,
.answer-form mark.highlight-hover, 
.answer mark.highlight-hover {
	background-color: hsla(60, 92%, 57%, 1);
}

/* .answer-form mark {
	background: none;
	padding: 0;
	border-bottom: 0.07rem red solid;
} */

.comment-mark-del svg,
.comment-mark-edit svg {
	height: 1rem;
	fill: rgba(0,0,0,.5);
}



.comment-html:focus,
.answer-html:focus {
	outline: none;
}

#show-only-unrated-label,
#show-only-new-label {
	font-weight: 200 !important;
}

h2.card-title {
	font-size: 1.2rem;
}

.bg-light-yellow {
	background-color: rgb(255, 249, 228);
}

.custom-file-label.hide-button::after {
	visibility: hidden;
}

.custom-file-label {
	overflow: hidden;
}

.media-body {
	overflow: hidden;
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
	border-color: #798444;
	background-color: #95AD32;
}

* {
	font-family: 'Inter', sans-serif;
}

.answer-empty:not(:disabled),
.answer-empty:focus {
	background-color: rgb(255, 235, 235) !important;
	
}

.answer-filled:not(:disabled),
.answer-filled:focus {
	background-color: rgb(240, 248, 232) !important;
}

.blockquote {
    overflow-wrap: break-word;
	font-size: inherit;
	background-color: #F9F5F1;
    padding: 1rem;
}

.blockquote-footer {
    padding: 0;
	padding-top: 1rem;
	font-size: inherit;
}

#editorjs {
	display: block;
	width: 100%;
	padding: .375rem .75rem;
	border: 1px solid #ced4da;
	border-radius: .25rem;
}

hr {
	border-top: solid 2px hsla(57, 22%, 90%, 1);
	margin-top:2rem;
	margin-bottom:2rem;
}

.bg-transparent {
	background-color: transparent !important;
}

label {
	font-weight: 500;
}

.notify {
    border-left: 4px solid hsla(199, 76%, 31%, 1);
    background-color: hsla(199, 80%, 31%, 0.1);
}

.small-h2 {
	font-size: 1.4rem;
}

.badge.badge-warning a,
.badge.badge-warning {
    background-color: #ffd768;
    font-weight: 400;
    color: #37260c;
}

.share-label {
	font-weight: 400;
}

/* .noselect {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
} */

/* text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 4px 0px #00000017; */

.rating-form .custom-select {
	width: 6rem;
}
	
.answer-share .btn[type="submit"],
.pupil-page-overview .btn[type="submit"],
.rating-form .btn[type="submit"],
.answer-form .btn.user-store-answer,
.comment-form .btn[type="submit"] {
	display: none;
}

.pupil-edit-page .progress {
	height: 22px;
	margin: 8px 0;
}

.page-cards .progress {
	height: 16px;
	margin: 8px 0;
}

.page-cards .card-body {
	overflow: hidden;
	font-size: 0.6rem;
	position: relative;
}

.page-cards .card {
	height: 430px;
	margin: inherit;
}

.page-cards .col {
	overflow: hidden;
}

.card-body .media {
	padding: 4px !important;
}

.card-body .blockquote {
	padding: 8px;
}

.pupils-answers-wrapper {
	box-shadow: inset 0 3px 6px #00000024;
}

textarea.answer-filled:disabled {
	background-color: #F9F5F1;
	border-radius: 0;
	border: none;
}


.card-body .media a svg {
	width: 10px !important;
}

.comment-read-form {
	display: inline;
}

.comment-read-form button {
	padding: 0;
	margin: 0;
	border: none;
	color: #1F70A5;
}

.card-body .media-body {
	padding: 4px !important;
}

.card-body h3 {
	font-size: 0.9rem;
}

.card-body h4 {
	font-size: 0.8rem;
}

.card-body h5,
.card-body h6 {
	font-size: 0.6rem;
}

.progress .progress-bar .text {
	padding-left: 8px;
	padding-right: 8px;
	text-shadow: 0px 1px 1px #ffffff4d;
}

.progress .progress-bar {
	overflow: visible;
	color: black;
}

.border-4 {
    border-width:4px !important;
}

.image-tool__image-picture {
	width: 100%;
}

/* .badge-keyword:hover,
.badge-keyword {
    font-weight: 400;
    background-color: none;
    margin-right: 0.2rem;
    font-size: 0.7rem;
    color: #788a33;
    padding-left: 0;
} */

.card-footer .card-text small {
	font-size: 0.7rem;
}

.card-footer {
	line-height: 0.9rem;
}

.card-header,
.card-body,
.card-footer {
	padding: 0.70rem 0.95rem
}

.card-footer .keyword,
.card-footer .keyword a {
    font-weight: 400;
    background-color: none;
	font-size: 0.7rem;
	color: #788a33;
	padding: 0;
	margin: 0;
}

.card-footer .keyword:not(:last-child)::after {
	content: ", ";
}

@media (min-width: 1600px) {
	.row-cols-xl-4>* {
		flex: 0 0 20%;
    	max-width: 20%;
	}
}

@media (min-width: 1920px) {
	.row-cols-xl-4>* {
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}
}

.nav-item.active {
	font-weight: 500;
}

.logged-in-as {
	fill: rgba(0,0,0,.5);
}

.logged-in-as svg {
	width: 1.1rem;
    top: -0.05rem;
    position: relative;
}

@media (min-width: 400px) {
	img.with-background {
		max-width: 60%;
	}
	img.with-background-smaller {
		max-width: 30%;
	}
}

.bg-light,
p.bg-light,
.comment-display.bg-light {
	background-color: hsla(57, 22%, 95%, 1) !important;
}

/* .bottom-fadeout {
	position : relative;
}

.bottom-fadeout::after {
	content  : "";
	position : absolute;
	z-index  : 1;
	bottom   : 0;
	left     : 0;
	pointer-events   : none;
	background-image : linear-gradient(to bottom, 
					  rgba(255,255,255, 0), 
					  rgba(255,255,255, 1) 96%);
	width    : 100%;
	height   : 12rem;
}
 */


/**************/

.cdx-loader {
	border: 1px solid hsl(240, 3%, 79%);
}

.ce-settings__default-zone {
	background-color: white;
	border: 1px solid #eaeaea;
	border-radius: 4px;
	border-bottom-color: #d5d7db;
}

.ce-block h1.ce-header,
.ce-block h2.ce-header,
.ce-block h3.ce-header,
.ce-block h4.ce-header,
.ce-block h5.ce-header,
.ce-block h6.ce-header {
	padding-top: 0;
}

.cdx-block video {
	width: 100%;
}

.image-tool--withBorder .image-tool__image {
    border-width: 4px !important;
    border-radius: 0 !important;
}

.image-tool--withBackgroundSmaller .image-tool__image,
.image-tool--withBackground .image-tool__image {
		background: none !important;
}

image-tool__image-picture {
    margin-left: auto!important;
    margin-right: auto!important;
}

.cdx-input.cdx-question__number {
	border: none;
	background-color: initial;
	box-shadow: none;
}

.cdx-question__select_wrapper {
	width:240px;
	padding-left: 10px;
	padding-bottom: 0;
	padding-top: 4px;
}

.cdx-question::before {
	display: none;
}

.cdx-block.ce-delimiter::before {
	content  : "";
	display:block;
	border-top: solid 2px hsla(57, 22%, 90%, 1);
	height: 0;
}

.cdx-block.ce-delimiter {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.cdx-question__select_wrapper select {
	width: 110px;
	display: inline-block;
}

.cdx-question {
	margin-top: 0.4em;
	margin-bottom: 0.4em;
}

.ce-toolbar__settings-btn {
	width: 38px;
	height: 38px;
	background-color: #fff;
	border: 1px solid #eaeaea;
	border-radius: 4px;
}

.ce-settings__button {
	width: 38px;
	height: 38px;
}

.ce-settings {
	top: 38px;
	min-width: 130px;
}

.ce-toolbar__plus {
	left:-56px;
	background-color: #fff;
	border: 1px solid #eaeaea;
	width: 38px;
	height: 38px;
	border-radius: 4px;
}

.ce-toolbox__button {
	width: 38px;
	height: 38px;
}

.ce-toolbox.ce-toolbox--opened {
	background-color: #fff;
	border: 1px solid #eaeaea;
	border-radius: 4px;
}

.ce-toolbar__actions {
	right: -59px;
}

/* .image-tool__caption {
	display: none;
}
 */
/********************/

@media (min-width: 992px) {
	.container {
	    max-width: 720px;
	}
}

footer {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

footer p {
	margin-bottom: .25rem;
}

.btn-light:not(:disabled):not(.disabled):active,
.btn-light:not(:disabled):not(.disabled).active,
.show>.btn-light.dropdown-toggle {
	box-shadow: inset 0 0 12px -2px rgba(0, 0, 0, 0.31);
}

.savedBox {
	position: fixed;
    z-index: 10000;
    padding: 6px;
    left: 50%;
    margin-left: -100px;
    width: 200px;
    text-align: center;
	margin-top: 12px;
	bottom: 0;
}

@supports (-webkit-touch-callout: none) {
	.savedBox {
		bottom: inherit;
		top: 50%;
	}
}

#word-count {
	position: fixed;
	z-index: 10001;
	padding: 12px;
	right: 0;
	width: 100px;
	text-align:	center;
	bottom: 0;
}

#word-count .progress {
	margin: 0;
}

@supports (-webkit-touch-callout: none) {
	#word-count {
		position: absolute;
		z-index: 10001;
		padding: 0;
		padding-right: 12px;
		margin-top: -30px;
		bottom: unset;
		right: 0;
		width: 100px;
		text-align: center;
	}
}


.list-group-item {
	border-color: #DFDED2;
}

.btn-group.stretch-to-fill-width {
	display: flex;
}

.btn-group.stretch-to-fill-width .btn {
	flex: 1
}

nav.navbar.bg-light {
	background-color: #F2F1E0 !important;
	border-bottom: solid 4px #9DB342;
    box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.1) !important;
}


.navbar-brand{
	position: relative;
	padding-left: 70px;
	padding-top: 3px;
	font-weight: 500;
}

.navbar-brand img {
    width: 38px;
    top: -6px;
    height: auto;
    position: absolute;
    left: 15px;
    z-index: 1;
}

h1, h2, h3, h4, h5 {
	color: #3F2506 !important;
}

.btn-light:not(:disabled):not(.disabled):active,
.btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
	background-color: #95AD32 !important;
	color: white;
}

.btn-light:hover {
    background-color: #D2CF93;
    border-color: #F2F1E0;
}

body {
	background-color: #f9f9f1;
	color: #140C02;
	background-color: hsla(32, 40%, 96%, 1);
}

.btn-light {
    color: #140C02;
    background-color: #dfded22b;
	
}


a.btn-primary,
.btn-primary {
    color: white;
	border-color: #798444;
	background-color: #95AD32;
}

.btn-primary.focus,
.btn-primary:focus {
    color: white;
	border-color: #798444 !important;
	background-color: #798444 !important;
    box-shadow: 0 0 0 0.2rem rgba(193, 207, 125, 0.322) !important;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
/*     color: #fff;
    background-color: hsl(70, 32%, 39%);
	border-color: hsl(70, 32%, 39%); */
	background-color: #95AD32 !important;
	color: white;
	border-color: #d3d9df;
}

.btn-outline-primary {
    color: #617021;
	border-color: #617021;
	background-color: #fff;
}

.btn-outline-primary:hover {
    color: #fff;
    background-color:#C1CF7D;
	border-color: #617021;
}

.btn-primary:hover {
    color: #fff;
    background-color: #95AD32;
	border-color: #95AD32;
}

.btn-outline-primary:active {
    color: #fff;
    background-color:#C1CF7D !important;
    border-color: #C1CF7D !important;
}

.btn.btn-outline-primary:focus,
.btn.btn-outline-primary.focus,
.btn-sm.btn-outline-primary:focus,
.btn-sm.btn-outline-primary.focus {
		box-shadow: 0 0 0 0.2rem rgba(193, 207, 125, 0.322) !important;
}

.form-control:focus {
	box-shadow: 0 0 0 0.2rem rgba(193, 207, 125, 0.322) !important;
	border-color: #C1CF7D;
}

.btn.btn-link,
a {
	color: #1F70A5;
}

.form-control {
	border-color: #DFDED2;
}

.form-control,
.form-control:focus,
.form-control:active {
	color: #140C02;
}

.form-control::placeholder {
	color: #b2b1a3;
}

.card {
	border-color: #DFDED2;
}

.today-period-text .border-bottom {
	border-color: #DFDED2;
}

/* .container.bg-white {
	background-color: #FEFDFB !important;
}
 */
.btn-danger {
    color: #fff;
    background-color: #B44733;
    border-color: #B44733;
}

.border-top {
    border-top: 1px solid hsla(57, 14%, 89%, 1) !important;
}

.bg-success {
	background-color: #95AD32 !important;
}

.alert-success {
	color: white;
	background-color:#95AD32 !important;
	border-color: #95AD32 !important;
}

.alert-success a {
	color: white;
}

.alert-danger {
    color: white;
    background-color: #B44733;
	border-color: #B44733;
}

.alert-danger a {
	color: hsla(204, 87%, 92%, 1);
}

.navbar-toggler {
	padding: 0.25rem 0.30rem;
	color: white;
    border-color: #798444;
    background-color: #95AD32;
}

.navbar-light .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,<svg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'><path stroke='rgb(255, 255, 255)' stroke-width='2' stroke-linecap='' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/></svg>");
}

.navbar-collapse.collapsing ul.navbar-nav,
.navbar-collapse.show ul.navbar-nav {
	padding-top: 1.5em;
}


@media print {
	.container {
		page-break-after: always;
		max-width: none;
	}

	@media print {
		.mark-and-scoretable,
		.answer-with-comment-and-rating {
			page-break-inside: avoid;
		}
	}

	.container.shadow {
		box-shadow: none !important;
	}
}

.container.pupil-edit-page,
.container.exercise-view,
.container.edit-page,
.container.edit-page-header {
	/* overflow: hidden; */
	overflow: inherit;
}

header nav.navbar .navbar-brand {
	margin-right: 0;
}

@media (min-width: 400px) {
	header nav.navbar .navbar-brand {
		margin-right: 1rem;
	}
}

.card-due-today {
	border: 4px solid #ffd768;
}

.card-due-this-week {
	border: 4px solid #ffd76870;
}

.nav.nav-tabs {
	border: none;
}

.nav-tabs a.nav-link.active {
	border: none;
	background-color: #f2f5e6;
}


/* BEGIN: github.com/libhide/simplebox.js */

.cross {
	position: fixed;
	right: 0;
	top: 0;
	margin: 30px 55px 0 0;
	cursor: pointer;
	transition: 300ms all ease-in-out;
	z-index: 99;
	opacity: 1;
	will-change: transform;
}
.cross::after, .cross::before {
	position: absolute;
	content: '';
	width: 35px;
	height: 2px;
}
.cross::after {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.cross::before {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.cross--light::after, .cross--light::before {
	background-color: black;
}
.cross--dark::after, .cross--dark::before {
	background-color: white;
}

.lightbox-print {
	position: fixed;

	height: 30px;
	width: 30px;

    right: 23px;
    top: 60px;

	cursor: pointer;
	transition: 300ms all ease-in-out;
	z-index: 99;
	opacity: 1;
	will-change: transform;
	background-size: cover;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1000 1000' enable-background='new 0 0 1000 1000' xml:space='preserve'%3E%3Cmetadata%3E Svg Vector Icons : http://www.onlinewebfonts.com/icon %3C/metadata%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cpath d='M898.7,300.7H755.3V10H244.7v290.7H101.3c-27.3,0-49.4,22.1-49.4,49.4v349.3c0,27.3,22.1,49.4,49.4,49.4h112.8V668h30.6v322h510.6V668h30.6v80.8h112.8c27.3,0,49.4-22.1,49.4-49.4V350C948.1,322.8,926,300.7,898.7,300.7z M704.5,862L647,939.2H295.5V668h409V862z M704.5,300.7h-409V60.8h409V300.7z'/%3E%3Crect x='356.6' y='716.8' width='296.6' height='50.8'/%3E%3Crect x='356.6' y='820.6' width='296.6' height='50.8'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.slb {
	box-shadow: 2px 2px 12px 1px rgba(0, 0, 0, 0.2);
	cursor: -webkit-zoom-in;
	cursor: zoom-in;
}
.slb--invert {
	box-shadow: 2px 2px 12px 1px rgba(255, 255, 255, 0.3);
}
.slb--opened {
	cursor: auto;
}
.pop-in {
	-webkit-animation: pop-in 250ms;
	-moz-animation: pop-in 250ms;
	-ms-animation: pop-in 250ms;
}
.pop-out {
	-webkit-animation: pop-out 250ms;
	-moz-animation: pop-out 250ms;
	-ms-animation: pop-out 250ms;
}
#overlay {
	display: none;
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	pointer-events: none;
	cursor: pointer;
	will-change: transform;
	z-index: 1;
}
.center {
	max-height: 90%;
	max-width: 90%;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
@-webkit-keyframes pop-in {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
   }
	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
   }
}
@-webkit-keyframes pop-in {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
   }
	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
   }
}
@keyframes pop-in {
	0% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
   }
	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
   }
}
@-webkit-keyframes pop-out {
	0% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
   }
	100% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
   }
}
@keyframes pop-out {
	0% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
   }
	100% {
		opacity: 0;
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
   }
}

/* END: github.com/libhide/simplebox.js */

.edit-page img.img-fluid,
.pupil-edit-page img.img-fluid {
	cursor: pointer;
}



.pupil-edit-page .comment-display {
    box-shadow: inset 0px 1px 5px #00000012;
    margin-top: 0;
    margin-left: 2px;
    margin-right: 2px;
    border-bottom-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

.pupil-edit-page .answer-form,
.pupil-edit-page .answer-form .form-group {
	/* margin-bottom: 0 !important; */
}

.badge.predefined-answer {
	background-color: #f2f5f7;
	display: inline;
}

.predefined-answers {
	position: absolute;
    right: -290px;
	width: 240px;
	background-color: #ffffff;
}

.predefined-answers-wrapper {
    overflow: hidden;
}

.comment-form {
    position: relative;
}

.badge.predefined-answer a {
    background-color: unset;
    color: #1F70A5;
}

.page-wrapper {
	overflow: hidden;
}

.pupil-edit-page p {	
	overflow-wrap: break-word;
}

.prevent-overflow {
	overflow-wrap: break-word;
	word-break: break-word;
	overflow: hidden;
}

.form-control {
	font-size: inherit;
}


@media (max-width: 575px) {
	.points-table {
		overflow: scroll;
	}
	
	.points-table > .row {
		width: 575px;
	}
}


video {
	background-color: #f4ede3;
}