/* **************************************************
	Arla
	Styles: Arla da
	Sections:	Typography
				Forms
				Elements
				Generic Elements
				Main containers
				Main navigation
				Content
				01 Startpage
				02 Search
				03 Recipe
				04 Theme
				05 Article
				06 Products
				07 Arlafarm
				08 Food calendar
				09 My pages
				10 Mealplan
				11 menu
				12 Arla forum
				Blog
				13 Top lists
				22 Brandworld
				23 Portlets
				24 Print
				X-forms
				Footer
************************************************** */
/* **************************************************
	Main containers
   ************************************************** */

/* **************************************************
    TYPOGRAPHY
   ************************************************** */
   
/* ------------ Elements using Calibri -------------------- */
div.searchAssistantDa p,
div.nfInspiration div.tabs ul li,
div.nfInspiration div.content div.searchButton,
div.nfInspiration div.content div.text p {
    font-family: Calibri, Arial, Helvetica, Sans-Serif; 
	}
/* ------------ Elements using Arial -------------------- */
#menus div.preparations h3,
#mealPlan div.preparations h3 {
    font-family: Arial, Helvetica, Sans-Serif;
	}

div.searchAssistantDa p {font-size: 1.2em;}
div.nfInspiration div.content h1 {font-size: 2.4em;}
div.nfInspiration div.content h4 {font-size: 1.4em;}
div.nfInspiration div.content div.searchButton {font-size: 1.3em;}
div.nfInspiration div.content div.text p {font-size: 1.3em;}
div.nfInspiration div.tabs ul li {font-size: 1.3em;}
#menus div.preparations h3 {font-size: 1.2em;}
div.searchContainer p.instructions {font-size: 1.4em;}
#page div.searchFilter h5 { font-size: 1.4em; }
/* Page related */  
#pageRelated h3{font-size: 1.4em;}

#pageContent .themeTeaserArea div.themeBox div.content h2,
#pageContent .themeTeaserArea div.brandingBox div.content h4{font-size: 1.4em;}

/* **************************************************
    FORMS
   ************************************************** */
   
/* ------------ Uploadify -------------------- */
.fileUpload
{
    background:transparent no-repeat url(gfx/elements/btnFileUpload_DK.gif) left top;
}




/* **************************************************
    GENERIC ELEMENTS
   ************************************************** */
#content #flashPromo {
	margin-top:1em;
	margin-left: 0px;
	margin-bottom: 2.2em;
	width: 672px;
	}
/* **************************************************
    01 Startpage
   ************************************************** */
	div.searchAssistantDa {
		background: url('gfx/backgrounds/bg-searchassistant-da.jpg') no-repeat;
		width: 196px;
		height: 81px;
		float: right;
		position: relative;
		top: -17px;
		margin-bottom: -17px;
		margin-left: -18px;
		overflow: hidden;
	}
	div.searchAssistantDa p,
	div.searchAssistant p,
	div.searchAssistantDa img {
		margin: 20px 0 0 16px;
		font-weight: bold;
		font-style: italic;
	}

/* Inspirational module, No Flash */
#content #flashPromo {margin-top: 0;}
div#frontpage div.nfInspiration{
	margin-left: 0;
	width: 672px;
	margin-bottom: 0;
	}
div.nfInspiration div.cornerTopLeft {
    position: absolute;
    background: transparent url(gfx/backgrounds/insp-rounded-corners.png) no-repeat 0 0;
    width: 4px;
    height: 4px;
    top: 0px;
    left: 0px;
}
div.nfInspiration div.cornerTopRight {
    position: absolute;
    background: transparent url(gfx/backgrounds/insp-rounded-corners.png) no-repeat -8px 0;
    width: 4px;
    height: 4px;
    top: 0px;
    right: 0px;
}
div.nfInspiration div.cornerBotLeft {
    position: absolute;
    background: transparent url(gfx/backgrounds/insp-rounded-corners.png) no-repeat 0 -8px;
    width: 4px;
    height: 4px;
    bottom: 0px;
    left: 0px;
}
div.nfInspiration div.cornerBotRight {
    position: absolute;
    background: transparent url(gfx/backgrounds/insp-rounded-corners.png) no-repeat -8px -8px;
    width: 4px;
    height: 4px;
    bottom: 0px;
    right: 0px;
}
div.nfInspiration div.content {
    background: transparent url(gfx/backgrounds/insp-content-bg.png) repeat-x left bottom;
    border-color: #dcdcdc #dcdcdc;
}
div.nfInspiration div.content div.origin {
    position: absolute;
    top: 15px;
    right: 15px;
}
div.nfInspiration div.content div.text {
    margin-top: 80px;
    padding-top: 0;
}
div.nfInspiration div.content h1 {
    color: #323232;
    margin: 0;
}
div.nfInspiration div.content a.arrowSmall {
    background-position: 0 5px;
}
#pageContent div.nfInspiration div.content h4 {
    text-transform: none;
    color: #646464;
}
div.nfInspiration div.content div.searchButton {
    position: absolute;
    bottom: 2.5em;
    right: auto;
}
div.nfInspiration div.content div.searchButton a {
    background: transparent url(gfx/icons/icon-backforward.gif) no-repeat scroll right -30px;
    padding-right: 23px;
}
div.nfInspiration div.content div.searchButton img {
    margin-left: 5px;
    margin-bottom: -2px;
}
div.nfInspiration div.btnRight div,
div.nfInspiration div.btnRight {background: none;}

div.nfInspiration div.tabs {
    height: 23px;
    border-top: 0;
    border-left: 1px solid #dcdcdc;
    border-right: 1px solid #dcdcdc;
    background: transparent url('gfx/backgrounds/insp-nav-bg.png') repeat-x; 
}
div.nfInspiration div.tabs ul li {
    background: none;
    height: 23px;
    margin: 0;
}
div.nfInspiration div.tabs ul li img{display: none;}
div.nfInspiration div.tabs ul li.sel,
div.nfInspiration div.tabs ul li:hover {
    background: transparent url('gfx/backgrounds/insp-nav-bg.png') 0 -37px repeat-x;
}
div.nfInspiration div.tabs ul li.sel a,
div.nfInspiration div.tabs ul li a {
    background: none;
    padding: 3px 15px 0 15px;
    color: #646464;
    text-transform: none;
}
div.nfInspiration div.tabs ul li a:active,
div.nfInspiration div.tabs ul li a {
    text-decoration: none;
}
/* FOUR DISHES PORTLET */
div.fourDishesBox div.top {
    background:transparent url(gfx/backgrounds/bg-fourdishes-sprite.png) no-repeat scroll left top;
    height: 3px;
}
div.fourDishesBox div.innerTop {
    background:transparent url(gfx/backgrounds/bg-fourdishes-sprite.png) no-repeat scroll 0 -3px;
    height: 21px;
    padding-top: 0;
}
div.fourDishesBox div.content {
    border: 0;
    background:transparent url(gfx/backgrounds/bg-fourdishes-sprite.png) no-repeat scroll left bottom;
    width: 652px; /*672 - 2x20 margin*/
    padding: .6em 10px 1em 10px;
}
div.fourDishesBox div.bot {
    background: none;
    height: 0px;
}
div.fourDishesBox h3 {
    color: white;
    margin: 1px 27px 0 4px;
    text-transform: none;
}
div.fourDishesBox ul.buttons li a:hover {
    color: white;
}
div.fourDishesBox ul.buttons li a {
    background:transparent url(gfx/buttons/btn-fourdishes-sprite.png) no-repeat scroll right top;
    color: #ffffff;
    font-weight: normal;
    cursor: hand;
}
div.fourDishesBox ul.buttons li a span {
    background:transparent url(gfx/buttons/btn-fourdishes-sprite.png) no-repeat scroll left top;
    padding: 2px 0 3px 11px;
}
div.fourDishesBox ul.buttons li a.selected,
div.fourDishesBox ul.buttons li a:hover {
    background-position: right -52px;
}
div.fourDishesBox ul.buttons li a.selected span,
div.fourDishesBox ul.buttons li a:hover span {
    background-position: left -52px;
}
div.fourDishesBox a.teaserLink {
    color: white;
    top: .5em;
    background: none;
}

/* **************************************************
    02 Search   
   ************************************************** */

/* Search legend text */
	div.searchContainer p.instructions {
		text-transform: none;
		margin-left: 3px;
	}
/* Search formfield and container */	
	div.searchContainer div.searchForm {
		background: url('gfx/backgrounds/bg-searchfield-container.png') no-repeat;
	}
	div.searchContainer div.searchFieldContainer {
		height: 24px;
		background: transparent url(gfx/backgrounds/bg-searchfield.png) no-repeat top left;
		width: 278px;
	}
	div.searchContainer input.searchField {
		width: 261px;
		padding: 5px 8px 0px;
	}
/* Submit search */
	.searchContainer .searchForm span.submit{
		background: transparent url("gfx/buttons/btn-searchfield-sprite.png") top left no-repeat;
		}
	.searchContainer .searchForm span.submit input {
		background: transparent url("gfx/buttons/btn-searchfield-sprite.png") bottom right no-repeat;
		color: #fff;
		margin-right: -6px;
		height: 24px;
		}
	#searchButton {
		left: 4px;
	}
/* All recipe link */
	div.searchContainer p.allRecipes {
		margin-top: 4px;
		padding-right: 13px;
		width:112px;
		}
		div.searchContainer p.allRecipes a {
			color: #fff;
			}
			div.searchContainer p.allRecipes a:hover,
			div.searchContainer p.allRecipes a:active {text-decoration: none;}
		div.searchContainer p.allRecipes .allRecipesIcon{
			background: transparent url(gfx/bullets/bullet-arrow-sprite.png) no-repeat 0 4px;
			background-position: right 5px;
			padding-right: 13px;
			}
		div.searchContainer p.allRecipes .allRecipesText
		{
		    font-size: 11px;
			}
			
		div.searchContainer p.allRecipes a:hover .allRecipesIcon {
            text-decoration: underline;
        }
/* **************************************************
    03 Recipe
   ************************************************** */
.recipeDkSpecial div.left div.recipeOptions{
	
	}
/* **************************************************
    04 Theme
   ************************************************** */
/* **************************************************
    05 Article
   ************************************************** */
    #article .text p{margin-bottom: 0em;}
	#article #content h3 {margin: 1em 0 .3em 0;}
	#article .text h2 { margin-bottom: 0em; }
	#article h1 { margin-bottom: 0em; }
	#article .text table tbody tr th {
	border-top-color: #00aa14;
	border-bottom-color: #00aa14;
	}
	#article .text p img {
        padding: 10px 0;
    }
	#article .text p img.left {
        float:left;
        padding-right:10px;
    }
    
    #article .text p img.right {
        float:right;
        padding-left:10px;
    }
    #article .text p img.left-top {
        float:left;
        padding: 0 10px 0 0;
    }
    #article .text p img.right-top {
        float:right;
        padding: 0 0 0 10px;
    }
/* **************************************************
    06 Products
   ************************************************** */
/* **************************************************
    07 Arlafarm
   ************************************************** */
/* **************************************************
    08 Food calendar
   ************************************************** */
/* **************************************************
    09 My pages
   ************************************************** */
	/* User recipe dk */
	#pageContent .userRecipeDk div.right {
	float:right;
	}
	#pageContent .userRecipeDk div.right img {
	width:180px;
	margin:50px 0 0 0;
	}
	.userRecipeDk .left .ingredients {
	float:right;
	width:180px;
	margin:2em 0 0 2em;
	}
	.userRecipeDk .left .recipeInstructions {
	float:left;
	width:270px;
	margin:2em 0 0;
	}
	
/* **************************************************
    10 Mealplan
   ************************************************** */
   	#mealPlan div.recipeOptions.noTabs {
		/*border-top: 1px solid #d3dee0;*/
		border: none;
	}
	#mealPlan div.preparations {
	    margin-top: 2em;
	}
    #mealPlan div.preparations div.content 
    {
        float: left;
        width: 468px;        
    }
/* **************************************************
    11 menu
   ************************************************** */
   #menus div.preparations,
   #mealPlan div.preparations {
	    float: left;
	    margin-bottom: 1em;
	}
    #menus div.preparations div.content {
        float: left;
        width: 288px;
		}
        #menus div.preparations h3,
        #mealPlan div.preparations h3 {
            margin: 0 0 8px 0;
			}
        #menus div.preparations p,
        #mealPlan div.preparations p {margin: 0 0 8px 0;}
            #menus div.preparations div.prepImage,
            #mealPlan div.preparations div.prepImage {
                width: 180px;
                margin: 0 0 0 40px;
                float: left;
				}
/* **************************************************
    12 Arla forum
   ************************************************** */
/* **************************************************
    Blog
   ************************************************** */
/* **************************************************
    13 Top lists
   ************************************************** */
/* **************************************************
    22 Brandworld
   ************************************************** */
/* **************************************************
    23 Portlets
   ************************************************** */

/* Box backgrounds */
#pageRelated div.relatedBox,
div.searchFilter div#offGrid{background:#fff url(gfx/backgrounds/bg-box-pageRelated-sprite.png) no-repeat left top;}
#contentRelated div.relatedBox {background:transparent url(gfx/backgrounds/bg-box-contentRelated-sprite.png) no-repeat left top;}
div#commentBox div.top {background:transparent url(gfx/backgrounds/bg-box-comments-top.png) no-repeat scroll left top;}

#pageRelated div.relatedBox div.content,
#page #pageRelated .myPagesLogin .content,
div.searchFilter div#offGrid div.content{background:  url(gfx/backgrounds/bg-box-pageRelated-sprite.png) no-repeat left bottom;}

#contentRelated div.relatedBox div.content {background:  url(gfx/backgrounds/bg-box-contentRelated-sprite.png) no-repeat left bottom;}


/* article */
div#article div.contentPortletArea div.relatedBox {
	background:transparent url(gfx/backgrounds/bg-box-articleContent-sprite.png) no-repeat left top;
	}
div#article div.contentPortletArea div.relatedBox .content {
	background: transparent url(gfx/backgrounds/bg-box-articleContent-sprite.png) no-repeat left bottom;
	}


/* Box paddings */
#pageRelated div.relatedBox,
#contentRelated div.relatedBox, 
#content.double div.right div.relatedBox,
div.searchFilter div#offGrid,
div#article div.contentPortletArea div.relatedBox {
	padding-top: 4px;
	}

#pageRelated div.relatedBox div.content,
#page #pageRelated .myPagesLogin .content,
#contentRelated div.relatedBox .content, 
#content.double div.right div.relatedBox .content,
div.searchFilter div#offGrid div.content,
div#article div.contentPortletArea div.relatedBox .content {
	padding: 1.2em 14px 0.7em 13px;
	}
	
/* Box headings */
#pageRelated .relatedBox .content h3,
div.searchFilter div#offGrid div.heading,
.themeTeaserArea div.brandingBox div.content h4,
#page #article .contentPortletArea div.relatedBox h3,
#pageContent .themeTeaserArea div.themeBox div.content h2{
	background: url(gfx/backgrounds/bg-box-pageRelated-sprite.png) no-repeat left -24px;
	color: #fff;
	margin-top: -2.6em;
	text-transform: none;
	line-height: 15px;
	font-size: 1.5em;
	position: relative;
	width: 182px;
	margin: -12px -14px .65em -13px;
	padding: 0 11px 5px;
	overflow: hidden;
	font-weight:bold;
	}
	#pageRelated .myPagesLogin .content .heart{
	    margin-bottom: -8px;
	}
div.searchFilter div#offGrid div.heading{margin-bottom: 0; float: left;}
#pageRelated h3{background-color: Transparent;}
#page #article .contentPortletArea div.relatedBox h3{
	width: 302px;
	background: transparent url(gfx/backgrounds/bg-box-articleContent-sprite.png) no-repeat left -24px;
	margin-left: -13px;
	}
/* Box lists */
#pageRelated div.relatedBox ul.dishList {
	background-color: Transparent;
	}
#pageRelated div.relatedBox ul.linkList {margin: 0 0 .4em; float: none;}
/* Search Navigation */
div.searchNav p.left a {
    background:transparent url(gfx/buttons/btn-searchfilter-exclude-sprite.gif) no-repeat scroll right 4px;
}
div.searchNav p.left a:hover {
    background:transparent url(gfx/buttons/btn-searchfilter-exclude-sprite.gif) no-repeat scroll right -23px;
}      


/* Searchfilter box */	
div.searchFilter div#offGrid {
	left:0px;
	position:relative;
	width:204px;
	}
#page div.searchFilter h5{
    margin: 0; 
    height: 20px;
    text-transform: none;
    }
div.searchFilter span.moreFiltersText:active{text-decoration: none;}
div.searchFilter a.moreFilters{float: right; padding-top: 0; line-height: 17px; display: block; z-index: 999;}
div.searchFilter a.moreFilters:focus{text-decoration: none;}
div.searchFilter .moreFilters .moreFiltersIcon{
    margin-right: 0; 
    margin-top:0;
	background: url(gfx/buttons/btn-searchfilter-sprite.png) no-repeat 0px -54px;
	}
	div.searchFilter .moreFilters span.fewer{
		background: url(gfx/buttons/btn-searchfilter-sprite.png) no-repeat 0px -36px;
		}
#pageRelated div.searchFilter .seperator{
	margin: .5em -12px 0 -12px;
	width: 202px;
	}
#pageRelated div.searchFilter h4, #pageRelated div.searchFilter h3{margin-top: -1px;}
#pageRelated div.searchFilter h4.hoverState,
div.searchFilter li.hoverState,
div.searchFilter li.selected {
		background: none;
		background-color: #e7e3e1;
		margin-left: -12px;
		margin-right: -12px;
		width: 202px;
	}
	#pageRelated div.searchFilter h4.hoverState span,
	div.searchFilter li.hoverState span,
	div.searchFilter li.selected span {
		background: none;
		background-color: #e7e3e1;
		padding-left: 12px;
		padding-right: 12px;
	}
div.searchFilter li.selected a{font-weight: bold;}
#pageRelated div.searchFilter h3.allergy {
    margin: .5em 0 0 -4px;
}
/* My pages Login */
#page #pageRelated .myPagesLogin .content{
	margin-bottom: -20px;
	padding-bottom: 20px;
	}
#page #pageRelated .myPagesLogin h3.heart a{
	padding-left: 0; 
	background-image: none;
	color: #fff;
	padding-top: 0;
	}
#page #pageRelated .myPagesLogin h3.heart span.heartIcon{
    background:url('gfx/icons/icn-box-mypages.png') no-repeat right top; 
	width: 17px;
	height: 15px;
	position: absolute;
	top: 0;
	right: 13px;
	display: block;
	}

/* ------ Branding Box ------*/
.themeTeaserArea div.brandingBox,
.themeTeaserArea div.themeBox {
	width: 224px;
	overflow: hidden;
    background:transparent url('gfx/backgrounds/bg-box-frontpage-sprite.png') no-repeat scroll left top;
    padding-top: 4px;
	width: 224px;
	float: left;
	overflow: hidden;
	}
	.themeTeaserArea .themeImage{margin-top: 12px; margin-left: -13px;}
	.themeTeaserArea div.brandingBox div.content,
	.themeTeaserArea div.themeBox div.content {
		background:transparent url('gfx/backgrounds/bg-box-frontpage-sprite.png') no-repeat scroll left bottom;
		padding:.6em 0px .8em 0px;
		width: 224px;
	    float: left;
	    position: relative;
		}
		.themeTeaserArea div.themeBox div.content{
			padding: .6em 13px;
			width: 198px;
			}
		.themeTeaserArea div.themeBox div.content ul li a{font-weight: bold;}
		#pageContent .themeTeaserArea div.brandingBox div.content h4,
		#pageContent .themeTeaserArea div.themeBox div.content h2{
			background: url(gfx/backgrounds/bg-box-frontpage-sprite.png) no-repeat left -24px;
			margin: -6px -13px;
			width: 224px;
			margin-bottom: 149px;
			white-space: nowrap;
			text-transform: none;
			}
		#pageContent .themeTeaserArea div.themeBox div.content h2{
			margin-bottom: 0;
			position: absolute;
			top: 4px;
			left: 0;
			margin-left: 0;
			}
	    .themeTeaserArea div.brandingBox div.left {
	        float: none;
	        width: 198px;
	        padding: 0 13px;
			}
		.themeTeaserArea div.brandingBox div.right {
	        float: none;
	        width: 224px;
	        height: 142px;
			position: absolute;
	        top: 20px;
	        overflow: hidden;
	        left: 0;
	        z-index: 99;
			}
			
			
			.themeTeaserArea div.noHeader div.right {
    	        top: 0px;
			}
			.themeTeaserArea div.noHeader{
                background:transparent;
                padding-top: 0px;
            }
            .themeTeaserArea div.noHeader div.left {
	            margin-top:143px;
	            float:left;
			}
			
			
			
	    .themeTeaserArea  div.brandingBox div.right img {} 

		
/* **************************************************
    Print
   ************************************************** */

/* **************************************************
    X-forms
   ************************************************** */
#id_matrix {width:310px; margin-top: 2em;}
table tbody tr td span.formHeading,
.complaints span.formHeading {
	border-bottom:solid 3px #009114;
	}

table tbody tr td label,
.complaints ul li label {
	font-weight:normal;
	}