body{
	margin:0;
	padding:0;
	}
#container{
	position:relative;
	width:980px;
	height:700px;
	margin:40px auto;
	}

p{
	font-family: 'Rokkitt';
	color:#334499;
	font-size: 16px;
	line-height:19px;
	margin-top:5px;
	margin-bottom:10px;
	}
a {
	font-family: 'Rokkitt';
	color:#304488;
	font-size: 18px;
	}
.headline {
	font-family: 'Rokkitt';
	color:#4455aa;
	font-size: 23px;
	font-weight: 300;
	}
.text {
	font-family: 'Average Sans';
	color:##334499;
	font-size: 15px;
	list-style:disc;
	margin-right:10px;
	}

#to_cluster.clustered {
	margin-top: -105px;
}
/*h1 {
	font-family:'Roboto Slab';
	font-weight: 700;
	line-height: 95%;
	
	font-size: 100px;
}*/
#to_cluster {
	position: absolute;
	text-indent: -9999px;
	width: 311px;
	left: 0%;
	margin-left: 20px;
	/*font-family: 'Rokkitt';*/
	font-family:'Roboto Slab';
	font-weight: 700;
	line-height: 96px;
	display: block;
	font-size: 92px;
	height:590px;
	top:65px;
}
.cl_Container{
	position:relative;
	height:500px;
	width:340px;
	z-index:1000;
	margin-top:00px;
	padding-top:50px;
	margin-left:-22px;
	padding-left:0px;
	border-radius: 12px;
	}
	
.clustered svg {
  position: absolute;
  top: 0px;
  left: 0px;
    
}
/*

font-family: 'Rokkitt', serif;
font-family: 'Average Sans', sans-serif;
font-family: 'Roboto Slab', serif;

*/


nav{
	top: 28px;
   	left: 320px;
	width:660px;
	height:680px;
  	position: absolute;
	overflow:visible;
	z-index:1200;
	
}

#nav1{
	
}


.navButton {
	
	font-family:'Roboto Slab';
	font-weight:100;
	color:#6677cc;
	text-align:center;
	font-size: 22px;
	padding:2px 20px 2px 20px;
	margin-right:6px;
	height:30px;
	float:left;
   	
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;

/*background-color: #ffffff;*/
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.88)), to(rgba(255, 255, 255, 0.88)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88));
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88));
background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88));
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88));
background-image: linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#ffffff', EndColorStr='#ffffff');

-moz-box-shadow: 2px 4px 11px 0 #444;
-webkit-box-shadow: 2px 4px 11px 0 #444;
box-shadow: 2px 4px 11px 0 #444;
	}

.navB_1 {
	
	opacity:0;
	}
.navB_2 {
	
	opacity:0;
	}
.navB_3 {
	
	opacity:0;
	}
.navB_4 {
	
	opacity:0;
	}

.navContent {
	position: absolute;
	width:680px;
	height:0px;
	top: 40px;
   	left: 0px;
	overflow:hidden;
	z-index:1300;
	
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;

/*background-color: #ffffff;*/
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.88)), to(rgba(255, 255, 255, 0.65)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.65));
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.65));
background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.65));
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.65));
background-image: linear-gradient(top, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.65));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#ffffff', EndColorStr='#ffffff');

-moz-box-shadow: 2px 4px 11px 0 #444;
-webkit-box-shadow: 2px 4px 11px 0 #444;
box-shadow: 2px 4px 11px 0 #444;
	}


/*.navC_1, .navC_2, .navC_3, .navC_4, {
	height:0px
	}*/
	.navC_0 {
	height:537px;
	opacity:0;
	}
	.navC_1 {
	height:0px
	}
	.navC_2 {
	height:0px
	}
	.navC_3 {
	height:0px
	}
	.navC_4 {
	height:0px
	}
.format{-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px; margin:30px}

li {
	list-style:none;
	
	color:#334499;
	font-size: 16px;
	line-height:19px;
	}
	#honeyfund {
		text-align:left;
		background:url('http://www.honeyfund.com/share/honeyfund3.png') repeat;
		display:block;
		width:206px;
		height:100px;
		text-indent:-9999em;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px; 
		margin:20px 0
		}
	#amazon{
		text-align:left;
		background:url('amazon.jpg') no-repeat;
		display:block;
		width:210px;
		height:100px;
		text-indent:-9999em;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px; 
		margin:20px 0
	}
	
.accordionButton{
	cursor:pointer
	}

@media screen and (max-width: 950px) {

#container{
	width:100%;
	min-width:820px;
	margin-top:30px;
	}
nav{
   	left: 305px;
	/*width:540px;
	height:680px;*/
}
.cl_Container{
	margin-left:-18px;
}

}

@media screen and (max-height: 830px) {

#container{
	margin-top:0px;
	}

}
@media screen and (max-height: 730px) {

#container{
	margin-top:-8px;
	}

}


@media screen and (max-width: 875px) {

#container{
	width:100%;
	margin-top:-5px;
	}
nav{
   	left: 300px;
	/*width:540px;
	height:680px;*/
}
.cl_Container{
	margin-left:-26px;
}
}

 
 
 


@media screen and (max-width: 640px) {

#to_cluster {
	display: none;
}
.bu_cluster {
	display: block;
	background-image:url(clustered_web.svg);
	background-repeat:no-repeat;
	width:300px;
	height:490px;
	position: absolute;
	left: 0%;
	margin-left: 4px;
	top:65px;
}
#container{
	width:100%;
	margin-top:-15px;
	}
	
nav{
   	left: 280px;
	/*width:540px;
	height:680px;*/
}

p{
	line-height:18px;
}

.text {
	line-height:16px;
	}
.navButton {
	font-weight:300;
}


}
@media
    only screen and (max-device-width: 1136px) and (min-device-width: 960px) and (max-device-height: 640px) and (min-device-height: 560px),
    only screen and (max-device-height: 1136px) and (min-device-height: 960px) and (max-device-width: 640px) and (min-device-width: 560px) {

#to_cluster {
	display: none;
}
.bu_cluster {
	display: block;
	background-image:url(clustered_web.svg);
	background-repeat:no-repeat;
	width:300px;
	height:490px;
	position: absolute;
	left: 0%;
	margin-left: 4px;
	top:65px;
}
#container{
	width:835px;
	margin-top:-15px 0 0 0;
	}
	
nav{
   	left: 290px;
	/*width:540px;
	height:680px;*/
}
p{
	line-height:16px;
}

.text {
	line-height:16px;
	}

.navButton {
	font-weight:300;
}

}
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.4),
only screen and (min-device-pixel-ratio : 1.4) {

#to_cluster {
	display: none;
}
.bu_cluster {
	display: block;
	background-image:url(clustered_web.svg);
	background-repeat:no-repeat;
	width:300px;
	height:490px;
	position: absolute;
	left: 0%;
	margin-left: 4px;
	top:65px;
}
#container{
	width:835px;
	margin-top:-15px 0 0 0;
	}
	
nav{
   	left: 290px;
	/*width:540px;
	height:680px;*/
}
p{
	line-height:16px;
}

.text {
	line-height:16px;
	}

.navButton {
	font-weight:300;
}

}

@media 
all and (device-width: 768px) and (device-height: 1024px),
all and (device-width: 1536px) and (device-height:  2048px) {

#to_cluster {
	display: none;
}
.bu_cluster {
	display: block;
	background-image:url(clustered_web.svg);
	background-repeat:no-repeat;
	width:300px;
	height:490px;
	position: absolute;
	left: 0%;
	margin-left: 4px;
	top:65px;
}
.cl_Container{
	margin-left:-8px;
}
/*#container{
	width:835px;
	margin-top:-15px 0 0 0;
	}
	
nav{
   	left: 290px;
	width:540px;
	height:680px;
}*/
/*p{
	line-height:16px;
}

.text {
	line-height:16px;
	}

.navButton {
	font-weight:300;
}*/
}