﻿/* ******************
   COMMON TAB STYLES -
   ****************** */

ul.tabNavigation {
	list-style: none;
	margin: 0;
	padding: 0;
	/*height: 2em; ?*/ 
	}

ul.tabNavigation li {
	float: left;
	margin-right: 0px; /*?*/
	/*width: 31%; angives i den relevante kontekst */ /*?*/
}

ul.tabNavigation li a {
	/* flyttes til kontekst: 
	line-height: 2em; 
	padding-right: 10px;*/
	display: block;
	float: left;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	color: #FFF
}

ul.tabNavigation li a.selected, ul.tabNavigation li a:visited,
ul.tabNavigation li a:hover {
	color: #FFF;
}

ul.tabNavigation li a:focus {
	outline: 0;
}

div.tabs > div {
	/*padding: 15px 10px; /* <== flyttes til kontekst ?*/
	/* height: 125px; flyttet til kontekst */
	/*margin-top: 4px; ?*/
}
div.tabs > div p, div.tabs > div, div.tabs2 > div p, div.tabs2 > div  {
	color: #FFF;
	margin: 0;
	}

div.tabs > div h1, div.tabs > div h2, div.tabs > div h3 {
	margin-top: 0;
}


/* ****************************

   Styles for TABS (2 tabs and 3 tabs) in LEFT Side (frontpages)

   **************************** */ 

#left .tabs
	{ 
	width:745px; 
	height: 170px;
	overflow: hidden
	}

#left .tabs2 {
	width: 490px; 
}

	
#left ul.tabNavigation 
	{
	/*list-style:none; er angivet */
	width: 745px;
	height: 37px;
	}

#left .tabs2 ul.tabNavigation { width: 490px}

#left ul.tabNavigation li 
	{
    list-style: none;
	display: inline;
	}

#left ul.tabNavigation li a 
	{
	/* er angivet : 
	text-decoration: none;
	display:block;
	float:left;	*/
	background: url(../img/tabs/allTabs.png) no-repeat;
	padding: 13px 5px 0px 10px;
	height: 24px; /* original 31px, Xpx is hidden due to padding-settings */
	}	

#left div.tabs2 ul.tabNavigation li a {
	background: url(../img/tabs/2allTabs.png) no-repeat; 
}


#left #tabItem1, #left #tabItem2, #left #tabItem3 {
	/* 
	fit to match width 745px and height: 134px minus padding defined in "#left div.tabs > div" 
	*/
	width: 725px; 
	height: 114px;
	}
#left .tabs2 #tabItem1, #left .tabs2 #tabItem2 {
	/* 
	fit to match width 490px minus padding defined in "#left div.tabs2 > div" 
	*/
	width: 470px;
} 

#left div.tabs > div, #left div.tabs2 > div  {
	padding: 10px
	}

#tabItem1 {background: url(../img/tabs/tab1Content.png) no-repeat;}	
#tabItem2 {background: url(../img/tabs/tab2Content.png) no-repeat;}	
#tabItem3 {background: url(../img/tabs/tab3Content.png) no-repeat;}	

.tabs2 #tabItem1 {background: url(../img/tabs/2tab1Content.png) no-repeat;}	
.tabs2 #tabItem2 {background: url(../img/tabs/2tab2Content.png) no-repeat;}	
		

/* TABHEADS context: 3 tabs on front page : */

	/* #LEFT tab 1 af 3 */

	#left li#tab1 a {
		width:232px;
		 }

	#left li#tab1 a.selected {	
		background-position: -0px -0px;
		}

	#left li#tab1 a.non-selected {
		background-position: -0px -37px;
	}


	/* #LEFT tab 2 af 3 */

	#left li#tab2 a {
		width:233px;
		 }

	#left li#tab2 a.selected {	
		background-position: -245px -37px;
		}

	#left li#tab2 a.non-selected {
		background-position: -245px -37px;
	}


	/* #LEFT tab 3 af 3 */

	li#tab3 a {
		width: 233px;
		 }

	#left li#tab3 a.non-selected {
		background-position: -495px -0px;
	}

	#left li#tab3 a.selected {
		background-position: -495px -74px; }



	/* *********  special for 2 TAB pages ********* */


	/* #LEFT tab 1 af 2 */

	/*
	#left li#tab1 a {
		width:232px;
		 }
	*/

	/*#left li#tab1 a.selected {	
		background-position: -0px -0px;
		}
	*/

	/*
	#left li#tab1 a.non-selected {
		background-position: -0px -37px;
	}
	*/


	/* #LEFT tab 2 af 3 */

	#left .tabs2 li#tab2 a {
		width:228px;
		 }

	
	#left .tabs2 li#tab2 a.selected {	
		background-position: -247px -37px;
	}
		

	
	#left .tabs2 li#tab2 a.non-selected {
		background-position: -247px -37px;
	}
	


/* ***************************
    TABS IN RIGHT COLUMN

   #right = frontpage
   #relatedContent = standard pages

   *************************** */

#right .tabs {
  width: 223px;
  height: 316px;
  overflow: hidden;
}

#relatedContent .tabs {
	width: 223px;
}

#right ul.tabNavigation, #relatedContent ul.tabNavigation {
  width: 223px;
  height: 37px;
}

#right ul.tabNavigation li, #relatedContent ul.tabNavigation li  {
	list-style:none;
	display: inline;
}

#right ul.tabNavigation li a, #relatedContent ul.tabNavigation li a { 
	padding-right: 10px;
	background: url(../img/tabs/rAllTabs.png) no-repeat;
	padding: 11px 5px 0px 10px;
	height: 26px; /* original 31px, now 5px in bottom is hidden due to padding-settings*/
}

#right #rTabItem1, #right #rTabItem2 {
  width: 203px;
  height: 260px;
}

#right div.tabs > div {  /* has constant height to fit layout on frontpage */
	/*height: 100%;*/ /*316px;*/
  padding: 10px;
}

#relatedContent div.tabs > div {
	height: auto;
/*padding: 30px 10px 10px; */
padding: 0;}

.tabContent {padding: 0 10px;}

#relatedContent #relTabItem1 div.top,  #relatedContent #relTabItem1 div.bottom, #relatedContent #relTabItem2 div.top, #relatedContent #relTabItem2 div.bottom {
  height: 10px;
 }

#right #rTabItem1 {
  background: url(../img/tabs/rTab1Content.png) no-repeat;
}

#relatedContent #relTabItem1 {
  background: url(../img/tabs/rTab1innerContent.png) repeat-y;
}
#relatedContent #relTabItem1 div.top {
  background: url(../img/tabs/rTab1Content.png) no-repeat top left;
}
#relatedContent #relTabItem1 div.bottom {
  background: url(../img/tabs/rTab1Content.png) no-repeat bottom left;
}

#right #rTabItem2 {
  background: url(../img/tabs/rTab2Content.png) no-repeat;
}
#relatedContent #relTabItem2 {
  background: url(../img/tabs/rTab2innerContent.png) repeat-y;
}
#relatedContent #relTabItem2 div.top {
  background: url(../img/tabs/rTab2Content.png) no-repeat top left;
}
#relatedContent #relTabItem2 div.bottom {
  background: url(../img/tabs/rTab2Content.png) no-repeat bottom left;
}



/* #right tab heads *********************** */


#right li#rTab1 a {width: 96px}
#right li#rTab1 a, #right li#rTab1 a.selected {
  background-position: -0px -0px;
}
#right li#rTab1 a.non-selected {
  background-position: -0px -37px;
}

#right li#rTab2 a {width: 95px; }
#right li#rTab2 a, #right li#rTab2 a.non-selected {
  background-position: top right
}
#right li#rTab2 a.selected {
  background-position: right -37px;
}


/* #relatedContent tab heads ******************* */

#relatedContent li#relTab1 a {width: 96px}
#relatedContent li#relTab1 a, #relatedContent li#relTab1 a.selected {
  Background-position: -0px -0px;
}  
#relatedContent li#relTab1 a.non-selected {
  background-position: -0px -37px;
}
#relatedContent li#relTab2 a {width: 95px;}
#relatedContent li#relTab2 a, #relatedContent li#relTab2 a.non-selected {
  background-position: top right;
}
#relatedContent li#relTab2 a.selected {
  background-position: right -37px;
}


/* right / related tabs  basic colors */

li#rTab1, #rTabItem1, li#relTab1, #relTabItem1 {
  background: #7ab51a;
}

li#rTab2, #rTabItem2, li#relTab2, #relTabItem2 {
  background: #529c00;
}

/*li#relTab2 {float: right}
*/

/* FONT STYLES FOR TABS */
#relatedContent .tabContent, #relatedContent .tabContent td, #relatedContent .tabContent span, #relatedContent .tabContent p, #relatedContent .tabContent a, #relatedContent .tabContent a:visited,
#right .tabs, #right .tabs td, #right .tabs span, #right .tabs p, #right .tabs a, #right .tabs a:visited
 {
  color: #FFF;
}
#relatedContent .tabContent a {
  text-decoration: underline;
}
#relatedContent .tabContent a:hover {
  text-decoration: none; 
}

#relatedContent .tabContent hr, #right .tabs  hr {
  background-color:#FFF;
  color:#FFF;
  height:1px;
}
