@import url("reset.css");
@import url("popup.css");
@import url("flexigrid/flexigrid.css");
@import url("stars/ui.stars.css");
@import url("simpletree.css");
@import url("tabs.css");
@import url("ui.datepicker.css");

/*********************************************
 * TEMPLATE LAYOUT & NAVIGATION 
 *********************************************/

body { 
	margin: 0; 
	padding: 0; 
	background: #DFE1E3 top repeat-x; 
	font-family: Helvetica, sans-serif; 
	color: #333; 
}

#test_banner strong { 
	font-weight: bold;
}

#test_banner { 
text-align: center;
}

body.production #test_banner { display: none;}

a { color: rgb(44, 72, 101);}

h2 { 
	font-size: 12px; 
	padding: 28px 0 0 0; 
	color: rgb(83, 83, 83); 
	font-weight: bold; 
	text-shadow: rgba(255, 255, 255, 0.8) 0px 1px 0px; 
}

h3 { font-size: 16px; padding: 8px 0 0 0; margin: 0; }
h4 { font-size: 12px; padding: 8px 0 3px 0; margin: 0; font-weight: bold; color: #333; }

#container { 
	min-height: 650px; 
	width: 950px; 
	margin: 0 auto; 
	border: 1px solid #999; 
	border-top-width: 0; 
	background: #eee url(/images/dark_background.jpg) top repeat-x; 
}

#page { 
	background: #eee; 
}

#header { 
	height: 40px; 
	border-bottom: 1px solid black; 
	background: #fff url(/images/dark_background.jpg) 
}

#logo { 
	padding: 10px; 
	float: left; 
	width: 200px; 
}

#navigation { 
	padding: 5px; 
}

#subnavigation { 
	background: #d1d1d1 url(/images/background_subnav.jpg); 
	border-bottom: 1px solid #909090; 
	width: 900px; 
	overflow: hidden; 
	float: left; 
	border-left: 1px solid #c0c0c0; 
	border-right: 1px solid #c0c0c0; 
}

#subnavigation ul { 
	list-style: none; 
	margin: 0; 
	width: 3900px; 
	padding-left: 0px; 
}

#subnavigation li { 
	float: left; 
	border-right: 1px solid #c0c0c0; 
	height: 22px; 
	font-size: 11px; 
	line-height: 24px; 
	padding: 0; 
	width: 150px; 
}

#subnavigation li a.name { 
	text-decoration: none; 
	color: #333; 
	padding: 0px 0 0px 30px; 
	display: block; 
	width: 100px; 
	float: left; 
	color: rgb(83, 83, 83); 
	font-weight: bold; 
	text-shadow: rgba(255, 255, 255, 0.8) 0px 1px 0px; 
}

#subnavigation li.on,
#subnavigation li:hover { 
	background: #fff url(/images/background_subnav_on.jpg) repeat-x 1px; 
}

#subnavigation li.on a.name,
#subnavigation li:hover a.name { 
	color: #fff; 
	font-weight: bold; 
	text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 0px; 
}

#subnavigation li a.delete { 
	float: right; 
	padding: 3px; 
}

#subnavigation li a { 
	background-repeat: no-repeat; 
	background-position: 10px center; 
}

.navbutton { 
	float: left; 
	width: 24px; 
	line-height: 24px; 
	background: #d1d1d1 url(../images/background_subnav.jpg); 
	border-bottom: 1px solid #909090; 
}

#sidebar, #content { 
	float: left; 
}

#sidebar { 
	width: 240px; 
}

#sidebar .box { 
	padding: 0 10px; 
}

#content { 
	width: 710px; 
}
#full_content {
	width: 950px;
	float: left;
}

/*********************************************
 * SUBNAVIGATION DONATIONS
 *********************************************/
#subnavigation.donation_nav { width: 949px;}
#subnavigation.donation_nav li { width: auto;}
#subnavigation.donation_nav li a.name { width: auto; padding: 0 10px 0 30px;}

/*********************************************
 * SUBNAVIGATION ICONS
 *********************************************/

#subnavigation li.person a.name { 
	background-image: url(/images/icons/user.png); 
}

#subnavigation li.search a { 
	background-image: url(/images/icons/zoom.png); 
}

#subnavigation li.organisation a.name { 
	background-image: url(/images/icons/building.png); 
}

#subnavigation li.church a.name { 
	background-image: url(/images/church.png); 
}

#subnavigation li.clergy a.name { 
	background-image: url(/images/icons/user_gray.png); 
}

#subnavigation li.mail a.name { 
	background-image: url(/images/mail.png); 
}

#subnavigation li.call a.name { 
	background-image: url(/images/call.png); 
}

#subnavigation li.meeting a.name { 
	background-image: url(/images/meeting.png); 
}
#subnavigation li.all_donations a.name { 
	background-image: url(/images/icons/coins.png); 
}
#subnavigation li.awaiting_export a.name { 
	background-image: url(/images/icons/table.png); 
}
#subnavigation li.awaiting_receipt a.name {
	background-image: url(/images/icons/page_white_text.png);
}
#subnavigation li.export_groups a.name { 
	background-image: url(/images/icons/table_multiple.png); 
}
#subnavigation li.receipt_groups a.name {
	background-image: url(/images/icons/page_white_stack.png);
}
#subnavigation li.funds a.name {
	background-image: url(/images/icons/money.png);
}
#subnavigation li.users a.name {
	background-image: url(/images/icons/group.png);
}
#subnavigation li.relationships a.name {
	background-image: url(/images/relationship.png);
}
#subnavigation li.categories a.name {
	background-image: url(/images/contact_category.png);
}	
#subnavigation li.graphs a.name {
		background-image: url(/images/icons/chart_bar.png);
}
#subnavigation li.report a.name {
		background-image: url(/images/icons/report.png);
}
#subnavigation li.import_groups a.name {
		background-image: url(/images/icons/coins_add.png);
}

#subnavigation li.gift_aid a.name {
		background-image: url(/images/icons/weather_sun.png);
}
#subnavigation li.currencies a.name {
		background-image: url(/images/icons/money_euro.png);
}

/*********************************************
 * GENERAL INFORMATION TABLE
 *********************************************/

table.information { 
	width: 100%; 
	margin: 0; 
	padding: 0; 
	border-collapse: collapse; 
	border: none; 
	font-size: 12px; 
	line-height: 130%;
}

table.information td,
table.information th { 
	padding: 5px 10px; 
	vertical-align: top; 
}

table.information th { 
	text-align: right; 
	font-weight: bold; 
	font-size: 11px;
	width:  60px;
}

table.information tr.new_section td, table.information tr.new_section th { 
	padding-top: 20px; 
}

#sidebar.detail { 
	width: 310px; 
}

#sidebar.fullsidebar {
	float: none;
	width: 100%;
}

#content.detail { 
	width: 640px; 
}

#sidebar.detail .tab-pane { 
	min-height: 530px; 
	padding-top: 10px ;
	background: #fff;
}

/*********************************************
 * CONTACTS SECTION
 *********************************************/



/* ---- PREVIEW ---- */

#preview { padding: 10px 10px 0 10px; min-height: 142px; background: #eee; border-left: 1px solid #ccc; margin-right: 0px; width: 689px; font-size: 12px;}

#preview .address p { 
	line-height: 150% 
}

#preview .address { 
	float: left;
	width: 150px;
	margin-right: 10px; 
}

#preview .donations { 
	float: left;
	width: 230px;
	margin-right: 10px; 
}

#preview .activity { 
	float: left;
	width: 270px; 
}

#preview table.recent { 
	font-size: 12px; 
	width: 100%;
	border: 1px solid #ccc; 
}
#preview table.recent td { 
padding: 3px;
}
#preview table.recent th { 
	padding: 3px; 
	font-weight: bold;
}
#preview table.recent img { 
	height: 10px; 
}

/* ---- SMART SEARCHES ---- */
.smart_searches { 
	margin-left: 20px; padding: 5px 0; 
}
.smart_searches li { list-style-image: url(/images/search_icon.png); margin-bottom: 5px;}
.smart_searches li a { color: #333; font-size: 13px; text-decoration: none; }
.smart_searches li.custom .edit { 
	display: none; 
	margin-left: 5px;
}
.smart_searches li.custom:hover .edit { 
	display: inline; 
}


/*********************************************
 * FORM
 *********************************************/
input[type="text"], input[type="password"] { 
	border: 1px solid #ccc; width: 95%; 
	font-size: 13px;
}

.flexigrid input[type="text"] { 
	width: auto; 
}

textarea { 
	width: 95%;
	height: 100px;
	border: 1px solid #ccc; 
}

div.part { float: left; padding: 0 5px 0 0; margin: 0;}
span.hint { display: block; color: #999; padding-left: 3px;}
div.part input.textInput { width: auto;}

/*********************************************
 * MESSAGES
 *********************************************/
div.flash 				{ background: no-repeat center; background-position: 15px 50%; /* x-pos y-pos */
					  text-align: left; padding: 10px 20px 10px 45px; border-top-style: solid;
    				  border-top-width: 2px; border-bottom-style: solid; border-bottom-width: 2px; border-left: none;
    				  border-right: none; font-size: 13px; margin: 0; }
div.error 				{ background-image: url(/images/icons/exclamation.png); background-color: #ffe8e8; border-top-color: #df7d7d; border-bottom-color: #df7d7d;}
div.warning 			{ background-image: url(/images/icons/error.png); background-color: #FFFFCC; border-top-color: #CC9900; border-bottom-color: #CC9900; }
div.success 			{ background-image: url(/images/icons/accept.png); background-color: #CCFFCC; border-top-color: #339933; border-bottom-color: #339933; }
div.notice 			{ background-image: url(/images/notice.png); background-color: ; border-top-color: #b5d4fe; border-bottom-color: #b5d4fe; }

input.error { 
	 background-color: #ffe8e8; border: 1px solid #df7d7d;
}
label.error { 
	color: #c00; 
	font-weight: bold;
	display: block;
}

/*********************************************
 * CATEGORY SELECT/FORM
 *********************************************/
.category_list { width: 180px; height: 400px; overflow: auto; float: left; border-right: 1px dotted #ccc; padding: 10px; font-size: 12px; }
.category_form { float: left; width: 380px; padding: 10px;}
.category_form textarea { width: 380px;}
.category_window { width: 100%;}

#category_popup .category_list { width: 400px; border-right: none;}

/*********************************************
 * CATEGORY SELECT/FORM
 *********************************************/
.fund_list { width: 400px; height: 400px; overflow: auto; float: left; padding: 10px; font-size: 12px; }

/*********************************************
 * TEMPLATE: FACETS 
 *********************************************/

.add-buttons { padding: 5px 0;}

.button-bar { 
	background: #eee; 
	padding: 5px; 
	border-left: 1px solid #ccc; 
}

#sidebar .button-bar { 
	border-left: 0px; 
	border-top: 1px solid #ccc; 
}

input.quick-search { background: url(/images/search.png) no-repeat 0px center; border: none; padding: 4px 20px 4px 20px; width: 166px; font-size: 11px;}


#flex-donations { width: auto;}

/*********************************************
 * TEMPLATE: LOGIN 
 *********************************************/


#login .popupWindow { 
	width: 300px; 
	background-color: white; 
	border: medium none;
	margin-left: -150px; 
	position: fixed; 
	z-index: 9999; 
	left: 50%; 
	top: 15%;
	display: block; 
}

#ui-datepicker-div {
	z-index: 9990 !important;
}
#ui-datepicker-div select {
	z-index: 10000 !important;
}

#login th { width: 100px;}
#login .flash { font-size: 12px;}

/*********************************************
 * MY_CMSI
 *********************************************/
#my_cmsi { padding: 0 0px; width: 100%;}
#my_cmsi h2 { padding-top: 10px;}
#my_cmsi .cell { width:33%; padding: 5px 0px 0px 10px; vertical-align: top;  }
#tasks, #calendar, #feed { overflow: auto; height: 390px; }
#my_cmsi .border { border-left: 1px solid #999; }
#my_cmsi tr.buttons td { border-top: 1px solid #ccc; padding-bottom: 5px;}
#my_cmsi p.loading { font-size: 10px; color: #999; padding: 20px;}
/*********************************************
 * TASKS
 *********************************************/

table.tasks { width: 100%;}
table.tasks td,
table.tasks th { padding: 3px 5px; font-size: 12px; line-height: 120%;}
table.tasks th { font-size: 11px; font-weight: bold; margin-top: 20px; text-align: right;}
table.tasks tr.overdue th,
table.tasks tr.overdue td { background-color: #ffe8e8; color:#c00;}
table.tasks tr.completed td { color: #999;}
table.tasks tr.split td { padding: 5px 0;}
table.tasks td.task_subject .edit { display: none;}
table.tasks td.task_subject:hover .edit { display: inline;}

/*********************************************
 * CALENDAR
 *********************************************/

table.calendar { width: 100%;}
table.calendar td,
table.calendar th { padding: 3px 5px; font-size: 12px; line-height: 120%;}
table.calendar th { font-size: 11px; font-weight: bold; margin-top: 20px; text-align: right; width: 50px;}
table.calendar tr.split td { padding: 5px 0;}
table.calendar td.date { color: #666; font-size: 11px; width: 40px;}
table.calendar td.no_appointment { color: #999; font-size: 10px;}

/*********************************************
 * ARTICLES
 *********************************************/
div.articles h3 { font-size: 12px; line-height: 120%; }
div.articles a { color: #333;}
div.articles h3 a { text-decoration: none;}
div.articles p { font-size: 11px; color: #666; margin: 5px 0 10px 0; line-height: 120%;}
div.articles img { float: left; height: 50px; width: 50px; margin: 5px; border: 1px solid #ccc;}

/*********************************************
 * ARTICLES
 *********************************************/
#my_cmsi .messages { width: 100%; background: #ffc; }
#my_cmsi .post_message { width: 100%; background: #ffc; border-bottom: 1px solid #999; text-align: right; padding: 5px; font-size: 10px; }
#my_cmsi .post_message input { margin-left: 20px;}
#news_button { text-align: right;}
#showhere { height: 100px; overflow: auto; font-size: 12px; line-height: 130%; padding: 10px; color: #333;}
#showhere h3 { font-size: 13px; color: #999; margin-bottom: 5px; padding: 0; }
#showhere h3 strong { font-weight: bold; color: #CC9900;}

#calendar_frame { width: 100%; height: 570px;}


/*********************************************
 * CATEGORY SETTINGS
 *********************************************/
#category_settings .category_list,
#fund_settings .fund_list { width: 400px; height: 540px; border-right: 1px solid #ccc;}
#edit_area { width: 500px; margin-left:20px; float: left;}
#edit_area h1 { padding: 10px 0 20px 0;}
#edit_area p { padding: 10px 0; font-size: 10px;}


#fund_donations .fund_list { width: 300px; height: 570px; border-right: 1px solid #ccc;}
#fund_donations #edit_area { width: 600px; margin-left: 0;}
#fund_donations #edit_area p { padding: 10px;}


#donation-form div.two_col { min-height: 410px;}
#contact-form div.two_col { min-height: 410px; }

.bDiv tr td { height: 26px; }

#gift_aid { padding: 20px;}
#gift_aid p { font-size: 12px; padding: 10px 0;}
#gift_aid ul { padding: 10px;}
#gift_aid li { margin-bottom: 5px; font-size: 12px;}

#errorExplanation h2, #errorExplanation p { display: none;}
#errorExplanation ul { padding: 10px;}
#errorExplanation li { margin-bottom: 5px;}
#my_settings { padding: 20px;}
#my_settings h2 { font-size: 16px; padding: 10px 0 30px 0;}

#warning_box { border: 3px solid #ccc; width: 500px; margin: auto; padding: 10px; background: white; text-align: center;}


.export_status {text-align: center;}
.export_status h2 { font-size: 30px; padding-bottom: 20px;}
.export_status #please_wait img { padding: 40px;}

.export_status #done, .export_status #fail p { padding-bottom: 20px; line-height: 1.5em;}
.export_status #done .files { border: 1px dashed #999; padding: 20px 20px 20px 20px; width: 70%; margin: 0 auto 10px auto; background: #eee;}
.export_status #done .return a { font-size: 90%;}

.export_status .small, .export_status small { font-size: 80%;}


.popupWindow { top: 1% !important;}
#login .popupWindow { top: 15% !important; }

.button-bar form {
  display: inline;
}
.button-bar form div {
  display: inline;
}