html {
	height: 100%;
}
.clear { clear: both; }

body {
	color: #fff;
	background: #006ab3 url(../img/background_fade.png) fixed bottom left repeat-x;

	font-family: helvetica, arial, sans-serif;
	font-size: 13px;
	line-height: 19px;

	width: 503px;

	margin: 40px auto;
}

h1.thehub {
	height: 112px;
	width: 526px;

	background: url(../img/thehub.png) top left no-repeat;

	overflow: hidden;
	
	position: relative;
	left: -22px;
}

	h1.thehub span {
		position: absolute;
		top: -200px;
	}
h2.itswc {
	overflow: hidden;
	margin: 1.5em 0 0 0 !important;
}

	h2.itswc, h2.itswc a {
		height: 36px;
		width: 141px;
	}
	
	h2.itswc a, h2.itswc a:active {
		display: block;
		background: url(../img/itswc.png) top left no-repeat;
	}

	h2.itswc span {
		position: absolute;
		top: -200px;
	}

h2 {
	font-size: 14px;
	font-weight: bold;
	margin-top: 1em !important;
}

p, h2 {
	margin: 0.4em 0;
}

p.readme {
	font-weight: bold;
	font-size: 16px;
	line-height: 21px;
	
	margin-top: 0.4em;
}

p.intro {
	font-size: 16px;
	line-height: 21px;
}

a {
	color: #fff;
	text-decoration: none;
	
	border-bottom: 1px solid #4898CB;
}
	a:active {
		background: #005B9A;
		border-color: #60B5E7;
	}

#companies {
	margin: 2em 0;
	padding: 0;
	width: 510px;
}
	#companies {
		height: 180px;
		-webkit-transition: -webkit-transform 0.3s;
		-webkit-transform-style: preserve-3d;
	}
	#companies li, #companies li a {
		width: 120px;
		height: 54px;
		
		display: block;
	}
	#companies li {
		width: 120px;
		height: 54px;
		
		list-style: none;
		
		margin: 0 7px 7px 0;
		
		float: left;
	}
	
	#companies li a {
		background: #fff;
		overflow: hidden;
		border: 2px solid #fff;
		-webkit-transition-property: border-color, -webkit-box-shadow, margin-top, -webkit-transform;
		-webkit-transition-duration: 0.6s, 0.4s, 0.3s, 0.3s;
		
		width: 116px;
		height: 50px;
		background-position: -2px -2px;
	}
		#companies li a:hover {
			-webkit-transform: translate(0,-4px) rotate(-1deg);
			-webkit-box-shadow: 0 5px 5px rgba(0,0,0,0.33);
		}
		#companies li a:active {
			background-color: #e3eef5;
			-webkit-transform: scale(0.6) rotate(-2deg);
			-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.66);
		}

	#companies li a span {
		position: absolute;
		top: -1000px;
		left: -1000px;
		color: transparent;
	}
	
	#companies li.vagverket a {
		background-image: url(../img/vagverket.png); }
	#companies li.city_of_goteborg a {
		background-image: url(../img/city_of_goteborg.png); }
	#companies li.vasttrafik a {
		background-image: url(../img/vasttrafik.png); }
	#companies li.business_region_goteborg a {
		background-image: url(../img/business_region_goteborg.png); }
	#companies li.consat a {
		background-image: url(../img/consat.png); }
	#companies li.volvo a {
		background-image: url(../img/volvo.png); }
	#companies li.lindholmen a {
		background-image: url(../img/lindholmen.png); }
	#companies li.safer a {
		background-image: url(../img/safer.png); }
	#companies li.innovatum a {
		background-image: url(../img/innovatum.png); }
	#companies li.telematics_valley a {
		background-image: url(../img/telematics_valley.png); }
	#companies li.tss a {
		background-image: url(../img/tss.png); }
	#companies li.solvi a {
		background-image: url(../img/solvi.png); }

.columns {
	margin-top: -12px;
}
	.columns .col1, .columns .col2 {
		width: 47%;
		float: left;
	}
	
	.columns .col1 {
		margin-right: 5%;
	}
	
	.columns p {
		font-size: 12px;
		line-height: 18px;
	}

table {
	border-collapse: collapse;
	border-spacing: none;
}
	table tr td {
		padding: 0 1.5em 0 0;
	}

img.picture {
	border: 4px solid #fff;
	margin-bottom: 20px;
	
	-webkit-box-shadow: 0 2px 3px rgba(0,0,0,0.33);
}