html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;
}
main {
	display: block;
}
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}
a {
	background-color: transparent;
	text-decoration: none;
}
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}
b,
strong {
	font-weight: bolder;
}
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}
small {
	font-size: 80%;
}
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
img {
	border-style: none;
}
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}
button,
input {
	overflow: visible;
}
button,
select {
	text-transform: none;
}
button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}
button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
	border-style: none;
	padding: 0;
}
button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
	outline: 1px dotted ButtonText;
}
fieldset {
	padding: 0.35em 0.75em 0.625em;
}
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}
progress {
	vertical-align: baseline;
}
textarea {
	overflow: auto;
}
[type='checkbox'],
[type='radio'] {
	box-sizing: border-box;
	padding: 0;
}
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
	height: auto;
}
[type='search'] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}
[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}
details {
	display: block;
}
summary {
	display: list-item;
}
template {
	display: none;
}
[hidden] {
	display: none;
}

/* Styles start from here */
body {
	background-color: #f0f4ff;
	background: url( './assets/arena.jpg' ) no-repeat center center fixed;
	background-size: cover;
	padding: 0;
	font-family: 'Montserrat', sans-serif;
	margin: 0;
}

button:focus,
[type='submit'] {
	outline: none;
}

button:focus,
input:focus {
	outline: 1px auto #005fcc;
}

button:not( .vocab-type ):not( .option-button ):not( .verb-table-option-button ),
[type='submit'] {
	background: #dacafa;
	border-color: #efe7ff #d3c2f7 #c1a2ff;
	cursor: pointer;
	outline: none;
	font-family: 'Roboto', sans-serif;
	border-width: 6px 12px 15px;
	border-style: solid;
	margin: 12px;
	color: #2d2a2a;
	box-shadow: 0 18px 26px rgba( 0, 0, 0, 0.1 );
	padding: 0 24px;
	font-size: 18px;
}

button:not( .vocab-type ):hover,
[type='submit']:hover {
	transform: scale( 1.06 );
}

button.has-selected {
	background: #e0ceb9;
}

button.vocab-type:focus {
	outline: none;
}

button.has-selected:hover {
	transform: none;
}

h3 {
	font-size: 1.2em;
}

li {
	margin-bottom: 8px;
}

.loading-screen {
	background: #ee6c4d;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 99999;
}

.loading-screen-wrapper {
	top: 40%;
	right: 50%;
	transform: translate( 50%, -50% );
	position: absolute;
	display: flex;
	flex-direction: column-reverse;
}

.loading-screen-wrapper img {
	width: 200px;
	background: #ec5c39;
	padding: 12px;
	border-radius: 42px;
	margin: 52px;
}

.loading-screen .progress-bar {
	max-width: 300px;
	right: 50%;
	border: 2px solid #1d395d;
	border-radius: 14px;
	transform: translateX( 50% );
	position: absolute;
	width: 100%;
}

.loading-screen .progress-bar .inner-progress {
	background: #3d5a80;
	transition: width 1.2s ease;
	animation: width-animation 1.2s;
	border-radius: 14px;
	width: 100%;
}

.loading-screen .no-script-message {
	color: #fff;
	font-size: 18px;
	text-align: center;
}

@keyframes width-animation {
	from {
		width: 0;
	}
	to {
		width: 100%;
	}
}

.row-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
}

.row-wrapper.is-collapsed {
	justify-content: flex-start;
}

.row-wrapper.is-collapsed .dropdown,
.select-verbs .is-collapsed .dropdown {
	-webkit-transform: rotate( 180deg );
	transform: rotate( 180deg );
}

.row-wrapper.is-collapsed .vocab-type {
	display: none;
}

.row-wrapper.is-collapsed .button-group {
	max-height: 0;
}

.select-verbs .indicative.is-collapsed .indicative-toggle-wrapper,
.select-verbs .subjunctive.is-collapsed .subjunctive-toggle-wrapper {
	display: none;
}

.is-gcseeduqas .book-5,
.is-clc .row-4 .vocab-type:last-of-type,
.is-gcseocr .miscellaneous-nouns,
.is-gcseocr .rare-verbs .vocab-type:nth-child( 4 ) {
	display: none;
}

.row-header {
	padding: 0;
	margin: 0;
	flex-shrink: 1;
	border: 0;
	box-shadow: none;
	background: #e9eaf1;
	border-bottom: #445ea0 2px solid;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	font-size: 14px;
	width: 200px;
	display: flex;
}

.row-header .dropdown {
	cursor: pointer;
	height: 34px;
	margin: auto 0;
}

.row-header p {
	margin-left: 16px;
}

.reveal-answer-button,
.start-declension-test-button,
.leaderboard-button {
	background: #facad7;
	border-color: #ffe7e8 #f7c2d6 #e89f9f;
	outline-color: #993359;
}

.submit-answer-button {
	background: #c9eec7;
	border-color: #b9deb7 #cae4c9 #a4c1a2;
	outline-color: #288c21;
}

.start-vocabulary-test-button {
	background: #e2d3ff;
	border-color: #c9bce2 #c2b1e6 #bf9fff;
	outline-color: #6a4ca7;
}

.start-vocab-options {
	display: flex;
	justify-content: space-between;
}

.vocab-type {
	background: 0;
	border: 0;
	text-align: left;
	width: 100%;
	cursor: pointer;
	line-height: normal;
	flex-grow: 1;
}

.vocab-type:last-of-type.has-selected {
	border-bottom-left-radius: 18px;
	border-bottom-right-radius: 18px;
}

.vocab-type p {
	margin-left: 12px;
}

.starting-warning,
.start-declensions-warning,
.start-verbs-warning,
.vocabulary-selection-warning {
	display: none;
	color: #ffe7e8;
	text-align: center;
	font-weight: 600;
}

.vocabulary-selection-warning {
	color: #b32d2e;
	font-size: 16px;
	margin-bottom: 0;
}

.start-button-wrapper.is-inactive {
	opacity: 0.7;
}

.start-button-wrapper.is-inactive button {
	pointer-events: none;
}

.start-button-wrapper.is-inactive img {
	pointer-events: none;
	animation: none;
}

.start-button-wrapper.is-inactive:hover + .starting-warning {
	display: block;
}

.start-button-wrapper {
	text-align: center;
}

.start-button-wrapper img {
	height: 80px;
	background: white;
	padding: 12px 24px;
	border-radius: 12px;
	cursor: pointer;
	animation: pulse 1.6s infinite;
}

.start-button-wrapper:not( .is-inactive ):hover img {
	transform: scale( 1.2 );
}

.selected-words-prompt {
	cursor: pointer;
	display: block;
	font-size: 12px;
	text-align: right;
	text-decoration: underline;
	margin-top: 12px;
}

.start-button-wrapper.is-inactive .selected-words-prompt {
	pointer-events: none;
}

.file-upload {
	font-size: 14px;
}

.file-upload input {
	margin: 0 12px;
	max-width: 100%;
}

.options-menu {
	display: flex;
	justify-content: flex-end;
}

.options-menu a {
	cursor: pointer;
	margin-right: 24px;
	background: #c1ceef;
	padding: 8px;
	font-size: 14px;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
}

.options-menu a:hover {
	text-decoration: none;
}

.options-menu .practise-options {
	align-items: baseline;
	display: flex;
	margin-right: auto;
	margin-left: 18px;
}

.options-menu .practise-options a {
	animation: pulse-orange 2s infinite;
	margin-right: 14px;
}

.options-menu .practise-options a,
.has-begun-vocab-test .options-menu a {
	background: #ee6c4d;
	color: #fff;
}

.options-menu .course-options {
	align-items: stretch;
	display: flex;
}

.select-all-option {
	cursor: pointer;
	margin-top: 14px;
	background: white;
	display: inline-block;
	float: right;
	padding: 8px 12px;
	border-radius: 8px;
	margin-left: 24px;
}

.select-all-option-mobile {
	margin-bottom: 14px;
	margin-top: 0;
	display: none;
	text-align: right;
	margin-right: 32px;
}

.is-alevelocr .alevelocrlink,
.is-literature .alevelocrlink,
.is-gcseeduqas .gcseeduqaslink,
.is-gcseocr .gcseocrlink,
.is-clc .clclink,
.is-custom-list .customlistlink {
	background: #1b2b63;
	color: white;
}

.customlistlink,
.select-all-option.literature-option,
.stages,
.literature-vocabulary,
.is-gcseeduqas .categories,
.is-clc .categories,
.is-custom-list .categories,
.is-literature .categories,
.custom-lists {
	display: none;
}

.is-gcseeduqas .stages,
.is-clc .stages,
.is-custom-list .custom-lists,
.is-literature .literature-vocabulary {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.is-alevelocr .select-all-option.literature-option,
.is-literature .select-all-option.literature-option {
	display: inline-block;
}

.literature-vocabulary {
	max-width: 920px;
}

.literature-vocabulary .row-wrapper {
	margin-bottom: 32px;
	width: 100%;
}

.john-taylor-vocabulary {
	display: flex;
	flex-direction: row;
}

.john-taylor-vocabulary .literature-heading {
	margin-right: 16px;
	width: 70%;
}

.john-taylor-vocabulary .button-group {
	margin: auto;
	height: 80%;
}

.john-taylor-vocabulary .vocab-type {
	text-align: center;
}

.john-taylor-vocabulary .button-group p {
	margin: auto;
}

.literature-vocabulary .row-wrapper:last-of-type {
	margin-bottom: 0;
}

.stages button {
	padding: 0 18px;
}

.stages .row-1 .vocab-type {
	line-height: 0.5;
}

.top-footer-toggle {
	background: #ee6c4d;
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
	box-shadow: 2px 2px #756865;
	cursor: pointer;
	display: none;
	height: 30px;
	position: fixed;
	width: 28px;
	left: 0;
	top: 0;
	z-index: 3;
}

.footer {
	display: flex;
	position: fixed;
	bottom: 0;
	width: 100%;
	background: #ee6c4d;
	overflow: hidden;
}

.hide-footer .footer {
	display: none;
}

.hide-footer .top-footer-toggle {
	display: block;
}

.footer-links {
	align-items: center;
	display: flex;
	margin: auto;
	margin-left: 12px;
}

.footer-links a {
	cursor: pointer;
	color: #fff;
	margin-right: 24px;
}

.footer img {
	border: 2px solid #fff;
	border-radius: 50%;
	margin: 12px 24px;
}

.gravatar {
	display: flex;
}

.gravatar p {
	font-size: 12px;
	margin: auto;
	color: #fff;
}

a:hover {
	text-decoration: underline;
}

.header {
	background: #1b2b63;
	color: #fff;
	padding: 28px;
	position: relative;
}

.heading {
	text-align: center;
}

.heading h1 {
	margin: 0;
}

.left-content {
	margin-right: 12px;
	width: 25%;
}

.main-content {
	align-items: flex-start;
	display: flex;
	margin: 20px;
	margin-bottom: 120px;
	margin-top: 30px;
	justify-content: space-evenly;
}

.hide-footer .main-content {
	margin-bottom: 12px;
}

.right-content {
	margin-right: 0;
}

.categories {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.button-group {
	display: inline-flex;
	flex-wrap: wrap;
	flex-direction: column;
	background: #fff;
	margin-right: 24px;
	width: 200px;
	margin-bottom: 24px;
	border-bottom-left-radius: 18px;
	border-bottom-right-radius: 18px;
	flex: 1;
}

.literature-vocabulary .button-group {
	border-radius: 12px;
	flex-direction: row;
	flex-wrap: nowrap;
	margin-right: 0;
	width: auto;
}

.literature-vocabulary .button-group .vocab-type:first-of-type.has-selected {
	border-radius: 0;
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}

.literature-vocabulary .button-group .vocab-type:last-of-type.has-selected {
	border-radius: 0;
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

.literature-vocabulary .john-taylor-vocabulary .vocab-type:nth-of-type( n ).has-selected {
	border-radius: 12px;
}

.literature-heading {
	background: #e9eaf1;
	border: 2px solid #455ea0;
	padding: 0 16px;
	margin-bottom: 4px;
}

.progress-bar,
.inner-progress {
	background: #c5c2c2;
	border-radius: 14px;
	display: inline-flex;
	height: 24px;
	width: 50%;
	margin: auto 0;
}

.progress-bar .inner-progress {
	background: rgb( 77, 205, 9 );
	background: linear-gradient( 90deg, rgb( 101, 212, 42 ) 36%, rgba( 81, 214, 10, 1 ) 92% );
}

.times-wrong,
.show-word-table-toggle {
	text-align: right;
	margin-right: 4px;
}

.show-word-table-toggle a:first-of-type {
	display: none;
	margin: auto;
	margin-left: 8px;
}

.show-word-table-toggle a {
	cursor: pointer;
	text-decoration: underline;
}

.declension-return-to-test-prompt {
	display: none;
	margin-top: 32px;
	text-align: right;
}

.declension-return-to-test-prompt a {
	cursor: pointer;
	text-decoration: underline;
}

.celebration {
	display: none;
}

.celebration h3,
.try-retest-prompt {
	text-align: center;
}

.try-retest-prompt.is-inactive {
	display: none;
}

.sidebar-prompt,
.sidebar-prompt:hover {
	color: #fff;
	cursor: pointer;
	text-decoration: underline;
}

.export-sidebar-prompt-wrapper {
	display: none;
	margin: auto;
	text-align: center;
}

.practise-prompt {
	margin: 0;
	margin-top: 14px;
	margin-left: 32px;
	font-size: 18px;
}

.practise-prompt a {
	cursor: pointer;
	text-decoration: underline;
}

.leaderboard-submit-name {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding-bottom: 24px;
}

.leaderboard-submit-name p {
	text-align: center;
}

.leaderboard-submit-name .compact-options .option-button {
	margin: 0;
}

.leaderboard-submit-name .option-button .laurel-image {
	height: 30px;
	margin-right: 12px;
}

.leaderboard-ineligible .leaderboard-submit-name {
	display: none;
}

.leaderboard-submit-name input {
	height: 45px;
	margin: auto 12px auto;
	max-width: 100%;
}

.leaderboard-button {
	margin: 0;
}

#competition-warning a {
	cursor: pointer;
	text-decoration: underline;
}

.countdown-clock-circle {
	display: none;
	position: relative;
	float: left;
	margin: auto;
}

.countdown-clock-circle h2 {
	text-align: center;
	position: absolute;
	line-height: 95px;
	font-size: 40px;
	width: 100%;
}

.countdown-clock-circle svg {
	-webkit-transform: rotate( -90deg );
	transform: rotate( -90deg );
}

.countdown-clock-circle-animation {
	stroke-dasharray: 440;
	stroke-dashoffset: 0;
	-webkit-transition: all 1s linear;
	transition: all 1s linear;
}

.competition-introduction {
	text-align: center;
}

.competition-countdown {
	font-size: 64px;
	font-weight: 600;
}

#vocab-tester-wrapper.time-ended .competition-countdown {
	font-size: 32px;
}

#competitive-mode,
#vocab-test-competition,
.competition-conclusion,
.leaderboard-wrapper,
.is-competitive-mode #practise-mode,
.is-competitive-mode .practise-declensions-link,
.is-competitive-mode .introductary-text,
.is-competitive-mode .start-button-wrapper,
.is-competitive-mode .start-button-wrapper-text,
.is-competitive-mode .test-settings-wrapper,
.is-competitive-mode .reveal-answer-button,
.is-competitive-mode .progress-bar,
.is-competitive-mode .times-wrong,
.is-competitive-mode .incorrect-words,
.is-competitive-mode #progress-indicator-set,
.is-competitive-mode #vocab-tester-wrapper.time-started .competition-introduction,
.is-competitive-mode #vocab-tester-wrapper #vocab-tester,
.is-competitive-mode .file-upload {
	display: none;
}

.is-competitive-mode #vocab-tester-wrapper.time-started #vocab-tester,
.is-competitive-mode #vocab-test-competition,
.is-competitive-mode:not( .has-begun-vocab-test ) .leaderboard-wrapper,
.is-competitive-mode.has-begun-vocab-test .time-ended .leaderboard-wrapper,
.is-competitive-mode #vocab-tester-wrapper.time-ended .competition-conclusion,
.is-competitive-mode #vocab-tester-wrapper:not( .time-ended ) .countdown-clock-circle {
	display: block;
}

.is-competitive-mode #competitive-mode,
.is-competitive-mode #vocab-test-competition {
	display: block;
	padding: 24px;
	font-size: 18px;
}

.is-competitive-mode .main-content {
	margin: 20px 52px;
}

.is-competitive-mode .main-content {
	align-items: flex-start;
	margin-bottom: 80px;
}

.is-competitive-mode.has-begun-vocab-test .left-content {
	display: flex;
	justify-content: center;
}

.is-competitive-mode .time-ended .left-content {
	display: block;
}

.is-competitive-mode .options-menu .practise-options,
.has-begun-declension-test:not( .is-competitive-mode ) .left-content .incorrect-words,
.has-begun-conjugation-test:not( .is-competitive-mode ) .left-content .incorrect-words,
.has-begun-declension-test .times-wrong,
.has-begun-conjugation-test .times-wrong,
.has-begun-declension-test .progress-bar,
.has-begun-conjugation-test .progress-bar,
.select-declensions-wrapper,
.select-verbs-wrapper,
#vocab-question-details,
.show-word-table-toggle,
.show-word-table-toggle a:first-of-type {
	display: none;
}

.has-begun-declension-test:not( .is-competitive-mode ) .left-content .select-declensions-wrapper,
.has-begun-conjugation-test:not( .is-competitive-mode ) .left-content .select-verbs-wrapper,
.has-begun-declension-test:not( .is-competitive-mode ) .show-word-table-toggle,
.has-begun-vocab-test .options-menu a:nth-of-type( 1 ),
.has-begun-conjugation-test #vocab-question-details,
.has-begun-declension-test #vocab-question-details,
#vocab-tester-wrapper.time-ended .show-word-table-toggle-competition,
.has-begun-declension-test #vocab-tester-wrapper.time-ended #word-table-prompt-competitive,
.has-begun-conjugation-test #vocab-tester-wrapper.time-ended #word-table-prompt-competitive,
.has-begun-conjugation-test:not( .is-competitive-mode ) .show-word-table-toggle a:first-of-type {
	display: block;
}

.has-begun-conjugation-test:not( .is-competitive-mode ) .show-word-table-toggle {
	display: flex;
}

.leaderboard-wrapper {
	text-align: left;
}

.select-declensions,
.select-verbs {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.select-declensions-wrapper h3,
.select-verbs-wrapper h3 {
	font-size: 16px;
}

.select-declensions .toggle input {
	margin-left: 8px;
}

.select-declensions .toggle.inset {
	margin-left: 12px;
}

.select-verbs .toggle input {
	margin-left: 10px;
}

.select-verbs-wrapper .verb-division {
	margin-top: 14px;
}

.select-declensions p {
	font-size: 14px;
}

.select-verbs p {
	font-size: 12px;
}

.select-declensions .toggle.inset p {
	font-size: 12px;
	margin-top: 8px;
	margin-bottom: 8px;
}

.select-declensions .toggle.neuter {
	margin-top: 24px;
}

.select-declensions .toggle.neuter p {
	font-size: 12px;
}

.select-verbs-wrapper .singular-only-option {
	margin-top: 24px;
	flex-direction: column;
}

.select-verbs-wrapper .singular-only-option p {
	font-size: 15px;
	line-height: 1.5;
	margin-bottom: 6px;
	text-align: center;
}

.select-verbs-wrapper .singular-only-option input {
	margin: auto;
}

.has-begun-conjugation-test .vocab-submit-answer-wrapper,
.has-begun-declension-test .vocab-submit-answer-wrapper {
	margin-top: 32px;
}

.vocab-submit-answer-wrapper input {
	max-width: 100%;
}

.show-word-table-toggle-competition {
	margin-top: 48px;
}

.submitted-grammar-info {
	display: none;
	padding: 16px;
	margin-top: 18px;
}

.submitted-grammar-info.is-active {
	display: flex;
}

.submitted-grammar-info img {
	background: #fff;
	border-radius: 12px;
	padding: 4px;
	margin-right: 18px;
	width: 80px;
}

.submitted-grammar-info p {
	background: #fff;
	border-radius: 8px;
	color: #000;
	padding: 12px;
	line-height: 1.5;
	margin: auto 0;
	text-align: center;
	width: auto;
}

.is-competitive-mode .submitted-grammar-info {
	border-top: 2px solid #1b2b63;
	margin-top: 0;
	padding: 24px 12px 0 12px;
}

.is-competitive-mode .submitted-grammar-info p {
	padding: 8px;
	width: 100%;
}

.valid-name-warning {
	display: none;
	color: #ffe7e8;
	text-align: center;
}

#vocab-submit-word-form {
	font-weight: 700;
	font-size: 21px;
}

#vocab-tester-wrapper.is-complete .celebration {
	display: block;
}

.has-begun-vocab-test #vocab-tester-wrapper {
	display: flex;
	align-items: stretch;
}

.has-begun-vocab-test #vocab-tester-wrapper .right-content {
	align-self: flex-start;
}

.has-begun-vocab-test .practise-prompt {
	display: none;
}

.vocab-submit-buttons {
	display: flex;
	justify-content: center;
	margin-top: 18px;
}

.has-begun-conjugation-test:not( .is-competitive-mode ) .right-content {
	align-self: flex-start;
}

#vocab-tester-wrapper {
	justify-content: normal;
}

#vocab-tester-wrapper .progress-bar {
	border-radius: 2px;
	margin-bottom: 12px;
	max-width: 400px;
}

#vocab-tester-wrapper .progress-bar .inner-progress {
	border-radius: 2px;
}

#vocab-tester-wrapper .left-content {
	margin-right: 32px;
	flex-shrink: 0;
	width: 20%;
}

.is-competitive-mode #vocab-tester-wrapper .left-content {
	min-width: 180px;
}

.is-displaying-word-table #vocab-tester-wrapper .left-content {
	min-width: 0;
}

.left-content,
#vocab-tester-wrapper .right-content,
.further-content {
	background: #445ea0;
	border-radius: 18px;
	box-shadow: 5px 5px #4d6bb7;
	color: #fff;
	padding: 12px;
}

#vocab-tester-wrapper .right-content {
	flex-shrink: 1;
	width: 100%;
}

.further-content {
	display: none;
	width: 50%;
	margin-left: 32px;
}

.further-content table,
.further-content th,
.further-content td {
	border: 1px solid #fff;
	border-collapse: collapse;
	color: #fff;
	margin: auto;
	text-align: center;
}

.further-content table {
	min-width: 350px;
	overflow: hidden;
}

.further-content td.is-highlighted {
	background-color: #ee6c4d;
	color: #fff;
}

.noun-table,
.verb-tables,
.verb-table,
.subjunctive-verb-table-toggle.toggle {
	display: none;
}

.has-begun-declension-test .noun-table,
.has-begun-conjugation-test .verb-tables,
.verb-table.is-active {
	display: block;
}

.is-custom-list #vocab-selector .left-content {
	width: 35%;
}

.noun-table {
	overflow: scroll;
}

.further-content td {
	padding: 12px;
}

.further-content th {
	padding: 8px;
}

.further-content table p {
	font-weight: normal;
}

.further-content td:first-of-type,
.further-content th {
	font-weight: 600;
}

.further-content #other-verbs-table td {
	font-weight: normal;
}

.further-content #other-verbs-table table {
	margin-bottom: 32px;
}

.show-enhanced-verb-table-prompt {
	cursor: pointer;
	display: none;
	margin-top: 24px;
	font-size: 18px;
	text-align: right;
	text-decoration: underline;
}

.has-begun-conjugation-test .show-enhanced-verb-table-prompt {
	display: block;
}

.word-table-select-wrapper.toggle {
	margin-top: 18px;
}

.verb-table-select-wrapper.toggle {
	margin-top: 0;
	margin-bottom: 18px;
}

.verb-table {
	overflow-x: auto;
}

.verb-table p {
	text-align: center;
	font-size: 16px;
	font-weight: 600;
}

.verb-table input {
	display: none;
	margin: auto;
}

.table-mode-prompt {
	display: none;
}

.further-content .verb-table p {
	font-weight: normal;
}

.verb-tables-heading {
	display: none;
}

.word-table-select-wrapper p {
	margin: auto 12px auto 0;
	font-size: 14px;
}

.word-table-select-wrapper select {
	font-size: 14px;
	width: 160px;
}

.verb-table-select-wrapper select {
	width: 240px;
}

.verb-selection-toggle {
	display: flex;
}

.verb-selection-toggle p {
	margin: auto;
}

.verb-selection-toggle .dropdown {
	cursor: pointer;
	width: 32px;
}

#vocab-question {
	font-size: 2em;
	margin-bottom: 12px;
}

#vocab-question-details,
#vocab-question-table-mode-details {
	border-bottom: 1px solid #fff;
	margin: 0;
	font-size: 14px;
	padding-bottom: 12px;
	text-align: center;
}

#vocab-question-table-mode-details,
#vocab-tester-wrapper.is-complete #vocab-tester,
#vocab-tester-wrapper,
.has-begun-vocab-test #vocab-selector {
	display: none;
}

.vocab-tester-wrapper {
	text-align: center;
}

.confetti {
	text-align: center;
}

.wrong-vocab-list {
	max-height: 220px;
	overflow-y: scroll;
}

.options-wrapper {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.option-button {
	background: #fff;
	padding: 48px;
	margin-left: 48px;
	border: 0;
	border-radius: 64px;
	cursor: pointer;
	box-shadow: 2px 3px #f5eeee;
	margin-bottom: 24px;
	outline: none;
}

.option-button p {
	text-align: center;
}

.option-button:hover {
	transform: scale( 1.1 );
}

.option-button img {
	display: flex;
	height: 180px;
	margin: auto;
}

.compact-options .option-button {
	border-radius: 6px;
	display: flex;
	padding: 8px 14px;
}

.compact-options .option-button img {
	height: 85px;
	margin-right: 12px;
}

.compact-options .option-button p {
	margin: auto;
}

.option-button.is-inactive {
	pointer-events: none;
	opacity: 0.7;
}

.curtain {
	-webkit-animation: curtain 1.4s infinite;
	animation: curtain 1.4s infinite;
	background: #ee6c4d;
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 9;
}

.curtain.is-not-triggered {
	display: none;
}

.curtain.is-triggered {
	-webkit-animation: curtain 2.3s forwards;
	animation: curtain 2.3s forwards;
}

.complete-actions {
	display: flex;
	justify-content: center;
	margin-top: 28px;
}

@keyframes curtain {
	0% {
		transform: none;
	}
	100% {
		transform: translateY( -100% );
	}
}

@keyframes pulse {
	0% {
		transform: scale( 0.95 );
		box-shadow: 0 0 0 0 rgba( 0, 0, 0, 0.7 );
	}

	70% {
		transform: scale( 1 );
		box-shadow: 0 0 0 10px rgba( 0, 0, 0, 0 );
	}

	100% {
		transform: scale( 0.95 );
		box-shadow: 0 0 0 0 rgba( 0, 0, 0, 0 );
	}
}

@keyframes pulse-orange {
	0% {
		transform: scale( 0.95 );
		box-shadow: 0 0 0 0 rgb( 238 108 77 / 0.7 );
		margin-top: -2px;
	}

	70% {
		transform: scale( 1 );
		box-shadow: 0 0 0 8px rgba( 0, 0, 0, 0 );
	}

	100% {
		transform: scale( 0.95 );
		box-shadow: 0 0 0 0 rgba( 0, 0, 0, 0 );
		margin-top: -2px;
	}
}

.test-settings-wrapper p {
	font-size: 13px;
}

.practise-declensions-link {
	flex: 1;
	margin: auto;
}

.close-settings {
	display: none;
	text-align: right;
	font-size: 14px;
}

.loading-screen .progress-bar {
	display: block;
}

.toggle {
	display: flex;
	margin: auto;
	justify-content: space-between;
}

.toggle input {
	margin: auto 0;
}

.difficulty-text {
	margin: auto 0;
	margin-right: 8px;
}

.toggle.extreme-difficulty {
	margin-top: 24px;
}

.extreme-difficulty .difficulty-text {
	margin: 0;
	margin-right: 12px;
}

.max-word-prompt {
	display: none;
	margin-bottom: 12px;
}

.configure-values {
	display: flex;
	align-items: center;
}

.configure-values input {
	margin: 4px;
	width: 30px;
}

.modal-wrapper {
	background: rgba( 0, 0, 0, 0.35 );
	display: none;
	overflow: scroll;
	padding-top: 50px;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

.modal-content {
	background: #fff;
	border-radius: 6px;
	padding: 20px;
	margin: auto;
	margin-bottom: 80px;
	width: 80%;
}

.modal-content h3 {
	border-bottom: 1px solid #50575e;
	font-size: 24px;
	margin: 0;
	padding-bottom: 14px;
	text-align: center;
}

.modal-content .close-icon {
	bottom: 12px;
	cursor: pointer;
	display: flex;
	margin: auto 0 -36px auto;
	position: relative;
	height: 36px;
	width: 36px;
}

.modal-content .close-icon:hover {
	transform: scale( 1.1 );
}

.vocabulary-selection-table th {
	text-align: left;
}

.vocabulary-selection-table {
	background: #fff;
	font-family: Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	width: 100%;
}

.vocabulary-selection-table-heading {
	display: flex;
}

.vocabulary-selection-table-heading p {
	margin: auto 0;
}

.vocabulary-selection-table-heading .dropdown {
	cursor: pointer;
	height: 24px;
	width: 24px;
}

.vocabulary-selection-table td,
.vocabulary-selection-table th {
	border: 1px solid #ddd;
	padding: 8px;
}

.vocabulary-selection-table tr:nth-child( even ) {
	background-color: #f6f7f7;
}

.vocabulary-selection-table th {
	background-color: #ee6c4d;
	color: white;
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: left;
	width: 40%;
}

.vocabulary-selection-table th:nth-of-type( 2 ) {
	width: 15%;
}

.vocabulary-selection-table th:nth-of-type( 3 ) {
	border-right: 0;
}

.vocabulary-selection-table th:last-of-type {
	border: 0;
	width: 5%;
}

.vocabulary-selection-table td:last-of-type {
	text-align: center;
}

.advanced-mode {
	display: none;
}

.advanced-mode p {
	font-size: 13px;
	margin-top: 8px;
}

.advanced-mode h3 {
	margin-bottom: 0;
}

.is-advanced-mode:not( .is-competitive-mode ) .advanced-mode,
.is-advanced-mode:not( .is-competitive-mode ) .customlistlink {
	display: block;
}

.trash-icon {
	background-image: url( './assets/trash.svg' );
	cursor: pointer;
	height: 24px;
	margin: auto;
	width: 24px;
}

.trash-icon:hover {
	background-image: url( './assets/trash-red.svg' );
}

.custom-category {
	display: flex;
}

.custom-category .trash-icon {
	margin-right: 8px;
}

.vocab-flashcards-wrapper,
.is-displaying-flashcards .vocab-tester-wrapper,
.is-displaying-flashcards #no-words-wrong,
.flashcard-settings {
	display: none;
}

.is-displaying-flashcards .flashcard-settings {
	display: block;
}

.is-displaying-flashcards .wrong-vocab-list a {
	cursor: pointer;
}

.is-displaying-flashcards .vocab-flashcards-wrapper {
	display: flex;
	flex-direction: column;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.is-displaying-flashcards #vocab-tester-wrapper .left-content {
	font-size: 14px;
	text-align: left;
}

.flashcard-container,
.front-flashcard,
.back-flashcard {
	width: 600px;
	height: 350px;
	cursor: pointer;
}

.front-flashcard,
.back-flashcard {
	background: #fff;
	border-radius: 4px;
	box-shadow: 0 16px 32px rgba( 0, 0, 0, 0.25 );
	color: black;
	text-align: center;
	font-size: 32px;
}

.flashcard-container {
	position: relative;
	margin: auto;
}
.front-flashcard,
.back-flashcard {
	display: flex;
	padding: 0 24px;
	position: absolute;
	top: 0;
	left: 0;
	backface-visibility: hidden;
	overflow: hidden;
	transition: transform 0.8s ease;
}

.flashcard-container p {
	margin: auto;
}

.front-flashcard {
	border-bottom: 4px solid #d66043;
}
.back-flashcard {
	transform: rotateY( 180deg );
}
.flashcard-container.is-flipped .front-flashcard {
	transform: rotateY( -180deg );
}
.flashcard-container.is-flipped .back-flashcard {
	transform: rotateY( 0deg );
}

.flashcard-settings-wrapper {
	display: flex;
	margin: 52px 14px 0;
}

.previous-list-flashcard-message {
	display: none;
	margin-top: 52px;
	font-size: 18px;
	text-align: center;
}

.previous-list-flashcard-message a {
	cursor: pointer;
	text-decoration: underline;
}

.vocab-flashcards-wrapper.is-saved-flashcard .previous-list-flashcard-message {
	display: block;
}

.vocab-flashcards-wrapper.is-saved-flashcard .flashcard-settings-wrapper {
	display: none;
}

.flashcard-counter {
	margin: auto 0;
}

.flashcard-arrows {
	margin-left: auto;
}

.flashcard-option-button {
	width: 32px;
	height: 32px;
	fill: #000;
	background: #fff;
	border-radius: 50%;
	margin-left: 14px;
	display: inline-block;
	cursor: pointer;
}

.flashcard-option-button.is-inactive {
	opacity: 0.4;
	pointer-events: none;
}

.flashcard-option-button:hover {
	background: #d7d7d7;
}

.flashcard-star-button {
	align-self: flex-end;
	cursor: pointer;
}

.flashcard-star-button svg {
	height: 42px;
	width: 42px;
	fill: #f0c930;
}

.flashcard-star-button.is-filled .star-gridicon,
.filled-star-gridicon {
	display: none;
}

.flashcard-star-button.is-filled .filled-star-gridicon {
	display: block;
}

.clear-sidebar-prompt-wrapper {
	display: none;
	margin: auto;
	text-align: center;
}

.flashcard-keyboard-shortcuts-guide.is-inactive {
	display: none;
}

.flashcard-links {
	cursor: pointer;
	display: flex;
	font-size: 12px;
	justify-content: space-evenly;
	margin-top: 18px;
	text-align: right;
	text-decoration: underline;
}

/* Switch styles mainly from w3schools */
.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	border-radius: 34px;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.slider:before {
	border-radius: 50%;
	position: absolute;
	content: '';
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: #fff;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

input:checked + .slider {
	background-color: #ee6c4d;
}

input:focus + .slider {
	box-shadow: 0 0 1px #ee6c4d;
}

input:checked + .slider:before {
	-webkit-transform: translateX( 26px );
	-ms-transform: translateX( 26px );
	transform: translateX( 26px );
}

.table-mode-menu {
	display: none;
	flex-direction: column;
	border: 1px solid #fff;
	border-radius: 4px;
	border-bottom: 0;
}

.verb-table-option-button {
	text-align: left;
	background: 0;
	border: 0;
	color: #fff;
	cursor: pointer;
	padding: 15px 14px;
	border-bottom: 1px solid #fff;
}

.verb-table-option-button:focus {
	outline: none;
}

.verb-table-option-button.is-selected {
	background: #ee6c4d;
	color: #fff;
	pointer-events: none;
}

.verb-table-option-button:first-of-type.is-selected {
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
}

.verb-table-option-button:last-of-type.is-selected {
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
}

button.verb-table-option-button:hover {
	transform: none;
}

#vocab-question-table-mode {
	display: none;
	font-size: 2em;
	font-weight: 600;
	margin: 10px auto;
	text-align: center;
}

.table-mode-options {
	display: none;
	justify-content: flex-end;
}

.table-mode-options a {
	cursor: pointer;
	margin-left: 24px;
	text-decoration: underline;
}

.table-mode-options a:first-of-type {
	margin: auto;
	margin-left: 8px;
}

.is-table-mode .verb-table-title,
.is-table-mode .right-content,
.is-table-mode .select-verbs,
.is-table-mode .verb-table-settings-inner,
.is-table-mode .word-table-select-wrapper,
.is-table-mode .show-enhanced-verb-table-prompt {
	display: none;
}

.is-table-mode .table-mode-menu,
.is-table-mode .table-mode-options {
	display: flex;
}

.is-table-mode .further-content {
	margin-right: 48px;
	width: 100%;
}

.is-table-mode .verb-table input,
.is-table-mode #vocab-question-table-mode,
.is-table-mode #vocab-question-table-mode-details,
.is-table-mode .table-mode-prompt {
	display: block;
}

.is-table-mode .verb-table table p {
	display: none;
}

.is-table-mode .verb-table.is-marked table p {
	display: block;
}

.is-table-mode .further-content td.is-highlighted {
	background: inherit;
}

.is-table-mode .further-content td.answer-correct {
	background: #008a00;
}

.is-table-mode .further-content td.answer-incorrect {
	background: #d63639;
}

.is-table-mode .further-content table {
	width: 50%;
}

.is-table-mode .further-content td.answer-incorrect p {
	display: flex;
	flex-direction: row;
}

.is-table-mode .further-content td.answer-incorrect span {
	margin-bottom: 12px;
	font-size: 11px;
	margin: auto;
	margin-left: 0;
	text-align: left;
}

.is-table-mode .verb-table.is-marked input {
	display: none;
}

.is-displaying-enhanced-word-table .verb-tables {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.is-displaying-enhanced-word-table .further-content {
	display: flex !important;
	flex-direction: column-reverse;
	width: 80%;
	margin: auto;
	margin-bottom: 40px;
}

.is-displaying-enhanced-word-table .word-table-select-wrapper select {
	width: auto;
}

.is-displaying-enhanced-word-table .left-content,
.is-displaying-enhanced-word-table.is-competitive-mode
	#vocab-tester-wrapper.main-content
	.left-content,
.is-displaying-enhanced-word-table .right-content {
	display: none;
}

.is-displaying-enhanced-word-table .further-content table {
	min-width: 0;
	margin-right: 24px;
	margin-bottom: 18px;
}

.is-displaying-enhanced-word-table #other-verbs-table {
	display: flex;
	flex-direction: column;
	margin-left: 32px;
}

.is-displaying-enhanced-word-table #other-verbs-table table {
	margin: auto;
	margin-bottom: 12px;
}

.is-displaying-enhanced-word-table .verb-table-settings {
	display: flex;
	flex-direction: column-reverse;
}

.is-displaying-enhanced-word-table .word-table-select-wrapper.toggle {
	margin-left: 0;
	margin-bottom: 12px;
}

.is-displaying-enhanced-word-table .declension-return-to-test-prompt {
	display: block;
	font-size: 24px;
	margin-top: 0;
	margin-bottom: 8px;
}

.is-displaying-enhanced-word-table .verb-table-select-wrapper.toggle,
.is-displaying-enhanced-word-table .show-enhanced-verb-table-prompt {
	display: none;
}

.is-displaying-enhanced-word-table .verb-table {
	display: block;
}

.is-displaying-enhanced-word-table .toggle {
	font-size: 14px;
	margin: 0;
	justify-content: end;
}

.is-displaying-enhanced-word-table .verb-table-settings-inner {
	display: flex;
	flex-wrap: wrap;
}

.is-displaying-enhanced-word-table .verb-table.suj,
.is-displaying-enhanced-word-table .is-displaying-subjunctives .verb-table:not( .suj ),
.is-displaying-enhanced-word-table .is-displaying-subjunctives #other-verbs-table {
	display: none;
}

.is-displaying-enhanced-word-table .is-displaying-subjunctives .verb-table.suj {
	display: block;
}

.is-displaying-enhanced-word-table .subjunctive-verb-table-toggle {
	display: flex;
	margin-top: 3px;
	margin-left: 32px;
}

.is-displaying-enhanced-word-table .subjunctive-verb-table-toggle input {
	margin-top: 0;
	margin-left: 8px;
}

.is-displaying-enhanced-word-table .verb-tables-heading {
	display: block;
	font-weight: 600;
	font-size: 34px;
	margin: auto;
	margin-top: 8px;
}

@media only screen and ( max-width: 1800px ) {
	.toggle input:checked + .slider:before {
		display: none;
	}
}

@media only screen and ( max-width: 1200px ) and ( min-width: 600px ) {
	.is-displaying-word-table .right-content {
		display: none;
	}

	.is-competitive-mode #vocab-tester-wrapper .left-content {
		font-size: 14px;
	}

	.further-content {
		align-self: flex-start;
		margin-left: 0;
		width: 100%;
	}

	.verb-table input {
		width: 100px;
	}

	.is-table-mode .further-content td.answer-incorrect p {
		flex-direction: column-reverse;
	}

	.declension-return-to-test-prompt {
		display: block;
	}

	.is-table-mode .declension-return-to-test-prompt {
		display: none;
	}

	.word-table-select-wrapper select {
		width: 50%;
	}
}

@media only screen and ( max-width: 1024px ) {
	.option-button {
		border-radius: 6px;
		margin-left: 12px;
		padding: 14px 24px;
	}

	.option-button img {
		max-width: 50%;
	}

	.right-content .literature-vocabulary {
		flex-wrap: nowrap;
	}

	.literature-vocabulary .row-wrapper {
		margin-right: 14px;
	}

	.literature-vocabulary .button-group {
		flex-wrap: wrap;
	}

	.literature-vocabulary .button-group .vocab-type:last-of-type.has-selected {
		border-radius: 0;
		border-bottom-right-radius: 12px;
		border-bottom-left-radius: 12px;
	}

	.literature-vocabulary .button-group .vocab-type:first-of-type.has-selected {
		border-radius: 0;
		border-top-left-radius: 12px;
		border-top-right-radius: 12px;
	}

	.select-declensions .toggle.neuter {
		margin-top: 4px;
	}

	/* This is a temporary quick-solution to be re-visited */
	.john-taylor-vocabulary {
		display: none;
	}

	.flashcard-container,
	.front-flashcard,
	.back-flashcard {
		width: 80%;
	}
}

@media only screen and ( max-width: 600px ) {
	#vocab-selector .left-content {
		width: auto;
		max-width: calc( 100% - 24px );
		margin: 0;
	}

	.select-all-option-mobile {
		display: block;
		position: absolute;
		right: 0;
		margin-right: 4px;
		margin-top: -48px;
	}

	.practise-prompt {
		font-size: 16px;
		margin-left: 0;
	}

	.select-all-option:last-of-type {
		margin-bottom: 12px;
	}

	.options-menu {
		align-items: flex-start;
	}

	.options-menu .practise-options {
		flex-direction: column;
		margin-left: 0;
	}

	.options-menu .practise-options a {
		animation: none;
		border-radius: 0;
	}

	.options-menu .practise-options a:first-of-type {
		border-bottom: 1px solid #d66043;
	}

	.options-menu a {
		margin-right: 4px;
		font-size: 12px;
	}

	.introductary-text,
	.gravatar p {
		display: none;
	}

	.gravatar img {
		height: 48px;
	}

	.footer-links a {
		margin-right: 12px;
		font-size: 12px;
	}

	.main-content {
		align-items: center;
		flex-direction: column-reverse;
		flex-wrap: wrap;
	}

	.option-button {
		margin-left: 0;
	}

	.option-button img {
		height: 50px;
	}

	.options-wrapper.compact-options .option-button {
		width: 100%;
	}

	.has-begun-vocab-test #vocab-tester-wrapper,
	.vocab-submit-buttons {
		flex-direction: column-reverse;
	}

	.is-competitive-mode .main-content {
		align-items: stretch;
		margin-bottom: 120px;
	}

	#vocab-tester-wrapper {
		margin-right: 0;
		margin-left: 0;
		flex-wrap: wrap;
	}

	#vocab-question-table-mode {
		font-size: 24px;
	}

	#vocab-tester-wrapper .left-content,
	#vocab-tester-wrapper .right-content,
	.further-content {
		margin: auto;
		text-align: center;
		width: 80%;
	}

	#vocab-tester-wrapper .right-content,
	.further-content {
		margin-bottom: 32px;
	}

	.further-content table {
		min-width: 0;
		font-size: 12px;
	}

	.vocabulary-selection-table {
		font-size: 12px;
	}

	.modal-content .close-icon {
		transform: none;
	}

	.is-table-mode .further-content td.answer-incorrect p {
		flex-direction: column-reverse;
	}

	.is-table-mode .further-content td.answer-incorrect span {
		margin-top: 6px;
	}

	.is-table-mode .further-content,
	.is-table-mode .left-content {
		margin-right: auto;
		margin-left: auto;
		width: 80%;
	}

	.is-displaying-enhanced-word-table .declension-return-to-test-prompt {
		margin-top: 18px;
		margin-bottom: 24px;
	}

	.is-displaying-enhanced-word-table .word-table-select-wrapper select {
		width: 120px;
	}

	.subjunctive-verb-table-toggle.toggle {
		margin-left: 0;
	}

	.word-table-select-wrapper select {
		width: 50%;
	}

	.right-content {
		order: 1;
	}
}

@media only screen and ( max-width: 480px ) {
	.heading h1 {
		font-size: 28px;
	}

	.options-menu a {
		border-radius: 0;
		font-size: 10px;
		margin-right: 2px;
	}

	.submitted-grammar-info img {
		display: none;
	}
}