/**
 * This is the main style file for the KITLV AWAD website.
 *
 * Grid distances:
 * - 894px (full page width)
 * - 135px
 * - 35px (content margin)
 * - 20px (menu margin)
 *
 * Grid colors:
 * - #ffffff (white background)
 * - #d6d3cb (gray background)
 * - #294695 (light blue elements)
 * - #101A4A (dark blue elements)
 *
 * Grid typefaces:
 * - "Helvetica", "Arial", sans-serif
 * - 15px (h1)
 * - 12px (menu)
 *
 * The site has two layouts, a frontpage layout with a large header, and a 
 * layout for regular pages with a smaller header. Which layout to use is 
 * determined by a class name of the page element. If the class is "front",
 * the large header is used, otherwise, the small header is used.
 */
 
/*** Common layout elements ***/
 
html
{
	margin: 0;
	padding: 0;
}
 
body {
	width: auto;
	margin: 0;
	padding: 0;
} 
  
#page {
	width: 894px;
	margin: 0px auto 0 auto;
	background: transparent; 

	border: solid #294695 1px;
	border-top: none;
	border-bottom: none;
	
	padding: 0;
}

#user-menu li 
{	
	float: right;
}

#kitlv_logo
{
	float: right;
	
	width: 58px;
	height: 49px;
}

#kitlv_logo a
{
	display: block;
	width: 100%;
	height: 100%;
}

#kitlv_logo a span
{
	display: none;
}

#logo
{
	float: left;
	margin-top: 25px;
	
	width: 277px;
	height: 117px; 	
}

#logo a
{
	display: block;
	width: 100%;
	height: 100%;
}

#logo a span
{
	display: none;
}

#header
{
	padding-top: 1px; /* hack to uncollapse the margins */
	margin: 0px 0 0 0;
	
	height: 280px;
}

#sub-header
{
	height: 135px;
	overflow: hidden;

	margin: 145px 0 0 0;
}


#search
{
	width: 275px;
	height: 135px;
	
	margin: 0 0 0 0;
	
	float: left;
}

#region-menu
{
	float: right;
	width: 250px;
	text-align: right;
}
 
.float-clearer
{
	clear: both;
}

#main 
{
	width: 100%;
	margin: 0 0 0 0;
}

#main #menu
{
	width: 260px;
	float: left;
	background: transparent;
}

#main #content
{
	width: 616px;
	min-height: 350px;
	
	float: right;
	background: #d6d3cb;
	margin-top: 0px;
}

#main #content-inner
{
	margin: 30px 35px 60px 35px;

}

	/* kill the list-layout for all the menu lists */
.menu ul
{
	list-style-position: outside;
	list-style: none;
	
	margin: 0;
	padding: 0;	
}

.menu li
{
	list-style-position: outside;
	list-style-image: none;
	
	margin: 0;
	padding: 0;
}

/*** Frontpage layout ***/

#page.front
{
	background: transparent url('/images/header.front.jpg') no-repeat top left;
}

.front #sub-header
{
	margin: 323px 0 0 0;
}

.front #header
{
	height: 467px;
}

.front #logo
{
	margin-top: 155px;
	
	width: 422px;
	height: 165px; 	
}
 
/*** Regular layout ***/

#page
{
	background: transparent url('/images/header.regular.jpg') no-repeat top left;
}

/*** Cosmetics ***/

body
{
	font: 12px/22px "Helvetica", "Arial", sans-serif;
}

#user-menu a
{
	font: bold 10px/11px "Helvetica", "Arial", sans-serif;
	letter-spacing: 1px;

	display: block;
	padding-left: 13px;
	
	margin: 7px 13px 0 0;
	
	background: transparent url('/images/rightarrow.png') no-repeat left center;
	
	text-transform: uppercase;
}

#user-menu a:hover
{
	color: #294695;
}

#search
{
	color: #294695;	
}

#search-inner
{
	margin: 25px 25px auto 25px;
}

#search input.checkbox
{
	border: none;	
}


#search-box
{
	white-space: nowrap;
	margin-bottom: 10px;
}

#search-box label
{
	float: left;
	font: 14px/21px "Helvetica", "Arial", sans-serif;
	
	padding-right: 5px;
}

#search input.text
{
	float: left;
	width: 140px;
	height: 21px;
	border: none;
	
	font: 14px/21px "Helvetica", "Arial", sans-serif;
	color: #101A4A;
	
	margin: 0;
	padding: 0 1px;
}

#search input.button
{
	height: 21px;
	font: 9px/9px "Helvetica", "Arial", sans-serif;
	
	vertical-align: middle;
}

#search-submit-link
{
	margin: 0 0 0 0;
	padding: 0;
}

#search-submit-link img
{
	border: none;
	margin: 0;
	padding: 0;
}

#region-menu
{
	font: 14px/19px "Helvetica", "Arial", sans-serif;
	margin: 22px 22px 0px 0;
}

#region-menu li a
{
	display: block;
	padding-right: 16px;
	color: #101a4a;	
}

#region-menu li a:hover
{
	background: transparent url('/images/block.9by9.png') no-repeat center right;
	color: #101a4a;	
}

#menu
{
	margin: 30px 0 0 0;
	padding: 0 0 0 0;
}

#menu li
{
	margin: 0;
	padding: 0;
}

#menu li.current a
{
	font-style: italic;
}

#menu li.current li a
{
	font-style: normal;
}

#menu a
{
	display: block;
	padding-left: 25px;
	color: #294695;	
}

#menu li li a
{
	padding-left: 35px;
}

#menu li li li a
{
	padding-left: 45px;
}

#menu a:hover
{
	color: #294695;	
	background: transparent url('/images/block.14by14.png') no-repeat left center;
}

#main-menu
{
	margin: 0 0 50px 0;
}

/*** Basic HTML elements ***/

h1
{
	font-size: 18px;
	line-height: 22px;
	
	font-weight: normal;
	color: #294695;

	margin-bottom: 5px;
}

h2
{
	font-size: 18px;
	line-height: 22px;

	font-weight: normal;
	color: #294695;

	margin-bottom: 5px;
}

h3
{
	font-size: 14px;
	line-height: 22px;

	font-weight: normal;
	color: #294695;
	margin-bottom: 5px;	
}

h4
{
	font-size: 12px;
	line-height: 22px;

	font-weight: normal;
	color: #294695;
	margin-bottom: 5px;	
}

p
{
	margin: 0 0 10px 0;
}


a
{
	text-decoration: none;
	color: #294695;	
}

a:hover
{
	color: #101a4a;
}

#content a:hover
{
	border-bottom: dashed #101a4a 1px;
}

acronym
{

	border: none;
}

table
{
	border: none;
	
	border-collapse: collapse;
	vertical-align: top;
	
	margin: 0;
	padding: 0;
}

td
{
	border: none;
	border-bottom: solid #ededeb 1px;	
}

td, th
{
	vertical-align: middle;

	margin: 0 -1px;
	padding: 1px 3px;
	margin: 0;
}

th
{
	background: #294695;
	color: #d6d3cb;
	border: none;
}

tr
{
	border: none;
	
	margin: 0;
	padding: 0;	
}

caption
{
	font-weight: bold;
	margin: 0 0 5px 0;
}

hr
{
	border: solid #294695 1px; 
	
	border-collapse: collapse;
}

ul li, li li ul li
{
	list-style-image: url('/images/block.5by5.png');
}

li ul li, li li li ul li
{
	list-style-image: url('/images/block_open.5by5.png');
}

ol li
{
	list-style-image: none;
}

li ol li
{
	list-style-type: lower-alpha;
	list-style-image: none;
}

li li ol li
{
	list-style-type: lower-roman;
	list-style-image: none;
}

li li li ol li
{
	list-style-type: lower-greek;
	list-style-image: none;
}

code
{

	display: block;
	margin: 10px 0px;
	padding: 0px 20px;
	background: white;	
	
	font-family: "Consolas", "Courier", monospace;	
}

cite{}

blockquote
{
	display: block;
	margin: 10px 20px;
	font-family: "Georgia", serif;
	font-style: italic;
}

/*** Hacks and Specifics ***/

#site-title
{
	display: none;
}

.organisations #content table td,
.experts #content table td
{
	text-align: right;
	padding-right: 15px;
}

.organisations #content table table td,
.experts #content table table td
{
	text-align: left;
}

.organisations #content td + td,
.experts #content td + td
{
	text-align: left;
}
