@import url(fancybox/fancybox.css);

/* Colours
------------------------------------------------------
Light blue:	#c3dce9
dark blue:	#567596 - nav text
orange:	#f1854b - selected nav
Sand:		#efefe4
Dark sand:	#e7e2b7
sand line:	#c3bfb2
text:		#493c28
text (nav)	#746d55;
tagline:	#000		
--------------------------------------------------- */
/*
.noJS body {background:red;}
.hasJS body {background:green;}
*/

/* base.css
------------------------------------------------------ */
/* Neutralize styling: Elements we want to clean out entirely: */
html, body, form, fieldset {margin:0; padding:0;}
h1, h2, h3, h4, h5, h6 {margin:0 0 0.25em; padding:0;}
input, select, textarea, table, tr, td {font-size:1em;}
p, pre, blockquote, ul, ol, dl, address {margin:0 0 18px; font-size:1em;}
h1 {font-size:2em;}
h2 {font-size:1.6em;}
h3 {font-size:1.4em;}
h4 {font-size:1.2em;}
h5 {font-size:1.1em;}
h6 {font-size:1em;}

/* Apply left margin */
li, dd, blockquote {margin-left:1em;}

form label {cursor:pointer;}
fieldset {border:none;}
a img, a:visited img {border:none;}
/* remove dotted lines for links in firefox */
a:active{ outline: none; }
:-moz-any-link:focus{ outline: none; }

/* keep the ordered list numbers in the negative space. works fine when container has padding */
ol {margin-left:0;padding-left:0;}
ol li {margin-left:0;}


/*
OOCSS
Copyright (c) 2009, Nicole Sullivan. All rights reserved. 
Code licensed under the BSD License: version: 0.2
/////////////////////////////////////////////////////////////// */

/*grids.css*/
.unit{float:left;}
.line{*zoom:1;}
.lastUnit{display: table-cell;*display:block;*zoom:1;float:none;_position:relative;_left:-3px; _margin-right: -3px;width:auto;}
.line:after,.lastUnit:after{content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";visibility:hidden; clear:both;height:0 !important;display:block;line-height:0;font-size: xx-large;overflow: hidden;}
.size1of1{float:none;}
.size1of2{width:50%; *width:49.999%}
.size1of3{width:33.33333%;}
.size2of3{width:66.66666%;}
.size1of4{width:25%;}
.size3of4{width:75%;}
.size1of5{width:20%;}
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}

/* mod.css */

.mod{margin:0 10px 10px;}
.mod .inner{/*background: url(skin/transparent.png) repeat left top;*/}
.hd,.bd,.ft{overflow:hidden;_overflow:visible; _zoom:1;}
.inner{position:relative;}

/*oocss applies these to <b> elements for corners, we need to be more specific */
.top, .bottom, .crnr, .ctl, .ctr, .cbl, .cbr {display:block;background-repeat:no-repeat;font-size:1%;position:relative;z-index:10;}

.ctl, .ctr, .cbl, .cbr {height:10px; width:10px;float:left;}
.ctl{background-position: left top;}
.ctr{background-position: right top;}
.cbl{background-position: left bottom;} 
.cbr{background-position: right bottom;}
.cbr,.ctr {float:right;}
.ctr, .ctl {overflow:hidden;margin-bottom:-32000px;}/* margin bottom needs to be < -9px */
.cbl,.cbr {margin-top:-10px;}
.top{background-position:center top;}
.bottom{background-position:center bottom;_zoom:1;}/* this zoom required for IE5.5 only*/

/* complex */
.complex{overflow:hidden;*position:relative;*zoom:1;}/* position/zoom required for IE7, 6, 5.5 */
.complex .ctl, .complex .ctr{height:32000px; margin-bottom:-32000px;width:10px;}
.complex .cbl, .complex .cbr{/*margin-top:0;*/}
.complex .top{height:5px;}
.complex .bottom{height:5px;/*margin-top:-10px;*/}

/* pop  */
.pop{overflow:visible;margin: 10px 20px 20px 10px; background-position:left top;}
.pop .inner{right:-10px; bottom:-10px; background-position:right bottom;padding:0 10px 10px 0;}
.pop .ctl, .pop .cbr{display:none;}
.pop .cbl{bottom:-10px;}
.pop .ctr{right:-10px;}

/* ----- basic (extends mod) ----- */
.basic .inner {/*-moz-border-radius: 7px;-webkit-border-radius: 7px;border-radius: 7px;*/}
.basic .crnr {background-image:url(img/oo/mod/round.png);}





/*
=basic layout and typography
/////////////////////////////////////////////////////////////// */

.intro {font-weight:bold; margin-bottom:18px;}
.row {min-height:0;_height:1px;*zoom:1;}
.row:after {content:"."; clear:both; display:block; visibility:hidden; height:0;}
.col {float:left; display:inline; margin-left:12px; width:319px;}
.pad {padding:0 15px;}



body {font-family:arial, verdana, sans-serif; font-size:13px; line-height:18px; color:#493c28;}
input, select, label, textarea {font-family:arial, verdana, sans-serif; font-size:1em;}

a {color:#493c28;}
a:visited {color:#9c9586;}
a:hover {color:#f1854b;}

h1 {font-size:28px; color:#c3dce9; letter-spacing:-1px;}
h2 {font-size:13px; margin-bottom:1em;}
h3 {font-size:12px;}
.tagline { font-size:18px; color:#000;}



/*
=layout
/////////////////////////////////////////////////////////////// */

#page {width:914px; margin:32px auto 0; min-height:0; _height:1px;}
#page:after {content:"."; clear:both; display:block; visibility:hidden; height:0;}

#page_pop { width:960px; margin:32px auto 0;}
#ungtkod_swf {width:731px; float:left;}
#links_div { width:189px;float:left;}

#header {float:left; width:160px; display:inline; overflow:visible; background:#fff no-repeat url(img/nav-bg.png) 100% 180px;}
#nav {margin-top:50px; background:#fff no-repeat url(img/nav-bg.png) 100% 100%; padding-bottom:20px;}
#logo img {display:block;}

#footer { clear:both; min-height:0; _height:1px; background:#f8f6e7; padding:20px 0; border-top:4px solid #f0edcf; margin:30px 0 0; color:#483c26; color:#b1ad93;}
#footer .inner {width:725px; margin:0 auto; padding-left:189px; 
	position:static; /*static fixes footer Issue in IE7*/
}



#contentwrap {float:right; padding-top:212px; width:725px; position:relative;}
#content {/* background:#efefe4; background:#dcebf2;*/ background:#e5f0f5; padding:56px 0 40px 0; width:397px;}

body.dark_blue #content { background:#a6c0d2;}
body.blue #content		{ background:#dcebf2;}
body.beige #content, body.sand #content	{ background:#f0edd1;}
body.yellow #content	{ background:#89AEBD;}

#headline {position:absolute;top:0;height:158px;width:300px;}
/* span class="hl" = headline... overlays a bg-image on the headline... */
#headline span {position:absolute; top:0; height:200px; width:100%; background-repeat:no-repeat; background-position:0 0; z-index:6; }
#headline h1 {position:absolute; bottom:-5px; left:0; width:100%; z-index:5; line-height:30px;}
#headline h2 {position:absolute; bottom:40px;}
	
#main {padding:0 85px 0 46px; min-height:246px; _height:246px;}

#sidebar {
	position:absolute;
	right:55px;
	width:198px;
	top:346px;
}

#articleimage {
	position:absolute;
	right:0;
	top:0;
	background:#e7e2b7;
	width:413px;
	height:298px;
	overflow:hidden;
	}
	#articleimage img {display:block;/*removes extra bottom margin */}
	#articleimage span {
		display:block;
		position:absolute;
		width:85px; height:85px;
		left:0; bottom:0;
		background:url(img/overlap.png);
		*bottom:-1px;
	}
	* html #articleimage span {bottom:-1px;}
	
#article_smallimage {
	margin:-55px 0 20px 0;
	width:85px;
	height:85px;
	display:block;
	overflow:hidden;
	z-index:200000;
	}
* html 	#article_smallimage { margin:0px 0 20px 0;}
.opskrift #articleimage {
	position:absolute;
	right:0;
	top:0;
	background:#c3dce9;
	width:413px;
	height:345px;
	overflow:hidden;
	}

/*
=front
/////////////////////////////////////////////////////////////// */ 

.fullpage {width:725px; float:right; }
.primary {width:413px; }
.secondary {width:292px; float:right;}
.campaignblock {width:300px; margin-top:30px;}
.teaserblock{width:397px; float:right; margin-top:30px;}

.teaserblock .thumblist li {margin-bottom:15px;}
.teaserblock .thumblist strong {display:block; padding-bottom:2px;}
.thumblist a .description {font-weight:normal; font-size:13px;}
.thumblist a:hover .description {color:#746d55;}
.campaign { min-height:200px; margin-bottom:30px;}
.campaign img {display:block;}
#featuredRecipes {width:413px; height:343px;background:#c2dae6; position:relative; overflow:hidden;}
.slidetabs {position:absolute; top:10px; right:10px;}
.slidetabs a {display:block; float:left;width:10px; height:10px; margin-left:2px; display:inline;background:#ccc; z-index:20px;}
.slidetabs a.current {background:#fff;}
.slide {position:absolute; display:none; top:0; left:0;}
#featuredRecipes img {display:block;}
#featuredRecipes .slide { overflow:hidden; height:343px;}
#featuredRecipes {width:413px; height:343px; background:#c2dae6; position:relative; overflow:hidden;}
#featuredRecipes {background:#f3f3f3;}
.slideshow img {display:block;}
#featuredRecipes .description {position:absolute;bottom:0;_bottom:-1px;left:0;width:413px;
}
#featuredRecipes .description a {
	text-decoration:none;
	color:#fff;
	display:block;
	overflow:hidden;
	padding:10px 100px 0 10px; 
	min-height:75px; 
	_height:75px;
	text-shadow:-1px -1px 12px rgba(0,0,0,.25);
	/* 
	background:#c2dae6 #8da6b3 #597280 rgba(89,114,127,.8) rgba(145,162,172,.8); rgba(192,218,231,.9);
	background:no-repeat url(img/featuredRecipes-bg.png) 100% 0;
	*/
	background:no-repeat url(img/featuredRecipes-bg-medium.png) 100% 0;
}
#featuredRecipes .description a:hover {background-position:100% 100%;}
#featuredRecipes .description a strong, .slideshow .description a b {font-size:18px; }
.dark #featuredRecipes .description a {background-image:url(img/featuredRecipes-bg-dark.png);}
.medium #featuredRecipes .description a {background-imagege:url(img/featuredRecipes-bg-medium.png);}
.light #featuredRecipes .description a {background-image:url(img/featuredRecipes-bg-light.png);color:#597280;}

#introduction {padding:12px 20px 0 0; /* color:#746d55; font-size:14px; */}
#introduction h1 {color:#483c26; line-height:1;}
#introduction h1 {letter-spacing:-2px;font-size:48px;color:#c2dae6;font-size:32px; letter-spacing:0; color:#003f4f;}
#introduction h1 span {display:block;}
#introduction p {color:#493c28;}

#highlight {
	*position:relative;
	margin-top:-115px; 
	height:170px; overflow:hidden;
	margin-bottom:20px; 
	padding:30px 20px 10px 105px; 
	background:#e0ecf2; 
	color:#003f4f
	}
	#highlight h2 {font-size:18px; margin-top:0;}
	#highlight p {margin-top:0;}
#front_img		{
					margin:0; 
					padding:0;
					position:absolute;
					left:0;
					bottom:0;
					width:413px;
					height:343px;
					overflow:hidden;
					*width:412px;
				}
#front_text		{
					position:absolute;
					top:0;
					right:0;
					width:397px;
					height:296px;
					background:#f0edd1;
				}

#front_text h2	{ padding:88px 10px 0 110px;}
#front_text p	{ padding:0 10px 0 110px;}
#front_text img	{ left:0; top:0; position:absolute; width:85px; height:85px; display:block;}
#front_text span	{
		display:block;
		position:absolute;
		width:85px;
		height:85px;
		left:0;
		bottom:0;
		background:url(img/overlap.png);
	}


#front_sidebar	{
					position:absolute;
					bottom:0;
					right:0;
					width:397px;
				}
ul.front_teaser			{ margin:0; padding:0; list-style:none; float:left; width:100%;}
.front_teaser li		{ margin:0; padding:0 0 0 110px; float:left; clear:left; border-bottom:1px solid #c3dce9; width:287px;}
.front_teaser li img	{ margin:0 0 0 -110px; float:left; width:85px; height:85px;}
.front_teaser li p		{ margin:0; padding:0;}

.front_teaser h3		{ margin:15px 0 0 0; color:#c3dce9;}
.front_teaser a			{ text-decoration:none;}

/*
=opskrifter
/////////////////////////////////////////////////////////////// */

#recipe { /*similar to #contentwrap */
	float:right;
	width:725px;
	position:relative;
}

#instructions {
	padding-top:380px;
	width:413px;
	float:left;

}

#ingredients {
	float:right;
	width:296px;	
	margin-top:380px;
}
.note {
	padding:8px 16px;
	background:#faf8ed no-repeat url(img/post-it-bg_wide.png	) 100% 0;
	
}
.facts {
	position:absolute;
	top:0;
	right:0;
	width:296px;
	/* color:#567596; */

}
.servings {margin-bottom:18px;}

	
#ingredients ul {
	margin:0 0 10px;
	padding:0;
	}
	#ingredients li {
		margin:0;
		padding:0;
		list-style:none;
		line-height:18px;
	}

#recipe #articleimage {
	left:0;
}

#recipe h1 {
	margin:0 0 20px;
	color:#f08642;
	font-size:24px;
	line-height:30px;
	letter-spacing:0;
}

#ingredients h2 {
	line-height:27px;
	margin:2px 0 10px;
	color:#493c28;
	font-size:18px;
}



/* tabs
------------------------------------------------------ */

.tabpanel {margin:32px 0 16px; padding:0; clear:both; }
.tabs { background:#c2dae6; margin:0; padding:5px; border-bottom:1px solid #b6ccd8;
	*zoom:1; min-height:0; _height:1px; border-top-left-radius:5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topleft:5px;	border-top-right-radius:5px; -webkit-border-top-right-radius:5px; -moz-border-radius-topright:5px;
}
.tabs:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}

.tabs ul {margin:0; padding:0;display:inline;}
.tabs li {margin:0; padding:0; list-style:none; display:inline;float:left;}
.tabs a {float:left; display:inline; line-height:20px; padding:0 0 0 15px; font-size:16px; font-weight:bold;background:no-repeat url(img/tablinks.png) 0 0;}
.tabs a span {cursor:pointer; display:inline; float:left; line-height:20px; padding:5px 15px 5px 0; background:no-repeat url(img/tablinks.png) 100% 0;}
.tabs a, .tabs a:visited, .tabs a:hover {color:#fff;text-decoration:none;}
.tabs a:hover {background-position:0 -40px;}
.tabs a:hover span {background-position:100% -40px;}
.tabs a.current, .tabs a.current:hover {background-position:0 -80px; color:#00728f;text-shadow:1px 1px 3px #fff; }
.tabs a.current span, .tabs a.current:hover span {background-position:100% -80px;}
.tabs a.current:hover, .tabs a.current:active {outline:none;}
.panel { 
	background:url(img/tabpanel-bg-blue.png) 0 0 repeat-x; margin-bottom:16px; line-height:18px; padding:10px 10px; min-height:100px; _height:100px; 	
	/* background: none -webkit-gradient(linear, left top, left bottom, from(#e7f1f5), to(#fff)) repeat-x; -webkit-background-size:100% 100px; */
}
.panel h3 {margin:10px 0 10px; color:#8fa5b0; font-size:16px;}


/* thumblists, for opskrifter and home page
------------------------------------------------------ */
.thumb img {-ms-interpolation-mode: bicubic;}
.thumblist {margin:0; padding:0;}
.thumblist li {margin:0; padding:0; list-style:none; min-height:100px; _height:100px;padding-left:105px; line-height:16px;}
.thumblist li:after {content:"."; clear:both; display:block; height:0; visibility:hidden;}
.thumblist a { display:block; font-size:14px; text-decoration:none;cursor:pointer; }
.thumblist a .thumb {cursor:pointer;}
.thumblist a:hover .thumb {opacity:.8;}
.thumblist .thumb {float:left; display:inline; margin-left:-105px; width:85px; height:85px; overflow:hidden;-webkit-border-radius:2px; -moz-border-radius:2px; -o-border-radius:2px;border-radius:2px;}
.thumblist .thumb img {display:block; float:left;}
.thumblist h4 {font-size:10px; font-weight:normal; margin:0; padding:0;}
.thumblist p {margin:0 0 .5em; padding:0; line-height:15px;}

.list {margin:0; padding:0;}
.list li {margin:0; padding:0; list-style:none;}
.list a {display:block;padding:6px 0; border-bottom:1px solid #e5e2e0; text-decoration:none; }
.list a .thumb {position:absolute; display:none; margin-top:-18px; margin-left:-60px;width:50px; height:50px; border:3px solid #fff; overflow:hidden; -webkit-box-shadow:1px 1px 3px rgba(0,0,0,.2);}
.list .thumb img {display:block; width:50px;height:50px; }
.list a:hover .thumb {display:block;}



/* Events
------------------------------------------------------ */

/*move the first event down a notch...*/
.eventblock>.main h2{padding-right:100px;min-height:60px;}
.eventblock>.aside {margin-top:120px;}
.eventblock+.eventblock .main h2 {padding-right:0;min-height:0;}
.eventblock+.eventblock .aside {margin-top:0;}
/*ie6*/
.eventblock.first .main h2{padding-right:100px;min-height:60px; }
.eventblock.first .aside {margin-top:120px;}


/*photo albums, primarily used on events */
.photoalbum {top:-5px; width:296px; height:227px;padding-top:23px; overflow:hidden; position:relative; margin:0 0 16px; background:no-repeat url(img/photo-album-bg.png) 0 0; text-align:center;}
.photoalbum a {display:block; width:296px; height:250px;}
.photoalbum a .photoalbum-thumb {cursor:pointer; display:block;margin:0 auto 0; width:250px; height:184px; overflow:hidden; }
.photoalbum a .photoalbum-thumb span {cursor:pointer; position:absolute; top:23px; left:23px; width:250px; height:184px; background:no-repeat url(img/photo-album-bg.png) 0 -270px; _background:none;}
.photoalbum a:hover .photoalbum-thumb span {background-position:0 -470px;}
.photoalbum a:hover .photoalbum-thumb img {opacity:0.8;}

.line .photoalbum {margin:0;}
.main h2 {font-size:24px;margin:8px 0 16px; line-height:28px;}
.line {margin:0; padding:0;}
.line .main {width:365px; margin:0;padding:16px; float:left; min-height:218px; _height:218px;}
.line .aside {float:right;}
.eventblock {margin:0 0 16px;}


/* block color variations*/
.sand {background-color:#f4f2dd; color:#483c26;}
.blue {background-color:#e0ecf2; color:#72858e;}
.violet {background-color:#ebe5f1; color:#665b71;}



/* Opskrifter
------------------------------------------------------ */
.facts {_height:302px; min-height:302px; padding-bottom:43px;}
.facts .actionbuttons {height:43px; background:#f5f5f5;position:absolute; bottom:0;}
.facts .actionbuttons a {display:block; height:43px; float:left; overflow:hidden; text-indent:-5000px;}
.btn-print {width:144px; background:no-repeat url(img/btn-actionbuttons.png);}
.btn-share, .addthis_button {width:152px; background:no-repeat url(img/btn-actionbuttons.png) -144px 0;}
#instructions {padding-bottom:32px;}


/*
=util nav 
------------------------------------------------------ */
/* the print link on recipe pages */
.printout {
	margin:5px 0; 
	padding:0 0 0 20px;
	line-height:18px;
	background:no-repeat url(img/icon-print.gif) 0 50%;
	clear:left;
	
	float:right;
	}
	.printout a,.printout a:visited {
		font-weight:bold;
		color:#567596;
		text-decoration:none;
		}
		.printout a:hover {
			color:#f1854b;
		}

/* teaser links */
.teaser {margin:0 0 10px;}
.teaser a {
	text-decoration:none; 
	color:#493c28;
	display:block;
	_height:1px;
}
.teaser a:visited {}
.teaser a:visited strong {}
.teaser a strong {display:block;white-space:nowrap;}

.arrow,
a .arrow {
	color:#f1854b;
	letter-spacing:-1px;
	font-family:arial,verdana,sans-serif;
	font-weight:bold;
}
.teaser a:hover strong {
	color:#f1854b;
	text-decoration:underline;
}
.thumbs {margin:0;}
.thumbs img {display:block;}


/*
=nav
/////////////////////////////////////////////////////////////// */

#nav ul{margin:0;padding:0;}
#nav li{margin:0;padding:0;list-style:none;}
#nav a.current{color:#f1854b;background:#fff;font-weight:bold;}
#nav a.open {background:transparent;}
#nav a {margin-bottom:-1px; padding:8px 16px 8px 0; display:block; border-bottom:1px solid #e5e5e5; border-top:1px solid #e5e5e5; font-size:13px;text-decoration:none;color:#746d55;line-height:16px;text-align:right;text-shadow:rgba(203,203,203,.5) 0 0 1px; min-height:0; _height:1px;}
#nav a:hover{color:#f1854b;}
#nav ul ul a{padding:5px 16px 5px 5px;display:block;font-weight:normal;text-decoration:none;font-size:11px;line-height:12px;color:#567596;}
#nav ul ul ul { background:#f1f1f1; background:rgba(222,222,222,.25); border:1px solid #e5e5e5; border-width:2px 0;}

/*
=form
/////////////////////////////////////////////////////////////// */
ol.questions li {margin:0 0 9px;}
.buttonrow {text-align:right;}

/*
=forms
/////////////////////////////////////////////////////////////// */
input,select,textarea {
	margin:0;
	padding:2px 3px 2px 3px;
	font-family:Arial, sans-serif;
	font-size:1em;
}

/*
.fr		= form row
.fu		= form unit, often consisting of a label-input couple
.btnrow = button row
.indent	= indents
------------------------------------------------------ */
div.fu					{
							margin:0px 10px 10px 0px; 
							min-height:40px;
							clear:left;
							
						}
div.fr div.fu			{
							float:left;
							display:inline;
							clear:none;
						}
div.fr					{ margin-bottom:10px; min-height:40px; clear:both;}
div.fr:after			{ content:"."; clear:both; display:block; visibility:hidden; height:0;}


div.fr					{ display:inline-block;}
div.fr					{ display:block;}
div.btnrow				{ clear:both; zoom:1; text-align:right;}

label.radio				{ margin-right:5px; padding:2px 3px 2px 0px; font-weight:bold;}
span.radio				{ margin-right:5px; padding:2px 3px 2px 0px; font-weight:bold;}

input.text				{ width:260px;}
.btnrow,
.btnrow a,
.btnrow a:hover			{ font-size:13px; text-decoration:none; color:#333 !important;}

.fu .error				{ float:left; width:100%; color:#c00;}
.radio span label		{ margin-left:5px; font-weight:normal;}
.checkbox span label	{ margin-left:5px; font-weight:normal;}

