:root {
    --main-color: #e49100;
	--main-color2: #feb624;
	--main-color3: #e47117;

	--hover-color1: #dc6a3f;
	--hover-color2: #de9956;
}
html{
}

.underlMO:hover{
	text-decoration: underline;
}

.landing_menu{
	color: #FFF;
	font-size: 16px;
	font-weight: 300;
}

A.register{
	color: #FFF;
	font-size:16px;
	text-decoration: None;
	padding: 4px 80px 4px 80px;
	min-width: 300px;
	border-width: 0px;
	border-radius: 15px;
	/*width: 200px;*/
	color: #FFF;
	/*font-weight: bold;*/
	background-color: #858585;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

A.register:hover{
	background-color: #e49052;
}

body
{
/*font-family: Helvetica;*/
/*font-family: 'Open Sans', sans-serif;*/
/*font-family: 'Oswald';*/
font-family: 'Montserrat', sans-serif;
/*font-family: 'Roboto Light', sans-serif;*/
/*font-family: 'Overpass', sans-serif;*/
font-size: 18px;
/*background: #EEE;*/
/*background: #d8d8d8;*/
background: #e1e1e1;
margin:0px;
height:100%;
position:relative;
/*background-image: url("/static/img/patterns/escheresque_bright.png");*/
/*background-image: url("/static/img/background/white-concrete-ceiling-of-building-2260840.jpg");*/
/*background-repeat: no-repeat;*/
/*background-size: cover;*/

	/*overflow-x:hidden;*/
/* padding-right: 13px; */
}

.footer{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: white;
	color: #999;
	padding: 20px;
	font-size:13px;
}

img{
	vertical-align: middle;
}

.main_grid{
	width: 100vw;
	max-width:100%; /*horizontal scrollbar fix*/
	min-height: 100vh;
	display: grid;
  	grid-template-rows: 34px 40px auto 80px;
  	grid-template-columns: 150px auto;
  	grid-template-areas:
    "header header"
	"content content"
    "main main"
	"footer footer"
}

.simple_grid{
	width: 100vw;
	min-width:100%; /*horizontal scrollbar fix*/
	height: 100vh;
	display: grid;
  	grid-template-rows: 34px 1fr auto;
  	grid-template-columns: 150px auto;
  	grid-template-areas:
    "header header"
    "main main"
	"footer footer"
}

.main_window{
	grid-area: main;
	/*background-color: #FAFAFA;*/
	display:flex;
	min-height:1000px;
	padding-bottom: 200px;
}

.main_window_simple{
	grid-area: main;
	min-height:1000px;
	padding-bottom: 200px;
}

.vidlist_window{
	/*display: none;*/
	display: inline;
	position: static;
	left: 0px;
	top: 70px;
	margin-right: 0px;
	overflow: hidden;
	background-color: #ececec;
	/*box-shadow: 0px 2px 10px rgba(0,0,0,0.2);*/
	z-index: 10;
	height:100%;
	padding-bottom: 200px;
	/*padding-left:10px;*/
}

.burger_menu{
	display: none;
}

@media screen and (min-width: 0px) and (max-width: 1400px) {
    .mobile_hide{ display: none; }  /* hide on small very small screens */
    .tablet_hide{ display: none; }  /* hide on small screens */
    .menu_item{ font-size:32px; }
	.burger_menu{
		display: block;
	}
	.vidlist_window{
		display: none;
		position: absolute;
		left:45px;
	}
    /* body{ font-size: 28px; } */
}

/*@media screen and (min-width: 0px) and (max-width: 1500px) {*/
/*	.vidlist_window{*/
/*		position: absolute;*/
/*	}*/
/*}*/

@media screen and (min-width: 1700px){
	.full_hide{ display: none; }
	/*.vid_list{display: inline;}*/
}

h3{
	padding: 4px 4px 4px 0px;
	margin: 4px 4px 4px 0px;
}

.mouseover_opacity{
	opacity: 0.7;
}

.mouseover_opacity:hover{
	opacity: 1;
}

.account_menu_button {
	font-weight: bold;
	line-height: .6;
	padding:5px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	color: #FFF;
	font-size: 14px;
}

.account_menu_pack {
  /*position: relative;*/
  display: inline-block;
}

/*.account_menu{*/
/*	display: none;*/
/*	position:absolute;*/
/*	top: 30px;*/
/*	right:0px;*/
/*	width:150px;*/
/*	background-color: white;*/
/*	z-index: 30;*/
/*	border: 1px solid #CBCBCB;*/
/*	font-size: 16px;*/
/*}*/


.account_menu{
	display: none;
	position:absolute;
	top: 5px;
	right:-20px;
	width:150px;
	background-color: white;
	z-index: 30;
	border: 1px solid #CBCBCB;
	font-size: 16px;
}

/*.account_menu a:hover {background-color: #ddd;}
.account_menu_pack:hover .account_menu {
	display: block;
}*/

.account_menu_pack:hover .account_menu_button {
	color: var(--main-color);
	background-color: rgba(60,60,60,0.5);
	cursor: pointer;
}

.account_menu_entry{
	/*font: 13px 'Open Sans', sans-serif;*/
	font: 14px 'Raleway', sans-serif;
	color:#333;
	padding:5px 5px 5px 10px;
	/*border-right: 1px solid #BBB;*/
	/*font-weight: bold;*/
	font-weight: 400;
	/*background-color: #FFF;*/
	background-color: rgba(255,255,255,0.3);
	height: 30px;
	transition: 0.2s;
}

.account_menu_entry:hover{
	color: var(--main-color);
	/*background-color: #333;*/
	background-color: rgba(60,60,60,0.75);
	transition: 0.2s;
}

  /*
===================================================
# FLASH
===================================================
*/

.flash_border{
    z-index: 10;
    position: absolute;

    width: 900px;
	height: 500px;
    margin-left: -450px;
    left: 50%;
    top: 200px;


}

.announcement{
    position: absolute;
    width: 500px;
    left: 50%;
    margin: -250px;
    top: 470px;

    background-color: #275068;
    color: #FFF;
    border-radius: 5px;
    padding: 10px;
    font-size: 14px;
    display: flex;

    justify-content: left;
    box-shadow: 0 3px 5px rgba(0,0,0,0.4);
}

.cookie_warning{
	background-color: #272727;
    color: #FFF;
	border-radius: 10px;
	font-size: 16px;
	display: flex;
	justify-content: left;
	padding: 10px;
}

.cookie_button_no{
	 border: none;
	border-radius: 15px;
    color: white;
    padding: 10px 50px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
	background: #ba2a2f;
	margin: 5px 20px;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

.cookie_button_yes{
	 border: none;
	border-radius: 15px;
    color: white;
    padding: 10px 50px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
	background: #3c8e2d;
	margin: 5px 20px;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

.flash,.flash_success,.flash_warning,.flash_error,.flash_message,.flash_dark, .flash_send_mail{
    color: #550000;
    position: relative;
    border-radius: 10px;
    padding: 20px;
    /*min-height: 300px;*/
    font-size: 20px;
    display: flex;

    justify-content: left;
    /*box-shadow: 0px 0px 15px rgba(0,0,0,0.4);*/
}

.flash_send_mail{
    background-color: #e6e6e6;
    color: #555555;
    border: 0px solid #3c8e2d;
}

.flash_success{
    color: #e6e6e6;
    background-color: #555555;
    border: 0px solid #3c8e2d;
}

.flash_warning{
    background-color: #a9b9d4;
    color: #FFF;
    border: 0px solid #3c576d;
}

.flash_dark{
    background-color: #272727;
    color: #FFF;
}

.flash_error{
    background-color: #9b5052;
    color: #FFF;
    border: 0px solid #ba2a2f;
}

.flash_message{
    background-color: #a2a2a2;
    color: #FFF;
    border: 0px solid #ffffff;
}

.flash_button_warning, .flash_button_error,.flash_button_message, .flash_button_success, .flash_button_send_mail{
    border: none;
	border-radius: 15px;
    color: white;
    padding: 10px 114px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

.flash_button_send_mail{
	/*background: #3c8e2d;*/
	background-image: linear-gradient(to right, #034000, green);
}

.flash_button_send_mail:hover{
	/*background: #3c8e2d;*/
	cursor: pointer;
	background-image: linear-gradient(to right, #036000, #009e00);
}

.flash_button_warning{
    background: #ba2a2f;
}
.flash_button_error{
    background: #ba2a2f;
}
.flash_button_message{
    background: #666666;
}
.flash_button_success{
    background: #3c8e2d;
}
/* ===================================== */

A.link_button{
	padding:1px 10px 1px 10px;
	margin: 2px;
	color: #FFF;
	border-radius: 6px;
	background-color: #1d73a8;
	cursor: pointer;
	background-image: linear-gradient(to right, var(--main-color), var(--main-color2));
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

A.link_button:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
}

form{
	padding:0px;
	margin: 0px;
}

h2{
	padding:0px;
	margin: 0px;
}

span{
	padding: 0;
	margin: 0;
}

A
{
/*font-family: Helvetica;*/
/*font-size:20px; font: 16px 'Open Sans', sans-serif;*/
text-decoration:none;
border-width:0px;
color: #1f6192;
}

img.poster{
	height: 290px;
	margin: 10px;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}

.header_bar{
	grid-area: header;
	display: flex;
	flex-direction: row;

	/*border-bottom:1px solid #BBB;*/
	/*background-color: rgba(0,0,0,0.4);*/
	background-color: rgb(81, 81, 81);
	/*border-radius: 15px;*/
	/*box-shadow: 0px 2px 3px rgba(0,0,0,0.25);*/
	/*background-color: #222*/
	/*box-shadow: 0px 2px 10px rgba(0,0,0,0.2);*/
	padding: 5px;
}

.notification_dot{
	position:relative;
	background-color: #ff8700;
	border-radius: 3px;
	height:6px;
	width:6px;
}

/*.vid_list_burger{*/
/*	padding: 3px;*/
/*	margin: 3px;*/
/*	width: 40px;*/
/*	text-align: center;*/
/*	border-radius: 5px;*/
/*	!* border: 1px solid #777; *!*/
/*	background-color: #FFF;*/
/*	box-shadow: 0px 2px 10px rgba(0,0,0,0.2);*/
/*	cursor: pointer;*/
/*}*/

/*.vid_list_burger:hover{*/
/*	background-color: #666;*/
/*}*/

.vid_list{
	width:340px;
	min-width: 350px;
	display: flex;
	flex-direction: column;
	flex-grow:0;
	flex-shrink: 1;
	/*background-color:#FFF;*/
	/*background-color: rgba(255,255,255,0.6);*/
	/*background-color: rgba(50,50,50,0.1);*/
	/*background-color: #e6e6e6;*/
	overflow: auto;
	z-index: 10;
}

.header{
	/*font: 28px 'Open Sans', sans-serif;*/
	font-size: 28px;
	font-weight:bold;
	color: #333;
	border-bottom: 3px solid var(--main-color);
}

div.headline{
	font-size: 24px;
	/*font: 24px 'Open Sans', sans-serif;*/
	font-weight:bold;
	color: #333;
	width: 100%;
	display: flex;
	justify-content: space-between
}

div.vid_length{
	color: #777;
	width: 35px;
	text-align: right;
	font-size:11px;
	font-weight: normal;
	font-family: "Raleway";
	/*font: 12px 'Open Sans', sans-serif;*/
}

div.subtopic_length{
	color: #8d8d8d;
	font-size:11px;
	font-weight: Normal;
	height: 20px;
	text-align: right;
	vertical-align: bottom;
}

div.add_box{
	width: 300px;
	border:2px solid #DDD;
	border-radius: 5px;
	padding: 10px;
}

div.info{
	font-size: 14px;
	color: #666;
}

font.big{
	font-size: 20px;
	font-weight:bold;
	border-bottom: 2px solid var(--main-color);
	color: #333;
}

div.description{
	font-size: 14px;
	color: #333;
}

.list_arrow{
	width:2px;
	background-color: #FFF;
	cursor: pointer;
	height:80px;
	position:relative;
	left:0px;
	top:200px;

	border-radius: 0px 10px 10px 0px;
	background-image: url("/static/img/chevron-left-12.png");
	background-position: right center;
	background-repeat: no-repeat;
}

.list_arrow:hover{
	background-color: #BBB;
}

A.dark
{
color: #666666;
}

A.orange
{
color: var(--main-color);
}

.hidden{

}

.search_button
{
	margin-top:1px;
	margin-right: 2px;
	border-radius:13px;
	background: None;
	box-shadow: None;
}
.search_button:hover
{
	background-color: orange;
}

.topics
{
	font-size: 15px;
	font-family: 'Open Sans', sans-serif;
	/*font-family: 'Raleway', sans-serif;*/
	text-decoration: none;
	font-weight: normal;
	color: #494949;
	margin-bottom:0px;
	/*line-height: .6;*/
	padding: 10px 2px 3px 2px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	/*border-left: 1px solid #BBB;*/
	/*background-color: #FFF;*/
	background: rgb(253, 253, 253);
	/*background-image: linear-gradient(var(--main-color2) 0 0);*/
	/*background-size: 100% 0%; !* .08em is our fixed height; modify as needed. *!*/
	/*background-position: left bottom;*/
	/*background-repeat: no-repeat;*/
	/*transition: background-size .2s;*/
	/*background: linear-gradient(#050505 0 0) var(--p, 0) / var(--p, 0) no-repeat;*/
	/*box-shadow: 0px 1px 4px rgba(0,0,0,0.2);*/
	min-width: 100px;
	flex: 1 1 auto;
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
	border-right: 1px solid #eeeeee;
	transition: .4s;
}

.topics_off
{
	font-size: 15px;
	font-family: 'Open Sans', sans-serif;
	/*font-family: 'Raleway', sans-serif;*/
	text-decoration: none;
	font-weight: normal;
	color: #BBB;
	margin-bottom:0px;
	/*line-height: .6;*/
	padding: 10px 2px 3px 2px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	/*border-left: 1px solid #BBB;*/
	/*background-color: #FFF;*/
	background: rgb(253, 253, 253);
	/*background-image: linear-gradient(var(--main-color2) 0 0);*/
	/*background-size: 100% 0%; !* .08em is our fixed height; modify as needed. *!*/
	/*background-position: left bottom;*/
	/*background-repeat: no-repeat;*/
	/*transition: background-size .2s;*/
	/*background: linear-gradient(#050505 0 0) var(--p, 0) / var(--p, 0) no-repeat;*/
	/*box-shadow: 0px 1px 4px rgba(0,0,0,0.2);*/
	min-width: 100px;
	flex: 1 1 auto;
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
	border-right: 1px solid #eeeeee;
	transition: .4s;
}

p.topic_elem{
	margin:0px;
	padding:3px;
}

.topics_vex
{
	background: rgb(245, 245, 245);
}

.topics_active
{
	background: #e1e1e1;
}

@media screen and (min-width: 0px) and (max-width: 800px) {
	.topics{
		padding: 3px 3px 3px 3px;
	}
}


.topics:hover
{
	/*background: rgba(34,34,34,1.0);*/
	/*color: var(--main-color);*/
	background: var(--main-color);
	/*transition: background-size .3s, background-position .3s;*/
    /*background-size: 100% 100%;*/
    /*background-position: !* ??? *!;*/
	/*letter-spacing:0.1em;*/
	/*word-spacing:0.1em;*/
	transition: .2s;
}

.topics_locked
{
	font-size: 18px;
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: bold;
	color:#333;
	margin-bottom:0px;
	padding: 3px 20px 3px 20px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	border-left: 1px solid #BBB;
	background-color: rgba(255,255,255,1.0);
	flex: 1 1 auto;
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
}

.banner{
	height: 200px;
	display: flex;
	flex-direction: row;
	border-bottom:1px solid #BBB;
	//background-color: #cccccc;
	background-attachment: fixed;
	background-position: center bottom;
}

div.subtopics
{
	/*font: 24px arial, sans-serif;*/
	font-size: 13px;
	font-family: Montserrat; /*'Open Sans', sans-serif;*/
	text-decoration: none;
	font-weight: bold;
	color:#333;
	margin-bottom:0px;
	line-height: 1;
	padding:13px 5px 5px 15px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	/*border-bottom: 1px solid #BBB;*/
	/*background-color: #FFF;*/
	background-color: rgba(255,255,255,0.9);
	box-shadow: 0px 1px 4px rgba(0,0,0,0.2);
	/*width: 300px;*/
	cursor: pointer;
}

.subtopics:hover{
    background-color: #888;
	color: var(--main-color);
}

A.topbar{
	color: #FFF;
	font-size: 14px;
	text-decoration: none;
	font-weight: bold;
	line-height: .6;
	padding:5px;
	letter-spacing:0.002em;
	word-spacing:0.01em;
	flex: 1 1 auto;
}

A.topbar:hover {
	color: var(--main-color);
	/*background-color: #333;*/
	/*background-color: red;*/
	background-color: rgba(30,30,30,0.5);
}

.logout{
	color: #FFF;
	font: 16px 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: bold;
	line-height: .6;
	letter-spacing:0.002em;
	word-spacing:0.01em;
}

.logout:hover {
	color: var(--main-color);
	background-color: #333;
}

/*b{
color: #DDDDDD;
}*/

.menu_entry{
	/*font: 13px 'Open Sans', sans-serif;*/
	font: 12px 'Raleway', sans-serif;
	color:#333;
	padding:3px;
	/*border-right: 1px solid #BBB;*/
	/*font-weight: bold;*/
	font-weight: 400;
	/*background-color: #FFF;*/
	background-color: rgb(236, 236, 236);
	height: 25px;
	transition: .1s;
}

.menu_entry_placeholder{
	font: 14px 'Raleway', sans-serif;
    background-color: #c3dff7;
	height: 35px;
	font-weight: bold;
}

.menu_entry:hover{
	color: var(--main-color);
	/*background-color: #333;*/
	background-color: rgba(30,30,30,0.75);
	transition: .2s;
}

.menu_entry_locked{
	/*color:#888;*/
	background-color: rgba(185,185,185,0.4);
	color: transparent;
    /*blurred*/
	text-shadow: 0 0 1px rgba(0,0,0,0.5);

	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
	transition: .2s;
}
.menu_entry_locked:hover{
	color: transparent;
    text-shadow: 0 0 0px rgba(0,0,0,0.5);
	background-color: rgba(185,185,185,0.4);
	transition: .2s;
}

.hover
{
	cursor: pointer;
	transition: .2s;
}

.hover:hover{
	/*background-color: #333;*/
	background-color: var(--main-color);
	transition: .2s;
}

.menu_entry_current{
	background-color: rgb(255, 202, 103);
}

.menu_bad{
	color: #6c0900;
	background-color: #ffdada;
	height: 35px;
}

.menu_inactive{
	background-color: #ff858c;
	height: 35px;
}

.saturate_mouseover
{
	-webkit-filter: saturate(0);
   filter: saturate(0);
}

.saturate_mouseover:hover
{
	-webkit-filter: saturate(1);
   filter: saturate(1);
}
/* =========================== */

.progress_diagram
{
	display: flex;
	flex-direction: row;
	margin:10px;
	padding:10px;
}

.progress_circle
{
	height:20px;
	width:20px;
	background-color: #BBB;
	border-radius: 15px;
	z-index:2;
}

.progress_circle_active
{
	background-color: var(--main-color);
	z-index:2;
}

.progress_line
{
	height:6px;
	width:130px;
	margin: -4px;
	margin-top:8px;
	background-color: #BBB;
}

.progress_line_active
{
	height:6px;
	background-color: var(--main-color);
	z-index:1;
}


/* =========================== */

.landing_screenshot{
	padding:0px;
	border-radius: 10px;
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

#slideshow {
    margin: auto;
    position: relative;
    /*width: 750px;
    height: 500px;*/
    padding: 0px;
    /*border-radius: 10px;*/
	/*box-shadow: 0px 3px 15px rgba(0,0,0,0.2);*/
}

#slideshow > div {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.price_box{
	display: flex;
	color: #3A3A3A;
	flex-direction: column;
	justify-content: stretch;
	font-size: 14px;
	margin: 10px;
	border-radius: 10px;
	width: 260px;
	min-height: 500px;
	border: 1px solid #CBCBCB;
	background-color: #e8e8e8;
	/*background-color: rgba(0, 21, 40, 0.3);
	box-shadow: 0px 2px 10px rgba(0,0,0,0.2);*/

	/*background-color: #FFF;*/
	/*border: 1px solid #707070;/
	/*box-shadow: 0px 3px 15px rgba(0,0,0,0.2);*/
}

.month_button{
	padding:8px 30px 8px 30px;
	margin: 5px;
	/*font-weight: 300;*/
	color: #FFF;
	border-radius: 15px;
	background-color: #1d73a8;
	cursor: pointer;
	background-image: linear-gradient(to right, var(--main-color3), var(--main-color2));
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
	transition: 0.2s;
}

.month_button:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
	/*font-weight: bold;*/
	transition: 0.2s;
}

.month_button_inactive{
	padding:8px 30px 8px 30px;
	margin: 5px;
	color: #FFF;
	border-radius: 15px;
	cursor: pointer;
	/*background-image: linear-gradient(to right, var(--main-color3), var(--main-color2));*/
	/*box-shadow: 0px 3px 15px rgba(0,0,0,0.2);*!*/
	transition: 0.2s;
}

.month_button_inactive:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
	/*font-weight: bold;*/
	transition: 0.2s;
}

.price_button{
	padding:3px 10px 3px 10px;
	margin: 5px;
	color: #FFF;
	border-radius: 20px;
	background-color: #1d73a8;
	cursor: pointer;
	background-image: linear-gradient(to right, var(--main-color3), var(--main-color2));
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
	transition: 0.2s;
}

.price_button:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
	/*font-weight: bold;*/
	transition: 0.2s;
}

.price_button2{
	padding:5px 10px 5px 10px;
	margin: 10px;
	font-size: 16px;
	color: #FFF;
	border-radius: 7px;
	background-color: #1d73a8;
	cursor: pointer;
	text-align:center;

	background-image: linear-gradient(to right, var(--main-color3), #fea724, var(--main-color3));
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
	transition: .2s;
}

.price_button2:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
	/*font-weight: bold;*/
	transition: 0.2s;
}

.price_button_disabled{
	padding:5px 10px 5px 10px;
	margin: 10px;
	text-align: center;
	color: #f0f0f0;
	border-radius: 8px;
	background-color: #717171;
}

.checkout_bar{
	//border-top: 1px solid white;
	border-radius: 3px;
	width:98%;
	display:flex;
	justify-content: space-between;
	vertical-align: bottom;
	margin:2px;
	padding:5px;
}

.checkout_payment_frame{
	width:50%;
	border-style:solid;
	border-color: grey;
	border-width: 2px;
	border-radius: 10px 10px 30px 10px;
	margin: 5px;
	padding:10px;
}

.checkout_payment_label{
	border-style:solid;
	border-color: grey;
	border-width: 2px;
	border-radius: 10px 20px 20px 10px;
	color: white;
	font-weight: bold;
	font-size: 14px;
	position: relative;
	top: -20px;
	left: 10px;
	background-color: grey;
}

.stripe_button{
	cursor:pointer;
	width: 100%;
	height:45px;
	color: black;
	background-color: #4bb6ff;
	border-radius:20px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}

.stripe_button:hover{
	background-color: #77bfff;
	color: black;
}

.paypal_button{
	cursor:pointer;
	width: 100%;
	height:45px;
	color: black;
	background-color: #ffc439;
	border-radius:20px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}

.paypal_button:hover{
	background-color: #ffe066;
	color: black;
}
/* ========================== */

@keyframes icon_appear {
  0%   {opacity: 0;}
	20%   {opacity: 0;}
  100% {opacity: 0.5;}
}

.icon{
	font: 8px 'Open Sans', sans-serif;
	font-weight: bold;
	border: 1px solid grey;
	border-radius: 5px;
	padding: 0px 2px 2px 2px;
	height:9px;
}

.icon_new{
	font: 7px 'Open Sans', sans-serif;
	font-weight: bold;
	color: #FFF;
	padding: 2px;
	border: 0;
	border-radius: 5px;
	height:9px;
	background-color: #a73233;
	animation-name: icon_appear;
  	animation-duration: 2s;
	//animation-delay: 2s;
	opacity: 0.5;
}

.icon_update{
	font: 7px 'Open Sans', sans-serif;
	font-weight: bold;
	color: #FFF;
	padding: 2px;
	border: 0;
	border-radius: 5px;
	height:9px;
	background-color: #3c65a7;
	animation-name: icon_appear;
  	animation-duration: 3s;
	//animation-delay: 3s;
	opacity: 0.5;
}

.icon_free{
	font: 7px 'Open Sans', sans-serif;
	font-weight: bold;
	color: #FFF;
	padding: 2px;
	border: 0;
	border-radius: 5px;
	height:9px;
	background-color: #489d62;
	animation-name: icon_appear;
  	animation-duration: 4s;
	//animation-delay: 4s;
	opacity: 1;
}

.admin_icon{
	font: 10px 'Open Sans', sans-serif;
	color: red;
	border: 1px solid red;
	border-radius: 3px;
	//width:12px;
	height:12px;
	vertical-align: center;
	text-align: center;
}

.houdini_node{
	border: 0px solid #d6d6d6;
	border-radius: 8px;
	color: #FFF;
	background-color: #9d9d9d;
	padding: 1px 5px 1px 5px;
	float: none;
	margin: 0px;
}

/* ========================= */

.tabs_menu{
	font-size: 14px;
	border-radius: 20px 20px 0px 0px;
	padding: 0px 20px 0px 20px;
	background-color: #FFF;
	cursor: pointer;
}

.tabs_menu_inactive{
	background-color: #DDD;
}

.tabs_menu:hover{
	color: var(--main-color);
}

/* ========================= */

.background_box{
	height:auto;
	color: #9f9f9f;
	/*//display: inline-block;*/
	background-color: rgb(239, 239, 239);
	/*background-color: rgba(0, 21, 40, 0.35);*/
	border-radius: 10px;
	box-shadow: 0px 2px 10px rgba(0,0,0,0.2);
	padding: 10px;
	margin: 10px;
}

.foreground_box{
	height:auto;
	color: #777777;
	/*//display: inline-block;*/
	background-color: rgb(243, 243, 243);
	/*background-color: rgba(0, 21, 40, 0.35);*/
	border-radius: 10px;
	box-shadow: 0px 2px 20px rgba(0,0,0,0.3);
	padding: 10px;
	margin: 10px;
}

.bb_bright{
	border-radius: 10px;
	padding: 10px;
	margin: 10px;
	background-color: rgb(255, 255, 255);
	box-shadow: 0px 2px 10px rgba(0,0,0,0.2);
}

.dashboard_window
{
	background-color: rgb(251, 251, 251);
	padding: 10px 15px 15px 15px;
	border-radius: 15px;
	margin: 10px;
	flex-grow: 1;

	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
	/*font-family: 'Raleway', sans-serif;*/
	text-decoration: none;
	font-weight: normal;
	color: #858585;
	/*box-shadow: 0px 2px 10px rgba(0,0,0,0.2);*/
}

label.login{
	font: 16px 'Open Sans', sans-serif;
	/*font-weight: bold;*/
	color: rgba(255,255,255,0.75);
	padding:10px;
}

input.min{
	padding: 1px;
	border-radius: 0px;
	font-size:12px;
}

old.input.login{
	font: 16px 'Open Sans', sans-serif;
	//font-size: 24px;
	color: rgba(255,255,255,0.75);
	//color:red !important;
	//background:none !important;
	//border-bottom: 1px solid rgba(255,255,255,0.75);
	border: 0px;
	border-radius: 0px;
	padding:3px 5px 4px 5px;
	box-shadow: 0px 0px 0px rgba(0,0,0,0);
	background-color:transparent;
}

input.login{
	font: 16px 'Open Sans', sans-serif;
	/*font-size: 24px;*/
	/*color: rgba(255,255,255,0.75);*/
	color: #272727;
	/*color:red !important;*/
	/*background:none !important;*/
	/*border-bottom: 1px solid rgba(255,255,255,0.75);*/
	border: 0px;
	border-radius: 15px;
	font-size: 15px;
	padding:5px 8px 5px 35px;
	box-shadow: 0px 0px 0px rgba(0,0,0,0);
	background-color: #f3f3f3;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px #cce7fb inset !important;
	font-size: 15px;
	-webkit-text-fill-color: black !important;
}

.profile_input{
	margin-top:5px;
	font-size:16px;
	background-color: #ededed;
	border-radius: 15px;
	padding: 5px 10px 5px 10px;
}

.checkbox{

  height: 20px;
  width: 20px;
  background-color: #eee;
}


.login_button{
	/*font: 18px 'Open Sans', sans-serif;*/
	padding: 4px 80px 4px 80px;
	min-width: 300px;
	border-width: 0px;
	border-radius: 15px;
	/*width: 200px;*/
	color: #FFF;
	/*font-weight: bold;*/
	background-image: linear-gradient(to right, var(--main-color), var(--main-color2));
	box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}

ul.pricelist{
	list-style-image: url('/static/img/checkmark-16.png');
}

input.login_button:hover{
	background-image: linear-gradient(to right, var(--hover-color1), var(--hover-color2));
}

/*input:-webkit-autofill,*/
/*input:-webkit-autofill:hover,*/
/*input:-webkit-autofill:focus,*/
/*input:-webkit-autofill:active {*/
/*	!*color: white !important;*!*/
/*	!*font: 18px 'Open Sans', sans-serif;*!*/
/*	font: 14px 'Open Sans', sans-serif;*/
/*	color: rgba(133, 133, 133, 0.75);*/
/*	background-color:#FFF;*/
/*    !*transition: background-color 5000s ease-in-out 0s;*!*/
/*}*/

input,textarea
{
	font: 12px 'Open Sans', sans-serif;
	color: #333;
	/*background-color: #FFF;*/
	border-color: #AAA;
	background-color: rgba(255,255,255,0.6);
	/*background-color: transparent;*/
	border-width: 0px 0px 1px 0px;
	border-radius: 7px;
	padding:3px 5px 4px 5px;
	box-shadow: inset 0px 0px 10px rgba(0,0,0,0.05);
}

input.image{
	background-color: transparent;
	border-color: none;
	padding: 0;
}

textarea:focus, input:focus{
    outline: none;
}

input.small,textarea.small{
	font: 12px 'Open Sans', sans-serif;
	border-width: 0px;
	border-radius: 7px;
	padding:1px 2px;
	background-color: #DDD;
}

input.search_input
{
	background-color:#FFF;
	border-radius:13px;
	color:#7a7a7a;
	position:relative;
	top:-6px;
	font-size:12px;
	padding:2px 10px 2px 5px;
	border:0px;
	margin-top:0px;
	margin-left:8px;
	box-shadow: None;
}

button{
	padding: 3px 40px 3px 40px;
	border-width: 0px;
	border-radius: 7px;
	background-color: #DDD;
}

input.button{
	background-color: #DDD;
}

button:hover{
	background-color: #ffffff;
	color: #e49100;
}

input[type=checkbox] {
	border: dashed 1px #FFF;
    background-color:#191a1c;
}

table.td.darker
{
color: #999999;
}

td{margin:0px;padding:0px;font-size:12;}
tr:nth-child(even) {background: #cccccc}
tr:nth-child(odd) {background: #f0f0f0}
tr:hover td{
	background-color: #e1cdb4;
	color:red;
	//font-weight: bold;
}

form{
	margin:0px;
}

A.landing_changelog{
	color:white;
	font-size:13px;
}

A.landing_changelog:hover{
	color: #f3762b;
}

.unselectable{
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
}

.rating_star{
	font-size:20px;
	cursor: pointer;
}

.rating_star:hover{
	color:red;
}

.admin_status_button{
	padding:4px;
	background-color: #fffbed;
	cursor:pointer;
	border-radius: 5px;
	margin:3px;
}
.admin_status_button:hover{
	color:red;
}

.admin_status_green{
	color:white;
	background-color: #53ff38;
	font-weight: bold;
}

.admin_status_red{
	color:white;
	background-color:red;
	font-weight: bold;
}

.orange{
	color:orange;
}

div.logo
{
border:0;
padding: 0px;
margin: 0px;
height: 18px;
width: 180px;
}

div.menu
{
text-align:right;
vertical-align:bottom;
position:absolute;
float:left;
top:-70px;
height:70px;
width:70px;
background-color:#191a1c;
font-family: verdana;
font-size: 10px;
color: #FFFFFF;
}

.main_window_landing{
	grid-area: content / main;
	/*background-color: #FAFAFA;*/
	display:flex;
}