/* -----------------------------------*/
/* --------->>> GLOBAL <<<------------*/
/* -----------------------------------*/

html, body, ul, ol, li, p,
h1, h2, h3, h4, h5, h6,
form, fieldset, a {/* level the playing field */
	margin: 0;
	padding: 0;
	border: 0;
}

html {
	height: 100%;
}

body {
	font-size: 62.5%;
	background: #e5ecf9 ;
	color: #555;
	font-family: Arial,Verdana,Helvetica,sans-serif;
	height: 100%;
	
}
body#timesheets{
	background-color: #fff;
	background-image: none;
}
a{
   outline: none;
}
#gridOverlay{
   width: 100%;
   height: 100%;
   background: url(/images/layout/grid.gif);
   position: absolute;
   z-index: 300;
}
p{
   margin-top: 18px;
   margin-bottom: 18px;  
}


/* -----------------------------------*/
/* --------->>> HEADER <<<------------*/
/* -----------------------------------*/

#masthead {
	background: #444;
	left: 0px;
	width: 100%;
	position: absolute;
	top: 0px;
	height: 60px;
}

#home #masthead{
   height: 72px;
   z-index: 10;
}
#header {
	margin: 0px auto;
	width: 700px;
	padding-top: 9px;
	position: relative;
	text-align: left;
}
#skinny #header{
   padding: 0;
   width: 500px;
}

/* -----------------------------------*/
/* --------->>> LAYOUT <<<------------*/
/* -----------------------------------*/

#wrapper {
	min-height: 100%;
	background: url(/images/layout/body.png) no-repeat center 71px;
	margin: 0px auto;
	width: 704px;
}

#home #wrapper{
   background: url(/images/layout/body.png) no-repeat center 90px;
}
#skinny #wrapper{
   width: 504px;
   background: url(/images/layout/body-skinny.png) no-repeat center 90px;
}

#nav {
	z-index: 2;
	left: 0px;
	position: absolute;
	top: 41px;
	height: 32px;
   overflow: hidden;
}
#main {
	min-height: 100%;
	width: 700px;
	padding: 90px 2px 68px;
	text-align: left;
	position: relative;
}
#skinny #main{
   width: 500px;
}
#home #main #contentPadding{
   padding: 36px 13px 0;
}
#footer {
	background: url(/images/layout/footer.png) #e5ecf9 no-repeat;
	margin: -50px auto 0px;
	width: 704px;
	position: relative;
	height: 50px;
	overflow: hidden;
}
#skinny #footer{
   width: 504px;
   background: url(/images/layout/footer-skinny.png) #e5ecf9 no-repeat;
}
#footerContent {
	padding-right: 2px;
	padding-left: 2px;
	margin: 0px auto;
	width: 700px;
	height: 40px;
	padding-top: 10px;
	line-height: 40px;
	font-size: 10px;
	color: #666;
}
#skinny #footerContent{
   width: 500px;
}

#flashNotice{
	padding: 8px;
	background-color:#C0EF06;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-weight:bold;
	margin-bottom:14px;
	position: relative;
	width: 684px;
}

#signupForm #flashNotice{
   width: auto;  
}
#skinny #flashHolder{
   margin-top: 15px;
}
#flashErrors{
	padding: 12px 8px;
	background: #fb4f4f url(/images/layout/error-bg.gif) center right no-repeat;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-weight:bold;
	margin-bottom:14px;
	color: #fff;
	position: relative;
}
#home #flashErrors, #home #flashNotice{
   margin-top: 18px;
}
#flashErrors ul, #flashNotice ul{
	list-style: none;
	margin-right: 45px;
}
#flashErrors a{
	color: #333;
	padding: 2px;
}
#flashErrors a:hover{
	color: #fff;
	background: #555;
}
.reportRow{
	margin-top: 15px;
	position: relative;
}
.floatRight{
	float:right;	
}
.floatLeft{
   float: left;
}
#signupBanner{ 
   width: 668px;
   height: 264px;
   border: solid 3px #c2c6b4;
   background: #f2f7e1;
   margin-bottom: 36px;
   position: relative;
}

#bannerScreenshot{
   position: absolute;
   top: -30px;
   left: 0;  
}
#bannerFormHolder{
   height: 108px;
   position: absolute;
   width: 668px;
   left: 0;
   bottom: 0;
   z-index: 2;
   overflow: hidden;
}
.two-col-left{
   float: left;
   width: 327px;
}
.two-col-right{
   float: right;
   width: 327px;
}

.feature-item{
   width: 182px;
   height: 113px;
   margin-bottom: 36px;
   padding-left: 148px;
}

.feature-time  { background: url(/images/main/feature-time-half.png) no-repeat; }
.feature-search{ background: url(/images/main/feature-search-half.png) no-repeat; }
.feature-job   { background: url(/images/main/feature-job-half.png) no-repeat; }
.feature-undo  { background: url(/images/main/feature-undo-half.png) no-repeat; }

.teaser-video{
   margin-top: 18px;
   width: 580px;
   min-height: 390px;
   margin-left: auto;
   margin-right: auto;
}

/* -----------------------------------*/
/* -------->>> HEADINGS <<<-----------*/
/* -----------------------------------*/

h1 {
	font-size: 2em;
	letter-spacing: -1px;
	margin-bottom: 18px;
}
#header h1{
	color: #E5ECF9;
}
h2 {
	clear: left;
	font-size: 1.8em;
	color: #666;
	letter-spacing: -1px;
	line-height: 1.2em;
	margin-bottom: 18px;
	
}


div.defaultPadding h1, div.defaultPadding h2, div.defaultPadding h3, div.defaultPadding h4{
	text-indent: 0;
}

h2 em{
	padding-left: 5px;
	font-weight: normal;
	font-size: 75%;
	color: #a2a1a1;
	font-style: normal;
}
h2 span{
	float: left;
}

#submitThankyou h2{
   color: #98BD05;
}

#submitThankyou h2 span{
   float: none;
}

h3 em{
	padding-left: 5px;
	font-weight: normal;
	font-size: 70%;
	color: #a2a1a1;
	font-style: normal;
}

h3{
	letter-spacing: -1px;
	font-size: 1.6em;
	color: #1f8fff;
	line-height: 18px;
}
.feature-item h3{
   line-height: 18px;
   margin-bottom: 9px;
}

h3 a, h2 a{
	color: #009bd3;
	text-decoration: none;
}
h3 a:hover, h2 a:hover{
	text-decoration: underline;
	color: #009bd3;
}
h4{
	font-size: 1.2em;
	color: #555;
	letter-spacing: -1px;
}

h3.pageDivision, h2.pageDivision{
	padding-top: 15px;
	background: url(/images/layout/page-division.gif) top left repeat-x;
	padding-bottom: 5px;
	position: relative;/*ie6 bug */
	display: block;
	margin: 0;
	text-indent: 10px;
}


h2.pageDivision a{
	text-decoration: underline;
	position: absolute;
	top: 17px;
	right: 8px;
	font-size: 60%;
	font-weight: normal;
	color:#009BD3;
	padding:3px;
	text-indent: 0;
}

h2.pageDivision a:hover{
	background-color:#555555;
	color:#C0EF06;
	text-decoration:none;
}



/* -----------------------------------*/
/* ------->>> TEXT STYLES <<<----------*/
/* -----------------------------------*/

h1#logo a{
   display: block;
   text-indent: -5000px;
   width: 194px;
   height: 54px;
   background: url(/images/logo-big.jpg);
}
a.regLink{
	margin-left: 8px;
	font-weight: normal;
	color: #009bd3;
	text-decoration: underline;
	padding: 3px;
}

a.regLink:hover, #flashUndo:hover{
	color:#C0EF06;
	background-color: #555;
	text-decoration: none;
}

.cleaner {
	clear: both;
	overflow: hidden;
	height: 0px;
}

a.cancelLink {
	display: block;
	background: url(/images/buttons/close.png) no-repeat;
	overflow: hidden;
	width: 24px;
	text-indent: -3000px;
	height: 24px;
	position: absolute;
	top: -4px;
	right: -4px;
	z-index: 10;
}

a.cancelLink:hover, a.backLink:hover, a.deleteLink:hover, a.reArrangeLink:hover, a.editLink:hover, a.expandButton:hover {
	background-position: top right;
}


.topBorder{
	border-top: solid 1px #d9d9d9;
}
.defaultPadding{
	padding: 8px;
}

a#betaSignupButton{
   text-indent: -5000px;
   display: block;
   width: 257px;
   height: 58px;
   background: url(/images/main/signupbtn.gif) top left;
   top: 0;
   right: 14px;
   position: absolute;
}
a#betaSignupButton:hover{
   background-position: top right;
}
#headerCopy{
   text-indent: -5000px;
   width: 262px;
   height: 92px;
   float: right;
   margin-right: 14px;
   background: url(/images/main/header-copy.gif);
   margin-top: 18px;
}
#headerCopy h1{
   text-indent: -5000px;
}
a#logoSmall{
   text-indent: -5000px;
   display: block;
   width: 97px;
   height: 20px;
   background: url(/images/logo-small.png); 
   margin-right: 10px; 
   float: left;
   margin-top: 8px;
}
a#travisjbeck{
   text-indent: -5000px;
   display: block;
   width: 74px;
   height: 21px;
   background: url(/images/travis-logo-small.png); 
   float: left;
   margin-top: 9px; 
   margin-left: 5px;
}
.feature-item p{
   font-size: 1.1em; 
   color: #666;
   margin: 0;
   line-height: 18px;
}
/* -----------------------------------*/
/* ------->>> NAVIGATION <<<----------*/
/* -----------------------------------*/

#nav ul {
	padding-right: 0px;
	padding-left: 0px;
	padding-bottom: 0px;
	margin: 0px 0px 0px 35px;
	padding-top: 0px;
	list-style: none;
}
#nav ul li {
	float: left;
	margin-right: 3px;
	display: block;
	width: 116px;
	height: 32px;
}
#nav ul li a {
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	background-image: url(/images/layout/nav-full.png);
	color: #555;
	line-height: 32px;
	letter-spacing: -1px;
	text-align: center;
	text-decoration: none;
}
#nav ul li a:hover {
	background-position: top right;
	color: #009bd3;
}
/*active nav items */
#dashboard li.nav-dashboard a, #reports li.nav-reports a, #clients li.nav-clients a {
	background: url(/images/layout/nav-active.png) no-repeat;
	cursor: default;
	color: #009bd3;
}

ul#smallNav{
	position: absolute;
	top: 10px;
	right: 0px;
	list-style: none;
}

#home ul#smallNav{
   top: 24px;  
}

ul#smallNav li{
	float: left;
	padding-right: 8px;
	color: #aaa;
	line-height: 20px;
}
ul#smallNav li a{
	display: block;
	line-height: 20px;
	color: #c0ef06;
	text-decoration: none;
	outline: none;
}

ul#smallNav li a.settingsLink{
	padding-left: 23px;
	background: url(/images/icons/settings.gif) top left no-repeat;	
}

ul#smallNav li a.logoutLink{
	padding-left: 23px;
	background: url(/images/icons/logout.gif) top left no-repeat;	
}

ul#smallNav li a.usersLink{
	padding-left: 23px;
	background: url(/images/icons/users.gif) top left no-repeat;	
}

ul#smallNav li a:hover{
	color: #07bdff;
	text-decoration: underline;
}

ul#subNav{
	height: 25px;
	background: url(/images/layout/sub-nav-bg.gif) top left repeat-x;
	margin-bottom: 8px;
	text-align: center;
	list-style: none;
	padding-left: 8px;
}

ul#subNav li{
	float: left;
	padding: 0;
	margin: 0;
	margin-right: 2px;
	margin-top: -5px;
}

ul#subNav li a{
   padding: 0;
   margin: 0;
	display: block;
	line-height: 16px;
	height: 16px;
	width: 86px;
	text-align: center;
	font-size: 1.1em;
	color: #555;
	font-weight: bold;
	text-decoration: none;
	letter-spacing: -1px;
	outline: none;
	position: relative;
}

ul#subNav li a:hover{
	background: url(/images/layout/subnav-hover.gif) no-repeat;
}

ul#subNav li a.active, ul#subNav li a.active:hover{
	background: url(/images/layout/subnav-active.gif) no-repeat;
	color:#fff;
	cursor: default;
}


/* -----------------------------------*/
/* ---------->>> FORMS <<<------------*/
/* -----------------------------------*/

input.submitBtn{
   background: url(/images/buttons/form-submit-image.gif) left top;
   cursor: pointer;
   outline:none;
}
input.signupBtn{
   background: url(/images/buttons/btn-signup.png) left top;
   cursor: pointer;
   outline:none;
}

/* -------->>> CLIENT LISTING <<<-----------*/

div.formContrast{
	background: url(/images/layout/form-contrast.gif) top left repeat;
	position: relative;
	padding: 8px;
	border-bottom:1px solid #D9D9D9;
	border-top:1px solid #D9D9D9;
	min-height:2.2em;
	z-index: 50;
}

select.selectStyle{
	border: none;
	border: 1px solid #07bdff;
	font-weight: bold;
	color: #666;
	height: 20px;
	line-height: 20px;
}
select.selectStyle option{
	height: 20px;
	line-height: 2px;
}

span.fauxlabel{
	font-weight: bold;
	font-size: 1.2em;
	padding-right: 4px;
	line-height: 21px;
}
span.noBold{
   font-weight: normal;
}

/* -----------------------------------*/
/* ------>>> ADD NEW TRACKING <<<-----*/
/* -----------------------------------*/


img.inputSpinner{
	position: absolute;
	top: 0;
	right: 0;
	margin-top: 36px;
	margin-right: 5px;
}

#jobSubmitSpinner, #trackingSubmitSpinner, .spinner{
	float: right;
}

div.subDomain .spinner{
   position: absolute;
   bottom: 3px;
   left: 400px;
}


div.dynamicForm form div {
	float: left;
	width: 38%;
}

div.dynamicForm form div.fullForm {
   float: none;
   width: auto;
   margin-bottom: 15px;
}
div.dynamicForm form div.subDomain{
   position: relative;
}
div.dynamicForm form div.subDomain span.absolute{
   position: absolute;
   left: 5px;
   color: #666;
   font-weight: bold;
   bottom: 0;
}
div.dynamicForm form div.subDomain input#account_subdomain{
   text-indent: 36px;
}
div.dynamicForm form div.fullForm input{
	width: 200px;
}

div.dynamicForm form div.medForm{
	width: 25%;
}

div.dynamicForm form div.input_submit {
	width: 14%;
	padding-top: 3.5em;
	text-align: right;
}


#newUserForm form div.input_submit{
	width: 17%;
	margin-left: 7%;
}

div.dynamicForm form div.input_submit input {
	padding: 0;
	float: right;
	height: 22px;
	width: 86px;
}

div.dynamicForm form div input {
	width: 90%;
	display: block;
	text-indent: 3px;
	height: 1.4em;
	padding: 1px;
	padding-top: 2px;
}

div.dynamicForm form div input.inline {

	display: inline;
	text-indent: 3px;
	height: 1.4em;
	padding: 1px;
	padding-top: 2px;
	margin-right: 3px;
}

div.dynamicForm form div input.checkBox{
	width: auto;
	display: block;
	text-indent: 3px;
	height: 1em;
	padding: 1px;
	padding-top: 2px;
	float: left;
}

div.dynamicForm form div label.checkBoxLabel{
	font-size: 1.1em;
	letter-spacing: -1px;
	line-height: 1.7em;
	text-indent: 4px;
	color: #555;
}

div.dynamicForm form div select {
	width: 90%;
	line-height: 1.4em;
	border: 1px solid #07bdff;
	padding-top: 1px;
}

div.dynamicForm form div option{
	height: 1.4em;
	line-height: 1.4em;
	
}

div.dynamicForm label {
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	height: 3em;
	width: 50%;
}

div.medForm label{
   width: 90%;
}
div.dynamicForm label.validated em{
   color: #608e25;
   font-weight: bold;
}
div.dynamicForm label.error em{
   color: #FB4F4F;
   font-weight: bold;
}

#addNewAccountForm fieldset{
   padding: 10px 50px;
}

#skinny div.dynamicForm label{
   width: 100%;
}
#skinny div.dynamicForm form div.medForm{
	width: 47%;
}
#skinny div.dynamicForm div.medForm label, #skinny div.dynamicForm div.medForm input{
   width: 100%;
}
#skinny div.dynamicForm form div.input_submit {
	width: 100%;
}
#skinny div.dynamicForm form div.fullForm input{
   width: 100%;
}
#skinny div.dynamicForm form div.subDomain input{
   width: 71%;
}
#job_jobno_label{
	width: 83%;
}
div.input_job label{
	width: 90%;
}

label.validated{
	background-image: url(/images/layout/validated.png);
	background-position: top right;
	background-repeat: no-repeat;
}

div.dynamicForm label a{
	font-size: 0.9em;
	margin-left: 10px;
	font-weight: normal;
	color: #009bd3;
	text-decoration: underline;
	padding: 3px;
}
div.dynamicForm label a:hover{
	color:#C0EF06;
	background-color: #555;
	text-decoration: none;
}


div.dynamicForm label em, #naked form label em {
	display: block;
	font-weight: normal;
	font-size: 0.8em;
	color: #8e8d8d;
	padding-top: 2px;
	font-style: normal;
}

input.medText, select.medText{
	font-size: 1.1em;
	font-weight: bold;
	color: #666;
	border: 1px solid #07bdff;
}



/* -------------->>> ERRORS <<<---------------*/
#dynamicFormErrors, .dynamicFormErrors{
	width: 100%;
	float: none;
	color: #fff;
	text-indent: 8px;
	overflow: hidden;
	height: 0;
   display: block;
	background: #fb4f4f url(/images/layout/error-bg.gif) center right no-repeat;
}
#dynamicFormErrors div, .dynamicFormErrors div{
	width: 100%;
	
}
#dynamicFormErrors p, .dynamicFormErrors p{
	padding-top: 5px;
	padding-bottom: 5px;
	margin: 0;
}
#dynamicFormErrors ul, .dynamicFormErrors ul{
	padding: 0;
	margin: 0;
	list-style: none;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 8px;
	font-weight: bold;
}
/* -------------->>> MESSAGES <<<---------------*/
#dynamicFormMessage, .dynamicFormMessage{
	width: 100%;
	float: none;
	color: #C0EF06;
	text-indent: 8px;
	overflow: hidden;
	height: 0;
	background: #555;
}
#dynamicFormMessage div, .dynamicFormMessage div{
	width: 100%;
}
#dynamicFormMessage p, .dynamicFormMessage p{
	padding-top: 5px;
	padding-bottom: 5px;
	font-weight: bold;
}
#dynamicFormMessage ul, .dynamicFormMessage ul{
	padding: 0;
	margin: 0;
	list-style: none;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 8px;
	font-weight: bold;
}

input.submitBtn.disabled, 
input.submitBtnUpdate.disabled, 
input.submitBtnInvite.disabled,
input.submitBtnWhite.disabled,
input.signupBtn.disabled{
   background-position: right top;
   cursor: default;
}
input.submitBtn.disabled:hover, 
input.submitBtnUpdate.disabled:hover, 
input.submitBtnInvite.disabled:hover,
input.submitBtnWhite.disabled:hover,
input.signupBtn.disabled:hover{
   background-position: right bottom;
}


/* -----------------------------------*/
/* ---->>> LOGIN & SIGNUP FORM <<<----*/
/* -----------------------------------*/
#loginForm{
	width: 374px;
	height: 154px;
	margin: 0 auto 0 auto;
	margin-top: 150px;
	background: #fff;
	padding: 15px;
	background: url(/images/layout/login-bg.gif) no-repeat;
}

#signupForm{
	width: 374px;
	margin: 0 auto 0 auto;
	background: #fff;
	padding: 15px;
	background: url(/images/layout/form-box-repeat.gif) repeat-y;
}
div.nakedFormTop{
	height: 7px;
	width: 404px;
	margin: 0 auto 0 auto;
	margin-top: 150px;
	background: url(/images/layout/form-box-top.gif) no-repeat;	
}
div.nakedFormBottom{
	height: 7px;
	width: 404px;
	margin: 0 auto 0 auto;
	background: url(/images/layout/form-box-bottom.gif) no-repeat;
}

#naked form p{
	margin: 0;
	padding-bottom: 8px;
	clear: both;
	width: 90%;
	display: block;
}

#naked form p.submit{
	padding-top: 5px;
}

#naked #signupForm form p{
	width: 100%;	
}

#naked form p.checkbox input.submit{
	float: right;
}

#naked form p.checkbox label{
	width: auto;
}

#naked form fieldset{
	margin-left: 130px;
	padding-top: 1px;
}
#naked #signupForm form fieldset{
	margin-left: 0;	
}
#naked form input.txtInput{
	width: 99%;
	font-size: 1.3em;
	font-weight: bold;
	color: #666;
	border: 1px solid #07bdff;
}
#naked form input.txtInput:focus{
	background: #555;
	color: #C0EF06;
}

#naked form label{
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	letter-spacing: -1px;
	width: 98%;
	padding-bottom: 3px;
}

#naked form p.checkbox label{
	display: inline;
	font-weight: normal;
	float: left;
	line-height: 18px;
	padding-left: 3px;
}
#naked form p.checkbox input{
	float: left;
}
#naked p.submit input{
	float: right;
}

#naked #signupForm p.halfLeft{
	display: block;
	width: 48%;
	float: left;
	padding-right: 1%;
	clear: none;
}
#naked #signupForm p.halfRight{
	display: block;
	width: 48%;
	float: left;
	padding-left: 2%;
	clear: none;
}

.betasignupDynamicForm{
   margin-top: 108px;
}

#betasignupForm{
   height: 90px;
   background: url(/images/main/betaformbg.png); 
   padding-top: 18px; 
   padding-left: 8px;
   padding-right: 8px;
   position: relative;
}
div#betasignupForm.nonAjax{
   margin-left: 10px;
   margin-right: 10px;
}

#betasignupForm fieldset label{
   color: #eee;  
   width: auto;
}
form#addBetasignup fieldset label{
   width: 90%;
}
#betasignupForm fieldset label em{
   color: #aaa;  
}
#betasignupForm div{
   width: 50%;
}
#betasignupForm div.input_submit{
   width: 14%;  
}
#betasignupForm div.smallWidth{
   width: 35%;  
}
#betasignupForm .cancelLink{
   top: 8px;
   right: 8px;
}

#submitThankyou{
   height: 108px;
   background: url(/images/main/betaformbg.png); 
   width: 668px;
   text-align: center;
   position: absolute;
   line-height: 108px;
   bottom: -108px;
   left: 0;
   z-index: 11;
}


/* -----------------------------------*/
/* ------>>> JOBS & CLIENTS <<<-------*/
/* -----------------------------------*/

div.clientRow, div.sectionPadding{
	padding-top: 8px;
	padding-bottom: 2px;
	margin-top: 15px;
	padding-top: 5px;
}

/* -----------------------------------*/
/* ---------->>> REPORTS <<<-----------*/
/* -----------------------------------*/



/* -----------------------------------*/
/* ---------->>> TABLES <<<-----------*/
/* -----------------------------------*/