* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  }
	.span_page_mask {
		position:relative;	/* This fixes the IE7 overflow hidden bug */
		clear:both;
		float:left;
		width:100%;			/* width of whole page */
		overflow:hidden;		/* This chops off any overhanging divs */
	}
	/* common column settings */
	.contmiddle,
	.contright,
	.colright {
		float:left;
		width:100%;
		position:relative;
	}
	.middle_content,
	.left_content,
	.right_content {
		float:left;
		position:relative;
		padding:0 0 0 0;
		overflow:hidden;
	}
	.three_col_style {
		background:#ffffff;		/* right column background colour */
    padding:0 0 0 0;
	}
	.three_col_style .contright {
		right:20%;			/* width of the right column */
		background:#ffffff;	/* center column background colour */
    padding:0 0 0 0;
	}
	.three_col_style .contmiddle {
		right:60%;			/* width of the middle column */
		background:#ffffff;		/* left column background colour */
    padding:0 0 0 0;
    display: -webkit-flex; /* Safari */
    -webkit-align-items: flex-start; /* Safari 7.0+ */
    display: flex;
    align-items: flex-start;    
	}
	.three_col_style .middle_content {
  align-self: center;
		width:59%;			/* width of center column content (column width minus padding on either side) */
		left:80%;			/* 100% plus left padding of center column */
    padding:0 0 0 0;
	}
	.three_col_style .left_content {
  align-self: center;
    text-align: right;
		width:20%;			/* Width of left column content (column width minus padding on either side) */
		left:80%;			/* width of (right column) plus (center column left and right padding) plus (left column left padding) */
    padding:0 0 0 0;
	}
	.three_col_style .right_content {
    align-self: center; 
    padding:0 0 0 0;
		width:20%;			/* Width of right column content (column width minus padding on either side) */
		left:80%;			/* Please make note of the brackets here:
						(100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
	}
  .left_content span {
    text-align: right;
    font-weight: bold; 
  }
  .middle_content textarea{
    font-family: Letter Gothic;
    font-size: 11px;
   
  }
  .tabelstyle { 
  display: table;
    text-align: center;
  }
  .tabelstyle div{
    display: table-cell;
    vertical-align: middle;
    padding-top: 30px;
  }
.tablesmallrows{
padding-top: 3px  !important;
}  
  .divColLeft{
    width: 140px;
    padding-right: 5px;    
    text-align: right;
    vertical-align:middle;
  }
  .divColRight{
    width: 600px;
    text-align: left;
    vertical-align:middle;
  }
  .divColVAlTop{vertical-align:top !important;}
  .labelbox {
   display: inline-block;
  font-weight: bold;
  text-align: right;
  width: 140px;
  padding-right: 5px;
  }
  .productprice{
    padding:0px 10px 0px 0px; 
    text-align:right; 
    width:80px; 
    display: inline-block;
  }
  .filter_border{
    border:2px solid #00C060 !important;
  }
  .filter{
    background-color:#80FF80 !important;    
  }
  .sn_filter{width:600px; height:190px; font-family:Letter Gothic; font-size:12px;}
  
.grid-chk{
  align-items: center;
  display: grid; grid-column-gap:8px; grid-row-gap:5px; grid-template-columns: 110px 110px 110px 110px 150px;
  display: -ms-grid; -ms-grid-columns: 110px 110px 110px 110px 110px; -ms-grid-rows: 20px;
  width:600px;
}
.grid-chk div{display:flex;align-items:center;}
.grid-chk_1{
  text-align: left; 
 grid-column:1; grid-row:1; 
-ms-grid-column:1;-ms-grid-row:1; 
}
.grid-chk_2{
  text-align: left; 
 grid-column:2; grid-row:1; 
-ms-grid-column:2;-ms-grid-row:1; 
}
.grid-chk_3{
  text-align: left; 
 grid-column:3; grid-row:1; 
-ms-grid-column:3;-ms-grid-row:1; 
}
.grid-chk_4{
  text-align: left; 
 grid-column:4; grid-row:1; 
-ms-grid-column:4;-ms-grid-row:1; 
}
.grid-chk_5{
  text-align: left; 
 grid-column:5; grid-row:1; 
-ms-grid-column:5;-ms-grid-row:1; 
}
.grid-main{align-items: top; display: grid; grid-column-gap: 5px; row-gap:5px; grid-template-columns: 140px 600px; padding-bottom:10px;}
.grid-main_left_1{text-align:right;  grid-column:1; grid-row:1;-ms-grid-column:1;-ms-grid-row:1; }
.grid-main_left_1 span{font-weight:bold;}
.grid-main_left_1 .keysv{padding-left:5px; padding-right:5px;}
.grid-main_right_1{text-align:left;  grid-column:2; grid-row:1;-ms-grid-column:2;-ms-grid-row:1; } 
.grid_input_desc{display: grid; grid-column-gap: 10px; row-gap:0px; grid-template-columns:140px 140px 80px 85px 30px;}
.grid_input_desc input{width:100%;}
.grid_input_desc_1_1{grid-column:1; grid-row:1;}
.grid_input_desc_2_1{grid-column:2; grid-row:1;}
.grid_input_desc_3_1{grid-column:3; grid-row:1;}
.grid_input_desc_4_1{grid-column:4; grid-row:1;}
.grid_input_desc_5_1{grid-column:5; grid-row:1;}
.grid_input_desc_1_2{grid-column:1; grid-row:2; font-family: Arial, Helvetica, Sans-Serif; font-size:10px;}
.grid_input_desc_2_2{grid-column:2; grid-row:2; font-family: Arial, Helvetica, Sans-Serif; font-size:10px;}
.grid_input_desc_3_2{grid-column:3; grid-row:2; font-family: Arial, Helvetica, Sans-Serif; font-size:10px;}
.grid_input_desc_4_2{grid-column:4; grid-row:2; font-family: Arial, Helvetica, Sans-Serif; font-size:10px;}
.grid_input_desc_5_2{grid-column:5; grid-row:2; font-family: Arial, Helvetica, Sans-Serif; font-size:10px;}
.highlight_red{color:red;}

.grid-main_3{padding-bottom:5px; align-items: top; display: grid; grid-column-gap: 5px; row-gap:5px; grid-template-columns: 140px 300px 300px;}
.grid-main_3_left{text-align:right;  grid-column:1; grid-row:1; -ms-grid-column:1;-ms-grid-row:1; }
.grid-main_3_left span{font-weight:bold;}
.grid-main_3_middle{text-align:left;  grid-column:2; grid-row:1;-ms-grid-column:2;-ms-grid-row:1; } 
.grid-main_3_right{text-align:left;  grid-column:3; grid-row:1;-ms-grid-column:3;-ms-grid-row:1;} 
.transfer_db{background-color:#0000F0; color:#FFFFFF; font-size:12px; font-weight:bold; width:100%; height:19px; text-align:center; padding-top:2px;}
  
.textarea_kunden{width: 100%;
	height: 140px;
	border: 1px solid #cccccc;
	padding: 0.5em;
	}  

.textarea_csv{width: 100%;
	height: 200px;
	border: 1px solid #cccccc;
	padding: 0.5em;
	}  
.download_after{text-align:right;}
.left_align{text-align:left;}    
.sp_week{background-color:#C0C0C0;width:50px; text-align:midddle;}
.sp_week span{padding-left:3px; padding-right:3px;}
.sp_table_weeks{margin-left:-50px;}
.sp_table_weeks th{text-align:center;}

.new_page{padding-top: 20px;}
.select_disabled{pointer-events:none; background-color:#F0F0F0;}

.col1{grid-column:1;}
.col2{grid-column:2;}
.col3{grid-column:3;}
.col4{grid-column:4;}
.col5{grid-column:5;}
.col6{grid-column:6;}
.col1-2{grid-column:1 / 3;}
.col1-3{grid-column:1 / 4;}
.col2-3{grid-column:2 / 4;}
.col2-4{grid-column:2 / 5;}
.col1-4{grid-column:1 / 5;}
.col3-4{grid-column:3 / 5;}
.row1{grid-row:1;}
.row2{grid-row:2;}
.row3{grid-row:3;}
.row4{grid-row:4;}
.row5{grid-row:5;}
.row6{grid-row:6;}
.row7{grid-row:7;}
.row8{grid-row:8;}
.row9{grid-row:9;}
.row10{grid-row:10;}
.row11{grid-row:11;}



.office_product_state{text-align: center; font-weight: bold; border-style: solid; border-width: 3px;}
.public{border-color: #ffffff;}
.repproduct{border-color: #ffffff;}
.internal{border-color: #000000;}
.notavailable{border-color: #f42158;}
.confidential{border-color: #f42158;}
.markdown li {padding-left:0px; margin-left:0px; list-style-type:disc;}
.markdown ul {padding-left:20px; margin-top:2px;}
.markdown p {margin-bottom:2px;}

#dialogoverlay{
	display: none;
	opacity: .8;
	position: fixed;
	top: 0px;
	left: 0px;
	background: #FFF;
	width: 100%;
	z-index: 10;
}
#dialogbox{
	display: none;
	position: fixed;
	background: #000;
	border-radius:7px; 
	width:550px;
	z-index: 10;
}
#dialogbox > div{ background:#FFF; margin:3px; }
#dialogbox > div > #dialogboxhead{ background: #666; font-size:19px; padding:10px; color:#CCC; }
#dialogbox > div > #dialogboxbody{ background: #c0c0c0; padding:20px; color:#000; }
#dialogbox > div > #dialogboxfoot{ background: #666; padding:10px; text-align:right; }