/*------------------------------------------------
CSS for diksionariu.com / diksionario.com
v.042, 2025/02/06

Main organization of diksionariu.com:
body
	#ribbon
	#search-container
	{#main-page-block	}  show one of these two
	{#results-container	}
	#footer
	
CSS Contents:
 ** Color Variables **
	
 ** Global Things **
 ** Templates **

 ** Top Ribbon **
 ** Search Bar **
 ** Under Search Bar ** <-not used at moment, slow
 ** Footer Links **

 ** Main Block **
 ** Results Block **
	** Partial Matches **
	** Fuzzy Search **
	** Morphology **
	** Hover Preview Popup **
 
 ** Advanced Search Page **
 ** WOTD Page **
 
 ** Mobile Formatting **
 ** Dark Mode Colors **
------------------------------------------------*/

/******* Color Variables *******/
:root {
	--diksionariu_main: #3f008b;		/* dark purple */
	--diksionariu_lighter: #a08abb;		/* lilac */
	--diksionariu_highlight: #e3e1ff;	/* light purple */
	--background_white: white;
	--page_background_black: black;
	--text_black: black;
	--text_white: white;
	--text_bold: black;
	--text_button: white;
	--text_error: #900;				/* medium red */
	--text_minor_gray: #444;		/* dark gray */
	--non_active_gray: #999;		/* medium gray */
	--text_redirect_gray: #666;		/* medium-dark gray */
	--placeholder_gray: gray;	
	--trim_white: white;
	--block_light_gray: #eee;		/* very light gray */
	--block_med_gray: #d3d3d3;		/* light gray - image borders on main */
	--block_dark_gray: #bbb;		/* medium light gray */
	--block_gray_text: gray;
	--block_wotd_gray: #f7f7f7;		/* very very light gray */
	--block_wotd_border: #aaa;		/* medium gray */
	--visited_link: darkblue;
	--markup_link: #6a0eb6;			/* brighter purple */
	--markup_external: darkblue;
	--search_bar_english: #e0e1ef;	/* gray purple */
	--multiple_view_hover: aliceblue;
	--multiple_view_original: dodgerblue;
	--horizontal_separator: silver;
	--fuzzy_bar_color: #3f008b;		/* same as diksionariu_main */
	--fuzzy_bar_gray: #ddd;			/* fairly light gray */
	--drop_shadow_gray: #0007;		/* half-transparent black */
}


/****** Global Things *******/
* {
	font-family: sans-serif;
	box-sizing: border-box;
	overflow-wrap: break-word;
	word-wrap: break-word;
}
html {
	scroll-behavior: smooth;
	background-color: var(--page_background_black);
	height: 100%;
	width: 100%;
}
body {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	min-width: 310px;	/* minimum width of popup + 5px margin */
}
.underbody {
	z-index: -1;
	position: fixed;
	height: 100%;
	width: 100%;
	background: linear-gradient(var(--diksionariu_main) 40%, var(--page_background_black) 40%);
}
.content {
	max-width: clamp(700px, 85%, 1000px);
	margin: auto;
}
.content .content {
	max-width: 100%;
}
.container {
	margin:0;
	padding: 2em;
}
.container > div {
	margin-bottom: 1em;
}
::placeholder {
  font-style: italic;
  color: var(--placeholder_gray);
}
.loading {
	padding: 0 2em 0 1em;
	font-style: italic;
	font-weight: bold;
	background-image: url("loading.gif");
	background-repeat: no-repeat;
	background-position: right;
	background-size: 1.2em 1.2em;
}
.hidden {
	visibility: hidden;
}
h1, b {
	color: var(--text_bold);
}


/******* Templates *******/
.ex-ch {
	font-style: italic;
}
.ex-eng {
	font-style: normal;
}


/******* Top Ribbon *******/
#ribbon {
	position: fixed;
	display: flex;
	width: 100%;
	border-bottom: 2px solid var(--diksionariu_main);
	top: 0;
	left: 0;
	background: var(--background_white);
	overflow: hidden;
	z-index: 100;
}
#ribbon a {
	padding: 0.25em 1em;
	font-weight: bold;
	color: var(--non_active_gray);
	text-decoration: none;
	cursor: pointer; 
	flex: initial;
}
#ribbon .current {
	color: var(--text_button);
	background-color: var(--diksionariu_main);
}
#ribbon .ribbon-spacer {
	flex: auto;
}
#logout-user-info {
	display: flex;
}
#logout-user-text {
	flex: auto;
	margin-right: .5em;
	text-align: right;
}
#logout-user-picture {
	flex: initial;
	align-content: center;
}
#logout-user-picture-img {
	border-radius: .5em;
	width: 1em;
	height: 1em;
}



/******* Search Bar *******/
#search-container {
	position: relative;
	height: 12.5em;
	color: var(--text_button);
	font-weight: bold;
	background-color: var(--diksionariu_main);
	z-index: 50;
}
#user-input {
	display: block;
	margin: auto;
	padding: 3em 0 0 0;
	width: 85%;
}
#search-and-dropdown {
	display: flex;
	position: relative;
	flex-grow: 1;
}
#search-entry-and-button {
	position: relative;
	display: flex;
	width: 100%;
	border-radius: 0.25em;
}
#entry {
	flex-grow: 1;
	width: calc(100% - 2em);
	height: 1.85em;
	margin-right: 0;
	padding: 0.25em 0.5em;
	border-radius: 0.25em;
	border: solid 2px var(--trim_white);
	color: var(--text_black);
	background-color: var(--background_white);
	font-size: 1.5em;
}
#entry-submit {
	flex-grow: 0;
	font-size: 1.5em;
	height: 1.85em;
	width: 2em;
	min-width: 2em;
	margin-left: -2em;
	border: var(--trim_white) solid 2px;
	border-radius: 0 0.25em 0.25em 0;
	background-color: var(--diksionariu_main);
	background-image: url('./images/search.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	z-index: 5;
}
#search-dropdown {
	position: absolute;
	display: block;
	height: fit-content;
	width: 100%;
	top: 1.85em;
	font-size: 1.5em;
	background: var(--background_white);
	border: 1px solid var(--block_dark_gray);
}
#search-dropdown ul {
	margin: 0;
	padding: 0;
}
#search-dropdown li {
	list-style: none;
	width: 100%;
}
#search-dropdown a, a:visited {
	text-decoration: none;
	font-weight: normal;
	color: var(--visited_link);
}
#search-dropdown li:hover {
	background: var(--diksionariu_highlight);
}
#search-dropdown a:hover {
	text-decoration: underline;
}
#search-dropdown li.dropdown-selected {
	background: var(--diksionariu_highlight);
}
#search-dropdown .dropdown-selected a {
	text-decoration: underline;
}
#search-dropdown .search-dropdown-suggest-mobile {
	display: none;
	border-bottom: 1px solid var(--block_dark_gray);
}
#search-dropdown .search-dropdown-suggest {
	border-top: 1px solid var(--block_dark_gray);
}
#search-dropdown .dropdown-link {
	display: inline-block;
	width: 100%;
	padding: .9em;
	font-size: .65em;
}
#search-dropdown .dropdown-suggest-link {
	display: inline-block;
	width: 100%;
	padding: .6em 1em;
	font-size: .55em;
}
.dropdown-entry {
	font-weight: bold;
}
.entry-english {
	background-color: var(--search_bar_english) !important;
	color: var(--diksionariu_main) !important;
}
.submit:disabled {
	background-color: var(--diksionariu_lighter);
}
.submit:active {
	background-color: var(--diksionariu_main);
}
#search-tabs {
	display: block;
	padding-left: 1em;
}
#search-tabs .search-tab {
	display: inline-block;
	font-size: 80%;
	margin: 0 0.15em;
	padding: 0.35em;
	color: var(--block_gray_text);
	background-color: var(--block_dark_gray);
	border: var(--trim_white) 2px solid;
	border-top: none;
	border-radius: 0.25em;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	z-index: 1;
	cursor: pointer;
}
#search-tabs .current {
	background-color: var(--block_light_gray);
	color: var(--diksionariu_main);
}


/******* Under Search Bar *******/
#under-search-container {
	position: fixed;
	padding: 1em;
	border-bottom: 1px solid var(--horizontal_separator);
	background: var(--background_white);
	width: 100%;
	top: 1.75em;
	padding-bottom: 0;
	z-index: 20;
	transition: top 0.25s;
}
#under-search-entry-and-buttons {
	
}
.under-search-button {
	background-color: var(--fuzzy_bar_color);
	color: var(--text_button);
	border: none;
	font-size: 1em;
	border-radius: .25em;
	height: 2em;
}
.under-search-button:hover {
	background-color: var(--diksionariu_main);
}
#under-search-CH-button {
	width: 2.25em;
}
#under-search-Eng-button {
	width: 2.5em;
	margin-left: 0.25em;
}
#under-search-entry {
	margin-left: 0.75em;
	width: calc(100% - 6em);
	font-size: 1.125em;
	border-width: 2px;
	border-style: solid;
	border-image: linear-gradient(to right, var(--horizontal_separator), #0000 25em) 1;
	border-top: none;
	border-left: none;
	border-right: none;
}


/******* Footer Links *******/
#footer {
	height: 8em;
	color: white;
	background-color: black;
}
#footer a {
	display: block;
	margin: .5em 0;
	color: white;
	text-decoration: none;
}



/******* Main Block *******/
#main-page-block {
	color: var(--text_black);
	background-color: var(--background_white);
}
#main-page-block .container:nth-of-type(n+2) {
	border-top: 2px solid var(--block_light_gray);
}
#main-page-block a, a:visited {
	color: var(--visited_link);
	text-decoration: none;
}
#main-page-block a:hover{
    text-decoration: underline;
}
#wotd-textbox {
	margin: 1em auto;
	border: 8px solid var(--block_wotd_border);
	max-width: 25em;
	min-height: 15em;
	background-color: var(--block_wotd_gray);
	font-weight: bold;
}
#wotd-textbox a {
	text-decoration: none;
	color: inherit;
}
#wotd-textbox .content {
	margin: 3em auto;
	width: fit-content;
}
#wotd-textbox .wotd {
	font-size: 3.5em;
	color: var(--visited_link);
	padding-bottom: 0.8em;
}
#wotd-textbox .wotd-sub {
	font-size: 1.5em;
	color: var(--visited_link);
}
.browse-by-letter {
	display: inline-block;
	width: fit-content;
	min-width: 1.75em;
	margin: 0.5em;
	padding: 0.15em;
	border: 2px solid var(--diksionariu_main);
	border-radius: 0.25em;
	text-align: center;
	vertical-align: middle;
	color: white;
	background-color: var(--diksionariu_main);
	font-weight: bold;
	font-size: 1.25em;
}

.flex {
	display: flex;
	gap: 25px;
}
.flex-cards {  	/* for about-page advert-section containers */
	display: flex;
	flex-wrap: wrap;
	gap: 25px;
	justify-content: center;
}
.flex1 {
	flex: auto;
	min-width: 300px;
	line-height: 1.75em;
}
.flex1-2 {
	max-width: calc(50% - 13px);
}
.flex2 {
	max-width: 100%;
	max-height: 100%;
	min-width: 300px;
	padding: 10px;
	background-color: var(--text_button);
	border: 2px solid var(--block_med_gray);
}
.flex3 {
	width: 300px;
	height: 300px;
	background: var(--background_white);
	align-items: center;
	border: 2px solid var(--block_med_gray);
}
.flex4 {
	max-width: 100%;
	max-height: 100%;
	min-width: 300px;
	padding: 20px;
}
.main-text {
	font-size: 1.22em;
	line-height: 1.4em;
}
.bibliography {
	list-style: none;
	text-indent: -3em;
	padding-left: 4em;
}
.bibliography li {
	padding-bottom: .5em;
}
.card {
	width: fit-content;
	padding: 1em;
	border: 2px solid var(--block_med_gray);
	background: var(--background_white);
	text-align: center;
}
.card1 {		/* search guide, etc. */
	width: fit-content;
	margin: auto;
	padding: 1em;
}
.social {
    height: 1em;
    object-fit: contain;
}
#full-download {
	cursor: pointer;
}
	

/******* Results Block *******/
#results-page-block {
	color: var(--text_black);
	background-color: var(--background_white);
	min-height: calc(100% - 20.5em);
}
#results-container {
	display: block;
	color: var(--text_black);
	background-color: var(--background_white);
	font-size: 100%;
	padding: 2em;
}
#results {
	margin-top: 0.5em;
	overflow: auto;
}
#results a {
	cursor: pointer;
}
#results table {
	border-collapse: collapse;
}
#results table, tr, td {
	border: 1px solid var(--horizontal_separator);
	padding: 1em;
}
.markup-link {
	text-decoration: none;
	cursor: pointer;
	color: var(--markup_link);
}
.markup-link:hover {
	text-decoration: underline;
}
.markup-link.external-link {
	color: var(--markup_external);
	padding-right: 1em;
	white-space: nowrap;
}
.markup-link.external-link::after {
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23777' d='M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16zM2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1'/%3E%3C/svg%3E");
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	margin-left: 0.25em;
	margin-right: -1em;
}

#results .redirect-text {
	font-size: .8em;
	font-style: italic;
	color: var(--text_redirect_gray);
}

#results .entry {
	padding: 1em 2em 3em 3em;
}
#results .entry h1 {
	position: relative;
	left: -0.8em;
}

.results-single > div + div {
	border-top: solid 1px var(--horizontal_separator);
	padding: 1em 0 2em 0;
}
.results-single zz {
	display: block;
	margin-left: 1em;
	line-height: 1.5;
}
.results-single a:hover {
	text-decoration: underline;
}
.minor-content {
	font-size: 85%;
	color: var(--text_minor_gray);
}
#results .minor-content h3 {
    margin-bottom: 0.5em;
}
#results .entry .content:nth-of-type(n+2){
	margin-top: 2em;
}

.results-multiple {
	margin: 2em;
	column-count: 2;
	column-gap: 3em;
}
.results-multiple xx {
	line-height: 1.5;
}
.results-multiple a {
	color: var(--text_black);
	text-decoration: none;
}
.results-multiple a:hover {
	text-decoration: none;
}
#results .xx-term {
	font-weight: bold;
	font-style: italic;
	cursor: pointer;
}
#results .xx-POS {
	opacity: 0.5;
}
#results .xx-definition {
}
#results .xx-examples {
	opacity: 0.75;
	font-style: italic;
	font-style: italic;
}
#results span.example.internal-link:hover {
	background: var(--diksionariu_highlight);
}

.results-english a {
	text-decoration: underline !important;
	color: var(--text_black) !important;
}
.highlight {
	background-color: var(--diksionariu_highlight);
}
.results-multiple-button {
	position: relative;
	float: right;
	margin: 0;
	padding: 0;
	font-size: 1.5em;
	width: 1.5em;
	height: 1.5em;
	border: none;
	background-image: url('./images/dict-page.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	z-index: 10;
	cursor: pointer;
	content: ' ';
}
.results-multiple-header {
	display: flex;
	align-items: center;
	font-size: 115%;
	font-weight: bold;
	padding: 0 1.5em 1em 0;
}
.results-multiple-header a {
	text-decoration: none;
}
.results-multiple-nav-middle {
	flex-grow: 1;
	border-bottom: var(--block_med_gray) 2px solid;
	border-radius: 2px;
}
.results-multiple-nav {
	flex-grow: 0;
	flex-basis: auto;
	margin: 0 1em;
	padding: 0.25em;
	cursor: pointer;
	color: var(--text_black);
}
.results-multiple-nav:hover {
	background-color: aliceblue;
}
.results-multiple-nav-earlier::before {
	color: var(--text_black);
	opacity: 0;
	content: '«\00a0';
}
.results-multiple-nav-earlier:hover::before {
	opacity: .5;
}
.results-multiple-nav-later::after {
	color: var(--text_black);
	opacity: 0;
	content: '\00a0»';
}
.results-multiple-nav-later:hover::after {
	opacity: .5;
}
.results-multiple-entry {
	text-indent: -1em;
	padding-left: 1em;
}
.results-multiple-entry:hover {
	background-color: aliceblue;
	text-decoration: none;
}
.results-multiple-entry a:hover {
	text-decoration: none !important;
}
.results-multiple-big-letter {
	padding-bottom: 0.2em;
	font-family: serif;
	font-size: 6em;
	font-weight: bold;
}
.results-multiple-original-entry {
	color: dodgerblue;
}
.no-result {
	font-style: italic;
	color: var(--text_error);
	font-size: 1.25em;
	padding-left: 1em;
}
.no-result-link {
	color: inherit !important;
	text-decoration: none;
	font-size: .825em;
}
.no-result-link:hover {
	text-decoration: underline;
}

/* Templates */
#results zz .ex-ch {
	display: list-item;
	margin-left: 1.75em;
	margin-top: .5em;
}
#results zz .ex-ch:first-of-type {
	margin-top: 1em;
}
#results zz .ex-eng {
	margin-left: 2.25em;
}
#results xx .ex-ch {
	display: inline;
	text-indent: 0;
}
#results xx .ex-eng {
	display: inline;
	text-indent: 0;
}
#results xx .ex-ch::after {
	content: ' ';
}
#results xx .ex-eng::after {
	content: ' ';
}


/******* Partial Matches *******/
.partial-container {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
}
.partial-subcontainer {
	flex: 1;
	min-width: 0;
	margin: 0;
}
.partial-results {
	margin: 2em;
}
.partial-match {
	line-height: 2;
	white-space: nowrap;
}
.partial-match a {
	color: var(--diksionariu_main);
	text-decoration: none;
}

/******* Fuzzy Search *******/
.fuzzy-container {
	margin: 2em;
}
.fuzzy-container-columns {
	column-count: 2;
	column-gap: 3em;
}
.fuzzy-match {
	line-height: 2;
	white-space: nowrap;
}
.fuzzy-match-entry {
	font-weight: bold;
}
.match-strength {
	display: inline-block;
	margin: 0 1em;
	height: 0.35em;
	width: 5em;
	background: var(--fuzzy_bar_gray);
}
.match-strength-bar {
	margin: 0;
	padding: 0;
	height: 100%;
	background: var(--fuzzy_bar_color);
}
.fuzzy-container a {
	color: var(--diksionariu_main);
	text-decoration: none;
}
.fuzzy-container a:hover {
	text-decoration: underline;
}

/******* Morphology *******/
.morph-message {
	margin-bottom: 0;
}
.root {
	font-weight: bold;
}
.morph-container {
	margin: 2em;
	margin-left: 1em;
	line-height: 1.75em;
}


/****** Hover Preview Popup ********/
#hover-preview-popup {
	display: block;
	position: absolute;
	height: 200px;
	width: 300px;
	padding: 0;
	border: 1px solid var(--block_med_gray);
	background-color: var(--background_white);
	color: var(--text_black);
	filter: drop-shadow(0 .5em 1.5em var(--drop_shadow_gray));
	overflow: hidden;
	z-index: 50;
}
#hover-preview-popup .results {
	height: 100%;
	padding: 1.5em;
	font-size: 0.92em;
	overflow-y: scroll;
}
#hover-preview-popup .results h3 {
	margin: 0;
}
#hover-preview-popup .results h3 a {
	text-decoration: none;
	color: var(--diksionariu_main);
}
#hover-preview-popup .results h3 a:hover {
	text-decoration: underline;
}
#hover-preview-popup .results .load {
	height: calc(100% - 2em);
	background-image: url("loading.gif");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 15%;
}
#hover-preview-popup .results ol {
	margin: 1em 0;
	padding-left: 2em;
}
#hover-preview-popup .results ul {
	margin: 1em 0;
	padding-left: 2em;
	font-size: 1.1em;
}
#hover-preview-popup .root {
	font-weight: bold;
}



/******* Advanced Search Page *******/
#advanced-search-container {
	background-color: var(--diksionariu_highlight);
}
#advanced-search-block {
	margin: 2em 2em 0 2em;
}
.underbody-advanced {
	z-index: -1;
	position: fixed;
	height: 100%;
	width: 100%;
	background: linear-gradient(var(--diksionariu_highlight) 40%, var(--page_background_black) 40%);
}
.advanced-search-form {
	display: flex;
}
.advanced-search-form .column {
	flex: 50%;
	padding: 0 1em;
}
.advanced-search-form .search-label {
	font-size: .85em;
	font-weight: bold;
	color: var(--text_black);
}
.advanced-search-form .search-input {
	width: 80%;
	margin-bottom: 1em;
	padding: .2em;
	font-size: .9em;
	color: var(--text_black);
	background-color: var(--background_white);
	border: 1px solid var(--block_gray_text);
	border-radius: 1px;
}
.advanced-search-form select {
	background-color: var(--background_white);
	color: var(--text_black);
	border: 1px solid var(--block_gray_text);
	border-radius: 1px;
}
#advanced-search-button {
	padding: .15em .5em;
	font-size: 1.25em;
	font-weight: bold;
	background: var(--diksionariu_main);
	color: var(--text_button);
	border: none;
	border-radius: 6px;
	margin-right: 1em;
}
#advanced-search-button:active {
	background: var(--diksionariu_lighter);
}
#clear-button {
	padding: .15em .5em;
	font-size: 1.25em;
	font-weight: bold;
	background: var(--non_active_gray);
	color: white;
	border: none;
	border-radius: 6px;
}
#clear-button:active {
	background: var(--block_dark_gray);
}
#search-explanation {
	margin: 0 3em;
}
#advanced-results-container {
	display: block;
	color: var(--text_black);
	background-color: var(--background_white);
	font-size: 100%;
	padding: 2em;
	min-height: calc(100% - 38em);
}


/******* WOTD Page *******/
#wotd-block {
	min-height: calc(100% - 8em);
	padding: 3em 0 1em 0;
	color: var(--text_black);
	background-color: var(--background_white);
}
#wotd-block .date-header {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: auto;
	padding: 1em;
	font-size: 1.35em;
}
#wotd-block .date-div {
	padding: 0 0.25em;
	text-align: center;
}
#wotd-block .wotd {
	font-family: Georgia, serif;
	font-size: 5em;
	text-decoration: none;
	text-align: center;
}
#wotd-block .wotd-card {
	position: relative;
	max-width: 800px;
	margin: auto;
	padding: 5% 10%;
	border: 1px solid var(--block_wotd_border);
}
#wotd-block .wotd-card .adjacent-days {
	display: flex;
	position: absolute;
	height: 100%;
	width: 8%;
	top: 0;
	justify-content: center;
	align-items: center;
	font-size: 3em;
	color: var(--text_black);
	opacity: 20%;
	z-index: 10;
}
#wotd-block .wotd-card .yesterday {
	left: 0;
}
#wotd-block .wotd-card .tomorrow {
	right: 0;
}
#wotd-block .wotd-card .yesterday::before {
	content: "‹";
}
#wotd-block .wotd-card .tomorrow::before{
	content: "›";
}
#wotd-block .wotd-card .adjacent-days:hover {
	background-color: var(--block_light_gray);
	opacity: 50%;
}
#wotd-block .wotd-card #results{
	padding-left: 1em;
	overflow: visible;
}
#wotd-block .wotd-card .part-of-speech{
	margin-left: -1em;
}



/******* Mobile formatting *******/
@media only screen and (max-width: 600px) {
	.flex {
		flex-wrap: wrap;
	}
	.partial-container {
		flex-direction: column;
	}
	#wotd-textbox .wotd {
		font-size: 3em;
	}
	#wotd-block .date-header {
		font-size: 1.05em;
	}
	#wotd-block .wotd {
		font-size: 4em;
	}
}
@media only screen and (max-width: 500px) {
	#wotd-textbox .wotd {
		font-size: 2.5em;
	}
	#wotd-block .wotd {
		font-size: 3em;
	}
	#search-dropdown .search-dropdown-suggest {
		display: none;
	}
	#search-dropdown .search-dropdown-suggest-mobile {
		display: block;
	}
	#under-search-container {
		padding: .3em;
		padding-bottom: 0;
	}
	#under-search-entry-and-buttons {
		margin-bottom: .3em;
	}
	.results-multiple { 
		margin: 1em;
		column-count: 1;
	}
	.results-multiple-header {
		display: flex;
		align-items: center;
		font-size: 115%;
		font-weight: bold;
		padding: 0 0 1.5em 0;
	}
	#results .examples {
		display: none;
	}
	.results-multiple-nav-middle {
		flex-grow: 1;
		border-bottom: lightgray 2px solid;
		border-radius: 2px;
		margin: 0 1em;
	}
	.results-multiple-nav {
		flex-grow: 0;
		flex-basis: auto;
		margin: 0;
		padding: 0.25em;
		cursor: pointer;
		color: gray;
	}
	.advanced-search-form {
		flex-wrap: wrap;
	}
	.advanced-search-form .column {
		flex: 100%;
		padding: 0 1em;
	}
	.advanced-search-form .search-input {
		width: 100%;
	}
	.partial-results {
		margin: 1em;
	}
	.morph-container {
		margin: 1em;
		margin-left: 0.5em;
		line-height: 1.75em;
	}
	.fuzzy-container {
		margin: 1em;
	}
	.fuzzy-container-columns {
		column-count: 1;
	}
	#ribbon {
		font-size: 80%;
	}
}
@media only screen and (max-width: 400px) {
	#wotd-textbox .wotd {
		font-size: 2.5em;
		overflow-wrap: break-word;
	}
	#wotd-block .wotd {
		font-size: 2.5em;
		overflow-wrap: break-word;
	}
	#ribbon {
		font-size: 70%;
	}
}
@media only screen and (max-width: 310px) {
	* {
		overscroll-behavior: none;
	}
}

/******* Dark Mode *******/
/* @media (prefers-color-scheme: dark) { */
  /* :root { */
	/* --diksionariu_main: #555;		/* dark red */
	/* --diksionariu_lighter: #bb8a8a;		/* dusty rose */
	/* --diksionariu_highlight: #a4a0db;		/* light purple */
	/* --background_white: #111; */
	/* --page_background_black: black; */
	/* --text_black: #ccc; */
	/* --text_white: black; */
	/* --text_bold: #eee; */
	/* --text_button: #eee; */
	/* --text_error: #dc8c8c;			/* medium red */
	/* --text_minor_gray: #bbb;		/* dark gray */
	/* --text_redirect_gray: #bbb;		/* dark gray */
	/* --non_active_gray: #999;		/* medium gray */
	/* --placeholder_gray: #ddd; */
	/* --trim_white: #ddd; */
	/* --block_light_gray: #222;		/* very light gray */
	/* --block_dark_gray: #777;		/* medium light gray */
	/* --block_gray_text: #222; */
	/* --visited_link: #ccf; */
	/* --horizontal_separator: silver; */
	/* --fuzzy_bar_color: #b44646;		/* same as diksionariu_highlight */
	/* --fuzzy_bar_color: #555;			/* fairly light gray */
	
	/* --diksionariu_lighter: #a08abb;		/* lilac */
	
	/* --block_wotd_gray: #444;	/* dark medium gray */
	/* --block_wotd_border: #777;	/* medium gray */
	/* --multiple_view_hover: aliceblue; */
	/* --multiple_view_original: dodgerblue; */
	/* --horizontal_separator: silver; */
	/* --fuzzy_bar_color: #3f008b;		/* same as diksionariu_main */
  /* } */
  /* #advanced-search-container { */
	  /* background-color: #555; */
  /* } */
  /* #search-tabs .search-tab { */
	  /* background-color: #333; */
	  /* color: #626262; */
  /* } */
  /* #search-tabs .current { */
	  /* background-color: #888; */
	  /* color: #3f008b; */
  /* } */
  /* .advanced-search-form .search-input { */
	  /* background-color: #333; */
  /* } */
/* } */