/*  ----------------------------------------------------------------------- */
/*  Main Layout
/*  ----------------------------------------------------------------------- */


body { background-color: #cccc99; }

#header { position: relative; width: 100%; z-index: 700; background-color: #333333; }
.header-home { height: 215px; }
.header-sublevel { height: 145px; }

.centre { width: 960px; margin: 0 auto 0 auto; }
.container { width: 960px; position: relative; }

/*  ----------------------------------------------------------------------- */
/*  Menu-bar (green menu bar across the top of the page)
/*  ----------------------------------------------------------------------- */

#menu-bar {
	position: relative; width: 100%; height: 30px; padding-top: 6px;
	background-color: #a7bd73; background-image: url('/cms_files/80/menu-bar-bg.gif'); background-repeat: repeat-x;
}

#main-menu { position: relative; }
#main-menu ul { float: left; height: 25px; }
#main-menu ul li { display: inline; float: left; height: 25px; padding: 0 10px 0 10px; }
#main-menu ul .selected { background-image: url('/cms_files/80/menu-selected.gif'); background-repeat: repeat-x; }

#menu-bar a, #menu-bar a:link, #menu-bar a:visited, #menu-bar a:active {
	display: block; padding: 5px 0 0 0;
	color: #ffffff; font-size: 12px; font-weight: bold; text-decoration: none;
}
#menu-bar a:hover { border-bottom: 2px solid #cccc99; }
/*#main-menu ul .selected a { padding-right: 0; background-image: url('/cms_files/80/menu-selected-left.gif'); background-repeat: no-repeat; }
*/

#members-tab {
	position: absolute; top: -5px; right: 230px;
	width: 110px; height: 25px; padding: 11px 10px 0 10px; text-align: center;
	color: #fff; background-color: #51514a; background-image: url('/cms_files/80/members-tab-bg.png'); background-repeat: no-repeat;
}

#members-tab a { display: inline; padding-top: 0; }
#members-tab a:hover { border-bottom: 2px solid #cccc99; }

#telephone { position: relative; float: right; right: 10px; }

/*  ----------------------------------------------------------------------- */
/*  Header - Other components
/*  ----------------------------------------------------------------------- */

#logo { position: absolute; width: 240px; height: 40px; top: 30px; left: 10px; }
#tagline { position: absolute; display: block; color: #e2e2cb; font-size: 19px; top: 80px; left: 10px; }

#members-new { position: absolute; display: block; color: #e2e2cb; font-size: 14px; top: 120px; left: 10px; }
#members-new a { color: #e2e2cb; text-decoration: none; }
#members-new a:hover { color: #fff; text-decoration: underline; }
.header-sublevel #members-new { font-size: 12px; top: 110px; left: 610px; }

#members-box { z-index: 888; color: #fff; font-size: 10px; position: absolute; width: 360px; top: 0; right: 0;  background-color: #51514a; }
#members-box a { color: #F4EF64; }
#members-box a.gray { color: #CCC; }
#members-box a:hover { color: #fff; }
#members-box-content { padding: 0 10px 0 10px;  }

#members-box-menu { margin-top: 4px; }
#members-box-menu li { width: 100px; margin-right: 10px; float: left; height: 15px; } 

#featured-profiles { position: absolute; top: 73px; right: 5px; width: 345px; height: 135px; }

#featured-profiles .mask { position: absolute; }

#featured-profiles li
{
	float:left;
	padding-right:5px;
}
.yellow
{
color:#F4EF64;
}
/*  ----------------------------------------------------------------------- */
/*  Header - Large Tabs
/*  ----------------------------------------------------------------------- */

#large-tabs { z-index: 700; position: absolute; left: 0; width: 610px; height: 40px; }
.header-home #large-tabs { top: 175px; }
.header-sublevel #large-tabs { top: 105px; }

#large-tabs .menu { position: relative; width: auto; height: 40px; }
#large-tabs .menu li { display: block; float: left; width: 197px; height: 40px; margin-right: 5px; }

#large-tabs .menu a, #large-tabs .menu a:link, #large-tabs .menu a:active, #large-tabs .menu a:visited {
	color: #5e5e5e;
	display: block;
	width: 197px; height: 27px;
	background-image: url('/cms_files/80/large-tab-sprite.png');
	background-repeat: no-repeat;
	background-position: 0% -40px;
	text-decoration: none;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 13px 0 0 0;
}

#large-tabs .menu a:hover { color: #333; background-image: url('/cms_files/80/large-tab-sprite.png'); background-position: 0% -80px; }
#large-tabs .menu #tab-selected a { color: #333; background-image: url('/cms_files/80/large-tab-sprite.png'); background-position: top; }

/*  ----------------------------------------------------------------------- */
/*  Large Tabs - Dropdown Lists
/*  ----------------------------------------------------------------------- */

#large-tabs .dropdown { z-index: 700; position: absolute; top: 0px; width: 199px; display: none; }

#large-tabs .dropdownlink {
	color: #333333;
	display: block;
	width: 197px; height: 27px;
	background-image: url('/cms_files/80/large-tab-sprite.png');
	background-repeat: no-repeat;
	background-position: 0% 0%;
	text-decoration: none;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 13px 0 0 0;
	margin-left: 1px;
}

#large-tabs .dropdownwrap {
	background-image: url('/cms_files/80/dropdown-bg2.gif');
	background-repeat: repeat-y;
}

#large-tabs .dropdown .dropmenu {
	position: relative;
	width: 179px;
	padding: 10px 10px 0 10px;
	background-image: url('/cms_files/80/dropdown-bg.png');
	background-repeat: no-repeat;
	background-position: top;
}

#large-tabs .dropdown .dropmenu li { position: relative; width: 179px; height: 22px; border-bottom: 1px solid #e1e1e1; }
#large-tabs .dropdown .dropmenu li a { display: block; padding-top: 4px; }

#dropdown-jobs { left: -1px; }

/*  ----------------------------------------------------------------------- */
/*  Main page layout
/*  ----------------------------------------------------------------------- */

#main-page { position: relative; }
#main-page .centre { width: 980px; }
#main-page .container { width: 980px; }

#home-page { float: left; width: 960px; padding: 0 10px 0 10px; background-color: #fff; background-image: url('/cms_files/80/home-page-bg.gif'); background-repeat: repeat-y; }
#sublevel-page { float: left; width: 960px; padding: 0 10px 0 10px; background-color: #fff; background-image: url('/cms_files/80/content-page-bg.gif'); background-repeat: repeat-y; }

#content { float: left; padding: 20px 20px 30px 20px; }
#sidebar { float: right; padding: 20px 20px 30px 20px; }

.content-home { width: 560px; }
.sidebar-home { width: 320px; background-image: url('/cms_files/80/seen-bg.png'); background-repeat: no-repeat; background-position: top left; }
.sidebar-home img { margin: 0 10px 10px 0; }

.content-sublevel { width: 750px; }
.sidebar-sublevel { width: 130px; }

#content ul {
	list-style-type: disc;
	list-style-position: outside;
	margin: 0 0 10px 30px;
}

#content .jobs-table { border-top: 1px solid #e1e1dc; margin: 10px 0 20px 0; }
#content .jobs-table td { border-bottom: 1px solid #e1e1dc; padding-top: 5px; }
#content .jobs-table thead td { border-bottom: 1px solid #e1e1dc; padding-top: 5px; padding-bottom:5px;}
#content .jobs-table p { margin-bottom: 5px; }

#content .joblist-table ul { list-style: none; margin: 0; }
#content .joblist-table ul li { height: 20px; }
#content .joblist-table .selected { font-weight: bold; }

.largeheader {min-height: 46px; padding: 10px 0 10px 10px; color: #fff; background-color: #a7bd73; background-position: bottom; background-image: url('/cms_files/80/viewjob-h1-bg.gif'); background-repeat: repeat-x; }

/*  ----------------------------------------------------------------------- */
/*  Footer
/*  ----------------------------------------------------------------------- */

#footer { position: relative; padding: 10px 0 10px 0; font-size: 11px; }
#footer .centre { zoom: 1; }
#footer ul { float: left; }
#footer ul li { display: block; float: left; margin-right: 10px; }

/*  ----------------------------------------------------------------------- */
/*  General styles
/*  ----------------------------------------------------------------------- */

.right { float: right; }
.left { float: left; }
.clear { clear: both; }
.error, .error ul li { color: #d12b52; }
.success { color: #547737; }
.awaiting { background-color: #6b6a69; }
.awaiting p { padding: 10px; }

/*  ----------------------------------------------------------------------- */
/*  Form design
/*  ----------------------------------------------------------------------- */

h4 { font-size: 14px; color: #fff; font-weight: bold; margin-bottom: 10px; clear: both; }

input, textarea { color: #333; font-size: 11px; }

#members-box img { height: 10px; width: 360px; overflow: hidden; display: block; } /* ie fix */
#members-box .error { color: #ffa5ba; }

#main-page fieldset { background-color: #525250; padding: 20px 20px 20px 60px; margin-bottom: 10px; }
#main-page label { float: left; color: #f4ef64; font-weight: bold; padding-top: 4px; }
#main-page .field { float: left; border: 0; height: 14px; padding: 4px; outline: none; }
#main-page textarea { border: 0; padding: 5px; outline: none; }
#main-page form strong { color: #fff; }

#main-page form a { color: #fff; }
#main-page form p { color: #fff; }
#main-page form blockquote { text-align: center; }
#main-page form blockquote p { color: #333; }
#main-page form ul { list-style: none; margin: 0; }
#main-page form ul li { padding-bottom: 2px; }
#main-page .submit { color: #333; font-size: 11px; font-weight: bold; height: 28px; padding: 0px 20px 0 20px; border: 1px solid #333; outline:none; background-image: url('/cms_files/80/submit-btn-bg.png'); background-repeat: repeat-x; background-position: left -1px; }

.grey-form ul { float: left; width: 100%; }
.grey-form li { display: block; float: left; clear: both; width: 100%; }
.grey-form label, .grey-form input, .grey-form textarea, .grey-form select { float: left; }

#contact-form label { width: 150px; }
#contact-form .field { width: 200px; }
#contact-form textarea { width: 530px; height: 80px; margin: 10px 0 10px 0; }

#postjob-details li { float: left; clear: both; width: 100%; height: 24px; }
#postjob-details label { float: left; width: 130px; clear: left; padding-top: 5px; }
#postjob-details input { float: left; width: 200px; clear: right; }
#postjob-group ul { width: 600px; }
#postjob-group ul li { float: left; width: 180px; margin-right: 20px; height: 20px; }
#postjob-group input {float: left; margin-right: 5px; }
#postjob-info li { float: left; clear: both; margin-bottom: 10px; }
#postjob-info label { display: block; clear: both; margin-bottom: 5px; width: 500px; }
#postjob-info input { width: 550px; margin-bottom: 10px; }
#postjob-info textarea { width: 550px; height: 100px; margin-bottom: 10px; }
#postjob-info #character_counter { background-color: #525250; color: #fff; font-size: 14px; font-weight: bold; width: 100px; }
#postjob-budget { margin-bottom: 10px; }
#postjob-budget label { width: 90px; }
#postjob-budget input { width: auto; margin: 0 5px 0 0; }
#postjob-gender { padding-bottom: 10px; clear: both; float: left;  width: 200px; }
#postjob-gender li { float: left; }
#postjob-gender label { margin-right: 10px; }
#postjob-gender input { margin-right: 5px; }
#postjob-age li, #postjob-end li { float: left; clear: both; margin-bottom: 2px; }
#postjob-age label, #postjob-end label { float: left; padding-top: 5px; height: 20px; clear: right; width: 400px; }
#postjob-age input, #postjob-end input { float: left; width: 150px; margin-right: 20px; clear: left; }

#content #jobapply-form li { height: auto; }
#jobapply-form textarea { margin: 10px 0 10px 0; width: 430px; height: 100px; }
#jobapply-form p { display: block; width: 430px; }

#accounttype-form label { width: 150px; }
#accounttype-form .field, #accounttype-form select { width: 200px; }
#premium-form textarea { width: 430px; height: 100px; }
#premium-form .cbox { display: inline; margin: 4px 10px 0 10px; }
#premium-form .submit { margin-top: 10px; }

#editprofile-a label { width: 150px; }
#editprofile-a input { width: 200px; }
#editprofile-a textarea { width: 300px; }

#editprofile-gender label { width: 80px; }
#editprofile-gender input { width: auto; margin: 5px 10px 0 0; }
#editprofile-dob input { width: 40px; margin-right: 2px; }

#editprofile-b label { width: 150px; float: left; }
#editprofile-b ul { width: 630px; }
#editprofile-b li { width: 210px; clear: none; }
#editprofile-b input { width: auto; margin-right: 10px; float: left; }
#editprofile-b textarea { width: 300px; }
#editprofile-c label { width: 150px; }
#editprofile-c input { width: 300px; }
#editprofile-c textarea { width: 400px; height: 100px; }
#editprofile-d label { width: 150px; }
#editprofile-d select { width: 200px; }
#edit-profile-form label { float: left; }
#edit-profile-form input { float: left; }
#editprofile-submit input { width: 130px; height: 28px; margin: 0; padding: 0; }

#pass-reminder li { float: left; margin-right: 20px; }
#pass-reminder label { display: block; padding-top: 5px; height: 20px; width: 140px; }
#pass-reminder input { width: 280px; }
#pass-reminder #submit { width: 140px; height: 28px; margin: 0; padding: 0; }

#login-form { width: 340px; height: 40px; }
#login-form fieldset { width: 220px; float: left; }
#login-form .field { width: 150px; height: 18px; border: 0; outline: none; float: right; margin-bottom: 2px; }
#login-form label { display: block; width: 70px; height: 20px; float: left; }
#login-form .options { width: 100px; float: right; }
#login-form .options a { position: relative; display: block; width: 120px; margin-left: -10px; }
#login-form .submit { margin-bottom: 4px; }

#register-form label { width: 150px; }
#register-form select { width: 200px; }
#registerform-a .field { width: 200px; }
#registerform-b .field { width: 300px; }
#registerform-b textarea { width: 400px; height: 120px; }
#registerform-c label { width: 150px; }
#registerform-c select { width: 200px; }
#registerform-a #registerform-dob input { width: 50px; margin-right: 5px; }
#registerform-gender { padding: 10px 0 10px 0; }
#registerform-terms label { width: auto; }
#registerform-terms input { margin-right: 10px; }
#registerform-terms { padding: 10px 0 10px 0; }

#register-form .auto-width
{
	width:auto !important;
}

.editpictures-form label { margin-bottom: 10px; }
.editpictures-form .upload-field { width: 300px; margin: 10px 0 10px 0; }

#viewprofile-form label { margin-bottom: 0px; width: 150px; }
#viewprofile-form	.field { width: 175px; }
#viewprofile-form textarea { width: 430px; height: 100px; float: left; clear: both; margin-bottom: 10px; }

.deletepic-group { padding-top:10px; }
.deletepic-group ul li { float: left; width: 180px; margin-right: 20px; height: 20px; }
.deletepic-group input {float: left; margin-right: 5px; }
.info-table
{
	/*table-layout:fixed;*/
	width:560px;
	word-wrap:break-word;
}

.info-table h2 {
	font-size: 13px; padding: 5px; margin: 5px 0 5px 0; background-color: #e2e2cb;
}
#content #info-list { margin: 0; list-style: none; }
#content #info-list li {
	padding-bottom: 10px; border-bottom: 1px solid #A7BD73;
	margin-bottom: 10px;
	height: auto;
}

/*  ----------------------------------------------------------------------- */
/*  Profiles
/*  ----------------------------------------------------------------------- */

.headshot-active { border: 3px solid #f4ef64; }

#browse_profiles_table { width:480px; }
#browse_profiles_table td { padding:5px; width:112px; }
#browse_profiles_table td img { border:1px solid #000; }
#browse_profiles_table .profile_name { text-align:center; }
#browse_left_column { float:left; width:560px; }
#browse_right_column { float:right; width:170px; padding:0; }

#browse_right_column select { width: 165px; float: left; clear: both; }
#browse_right_column fieldset { margin:0; padding:0; background-color:#FFF; }
#browse_right_column fieldset label { clear: both; color:#000; }
#browse_right_column input { float: left; clear: both; margin-top: 10px; }
#browse_right_column .submit { margin-bottom: 10px; }
#browse_right_column li { float: left; clear: both; }

#member_message
{
	width: 560px;
	margin-top:10px;
	clear:both;
}

#main-page #member_message fieldset {
	width: 480px;
}

#gallery img { border: 1px solid #000; }
#gallery p { padding-left: 29px; }
#gallery ul { margin: 0; padding: 0; list-style: none; }
#gallery li { margin:0 0 10px 29px; }

.picture_container img
{
	border:1px solid #000;
}

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 800;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1000;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

/**
 * Start of specific stuff
 */

/*
 * Datepicker
 */

a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(/images/icons/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 140px;
	float: left;
}

table.jCalendar {
	border: 1px solid #000;
	background: #aaa;
    border-collapse: separate;
    border-spacing: 2px;
}
table.jCalendar th {
	background: #333;
	color: #fff;
	font-weight: bold;
	padding: 3px 5px;
}

table.jCalendar td {
	background: #ccc;
	color: #000;
	padding: 3px 5px;
	text-align: center;
}
table.jCalendar td.other-month {
	background: #ddd;
	color: #aaa;
}
table.jCalendar td.today {
	background: #666;
	color: #fff;
}
table.jCalendar td.selected {
	background: #f66;
	color: #fff;
}
table.jCalendar td.selected.dp-hover {
	background: #f33;
	color: #fff;
}
table.jCalendar td.dp-hover,
table.jCalendar tr.activeWeekHover td {
	background: #fff;
	color: #000;
}
table.jCalendar tr.selectedWeek td {
	background: #f66;
	color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
	background: #bbb;
	color: #888;
}
table.jCalendar td.unselectable,
table.jCalendar td.unselectable:hover,
table.jCalendar td.unselectable.dp-hover {
	background: #bbb;
	color: #888;
}

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
	position: relative;
	background: #ccc;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 2px;
	width: 171px;
	line-height: 1.2em;
}
div#dp-popup {
	position: absolute;
	z-index: 199;
}
div.dp-popup h2 {
	font-size: 12px;
	text-align: center;
	margin: 2px 0;
	padding: 0;
}
a#dp-close {
	font-size: 11px;
	padding: 4px 0;
	text-align: center;
	display: block;
}
a#dp-close:hover {
	text-decoration: underline;
}
div.dp-popup a {
	color: #000;
	text-decoration: none;
	padding: 3px 2px 0;
}
div.dp-popup div.dp-nav-prev {
	position: absolute;
	top: 2px;
	left: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-prev a {
	float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
	cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
	cursor: default;
}
div.dp-popup div.dp-nav-next {
	position: absolute;
	top: 2px;
	right: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-next a {
	float: right;
}
div.dp-popup a.disabled {
	cursor: default;
	color: #aaa;
}
div.dp-popup td {
	cursor: pointer;
}
div.dp-popup td.disabled {
	cursor: default;
}