
.load_container { 
		z-index:500; position:fixed;  height:100%; width:100%; 
		padding: 0px;  background-color:white; opacity:0; top:0;
		visibility: hidden;  display:none; text-align:center;}
.load_image {top:300px;}

/* preview for big picture */
.imageBlock {display:none; visibility:hidden;min-width:400px; min-height:400px;width:100%; height:100%;	background-color:white;	cursor:pointer;}
.imageBlockImage {	cursor:pointer;}

/* content page */
.content_main_frame {	display:flex; 	flex-wrap: wrap; justify-content:row; }
.content_chapter_frame {display:auto; min-width:300px;     flex-grow:1; flex-shrink:1;	flex-wrap: wrap; justify-content:row; 	background-color:#fff;	padding:0.5em; margin:1em;	border-radius:25px;	border:darkblue solid 0.05em;}
.content_image_frame  {text-align:center; margin:1em;  }
.content_image_frame > img {background-color:white;	border-radius:5px;	border:solid 0.5px black; padding:0.5em;  cursor:pointer;}
.content_image_text {margin-top: 0.5em;text-align:center; padding:0.2em; 	font-style:italic; font-size:0.8em;margin-bottom:1em; }
.content_header_frame {display:row;}
.content_combination_list { margin-left:2em; }
.content_chapter_box {display:flex; 	flex-wrap: wrap;	justify-content:flex-start;	text-align:left;	padding:0.5em;}
.content_header_box {	padding:1em;  	margin:1em;	text-align:left;	border: 0.1em solid black;	border-radius:0.2em;	background-color:lavender;}
.content_title {font-size:2.5em;	color:darkblue; font-weight:bold;	padding:1em;	margin:1em;}
.content_chapter_title {	width:100%; font-size:1.5em;	color:darkblue; 	font-weight:bold;		display: flex;	padding:15px;  	margin:1em;}
.content_page {	background-color:#fff;	width:100%;}
.content_item {  flex-direction:row; flex-wrap:wrap;}
.content_text_frame {	padding:10px;  	margin:1em;	text-align:justify;}



.searchlist_sheet_table {display:table; margin-top: 1em; margin-bottom: 1em;}
.searchlist_sheet_row {padding: 0; font-size:12px; line-height:14pt; font-weight:bold;  text-align:center; vertical-align:middle; display: table-row;}
.searchlist_sheet_cell {display: table-cell; cursor:pointer; text-align:center; vertical-align:middle; width:3em;}
.searchlist_sheet_cell:hover { text-decoration:underline; cursor:pointer; }
.searchlist_search_field {padding:0.5em; width:90%;	max-width:600px;	font-size:18px; background-color: #eee; text-align:center; border-radius:5px;}	
.searchlist_data_input {width:650px; font-size:18px; line-height:20pt;}
.searchlist_main_frame{display: flex; flex-direction: column; font-weight:bold; width:90%; max-width:600px;}
.searchlist_list_frame {text-align: left; padding-top: 1em; padding-bottom: 1em; border-top: 0.1em solid black; border-bottom: 0.1em solid black; list-style-type: none;}
.searchlist_list_frame > li {cursor:pointer; font-weight: normal; color: blue; line-height:2.5; padding-left:1em; padding-bottom:1em; display:table-row;}
.searchlist_list_frame > li:hover {text-decoration:underline;}
.searchlist_list_boxes  {display: flex;justify-content: center;flex-wrap: wrap;}
.searchlist_list_box  {border-radius:2.5em;    margin: 2em; text-align: left; width: 16em; min-height:16em;}
.searchlist_box_content {padding-top: 0.5em; padding-left: 1em; padding-left: 1em; padding-right: 1em;}
.searchlist_box_content > div > ul {margin:0px; }
.searchlist_box_title {padding:0.5em; vertical-align:middle; font-size:0.8em; color:black; font-weight:bold;}

.searchlist_box_green { border:0.2em solid darkgreen; background-color:rgba(198, 255, 109,1); }
.searchlist_box_green:hover {background-color:rgba(198, 255, 109,.7); }
.searchlist_box_red {border:0.2em solid darkred; background-color:rgba(255, 161, 168,1);}
.searchlist_box_red:hover {background-color:rgba(255, 161, 168,.7);}
.searchlist_box_blue  {border:0.2em solid darkblue; background-color:rgba(95, 255, 255,1);}
.searchlist_box_blue:hover  {background-color:rgba(95, 255, 255,.7);}
.searchlist_box_yellow { border:0.2em solid darkyellow; background-color:rgba(249, 231, 159,1);}
.searchlist_box_yellow:hover {background-color:rgba(249, 231, 159,.7);}	
.searchlist_box_image {width:100%; color:blue; cursor:pointer; }
.searchlist_box_image:hover {text-decoration:underline;}
.image_thumbnail {max-height:15em; border: #444 solid 0.1em; }
.image_icon {margin-left:1.5 em; margin-right:0.5em; height:2.5em; width:2.5em;}
.text_published  {margin-left:0.5em; color:darkviolet;}


.information {
	padding:5px; background-color:darkblue; color:white; border-radius:5px;
}
.warning {
	padding:5px; background-color:darkred; color:yellow; border-radius:5px;
}
.confirmation{
	padding:5px; background-color:darkgreen; color:white; border-radius:5px;
}
.login-icon > img {
	width:53px; height:60px;
	background:url("../images/login_w_k.png") no-repeat; 
}
.login-icon > img:hover {
	background:url("../images/login_s_k.png") no-repeat; 
}
.link {cursor:pointer; color:blue;}
.link:hover {text-decoration:underline;}
 .inactive {color:white; font-weight:bold; background-color:darkred;  padding-bottom:0.2em;  padding-top:0.2em; padding-left:0.4em;  padding-right:0.4em; float:right; margin-right: 2em; border-radius:12px;}

.background_frame  {z-index:199; position:absolute; margin:0; height:100%; width:100%; background-color: white; opacity:0.7; }
.cookie_frame {z-index:200; position:absolute; margin:0; height:100%; width:100%; padding:20px; }
.cookie_box {z-index:200; background-color:#eee; margin-top:150px;  border:darkblue solid 4px; border-radius:15px;display: inline-block; padding:20px;}
.cookie_button {background-color: darkblue;color:white; }
.login_frame {z-index:200; position:absolute; margin:0; height:100%; width:100%; padding:20px; visibility: hidden;}
.login_box {z-index:200; background-color:#eee; margin-top:150px;   border:darkblue solid 2px; border-radius:15px; display: inline-block; padding:20px;}
.login_button {background-color: darkblue;color:white;}

.form_break {display: flex;flex-wrap: nowrap;	height:0px;	width:100%;}

.form_table {display: table; width:100%;  margin-top:20px; margin-bottom:20px;  border:  solid #888 2px; border-radius:5px;   background-color:#dddddd;  }
.form_row   {display:table-row; }
.form_cell   {display: table-cell;  padding: 1em; 	vertical-align:top;  border: solid white 1px; }
.form_cell:nth-child(1) { font-weight:bold; width:200px; text-align:left; margin-left:0px;} 	
.form_cell:nth-child(2) {text-align:left; margin-left:5px;} 

.inner_table { width:100%; }
.inner_cell:nth-child(1)   { vertical-align:top; }	
.inner_cell:nth-child(2)  		{text-align:right; padding-right:15px; width:20px; } 



.form_edit {float:left; width:40px; text-align:right;} 	

	display: flex;
	justify-content: center;
	flex-wrap: wrap;


.form_inner_cell { min-width:150px;  }	
.edit_cell {visibility:hidden; display:none;}	
.result_cell  { font-style:italic; }	
/* .result_cell:hover  {background-color:white; border-radius: 3px; background-color: white;}	*/

.button_cell {
	padding: 15px;
	vertical-align:top; 
	text-align:left;
}



.admin_list_button {margin-top:20px; margin-right:10px; margin-left:10px; }
.admin_button {margin-top:20px; margin-right:10px; margin-left:10px; float:left;}
.yellow_button {background-color: yellow; color:white; }
.orange_button {background-color: #c45f00; color:white;}
.green_button {background-color: darkgreen; color:white;}
.red_button {background-color: darkred; color:white; }
.blue_button {background-color: darkblue;color:white; }
.green_button {background-color: darkgreen;color:white; }
.grey_button {background-color: grey;color:white; }

.hidden_button {visibility:hidden; display:none;}
.show_button {visibility:visible; display:block;}
.table_list { border: solid 1px blue;  padding:1em; }
.table_form { border: solid 1px blue;  padding:1em; }
.table_list > div {text-align:left;  display: inline-block; }

.image_border {
	border-left: solid 5px #bbb;
	border-top: solid 5px #ddd;
	border-bottom: solid 5px #bbb;
	border-right: solid 5px #eee;	
}
.image_border:hover {
	border: solid 5px blue;
}
.image_frame {
	border:solid 0.5px silver; 
	text-align:center; 
	padding:2px;
	font-size:0.8em;
	font-style:italic;
	cursor:pointer;
}
.image_select {width:80%;}
.image_frame:hover .image_border{
	border: solid 5px blue;
	text-decoration
}
.image_frame:hover {
	text-decoration:underline;
}

.form_title {min-width:400px; padding: 8px; display: table-cell; background-color:blue; color:white; font-weight: bold; text-align: center; }
.form_submit { padding-top: 25px; padding-bottom: 15px; display: table-cell; }


.checkboxframe {
	padding: 0.6em;
	min-width:150px; 
	border-radius: 3px;
	width:100%;
	background-color: white;
}

.checkboxframe  hr {background-color:black;  border: 0; clear:both; display:block;  width: 100%;  height: 1px;}



input[type=checkbox] {margin-top:0.0em}
input[type=list]{
	padding: 0.5em;
	min-width:150px; 
	width:100%;
	border-radius: 3px;
	background-color: white;
}
input[type=text], input[type=password], input[type=datetime-local], input[type=date], input[type=number], select {
	padding: 0.5em;
	min-width:150px; 
	border-radius: 3px;
	width:100%;
	background-color: white;
}
textarea {
	padding: 0.5em;
	border-radius: 3px;
	width:100%;
	height:150px;
	background-color: white;	
	resize: vertical;
}
input::file-selector-button , input[type=button], input[type=submit], input[type=reset]{   
	font-weight: bold;
    padding: 0.3em;
    border: thin solid grey;
    border-radius: 5px;
	min-width:200px; 
	vertical-align:center;
	cursor:pointer;
	
}



.image_frame_element {
	padding: 0.6em;
	min-width:150px; 
	border-radius: 3px;
	width:100%;
	background-color: white;
	display: flex; 
	
	flex-direction: row;
	font-weight:normal;

	flex-wrap: wrap;
}

.image_box_element {
	float:left;
	font-style:italic;
	font-size:0.8em;
	margin: 0.5em;
	flex-grow: 0;
	cursor: pointer;
	text-align:center;
	border:solid 1px darkblue; border-radius:5px; background-color:lavender;
}


.image_frame_result {
	min-width:150px; 
	border-radius: 3px;
	width:100%;
	display: flex; 
	flex-direction: row;
	font-weight:normal;
	flex-wrap: wrap;
	
}

.image_box_result {
	float:left;
	font-style:italic;
	font-size:0.8em;
padding:0.3em;
	margin: 0.5em;
	flex-grow: 0;
	flex-shrink:1;
	cursor: pointer;
	text-align:center;
	border:solid 1.5px darkblue; border-radius:5px; background-color:lavender;
}


.image_box_background:hover {background-color:rgba(0,0,255,0.5); color:white;  }
.image_frame_upload {
	display: flex;
	flex-direction: row;
	font-weight:normal;
	justify-content: space-evenly;
	flex-wrap: wrap;
}
.image_box_upload  {
	display: flex;
	padding: 0.5em;
	margin:0.5em;
	flex-grow: 0;
	text-align: center;
	vertical-align:middle;
	border:solid 1px darkblue; border-radius:5px; background-color:lavender;
}

.admin_options_frame {
	display: flex;
	flex-direction: row;
	font-weight:normal;
	justify-content: space-evenly;
	flex-wrap: wrap;
	
}
.admin_options_box  {
	color:blue;
	cursor:pointer;
	padding: 1em;
	margin:1em;
	flex-grow: 1;
	display: table-cell;
	width: 300px;
	text-align: center;
	vertical-align:middle;
	border:solid 1px darkblue; border-radius:5px; background-color:lavender;
	height:5em;
}
.admin_options_box:hover {
	background-color:darkblue;
	color:white;
	text-decoration:underline;
}


.image_order {
	
	display: inline-block;
	
	
}

.order_arrow {
	margin:10px;
	display: inline-block;
	background-color:blue;
	border-radius:20px;
	width:30px;
	height:30px;
	cursor:pointer;
	color:lavender;
	font-weight:bold;
	font-size:1.5em;
	font-style:normal;
}
.order_arrow:hover {
	background-color:darkgreen;
}


.included_image {
border: solid darkgreen 3px;
background-color:green;
}
.not_included_image {
 border: solid darkred 3px; 
 background-color:red;
}



.image_pattern {
	display: flex;
	flex-direction: row;
	font-weight:normal;
	justify-content: space-evenly;
	flex-wrap: wrap;
	
	
}
.image_pattern > div {
	display: flex;
	flex-direction: row;
	float:left;
	margin: 0.4em;
	flex-grow: 1;
	
}


.image_link {
	vertical-align:middle;
	border: 3px darkgrey solid;
	border-radius:5px;
	cursor:pointer;

}
.image_link:hover {
	border: 3px blue solid;
	border-radius:5px;	
	cursor:pointer;
}


