body{font-family:"Arial", sans-serif;}
li.node ul {top: 25px;}
.module-table-body tr.odd th, .module-table-body tr.odd td { border-right: 1px solid #ddd; }
.module-table-body tr.even th, .module-table-body tr.even td { border-right: 1px solid #ccc; }

.module-table-body tr.row-total td { border-top: 1px solid #ccc; }
.module-table-body tr.row-total td.total { border-left: 1px solid #ccc; border-right: 1px solid #ccc; }

.sf_admin_filter tfoot th, td {
    border: 0px;
}


/* ------------------ DO NOT TOUCH AFTER THIS LINE ----------

Instead, put all your "app-specific" css rules at the top of this file. 
 
@TODO: move app-specific css rules to another file.          */

.parent-header div.header-row {
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 10px;
}

.parent-header div label {
    font-weight: normal;
    padding-right: 10px;
}

/* -------------------- Basic HTML tags -------------------- */


a:focus {
    outline: 1px dotted invert;
}

hr {
    border: 1px solid #ccc;
    clear: both;
    height: 0;
}

h1 {
    font-size: 30px;
    letter-spacing: -1.5px;
}

h2 {
    font-size: 24px;
    letter-spacing: -1px;
}

h3 {
    font-size: 18px;
}

h4 {
    font-size: 14px;
}

h5 {
    font-size: 12px;
}

h6 {
    font-size: 10px;
}

ol {
    list-style: decimal;
    list-style-position: inside;
}

ul.bullets {
    list-style: disc;
    list-style-position: inside;
}

ul.bullets li {
    margin-left: 20px;
    margin-bottom: 5px;
}

p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset {
    margin-bottom: 15px;
}

a,a:visited {
    color: #0063be;
    text-decoration: none;
}

a:hover,a:active {
    text-decoration: underline;
}

h1 a,h1 a:visited,h2 a,h2 a:visited,h3 a,h3 a:visited,h4 a,h4 a:visited,h5 a,h5 a:visited,h6 a,h6 a:visited
    {
    color: #444444;
}

h1 a:hover,h1 a:active,h2 a:hover,h2 a:active,h3 a:hover,h3 a:active,h4 a:hover,h4 a:active,h5 a:hover,h5 a:active,h6 a:hover,h6 a:active
    {
    color: #0063be;
}

/* --------------------  Custom general classes -------------------- */
.align-left {
    text-align: left;
}

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

.align-center {
    text-align: center;
}

.align-justify {
    text-align: justify;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.bottom-spacing {
    margin-bottom: 20px;
}

/* -------------------- Page elements -------------------- */
#text-invitation {
    display: block;
    padding: 9px 0 11px 0;
    text-align: center;
}

#message-notification {
    display: block;
    float: left;
    background: url(../images/mail-q-bg.jpg) top left no-repeat;
    color: #6dc6e7;
    padding: 9px 0 11px 0;
    text-decoration: none;
    margin-left: 10px;
}

#message-notification span {
    color: #444444;
    margin-right: 15px;
    text-align: center;
    display: block;
    float: left;
    width: 32px;
}

#message-notification a:hover,#message-notification a:active {
    color: #ffffff;
}

a#logout,a#logout :visited {
    display: block;
    float: right;
    background: url(../images/icon-logout.gif) center right no-repeat;
    color: #6dc6e7;
    padding: 9px 20px 11px 0px;
    text-decoration: none;
}

a#logout :hover,a#logout :active {
    color: #ffffff;
}


#logoimg {
    position: absolute;
    top: 14px;
    left: 90px;
}

#subnav {
    background: #ffffff url(../images/submenu-bg.gif) repeat-x bottom left;
    height: 48px;
}

#subnav ul {
  list-style: none;
	height:40px;
	border-right:solid #CCC 2px;
	border-left:solid #CCC 2px;
	border-bottom:solid #CCC 2px;
	text-align:center;
}

#subnav ul li {
    float: left;
    margin: 1px 10px 0 0;
    padding: 0px 10px 0 0;
	padding-left:6px;
    list-style-image: none;
    list-style-type: none;
    border-right: 1px solid #2eaf5f;
	
}


#subnav ul li.current {
    font-weight: bold;
}

#subnav ul a,#subnav ul a:visited {
    display: block;
    float: left;
    color: #0063be;
    font-size: 14px;
    padding: 9px 0 0 0;
    text-decoration: none;
}

#subnav ul a:hover,#subnav ul a:active {
    text-decoration: underline;
}

#subnav ul a.current{
	background-color:#C33;
}

.filter_link li{
	list-style:none;
	list-style-image:none;
	display:inline;
}

.sf_admin_filter {
    float: left;
    padding-right: 20px;
}



/* -------------------- Nav tabs (sliding door technique) -------------------- */
ul#nav {
    float: left;
    margin-top: 24px;
    list-style: none;
    font-size: 14px;
    margin-bottom: 0;
}

ul#nav li {
    background: transparent url(../images/themes/blue/tab-left.gif)
        no-repeat scroll left top;
    float: left;
    margin: 0 5px 0 0;
    padding: 0 0 0 9px;
}

ul#nav li a,ul#nav li a:visited {
    background: transparent url(../images/themes/blue/tab-right.gif)
        no-repeat scroll right top;
    color: #FFFFFF;
    display: block;
    float: left;
    padding: 7px 15px 6px 6px;
    text-decoration: none;
}

ul#nav li a:hover {
    padding: 8px 15px 5px 6px;
}


ul#nav li#current {
    /* give the id="current" to the currently selected tab */
    background: transparent url(../images/themes/blue/tab-active-left.gif)
        no-repeat scroll left top;
}

ul#nav li#current a {
    background: transparent url(../images/themes/blue/tab-active-right.gif)
        no-repeat scroll right top;
    color: #444444;
}

/* -------------------- Box module -------------------- */
div.module {
    background: url('../images/module-body-left-bg.gif') no-repeat scroll bottom left;
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.module-body ul {
    list-style-image:none;
    list-style-position:outside;
    list-style-type:circle;
    padding-left: 6px;
	padding-top: 8px;
}

div.module div.module-body, div.module-login div.module-body {
    background: url('../images/module-body-right-bg.gif') no-repeat scroll
        bottom right;
    padding: 10px 3% 10px 3%;
    float: left;
    width: 94%;
}
div.module div.module-body table{
	border:none;
}

div.module-login {
    background: url('../images/module-body-left-bg.gif') no-repeat scroll bottom left;
    float: left;
    width: 580px;
    margin-bottom: 20px;
}

/* Percentage padding in the module dependant on the cell width */
.grid_1 div.module div.module-body {
    padding: 20px 8% 20px 8%;
    float: left;
    width: 84%;
}

.grid_2 div.module div.module-body {
    padding: 20px 7% 20px 7%;
    float: left;
    width: 86%;
}

.grid_3 div.module div.module-body {
    padding: 20px 6% 20px 6%;
    float: left;
    width: 88%;
}

.grid_4 div.module div.module-body {
    padding: 20px 5% 20px 5%;
    float: left;
    width: 90%;
}

.grid_5 div.module div.module-body {
    padding: 20px 4% 20px 4%;
    float: left;
    width: 92%;
}

.grid_6 div.module div.module-body {
    padding: 20px 3% 20px 3%;
    float: left;
    width: 94%;
}

.grid_7 div.module div.module-body {
    padding: 20px 2.75% 20px 2.75%;
    float: left;
    width: 94.5%;
}

.grid_8 div.module div.module-body {
    padding: 20px 2.5% 20px 2.5%;
    float: left;
    width: 95%;
}

.grid_9 div.module div.module-body {
    padding: 20px 2.25% 20px 2.25%;
    float: left;
    width: 95.5%;
}

.grid_10 div.module div.module-body {
    padding: 20px 2% 20px 2%;
    float: left;
    width: 96%;
}

.grid_11 div.module div.module-body {
    padding: 20px 1.75% 20px 1.75%;
    float: left;
    width: 96.5%;
}

.grid_12 div.module div.module-body {
    padding: 10px 1.5% 10px 1.5%;
    float: left;
    width: 97%;
}


div.module div.module-table-body {
    background: url('../images/module-body-right-bg.gif') no-repeat scroll
        bottom right;
    padding: 0;
    float: left;
    width: 100%;
}

div.module h2, div.module-login h2 { /* Sliding right image */
    background: url('../images/module-header-left-bg.gif') no-repeat scroll
        top left;
    display: block;
    float: left;
    height: 32px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
    margin: 0px;
    padding-right: 0px;
    /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
    /* FONT PROPERTIES */
    text-decoration: none;
    color: #444444;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    width: 100%;
    letter-spacing: normal
}

div.module h2 span, div.module-login h2 span { /* Background left image */
    background: url('../images/module-header-right-bg.gif') no-repeat top
        right;
    display: block;
    line-height: 20px;
    /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
    padding: 7px 0 5px 18px;
}

div.module table {
    width: 100%;
    margin: 0;
    border-left: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	/*display:inline-block;*/
}

div.module table.tr {
    border-collapse: separate;
    border-right: 1px solid #aaaaaa;
    border-left: 1px solid #aaaaaa;
}

div.module table th {
    background-color: #eeeeee;
    color: #444444;
    padding: 5px;
    text-align: left;
	border:1px solid #d9d9d9;

}

div.module table td {

    padding: 5px;
}



.table-apply {
    width: 50%;
    float: right;
    text-align: right;
    margin-right: 10px;
}

/* -------------------- Pager -------------------- */
.pager {
    display: block;
    padding: 0px 10px 10px 10px;
    width: 40%;
    float: left;
}

.pager .first,.pager .prev,.pager .next,.pager .last {
    margin-bottom: -2px;
}

/* -------------------- Button (sliding door technique) -------------------- */
/* button inside a module box */
a.button {
    background: transparent url(../images/button-right-bg.gif) no-repeat
        scroll top right;
    display: block;
    float: left;
    height: 26px; 
	text-decoration: none;
    color: #444444;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
	border:0;
    margin:0 5px 0 0;
	padding:0 11px 0 0;
}

a.button span {
    background: transparent url(../images/button-left-bg.gif) no-repeat top
        left;
    display: block;
    line-height: 15px;
    padding: 4px 0 7px 10px;
}


/* -------------------- Pagination -------------------- */
.pagination {
    margin-bottom: 20px;
    float: right;
}

.pagination a.button {
    margin-right: 10px;
}

.pagination a.last {
    margin-right: 0;
}

.pagination .numbers {
    float: left;
    padding-top: 3px;
    margin-right: 15px;
}

.pagination .numbers span {
    padding: 0 5px 0 5px;
}

.pagination .current {
    font-weight: bold;
}

/* -------------------- Forms -------------------- */


#sf_admin_content .radio_list li, #sf_admin_content .checkbox_list li {
    display:block;
}

#sf_admin_content ul label, #sf_admin_content td label {
    display: inline;
    float: none !important;
}

#sf_admin_content .sf_admin_form_row .content
{
  padding-left: 160px;
}


#sf_admin_content .sf_admin_form_row label, .login label {
    width: 150px;
    text-align: right;
    padding-right: 10px;
    float: left;
}

#sf_admin_content .sf_admin_form_row, .login div{
    clear: both;
}
.login div{padding:0 1em; margin-bottom:15px;}
.form-in-list .sf_admin_form_row, .form-in-list .sf_admin_form_row div {
    display:inline;
}

.form-in-list .sf_admin_form_row div label {
    padding: 10px;
    padding-right: 2px;
} 

#sf_admin_content fieldset {
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 10px;
    border: 1px solid #ddd;
}

#sf_admin_content fieldset legend {
    border: 1px solid #ddd;
}

legend {
    margin-bottom: 10px;
    display: block;
}

label {
    /*display: block;*/
    margin-bottom: 5px;
}

.input-short,.input-medium,.input-long {
    padding: 3px;
}

select {
    padding: 2px;
}

textarea {
    padding: 3px;
}

.input-short {
    width: 25%;
}

.input-medium {
    width: 50%;
}

select.input-medium, input[type="checkbox"].input-medium {
    width: auto;
}

.input-long {
    width: 75%;
}

input.input-short,input.input-medium,input.input-long,select,textarea {
    background: url(../images/input-bg.gif) top left repeat-x #f6f6f6;
    border: 0;
    border: 1px solid #cccccc;
}

input.input-short:focus,input.input-medium:focus,input.input-long:focus,select:focus,textarea:focus
    {
    background: url(../images/input-bg-focus.gif) top left repeat-x #ffffff;
    border-color: #a9c2d1;
}

input.submit-green {
    background: url(../images/submit-green-bg.gif) top left repeat-x;
    border: 0;
    border: 1px solid #017698;
    color: #000;
    font-size: 14px;
    padding: 2px 12px;
    margin: 0px 10px 0 0;
    cursor: pointer;
}

input.submit-green-hover {
    background-image: url(../images/submit-green-bg-hover.gif);
}

input.submit-gray {
    background: url(../images/submit-gray-bg.gif) top left repeat-x;
    border: 0;
    border-top: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #888888;
    border-bottom: 1px solid #888888;
    color: #ffffff;
    font-size: 14px;
    padding: 2px 12px;
    margin: 0px 10px 0 0;
    cursor: pointer;
}

input.submit-gray-hover {
    background-image: url(../images/submit-gray-bg-hover.gif);
}

/* -------------------- Text input and select input notifications -------------------- */
.notification-input {
    background: 10px 50% no-repeat;
    margin: 0 0 0 5px;
    padding: 5px 0 5px 32px;
    font-size: 12px;
}

.ni-correct {
    background-image: url(../images/tick-on-white.gif);
    color: #00ae42;
}

.ni-error {
    background-image: url(../images/cross-on-white.gif);
    color: #c9282d;
}
.error_list li{
	list-style-type:none;
	list-style-image:none;
	padding-left:5px;
	padding-bottom:10px;
	font-weight:bold;
}
.error_list{
    background-color: #ffc6ca;
    border-color: #efb9c3;
	width:325px;
	font-size:7pt;
}

/* --------------------  Boxed notifications -------------------- */
.notification {
    display: block;
    padding: 20px 20px 20px 45px;
    border: 1px solid;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-position: 20px 20px;
}

.n-success {
    background-color: #a3e6bd;
    border-color: #68d59b;
    background-image: url(../images/notification-tick.gif);
}

.n-information {
    background-color: #9fddea;
    border-color: #5fceea;
    background-image: url(../images/notification-information.gif);
}

.n-attention {
    background-color: #f9e497;
    border-color: #ffcb4f;
    background-image: url(../images/notification-exclamation.gif);
}

.n-error {
    background-color: #ffc6ca;
    border-color: #efb9c3;
    background-image: url(../images/notification-slash.gif);
}

/* -------------------- Indicators -------------------- */
.indicator {
    width: 220px;
    height: 12px;
    background: url(../images/indicator-bg.gif) no-repeat top left;
}

.indicator div {
    height: 12px;
    background: url(../images/indicator-green-to-red.gif) no-repeat top left
        ;
}

.indicator div.reverse {
    background: url(../images/indicator-red-to-green.gif) no-repeat top left
        ;
}

/* -------------------- Category list -------------------- */
a.removable,a.removable:visited {
    padding: 5px 18px 5px 0px;
}

a.removable:hover,a.removable:active {
    background: url(../images/cross-small.gif) no-repeat center right;
}

/* -------------------- To-do list -------------------- */
a.checkable,a.checkable:visited {
    padding: 5px 18px 5px 0px;
}

a.checkable:hover,a.checkable:active {
    background: url(../images/tick-small.gif) no-repeat center right;
}

a.completed,a.completed:visited {
    color: #aaaaaa;
}

/* -------------------- Messages -------------------- */
.separated {
    border-top: 1px solid #cccccc;
    padding-top: 15px;
}

.user {
    display: block;
    padding-left: 22px;
    background: url(../images/user.gif) left 50% no-repeat;
    font-size: 14px;
    color: #666666;
    font-weight: normal;
}

.user-female {
    display: block;
    padding-left: 22px;
    background: url(../images/user-female.gif) left 50% no-repeat;
    font-size: 14px;
    color: #666666;
    font-weight: normal;
}

.reply {
    padding-left: 20px;
    background: url(../images/arrow-curve-180-left.gif) left 50% no-repeat;
    margin-right: 7px;
}

.forward {
    padding-left: 20px;
    background: url(../images/arrow-curve-000-left.gif) left 50% no-repeat;
    margin-right: 7px;
}

a.delete,a.delete:visited {
    padding-left: 16px;
    background: url(../images/bin.gif) left 50% no-repeat;
    color: #C00;
	margin-left:5px;
}

h3.mail {
    display: block;
    padding: 20px 0px 20px 70px;
    background: url(../images/Crystal_Project_mail_open.gif) left 50%
        no-repeat;
}

#p-messages {
    padding: 20px;
}

/* -------------------- Login page -------------------- */
form.login {
    background: url(../images/Crystal_Clear_locked.gif) 87% 10px no-repeat;
    width:500px;
    margin:0px;
    border:0;
}

/* -------------------- Dashboard -------------------- */
a.dashboard-module,a.dashboard-module:visited {
    width: 142px;
    height: 142px;
    display: block;
    float: left;
    background: url(../images/dashboard-module.gif) top left no-repeat;
    margin: 0 8px 8px 0;
    text-align: center;
    color: #444444;
}

a.dashboard-module:hover,a.dashboard-module:active {
    background-position: bottom left;
    text-decoration: none;
    color: #0063be;
}

a.dashboard-module img {
    margin-top: 20px;
}

a.dashboard-module span {
    margin-top: 10px;
    display: block;
}

img.picto {
    vertical-align:bottom;
    padding:3px;
}

tr.row-total {
    font-weight: bold;
}

i.small {
    font-size: 0.8em;
}
#login_button {
	margin-left: 160px;
}

/* -------------------------- Error 404 ------------- */
.oops{
	font-size:18pt;
}
 
 body #sf_admin_menu {
background-color:#99c3e6;
border-bottom:1px solid #005195;
padding:0 60px;
}

.sf_admin_batch_actions_choice select{margin-bottom:10px; margin-top:10px; padding-left:5px;}
.logo{padding-left:10px;}

/* -------------------- Tabs -------------------- */

ul#nav li {
	background:transparent url(../images/themes/green/tab-left.gif) no-repeat scroll left top;
	float:left;
	margin:0 5px 0 0;
	padding:0 0 0 9px;
        list-style-type:none;
    }

ul#nav li a, ul#nav li a:visited {
	background:transparent url(../images/themes/green/tab-right.gif) no-repeat scroll right top;
	color:#FFFFFF;
	display:block;
	float:left;
	padding:7px 15px 6px 6px;
	text-decoration:none;
	}
	
ul#nav li a:hover {
	color:#000;
	}
ul#nav li a:active {
	color:#444444;
}
	
ul#nav li.current { 
	background:transparent url(../images/themes/green/tab-active-left.gif) no-repeat scroll left top;
	}

ul#nav li.current a {
	background:transparent url(../images/themes/green/tab-active-right.gif) no-repeat scroll right top;
	color:#444444;
	}
    
/* -------------------- Table Sorter -------------------- */
table.tablesorter {
	width: 100%;
	text-align: left;
}
table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF;
	vertical-align: top;
}
table.tablesorter tbody tr.odd td {
	background-color:#f1f5fa;
}
table.tablesorter thead tr .headerSortasc {
	background-image: url(../images/tablesorter/asc.gif);
}
table.tablesorter thead tr .headerSortdesc {
	background-image: url(../images/tablesorter/desc.gif);
}
table.tablesorter thead tr .headerSortdesc, table.tablesorter thead tr .headerSortasc {
background-color: #dddddd;
}
table th.hidden { display: none; }
table td.hidden { display: none; }

/* ------------------- Footer ---------------------- */
#footer{border-top:1px solid #aaaaaa; margin-top:20px; padding-top:5px; padding-bottom:5px;}

/* ------------------- T�l�phone, Portable, Fax ---------------------- */
.telephone{background:url('../images/tel.png') no-repeat left center;}
.portable{background:url('../images/port.png') no-repeat left center;}
.fax{background:url('../images/fax.png') no-repeat left center;}
.telephone, .portable, .fax{padding-left:18px; margin-bottom:5px;}



/* ------ Col Selector ------ */
.colselector{
	float:right;
	margin-left:20px;
}
.colselector ul{
	width: 200px;
	position: absolute;
	background: #f1f1f1;
	right: 9px;
	margin-top: 0px;
	padding: 10px;
	border: 1px solid #ccc;
}
.colselector ul li{
	list-style:none;
}
.colselector ul li input{
	margin-right:10px;
}