/* ==|== primary / global styles ===============================================
   Author: Jorn Innemee, Flink
   ========================================================================== */

body {
  margin: 0;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 22px;
  color: #494949;
  background: url(/h_images/h/body-bg.gif) #fff; /* Flink modified */
	overflow:hidden; /* fix various overflow bugs, like input 100% width on iphone after landscape rotation and back */
}

/* @font-face
-----------------------------------------------------------------------------------------------------------*/

@font-face {
	font-family: 'FranklinGothicFSHeavy';
	src: url('/fonts/FranklinGothic-Hvy-webfont.eot');
	src: url('/fonts/FranklinGothic-Hvy-webfont.woff') format('woff'), url('/fonts/FranklinGothic-Hvy-webfont.ttf') format('truetype'), url('/fonts/FranklinGothic-Hvy-webfont.svg#webfontPFGkuiON') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Colors
-------------------------------------------------------------------------------------------------------*/
.dummy-class {
	color:#649ec9;	/* primary 							blue */
	color:#407ca8;	/* primary dark 				blue-dark */	
	color:#93bbd9;	/* primary light 				blue-light */	
	color:#cacbcc;	/* grey 								grey - borders */
	color:#707070;	/* grey dark						grey-dark */
}

/* Primary
=========================================*/

.primary {
	color:#649ec9;
}
.bg-primary {
	background-color:#649ec9;
}
.bg-primary,
.bg-primary a{
	color:#fff;
}
.bg-primary hr {
	border-color:#93bbd9;
}
.bg-primary a {
	text-decoration:underline;
}

/* grey
=========================================*/

.grey {
	color:#cacbcc;
}
.bg-grey {
	background-color:#f8f8f8;
}
.bg-grey.accent {
	background:			-moz-linear-gradient(top, #fff, #f8f8f8);
	background:      -ms-linear-gradient(top, #fff, #f8f8f8);
	background:  -webkit-linear-gradient(top, #fff, #f8f8f8);
	background:       -o-linear-gradient(top, #fff, #f8f8f8);
	background:          linear-gradient(top, #fff, #f8f8f8);
}


/* Content
-------------------------------------------------------------------------------------------------------*/

/* Images
====================================================*/

/* content pages */
.img {
  height: 163px;
  width: 100%;
	box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.1);
	background-color:#f4f4f4;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size: contain;
}

/* index pages */
.img1 {
	display:block;
	outline:1px solid #cacbcc;
	margin:1px;
	border:4px solid #fff;
	background-color: #5994bf;
	background: url(/h_images/h/logo-tno-white.png) 50% 50% no-repeat, -moz-linear-gradient(top, #649ec9, #93bbd9);
	background: url(/h_images/h/logo-tno-white.png) 50% 50% no-repeat, -webkit-gradient(linear, 0 0, 0 100%, from(#649ec9), to(#93bbd9));
	background: url(/h_images/h/logo-tno-white.png) 50% 50% no-repeat, -webkit-linear-gradient(top, #649ec9, #93bbd9);
	background: url(/h_images/h/logo-tno-white.png) 50% 50% no-repeat, -o-linear-gradient(top, #649ec9, #93bbd9);
	background: url(/h_images/h/logo-tno-white.png) 50% 50% no-repeat, linear-gradient(to bottom, #649ec9, #93bbd9);
	background-repeat: repeat-x;
}
.img1 img {
	width: 100%;
}

/* Thumbnailing
====================================================*/

/* .index-visual */
.th1 {
	width:130px;
	height:60px;
	background-size: cover;
}
/* .index1 */
.th2{
	width:80px;
	height:60px;
	background-size: cover;
}

.th3 {
	width:80px;
	height:106px;
	background-size: cover;	
}

.th4{
	width:80px;
	height:80px;
	background-size: cover;
}

.th5 {
	width:80px;
	height:113px;
	background-size: cover;	
}

/* various elements
====================================================*/

.hr { 
	padding: 0;
	margin: 0 0 20px 0;
	border-bottom:1px solid #eee;
	height: 0;
	font-size: 0;
	overflow: hidden;
	clear: both;
}

time { 
	color:#494949;
	font-size:12px;
	font-weight:bold;
}

small {
	font-size:11px;
}