@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
@import url(https://cdn.jsdelivr.net/gh/tonsky/FiraCode@1.206/distr/fira_code.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);

@font-face {
  font-family: 'Monaco';
  font-style: normal;
  font-weight: 700;
  src: local('Monaco'), url(monaco-webfont.woff) format('woff2');
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

body {
	text-align: center;
	font-family: "Open Sans", sans-serif;
}

.grammar_table {
	margin: 0 auto;
	border: 1px solid rgba(0,0,0,0.1) !important;
}
.grammar_table th {
	align: center;
}
.grammar_table td {
	background-color: rgba(200,200,200,0.25) !important;
	border-right: 1px solid rgba(0,0,0,0.1) !important;
	border-bottom: 1px solid rgba(0,0,0,0.1) !important;
}
.grammar_table th {
	border-right: 1px solid rgba(0,0,0,0.1) !important;
	border-bottom: 1px solid rgba(0,0,0,0.1) !important;
	background-color: rgba(200,200,200,0.5);
}
.grammar_table th.vlevo {
	border-right: 1px solid rgba(0,0,0,0.1) !important;
	background-color: rgba(200,200,200,0.5);
}
.grammar_table th.vlevo span.nonterm, .grammar_table span.nonterm {
	color: blue !important;
	font-style: italic;
}
.grammar_table span.term {
	font-family: "Monaco", "Fira Code", "Courier New";
}
.grammar_table .current-fragment {
	color: white !important;
	background-color: #2a76dd !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}
.grammar_table .current-fragment span.nonterm {
	color: white !important;
}
.grammar_table th.current-fragment.vlevo span.nonterm {
	color: white !important;
}
.grammar_table td.accept, .grammar_table td.pop, .grammar_table td.epsilon {
	text-decoration: underline;
}

#ll_demo .control {
	padding-top: 10px;
	padding-bottom: 10px;
}

#ll_demo .control a {
	text-decoration: none;
	font-size: 24px;
}

#ll_demo .stack_wrapper {
	text-align: center;
}
#ll_demo .position {
	font-family: "Monaco", "Fira Code", "Courier New";
}
#ll_demo .stack_wrapper {
	
}
#ll_demo #ll_demo_input {
	opacity: 0.5;
}
#ll_demo #ll_demo_input::selection {
	color: black;
}
#ll_demo_input:focus {
	color: blue;
}
#ll_demo .stack_wrapper #ll_stack {
	width: 60em;
	height: 1.35em;
	line-height: 1.35em;
	font-size: 0.8em;
	border: 2px solid #2a76dd;
	border-left: none;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	text-align: right;
	padding: 5px 0px;
	margin: auto;
	display: inline-block;
	background: url(arrow.svg);
	background-repeat: no-repeat;
	background-position: left;
	overflow: hidden;
}

#ll_stack .symbol, #ll_stack .nonterm, #ll_stack .term, #ll_stack .accept, #ll_stack .reject {
	display: inline-block;
	margin: 0 5px;
	background: #EEE;
	box-shadow: 0 0 1px 1px #999;
	border-radius: 5px;
	padding: 0 5px;
}
#ll_stack .term {
	background: #CCC;
	border-radius: 0px;
	text-align: center;
}
#ll_stack .accept {
	color: black;
	background: #62ff00;
	box-shadow: 0 0 1px 1px #55c000;
}
#ll_stack .reject {
	color: white;
	background: #ff0000;
	box-shadow: 0 0 1px 1px #bf0000;
}
#ll_stack .symbol:first-child, #ll_stack .nonterm:first-child, #ll_stack .term:first-child {
	background: #94c7ff;
	box-shadow: 0 0 1px 1px #5591fb;
}
#ll_stack.highlight-nonterm .nonterm:first-child {
	background: #94c7ff !important;
	box-shadow: 0 0 1px 1px #5591fb !important;
}
#ll_stack.highlight-reject .nonterm:first-child {
	background: #ff4500 !important;
	box-shadow: 0 0 1px 1px #ff1600 !important;
}
#ll_stack.highlight-term .term:first-child {
	background: #ffee2d !important;
	box-shadow: 0 0 1px 1px #ffa500 !important;
}
#ll_demo .tape_wrapper {
	
	padding-bottom: 3px;
	margin-bottom: 20px;
}
#ll_demo .info {
	display: inline-block;
	color: #555;
	margin-right: 30px;
	font-size: 0.5em;
}
#ll_demo .tape_wrapper #ll_tape .epsilon {
	color: #5591fb;
}
#ll_demo .tape_wrapper #ll_tape {
	font-family: "Monaco", "Fira Code", "Courier New";
	display: inline-block;
}
#ll_demo .tape_wrapper #ll_tape .current_position {
	background: #94c7ff;
	box-shadow: 0 0 1px 1px #5591fb;
	border-radius: 5px;
}
#ll_demo .tape_wrapper #ll_tape.highlight-term .current_position {
	background: #ffee2d !important;
	box-shadow: 0 0 1px 1px #ffa500 !important;
}
#ll_demo .tape_wrapper #ll_tape.highlight-nonterm .current_position {
	background: #94c7ff !important;
	box-shadow: 0 0 1px 1px #5591fb !important;
}
#ll_demo .tape_wrapper #ll_tape.highlight-reject .current_position {
	background: #ff4500 !important;
	box-shadow: 0 0 1px 1px #ff1600 !important;
}
#ll_demo .tape_wrapper #ll_tape.highlight-accept .current_position {
	background: #6ed167 !important;
	box-shadow: 0 0 1px 1px #0dd100 !important;
}
.grammar_table td.highlight-term {
	background: #ffc100 !important;
}
.grammar_table td.highlight-term span.nonterm {
	color: black !important;
}
.grammar_table td.highlight-nonterm {
	background: #94c7ff !important;
}
.grammar_table td.highlight-nonterm span.nonterm {
	color: black !important;
}
.grammar_table td.highlight-accept {
	background: #6ed167 !important;
}
.grammar_table td.highlight-accept span.nonterm {
	color: black !important;
}