@charset "utf-8";
@import url("reset.css");
@import url("text.css");

body {
	background: url(images/background.jpg);
	margin: 0;
}

a:link {color: #000; text-decoration: none;}
a:visited {color: #000; text-decoration: none;}
a:active {color: #000; text-decoration: none;}
a:hover {color: #000; text-decoration: underline;}

.headerouter {
	width: 100%;
	height: 85px;
	background-color: #f0fdff;
	margin: 47px 0 47px 0;
	padding: 5px 0 1px 0;
}

.headerinner {
	width: 100%;
	height: 79px;
	border-top: thin dashed;
	border-bottom: thin dashed;
	border-color: #c0c0c0;
}

.headercontainer {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

.topcontainer {
	background-color: #f0fdff;
	margin-top: -35px;
	padding: 5px;
	position: relative;
	z-index: 1;
}

.topinner {
	padding: 8px;
}

.left {
	float: left;
}

.right {
	float: right;
}

.nav {
	margin: 12px 0 0 20px;
	width: 474px;
	height: 43px;
	background-color: #a0ca65;
	border-color: #007791;
	border-style: solid;
	border-width: 1px;
	padding: 5px;
}

.navinner {
	padding: 5px;
	height: 31px;
}

.navcontent {
	margin-top: 2px;
	margin-left: 14px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	font-weight: bold;
}

.navblue {
	background-color: #00b7df;
	border-color: #007791;
	border-style: solid;
	border-width: 1px;
	padding: 7px;
	margin-right: 8px;
	margin-top: -1px;
	color: #FFF;
}

.navblue a:link {
	color: #FFF;
	text-decoration: none;
}

.navblue a:visited {
	color: #FFF;
	text-decoration: none;
}

.navblue a:active {
	color: #FFF;
	text-decoration: none;
}

.navblue a:hover {
	color: #FFF;
	text-decoration: none;
}

.navgreen {
	padding: 7px;
	margin-right: 10px;
}

.navgreen a:link {
	color: #000;
	text-decoration: none;
}

.navgreen a:visited {
	color: #000;
	text-decoration: none;
}

.navgreen a:active {
	color: #000;
	text-decoration: none;
}

.navgreen a:hover {
	color: #FFF;
	text-decoration: none;
}

.navdrop a:link {
	color: #FFF;
	text-decoration: none;
}

.navdrop a:visited {
	color: #FFF;
	text-decoration: none;
}

.navdrop a:active {
	color: #FFF;
	text-decoration: none;
}

.navdrop a:hover {
	color: #FFF;
	text-decoration: none;
}

#contentcontainer {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

.outer {
	background-color: #f0fdff;
	padding: 5px;
}

.inner {
	padding: 5px;
}

.slogancontainer {
	width: 370px;
	height: 284px;
	background-color: #00b7df;
}

.slogan {
	margin: 27px 0 0 17px;
	color: #FFF;
}

.fifty {
	font-size: 50px;
	font-weight: bold;
	color: #FFF;
}

.fortyseven {
	font-size: 47px;
	font-weight: bold;
	color: #FFF;
}

.thirtyfour {
	font-size: 34px;
	font-weight: bold;
	color: #FFF;
}

.twentyeight {
	font-size: 28px;
	font-weight: bold;
	color: #FFF;
}

.fb-like-box {
	margin-top: 20px;
		display: inline;
}

.twitcontain {
	margin-top: 20px;
}

.quotecontain {
	height: 258px;
	width: 300px;
	background: url(images/quote.jpg);
	margin-top: 20px;
	margin-left: 20px;
}

.quote {
	padding: 50px 20px 20px 20px;
}

.quotes ul { list-style: none; margin: 0; padding: 0; }
.quotes ul blockquote { list-style: none; margin: 0; }

.footer {
	margin-top: 20px;
	margin-bottom: -88px;
}

.footersub {
	margin-top: 20px;
	margin-bottom: -92px;
}

.footer2 {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	position: relative;
	left: 10px;
}

.footer2content {
	position: relative;
	top: 35px;
	left: 10px;
}

.footer2nav {
	position: relative;
	top: 35px;
	right: 20px;
}

.footer2nav a:link {color: #000; text-decoration: none;}
.footer2nav a:visited {color: #000; text-decoration: none;}
.footer2nav a:active {color: #000; text-decoration: none;}
.footer2nav a:hover {color: #000; text-decoration: underline;}
	
.rounded {
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	behavior: url(js/PIE.htc);
}

.shadow {
	-webkit-box-shadow: #666 0px 0px 12px;
	-moz-box-shadow: #666 0px 0px 12px;
	box-shadow: #666 0px 0px 12px;
	behavior: url(js/PIE.htc);
}

.dotted {
	border: thin;
	border-style: dashed;
	border-color: #c0c0c0;
}

.menu ul{
	list-style:none;
	margin:0;
	padding:0;
	}
	.menu li{
		float:left;
		padding:0px;
		}
	.menu li a{
		display:block;
		font-weight:bold;
		margin:0px;
		padding:0px 0px;
		text-align:center;
		}
		
	.menu li ul{
		background:#00b7df;
		line-height:35px;
		display:none;
		height:auto;
		padding:0px;
		margin-top:0px;
		border:0px;
		position:absolute;
		width:175px;
		z-index:200;
		border-color: #007791;
		border-style: solid;
		border-width: 1px;
		/*top:1em;
		/*left:0;*/
		}
	.menu li:hover ul{
		display:block;
		
		}
	.menu li li {
		background:url('images/sub_sep.gif') bottom left no-repeat;
		display:block;
		float:none;
		margin:0px;
		padding:0px;
		width:175px;
		}
	.menu li:hover li a{
		background:none;
		
		}
	.menu li ul a{
		display:block;
		height:35px;
		font-size:10px;
		font-style:normal;
		margin:0px;
		padding:0px 10px 0px 15px;
		text-align:left;
		}
		.menu li ul a:hover, .menu li ul li:hover a{
			background:#2580a2 url('images/hover_sub.gif') center left no-repeat;
			border:0px;
			color:#ffffff;
			text-decoration:none;
			}
	.menu p{
		clear:left;
		}	


/* Menu Containers */

.category {
	margin-bottom: 10px;
	width: 250px;
	padding: 5px 5px 2px 5px;
	background-color: #00b7df;
	text-align: center;
}

.menufont {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
}

.menupicgreen {
	width: 162px;
	height: 108px;
	padding: 5px;
	background-color: #a0ca65;
	margin-bottom: 10px;
}

.menudescgreen1 {
	width: 282px;
	height: 108px;
	padding: 5px;
	margin-right: 10px;
	background-color: #a0ca65;
	margin-bottom: 10px;
}

.menudescgreen2 {
	width: 282px;
	height: 108px;
	padding: 5px;
	background-color: #a0ca65;
	margin-bottom: 10px;
}

.menupicblue {
	width: 162px;
	height: 108px;
	padding: 5px;
	background-color: #00b7df;
	margin-bottom: 10px;
}

.menudescblue1 {
	width: 282px;
	height: 108px;
	padding: 5px;
	background-color: #00b7df;
	margin-bottom: 10px;
}

.menudescblue2 {
	width: 282px;
	height: 108px;
	padding: 5px;
	margin-right: 10px;
	background-color: #00b7df;
	margin-bottom: 10px;
}

.syrupcontainer {
	width: 238px;
	height: 467px;
	background-color: #00b7df;
}

.syrup {
	margin: 20px 0 0 20px;
}

/* Smoothies */

.smoothiesgreen {
	width: 444px;
	height: 335px;
	padding: 5px;
	margin-right: 10px;
	background-color: #a0ca65;
	margin-bottom: 10px;
	text-align:center;
}

.smoothiesblue {
	width: 444px;
	height: 335px;
	padding: 5px;
	margin-right: 10px;
	background-color: #00b7df;
	margin-bottom: 10px;
	text-align:center;
}

/* Beverages */

.beverages {
	width: 351px;
	height: 341px;
	background-color: #00b7df;
	padding: 20px;
}

/* Catering */

.catering {
	width: 351px;
	height: 359px;
	background-color: #00b7df;
	padding: 20px;
}

/* Mission */

.mission {
	width: 469px;
	height: 352px;
	background-color: #00b7df;
	text-align: center;
}

/* Press */

.pressblue {
	width: 217px;
	height:310px;
	background-color: #00b7df;
	padding: 5px;
	text-align: center;
}

.pressgreen {
	width: 217px;
	height:310px;
	background-color: #a0ca65;
	padding: 5px;
	text-align: center;
}

.marginright {
	margin-right: 10px;
}

/* Map */

.map {
	width: 435px;
	height: 350px;
}

.info {
	width: 493px;
	height: 340px;
	padding: 5px;
	background-color: #00b7df;
	text-align: center;
}

/* Contact */

.contactform {
	width: 425px;
	height: 360px;
	background-color: #a0ca65;
	padding: 5px;
}

.contact {
	width: 493px;
	height: 360px;
	padding: 5px;
	background-color: #00b7df;
	text-align: center;
}

form.formular {
	font-family: tahoma, verdana, "sans-serif";
	font-size: 12px;
	padding: 5px;
	border: 1px solid #A5A8B8;

	width:300px;
	margin-left:300px;
}

.formular fieldset {
	margin-top: 20px;
	padding : 5px;
	border: 1px solid #B5B8C8;
	
}

.formular legend {
	font-size: 12px;
	color: #15428B;
	font-weight: 900;
}

.formular fieldset label {
	float: none;
	text-align: inherit;
	width: auto;
}

.formular label span {
	color: #000;
}

.formular input, .formular select, .formular textarea {
	display : block;
	margin-bottom: 5px;
}

.formular .text-input {
	width: 250px;
	color: #555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	font-size: 14px;
	margin-top: 4px;
	background: #FFF url('/img/form/text-bg.gif') repeat-x;
	
}
.formular textarea {
	width: 250px;
	height:70px;
	color: #555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	font-size: 14px;
	margin-top: 4px;
	background: #FFF url('/img/form/text-bg.gif') repeat-x;
	
}
.formular .infos {
	background: #FFF;
	color: #333;
	font-size: 12px;
	padding: 10px;
	margin-bottom: 10px;
}

.formular span.checkbox, .formular .checkbox {
	display: inline;
}

.formular .submit {
	background: url('/img/form/button-bg.png') repeat-x;
	border: 1px solid #AAA;
	padding: 4px;
	margin-top: 20px;
	float: right;
	text-decoration: none;
	cursor:pointer;
}

.formular hr {
	clear: both;
	visibility: hidden;
}

.formular .fc-error {
	width: 350px;
	color: 555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	font-size: 12px;
	margin-bottom: 15px;
	background: #FFEAEA;
}

input, textarea { 
	padding: 8px;
	border: solid 1px #E5E5E5;
	font: normal 12px Verdana, Tahoma, sans-serif;
	width: 200px;
	background: #FFFFFF url('form_background.png') left top repeat-x;/*Mimic Background Property in Internet Explorer since IE 6,7,8 does not support CSS3*/
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;/*0.1 actually means 10 %*/
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	}

textarea { 
	width: 400px;
	max-width: 400px;
	height: 150px;
	line-height: 150%;
	}

input:hover, textarea:hover,
input:focus, textarea:focus { 
-moz-box-shadow:0 0 8px lightblue;
	-webkit-box-shadow:0 0 8px lightblue;
	box-shadow:0 0 8px lightblue;
}

.form label { 
	margin-left: 12px; 
	color: #FFF; 
	}

.submit input {
	width: auto;
	padding: 10px 14px;
	background: #00b7df;
	font-size: 14px;
	color: #FFFFFF;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	cursor:pointer;
	}
#form-div { 
-moz-border-radius:12px 12px 12px 12px;
-webkit-border-radius: 12px 12px 12px 12px;
}

#wrapper { 
width:435px;
}