/* Some colors from: http://www.colourlovers.com/palette/2977603/%E2%99%A5 and http://www.colourlovers.com/palette/937624/Dance_To_Forget */
/* Some CSS inspiration from: http://gibbon.co/ */

BODY {background-color:#FF8300; margin:0 100px; padding:0;}
BODY,DIV INPUT {font-family:'Telex',Helvetica,Arial,sans-serif; font-size:16px;}

:focus{outline:0}

H1 {font-size:5em;margin:0;}
H2 {font-size:2em;margin:0 0 0 15px;color:#FFF5B2;}
H3 {font-size:2em;margin:0; color:#555;}

#ksHeader {margin: 0; padding: 50px 20px 25px 20px;color: white;}
#ksContent {margin: 0; padding: 25px 35px 50px 35px; background-color:white; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;max-width:1200px;}

#ksFooter {color:white;max-width:1200px;margin:50px 0;}
#ksFooter #twitter {position:relative;}
#ksFooter EM {position:absolute;left:200px;top:0px;font-size:1.2em;font-weight:100;font-style:normal;}
#ksFooter A IMG {position:absolute;left:-60px;top:8px;}
#ksFooter A {color:white;text-decoration:none;font-size:3.0em;position:absolute;left:360px;top:35px;}
#ksFooter A:hover {color:#FFF5B2;}

#project_details {background-color:#FFCB00;margin: 5px 0; padding: 20px 35px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;text-align:center;overflow:hidden;}
#project_details H1 {font-size:4em;line-height:0.85em;}
#project_details SPAN.creator_info {display:block;opacity:0.7;margin:12px 0 0 110px;}
#project_details H2 {}
#project_details SPAN.timeleft_info {display:block;}

#ksContent form {position:relative;padding:0;margin:20px 0 20px;display:block;}

DIV.reward {position:relative;padding:0;height:160px;clear:both;margin:10px 0 0 0;}

LABEL.reward_checkbox {background-color:#FFAD00;color:white;display:block;	-webkit-border-radius: 10px 0px 0px 10px;
	-moz-border-radius: 10px 0px 0px 10px;
	border-radius: 10px 0px 0px 10px;
width:20%;
text-align:center;cursor: pointer;position: absolute;
height:150px;
}
LABEL.reward_checkbox INPUT {display:none;}
SPAN.reward_optStatus {font-size:9em;line-height:1em;color:#EDE574;position: absolute;top:-5px;left:40px;z-index:15;}/*#FF4E50*/
SPAN.reward_optStatus2 {font-size:9em;line-height:1em;color:#000;position: absolute;top:-3px;left:45px;z-index:5;}

SPAN.reward_optStatusText {position: absolute;bottom:7px;color:#000;opacity:0.7;left:85px;}

DIV.reward_optDesc {display:block;width:80%;position: absolute;top:0;right:0;padding:10px;background-color:#FFF5B2;-webkit-border-radius: 0px 10px 10px 0px;
	-moz-border-radius: 0px 10px 10px 0px;
	border-radius: 0px 10px 10px 0px;height:130px;overflow:hidden;}

DIV.row {position:relative;padding:0;margin:5px 0;height:72px;display:block;clear:both;}

#ksContent input[type="text"]{
	border:	none;
	-webkit-font-smoothing: subpixel-antialiased;
	font:	400	1.2em	'Telex', Helvetica,	Arial, sans-serif;
	-webkit-border-radius: 10px 0px 0px 10px;
	-moz-border-radius: 10px 0px 0px 10px;
	border-radius: 10px 0px 0px 10px;
	color:	#999;
	background-color:#efefef;
	outline: none;
	position: absolute;
	margin: 0;
	padding: 0;
	top: 0;
	left: 0;
	bottom: 0;
	width: 80%;
	text-indent: 25px;
	display: block;
	height: 72px;
}

button{
	position:	absolute;
	right:	0;
	top:	0;
	margin: 0;
	bottom:	0;
	width:	20%;
	background-color:	#777;
	border:	none;
	font: 700 1em 'Telex', Helvetica,	Arial, sans-serif;
	text-transform:	uppercase;
	color:	#ffffff;
	-webkit-border-radius: 0px 10px 10px 0px;
	-moz-border-radius: 0px 10px 10px 0px;
	border-radius: 0px 10px 10px 0px;
	cursor:	pointer;
	padding:	3px 0 0;
	margin:	0;
	letter-spacing:	1px;
}

button:hover{background-color: #555;}
button:active{background-color: #FFAD00;}

#ksContent P {font-size:1.2em;color:#444;margin:25px 20px 10px 20px;}

.ksErrorNotice
{
color:#333;
font-weight:100;
font-size:1.3em;
line-height:170%;
padding:30px 40px;
margin:0 40px;
background-color:#FFF5B2;
border-radius:15px;
}
.ksErrorNotice A {color:#FF8300;}

.reward_pledgeAmount {display:block;font-size:1.4em;font-weight:800;margin:0 0 5px 10px;}
.reward_backers {display:block;font-size:1em;font-weight:800;margin:0 0 15px 10px;}
.reward_description {display:block;font-size:0.9em;font-weight:200;margin:0 0 5px 10px;opacity:0.8}

.allgone {color:#FF4E50;font-weight:bolder;}

.tips {font-size:0.8em;}
UL {margin:0;padding:0;}
LI {margin:5px 0 10px 40px;padding:0;}

#ksContent P A {color:#FF8300;}


@media only screen and (max-width: 1020px){
	BODY { margin:0 10px; }
}

/* iphone landscape */
@media only screen and (max-width: 675px){
	BODY { margin:0 10px 10px 10px; }
	#ksHeader {padding:0 0 10px 10px;}
	H1 {font-size:4em;}
	H2 {font-size: 1.1em;}
	H3 {font-size: 1.5em;margin:0 0 0 30px;}
	#ksContent {padding: 10px 10px 20px 10px;}
	#project_details {padding:10px 10px;}
	#project_details H1 {font-size: 2.2em;line-height: 1.15em;}
	#project_details H2 {font-size: 1em;margin:0;padding:0;}
	DIV.reward_optDesc {width:77%;padding:10px 0;}
	LABEL.reward_checkbox {width:25%;}
	SPAN.reward_optStatus {font-size: 7em;top: 15px;left: 5px;}
	SPAN.reward_optStatus2 {font-size: 7em;top: 17px;left: 10px;}
	SPAN.reward_optStatusText {left: 15px;bottom:10px;}
	.reward_pledgeAmount {margin-bottom:2px;}
	.reward_backers {margin-bottom:5px;}
	.reward_description {font-size:0.8em;}
	#ksContent input[type="text"] {text-indent:10px;}
	button {font-size:0.8em;}
	#ksFooter {margin:0;height:100px;padding-top:10px;}
	#ksFooter EM {left: 65px;top: 5px;font-size: 0.9em;}
	#ksFooter A {left: 180px;font-size: 2.0em;}
}

/* iphone portrait */
@media only screen and (max-width: 479px){
	BODY { margin:0; }
	#ksHeader {padding:0 0 10px 10px;}
	H1 {font-size:4em;}
	H2 {font-size: 1.1em;}
	H3 {font-size: 1.5em;margin:0 0 0 30px;}
	#ksContent {padding: 5px 5px 20px 5px;}
	#project_details {padding:10px 10px;}
	#project_details H1 {font-size: 2.2em;line-height: 1.15em;}
	#project_details H2 {font-size: 1em;margin:0;padding:0;}
	DIV.reward_optDesc {width:70%;padding:10px 0;}
	LABEL.reward_checkbox {width:35%;}
	SPAN.reward_optStatus {font-size: 6em;top: 12px;left: 5px;}
	SPAN.reward_optStatus2 {font-size: 6em;top: 14px;left: 10px;}
	SPAN.reward_optStatusText {left: 15px;bottom:10px;}
	.reward_pledgeAmount {margin-bottom:2px;}
	.reward_backers {margin-bottom:5px;}
	.reward_description {font-size:0.7em;}
	#ksContent input[type="text"] {text-indent:10px;}
	button {font-size:0.8em;}
	#ksFooter {margin:0;height:100px;padding-top:10px;}
	#ksFooter EM {left: 15px;top: 5px;font-size: 0.9em;}
	#ksFooter A {left: 130px;font-size: 2.0em;}
}








