@import url("reset.css");
body {
	background-color: #FFF;
	background-image : url(../images/_shared/background_body.jpg);
	background-repeat : repeat-x;
	color: #000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%;
}
/* altijd handig */
.clearfix { clear: both; }
.hidden {
	position: absolute;
	left: -999em;
}
.block {
	margin: 12px 0 10px 0;
	padding: 0
}
/* linkjes */
a { color: #EE3439; }
a:hover { text-decoration: none; }
/* headers */
h1 {
	font-size: 120%;
	font-weight: bold;
	color: #EE3439;
	border-bottom: 1px solid #CECECE;
	margin: 15px 0
}
h2 {
	font-size: 140%;
	font-weight: bold;
	color: #397BB5;
	border-bottom: 1px solid #CECECE;
	margin: 15px 0;
	padding: 0px 0px 10px 0px;
}
h3 {
	font-size: 120%;
	font-weight: bold;
	color: #EE3439;
	border-bottom: 1px solid #FFE3CB;
	margin: 10px 0;
	padding: 0px 0px 10px 0px;
}
h4 {
	font-size: 100%;
	font-weight: bold;
	color: #397BB5;
	border-bottom: 1px solid #CECECE;
	margin: 15px 0;
	padding: 0px 0px 10px 0px;
}
/* overige algemene tags */
strong { font-weight: bold; }
hr {
	height: 1px;
	margin: 15px 0px 15px 0px;
	color: black;
	border-bottom: 1px solid #CECECE;
	display : block;
}
p { margin: 15px 0; }
div#content ul {
	list-style: disc;
	margin: 1.1em 2.2em;
	vertical-align:middle
}
div#overlay {
	position: absolute;
	top: 175px;
	width: 100%;
	background: url(../images/spacer.gif) repeat left top;
}
.ajaxLoading {
	width: 300px;
	height: 50px;
	padding: 50px 0;
	margin: 0 auto;
	background: #FFF url(../images/spacer.gif) repeat left top;
	text-align:center;
}
div.post-it {
	position:absolute;
	left:490px;
	top:0px;
	width:630px;
	padding:0 20px;
	border: 1px #D18D8E solid;
	border-top:none;
	background-color:#FFF;
	background-position: right top;
	background-repeat: repeat-y;
	background-image: url(../images/_shared/background_content.jpg);
	font-size: 1.0em;
	line-height: 1.3em;
	z-index:1000;
}
/* structuur */
div#container {
	width: 958px;
	margin: 16px auto;
	padding-top: 4px;
	background-image: url(../images/_shared/shadow_header.png);
	background-position: top left;
	background-repeat : no-repeat;
}
div#inner {
	width: 950px;
	padding: 0 4px;
	background-color: transparent;
	background-position: top left;
	background-repeat:repeat-y;
	background-image:url(../images/_shared/background_inner.png);
}
div#header {
	width: 940px;
	height:151px;
	margin: 0 5px;
	padding-top: 26px;
	background-color:white;
	background-image: url(../images/_shared/background_header.jpg);
	background-position : center 4px;
	background-repeat : no-repeat;
}
div#content {
	width: 906px;
	position:relative;
	margin: 0px 5px;
	padding:16px;
	border: 1px #D18D8E solid;
	border-top:none;
	background-color:#FFF;
	background-position: right top;
	background-repeat: repeat-y;
	background-image: url(../images/_shared/background_content.jpg);
	font-size: 1.1em;
	line-height: 1.5em;
}
div#content_footer {
	width: 906px;
	position:relative;
	clear:both;
	background-color: #FFF;
	background-image: url(../images/_shared/background_content_bottom.jpg);
	background-position : right top;
	background-repeat : repeat-y;
	height: 30px;
	border-top: 4px #FFF solid;
	border-bottom: 4px #FFF solid;
}
div#menu_bottom {
	width: 940px;
	margin: 0 5px;
	height:48px;
	background-color: #FFF;
}
div#footer {
	width: 958px;
	height: 4px;
	background-image: url(../images/_shared/shadow_footer.png);
	background-position: top center;
	background-repeat : no-repeat;
}
div#animatie_1 {
	position:absolute;
	width: 126px;
	height: 184px;
	text-align: right;
}
div#content_left {
	float:left;
	width:750px;
}
div#content_right { }
div#intro {
	width: 906px;
	position:relative;
	margin: 0px 5px;
	padding:16px;
	border: 1px #D18D8E solid;
	border-top:none;
	background-color:#FFF;
}
#man_vrouw_ani {
	position:absolute;
	top:40px;
	height: 121px;
	width:86px;
	margin-left:20px;
	background-color:transparent;
	background-position:left top;
	background-repeat:no-repeat;
	background-image: url(../images/animaties/man.png);
}
/* - IE6 PNG Support - */
* html div#container { background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://www.caloriechecker.nl/www/images/_shared/shadow_header.png');
}
* html div#inner { background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='http://www.caloriechecker.nl/www/images/_shared/background_inner.png');
}
* html div#footer { background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://www.caloriechecker.nl/www/images/_shared/shadow_footer.png');
}
* html div#man_vrouw_ani { background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://www.caloriechecker.nl/www/images/animaties/man.png');
}
div#content_footer a.redlink {
	float:left;
	height:24px;
	padding: 6px 6px 0 6px;
	color:#FFF;
	background:#EE3439;
	text-decoration:none;
	margin:auto;
}
div#content_footer a.redlink:hover { text-decoration:underline; }
div#content_footer a.right { float:right; }
/*** Menu ***/
#menu { padding-top:121px; }
#menu ul {
	height:29px;
	padding-left:19px;
}
#menu li { float:left; }
#menu li a {
	position:relative;
	display:block;
	height: 30px;
	text-decoration: none;
	background-color: transparent;
	background-repeat: no-repeat;
	background-image: url(../images/_menu/menu_new.jpg);
}
#menu li a span { display:none; }
#menu_1 a {
	background-position:  -18px 0px;
	width:  94px;
}
#menu_2 a {
	background-position: -112px 0px;
	width: 122px;
}
#menu_3 a {
	background-position: -234px 0px;
	width:  97px;
}
#menu_4 a {
	background-position: -331px 0px;
	width:  70px;
}
#menu_5 a {
	background-position: -401px 0px;
	width: 126px;
}
#menu_6 a {
	background-position: -527px 0px;
	width:  94px;
}
#menu_6 a.logout { background-position: -622px 0px; }
#menu_1 a:hover, #menu_1.active a { background-position:  -18px -30px; }
#menu_2 a:hover, #menu_2.active a { background-position: -112px -30px; }
#menu_3 a:hover, #menu_3.active a { background-position: -234px -30px; }
#menu_4 a:hover, #menu_4.active a { background-position: -331px -30px; }
#menu_5 a:hover, #menu_5.active a { background-position: -401px -30px; }
#menu_6 a:hover, #menu_6.active a { background-position: -527px -30px; }
#menu_6 a.logout:hover, #menu_6.active a.logout { background-position: -622px -30px; }
/*** Menu Bottom ***/
#menu_bottom { background-image : url(../images/_menu/menu_bottom.gif); }
#menu_bottom #menub ul { height:48px; }
#menu_bottom #menub li { float:left; }
#menu_bottom #menub li a {
	position:relative;
	display:block;
	height: 48px;
	text-decoration: none;
}
#menu_bottom #menub li a span { display:none; }
#menu_bottom #menub_1 a { width: 183px; }
#menu_bottom #menub_2 a { width: 114px; }
#menu_bottom #menub_3 a { width: 122px; }
#menu_bottom #menub_4 a { width: 99px; }
#menu_bottom #menub_5 a { width: 218px; }
#menu_bottom #menub_6 a { width: 204px; }
/* Form styles */
div.form-container { margin: 10px 0px 10px 0px; }
p.legend { margin-bottom: 1em; }
p.legend em {
	color: #C00;
	font-style: normal;
}
div#errors {
	float: right; /* Needed to solve the Peekaboo bug in IE6 */
	margin: 25px 0 10px 0;
	padding: 5px 10px 15px 10px;
	border: #FC6 1px solid;
	background-color: #FFC;
	display: none;
}
div.message {
	position: relative;
	display:block; /* Needed to solve the Peekaboo bug in IE6 */
	font-weight: bold;
	color: #EE3439;
	margin: 0 auto;
	padding: 17px 10px;
	border: #FC6 1px solid;
	background-color: #FFC;
	width:90%
}
div.form-container form p { margin: 20px 0 0 0; }
div.form-container form p.note {
	margin-left: 170px;
	font-size: 90%;
	color: #333;
}
div.form-container form fieldset {
	margin: 10px 0;
	padding: 10px;
}
div.form-container form legend {
	font-weight: bold;
	color: #666;
}
div.form-container form fieldset div { padding: 0.25em 0; }
div.form-container input, textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	margin:10px 0px 0px 0px;
}
div.form-container label, div.form-container span.label {
	margin:10px 0px 0px 0px;
	padding-right: 10px;
	width: 150px;
	display: block;
	float: left;
	text-align: left;
}
div.form-container label.right {
	width:222px;
	float:right;
}
div.form-container fieldset.smallform label {
	width: 70px;
}
div.form-container fieldset.smallform .button { margin-left:78px; }
div.form-container label.error, div.form-container span.error { color: #C00; }
div.form-container label em, div.form-container span.label em {
	position: absolute;
	right: 0;
	font-size: 120%;
	font-style: normal;
	color: #C00;
}
div.form-container input.error {
	border-color: #C00;
	background-color: #FEF;
}
div.form-container div.controlset label, div.form-container div.controlset input {
	display: inline;
	float: none;
}
div.form-container div.controlset div { margin-left: 170px; }
div.form-container div.buttonrow {
	position: relative; /* Needed to solve the Peekaboo bug in IE6 */
	margin-left:158px;
}
div.form-container div.buttonrow input { padding:2px; }
div.form-container span.dagnotatie { color:#999999; }
div.form-container input.inputshort { width:132px; }
div.form-container input.inputshorter { width:62px; }
div.form-container label.radiolabel {
	width:30px;
	color:#999999;
	float:none;
	display: inline;
	margin-right:7px;
}
/* overige */
#content .col1 {
	float:left;
	width: 406px;
	margin:0 15px;
}
#content .col2 {
	float:right;
	width: 406px;
	margin:0 15px;
}
div#dagboek {
	position:relative;
	margin:20px auto;
	width:906px;
}
div#dagboek p.uitleg {
	display: block;
	margin:4px auto;
	width:900px;
	padding: 3px;
	background-image : url(../images/bg/uitleg.jpg);
	background-position :right top;
	background-repeat : repeat-y;
}
div#dagboek #zoekbox {
	display: block;
	clear:both;
	width:894px;
	padding: 4px;
	border: 2px solid #EE353A;
	background : #FFE3CB;
	margin: 4px auto 0px;
	height: 30px;
}
div#dagboek #resultaatbox {
	padding: 8px 0;
	padding-bottom:20px;
	background: #FFE3CB;
	margin: 0 auto;
}
div#dagboek #resultaatbox .highlight { background-color:#FFFF66 }
div#dag_moment {
	clear:both;
	position:relative;
	background-color:#FFE3CB;
	margin:0 auto;
	display:block;
	width:906px;
	height:37px;
}
div#dag_moment a {
	float:left;
	padding:10px 16px 11px 24px;
	color:#040404;
	text-decoration:none;
	font-weight:bold;
	border-right:solid 2px #FFFFFF;
	background-color:#FFE3CB;
	background-image:url(../images/icons/circle_white.gif);
	background-repeat: no-repeat;
	background-position: left center;
}
div#dag_moment a.dagmoment_done { background-image: url(../images/icons/circle_check.gif); }
div#dag_moment a.dagmoment_active {
	background-color:#EE353A;
	background-image: url(../images/icons/circle_redarrow.gif);
}
div#dag_moment a:hover {
	background-color:#EE353A;
	background-image: url(../images/icons/circle_white_redbg.gif);
}
div#dag_moment a.bereken_advies {
	background:url(../images/buttons/normal/bereken_adv.png) no-repeat left;
	width:158px;
	height:37px;
	padding:0px;
	border:none;
}
div#dag_moment a.bereken_advies:hover { background:url(../images/buttons/over/bereken_adv.png) no-repeat left; }
div#dag_moment a.bereken_advies span { display:none; }
#suggest li {
	width:25%;
	float:left;
	display:block;
}
#suggest li.one { width:80%; }
.voorkeursproduct { color: #009900; }
.middenwegproduct { color: #FF9900; }
.bij_uitzondering { color: #EE3439; }
a.redlink {
	color:#FFF;
	background:#EE3439;
	text-decoration:none;
	padding:5px;
}
a.redlink:hover { text-decoration:underline; }
div#row3 {
	width:906px;
	background:#FFE3CB url(../images/spacer.gif) repeat left top;
}
div#row3 #cat_icon {
	float: left;
	margin-left:13px;
	width: 160px;
	height: 67px;
	background-image : url(../images/bg/r2_arrows.gif);
	background-position: right top;
	background-repeat : no-repeat;
}
div#row3 #select_prod_holder {
	float:left;
	border-right: 2px solid white;
	background: url(../images/spacer.gif) repeat left top;
}
div#row3 #select_prod {
	width:245px;
	margin: 20px 9px 25px;
	overflow:hidden;
}
div#row3 #select_eenheid_holder {
	float: left;
	border-right: 2px solid white;
}
div#row3 #select_eenheid_holder label {
	float: left;
	margin: 24px 4px 24px 10px;
}
div#row3 #select_eenheid {
	width: 105px;
	margin: 20px 9px 25px 0px;
}
div#row3 #select_aantal_holder { float: left; }
div#row3 #select_aantal_holder label {
	float: left;
	margin: 24px 4px 24px 10px;
}
div#row3 #select_aantal {
	width: 30px;
	text-align: center;
	margin: 20px 27px 27px 0px;
}
a.bereken_cal {
	float: right;
	border-left: 2px solid white;
	width: 110px;
	height: 67px;
	margin-right: 50px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/buttons/normal/bereken_cal.gif);
}
a.bereken_cal:hover { background-image: url(../images/buttons/over/bereken_cal.gif); }
a.bereken_cal_vet {
	float: right;
	border-left: 2px solid white;
	width: 130px;
	height: 67px;
	margin-right: 30px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/buttons/normal/bereken_cal_vet.gif);
}
a.bereken_cal_vet:hover { background-image: url(../images/buttons/over/bereken_cal_vet.gif); }
#dagboek #overzicht {
	float:left;
	margin-top: 4px;
	width:765px;
}
#dagboek #banner {
	float:right;
	margin-top: 4px;
	border: 2px solid #FFE3CB;
}
div#zoekbalk {
	position:relative;
	margin:4px auto;
}
div#row3 a span, div#zoekbalk a span { display:none; }
#zoekPerProductGroep {
	float:left;
	display:block;
	height: 67px;
	width:121px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/labels/zoek_productgroep.gif);
}
div#zoekbalk a#zoekOpTrefwoord {
	position:absolute;
	right:0;
	height: 67px;
	width:110px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/buttons/normal/zoek_trefwoord.gif);
	z-index:99;
}
div#zoekbalk a#zoekOpTrefwoord:hover { background-image: url(../images/buttons/over/zoek_trefwoord.gif) }
* html div#zoekbalk a#zoekOpTrefwoord {
	position:relative;
	float:right;
	right:auto;
}
div#zoekbalk a#scrollLeft {
	float:left;
	width:53px;
	height:67px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/buttons/normal/left.gif)
}
div#zoekbalk a#scrollLeft:hover { background-image: url(../images/buttons/over/left.gif) }
div#zoekbalk a#scrollRight {
	position:absolute;
	width:53px;
	height:67px;
	background-color:#FFE3CB;
	background-position: left top;
	background-repeat:no-repeat;
	background-image: url(../images/buttons/normal/right.gif);
	z-index:99;
}
div#zoekbalk a#scrollRight:hover { background-image: url(../images/buttons/over/right.gif) }
div#zoekbalk #list {
	width: 569px;
	height: 63px;
	float:left;
	overflow: hidden;
	border-top: 2px solid #FCDECC;
	border-bottom: 2px solid #FCDECC;
	z-index:1;
}
div#zoekbalk .section { float:left; }
div#zoekbalk .section a img { border-right: 2px solid #FCDECC; }
div#zoekbalk #list div.section_content {
	width: 10000px;
	z-index:2;
}
#tbl_overzicht {
	border-top: 2px solid #FFE3CB;
	border-left: 2px solid #FFE3CB;
	width:100%;
}
#tbl_overzicht th {
	border-right: 2px solid #FFF;
	border-bottom: 1px solid #FFE3CB;
	color: #600;
	font-weight: bold;
	background : #FFE3CB;
	padding: 4px;
}
#tbl_overzicht th#last { border-right: none; }
#tbl_overzicht td {
	border-right: 2px solid #FFE3CB;
	border-bottom: 2px solid #FFE3CB;
	background-color: #FFF;
	padding: 4px;
}
#tbl_overzicht td.trash { text-align : center; }
#tbl_overzicht td.trash a {
	display:block;
	margin: 0 auto;
	width: 13px;
	height: 17px;
	background-color:transparent;
	background-position:center center;
	background-repeat:no-repeat;
	background-image:url(../images/icons/trash_tray.gif);
}
#tbl_overzicht td.trash a span { display:none; }
#tbl_overzicht tr:hover td { background-color: #FFF6EE; }
div#content #banner {
	float:right;
	margin-top: 4px;
	border: 2px solid #FFE3CB;
	height:272px;
	width:105px;
}
ul#faq_links { margin: 20px 0px 20px 25px; }
div#faq_content { padding: 10px 16px 0px 16px; }
div.faq_item {
	margin: 0px 0px 10px 0px;
	padding: 5px 10px 15px 10px;
	border: #F1F0F2 1px solid;
	background-color: #FCFCFC;
}
div.javascript_error ul {
	padding-bottom:5px;
	padding-left:10px;
	padding-top:5px;
	width:938px;
	margin: 10px auto;
	background-color:#0CF;
	border:1px solid #09F;
}
div.javascript_error ul li {
	color:#900;
	font-weight:bold;
}
p.advies {
	background-color:#EE353A;
	padding:10px;
	color:#FFF;
}
p.advies a { color:#FFF; }
p.calorieen {
	font-weight:bold;
	display:block;
	margin:4px auto;
	width:900px;
	padding: 10px 3px;
	background-image : url(../images/bg/uitleg.jpg);
	background-position :right top;
	background-repeat : repeat-y;
}
p.calorieen strong {
	font-size:20px;
	color:#EE353A;
}
p.tip {
	border:1px #EE353A solid;
	padding:10px;
	color:#EE353A;
}
/* kalender */

/* div for the calendar markup - text must be centered */
div#calendar {
	width: 30em;
	float:left;
	margin-right:20px;
}
div#calendar select {
	width:200px;
	margin:10px 0px;
}
/* calendar heading color */
div#calendar h2.calendar {
	color: #669900;
	font-weight: normal;
}
/* list info - monospace font must be used */
div#calendar ul#days, #calendar ul.weeks {
	font-family: 'courier new', monospace;
	list-style-type: none;
	margin: 10px 0 20px 0;
}
/* day-box span styles - adjust with padding */ 
div#calendar ul#days li span {
	background-color: #EE3439;
	border: 1px solid #000;
	cursor: default;
	font-weight: bold;
	color: #fff;
	padding: 5px;
}
/* active links boxes default state - adjust with padding */
div#calendar ul.weeks li a.al, div#calendar ul.weeks li a.na {
	color: #666;
	text-decoration: none;
	background-color: #ffffcc;
	border: 1px solid #999;
	padding: 5px;
}
/* all states of not-used links */
div#calendar ul.weeks li a.na, div#calendar ul.weeks li a.na:hover, div#calendar ul.weeks li a.na:focus, div#calendar ul.weeks li a.na:active {
	background: transparent;
	color: #666;
}
div#calendar ul.weeks li a.al {
	background: transparent;
	cursor: default;
	font-weight:bold;
	color:#EE3439;
	border:solid 1px #EE3439;
}
div#calendar ul.weeks li a.td { background-color:#FFC; }
/* hover and focus state of active links */
div#calendar ul.weeks li a.al:hover, div#calendar ul.weeks li a.al:focus, div#calendar ul.weeks li a.al:active {
	color: #000;
	background-color: #EE3439;
	border: 1px solid #000;
	text-decoration: none;
	cursor: pointer;
}
/* not used link boxes - color and background should match - adjust with padding */
div#calendar ul.weeks li a.nu {
	color: #eee;
	padding: 5px;
	border: 1px solid #ccc;
	background-color: #eee;
	cursor: default;
}
/* to hide link separators */
div#calendar span.sep { display: none; }
/* this needs to be in conditional comment for IE only */
div#calendar div#calendar {
	font-size : 0.9em;
	letter-spacing : 0.001em;
}
/* maanden vergelijken */
button.vergelijk_maanden {
	float:left;
	width:103px;
	height:39px;
	margin:10px 0px;
	border:none;
	cursor:pointer;
	background-color:transparent;
	background-position: left top;
	background-repeat:no-repeat;
	background-image:url(../images/buttons/normal/vergelijk.gif);
}
button.vergelijk_maanden:hover { background-image:url(../images/buttons/over/vergelijk.gif); }
button.vergelijk_maanden span { display:none; }
#vergelijk_dropdowns {
	margin:10px 0px;
	padding-bottom:10px;
	border-bottom: 1px solid #FFE3CB;
}
#vergelijk_dropdowns img { margin:10px 0px 0px 0px; }
/* grafiek */	
#grafiek {
	display:block;
	height:200px;
	width:100%;
	margin-top:8px;
}
.grafiekcolumn {
	display:block;
	float:left;
	width:23px;
	height:200px;
	border-right:solid 1px #CCCCCC;
	background: url(../images/bg/graph.jpg) repeat-x;
}
#dagengrafiek {
	display:block;
	height:40px;
}
.dag {
	display:block;
	background:#FDEADB;
	padding:2px 0px;
	float:left;
	width:23px;
	border-right:solid 1px #CCCCCC;
	border-top:solid 1px #CCCCCC;
	text-align:center;
}