.employeesframe
{
}

/* ------------------------------ VÄNSTER KOLUMN ----------------------------------- */
.employeesleft
{
	width: 300px;
    background-color: #000000;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    color: white;
    padding-top: 30px;
    padding-left: 20px;
    padding-right   : 20px;
    float: left;
}
.employeeheading
{
    text-align: center;
    font-family: Arial;
    font-size: 20px;
    font-weight: bold;
    color: #ff9900;
}
.employeetd
{
	background-color: #336600;
	height: 30px;
	width: 60px;
	text-align: center;
	font-family: Arial;
	font-size: 20px;
	font-weight: bold;
	color: #ffffff;
}
.employeetdall
{
	background-color: #336600;
	height: 30px;
	width: 90px;
	text-align: center;
	font-family: Arial;
	font-size: 13px;
	font-weight: bold;
	color: #ffffff;
}
.employeetd:hover { background-color: #99cc66; color: #ff9900; }
.employeetdall:hover { background-color: #99cc66; color: #ff9900; }
.employeecount
{
    font-family: Arial;
    font-size: 10px;
    color: #ffffff;
}

/* ------------------------------ MITTEN KOLUMN ----------------------------------- */

.employeesmiddle
{
	width: 450px;
    background-color: #000000;
    height: 100%;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    color: white;
    padding-top: 30px;
    padding-left: 10px;
    padding-right: 10px;
    float: left;
}
.employeeletter
{
    text-align: center;
    font-family: Arial;
    font-size: 30px;
    font-weight: bold;
    color: #ff9900;
}
.employeetdname
{
	background-color: #99ccff;
	height: 20px;
	width: 200px;
	font-family: Arial;
	font-size: 20px;
	color: #000000;
	border-bottom: 1px solid black;
	margin-top:10px;
	padding-left: 5px;
}
.employeetdstatus
{
	height: 16px;
	width: 200px;
	font-family: Arial;
	font-size: 16px;
	color: #000000;
	border-bottom: 1px solid black;
	margin-top: 5px;
	padding-left: 5px;
}
.employeetdinfo
{
	height: 10px;
	width: 200px;
	font-family: Arial;
	font-size: 8px;
	color: #ffffff;
	padding-left: 5px;
}

/* ------------------------------ HÖGER KOLUMN ----------------------------------- */

.employeesright
{
	width: 500px;
	background-color: #000000;
	height: 100%;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: white;
	padding-top: 40px;
	padding-left: 10px;
	padding-right   : 10px;
	float: left;
}
.employeefile
{
	font-family: Arial;
	font-size: 16px;
	font-weight: bold;
	color: #ff9900;
}
.employeeinfocard
{
	position:absolute;
	z-index:2;
	width:300px;
}
.employeeinfotext
{
	position:absolute;
	z-index:3;
	width:300px;

}
.employeesecuritybgC
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background-color: transparent;
}
.employeesecuritybgB
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background-color: transparent;
}
.employeesecuritybgA
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background-color: transparent;
}
.employeesecuritybgA1
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background-color: #ffffff;
	border: 1px solid black;
	border-collapse: collapse;
}
.employeesecuritybgA2
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background:rgba(255,204,51,0.8);
	border: 1px solid black;
	border-collapse: collapse;
}
.employeesecuritybgA3
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background:rgba(102,0,0,0.8);
	border: 1px solid black;
	border-collapse: collapse;
}
.employeesecuritybgA4
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 147px;
	font-size: 14px;
	background:rgba(204,204,153,0.9);
	border: 1px solid black;
	border-collapse: collapse;
}