@import url("../common/bs_palette.css");

html{
	height:100%;
}
body {
	height:100%;
	font-family: BridgestoneType;
	font-size: 1.1rem;
	margin:0px;
	background-color: var(--bs_gray1);
	/*color: #333333;*/
}
header{
	box-sizing: border-box;
	width: 100%;
	height: 80px;
	padding: 5px 20px;
	position:fixed;
	z-index: 10;
    left:0;
	top: 0;
	vertical-align: middle; 
	white-space: nowrap;
	border-style: none none solid none;
	border-collapse: collapse;
	border-color: var(--bs_border_color);
	border-width: var(--bs_border_thin);
	background-color: var(--bs_white);
	background-image: url("../testreifen/img/bslogo.png");
    background-repeat: no-repeat;
    background-position: right top;
    background-attachment: fixed;
	
}
/*Override jquery ui style*/
.ui-state-disabled{
	opacity: .70;
}
/*nav buttons*/
.btn_head{
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 5px;
	padding-right: 5px;
}
.btn_head_dis{
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 5px;
	padding-right: 5px;
	background-color: var(--bs_button_pressed);
	color: var(--bs_font_color_inverted);
	border-color: var(--bs_border_color); 
	opacity: 1;
}
div.user_head{
	height: 3rem;
	box-sizing: border-box;
	display:table-cell;
	position: fixed;
	margin-top: -1rem;
	padding-top: 0.7rem; 
	padding-bottom: 0.3rem; 
	padding-left: 0.8rem;
	padding-right: 0.8rem;
	border-bottom: var(--bs_border_thin) solid var(--bs_border_color);
	border-left: var(--bs_border_thin) solid var(--bs_border_color);
	border-radius: 0px 0px 0px var(--bs_border_radius);
	right: 0;
	z-index: 7;
	background-color: var(--bs_white);
}

div.user_nav{
	height: 3rem;
	box-sizing: border-box;
	display:table-cell;
	position: fixed;
	margin-top: -1rem;
	padding-top: 0.7rem; 
	padding-bottom: 0.3rem; 
	padding-left: 0.8rem;
	padding-right: 0.8rem;
	border-bottom: var(--bs_border_thin) solid var(--bs_border_color);
	border-right: var(--bs_border_thin) solid var(--bs_border_color);
	border-radius: 0px 0px var(--bs_border_radius) 0px;
	left:0;
	z-index: 6;
	background-color: var(--bs_white);
}
main{
	box-sizing: border-box; 
	padding-left: 20px;
	padding-right: 20px;
	height: 100%;
	margin: 0px;
	width:100%;
	padding-bottom: 3rem;
	padding-top: 90px;
	/*position: relative;*/
		
}
footer{
	box-sizing: border-box;
	position:fixed;
	padding: 5px 20px;
	z-index: 3;
	height: 2.5rem;
    bottom:0;
    right:0;
	left:0;
	background-color: var(--bs_white);
	width: 100%;
	color: auto;
	white-space: nowrap;
	vertical-align: middle;
	border-style: solid none none none;
	border-collapse: collapse;
	/*border-collapse: separate;*/
	border-color: var(--bs_border_color);
	border-width: var(--bs_border_thin);
}

.overview th{
	vertical-align: middle;
	text-align: left;
	padding-left: 0.2rem;
	padding-right: 0.2rem;
	
}
.overview .link_spalte{
	max-width: 250px;
}
[id^="tool_link"]{
	width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.overview td{
	padding-left: 0.2rem;
	padding-right: 0.2rem;
	
}
table.overview{
	background-color: var(--bs_white);
	border: var(--bs_border_thin) solid var(--bs_border_color);
	/*width: 100%;*/
	max-width: 95%;
	padding: 0.2rem;
	border-collapse: collapse;
}
.overview td, .overview th{
	padding:0.3rem;
	border: var(--bs_border_thin) solid var(--bs_border_color);
}

h1{
	font-size: 1.8rem;
}

.txt_input{
	padding: .422em 0;
}
/*.ui-selectmenu {
  display:-moz-inline-stack;
  display:inline-block;
  zoom:1;
  *display:inline; /* To make IE7 happy  
} ​​​​​​*/
.select2-container .select2-selection--single{
	/*Originalwerte überschreiben*/
	height: 2.122em !important;
	/*padding: .422em 0;*/
}
.select2-selection__rendered {
	line-height: 2.122em !important;
}
.select2-selection__arrow{
	height: 2.1em !important;
}

.button-float-right{
	float: right;
}

.grid-container{
	display: grid;
	grid-template-columns: auto auto auto;
	/*grid-auto-rows: 1fr;*/
	column-gap: 20px;
	row-gap: 20px;
	background-color: var(--bs_white);
	padding: 20px;
	width: 1010px;
	border: var(--bs_border_thin) solid var(--bs_border_color);
	border-radius: var(--bs_border_radius);
	box-shadow: var(--bs_shadow);/*0 8px 20px rgba(0, 0, 0, 0.34);*/
}
.grid-container a{
	text-decoration: none;
	color: var(--bs_font_color);
}
.grid-item {
  background-color: var(--bs_white);
  width: 300px;
  height: 85px;
  border: var(--bs_border_thin) solid var(--bs_border_color);
  border-radius: var(--bs_border_radius);
  padding: 10px;
  text-align: left;
  
}
.grid-item:hover{
	background-color: var(--bs_gray5);
	color: var(--bs_font_color_inverted);
}

.grid-item-cat {
	background-color: var(--bs_gray2);
    font-size: 20px;
    font-weight: bold;
    height: 20px;
    border: var(--bs_border_thin) solid var(--bs_border_color);
	border-radius: var(--bs_border_radius);
    padding: 10px;
    text-align: center;
    grid-column: 1 / span 3;
  
}
/*zweiter container für rollentools*/
.role-grid-container{
	display: grid;
	grid-template-columns: auto auto auto;
	grid-auto-rows: 1fr;
	column-gap: 20px;
	row-gap: 20px;
	background-color: var(--bs_white);
	padding: 20px;
	width: 1010px;
	box-shadow: var(--bs_shadow);
}
.role-grid-container a{
	text-decoration: none;
	color: var(--bs_font_color);
}
.role-grid-item {
  background-color: var(--bs_white);
  width: 300px;
  border: var(--bs_border_thin) solid var(--bs_border_color);
  border-radius: var(--bs_border_radius);
  padding: 10px;
  text-align: left;
  
}
.role-grid-item:hover{
	background-color: var(--bs_gray5);
	color: var(--bs_font_color_inverted);
}
.role-grid-item .tool_list{
	text-align: left;
	font-size: smaller;
	background-color: var(--bs_gray5);
	color: var(--bs_font_color_invertedfont_color);
	position: absolute;
	padding: 15px;
	border: var(--bs_border_thin) solid var(--bs_border_color);
	border-radius: var(--bs_border_radius);
}