/*
	To improve readability, css source has been divided into segments, each segment
	placed in its own file.
	
	This file, public.css, is special in that it is always included in the WYSIWYG editor.
	You should use this file as the "origin" of styles, that should be availble in the WYSIWYG editor.
	
@import url("CSS/Styles.css");	

*/

/* 
		Frandsen Group Website
		Overall screen css styles 
		
		By : Henrik Ladefoged / Illumi a/s
		
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
* {
	margin: 0; padding: 0; /* Reset all margins globally */
}
html {
	font-size: 100%;
	overflow: -moz-scrollbars-vertical;
	}
	body, html {
		font-family: "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		color: #333	;
		}
		body {
		font-size: 70%;
		background: #fff url('Images/horisontal-line.png') repeat-x left 100px;
	}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Headings
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	h1, h2, h3, h4, h5 {
		font-size: 100%; font-weight: normal; 
		}
		h1 {font-size: 320%; color: #000;  }
		h2 {font-size: 140%; font-weight: bold; color: #000; margin-bottom: 10px;}
		h3 {font-weight: bold; color: #000; margin-bottom: 3px;}
		h4 {font-size: 120%; font-weight: bold; color: #000; margin-bottom: 3px;}		

		em {font-style: normal;}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Links
 * * * *  * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	a {
		color: #333; text-decoration:none; }
		a:hover{
			text-decoration: none;
	}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Images
 * * * *  * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	img{border:none;}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Lists
 * * * *  * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
	ul, li, dl, dd, dt {
		list-style-type: none;	
		display: inline;
		}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Floats
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.clear{clear:both; height: 1;}
.clearFix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Tables
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

table, td {
	border-collapse: collapse;		
}


/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Main containers
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#top {
	position: relative;
	height: 92px;
	width: 970px;
	display: block;
	margin: 20px auto 0px auto;
}
#logo {
	position: absolute;
	top: 20px;
	left: 0px;
	}
	#logo.design {
		top: 5px;
	}
	#logo.projekt {
		top: 2px;
	}
	#logo.group {
		top: 29px;
		left: 10px;
	}


#topmenu {
	position: absolute;
	top: 30px;
	/* right: 5px; */
	left: 200px;
	}
	#topmenu.group { 
		left: 230px;
	}

	#topmenu ul, #topmenu li { display: inline; }
	#topmenu li a {
		font-size: 110%;
		text-transform: uppercase;
		color: #666;
		float: left;
		letter-spacing: 1px;
		padding: 5px 14px 7px 14px;
		background: #fff url('Images/topnav-separator.png') no-repeat right 0px;
		}
		#topmenu li a:hover {
			background-color: #f4f4f4;
		}
		#topmenu li a.selected
		 {
			background-color: #323232;
			/* background-color: #917b4c; */
			color: #fff;
		}
		#topmenu li a.last {
			background-image: none;
	}

#contentwrapper {
	width: 970px;
	margin: 0px auto 0px auto;
	clear: both;
	background: #fff url('Images/vertical-lines.png') repeat-y top left;
	}
	#modefrontpage #contentwrapper {
		background: #fff url('Images/frontpage-bg.png') no-repeat left bottom;
		margin-bottom: 20px;
		}
		#leftCol { 
			width: 404px; 
			margin-right: 30px; 
			float: left; 
			padding: 20px 20px 20px 30px ;
			/* background-color: cyan; */
		}
		#centerCol { 
			width: 231px; 
			margin-right: 30px; 
			float: left; 
			padding: 20px 20px 20px 30px ;
			/* background-color: pink; */
		}
		#rightCol { 
			width: 135px; 
			float: left;
			padding: 20px 20px 20px 20px ;
			}
			#rightCol li a { 
				display: block;
				padding: 2px 0px 2px 10px;
				}
				#rightCol li a:hover { 
					background: #fff url('Images/leftnav-arrow.png') no-repeat 0px 7px;
				}
				div.frontpageImageBox {
					float: left; display: block;
				}
				div.frontpageImageBox a { display: block; }
				div.frontpageImageBoxLeft { width: 200px; float: left; margin-right: 15px;}
				div.frontpageImageBoxRight { padding: 15px 0px 0px 0px; width: 174px; float: left;  }

				#centerCol div.frontpageImageBoxLeft {  width: 92px; }
				#centerCol div.frontpageImageBoxRight { width: 110px; }


	#leftNav {
		width: 200px;
		float: left;
		padding: 15px 0px 15px 0px;
		}
		#leftNav ul, #leftNav li {  }
		#leftNav li a {  
			display: block;
			padding: 3px 2px 3px 15px;
			line-height: 120%;
			color: #323232;
			}
			#leftNav li a.selected,
			#leftNav li a.expanded,
			#leftNav li a:hover { 
				background: #fff url('Images/leftnav-arrow.png') no-repeat 3px 8px;
				 }
				#leftNav li li a {  
					padding: 4px 2px 4px 35px;
					background: none;
				}
				#leftNav li li a.selected,
				#leftNav li li a.expanded,
				#leftNav li li a:hover { 
					background: #ededed url('Images/leftnav-arrow.png') no-repeat 23px 7px;
					 }
					#leftNav li li a.selected {
						font-weight: bold;
						}
						#leftNav li li li a {  
							padding: 4px 2px 4px 55px;
							background: none;
						}
						#leftNav li li li a.selected,
						#leftNav li li li a.expanded,
						#leftNav li li li a:hover { 
							background: #ededed url('Images/leftnav-arrow.png') no-repeat 43px 8px;
							 }
							#leftNav li li li li a {  
								padding: 4px 2px 4px 75px;
								background: none;
							}
							#leftNav li li li li a.selected,
							#leftNav li li li li a.expanded,
							#leftNav li li li li a:hover { 
								background: #ededed url('Images/leftnav-arrow.png') no-repeat 63px 8px;
								 }



				#leftNav ul ul  {  
					border-top: 1px solid #ccc;
					border-bottom: 1px solid #ccc;
					display: block;
					/* padding: 5px 0px 5px 0px; */
				}

		#rightContent {
			float: right;
		}
		#subpage, #productpage {
			float: left; 
			width: 730px;
			padding: 20px 20px 20px 20px;
			border-top: none;
			line-height: 140%;
				}
			#productpage {
				padding: 0px 20px 0px 20px;
				}
				#productpage div.introBox {
					display: none;
				}
				

	#subpage h1, #productpage h1 {
		border-bottom:1px solid #EAEFE7;
		margin-bottom:18px;
		padding-bottom:12px;
	}	
	#subpage table {
		border-collapse:collapse;
		height:auto !important;
		width:100%;
	}
	#subpage ul li {
		padding-left: 20px;
		display: block;
		background: url("/files/Generelle/ikoner/Linkikon-standard.gif") no-repeat 0px 1px !important;			
		}
		#subpage ul li a { 
			list-style-type: none;
			padding: 0;
			}


#TopGraphic {
	text-align: center;
	border-bottom: 1px solid #ccc;
	}
	#TopGraphic embed, #TopGraphic object, #TopGraphic img { padding: 0; line-height: 0%; border: 0; font-size: 0%; display: inline; }

#footer {
	text-align: center;
	border-top: 1px solid #ccc;
	padding: 10px 0px 20px 0px;
	}
	#footer span a { color: #999; font-size: 90%; display: block; margin-top: 5px; text-transform: uppercase; letter-spacing: 2px; }

div.circles {
	width: 730px;
float: left;
	}
	div.circle {
		width: 150px;
		height: 150px;
		margin: 0px 32px 24px 0px;
		float: left;
	}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Produktliste
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#productList {
	margin-left: -25px;
}
div.productlist-item {
	border: 4px solid #fff;
	width: 155px;
	float: left;
	text-align: center;
	margin: 0px 0px 15px 25px;
	}
	div.productlist-item:hover {
		border-color: #ccc;
	}
	div.productlist-item-inner {
		border: 1px solid #ccc;
		width: 153px;
		text-align: center;
	}
	div.productlist-item a.productLink {
		padding: 3px 0px 8px 0px;
		line-height: 100%;
		display: block;
	}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	2010 Detaljevisning 
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#product {
	position: relative;
	}
	div.productLargeImage {
		width: 730px;
		padding-bottom: 10px;
		display: block;
		text-align: center;
	}
	div.productLargeImage a.productBackLink {
			display: none;
	}
	div.productLargeImage:hover a.productBackLink {
		position: absolute;
		top: 0px;
		left: -19px;
		display: block;
		border-right: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		padding: 20px 20px 20px 30px;
		background: #fff url('Images/arrow-left.png') no-repeat 15px 24px;
	}

	div.productDetails {
		width: 730px;
		float: left;
		background: #fff url('Images/productdetails-bg.png') repeat-y 0px 0px;
		}
		div.productName {
			width: 130px;
			padding: 5px 15px 0px 0px;
			float: left;
			margin-right: 1px;
			text-align: right;
			}
			div.productName h2 {
				font-size: 240%;
				line-height: 120%;
			}
			div.productName h3 {
				font-size: 260%;
				color: #666;
			}

		div.productDescription {
			width: 200px;
			padding: 10px 15px 0px 15px;
			float: left;
			margin-right: 1px;
		}
		div.productInfo {
			padding: 5px 0px 0px 0px;
			width: 230px;
			float: left;
			}
			div.productInfo li {
				width: 200px;
				padding: 3px 15px 3px 15px;
				border-bottom: 1px solid #ccc;
				display: block;
				float: left;
				}
				div.productInfo li span.left {
					float: left;
					width: 95px; 
				}
				div.productInfo li span.right {
					float: left;
					width: 105px; 
				}

				div.productDetailsPDFLinks {
					width: 200px;
					clear: both;
					padding: 10px 15px 10px 15px;
				}
				div.productDetailsPDFLinks a {
					display: block;
					padding: 5px 0px 5px 15px;
					background: #fff url('Images/leftnav-arrow.png') no-repeat 0px 10px;
			}
			div.productRatioImage {
				width: 120px;
				float: right;
			}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Downloadliste
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#downloadList {
	margin-left: -25px;
}
div.downloadlist-item {
	border: 4px solid #fff;
	width: 155px;
	float: left;
	text-align: center;
	margin: 0px 0px 15px 25px;
	position: relative;
	}
	div.downloadlist-item:hover {
		border-color: #ccc;
	}
	div.downloadlist-item-inner {
		border: 1px solid #ccc;
		width: 153px;
		text-align: center;
	}
	div.downloadlist-item a.downloadLink {
		padding: 3px 0px 8px 0px;
		line-height: 100%;
		display: block;
		}
		div.downloadlist-item a.downloadLink span { 
			display: block;
		font-size: 90%;
		color: #999;
		margin-top: 5px;
		}

	div.downloadlist-item a.downloadmessage {
		position: absolute;
		top: 105px;
		width: 120px;
		background-color: #323232;
		color: #fff;
		left: 15px;
		padding: 2px;
		display: none;
		
		}
		div.downloadlist-item:hover a.downloadmessage {
			display: block;
		}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	2010 Indgangsboks
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
div.introBox {
	width: 670px;
	float: left;
	color: #fff;
	padding: 30px;
	background-color: #333;
	margin-bottom: 20px;
	line-height: 160%;
	}
	div.introBox h1 { color: #fff; display: inline; border: 0 !important; float: left; margin: 0px 15px 0px 0px;  }
	div.introBox p { display: inline; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Galleri
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#GalleryList
{

}

#GalleryList div
{
    height:147px;
    width:128px;
    display:block;
    margin-right:12px;
    margin-bottom:25px;
    float:left;
    position:relative;
}

#GalleryList img
{
	border:solid 2px #ececec;
    margin:0 auto;
}

#GalleryList div span
{
	display:block;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Linksbox
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.LinkBox
{
	margin-bottom: 20px;
}

	div.LinkBoxContent {
		margin: 5px 0px 10px 0px;
	}

	.LinkBox *
	{
		margin:0px;
		padding:0px;
	}

	.LinkBox li
	{
		list-style-type: none;
		line-height: 20px;
	}
	
	.LinkBox a
	{
		display:block;
		width: 100%;
		height: 100%;
		padding-left: 20px;
		background-repeat:no-repeat;
		background-position: 0px 4px;
	}
	
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	Forms
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.formError 
{
    color:Red;
    font-weight:bold;
}

.viaButton
{
    border: 2px solid;
	font-size: 110%;
	text-transform: uppercase;
	font-weight: 700;
	line-height:18px;
	height: 23px;
	float:left;
	width:105px;
	margin-top: 10px;
	margin-right: 372px;
	background-color: #ededed;
	cursor:pointer;
}

#Content form
{
	
}


#Content .labelPart, #Content .inputPart
{	
	margin-bottom: 2px;	
}

#Content .labelPart
{
	width: 120px;
	float:left;
	padding-top: 3px;
}

#Content .inputPart
{	
	float:left;
	padding-right:10px;
}

#Content .cbContainer, #Content .rbContainer
{
	
}

#Content .inputPart input
{
	width: 200px;
	padding: 0 2px;
	font-size: 100%;
	border:solid 1px #b7b7b7;
}

#Content .inputPart .cbContainer
{
	padding: 2px 0px;
}

#Content .inputPart .viaCheckbox, #Content .inputPart .viaRadio
{
	width: auto;
	border: 0px;
	margin:0px;	
	margin-right: 5px;
}


#Content .inputPart textarea
{
	padding: 0 2px;
	width: 201px;
	border:solid 1px #b7b7b7;
}

#InfoContent
{
	width: 200px;
	float:right;
	background-color: #fff;
	border: 20px solid #fff;
}

#InfoContent div
{
    width:180px;
}
	


.list #InfoContent main
{
    width:100%;
	float:right;
}   


.list #InfoContent .Cell2
{
    width:100%;
	padding:10px;
	padding-top:0px;
	border:solid 1px green;
	margin:10px;
	margin-top:20px;
}

.list #InfoContent form .VisualEditorContent
{
    padding-bottom:10px;
}

.list #InfoContent .labelPart
{
}

.list #InfoContent .inputPart
{	
}

.list #InfoContent .inputPart input
{
	width: 150px;
	padding: 0 2px;
	font-size: 100%;
}

.list #InfoContent .inputPart textarea
{
	width: 150px;
	padding: 0 2px;
	font-size: 100%;
}

.list #InfoContent .inputPart .cbContainer
{
    display:block;
	padding: 5px 0px;
}

.list #InfoContent .inputPart .viaCheckbox, .list #InfoContent .inputPart .viaRadio
{
	width: auto;
	border: 0px;
	margin:0px;	
	margin-right: 5px;
}

.list #InfoContent .viaButton
{
	float:left;
	margin:0px;
	margin-top:10px;
}