/* CSS Document */

body{
	margin: 5px;
	background-color: #333;
	color: white;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}

#table{
	display: block;
	width: 100%;
	position: relative;
}
	#table div.line1, #table div.line0{
		width: 100%;
		height: 20px; 
		line-height: 20px;
		background-color: #666;
		border-top: 1px solid #333;
		white-space: nowrap;
		overflow: hidden;
		display: block;
	}
	#table div.line0{
		background-color: #444;
	}
	
	#table span.col{
		padding-left: 5px;
		white-space: nowrap;
		overflow: hidden;
		display: block;
		float: left;
		width: auto;
	}
		#table span.col_bubble{
			width: 20px;
			float: left;
			display: block;
		}
		#table span.col_date{
			padding-left: 5px;
			float: left;
			white-space: nowrap;
			overflow: hidden;
			display: block;
		}
		#table span.col_haendler{
			padding-left: 5px;
			width: 70px;
			display: block;
			float: left;
			white-space: nowrap;
			overflow: hidden;
		}
	
  
		
		
		
		
		
		
		
		
		
		
		
@media screen and (max-width:320px){
	#table_t{
		max-width: 300px;
	}
		tr.line1, tr.line0{
			width: 100%;
			height: 20px; 
			line-height: 20px;
			background-color: #666;
			border-top: 1px solid #333;
		}
		tr.line0{
			background-color: #444;
		}
		
			td.col_bubble{
				min-width: 35px;
				width: 35px;
				border-top: 1px solid #333;
				color: black;
				text-align: center;
			}
			td.col_date{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				max-width: 100px;
				width: 100px;
				border-top: 1px solid #333;
			}
			td.col_haendler{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				border-top: 1px solid #333;
			}
			td.col{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				max-width: 270px;
				border-top: 1px solid #333;
			}
			td.col_tel{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				max-width: 75px;
				border-top: 1px solid #333;
			}
	
	
	p.login, h1.login{
		min-width: 290px;
		margin-bottom: 0px;
		margin-top: 0px;
		padding: 5px;
		font-family:Verdana, Geneva, sans-serif;
	}
	h1.login{
		text-align: center;
		width: 280px;
	}
	input, textarea, button{
		width: 300px;
		height: 22px;
		line-height: 22px;
		background-color: #e4eaec;
		border-top: 1px solid #d7dfe4;
		border-left: 1px solid #d7dfe4;
		border-right: 1px solid #e7ecee;
		border-bottom: 1px solid #e7ecee;
		padding: 5px;
		margin-top: 0px;
		font-size: 13px;
		font-family:Verdana, Geneva, sans-serif;
		color: #4d4d4d;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	select{
		width: 310px;
		height: 34px;
		line-height: 30px;
		vertical-align:middle;
		background-color: #e4e9ec;
		border: 1px solid #bbc2c8;
		padding: 5px;
		font-size: 13px;
		font-family:Verdana, Geneva, sans-serif;
		color: #4d4d4d;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		background-image: none;
		margin-bottom: 5px;
	}
	
	textarea{
		width: 298px;
		height: 109px;
	}
	
	button{
		width: 310px;
		height: 68px;/*34px;*/
		border: 0px;
		display: block;
		margin-top: 10px;
		background-color: #ff3333;
		color: white;
		text-shadow: 1px 1px 0px #333;
	}
	button:hover{
		background-color: #ee3333;
	}
}
@media screen and (min-width:321px){
		#table_t{
		max-width: 100%;
	}
		tr.line1, tr.line0{
			width: 100%;
			height: 20px; 
			line-height: 20px;
			background-color: #666;
			border-top: 1px solid #333;
		}
		tr.line0{
			background-color: #444;
		}
		
			td.col_bubble{
				min-width: 35px;
				width: 35px;
				border-top: 1px solid #333;
				color: black;
				text-align: center;
			}
			td.col_date{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				max-width: 100px;
				width: 100px;
				border-top: 1px solid #333;
			}
			td.col_haendler{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				border-top: 1px solid #333;
			}
			td.col{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				width: 100%;
				border-top: 1px solid #333;
			}
			td.col_tel{
				padding-left: 5px;
				white-space: nowrap;
				overflow: hidden;
				max-width: 75px;
				border-top: 1px solid #333;
			}
		p.login, h1.login{
		min-width: 290px;
		padding: 5px;
		margin-bottom: 0px;
		margin-top: 0px;
		font-family:Verdana, Geneva, sans-serif;
	}
	
	h1.login{
		text-align: center;
		width: 98%;
	}
	input, textarea, button{
		width: 97.5%;
		height: 22px;
		line-height: 22px;
		background-color: #e4eaec;
		border-top: 1px solid #d7dfe4;
		border-left: 1px solid #d7dfe4;
		border-right: 1px solid #e7ecee;
		border-bottom: 1px solid #e7ecee;
		margin-top: 0px;
		font-size: 13px;
		font-family:Verdana, Geneva, sans-serif;
		color: #4d4d4d;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	select{
		width: 100%;
		height: 34px;
		line-height: 30px;
		vertical-align:middle;
		background-color: #e4e9ec;
		border: 1px solid #bbc2c8;
		padding: 5px;
		font-size: 13px;
		font-family:Verdana, Geneva, sans-serif;
		color: #4d4d4d;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		background-image: none;
		margin-bottom: 5px;
	}
	
	textarea{
		width: 100%;
		height: 109px;
	}
	
	button{
		width: 100%;
		height: 68px;/*34px;*/
		border: 0px;
		display: block;
		margin-top: 10px;
		background-color: #ff3333;
		color: white;
		text-shadow: 1px 1px 0px #333;
	}
	button:hover{
		background-color: #ee3333;
	}

}