/* entypo */
[class*="entypo-"]:before {
  font-family: 'entypo', sans-serif;
}

html {
	height: 100%;
	min-width: 320px;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	font-family: 'Fira Sans', sans-serif;
	margin: 0;
	padding: 0;
	font-size: 20px;
	line-height: 30px;
	height: 100%;
	font-weight: 300;
	min-height: 100%;
	min-width: 320px;
	background: #1a1a1a;
	color: #333;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body.mobile {
	font-size: 18px;
	line-height: 26px;
}
body * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body .page {
	position: relative;
}
body.desktop.signed_in .page {
	margin-right: 300px;
}
ul,
ol {
	padding-left: 30px;
}
ol {
	counter-reset: ol1;
	list-style: none;
}
ol li {
	position: relative;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #1a1a1a;
}
ol li h3 {
	font-size: 20px;
	line-height: 30px;
}
ol > li:before {
	counter-increment: ol1;
  	content: counter(ol1) ".";
	position: absolute;
	left: -30px;
}
ol li ol {
	counter-reset: ol2;
}
ol > li > ol > li:before {
	counter-increment: ol2;
  	content: counter(ol1) "." counter(ol2) ".";
	left: -40px;
}
h1,
h2,
h3,
strong {
	font-weight: 300;
}
h2 {
	font-size: 34px;
	line-height: 42px;
}
h3 {
	font-size: 26px;
	line-height: 36px;
}
h4 {
	font-size: 20px;
	line-height: 30px;
}
.mobile h1 {
	font-size: 24px;
	line-height: 36px;
}
.mobile h2 {
	font-size: 22px;
	line-height: 30px;
}
.mobile h3 {
	font-size: 19px;
	line-height: 23px;
}
a {
	cursor: pointer;
	text-decoration: none;
	color: #1a1a1a;
}
a:hover {
	color: #00a99d;
}
.combine h2 {
	margin-bottom: 15px;
}
.combine h2 + p {
	margin-top: 0;
}
.center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.clear {
	clear: both;
}
.left,
.right {
	width: 50%;
}
.left {
	float: left;
}
.right {
	float: left;
	text-align: right;
}
.euro:after {
	content: ' €';
}
.alert {
	padding: 40px 40px 40px 80px;
	border: 1px solid #C00;
	position: relative;
}
.alert:before {
	content: "\26a0";
	font-family: 'entypo', sans-serif;
	position: absolute;
	left: 0;
	top: 0;
	text-align: center;
	line-height: 24px;
	padding: 40px 20px;
	font-size: 24px;
	color: #C00;
}
.inline {
	display: inline-block;
}
.cookies {
	background: #333;
	color: #fff;
	min-height: 80px;
}
.cookies .close {
	position: absolute;
	right: 20px;
	top: 20px;
	z-index: 100;
}
.cookies .wrapper {
	padding: 20px 80px 20px 20px;
	max-width: none;
}
.cookies .wrapper p {
	margin: 0;
}
.cookies .wrapper p a {
	color: #fc5c63;
}
.cookies + .page header {
	position: absolute;
}
.wrapper {
	margin: 0 auto;
	max-width: 1400px;
	padding: 0 20px;
	position: relative;
}
.mobile .wrapper {
	padding: 0 10px;
}

.tooltip {
	position: relative;
	display: inline-block;
}
.tooltip:after {
	content: 'i';
	font-family: "Times New Roman", Times, serif;
	font-weight: bold;
	background-color: #1e1e1e;
	font-size: 14px;
	border-radius: 10px;
	color: #fff;
	width: 20px;
	height: 20px;
	line-height: 20px;
	display: inline-block;
	vertical-align: top;
	text-align: center;
	margin: 10px 0 0 5px;
}
.tooltip .tip {
	color: #1a1a1a;
	font-size: 14px;
	line-height: 20px;
	display: none;
	top: 100%;
	position: absolute;
	z-index: 500;
	width: 300px;
	background-color: #fff;
	border: 1px solid #1a1a1a;
	padding: 10px;
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
	margin-top: 5px;
}
.tooltip .tip:before {
	content: '';
	position: absolute;
	top: -10px;
	left: 50%;
	margin-left: -10px;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #fff;
}
.tooltip:hover .tip {
	display: block;
}
.page header {
	padding: 20px 0;
	position: absolute;
	z-index: 500;
	width: 100%;
	transition: background 0.2s;
	-moz-transition: background 0.2s;
	-webkit-transition: background 0.2s;
	-o-transition: background 0.2s;
}
.mobile .page header {
	padding: 10px 0;
}
.desktop.signed_in .page header {
	display: none;
}
.logo {
	position: relative;
	cursor: pointer;
	float: left;
}
aside .logo {
	padding: 20px;
}
.logo .app_icon {
	width: 50px;
	height: 50px;
	background-image: url('logo_icon.png');
	background-size: 50px;
	position: absolute;
}
.logo .app_text {
	background-image: url('logo_text.png');
	height: 50px;
	width: 197px;
	position: relative;
	margin-left: 55px;
	z-index: 100;
	vertical-align: top;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
aside .logo .app_text {
	background-image: url('logo_white_text.png');
}
.logo img {
	display: none;
}
.tablet header .logo .app_text {
	display: none;
}

body[data-page="/"] header {
	background: rgba(26,26,26,0.9);
}
body[data-page="/"] header .logo .app_text {
	background-image: url('logo_white_text.png');
}
body[data-page="/"] header.shrink {
	background: #1a1a1a;
}
.mobile header .logo app_text {
	display: none;
}
header .account {
	display: inline-block;
	float: right;
	top: 0;
	width: 50%;
}
.tablet header .account {
	width: auto;
}
header .account .bulb_navi {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}
.desktop.signed_in header .account .bulb_navi {
	display: none;
}
header .account .bulb_navi:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
header .account .bulb_navi li {
	display: inline-block;
	vertical-align: top;
	position: relative;
	float: right;
}
header .account .count {
	position: absolute;
	right: 0;
	top: 0;
	background-color: #fc5c63;
	color: #;
	line-height: 18px;
	height: 20px;
	width: 20px;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
	font-size: 12px;
	text-align: center;
	border: 1px solid #fff;
}
header .account .small {
	width: 50px;
	height: 50px;
	display: inline-block;
	float: left;
	margin-left: 10px;
}

.heading {
	position: relative;
}
.heading .wrapper h2 {
	text-align: center;
	line-height: 100px;
	padding-bottom: 15px;
	margin: 0;
}
.mobile .heading .wrapper h2 {
	display: none;
}
.heading .wrapper h2 span {
	margin-right: 20px;
}
.heading .background {
	height: 100%;
	display: block;
	position: absolute !important;
	width: 100%;
	bottom: 0;
	background: #00d29d;
	opacity: 0.5;
}
.page section {
	min-height: 670px;
	background: #eee;
}
.page footer {
	width: 100%;
	min-height: 50px;
	border-top: 1px solid #fff;
	background: #1a1a1a;
	padding: 20px 0 20px 0;
	color: #fff;
}
footer .wrapper {
	position: relative;
}
footer nav {
	display: inline-block;
	float: left;
	width: 50%;
}
.mobile footer nav {
	width: 100%;
}
footer nav ul {
	float: left;
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mobile footer nav ul {
	text-align: center;
	width: 100%;
}
footer nav ul li {
	line-height: 40px;
	display: inline-block;
	padding-right: 20px;
}
footer nav ul li:last-child {
	margin-right: 0;
}
footer nav ul li a {
	text-decoration: none;
	color: #ccc;
	display: block;
}
footer nav ul li:hover a {
	color: #fff;
}
footer .copyright {
	color: #ccc;
	width: 50%;
	display: inline-block;
}
.mobile footer .copyright {
	width: 100%;
	margin-top: 50px;
}
footer .copyright p {
	margin: 0;
	line-height: 40px;
	text-align: right;
}
.mobile footer .copyright p {
	text-align: center;
}
footer .wrapper:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}


/* Inputs and textareas */
input,
textarea {
	-webkit-appearance: none;
	height: 52px;
	padding: 4px 8px;
	border: 1px solid #fff;
	color: #1e1e1e !important;
	font-size: 16px;
	margin: 0;
	outline: none;
	background: rgba(255,255,255,0.8);
    border-radius: 3px;
    box-sizing: border-box;
	vertical-align: top;
}
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #333;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #333;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #333;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #333;
}
:focus::-webkit-input-placeholder { /* WebKit browsers */
    color:    #ccc;
}
:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #ccc;
}
:focus::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #ccc;
}
:focus:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #ccc;
}
textarea {
	padding: 8px;
}
/* SELECTS */

.select {
	position: relative;
}
.select:before {
	right: 10px;
	content: '';
	position: absolute;
	bottom: 50%;
	margin-bottom: -2.5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid rgba(26,26,26,0.9);
}
.select input {
	padding-right: 25px;
	width: 100%;
}
.select.show_arrow:after {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid rgba(26,26,26,0.9);
	content: '';
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -10px;
}
.select > ul {
	position: absolute;
	margin: 0;
	padding: 5px 0;
	list-style: none;
	display: none;
	max-height: 200px;
	overflow: auto;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
	background-color: rgba(26,26,26,0.9);
	width: 100%;
	top: 100%;
	margin-top: 10px;
	z-index: 2100;
}
.select ul li {
	position: relative;
	color: #fff;
	cursor: pointer;
	overflow: hidden;
}
.select ul li.disabled {
	cursor: default;
}
.select ul li.search p {
	cursor: default;
	height: auto;
	padding: 4px 8px;
}
.select ul li.search p input {
	height: 30px;
	min-width: auto;
	width: 100%;
}
.select ul li p {
	margin: 0;
	padding: 0 8px;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.select ul li.disabled p {
	color: #CCC;
}
.select > ul > li:hover {
	background-color: #00d29d;
}
.select > ul > li.disabled:hover,
.select > ul > li.search:hover {
	background-color: inherit;
}
.select > ul > li > ul {
	padding: 0;
	margin: 0;
	max-height: 0;
	list-style: none;
	transition: all 0.3s 0.5s;
	-moz-transition: all 0.3s 0.5s;
	-webkit-transition: all 0.3s 0.5s;
	-o-transition: all 0.3s 0.5s;
}
.select > ul > li > ul > li {
	padding-left: 8px;
	line-height: 30px;
	color: #ccc;
}
.select > ul > li > ul > li:hover {
	color: #fff;
}
.select > ul > li:hover > ul {
	max-height: 800px;
	padding: 10px 0;
}
aside {
	z-index: 600;
	position: fixed;
	right: -300px;
	top: 0;
	width: 300px;
	height: 100%;
	display: none;
	background: #555;
}
.desktop.signed_in aside {
	right: 0 !important;
	display: block !important;
}
aside nav {
	height: 100%;
	position: relative;
	margin: 0;
}
aside nav > a {
	display: block;
	position: relative;
	z-index: 100;
}
aside nav .nav_container {
	position: absolute;
	top: 0;
	padding: 100px 0 90px 0;
	width: 100%;
	height: 100%;
}
aside nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: auto;
	height: 100%;
}
aside nav ul.show {
	display: block;
}
aside nav ul li {
	line-height: 50px;
}
aside nav ul li.active {
}
aside nav ul li.active a {
	cursor: default;
	color: #00d29d;
}
aside nav ul li a {
	margin: 0 20px;
	display: block;
	border-top: 1px solid #444;
	text-decoration: none;
	padding: 10px 0;
	color: #eee;
}
aside nav ul li a .title {
	display: inline-block;
	line-height: 50px;
	vertical-align: top;
	padding-left: 10px;
	font-size: 20px;
}
aside nav ul li:first-child a {
	border-top: none;
}
aside nav .container {
	padding: 20px;
	position: absolute;
	bottom: 0;
	width: 100%;
}
aside nav .container .button {
	width: 100%;
}
section > .wrapper:first-child {
	padding: 90px 10px 40px 10px;
}
section .heading:first-child {
	padding-top: 70px;
}
.mobile section .heading:first-child {
	padding-top: 80px;
}
.desktop.signed_in section .heading:first-child {
	padding-top: 0;
}
section > .wrapper {
	padding: 20px;
}
.mobile section > .wrapper {
	padding: 10px;
}
section:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
/* Signin box */
.modal {
	top: 0;
	position: fixed;
	z-index: 1000;
	visibility: hidden;
	opacity: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000);
	transition: all 0.3s;
}
.modal.show {
	visibility: visible;
	opacity: 1;
}
.modal .container {
	width: 100%;
	height: 100%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.modal .box {
	width: 460px;
	padding: 20px;
	position: absolute;
	background: #eee;
	-moz-box-shadow: 0 0 20px #000;
	-webkit-box-shadow: 0 0 20px #000;
	box-shadow: 0 0 20px #000;
	background-color: #777;
	color: #fff;
	z-index: 500;
	border: 3px solid #fff;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
	max-height: 90%;
	overflow: auto;
}
.desktop .modal .box {
	width: 600px;
}
.mobile .modal .box {
	width: 100%;
}
#signin .social {
	margin-top: 10px;
}
#signin .facebook,
#signin .google {
	width: calc(50% - 10px);
	float: left;
}
#signin .facebook {
	margin: 0 10px 0 0;
}
#signin .google {
	margin: 0 0 0 10px;
}
.modal .followingBallsG {
	background-color: #fff;
}
.modal h2 {
	margin: 0;
	padding: 0;
	line-height: 26px;
	font-size: 26px;
}
.modal p {
	margin: 0;
	padding: 3px 0;
}
.modal .fr-view .small {
	font-size: 0.8em;
}
.modal .fr-view ul {
	margin: 20px 0;
}
.modal .moderate {
	font-size: 16px;
	line-height: 24px;
	width: calc(100% + 40px);
	position: relative;
	left: -20px;
	top: -20px;
	padding: 20px;
	background: rgba(0,0,0,0.5);
	color: #fff;
}
.modal .info span {
	margin-right: 10px;
}
.modal a:not(.button, .web_icon) {
	color: #fc5c63;
}
.modal .pack {
	padding-top: 20px;
}
.modal .pack > *:first-child {
	margin-top: 0;
}
.modal .box > .close {
	position: absolute;
	right: 20px;
	top: 20px;
	text-decoration: underline;
	display: block;
	margin-bottom: 20px;
	cursor: pointer;
	color: #fff;
	text-decoration: none;
	font-size: 30px;
}
.modal a {
	color: #fff;
}
.modal button {
	width: 100%;
	position: relative;
}
.modal button .icon {
	position: absolute;
	top: 5px;
	right: 5px;
	background-image: url(login.svg);
	background-size: 20px;
	background-position: center;
	width: 20px;
	height: 20px;
	display: block;
}
.modal .box input {
	width: 100%;
}
.modal .center {
	font-size: 16px;
	line-height: 24px;
	width: calc(100% + 40px);
	position: relative;
	left: -20px;
	bottom: -20px;
	padding: 20px;
	background: rgba(0,0,0,0.5);
	color: #fff;
}

/* Slide navi */
.slide_navi {
	height: 40px;
	overflow: hidden;
	position: relative;
	bottom: 0;
}
.mobile .slide_navi {
	bottom: 0;
}
.slide_navi > ul {
	position: absolute;
	min-width: 100%;
}
.slide_navi .user_navi {
	margin: 0;
	padding: 0;
	list-style: none;
}
.slide_navi .user_navi li {
	display: inline-block;
	float: left;
}
.slide_navi .user_navi li a {
	display: block;
	line-height: 40px;
	padding: 0 20px;
	
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}
.slide_navi .user_navi li a span {
	padding-right: 10px;
}
.slide_navi .user_navi li.active a {
	background: #eee;
	color: #1a1a1a;
}
/* Forms */
.form {
	margin: 0 -10px;
	padding: 0;
	list-style: none;
	width: calc(100% + 20px);
}
.form:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.form > li {
	position: relative;
	margin-bottom: 10px;
	float: left;
	width: 100%;
	padding: 0 10px;
}
.form > li.medium {
	width: 50%;
}
.form > li label {
	display: inline-block;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	left: 0;
	vertical-align: top;
	font-size: 16px;
}
.mobile .form > li label {
	width: 100%;
	line-height: 20px;
	height: 20px;
	position: relative;
}
.form > li .field input {
	width: 100%;
	height: 40px;
	min-width: auto;
}
.form > li.calc_net .field input {
	width: calc(50% - 10px);
}
.form > li.calc_net .field .mini_btn {
	margin-left: 10px;
}
.form > li.calc_net .field .mini_btn + input {
	width: calc(50% - 50px);
	margin-left: 10px;
}
.form > li .field .file_select {
	width: 100%;
	height: 100px;
	line-height: 90px;
}
.form > li .field .file_select.highlight {
	background: rgba(0,210,157,0.5);
}
.form > li .field textarea {
	width: 100%;
	height: 150px;
}
.form > li .field .file_select input {
	height: 100%;
}
.form > li .field .upload_progress {
	top: 0;
	left: 0;
	z-index: -1;
}
.form > li .field .file_preview {
	min-height: 200px;
	border: 1px solid #fff;
}
.form > li .field .file_preview embed {
	width: 100%;
	height: 400px;
}
.form > li .field .file_preview img {
	width: 100%;
}
.form > li .field > .checkbox {
	margin-top: 10px;
}
.form > li .field .checkboxes {
	max-height: 240px;
	overflow: auto;
	border: 1px solid #fff;
}
.form > li .field .checkboxes ul {
	margin: 0;
	padding: 20px;
	list-style: none;
}
.form > li .field .checkboxes ul li {
	position: relative;
}
.form > li .field .checkboxes ul li span {
	display: inline-block;
	vertical-align: top;
}
.form > li .field .checkboxes ul li span.num {
	width: 40px;
}
.form > li .field .checkboxes ul li span.name {
	width: calc(100% - 140px);
	overflow: hidden;
	text-overflow: ellipsis;
}
.form > li .field .checkboxes ul li span.total {
	width: 100px;
	text-align: right;
}
input[type="checkbox"] {
	display: none;
}
input[type="checkbox"] + label {
	position: relative;
	vertical-align: bottom;
	line-height: 26px;
	cursor: pointer;
	white-space: nowrap;
	height: 26px;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-left: 30px;
	font-size: 17px;
}
input[type="checkbox"] + label:before {
	content: '';
	border: 1px solid #333;
	position: absolute;
	width: 16px;
	display: inline-block;
	height: 16px;
	top: 50%;
	left: 0;
	margin-top: -8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	background: -moz-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
}
input[type="checkbox"]:checked + label:after {
	content: '';
	background: #333;
	position: absolute;
	left: 2px;
	top: 50%;
	margin-top: -6px;
	width: 12px;
	display: block;
	height: 12px;
}
.form > li .field .checkboxes ul input[type="checkbox"] + label:before {
	border: 1px solid #fff;
	background: none;
}
.form > li .field .checkboxes ul input[type="checkbox"]:checked + label:after {
	background: #fff;
}
/* Tabs */
.tabs .nav {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #fff;
}
.tabs .nav li {
	display: inline-block;
	padding: 5px 10px;
	margin-right: 10px;
	cursor: pointer;
}
.tabs .nav li.active {
	background: #fff;
	color: #333;
}
.tabs .contents {
	margin-top: 40px;
}
.tabs .contents > div {
	display: none;
}
.tabs .contents > div.active {
	display: block;
}
/* Pinbox */
.pin_box {
	padding: 20px;
	background: rgba(119,119,119,0.8);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC777777,endColorstr=#CC777777);
	border: 2px solid #fff;
}
.pin_box p {
	color: #fff;
}
.pin_box input {
	width: 100%;
}
/* Buttons */
button,
.button {
	display:inline-block;
	text-decoration: none;
	text-align: center !important;
	white-space: nowrap;
	cursor: pointer;
	line-height: 20px;
	font-size: 18px;
	height: 50px;
	line-height: 40px;
	color: #fff;
	border: none;
	vertical-align: top;
	padding: 5px 15px;
    border-radius: 3px;
	margin: 0;
	outline: none;
	background: linear-gradient(to bottom,  #00d29d 0%, #00a99d 100%);
}
.button + .button {
	margin-left: 10px;
}
button:hover,
.button:hover {
	background: linear-gradient(to bottom,  #00a99d 0%, #00d29d 100%);
	color: #333;
	text-decoration: none;
}
button .fa,
.button .fa,
button .entypo,
.button .entypo {
	margin-right: 15px;
}
.good {
	color: #333 !important;
	background: rgb(210,255,82); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(210,255,82,1) 0%, rgba(145,232,66,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=0 ); /* IE6-9 */
}
.good:hover {
	background: rgb(145,232,66); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(145,232,66,1) 0%, rgba(210,255,82,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(145,232,66,1) 0%,rgba(210,255,82,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(145,232,66,1) 0%,rgba(210,255,82,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#91e842', endColorstr='#d2ff52',GradientType=0 ); /* IE6-9 */
}
.bad {
	color: #fff;
	background: rgb(255,48,25); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,48,25,1) 0%, rgba(207,4,4,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
}
.bad:hover {
	background: rgb(207,4,4); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(207,4,4,1) 0%, rgba(255,48,25,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(207,4,4,1) 0%,rgba(255,48,25,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(207,4,4,1) 0%,rgba(255,48,25,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf0404', endColorstr='#ff3019',GradientType=0 ); /* IE6-9 */
}
.view_switcher {
	font-size: 0;
	float: right;

	.button {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		color: #1a1a1a;
		background: rgba(255,255,255,0.5);
	}
	.button.active {
		background: #00d29d;
	}
	.button + .button {
		margin-left: 0;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		border-top-right-radius: 3px;
		border-bottom-right-radius: 3px;
	}
}

.mini_btn {
	width: 40px;
	height: 40px;
	background: #00d29d;
	color: #fff;
	display: inline-block;
	line-height: 40px;
	text-align: center;
}
.mini_btn:hover,
.active .mini_btn {
	text-decoration: none;
	background: #00a99d;
	color: #fff;
}
.signin {
	margin: 5px;
}
.signin.facebook {
	background: #627AAD;
}
.signin.google {
	background: #DD4B39;
}
.browser_nav {
	position: fixed;
	z-index: 1000;
	bottom: -40px;
	height: 40px;
	width: 100%;
	background: -moz-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CCFFFFFF,endColorstr=#CCFFFFFF);
}
.browser_nav.view_always {
	bottom: 0 !important;
	opacity: 1 !important;
}
.browser_nav a {
	color: #fc5c63;
	z-index: 1000;
	cursor: pointer;
	
	width: 40px;
	height: 40px;
	display: inline-block;
}
.browser_nav a:before {
	font-family: 'entypo', sans-serif;
	font-size: 20px;
	line-height: 40px;
	text-align: center;
	display: block;
}
.browser_nav a:hover {
	text-decoration: none;
	color: #fff;
	background: rgba(0,0,0,0.8);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC000000,endColorstr=#CC000000);
}
#scroll_top_button {
	position: absolute;
	right: 10px;
}
#scroll_top_button:before {
	content: '\E767';
}
#go_prev:before {
	content: '\E765';
}
#go_next:before {
	content: '\E766';
}

#quit {
	display: inline-block;
	float: right;
}

section .waiter {
	padding-top: 140px;
}
#signin .spinner > div {
	background-color: #fff;
}
.waiter {
	width: 50px;
	margin: 0 auto;
	padding: 40px 0;
	position: relative;
	z-index: 500;
}
.page > .waiter {
	position: fixed;
	z-index: 600;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(26,26,26,0.8);
}
.page > .waiter .spinner {
	width: 50px;
	height: 50px;
	text-align: center;
	font-size: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -25px;
}

.spinner > div {
	background-color: #00d29d;
	height: 100%;
	width: 6px;
	display: inline-block;
	margin: 2px;
	-webkit-animation: stretchdelay 1.2s infinite ease-in-out;
	animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
	-webkit-animation-delay: -1.1s;
	animation-delay: -1.1s;
}

.spinner .rect3 {
	-webkit-animation-delay: -1.0s;
	animation-delay: -1.0s;
}

.spinner .rect4 {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

.spinner .rect5 {
	-webkit-animation-delay: -0.8s;
	animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
	0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
	20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
	0%, 40%, 100% { 
	  transform: scaleY(0.4);
	  -webkit-transform: scaleY(0.4);
	}  20% { 
	  transform: scaleY(1.0);
	  -webkit-transform: scaleY(1.0);
	}
}
section .sharing {
	padding: 40px 0;
	background-color: #333;
}
.sharing .icons {
	text-align: center;
}
.sharing .web_icon {
	display: inline-block;
	margin: 10px;
}
/* Register */
#error_msg {
	margin-top: 0;
	text-align: center;
	background-color: #00d29d;
	color: #fff;
	padding: 10px;
}
/* data forms */
.data {
	padding: 0;
	margin: 20px 0 0 0;
	border: none;
	text-align: left;
	background-color: #eee;
	border: 1px solid #ccc;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.data label {
	display: inline-block;
	width: 50%;
	float: left;
	line-height: 40px;
}
.mobile .data label {
	width: 100%;
	float: none;
}
.data .select,
.data input,
.data textarea,
.data .no-image,
.data label + * {
	width: 50%;
	float: right;
}
.mobile .data .select,
.mobile .data input,
.mobile .data textarea,
.mobile .data label + *  {
	width: 100%;
	float: none;
}
.data textarea {
	min-height: 120px;
}
.data .select input {
	width: 100%;
}
.data > ul {
	list-style: none;
	margin: 0;
	padding: 20px;
	width: 50%;
	display: inline-block;
	float: left;
}
.data > .options {
	text-align: center;
	padding: 20px;
	background: rgba(255,255,255,0.9);
}
.data h2,
.data h3,
.data p {
	margin: 0;
}
.mobile .data > ul {
	width: 100%;
}
.data > ul > li {
	margin-bottom: 20px;
}
.data > ul > li:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.data > ul > li .upload {
	background: rgba(255,255,255,0.5);
	border: 1px solid #1a1a1a;
	cursor: pointer;
	text-align: center;
	line-height: 40px;
	position: relative;
}
.data > ul > li .preview {
	min-height: 400px;
}
.data > ul > li .preview[src=""] {
	display: none;
}
.data > ul > li .preview + .no-image {
	border: 1px solid #1a1a1a;
	line-height: 30px;
	padding: 5px 10px;
	text-align: center;
	display: none
}
.data > ul > li .preview[src=""] + .no-image {
	display: block;
}
.upload_progress {
	position: absolute;
	width: 100%;
	height: 100%;
}
.upload_bar {
	background: #1a1a1a;
	height: 100%;
	position: absolute;
}


body[data-page^="/search"] header:after {
	content: "";
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-top: 15px solid #fff;
	position: absolute;
	left: 50%;
	margin-left: -15px;
	bottom: -15px;
}
body[data-page^="/search"] header .logo .app_text {
	background-image: url('app_text_black.png');
}
/* Marketing CSS */
.padding {
	padding: 20px 0;
}
.fullscreen {
	width: 100%;
	height: 100vh;
	
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
.fullscreen .wrapper {
	height: 100%;
	position: relative;
}
.fullscreen .wrapper .ontext {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 20px 20px 40px 20px;
	color: #fff;
	text-shadow: 0 0 3px #1a1a1a, 0 0 3px #1a1a1a;
}
.fullscreen .wrapper .ontext h3 {
	margin: 0;
}

/* Forgot */
#forgotten_email {
	width: 100%;
	max-width: 360px;
	margin: 0 auto;
}
.mobile #forgot {
	margin-top: 20px;
}
/* list legend */
.list-legend {
	margin-top: 20px;
	border-bottom: 1px solid #1a1a1a;
	font-weight: 600;
}
.list-legend:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.mobile .list-legend {
	display: none;
}
.list-legend p a {

	&.active {
		color: #00d29d;
		position: relative;

		&[href*="desc"] {
			&:after {
				border-top: none;
				border-bottom: 5px solid #00d29d;
			}
		}

		&:after {
			content: "";
			position: relative;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			border-top: 5px solid #00d29d;
			margin-bottom: 5px;
			margin-left: 5px;
			display: inline-block;
		}
	}
}
/* list view */
.scrollable {
	outline: none;
	width: 100%;
}
.mobile .scrollable {
	margin-top: 10px;
}
.list-view {
	min-height: 360px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.desktop .list-view {
	min-height: auto;
}
.list-view > li {
	cursor: default;
	display: block;
	width: 100%;
	position: relative;
	border-top: 1px solid #eee;
	border-left: 5px solid #fff;
}
.list-view li[data-type='service'],
.list-view li[data-type='archive'] {
	border-left: 5px solid #76D785;
}
.list-view li[data-type='estimation'] {
	border-left: 5px solid #8AA2DB;
}
.list-view li[data-type='material'] {
	border-left: 5px solid #E48A8C;
}
.list-view li[data-type='credit'],
.list-view li[data-type='active'] {
	border-left: 5px solid #DBB878;
}
.list-view.bank-receipts li[data-type='credit'] {
	border-left: 5px solid #76D785;
}
.list-view.bank-receipts li[data-type='credit'] p[data-id='amount'] {
	color: #76D785;
}
.list-view.bank-receipts li[data-type='debit'] {
	border-left: 5px solid #E48A8C;
}
.list-view.bank-receipts li[data-type='debit'] p[data-id='amount'] {
	color: #E48A8C;
}
.list-view.bank-receipts li.has-receipt:before {
	content: "\2713" !important;
	display: block;
	font-family: 'entypo', sans-serif;
	position: absolute;
	right: 10px;
	top: 0;
	padding: 5px;
}
.list-view.bank-receipts li.has-receipt.in-datev:before {
	content: "\e711" !important;
}
.list-view > li:first-child {
	border-top: none;
}
.list-view > li:nth-child(even) {
	background: rgba(255,255,255,0.5);
}
.list-view li.force_hide {
	display: none !important;
}
.list-view > li:hover {
	background: #eee;
}
.list-view > li:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.list-view > li > [data-id],
.list-legend p {
	display: none;
	margin: 0;
	width: 25%;
	padding: 5px 10px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	float: left;
	height: 40px;
	white-space: nowrap;
}
.list-view > li[data-canceled='yes'] > [data-id] {
	text-decoration: line-through;
}
.list-view.expand li p {
	height: auto;
	text-overflow: clip;
	white-space: normal;
}
.list-view.efforts-archive li p,
.list-view.efforts li > [data-id],
.list-view.hbcis li p,
.list-legend.for-efforts p,
.list-legend.for-hbcis p {
	width: 20%;
}
.list-view li > .visible,
.list-legend p.visible {
	display: inline-block;
}
.list-view li p[data-id='sum'],
.list-view li p[data-id='amount'],
.list-view li p[data-id='cost'],
.list-view li p[data-id='total'],
.list-legend p[data-id='sum'],
.list-legend p[data-id='amount'],
.list-legend p[data-id='cost'],
.list-legend p[data-id='total'],
.list-legend p[data-id='receipt'] {
	text-align: right;
}
.list-view.efforts li > div[data-id] > * {
	margin: 0;
}
p[data-id='bank_pin'] {
	-webkit-text-security: disc;
}
.list-view li [data-id].big,
.list-legend p.big {
	width: 50%;
}
.list-view li [data-id].mini,
.list-legend p.mini {
	width: 5%;
}
.list-view li [data-id].small,
.list-legend p.small {
	width: 10%;
}
.list-view li [data-id].medium,
.list-legend p.medium {
	width: 15%;
}
.list-view li [data-id].large,
.list-legend p.large {
	width: 40%;
}
.mobile .list-view li [data-id]:not(.show_mobile),
.mobile .list-legend p:not(.show_mobile) {
	display: none;
}
.mobile .list-view li [data-id].show_mobile,
.mobile .list-legend p.show_mobile {
	width: 50%;
}
.list-view li .visible .highlight {
	background: #FF0;
}
.list-view li p .done {
	width: 100%;
	height: 100%;
	position: relative;
	border: 1px solid #1a1a1a;
	display: block;
	text-align: center;
	font-size: 14px;
}
.list-view li p .grace {
	width: 100%;
	height: 100%;
	position: relative;
	border: 1px solid #1a1a1a;
	background: rgba(26,26,26,0.5);
	display: block;
}
.list-view li p .days {
	width: 100%;
	height: 100%;
	text-align: center;
	display: block;
	line-height: 28px;
	font-size: 14px;
	z-index: 100;
	position: relative;
	color: #fff;
	text-shadow: 0 0 3px #1a1a1a;
}
.list-view li p .grace .indicator {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	display: inline-block;
	background: #1a1a1a;
}
.list-view li:hover a {
	color: #fff;
}
.list-view li .options {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 160;
}
.list-view li .options .hidden_menu {
	position: absolute;
	z-index: 100;
	display: none;
}
.list-view li .options ul.hidden_menu {
	list-style: none;
	background: #00d29d;
	padding: 10px;
}
.list-view li:nth-last-child(-n+7) .options .hidden_menu {
	top: auto;
	bottom: 100%;
}
.list-view li:nth-child(-n+7) .options .hidden_menu {
	top: 100%;
	bottom: auto;
}
.list-view li .options:hover .hidden_menu {
	display: block;
}
.list-view li .options:hover ul.hidden_menu {
	right:  0;
}
.list-view li .options ul.hidden_menu .mini_btn {
	display: block;
	width: auto;
	text-align: left;
	white-space: nowrap;
}
.list-view li .options ul.hidden_menu .mini_btn span {
	width: 40px;
	height: 40px;
	display: inline-block;
	text-align: center;
}
.list-view li .options ul.hidden_menu .mini_btn:after {
	content: attr(title);
	display: inline-block;
	padding: 0 10px;
}
.bills li.in-datev:before {
	content: "\e711" !important;
	display: block;
	font-family: 'entypo', sans-serif;
	position: absolute;
	right: 10px;
	top: 0;
	padding: 5px;
}
.bills li[data-type='archive'] p[data-id='date_archived'] {
	display: inline-block;
}
.mobile .bills li[data-type='archive'] p[data-id='date_archived'] {
	display: none;
}
.bills li[data-type='archive'] p[data-id='days_left'] {
	display: none;
}
.bills li p[data-id='total'] {
	padding-right: 50px;
}
.bills li .bank_match {
	position: absolute;
	right: 0;
	z-index: 150;
}
.bills li.in-datev .bank_match {
	display: none;
}
.bills li .bank_match .entypo-alert {
	display: block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
}
.bills li .bank_match:hover .entypo-alert {
	background: #00d29d;
	color: #fff;
}
.bills li .bank_match ul {
	position: absolute;
	display: none;
	right: 0;
	background: #00d29d;
	color: #fff;
	list-style: none;
	margin: 0;
	padding: 20px;
	min-width: 300px;
}
.mobile .bills li .bank_match ul {
	position: absolute;
	display: none;
	right: 0;
	background: #00d29d;
	color: #fff;
	list-style: none;
	margin: 0;
	padding: 20px;
	min-width: 200px;
}
.bills li .bank_match:hover ul {
	display: block;
}
.bills li .bank_match ul li {
	font-size: 12px;
	line-height: 20px;
	padding-top: 10px;
	margin-top: 10px;
	border-top: 1px solid #fff;
	position: relative;
}
.bills li .bank_match ul li span {
	display: inline-block;
}
.bills li .bank_match ul li .label {
	position: absolute;
	width: 100px;
}
.bills li .bank_match ul li .value {
	padding-left: 120px;
}
.bills li .bank_match ul li:first-child {
	padding-top: 0;
	margin-top: 0;
	border-top: none;
}
/* list filter */
.list-filter > * {
	display: inline-block;
	vertical-align: top;
	margin-top: 20px;
}
.list-filter:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.list-filter .checkboxes {
	background: rgba(255,255,255,0.8);
    border-radius: 3px;
    position: relative;
}
.mobile .list-filter .checkboxes {
	margin-left: 0;
}
.list-filter .checkboxes .selected:before {
	right: 10px;
	content: '';
	position: absolute;
	bottom: 50%;
	margin-bottom: -2.5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid rgba(26,26,26,0.9);
}
.list-filter .checkboxes .selected {
	margin: 0;
	line-height: 32px;
	height: 52px;
	padding: 10px;
    padding-right: 30px;
    min-width: 200px;
    max-width: 400px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.list-filter .checkboxes ul {
	list-style: none;
	margin: 0;
	padding: 10px;
	visibility: hidden;
	overflow: auto;
	max-height: 0;
	transition: all 0.3s;
	position: absolute;
	z-index: 100;
	background: #fff;
	width: 100%;
}
.list-filter .checkboxes:hover ul {
	visibility: visible;
	max-height: 500px;
}
.list-filter .checkboxes ul li.search input {
	border: 1px solid #1e1e1e;
	margin-bottom: 10px;
	width: 100%;
}
.list-filter .checkboxes ul li.reset a {
	font-size: 17px;
	padding-left: 30px;
	border-bottom: 1px solid #1e1e1e;
	display: block;
	position: relative;
}
.list-filter .checkboxes ul li.reset a:before {
	content: "\274e";
	font-family: 'entypo', sans-serif;
	position: absolute;
	left: 0;
	top: 0;
	font-size: 20px;
}
.mobile .list-filter > * {
	width: calc(50% - 10px);
	margin-top: 10px;
}
.list-filter label {
	display: inline-block;
	line-height: 50px;
	padding: 0 10px;
}
.list-filter .select {
	display: inline-block;
	vertical-align: top;
}
.mobile .list-filter .select {
	width: 100%;
}
#project_filter,
#month_filter,
#year_filter,
#effort_year_filter {
	float: right;
}
#year_filter,
#effort_year_filter {
	margin-right: 10px;
}
.mobile #month_filter,
.mobile #year_filter {
	float: left;
}
.mobile #month_filter {
	margin: 10px 10px 0 0;
	width: 25%;
}
.mobile #year_filter {
	margin: 10px 0 0 0;
	width: calc(25% - 10px);
}
#more_filter .checkboxes {
	padding: 10px 20px;
}
#more_filter .checkboxes label {
	width: auto;
}
.search_filter {
	width: 200px;
	margin-right: 20px;
}
.mobile .search_filter {
	margin: 10px 10px 0 0;
	float: left;
}
.desktop .search_filter:focus {
	width: 40%;
	transition: width 0.3s 0.5s;
	-moz-transition: width 0.3s 0.5s;
	-webkit-transition: width 0.3s 0.5s;
	-o-transition: width 0.3s 0.5s;
}

/* list overview */
.list-overview {
	margin-top: 10px;
	border-top: 1px solid #1a1a1a;
}
.list-overview .sum {
	padding: 10px;
	float: right;
	text-align: right;
	margin: 5px 0 0 0;
	border-top: 1px solid #1a1a1a;
	position: relative;
	right: 0;
}
[data-page="/bills"] .list-overview .sum {
	padding: 10px 50px 10px 10px;
}
.list-overview:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
/* list controls */
.list-controls {
	margin-top: 10px;
}
.mobile .list-controls .button {
	width: 100%;
	margin: 10px 0 0 0;
}
/* Kanban */
.kanban {
	margin: 20px 0;
	display: flex;
	gap: 20px;

	.col {
		overflow: visible;
		max-height: none;
		flex: 1;
		min-width: 0;
		width: 0;
	}

	.layer {
		background: rgba(255,255,255,0.5);
		border-radius: 3px;
		padding: 20px;
		position: relative;

		.title {
			font-size: 20px;
			font-weight: 600;
			margin: 0 0 20px 0;
		}
	}

	.cards {
		height: calc(100vh - 200px);
		overflow-y: auto;
		list-style: none;
		margin: 0;
		padding: 0;
		min-height: 400px;

		&::-webkit-scrollbar {
			display: none;
		}

		> li {
			padding-bottom: 10px;
		}

		.ui-sortable-placeholder {

			position: relative;

			&:after {
				content: "";
				border: 1px dashed #fff;
				border-radius: 8px;
				position: absolute;
				width: 100%;
				height: calc(100% ~'-' 20px);
			}
		}

		.card {
			background: #fff;
			border: none;
			border-radius: 3px;
			padding: 20px;
			position: relative;
			border-top: 8px solid #00d29d;
			overflow: visible;
			cursor: move;
			margin: 0;
			
			.title {
				font-size: 16px;
				margin: 0;
			}
		}
	}
}
/* Dashboard */
.double,
.triple {
	margin: 0;
	padding: 0;
	list-style: none;
	width: calc(100% + 40px);
	position: relative;
	left: -20px;
}
.mobile .double,
.mobile .triple {
	width: 100%;
	left: 0;
}
.double > li,
.triple > li {
	float: left;
	display: inline-block;
	padding: 0 20px;
}
.double > li {
	width: 50%;
}
.triple > li {
	width: 33.33%;
}
.tablet .triple > li {
	width: 50%;
}
.mobile .double > li,
.mobile .triple > li {
	width: 100%;
	padding: 0;
}
.double:after,
.triple:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.key_facts {
	margin: 0;
	padding: 0;
	list-style: none;
}
.key_facts li {
	border-top: 1px solid #1a1a1a;
}
.key_facts li:first-child {
	border-top: none;
}
.key_facts li:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.key_facts li p {
	display: inline-block;
	line-height: 30px;
	padding: 10px 0;
	margin: 0;
	vertical-align: top;
	float: left;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.key_facts li p.label {
	width: 60%;
}
.key_facts li p.value {
	font-weight: 600;
	text-align: right;
	width: 40%;
}
.card {
	background: #fff;
	padding: 20px;
	margin: 20px 0;
}
.card.text-based {
	min-height: 415px;
}
.card h2,
.card h3 {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	text-align: center;
	background: #00d29d;
	color: #fff;
	margin: -20px -20px 20px -20px;
	padding: 20px;
	line-height: 30px;
}


/* RETINA DISPLAY SUPPORT */

@media only screen and (-webkit-min-device-pixel-ratio: 2),
       only screen and (min--moz-device-pixel-ratio: 2),
       only screen and (-o-min-device-pixel-ratio: 2/1),
       only screen and (min-device-pixel-ratio: 2) {

}

@media (prefers-color-scheme: dark) {

	body {
		color: #fff;
	}
	aside {
		background: rgba(0,0,0,0.5);
	}
	.page header.shrink {
		background: rgba(51,51,51,0.8);
	}
	.page section {
		background: #333;
	}
	.slide_navi .user_navi li.active a {
		background: #333;
		color: #fff;
	}
	.list-view > li:nth-child(even) {
		background: rgba(51,51,51,0.5);
	}
	.list-view > li {
		border-top: 1px solid #000;
	}
	.list-view > li:hover {
		background: #000;
	}
	.list-view li p .grace {
		border: 1px solid #eee;
		background: rgba(150,150,150,0.5);
	}
	.card {
		background: #000;
	}

	.data {
		background-color: #333;
		border: 1px solid #000;
	}
	.data > .options {
		background-color: #000;
	}
	input,
	textarea {
		background: rgba(51,51,51,0.8);
		border: 1px solid #000;
		color: #fff !important;
		font-size: 16px;
	}
	input[type="checkbox"] + label:before {
		border: 1px solid #fff;
		background: #333;
	}
	input[type="checkbox"]:checked + label:after {
		background: #fff;
	}
	button,
	.button {
		background: transparent;
		border: 1px solid #00d29d;
	}
	button:hover,
	.button:hover {
		background: rgba(0,210,157,0.5);
		color: #fff;
	}
	.good {
		color: #fff !important;
		border: 1px solid #d2ff52;
	}
	.good:hover {
		background: rgba(145,232,66,0.5);
	}
	.bad {
		color: #fff;
		border: 1px solid #ff3019;
	}
	.bad:hover {
		background: rgba(207,4,4,0.5);
	}

	.list-filter .checkboxes {
		background: rgba(51,51,51,0.8);
		border: 1px solid #000;
	}
	.list-filter .checkboxes ul {
		background: rgba(26,26,26,0.9);
	}
	.list-filter .checkboxes ul li.reset a {
		color: #00d29d;
	}

	::-webkit-input-placeholder { /* WebKit browsers */
	    color:    #eee;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	    color:    #eee;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
	    color:    #eee;
	}
	:-ms-input-placeholder { /* Internet Explorer 10+ */
	    color:    #eee;
	}
	:focus::-webkit-input-placeholder { /* WebKit browsers */
	    color:    #ddd;
	}
	:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	    color:    #ddd;
	}
	:focus::-moz-placeholder { /* Mozilla Firefox 19+ */
	    color:    #ddd;
	}
	:focus:-ms-input-placeholder { /* Internet Explorer 10+ */
	    color:    #ddd;
	}
	.page footer {
		border-top: 1px solid #000;
	}
}


/* PRINT */
@media print {
	
	body,
	.list-view li p,
	.list-legend p {
		font-size: 15px;
	}
	.list-view li p,
	.list-legend p {
		padding: 5px 5px 5px 0;
	}
	.heading .wrapper h2 {
		line-height: 32px;
		font-size: 26px;
		margin-bottom: 20px;
	}
	
	footer,
	aside,
	.slide_navi .user_navi li:not(.active),
	.list-controls,
	.jspVerticalBar {
		display: none;
	}
	.desktop.signed_in aside {
		display: none !important;
	}
	body.desktop.signed_in .page {
		margin-right: 0;
	}
	.list-legend,
	.scrollable,
	.jspPane,
	.list-view {
		width: 100% !important;
	}
	.slide_navi .user_navi li.active a {
		padding: 0;
	}
	.scrollable {
		height: auto !important;
	}
	.jspPane {
		position: static;
	}
	.list-legend,
	.scrollable:not(.jspScrollable) .list-view {
		padding-right: 0;
	}
	.list-overview .sum {
		right: 0;
		padding: 5px 5px 5px 0;
	}
	.list-view {
		min-height: 0;
		-webkit-print-color-adjust: exact;
	}
	.list-view li {
		page-break-inside: avoid;
	}
	input[type='text'],
	input[type='password'],
	input[type='text'],
	textarea {
		border: 1px solid #000;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	.heading .wrapper h2 {
		color: #000;
	}
}