@import url(tripoli.css);

/*
    Document   : styles
    Created on : June 20, 2009
    Author     : israeljernigan
    Description:
      Loads css layout, and sets global styles for site

*
* Load Layout Styles

*
* Setup custom style, and look*/
body,body.layout-1
{
	background:#fefefe url(../images/bg_layout.png) 0 -80px repeat-x;
	color:#333;
}

body.l1 #secondary
{
	background:transparent url(../images/bg_sidebar.png) top left repeat-y;
	padding-left:0;
	padding-right:8px;
	width:23.5em;
}

#header
{
	height:13.9em;
}

#primary .content fieldset
{
	padding:0;
}

#primary .content legend
{
	margin-bottom:0.6em;
}

#footer
{
	background-color:#ccc;
	border-top:#ddd solid 2px;
	clear:both;
}

#footer .content
{
	width:94em;
	margin:0 auto;
}

#footer .content p
{
	width:60em;
}

.comment:hover
{
	background-color:#e9e9e9;
}

.comment th
{
	background:transparent url(../images/comments.png) right center no-repeat;
}

.comment th:hover
{
	cursor:pointer;
}

body.wide #primary .content,body.wide #secondary .content,body.wide #tertiary .content
{
	padding:1.6em;
}

.content h1{
font-size:2.6em;
}

ul li
{
	padding-bottom:6px;
}

hr{
clear:both;
}

.left
{
	float:left;
}

.right
{
	float:right;
}

.clear
{
	clear:both;
}

.notRequired
{
	font-size:10px;
}

/**
* Top Menu style
*/
.menu{
position: relative; top: 11px;
}

.menu form{
display:inline;
}

.menu .formButton{
border-bottom:none;
font-size:1.2em;
	-moz-border-radius:3px;
	-moz-border-radius-bottomleft:0;
	-moz-border-radius-bottomright:0;
	-webkit-border-radius:3px;
	-webkit-border-bottom-left-radius:0;
	-webkit-border-bottom-right-radius:0;
	float:left;
	margin-right:4px;
}

.menu input.formButton{
padding:5px 7px 5px 19px;
}

.menu a.formButton{
padding:4px 7px 4px 19px;
}

.menu .formButton:hover{
color:#333;
}


.help_menu a{
background-color:#666666;
-moz-border-radius-bottomleft:3px;
-moz-border-radius-bottomright:3px;
-moz-border-radius-topleft:0px;
-moz-border-radius-topright:0px; 
-webkit-border-bottom-left-radius:3px;
-webkit-border-bottom-right-radius:3px;
-webkit-border-top-left-radius:0px;
-webkit-border-top-right-radius:0px;
float:left;
width:auto;
padding:0 0.8em;
height:25px;
text-align:center;
line-height:24px;
color:#FFFFFF;
font-size:1.2em;
font-weight:bold;
letter-spacing:0;
margin:0 2px;
border:1px solid #333;
border-top:none;
text-shadow: rgba(255, 255, 255, 0.2) 0px -1px 0;
}

.help_menu a:hover{
color:#333;
background-color:#969696;
}

.help_menu a.clean{
font-size:1em;
font-weight:normal;
text-align:left;
margin:0 0 0 0px;
text-shadow:none;
border:none;
color:#333 !important;
background:none;
width:auto;
}
/**
* Custom list button styles
*/

.time
{
	background:url(../images/time.png) 2px center no-repeat;
	padding:0 6px 0 19px;
	border-left: 3px solid #fff;
}

td.time
{
	background:#F1F1F1 url(../images/time_start.png) no-repeat scroll 12px center !important;
}

.timeStop
{
	background:url(../images/time_stop.png) 2px center no-repeat;
	padding:0 6px 0 19px;
	border-left:3px solid #ffbcbc;
}

.timeStart
{
	background:url(../images/time_start.png) 2px center no-repeat;
	padding:0 6px 0 19px;
	border-left:3px solid #e1f3bb;
}

/**
* New Project css*/
.new_project
{
	position:relative;
	float:left;
	margin-top:1.7em;
}

.new_project form
{
	margin-bottom:0;
}

.new_project fieldset
{
	background:none;
	border:none;
	margin:0;
}

/**
* Project List css*/
.project_list fieldset
{
	margin:0;
}

.project_list ul
{
	margin-left:0;
}

.project_list ul li
{
	list-style:none;
	list-style-position:outside;
}

.project_count
{
	position:absolute;
	right:0;
	top:20px;
}

/**
* Edit Track form*/
.edit
{
	font-size:1.2em;
}

/**
* Form Styles*/
fieldset
{
	background:none;
	border:none;
	float:left;
	clear:left;
	width:auto;
}

fieldset legend
{
	background-color:#F1F1F1;
	border:1px solid #575757;
	color:#575757;
	font-size:1.2em;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	margin:26px 0 0;
	padding:5px 7px;
}

label
{
	padding-right:25px;
	text-align:left;
}

textarea{
line-height:1.4em;
min-height:75px;
}

input.formButton,a.formButton
{
	color:#7DCEFF;
	border:1px solid #333;
	background:url(../images/arrow_next.png) left center #575757 no-repeat;
	background-position:2px center;
	cursor:pointer;
	font-weight:700;
	text-decoration:none;
	padding:5px 7px 5px 17px;
}

input.cleanButton
{
	border:none;
	border-bottom:1px solid #63A6CF;
	color:#63A6CF;
	background:none;
	cursor:pointer;
	font-weight:700;
	padding:0;
	margin:5px 7px 5px 17px;
}

input.delete
{
	background:transparent url(../images/action_delete.png) center center no-repeat;
	text-indent:-9999px;
	border:none;
	color:#fefefe;
	padding:0 2px;
	width:10px;
}

input.add,a.add
{
	background:url(../images/action_add.png) left center #575757 no-repeat;
	background-position:2px center;
}

input.time
{
	background:url(../images/time.png) left center #575757 no-repeat;
	background-position:2px center;
}

input.invoice,a.invoice
{
	background:url(../images/invoice.png) left center #575757 no-repeat;
	background-position:2px center;
}

input.popupMini
{
	background:url(../images/application.png) left center #575757 no-repeat;
	background-position:2px center;
}

input.timeStop
{
	background:url(../images/time_stop.png) left center #575757 no-repeat;
	background-position:2px center;
	font-size:1.5em;
	padding:0.3em 0.5em 0.3em 1em;
}

input.timeStart
{
	background:url(../images/time_start.png) left center #575757 no-repeat;
	background-position:2px center;
	font-size:1.5em;
	padding:0.3em 0.5em 0.3em 1em;
}

input.write
{
	background:url(../images/file.png) left center transparent no-repeat;
	background-position:2px center;
	padding-left:17px;
}

.formButton:hover
{
	background-color:#969696;
	
}

/**
* Clock Styles for inside the mini tracker
*/
#clock{
font-size:1.5em;
font-weight:bold;
}

/**
* Dashboard
*/
#dashboard{
position:relative;
margin:0 auto;
width:91%

}

#dashboard p{
margin-bottom:0.6em;
}

#dashboard p + p{
margin-top:-0.3em;
}

#dashboard .basic-border{
position:relative;
border:1px solid #dfdfdf;
color:#3f3f3f;
float:left;
margin:1em;
padding:1em 1em 0;
width:200px;
background-color:#C8D7DC;
font-weight:bold;
font-size:1.2em;
	-moz-border-radius:3px;
	-moz-border-radius-topleft:1em;
	-webkit-border-radius:3px;
	-webket-border-top-left-radius:1em;

}

/**
* Table styles*/
#timeLog
{
	border-right:1px solid #969696;
	border-top:1px solid #969696;
	width:100%;
	border-collapse:collapse;
	background-color:#fff;
	float:left;
	margin:0 auto 1em;
	padding:0;
}

#timeLog thead th
{
	border-bottom:1px solid #969696;
	border-left:1px solid #969696;
	background:#f4f9fe url(../images/table_bg.png) no-repeat;
	text-align:center;
	font:bold 1.2em/2em Verdana,Arial,Helvetica,sans-serif;
	color:#333;
	padding:.3em 1em;
}

#timeLog td
{
	border-bottom:1px solid #969696;
	border-left:1px solid #969696;
	text-align:center;
	padding:.3em 1em;
}

#timeLog tr.odd td
{
	background:#f1f1f1;
}

#timeLog tr.grp_shw th
{
	border-bottom:1px solid #969696;
	border-top:1px solid #969696;
	border-left:1px solid #969696;
}

#timeLog tr.grp_no th
{
	border-left:1px solid #dedede;
}

.help,.help_menu
{
	position:absolute;
	right:0;
	top:0;
}

.help a, .help_menu a
{
	text-decoration:none !important;
}

.help img, .help_menu img
{
	vertical-align:top;
}

/**
* Login Form*/
.login legend
{
	display:none;
}

#loginForm
{
	font-size:1em;
	margin-top:0.5em;
}

#loginForm input
{
	margin-bottom:0.5em;
}

#loginForm input.formButton
{
	float:right;
	margin:0.5em 0 0 -100px;
}

.login #status
{
	bottom:30%;
	left:300px;
	position:absolute;
}

/*
  * Client/Project Tabs: The tabbed navigation for the client list and project list
  */
ul.options_nav
{
	position:relative;
	float:left;
	width:100%;
	font-size:12px;
	margin:0 0 1em;
}

.options_nav li
{
	position:relative;
	display:block;
	float:left;
	text-align:center;
	margin:0 0.8em 0 1.2em;
}

/*
 * Client/Project Tabs:{navigation backgrounds}
 */
.options_nav li a
{
	position:relative;
	color:#575757;
	display:block;
	float:left;
	line-height:30px;
	text-align:center;
	width:100px;
	font-size:1.2em;
	text-decoration:none;
	background-color:#fff;
	border:1px solid #e9e9e9;
	padding:0;
}

.options_nav li.current a
{
	color:#272727;
}

.options_nav li a:hover
{
	color:#272727;
	border:none;
	cursor:pointer;
}

.options_nav li.current a,.options_nav li a:hover
{
	background-color:#F1F1F1;
	border:1px solid #575757;
}

/*
  * PRODUCT OPTIONS:{Tab Containers}
  */
.options_container
{
	position:relative;
	float:left;
	width:100%;
	font-size:12px;
}

.options_container .option
{
	position:relative;
	width:100%;
	display:none;
}

/**
* Status Styles*/
.status_green
{
	color:#fff;
	background-color:#4BC65F;
	border:green 1px solid;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	padding:1em;
}

.status_red
{
	color:#e5e5e5;
	background-color:#DF7E7E;
	border:#990000 1px solid;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	padding:1em;
}

/**
* Client button*/
.assignClient
{

}

.project_list ul li a,.options_container .option.current
{
	display:block;
}

.edit label,#loginForm label
{
	display:block;
	float:left;
	text-align:right;
	width:80px;
	padding:0.1em 5px 0 0;
}

fieldset legend span,input.formButton:focus
{
	font-weight:700;
}

/**
* iPhone styles
*/

html.iphone{
background:#CCCCCC;
}

.iphone a,.iphone body{
color:#000000;
}

.iphone body{
background:#CCCCCC

}

.iphone #container{
background-color:#fff;
margin:0;
min-height:350px;
padding:1em 0 0;
position:relative;
text-align:left;
top:0;
width:100%;
}

.iphone .content{
padding:0 0 0 3em;
}

.iphone li a{
margin-left:0px;
}
.iphone .time{
padding:8px 32px 8px 21px;
}
.iphone .timeStart{
padding:8px 32px 8px 21px;
}

/**
* Tooltip styles
*/
#tooltip{
position: absolute;
z-index: 3000;
border: 1px solid #111;
-moz-border-radius:3px;
-webkit-border-radius:3px;
background:#000000;
color:#FFFFFF;
font-size:12px;
padding:1em;
opacity: .85; filter: alpha(opacity=85); -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=85)';
max-width:200px;
}

/**
* Layout 2 Theme
* Olive Green
*/
body.layout-2
{
	background:#fefefe url(../images/bg_layout2.png) 0 -80px repeat-x;
}

.layout-2 a:link
{
	color:#8FA174;
}

.layout-2 a:visited
{
	color:#A1AF3F;
}

.layout-2 a:hover
{
	color:#6DA121;
}

.layout-2 input.formButton,.layout-2 a.formButton
{
	color:#CEEFAC;

}

.layout-2 input.cleanButton
{
	color:#8FA174;
}

.layout-2 #timeLog thead th
{
	
	background:#c5d9a2 url(../images/table_bg2.png) no-repeat;
	color:#333;
}

.layout-2 .help_menu{


}

.layout-2 .help_menu a{
background-color:#555555;
border:1px solid #8EAD7A;
border-top:1px solid #6d706d;
color:#8FA174;
}
.layout-2 .help_menu a:hover{
color:#fff;
}
.layout-2 .help_menu a.clean{
background:none;
border:none;
}

.layout-2 .project_count
{
	top:20px;
}

.layout-2 #dashboard .basic-border{
text-shadow: rgba(255, 255, 255, 0.2) 0px -2px 0;
border-color:#788E52;
background-color:#96AA74;

}

/**
* Layout 3 Theme
* Bluish Grey
*/
body.layout-3
{
	background:#fefefe url(../images/bg_layout3.png) 0 -80px repeat-x;
}

.layout-3 h1{
color:#E9E9E9;
margin:1em 0 0.5em;
}

.layout-3 a:link
{
	color:#4b555b;
}

.layout-3 a:visited
{
	color:#55595b;
}

.layout-3 a:hover
{
	color:#5d7581;
}

.layout-3 input.formButton,.layout-3 a.formButton
{
	color:#b2bbc4;

}

.layout-3 input.cleanButton
{
	color:#4b555b;
}

.layout-3 #timeLog thead th
{
	
	background:#2a3338 url(../images/table_bg3.png) no-repeat;
	color:#ddd;
}

.layout-3 .help_menu{

}

.layout-3 .help_menu a{

background-color:#ccc;
border:1px solid #485258;
}

.layout-3 .help_menu a:hover{
color:#fff;
}
.layout-3 .help_menu a.clean{
background:none;
border:none;
}
.layout-3 .project_count
{
	top:12px;
}

.layout-3 #dashboard .basic-border{
color:#F9F9F9;
border-color:#404B51;
background-color:#585C5E;
text-shadow: rgba(0, 0, 0, 0.2) 0px -2px 0;
}


/**
* Safari Quick fixes
*/
.safari .menu a.formButton{
padding:5px 7px 5px 19px;
}


/**
delete these
*/

.demo{
border:1px solid #888; color:#fff; padding:1em; width:145px; top:44px; right:0; position:absolute; background-color:#666666; -moz-border-radius-bottomleft:3px;
-moz-border-radius-bottomright:0px;
-moz-border-radius-topleft:3px;
-moz-border-radius-topright:0px; 
-webkit-border-bottom-left-radius:3px;
-webkit-border-bottom-right-radius:0px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:0px; opacity: .75; filter: alpha(opacity=75); -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=75)';
}

.safari .demo{
top:39px;
}