/*!
 * Copyright 2016-2022 GrammarSoft ApS <info@grammarsoft.com> at https://grammarsoft.com/
 * All Rights Reserved
 * Linguistic backend by Eckhard Bick <eckhard.bick@gmail.com>
 * Frontend by Tino Didriksen <mail@tinodidriksen.com>
 */

html, body {
	height: 100%;
	min-height: 500px;
	padding: 0;
	margin: 0;
	text-align: left;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.mce-branding-powered-by {
	display: none;
}

.btn-default {
	color: #333;
	background-color: #fff;
	border-color: #ccc;
}
.btn-success {
	background-color: #5cb85c;
	border-color: #4cae4c;
}
.btn-info {
	background-color: #5bc0de;
	border-color: #46b8da;
}
.btn-warning {
	color: #fff;
	background-color: #f0ad4e;
	border-color: #eea236;
}
.dropdown-menu > li > a {
	padding: 3px 20px;
}

pre {
	text-align: left;
}

label {
	display: inline;
	font-weight: normal;
}

ul {
	list-style-type: none;
}

a, h4 {
	color: #0a7fb9;
	text-decoration: none;
}

.center {
	text-align: center;
}
.prewrap {
	white-space: pre-wrap;
}
div.inline {
	display: inline-block;
}

#working, .working {
	position: absolute;
	z-index: 9999;
	color: #000;
	background: rgba(255, 255, 255, 0.75);
	text-align: center;
	font-size: 28px;
	line-height: 200px;
}
#working img, .working img {
	width: 28px;
	height: 28px;
}
#pprest-reply img {
	width: 40px;
	height: 40px;
}

#container {
	position: relative;
	min-height: 100%;
}

#warning {
	text-align: center;
	color: #a00;
}

#content, .pad-bottom {
	padding-bottom: 20px;
}

#headbar {
	height: 40px;
	width: 100%;
	background-color: #0a7fb9;
}

#footbar {
	position: absolute;
	height: 20px;
	width: 100%;
	bottom: 0;
	background-color: #0a7fb9;
}

#logo {
	color: white;
	font-size: 25px;
	text-align: center;
	font-weight: bold;
}
#logo-wrap {
	height: 40px;
	overflow: hidden;
}

#footer {
	text-align: right;
	font-size: 12px;
	color: white;
}
#footer a {
	margin-left: 1.5ex;
	color: white;
}

#welcome, #terms, #editor, #logo, #footer, div.alert {
	position: relative;
	margin: 0 auto;
	width: 960px;
}

#editor {
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 0;
	border-left: 1px solid rgba(0, 0, 0, 0.2);
	border-right: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 2px;
}

textarea {
	min-height: 70px;
	height: 100%;
	width: 100%;
}

.popover-content a *, .button *, h4 *, #logo * {
	vertical-align: middle;
	line-height: 20px;
}
#logo span {
	line-height: 32px;
	font-variant: small-caps;
}
#logo a {
	color: #fff;
	font-weight: bold;
}
#logo a.lang {
	color: #000;
}

#logo-back {
	display: inline-block;
	top: -20px;
	position: relative;
	background-color: #e57939;
}
#logo-back a {
	min-width: 200px;
	display: inline-block;
}
#logo-back-left, #logo-back-right {
	top: 20px;
	position: relative;
	display: inline-block;
	background-color: transparent;
	border: 40px solid transparent;
	width: 1px;
	height: 1px;
}
#logo-back-left {
	border-left-color: #0a7fb9;
}
#logo-back-right {
	border-right-color: #0a7fb9;
}

.icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 0.5ex;
}
#logo .icon {
	width: 32px;
	height: 32px;
	margin-right: 0;
}
.icon-logo {
	background: url('logo-sm.png');
}
.icon-check {
	background: url('check_comma_0020.png');
}
.icon-approve-all {
	background: url('approve_all_0020.png');
}
.icon-delete-all {
	background: url('delete_all_0020.png');
}
.icon-settings {
	background: url('settings_0020.png');
}
.icon-menu {
	background: url('menu_more_0020.png');
}
.icon-copy {
	background: url('copy_0020.png');
}
.icon-transfer {
	background: url('copy_0020.png');
}
.icon-ignore {
	background: url('ignore_rest_0020.png');
}
.icon-info {
	background: url('info_light_0020.png');
}
a:hover .icon-info {
	background: url('info_dark_0020.png');
}
.icon-inspire {
	background: url('education_light_0020.png');
}
a:hover .icon-inspire {
	background: url('education_dark_0020.png');
}
.icon-format {
	background: url('formatting_text_light_0020.png');
}
a:hover .icon-format {
	background: url('formatting_text_dark_0020.png');
}
a:hover .icon, .icon {
	background-repeat: no-repeat;
	background-size: 20px;
}
#logo .icon {
	background-size: 32px;
}

#ed-head, #ed-foot {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: stretch;
}

#btn-options-close {
	width: 100%;
}

.button {
	-webkit-box-flex: 1 1 auto;
	-moz-box-flex: 1 1 auto;
	-webkit-flex: 1 1 auto;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	display: inline-block;
	text-align: center;
	color: #fff;
	height: 35px;
	line-height: 35px;
	margin: auto;
	cursor: pointer;
}
#btn-check,#btn-correct-all,#btn-wrong-all {
	-webkit-box-flex: 3 1 auto;
	-moz-box-flex: 3 1 auto;
	-webkit-flex: 3 1 auto;
	-ms-flex: 3 1 auto;
	flex: 3 1 auto;
}
#btn-copy,#btn-transfer {
	-webkit-box-flex: 6 1 auto;
	-moz-box-flex: 6 1 auto;
	-webkit-flex: 6 1 auto;
	-ms-flex: 6 1 auto;
	flex: 6 1 auto;
}
.button * {
	text-align: center;
}
.button-small, .button-small * {
	line-height: 10px;
}
.button-small * {
	display: block;
	clear: both;
	margin: 0 auto;
}
.button-small .icon {
	margin-top: 3px;
}
.button-small .text {
	font-size: 8px;
}
.button-blue {
	background-color: #0a7fb9;
}
.button-blue:hover {
	background-color: #05405d;
}
.button-blue.disabled {
	background-color: #99cce3;
}

.button-green {
	background-color: #95c11f;
}
.button-green:hover {
	background-color: #486110;
}
.button-green.disabled {
	background-color: #d5e6a5;
}

.button-yellow {
	background-color: #f2af05;
}
.button-yellow:hover {
	background-color: #bf8a04;
}
.button-yellow.disabled {
	background-color: #fee19b;
}

.button-red {
	background-color: #e30613;
}
.button-red:hover {
	background-color: #72030a;
}
.button-red.disabled {
	background-color: #f49ba1;
}

.clicks .green {
	color: #486110;
}
.clicks .yellow {
	color: #bf8a04;
}
.clicks .red {
	color: #72030a;
}

.popover {
	max-width: 500px;
}
.popover a {
	white-space: nowrap;
}
.popover a span {
	font-size: 125%;
	margin-right: 1ex;
}

#login {
	position: absolute;
	font-size: 14px;
	right: 4px;
	top: 3px;
	margin-right: 0;
}
#login .button {
	line-height: 30px;
	padding-left: 1ex;
	padding-right: 1ex;
	height: 30px;
}

#welcome .container-fluid {
	margin-bottom: 25px;
}
.container-fluid {
	padding: 0;
}
.padme {
	padding-right: 25px;
}
#img-blue-rounded {
	background-color: #0a7fb9;
	border-radius: 4px;
	padding-top: 25px;
}
.example ul {
	padding-left: 10px;
	margin: 0;
}
.email {
	white-space: pre-wrap;
}

.my-2 {
	margin-top: 20px;
	margin-bottom: 20px;
}
#free {
	min-width: calc(100% - 100px);
}
.example a {
	font-weight: bold;
	text-decoration: underline;
	padding-left: 0.5ex;
	padding-right: 0.5ex;
	margin-left: 0.5ex;
	margin-right: 0.5ex;
	display: inline-block;
}
.comma-red {
	color: #c12e2a;
	border: 1px dotted #c12e2a;
}
.comma-yellow {
	color: #eb9316;
	border: 1px dotted #eb9316;
}
.comma-info {
	color: #414196;
	border: 1px dotted #414196;
}
.comma-green {
	color: #419641;
	border: 1px dotted #419641;
}
.example .comma {
	margin-top: 5px;
	margin-bottom: 20px;
	position: relative;
	display: inline-block;
	color: #419641;
	border: 0;
}
.example .comma-red {
	color: #964141;
}
.example .comma-yellow {
	color: #969641;
}
.example .comma-blue {
	color: #419696;
}
.example .comma-above {
	margin-top: 25px;
	margin-bottom: 5px;
}
.comma .arrow-down {
	position: absolute;
	top: -3px;
	left: calc(50% - 5px);
	height: 0;
	width: 0;
	border-top: 6px solid #419641;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
}
.comma-red .arrow-down {
	border-top: 6px solid #964141;
}
.comma-yellow .arrow-down {
	border-top: 6px solid #969641;
}
.arrow-down .arrow-down-inner {
	position: relative;
	top: -7px;
	left: -6px;
	height: 0;
	width: 0;
	border-top: 6px solid #f5f5f5;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
}
.comma .text-above {
	top: -23px;
	left: -50px;
}

.comma .arrow-up {
	position: absolute;
	bottom: -3px;
	left: calc(50% - 5px);
	height: 0;
	width: 0;
	border-bottom: 6px solid #419641;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
}
.comma-red .arrow-up {
	border-bottom: 6px solid #964141;
}
.comma-yellow .arrow-up {
	border-bottom: 6px solid #969641;
}
.arrow-up .arrow-up-inner {
	position: relative;
	bottom: -1px;
	left: -6px;
	height: 0;
	width: 0;
	border-bottom: 6px solid #f5f5f5;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
}
.comma .text-below {
	top: 23px;
	left: -50px;
}

.comma .text-wide {
	left: -75px;
}

.comma .text-above, .comma .text-below {
	font-size: 75%;
	font-style: italic;
	white-space: nowrap;
	position: absolute;
}

.comma .text {
	left: 10px;
}

.tight li + li {
	border-top: 1px solid #ccc;
}

#tts_popup {
	position: fixed;
	bottom: 20px;
	margin-left: -25%;
	left: 50%;
	width: 50%;
	z-index: 5000;
}

#transfer {
	display: none;
}

.modal-body iframe {
	border: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	min-height: 70vh;
}

:target {
	background-color: #ddd;
	color: #000;
}

@media (max-width: 767px) {
	#img-blue-rounded {
		display: none;
	}
	#logo-back a {
		min-width: 0;
	}
}

@media (min-width: 768px) {
	.modal-dialog {
		max-width: 700px;
	}
}

@media (max-width: 959px) {
	#welcome, #terms, #editor, #logo, #footer, div.alert {
		width: 100%;
		min-width: 250px;
		padding-left: 5px;
		padding-right: 5px;
	}
	#logo {
		text-align: left;
		left: -5px;
	}
	#logo-back-left {
		border: 0;
	}
	#ed-head, #ed-foot {
		flex-wrap: wrap;
	}
}

@media	only screen and (-webkit-min-device-pixel-ratio: 1.3),
  only screen and (-o-min-device-pixel-ratio: 13/10),
  only screen and (min-resolution: 120dpi) {
	.icon-logo {
		background-image: url('logo-lg.png');
	}
	.icon-check {
		background-image: url('check_comma_0060.png');
	}
	.icon-approve-all {
		background-image: url('approve_all_0060.png');
	}
	.icon-delete-all {
		background-image: url('delete_all_0060.png');
	}
	.icon-settings {
		background-image: url('settings_0060.png');
	}
	.icon-menu {
		background-image: url('menu_more_0060.png');
	}
	.icon-copy {
		background-image: url('copy_0060.png');
	}
	.icon-transfer {
		background-image: url('copy_0060.png');
	}
	.icon-ignore {
		background-image: url('ignore_rest_0060.png');
	}
	.icon-info {
		background-image: url('info_light_0060.png');
	}
	a:hover .icon-info {
		background-image: url('info_dark_0060.png');
	}
	.icon-inspire {
		background-image: url('education_light_0060.png');
	}
	a:hover .icon-inspire {
		background-image: url('education_dark_0060.png');
	}
	.icon-format {
		background-image: url('formatting_text_light_0060.png');
	}
	a:hover .icon-format {
		background-image: url('formatting_text_dark_0060.png');
	}
	a:hover .icon, .icon {
		background-repeat: no-repeat;
		background-size: 20px;
	}
	#logo .icon {
		background-size: 32px;
	}
}
