@charset "UTF-8";
/* CSS Document */

@media only screen and (min-width : 320px) and (max-width : 325px){
	body {margin:0;padding:0;background:#000;}
	#page {width:100%;height:480px;margin:0 auto;overflow:hidden;position:absolute;}
	#header {background:url(../images/header_320.png) no-repeat top;width:320px;height:89px;position:absolute;top:0px;z-index:100;overflow:hidden;}
	#nav, #nav ul {margin:0;padding:0;}
	a#previous_link{background:url(../images/arrow_up.png) no-repeat;width:38px;height:36px; position:relative;}
	a#previous_link:hover{background:url(../images/arrow_up_red.png) no-repeat;width:38px;height:36px;}
	a#next_link{background:url(../images/arrow_down.png) no-repeat;width:38px;height:36px;}
	a#next_link:hover{background:url(../images/arrow_down_red.png) no-repeat;width:38px;height:36px;}
	.link span {display:none;}
	#textarea {overflow:hidden; width:250px;height:114px;margin:0px;padding:0px; position:relative; bottom:200px; background:#000; opacity:0.8; }
	#textarea h1 {font-size:1.8em; line-height:2em; margin:0; padding:0;}
	#background {width:100%;height:480px;margin:0 auto;position:relative;top:0px;overflow:hidden;-1000}
	#background_image {background:url(../images/bg_320.jpg) no-repeat;width:320px;height:2800px;margin:0 auto;overflow:visible;}
	#characters {width:320px;height:480px;margin:0 auto;position:absolute;top:0px;overflow:hidden;z-index:10;}
	#characters_image {background:url(../images/chars_320.png) no-repeat;width:320px;height:4500px;margin:0px auto 0px auto;z-index:1000;overflow:visible;}
	#nav {position:absolute; margin:0 auto; width:320px; bottom:0px;}
	#nav li a { text-decoration:none; margin:0; padding:0;}
	#previous_link{position:relative; top:67px; float:left;}
	#next_link{position:relative; top:67px; float:right;}
	#signup{ background:url(../images/signup.png); width:230px; height:90px; margin:0px auto 0 auto;z-index:500; position:absolute; bottom:0px;}
	#facebook {display:none; }
	#share_320 {width:90px; height:90px; margin:0px auto; position:absolute; bottom:0px; left:15px; z-index:1000}
	#share {display:none;}
	#fb_share {width:250px; height:30px; z-index:1000; margin-right:20px; float:right; }
	#footer{width:980px; margin:0 auto; height:50px; text-align:center;z-index:1000; position:relative; top:-300px}
	#footer a{color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.2em; text-decoration:none;}
	#footer a:hover {color:#6C9;}
	.bio{height:265px; width:250px; overflow-y:auto; overflow-x:none; color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:.6em; margin:0px; padding:10px 15px 10px 15px;}
	#text_container{position:relative;height:1400px; width:290px;top:0px; overflow:visible;}
	#form_div form input {line-height:24px; font-size:14px;margin:203px 0px 0px 13px; width:190px; border: 0px solid #999;z-index:1000;float:left;}
	#form_div form .button {width:63px; height:74px; float:right; margin:188px 22px 0px 0px;z-index:1000;padding: 0px; background:url(../images/fish.png); color:transparent;border:0px;}
	#form_div form .button:hover{background:url(../images/fish_hover.png);}
	#message_error{display:none;}
	#message_success{display:none;}
	#message_visible{color:#F00;margin:-60px 0px 0px 50px; text-align:center; width:240px;}
}

@media only screen and (min-width : 400px) and (max-width : 500px) {
	body {margin:0;padding:0;background:#000;}
	#page {width:480px;height:320px;margin:0;overflow:hidden;position:absolute;}
	#header {background:url(../images/header_480.png) no-repeat top;width:100%;height:89px;position:relative;top:-150px;z-index:100;overflow:hidden;}
	#nav, #nav ul {margin:0;padding:0;}
	a#previous_link{background:url(../images/arrow_up.png) no-repeat;width:38px;height:36px; position:relative;}
	a#previous_link:hover{background:url(../images/arrow_up_red.png) no-repeat;width:38px;height:36px;}
	a#next_link{background:url(../images/arrow_down.png) no-repeat;width:38px;height:36px;}
	a#next_link:hover{background:url(../images/arrow_down_red.png) no-repeat;width:38px;height:36px;}
	.link span {display:none;}
	#textarea {overflow:hidden; width:281px;height:285px;margin:0px 0px -30px 50px;padding:0px; position:relative; top:0; background:#000; opacity:0.8; }
	#textarea h1 {font-size:1.8em; line-height:2em; margin:0; padding:0;}
	#background {width:480px;height:320px;margin:0 auto;position:relative;top:0px;overflow:hidden;-1000}
	#background_image {background:url(../images/bg_480.jpg) no-repeat;width:480px;height:3300px;margin:0 auto;overflow:visible;}
	#characters {width:480px;height:320px;margin:0 auto;position:relative;top:0px;overflow:hidden;z-index:10;}
	#characters_image {background:url(../images/chars2_longd.png) no-repeat;width:562px;height:9600px;margin:0px auto 0px 278px;z-index:1000;overflow:visible;}
	#nav {position:relative;top:180px; right:297px; margin:0 auto; width:380px;}
	#nav li a { text-decoration:none; margin:0; padding:0;}
	#previous_link{position:relative; top:67px; float:left;}
	#next_link{position:relative; top:67px; float:right;}
	#signup{ background:url(../images/signup.png); width:300px; height:281px; margin:-55px auto 0 auto;z-index:500;}
	#facebook {width:980px; height:30px; margin:0px auto; position:relative; top:100px; }
	#share {width:161px; height:46px; margin:0px auto; position:relative; top:64px; left:15px; z-index:1000}
	#fb_share {width:250px; height:30px; z-index:1000; margin-right:20px; float:right; }
	#footer{width:980px; margin:0 auto; height:50px; text-align:center;z-index:1000; position:relative; top:-300px}
	#footer a{color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.2em; text-decoration:none;}
	#footer a:hover {color:#6C9;}
	.bio{height:265px; width:250px; overflow-y:auto; overflow-x:none; color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:.6em; margin:0px; padding:10px 15px 10px 15px;}
	#text_container{position:relative;height:1400px; width:290px;top:0px; overflow:visible;}
	#form_div form input {line-height:24px; font-size:14px;margin:203px 0px 0px 13px; width:190px; border: 0px solid #999;z-index:1000;float:left;}
	#form_div form .button {width:63px; height:74px; float:right; margin:188px 22px 0px 0px;z-index:1000;padding: 0px; background:url(../images/fish.png); color:transparent;border:0px;}
	#form_div form .button:hover{background:url(../images/fish_hover.png);}
	#message_error{display:none;}
	#message_success{display:none;}
	#message_visible{color:#F00;margin:-60px 0px 0px 50px; text-align:center; width:240px;}
}

@media only screen and (min-width : 600px) {
	body {margin:0;padding:0;background:#000;}
	#page {width:100%;height:1000px;margin:0 auto;overflow:hidden;min-width:980px;position:absolute;}
	#header {background:url(../images/header.png) no-repeat top;width:100%;height:1000px;position:relative;top:-76px;z-index:100;overflow:hidden;}
	#nav, #nav ul {margin:0;padding:0;}
	a#previous_link{background:url(../images/arrow_up.png) no-repeat;width:38px;height:36px; position:relative;}
	a#previous_link:hover{background:url(../images/arrow_up_red.png) no-repeat;width:38px;height:36px;}
	a#next_link{background:url(../images/arrow_down.png) no-repeat;width:38px;height:36px;}
	a#next_link:hover{background:url(../images/arrow_down_red.png) no-repeat;width:38px;height:36px;}
	.link span {display:none;}
	#textarea {overflow:hidden; width:281px;height:285px;margin:0px 0px -30px 50px;padding:0px; position:relative; top:0; background:#000; opacity:0.8; }
	#textarea h1 {font-size:1.8em; line-height:2em; margin:0; padding:0;}
	#background {width:100%;height:1000px;margin:0 auto;position:relative;top:0px;overflow:hidden;-1000}
	#background_image {background:url(../images/bg6.jpg) no-repeat;width:900px;height:6000px;margin:0 auto;overflow:visible;}
	#characters {width:840px;height:1600px;margin:0 auto;position:relative;top:-1140px;overflow:hidden;z-index:10;}
	#characters_image {background:url(../images/chars2_longd.png) no-repeat;width:562px;height:9600px;margin:0px auto 0px 278px;z-index:1000;overflow:visible;}
	#nav {position:relative;top:180px; right:297px; margin:0 auto; width:380px;}
	#nav li a { text-decoration:none; margin:0; padding:0;}
	#previous_link{position:relative; top:67px; float:left;}
	#next_link{position:relative; top:67px; float:right;}
	#signup{ background:url(../images/signup.png); width:300px; height:281px; margin:-55px auto 0 auto;z-index:500;}
	#facebook {width:980px; height:30px; margin:0px auto; position:relative; top:100px; }
	#share {width:161px; height:46px; margin:0px auto; position:relative; top:64px; left:15px; z-index:1000}
	#share_320 {display:none;}
	#fb_share {width:250px; height:30px; z-index:1000; margin-right:20px; float:right; }
	#footer{width:980px; margin:0 auto; height:50px; text-align:center;z-index:1000; position:relative; top:-300px}
	#footer a{color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.2em; text-decoration:none;}
	#footer a:hover {color:#6C9;}
	.bio{height:265px; width:250px; overflow-y:auto; overflow-x:none; color:#FFF; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:.6em; margin:0px; padding:10px 15px 10px 15px;}
	#text_container{position:relative;height:1400px; width:290px;top:0px; overflow:visible;}
	#form_div form input {line-height:24px; font-size:14px;margin:203px 0px 0px 13px; width:190px; border: 0px solid #999;z-index:1000;float:left;}
	#form_div form .button {width:63px; height:74px; float:right; margin:188px 22px 0px 0px;z-index:1000;padding: 0px; background:url(../images/fish.png); color:transparent;border:0px;}
	#form_div form .button:hover{background:url(../images/fish_hover.png);}
	#message_error{display:none;}
	#message_success{display:none;}
	#message_visible{color:#F00;margin:-60px 0px 0px 50px; text-align:center; width:240px;}
}