/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}




/*//////////////////////////////////////////////////
SYROS
//////////////////////////////////////////////////*/

body {
	background-color: #101a3c;
	font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
	font-size: 62.5%;
}

#container {
	background-color: #FFF;
	height: 600px;
	width: 960px;
}

#horizon {
	left: 0;
	position: absolute;
	text-align: center;
	top: 0;
	height: 100%;
	width: 100%;
}

#wrapper {
	height: 600px;
	left: 50%;
	margin-left: -480px;
	margin-top: -300px;
	position: absolute;
	text-align: left;
	top: 50%;
	width: 960px;
}

/*//////////////////////////////////////////////////
NAVIGATIE
//////////////////////////////////////////////////*/

#topnav ul, #topnav li {
	display: inline;
}

#topnav li {

	padding: 0 3px;
}

#topnav {

	float: left;
	height: 20px;
	left: 12px;
	position: relative;
	top:20px;
	width: 820px;
	
}

#topnav a {
	text-decoration: none;
	text-transform: uppercase;
	font-size: 1.5em;
}

#topnav a:link {color:#031d72;}
#topnav a:visited {color:#031d72;}
#topnav a:hover {color:#5bc11e;}
#topnav a:active {color:#bfd000;}

#topnav a.active 			{color:#e0e1ea;}
#topnav a.active-guacamole 	{color:#5bc11e;}
#topnav a.active-avocado 	{color:#8bd05c;}
#topnav a.active-chakalaka 	{color:#f7c700;}
#topnav a.active-lime	 	{color:#c1d000;}

/*#topnav a.active:hover, #topnav a.active-guacamole:hover, #topnav a.active-avocado:hover, #topnav a.active-chakalaka:hover, #topnav a.active-lime:hover {
	color: #FFF;
}*/

#langnav {
	float: left;
	left: 18px;
	position: relative;
	text-align: right;
	top:25px;
	width: 100px;
}

#langnav ul, #langnav li {
	display: inline;
}

#langnav li {
	
}

#langnav a {
	font-size: 1.4em;
	text-decoration: none;
}

#langnav a:link {color:#645d96;}
#langnav a:visited {color:#645d96;}
#langnav a:hover {color:#5bc11e;}
#langnav a:active {color:#fcc700;}

#header {
	clear: both;
	height: 60px
}

#langnav a.active {
	text-decoration: underline;
}

/*//////////////////////////////////////////////////
HOME
//////////////////////////////////////////////////*/

#home {
	left:12px;
	position: relative;
	width: 942px;
}

#intro {
	background-color: #e0e1ea;
	float: left;

	height: 516px;
	width: 242px;
}

#intro p {
	padding: 0 0 0 12px;
	width: 90%;
	font-size: 1.3em;
}

#chapters {
	float: left;
	padding-left: 12px;
	width: 682px;
}

#chapters li {
	background-color: #EEE;
	height: 120px;
	margin-bottom: 12px;	
}

/*//////////////////////////////////////////////////
CONTENT
//////////////////////////////////////////////////*/

#content {
	clear: both;
	height: 516px;
	left:12px;
	position: relative;
	width: 942px;
}

#contentCopy {
	background-color: #e7f7e0;
	float: left;
	height: 516px;
	width: 788px;
}

#contentCopy.contact {
	background-color: #e0e1ea;
}

#contentCopy.lime_products {
	background-color: #fafbe8;
}

#contentCopy.chakalaka {
	background-color: #fef5dc;
}

#contentCopy.guacamole {
	background-color: #e7f7e0;
}

#contentCopy.avocado {
	background-color: #e7f7e0;
}

#contentCopy.about_syros {
	background-color: #e0e1ea;
}

#contentImg {
	float: left;
	margin-left: 12px;
	width: 130px;	
}

.contentNav {
	font-size: 1.5em;
	height: 20px;
	padding: 5px 0 0 60px;;
	text-transform: uppercase;
}

.contentNav a {
	text-decoration: none;
}

.contentNav a:link, .contentNav a:visited {
	color:#FFF;
}

#contentScroll {
	height: 380px;
	padding: 60px 20px 0 60px;
}

#contentScroll p, #contentScroll li {
	width:85%;
	font-size: 1.4em;
	line-height: 140%;
}

#contentContact {
	position: relative;
	width: 140px;
	height: 300px;
	float:left;
	padding: 80px 0 0 60px;
}

#googlemap {
	position: relative;
	left:200px;
	top:40px;
	margin-top: -220px;
	width: 480px;
	height: 380px;
	float:left;
}

#contentCopy.guacamole>#contentScroll {
	height: 380px;
}

#contentCopy.lime_products>#contentScroll {
	height: 355px;
}

#contentCopy.chakalaka>#contentScroll {
	height: 405px;
}

#contentCopy.about_syros>#contentScroll {

	height: 430px;
}


#cn_guacamole_mild_spicy 	{ background-color: #5bc11e;}
#cn_guacamole_hpp 			{ background-color: #76ca39;}
#cn_guacamole_recipes 		{ background-color: #a3da7a;}

#cn_guacamole_mild_spicy, #cn_guacamole_hpp, #cn_guacamole_recipes {
	background-image:  url(../img/bg_subnav_guacamole.png);
	background-repeat: no-repeat;
	background-position: 680px 6px;
}

#cn_lime_pure_lime_juice 	{ background-color: #cfd51f;}
#cn_lime_kaypa	 			{ background-color: #d6db40;}
#cn_lime_lime_peel	 		{ background-color: #dde262;}
#cn_lime_recipes	 		{ background-color: #e7ea8f;}

#cn_lime_pure_lime_juice, #cn_lime_kaypa, #cn_lime_lime_peel, #cn_lime_recipes {
	background-image:  url(../img/bg_subnav_lime.png);
	background-repeat: no-repeat;
	background-position: 680px 6px;
}

#cn_contact 				{ background-color: #0f0a4d;}

#cn_about_syros 			{ background-color: #0f0a4d;}

#cn_contact, #cn_about_syros {
	background-image:  url(../img/bg_subnav_syros.png);
	background-repeat: no-repeat;
	background-position: 680px 6px;
}


#cn_chakalaka_pineapple 	{ background-color: #ff7700;}
#cn_chakalaka_recipes		{ background-color: #ffac66;}

#cn_chakalaka_pineapple, #cn_chakalaka_recipes {
	background-image:  url(../img/bg_subnav_chakalaka.png);
	background-repeat: no-repeat;
	background-position: 680px 6px;
}

#cn_avocado_pulp 			{ background-color: #5bc11e;}
#cn_avocado_pulp_chunky 	{ background-color: #76ca39;}
#cn_avocado_chunks		 	{ background-color: #8bd05c;}

#cn_avocado_pulp, #cn_avocado_pulp_chunky, #cn_avocado_chunks {
	background-image:  url(../img/bg_subnav_avocado.png);
	background-repeat: no-repeat;
	background-position: 680px 6px;
}

#chapters h1 {
	background-image:  url(../img/bg_ttl_home.png);
	background-repeat: no-repeat;
	height: 28px;
	padding: 5px 0 0 15px;
}

#chapters h1 a {
	color: #FFF;
	text-decoration: none;
}

#chapters h1 a:hover {
	color:#e7e7ef;
}

/*//////////////////////////////////////////////////
TYPOGRAPHY
//////////////////////////////////////////////////*/

h1 {
	font-size: 1.8em;
	padding-bottom: 15px;
	text-transform: uppercase;
	
}

h2 {
	font-size: 1.4em;
	padding: 6px 0 12px 0;
}

p {
	font-size: 1.3em;
	line-height: 160%;
}

#contentScroll li {
	font-size: 1.2em;
	line-height: 160%;
	padding-left: 5px;
	margin-left: 25px;
	list-style-type: disc;
}

.groen {
	color: #32af24;
}

.rood {
	color: #fe001d;
}

.donkerblauw {
	color: #0f0a4d;
}

.kaki {
	color: #cebf12;
}

a:link {color: #000}
a:visited {color: #222}
a:hover {color: #8cc63f}
a:active {color: #ff7700}

img.receptfoto {
	border: 4px solid #FFF;
}

/*//////////////////////////////////////////////////
FOOTER
//////////////////////////////////////////////////*/
#footer {
	clear: both;
	padding-top: 6px;
	width: 800px;
	text-align: right;
}
