/*
	960 Grid System ~ Text CSS.
	Learn more ~ http://960.gs/

	Licensed under GPL and MIT.
*/

/* `Basic HTML
----------------------------------------------------------------------------*/

body {
	font: 14px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
	background: #F7F7F2;
}

hr {
	border-color: #97A586;
	border-style: solid;
	border-width: 1px 0 0;
	clear: both;
	height: 0;
	margin: 5px 0 10px;
}

p {
	margin-left: 10px;
	margin-bottom: 20px;
}

ul { margin: 0 0 20px 10px; }
ul li {
	margin-left: 25px;
	font-size: 13px;
	list-style-image: url(../img/bullet_black.png);
	list-style-type: none;
	color: #656565;
}

/* Token Lists */
ul li.active { list-style-image: url(../img/link_token.png); }
ul li.inactive { list-style-image: url(../img/link_token_used.png); }
ul li.active_email { list-style-image: url(../img/email_token_sent.png); }
ul li.inactive_email { list-style-image: url(../img/email_token_used.png); }

ol { margin: 0 0 10px 0; }
ol li {
	margin-left: 50px;
	font-size: 13px;
	list-style: decimal;
}

form { margin-bottom: 25px; }

a { color: #8BBF43; text-decoration: none; }
a:hover { color: #AAAA99; text-decoration: underline; }

small { font-size: 14px; color: #666666; }

/* `Click to Clipboard
----------------------------------------------------------------------------*/
ul#generated_tokens li,
ul#unused li { clear: both; }

button.clipboard {
	font-size: 13px;
	padding: 2px;
	margin: 3px 0;
	float: right;
}

button.clipboard.hover {
	background: #E6EFC2;
	color: #264409;
}

button.clipboard.active {
	border: 1px solid #DEDEDE;
	border-top: 1px solid #565656;
	border-left: 1px solid #565656;
}

/* `Sections
----------------------------------------------------------------------------*/
#main_container {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

.container {
	display: inline;
	float: left;
	width: 940px;
}

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	width: 0;
	height: 0;
}

/* `Left & Right
----------------------------------------------------------------------------*/
.left {
	float: left;
}

.right {
	text-align: right;
	float: right;
}

/* `Headings
----------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	font-family: Helvetica, Arial, sans-serif;
	color: #444;
	font-weight: normal;
	line-height: 1;
	margin-bottom: 0.5em;
}

h1 { color: #F5F5F5; font-size: 4em; }
h2 { font-size: 2.3em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.4em; font-weight: bold; }
h5 { font-size: 1.4em; }
h6 { font-size: 1.15em; }

/* `Header
----------------------------------------------------------------------------*/
#header {
	background-color: #353535;
	height: 125px;
}

#header_contents {
	overflow: hidden;
	color: #F5F5F5;
	padding: 30px 10px 10px;
}

#header_contents a { color: #FFFFFF; font-size: 16px; }
#header_contents a:hover { color: #F7F7F2; }

/* `Navigation
----------------------------------------------------------------------------*/
#navigation {
	background: url(../img/navigation.gif) repeat-x left top;
}

#navigation ul {
	display: inline;
	margin: 0;
	padding: 0;
}

#navigation ul li {
	float: left;
	list-style: none;
}

#navigation ul li a {
	text-decoration: none;
	color: #FFFFFF;
	display: block;
	font-weight: bold;
	font-size: 18px;
	padding: 12px 10px 8px;
}

#navigation ul li a:hover {
	color: #F5F5F5;
}

/* `Page contents
----------------------------------------------------------------------------*/
#content {
	background-color: #FFFFFF;
}

#page_contents {
	overflow: hidden;
	color: #444444;
	padding: 20px;
}

#page_contents .main {
	float: left;
	width: 65%;
}

#page_contents .side {
	float: right;
	width: 35%;
}

#page_contents .side .left {
	padding-bottom: 25px;
}

#page_contents .main .home_contents {
	padding: 0 80px 0 0;
	font-size: 16px;
}

#page_contents .main .contents {
	padding: 0 10px;
}

#pages {
	padding: 20px 10px 0 0;
	text-align: right;
	font-size: 16px;
	color: #444444;
}

/* `Forms
----------------------------------------------------------------------------*/
.form_field {
	display: block;
	overflow: hidden;
	padding: 5px 0;
}

.form_label {
	float: left;
	font-size: 20px;
}

.form_input {
	float: left;
	clear: left;
	padding-right: 5px;
}

.form_input_vote {
	float: left;
	clear: left;
	padding: 0 5px 0 10px;
}

.form_button {
	padding: 10px 0;
	width: 100%;
	overflow: hidden;
	display: block;
	clear: left;
}

input.text,
textarea,
select {
	background: #FFFFFF;
	border-top: 1px outset #353535;
	border-left: 1px outset #353535;
	font-size: 20px;
	font-family: Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
	color: #656565;
	width: 400px;
	padding: 3px;
}

textarea {
	overflow: auto;
	height: 150px;
}

button {
	background-color: #F5F5F5;
	border: 1px solid #DEDEDE;
	border-bottom: 1px solid #565656;
	border-right: 1px solid #565656;
	color: #353535;
	cursor: pointer;
	font-size: 16px;
	width: auto;
	padding: 5px 25px;
	margin-right: 5px;
}

button.positive:hover {
	background: #E6EFC2;
	color: #264409;
}

button.negative:hover {
	background: #FBE3E4;
	color: #8A1F11;
}

button:active {
	border: 1px solid #DEDEDE;
	border-top: 1px solid #565656;
	border-left: 1px solid #565656;
}

input.text:focus,
textarea:focus,
select:focus {
	border-top: 1px inset #353535;
	border-left: 1px inset #353535;
	background: #F7F7F2;
}

input.tally {
	width: 30px;
	margin: 0 10px;
}

.form_msg {
	clear: left;
	float: left;
	display: none;
	text-align: center;
}

/* Header Login Form */
#form_login_header .form_field { display: inline; }
#form_login_header .form_label { padding: 0 10px; font-size: 16px; color: #F5F5F5; }
#form_login_header .form_field .form_input { clear: none; }
#form_login_header .form_field .form_input input.text { font-size: 14px; color: #353535; width: 100px; }
#form_login_header .form_button { float: right; clear: left; }
#form_login_header .form_button button.button { font-size: 16px; padding: 0 8px; }
#form_login_header .error { clear: both; padding: 0; width: 200px; float: right; }

/* `Success/Error/Notice Messages
------------------------------------------------------------------------------
(http://templates.arcsin.se/demo/freshmade-software-website-template/style.css)
----------------------------------------------------------------------------*/
.error,
.notice,
.success {
	border: 1px solid #DDD;
	margin-bottom: 1em;
	padding: 0.6em 0.8em;
}

.error {background: #FBE3E4; color: #8A1F11; border-color: #FBC2C4;}
.error a {color: #8A1F11;}

.notice {background: #FFF6BF; color: #514721; border-color: #FFD324;}
.notice a {color: #514721;}

.success {background: #E6EFC2; color: #264409; border-color: #C6D880;}
.success a {color: #264409;}

.error_state {
	background: #FBE3E4;
}

/* `Results
----------------------------------------------------------------------------*/
#results {}
#pie_chart { margin: 50px 0; }
#bar_chart {}
#voter_list { margin-left: 10px; }
#voter_list strong { font-size: 15px; }

#voter_list_sidebar { margin-left: 10px; font-size: 12px; }
#voter_list_sidebar strong { font-size: 13px; }

/* `Dashboard
----------------------------------------------------------------------------*/
#dashboard {
	background: url(../img/dashboard.png) repeat-x;
	height: 170px;
	border-top: 1px solid #AAAA99;
	font-size: 13px;
}

#dashboard_contents {
	overflow: hidden;
	color: #666666;
	padding: 10px 0;
}

#dashboard_contents .dashboard_section {
	float: left;
	padding: 5px 0 5px 15px;
	height: 140px;
	width: 38%;
}

#dashboard_contents .dashboard_bordered {
	border-right: 1px dashed #AAAA99;
	width: 28%;
}

/* `Footer
----------------------------------------------------------------------------*/
#footer {
	background-color: #353535;
}

#footer_contents {
	overflow: hidden;
	color: #F5F5F5;
	font-size: 12px;
	padding: 10px 20px;
}

#footer_contents a { color: #FFFFFF; }
#footer_contents a:hover { color: #AAAA99; text-decoration: none; }

#footer_contents strong { color: #AAAA99; }

/* `Appendo
----------------------------------------------------------------------------*/
#survey_options {}
#survey_options td { padding: 3px 0; }

.appendoButtons { padding: 3px 0; }
.appendoButtons button { float: left; padding: 3px; }
.appendoButtons button:hover { background: #FFF6BF; color: #514721; }

input.datepicker { width: 300px; }

/* `jQuery UI Sortable
----------------------------------------------------------------------------*/
#sortable { margin: 0 0 0 5px; padding: 0; }
#sortable li {
	background-color: #F7F7F2;
	/*
	background-image: url(../img/bullet_go.png);
	background-repeat: no-repeat;
	background-position: center left;
	*/
	margin: 0 3px 3px 3px;
	padding: 0.4em;
	padding-left: 10px;
	width: 300px;
	height: 16px;
	cursor: pointer;
	border: 1px solid #353535;
	list-style: none;
}

#sortable li.placeholder {}
