@charset "UTF-8";

body { font-family: 'Quicksand', 'Arial', sans-serif; font-size: 12px; text-align: center; margin: 0; padding: 0; background-color: #F0F0F0; }

a { font-size: 1.3em; text-decoration: none; }

* { box-sizing: border-box; }

table { border-collapse: collapse; }

button, input, a, textarea, select { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; outline: none; }
button, input, textarea, select { border: 0px; font-family: inherit; }
textarea { font-size: 1.11em; height: 7em; }
input::-ms-clear { display: none; }
:-ms-input-placeholder { color: #A0A0A0; }
::placeholder { color: #A0A0A0; }

.f_colormarker_readonly { background-color: #E6E6E6; }
.f_colormarker_select_always,
.f_colormarker_filledField { background-color: #DCE6DC !important; }
.f_colormarker_filledField_checkmark { display: inline-block; position: relative; }
.f_colormarker_filledField_checkmark:after
{
	xopacity: 0;
	position: absolute;
	right: 10px;
	top: 50%;
	content: '';
	margin-top: -5px;
	background: transparent;
	vertical-align: middle;
	width: 9px;
	height: 5px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;
	-webkit-transform: rotate(-50deg);
	-moz-transform: rotate(-50deg);
	-o-transform: rotate(-50deg);
	-ms-transform: rotate(-50deg);
	transform: rotate(-50deg);
}

.invisibleClass,
#infoContainer { display: none; }

div { overflow: hidden; }
div.container { margin: 0px auto; }
div.container_wrapper {  }
div.container_header { line-height: 100px; padding: 0px 10px; font-size: 3.4em; background-color: #E74C3C; }
div.container_main { min-height: 360px; padding: 10px 10px; }
div.container_main_fixedwrapp { margin-bottom: 60px; }
div.container_footer { background-color: #E74C3C; width: 100%; height: 60px; position: relative; }
div.container_footer_fixed { position: fixed; bottom: 0; }
div.container_footer .links { padding: 1px 0px; height: 60%; overflow: auto; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; }

div.counter { }

div.links a { background-color: #564E4D; color: #EAEAEA; margin: 0px 10px; padding: 6px 10px; display: inline-block; }
div.links a.curPage { background-color: #383231; }
div.links a:hover { background-color: #F0F0F0; color: #2D2928; }
div.links a:active { background-color: #2D2928; color: #EAEAEA; }

div.pagelinks { margin: 20px 0px; }
div.pagelinks a { background-color: #773F39; color: #fffaf9; padding: 6px 10px; display: inline-block; }
div.pagelinks a:hover { background-color: #aa3023; color: #fffaf9; }
div.pagelinks a:active { background-color: #9b1609; color: #fffaf9; }


div.text { margin: 0px 0px 10px 0px; }

div.solution_text { display: none; }

.tablewrapper { overflow-x: auto; }
.tablecaptionwrapper { display: inline-block; }
div.list { margin: 0px auto; }
div.list table { margin: 6px auto 12px auto; text-align: left; font-size: 12px; border-style: hidden; }
div.list table tr.wr { border-top: 3px solid #F0F0F0; } /* wr = wordrow */
div.list table th { background-color: #E2D4D3; padding: 4px; line-height:1.4em; font-weight: 700; text-transform: uppercase; }
div.list table td { background-color: #E1E7E9; padding: 0px 10px; line-height:1.4em; }
div.list table td form { display: inline-block; }
div.list table th.wc { border-right: 1px solid #C6BABA; } /* wc = wordcell */
div.list table td.wc { border-right: 1px solid #D4D9DB; }
div.list table td.word { font-size: 2.0em; }
div.list table td.translit { font-size: 1.4em; }
div.list table td.ipa { font-size: 1.4em; }
div.list table td.gender { color: #666666; }
div.list table td.translat { font-size: 1.4em; }
div.list table td.comment { font-size: 1.4em; }
div.list table td.regular { color: #666666; }
div.list table td.type { color: #999999; }
div.list table td .separator { display: block; width: 20%; line-height: 0.1em; border-bottom: 1px solid #CCCCCC; }
div.list .caption { font-size: 20px; background-color: #D9DEE0;  margin: 4px 0px; padding: 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
div.list table tr.ir { color: #999999; text-align: center; border-top: 2px solid #EBEBEB; display: none; } /* ir = inforow */

div.task { margin: 0px 0px 16px 0px; }
p { margin: 0; color: #38100c; position: relative; }
p.riddleword { font-size: 5em; margin: }
p.riddleword span { display: inline-block; padding: 4px; line-height:1.8em; text-shadow: 0px 0px 6px #c0392b; }
p.solutionword { padding: 10px; }
p.solutionword span { font-size: 2em; padding: 0px 7px; }
p.solutionword span.translit { font-weight: 700; }
p.message { font-size: 1.5em; padding: 10px; }
p.wordinfo { font-size: 1.1em; padding: 5px; margin-top: 5px; color: #666666; line-height: 1.8em; }
p.info { font-size: 1.2em; padding: 10px; color: #333333; }

div.formbox { margin: 6px auto; width: 400px; max-width: 100%; }
div.formbox .caption,
div.formbox .subcaption { text-align: left; }
div.formbox .caption.centered,
div.formbox .subcaption.centered { text-align: center; }
div.formbox.settings { margin: 12px auto 24px auto; font-size: 1.1em; border: 1px solid #c3c7c9; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
div.formbox.settings form { padding: 0px 0px 4px 0px; }
div.formbox.settings .boxes { display: inline-block; text-align: left; }
div.formbox.settings .boxes p { margin: 2px 0px; padding: 3px 12px 3px 0px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
div.formbox.settings .checkedClass { font-weight: 700; background-color: #DCE6DC; }
div.formbox.settings .caption { font-size: 24px; margin: 4px 8px; padding: 6px; border-bottom: 1px solid #D9DEE0; }
div.formbox.settings .subcaption { display: inline-block; font-size: 16px; margin: 8px 8px 0px 8px; padding: 3px 6px; background-color: #e0e0e0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
div.formbox.search { margin: 12px auto 10px auto; }

div.formbox.quiz {  }
div.formbox.quizreset {  }
div.formbox.quizreset .subcaption { font-size: 16px; padding: 20px 0px; line-height: 1.5em; }
div.formbox.quizmodify form { padding: 0px 0px 4px 0px; }
div.formbox.quizmodify .boxes { display: inline-block; text-align: left; }
div.formbox.quizmodify .boxes p { margin: 2px 0px; padding: 3px 12px 3px 0px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
div.formbox.quizmodify .checkedClass { font-weight: 700; background-color: #DCE6DC; }
div.formbox.quizmodify .subcaption { font-size: 16px; padding: 20px 0px; line-height: 1.5em; }

div.formbox.set {  }
div.formbox.update {  }
div.formbox.update .boxes { display: inline-block; text-align: left; }
div.formbox.update .boxes p { display: inline-block; margin: 2px 0px; padding: 3px 12px 3px 0px; width: auto; }

.formbox form { margin: 0px auto; }
.formbox form p { width: 100%; margin: 6px 0px; }
.formbox form p.update_cur_val { text-align: left; margin: 18px 0px 0px 0px; padding: 6px 10px; background-color: #D8DEE0; min-height: 1.5em; width: auto; }
.formbox form p.update_cur_val { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.formbox form p.update_cur_val span { font-weight: 700; }
.formbox form p.spaceabove { margin-top: 18px; }

.formbox .full { width: 100%; }
.formbox .single { width: 94%; margin: 0 1%; }
.formbox .double { width: 46%; margin: 0 1%; display: inline-block; }

.f_fie { margin: 4px 0px; padding: 15px; width: 400px; max-width: 100%; }

.f_fie_addword_sign,
.f_fie_delete_sign { position: absolute; padding: 5px; right: 7px; top: 50%; margin-top: -17px; font-size: 16px; cursor: pointer; }
.f_fie_delete_sign { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }

.f_fie.filter { margin: 0px; }
.f_fie_filter_button_wrapper { width: 70%; margin: 0 1%; display: inline-block; position: relative; }

.f_but { font-weight: 700; background-color: #c0392b; color: #fffaf9; padding: 15px; max-width: 100%; }
.f_but:hover { background-color: #aa3023; color: #fffaf9; }
.f_but:active { background-color: #9b1609; color: #fffaf9; }
.f_but.secondary { font-weight: 700; background-color: #773F39; color: #fffaf9; padding: 15px; max-width: 100%; }

.f_lab.single { text-align: left; display: inline-block; padding: 2px; }

.f_but.filter { width: 26%; margin: 0 1%; display: inline-block; }
.f_but.result { width: 260px; }
.f_but.verbs { width: 260px; margin: 10px 0px; }

.t_but { background-color: transparent; border: 0; padding: 0px; height: 22px; width: 22px; background: url(image_pen-18.png) no-repeat center center transparent; }
.t_but:hover { background-image: url(image_pen-18_gray.png); }

.i_but { background-color: transparent; border: 0; padding: 0px; height: 22px; width: 22px; background: url(image_info-18.png) no-repeat center center transparent; display: inline-block; vertical-align: text-bottom; }
.i_but:hover { background-image: url(image_info-18_gray.png); }

.f_softbut { background-color: #e8e8e8; color: #38100c; border: 1px solid #D9DEE0; padding: 10px; max-width: 100%; }
.f_softbut:hover { background-color: #cecece; color: #38100c; }
.f_softbut:active { background-color: #9b9b9b; color: #fffaf9; }

div.verbs .tablewrapper { margin: 5px 0px; }
div.verbs p { padding: 1px; }
div.verbs p.wordcaption { font-size: 3em; }
div.verbs table.tenselinks { margin: 15px auto; }
div.verbs table.tenselinks th {  }
div.verbs table.tenselinks td { max-width: 450px; }
div.verbs table.tenselinks th,
div.verbs table.tenselinks td { border: 1px solid #BBBBBB; padding: 3px; }
div.verbs table.tenselinks td.tensecategorycaption { font-weight: 700; }
div.verbs a.tenselink { display: inline-block; margin: 2px 4px; padding: 2px 4px; color: #333333; background-color: #D9DEE0; font-size: 1em; }
div.verbs p.tensecaption { font-weight: 700; font-size: 1.2em; background-color: #D9DEE0; margin: 4px 0px; padding: 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
div.verbs p.tensecontent { margin: 5px 0px; border: 1px solid #999999; }
div.verbs table.tensecontent { margin: 5px auto; }
div.verbs table.tensecontent th,
div.verbs table.tensecontent td { border: 1px solid #999999; padding: 0px; text-align: left; }
div.verbs table.tensecontent td span { vertical-align: text-top; }
div.verbs table.tensecontent td .irr { font-size: 0.75em; }
div.verbs table .personcaption p { padding: 4px 4px; }
div.verbs table .content p { padding: 8px 4px; }
div.verbs p span.notirrblock { display: inline-block; text-align: left; vertical-align: middle; margin: 2px; padding: 3px 6px 3px 0px; background-color: #E0E0E0; }
div.verbs p span.personblock { display: inline-block; text-align: left; vertical-align: middle; margin: 2px; padding: 3px 4px; background-color: #E0E0E0; }
div.verbs p span.personblock .newline { display: block; }
div.verbs p span input { max-width: 140px; margin: 1px 0px; padding: 4px 6px; }
div.verbs p span,
div.verbs p span input { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
div.verbs p span input:-ms-input-placeholder { color: #D0D0D0; }
div.verbs p span input::placeholder { color: #D0D0D0; }
div.verbs .personcaption { padding: 4px 0px; }
div.verbs .personcaption .person { font-weight: 700; }
div.verbs .proncaption { padding: 2px 0px; }
div.verbs .word,
div.verbs .translit { font-size: 1.4em; line-height: 1.2em; padding: 3px 2px 4px 2px; }
div.verbs .male { background-color: #E3F2FD; }
div.verbs .female { background-color: #FBE9E7; }

.error { color: red; background-color: lightred; }
.message { width: 400px; max-width: 100%; padding: 8px 4px; margin: 8px auto; border: 1px solid #CCCCDD; line-height: 1.4em; }
.message p { padding: 3px 0px; }
.message form { display: inline-block; padding-left: 0.5em; }
.messagefilled button { padding: 0px 3px; }
.messagefilled button.name,
.messagefilled button.bard { font-weight: 700; }
.messagefilled button.comment { }
.messagesuccess { color: #003000; background-color: #9CD69C; border: 1px solid #9CD69C; }
.messageerror { color: #440000; background-color: #E29090; border: 1px solid #E29090; }
.messageempty { color: #e6ebef; }
.messagehidden { border: 0px; }


.mo-forms-pseudobase
{
	opacity: 0;
	width: 0;
	margin: 0;
}
.mo-forms-pseudolabel
{
	display: inline-block;
	margin: 0px 5px;
}
.mo-forms-pseudocheckbox,
.mo-forms-pseudoradiobutton
{
	cursor: pointer;
	display: inline-block;
	width: 25px;
	height: 25px;
	background: #eee;
	border:1px solid #ddd;
	position:relative;
}
.mo-forms-pseudoradiobutton
{
	-webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;
}
.mo-forms-pseudocheckbox,
.mo-forms-pseudocheckbox:after,
.mo-forms-pseudoradiobutton,
.mo-forms-pseudoradiobutton:after,
.mo-forms-pseudolabel
{
	vertical-align: middle;
}
.mo-forms-pseudocheckbox:after,
.mo-forms-pseudoradiobutton:after
{
	opacity: 0;
	content: '';
	display: block;
	margin: 7px;
	background: transparent;
	vertical-align: middle;
}
.mo-forms-pseudocheckbox:after
{
	width: 9px;
	height: 5px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;
	-webkit-transform: rotate(-50deg);
	-moz-transform: rotate(-50deg);
	-o-transform: rotate(-50deg);
	-ms-transform: rotate(-50deg);
	transform: rotate(-50deg);
}
.mo-forms-pseudoradiobutton:after
{
	width: 9px;
	height: 9px;
	background-color: #333;
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
.mo-forms-pseudocheckbox:hover.mo-forms-pseudocheckbox:after,
.mo-forms-pseudoradiobutton:hover.mo-forms-pseudoradiobutton:after
{
	opacity: 0.1;
}
.mo-forms-pseudobase:checked + label.mo-forms-pseudocheckbox:after,
.mo-forms-pseudobase:checked + label.mo-forms-pseudoradiobutton:after
{
	opacity: 1;
}


.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
}
.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}


select
{
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}

select::-ms-expand {
     display: none;
}
 
.selectwrapper {
  position: relative;
}
 
.selectwrapper:after {
    content: '\22C1';
    font-size: 16px;
    font-weight: 700;
    color: #888888;
    transform: scale(1.2, 1);
    right: 11px;
    top: 6px;
    height: 34px;
    padding: 10px 3px 0px 8px;
    border-left: 1px solid #D4D9DB;
    position: absolute;
    pointer-events: none;
}

.pseudoselectplaceholder,
.pseudooptionplaceholder
{
	color: #444444 !important;
}
.pseudoselectplaceholder option
{
	color: #38100C;
}

@media screen and (max-width: 680px) {
	div.list table { font-size: 10px; }
}
@media screen and (max-width: 540px) {
	div.list table { font-size: 9px; }
	div.list table td { padding: 2px 8px; }

	div.list table.search .regular { display: none; }
	div.list table.search .type { display: none; }

	div.list table tr.ir { display: table-row; }

	p.riddleword { font-size: 3.6em; }
	p.riddleword span { line-height:1.4em; text-shadow: 0px 0px 6px #c0392b; }
	p.solutionword span { font-size: 1.6em; }
}
@media screen and (max-width: 500px) {
	div.list table td { padding: 2px 6px; }

	div.list table .regular { display: none; }
	div.list table td.comment { font-size: 1.0em; }

	div.list table.search .ipa { display: none; }
	div.list table.search .comment { display: none; }

	div.links a { margin: 0px 8px; padding: 6px 8px; }

	div.verbs table.tensecontent th,
	div.verbs table.tensecontent td { text-align: center; }
	div.verbs table.tensecontent th.suffix,
	div.verbs table.tensecontent td.suffix { width: 100%; float: left; }
	div.verbs table .personcaption p { padding: 3px 2px; }
	div.verbs table .content p { padding: 6px 2px; }
	div.verbs .word,
	div.verbs .translit { font-size: 1.1em; line-height: 1.2em; }
}
@media screen and (max-width: 358px) {
	div.links a { margin: 0px 3px; padding: 6px 8px; }
}