@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&display=swap');

html {
	font-family: "Open Sans",Arial,sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
	color: #333;
	text-rendering: optimizeLegibility;
}


/* material icons */ 

.material-icons { text-rendering: optimizeLegibility; }
.material-icons.mi-22 { font-size: 22px; }
.material-icons.mi-14 { font-size: 14px; }
.material-icons.mi-15 { font-size: 15px; }
.material-icons.mi-wh { color: rgb(255, 255, 255); }
.material-icons.mi-tc { color: #777; }
.material-icons.mi-headicon { position: relative; top: 7px; }		/* font icon in header */
.material-icons.mi-markericon { position: relative; top: 3px; }		/* font icon in markerbox */


/* tags */ 

INPUT { border: 1px solid #aaa; }

/* single styles */ 

.db		{ display: block; }
.dib	{ display: inline-block; }

.fl_l 	{ float: left; } 
.fl_r 	{ float: right; } 

.ta_l 	{ text-align: left; }
.ta_r 	{ text-align: right; }
.ta_c 	{ text-align: center; }

.pr 	{ position: relative; } 

.t_m2 	{ top: -2px; }
.t_m3 	{ top: -3px; }
.t_1 	{ top: 1px; }
.t_2 	{ top: 2px; }
.t_3 	{ top: 3px; }
.t_5 	{ top: 5px; }
.t_7 	{ top: 7px; }

.tc_blau  { color: #2196f3; } 
.tc_blau_imp  { color: #2196f3 !important; } 
.tc_white { color: #fff; } 
.tc_gruen { color: #006600; } 
.tc_rot { color: #BB0000; } 
.tc_hellgrau { color: #AAA; } 
.tc_grau { color: #888; } 
.tc_grau_imp { color: #888 !important; } 
.tc_hellgrau_imp { color: #AAA !important; } 

.ui_blau { color: #1e87f0; } 

.mr_8 	{ margin-right: 8px; }
.mr_10 	{ margin-right: 10px; }
.mr_15 	{ margin-right: 15px; }
.mr_16 	{ margin-right: 16px; }
.mr_32 	{ margin-right: 32px; }
.ml_0 	{ margin-left: 0px; }
.ml_2 	{ margin-left: 2px; }
.ml_4 	{ margin-left: 4px; }
.ml_8 	{ margin-left: 8px; }
.ml_16 	{ margin-left: 16px; }
.ml_32 	{ margin-left: 32px; }
.mt_0 	{ margin-top: 0px; }
.mt_0_imp 	{ margin-top: 0px !important; }
.mt_8 	{ margin-top: 8px; }
.mt_16 	{ margin-top: 16px; }
.mb_0 	{ margin-bottom: 0px; }
.mb_8 	{ margin-bottom: 8px; }
.mb_15 	{ margin-bottom: 15px; }
.mb_15_imp 	{ margin-bottom: 15px !important; }

.mr_1pro 	{ margin-right: 1%; }
.mr_3pro 	{ margin-right: 3%; }

.p_0	{ padding: 0px; }
.p_8 	{ padding-top: 8px; }
.pl_30 	{ padding-left: 30px; }
.pb_8  { padding-bottom: 8px; }
.pb_22  { padding-bottom: 22px; }
.pt_12_imp 	{ padding-top: 12px !important; }
.pt_pb_7_imp { padding-top: 7px !important; padding-bottom: 7px !important; }
.pt_pb_1rem { padding-top: 1rem; padding-bottom: 1rem; }

.b_dark { border: 1px solid #aaa; }
.b_red { border: 1px solid #bb0000; }

.bgc_white { background-color: #fff; } 
.bgc_blau { background-color: #2196f3; } 
.bgc_lightgrey { background-color: #ddd; } 
.bgc_lightred_imp { background-color: #fcc !important; } 
.bgc_lightyellow_imp { background-color: #f7e5bd !important; } 
.bgc_lightviolet_imp { background-color: #d6bdfe !important; } 
.bgc_lightgreen_imp { background-color: #b3f8ac !important; } 
.bgc_lightblue_hover:hover { background-color: #daedfd !important; border-radius: 15px; }

.fw_300 	{ font-weight: 300; }
.fw_400 	{ font-weight: 400; }
.fw_700 	{ font-weight: 700; } 

.fs_750rem	{ font-size: 0.75rem; }
.fs_850rem	{ font-size: 0.85rem; }

.invalid { border-color: red; background-color: #fff2f2; } 

.w_100 { width: 100%; } 
.w_85 { width: 85%; } 
.w_60 { width: 60%; } 
.w_50 { width: 50%; } 
.w_40 { width: 40%; } 
.w_32 { width: 32%; } 
.w_30 { width: 30%; } 
.w_10 { width: 10%; } 
.w_auto { width: auto; } 

.w_55px { width: 55px; } 
.w_60px { width: 60px; } 
.w_80px { width: 80px; } 

.h_100 { height: 100%; } 

.h_100px { height: 100px; } 
.h_110px { height: 110px; } 
.h_113px { height: 113px; } 
.h_150px { height: 150px; } 

.fd_row { flex-direction: row; }

.cp { cursor: pointer; } 

.ofx { overflow-x: hidden; } 

.mandatory { background-color: #fee !important; border: 1px solid #bb0000 !important; } 



/* containers */

DIV.uk-container-expand { padding-left: 0px; padding-right: 0px; } 

DIV.header-container { background-color: #2196f3; padding-top: 15px; padding-bottom: 15px; } 
DIV.header-left { width: 300px; margin: 0px; padding-left: 10px; padding-right: 0px; } 
DIV.header-left A:hover { color: #ddd; text-decoration: none; } 
/* DIV.header-right { width: 95%; } */
A.header_but_home { color: #fff; font-size: 1.25rem; border-radius: 15px; transition: 0.5s; padding-left: 17px; padding-right: 17px; }
A.header_but_home:hover { color: #333; background-color: #fff; }
A.header_but_navi { color: #fff; font-size: 1.25rem; border-radius: 15px; transition: 0.5s; padding-left: 17px; padding-right: 17px; }
A.header_but_navi:hover { color: #333; background-color: #fff; }
A.header_but_add { color: #fff; font-size: 1.25rem; border-radius: 15px; transition: 0.5s; padding-left: 17px; padding-right: 17px; }
A.header_but_add:hover { color: #333; background-color: #fff; }
A.header_but_trash { color: #fff; font-size: 1.25rem; border-radius: 15px; transition: 0.5s; padding-left: 17px; padding-right: 17px; }
A.header_but_trash:hover { color: #333; background-color: #fff; }
A.header_but_logout { color: #fff; font-size: 1.25rem; border-radius: 15px; transition: 0.5s; padding-left: 17px; padding-right: 17px; }
A.header_but_logout:hover { color: #333; background-color: #fff; }
A.header_but_icon { color: #fff; font-size: 1.25rem; border: 0px; transition: 0.5s; }
A.header_but_icon:hover { color: #ddd; }

DIV.main-container { padding-top: 0px; padding-bottom: 0px; } 
DIV.main-left { width: 260px; _background-color: #2196f3; margin: 0px; padding-left: 0px; _padding-right: 20px; border-right: 20px solid #2196f3; } 
DIV.main-right { padding-left: 2% !important; padding-right: 2% !important; }
DIV.navi-scroll-box { position: relative; height: 800px; overflow-y: scroll; } 
DIV.navi_headrow { background-color: #2196f3; color: #fff; font-weight: 700; padding-left: 10px !important; padding-top: 6px; padding-bottom: 6px; } 
DIV.navi_controw { background-color: #FFF; padding-left: 10px !important; padding-top: 6px; padding-bottom: 6px; } 
DIV.navi_finalrow { background-color: #2196f3; padding-top: 0px; padding-bottom: 0px; } 
DIV.navi_toggle_arrow { width: 30px; float: right; margin-right: 16px; } 

SPAN.filterwordbox 	{ background-color: #ccc; border-radius: 6px; margin-right: 10px; padding: 6px; } 
SPAN.filterword 	{ position: relative; top: 2px; font-weight: 400; }

DIV.listbox 	{ border: 1px solid #999; border-radius: 6px; }
DIV.listbox:hover { background-color: #daedfd; cursor: pointer; } 
DIV.listbox_markerrow { margin-top: 0px !important; padding-top: 0px; } 
DIV.listbox A.listbox_link { color: #333; text-decoration: none; } 

DIV.listbox_nohover 	{ border: 1px solid #999; border-radius: 6px; }
DIV.listbox_nohover A.title_link:hover { color: #1e87f0; text-decoration: underline; } 

DIV.listbox_nohover_noborder 	{ border-radius: 6px; }
DIV.listbox_nohover_noborder A.title_link:hover { color: #1e87f0; text-decoration: underline; } 

DIV.listbox_pic 	{ width: 153px; height: 100px; background-size: 100% auto; } 
DIV.view_pic 		{ width: 165px; height: 108px; background-size: 100% auto; } 
DIV.edit_pic 		{ width: 153px; height: 100px; background-size: 100% auto; } 
A.image_del 		{ position: relative; top: -44px; left: 4px; } 

DIV.markerbox_row 	{ width: 100%; display: inline-flex; flex-direction: row; } 
DIV.markerbox 	{ background-color: #ddd; border-radius: 4px; margin-right: 10px; padding: 4px; padding-top: 2px; width: auto; } 
SPAN.markerword 	{ position: relative; top: 1px; font-size: 0.75rem; }

DIV.borderbox 	{ border: 1px solid #999; border-radius: 6px; }

TABLE.settings_table 	{ margin-bottom: 0px; }
TABLE.settings_table TD	{ padding-top: 2px; padding-bottom: 2px; }

BUTTON.contbut { border-radius: 15px; }
BUTTON.contbut:hover { background-color: #daedfd !important; }

A.bluebut { background-color: #2196f3; border: 1px solid #2196f3; border-radius: 15px; font-size: 1.25rem; padding-left: 17px; padding-right: 17px; transition: 0.5s; }
A.bluebut:hover { opacity: 0.55; }

A.blueborderbut { color: #2196f3; border: 1px solid #2196f3; border-radius: 15px; font-size: 1.25rem; padding-left: 17px; padding-right: 17px; transition: 0.5s; }
A.blueborderbut:hover { opacity: 0.55; }

A.normalbut { border: 1px solid #2196f3; border-radius: 15px; font-size: 1.25rem; padding-left: 17px; padding-right: 17px; transition: 0.5s; }
A.normalbut:hover { background-color: #c6e4fc; }

DIV.ck-editor__editable { min-height: 400px !important; }

DIV.uk-tooltip { max-width: 400px !important; } 

DIV.clb_1 	{ border-left: 7px solid #4251B0; } 		/* colored left border for category "Think" */ 
DIV.clb_2 	{ border-left: 7px solid #1C97FE; } 		/* colored left border for category "Reise" */ 
DIV.clb_3 	{ border-left: 7px solid #F44236; } 		/* colored left border for category "Business" */ 
DIV.clb_4 	{ border-left: 7px solid #636363; } 		/* colored left border for category "KFZ" */ 
DIV.clb_5 	{ border-left: 7px solid #FF8800; } 		/* colored left border for category "Traum" */ 

/* containers for modal view */ 

IFRAME.modal { width: 920px; }
HTML.modal, BODY.modal { width: 920px; overflow-x: hidden; } 
DIV.modal-container { padding-top: 0px; padding-bottom: 0px; } 






/* former definitions, but maybe some of them are in effect */ 

DIV.navbar-container:not(.uk-navbar-transparent) { background: linear-gradient(to right, #2b3b4f, #556272); } 
UL.uk-navbar-nav LI A { color: #fff; font-size: 1.4rem; margin-right: 1.1rem; } 
DIV.uk-navbar-dropdown { background-color: #ddd; margin-top: 0px; width: 300px; opacity: 0.9; } 
UL.uk-navbar-dropdown-nav LI A { color: #111; font-size: 1.25rem; } 
A.navbar-button-apply { color: #fff; font-size: 1.25rem; border-radius: 15px; margin-left: 1.5rem; } 

DIV.splash-container { padding-top: 0px; padding-bottom: 0px; } 


DIV.main { width: 80%; } 
DIV.entry-row { font-weight: 400; background-color: #ddd; padding-top: 16px; padding-bottom: 16px; margin-top: 16px !important; } 
DIV.grey-area { background-color: #ddd; padding-top: 16px; padding-bottom: 16px; } 

INPUT.inp_nr 	{ width: 24%; margin-left: 1%; }
INPUT.inp_plz 	{ width: 24%; margin-right: 1%; }

BUTTON.but_height { height: 36px; } 
BUTTON.back-but { width: 60px; height: 36px; } 

INPUT 	{ color: #333 !important; font-weight: 400 !important; }
LABEL 	{ font-weight: 400; }




/* adjustments for NON-PHONE viewport */ 

@media all and (min-width: 768px) {

	A.header_but_home	{ display: none; }
	A.header_but_navi	{ display: none; }

}



/* adjustments for PHONE viewport */ 

@media all and (max-width: 767px) {

	DIV.header-left 				{ width: 33% !important; } 
	DIV.header-right 				{ min-width: 62% !important; max-width: 62% !important; float: right !important; } 
	DIV.header_right_right 			{ padding-left: 0% !important; } 
	DIV.header_right_paging_icons 	{ display: none; } 
	
	A.header_brand 					{ display: none; } 
	A.header_but_trash 				{ display: none !important; } 

	DIV.main-left 					{ display: none; position: relative; left: 0px; top: 70px; z-index: 99; }
	DIV.main-right 					{ margin-left: 5px !important; }

	A.hi_back 						{ margin-left: 15px; } 
	
	A.header_but_home, A.header_but_navi, A.header_but_add, A.header_but_trash, A.header_but_logout { 
		border: 0px !important; 
		padding-left: 3px !important; 
		padding-right: 3px !important; 
	} 
	
	DIV.listbox_col_left 			{ width: 100% !important; } 
	DIV.listbox_col_right 			{ width: 100% !important; } 
	IMG.listbox_first_img 			{ height: 48px !important; } 

	DIV.view_desc_col_left 			{ width: 100% !important; } 
	DIV.view_desc_col_right			{ width: 100% !important; } 
	DIV.view_settings_col_left 		{ width: 100% !important; } 
	DIV.view_settings_col_right		{ width: 100% !important; padding-left: 0px !important; } 
	IMG.view_img 					{ height: 80px !important; } 
	DIV.view_image_cell 			{ height: 94px; } 
	DIV.view_pic 					{ width: 100%; _width: 112px; height: 82px; background-size: 100% auto; } 

	SPAN.edit_info_uhrzeit 			{ display: none; }
	DIV.edit_desc_col_left 			{ width: 100% !important; } 
	DIV.edit_desc_col_right			{ width: 100% !important; margin-left: 0% !important; } 
	DIV.edit_desc_col_right TEXTAREA	{ height: 150px !important; margin-bottom: 4%; } 
	DIV.edit_settings_col_left 		{ width: 100% !important; } 
	DIV.edit_settings_col_right		{ width: 100% !important; padding-left: 0px !important; } 
	DIV.edit_image_cell 			{ height: 71px !important; }
	IMG.edit_img 					{ height: 80px !important; } 
	DIV.edit_pic 					{ width: 75%; _width: 90px; height: 59px; background-size: 100% auto; } 

}