@import url("http://fonts.googleapis.com/css?family=Open+Sans:100,400,300,600,700,800");
* {
font-family: 'Open Sans', sans-serif;
}

body {
width:100%;
height:100%;
margin:0;
padding:0;
min-width:1075px;
background:#f5f7f8 url(../images/bg-mainbody.gif) repeat;
}


#header {
	height:40px;
display:block;
width:100%;
background-image:url(../images/bg-header.gif);
	font-weight:700;
color:#FFFFFF;
}

#header #title {
	line-height:40px;
	margin-left:20px;
font-size:25px;
float:left;
text-shadow: 0px 1px 1px #000;
color:#FFFFFF;
text-decoration:none;
}
#header #title:hover {
color:#e6f2f9;
}

#header #phone {
	line-height:40px;
	margin-right:30px;
font-size:20px;
float:right;
	font-weight:400;
text-shadow: 0px 1px 1px #000;
}





#navbar {
height:45px;
width:100%;
display:block;
text-align:left;
background-image:url(../images/bg-navbar.gif);
float:left;
display: flex;
}

#navbar #menu {
display:inline-block;
width:45px;
line-height:40px;
background:url(../images/icon-menu.png) no-repeat center center;
height:45px;
float:left;
text-align:center;
}

#navbar a {
color:#FFFFFF;
text-decoration:none;
font-size:20px;
font-weight:400;
text-shadow:0px 1px 1px #000;
line-height:40px;
padding-left:20px;
padding-right:20px;
display:inline-block;
}

#navbar a:hover {
text-decoration:underline;
color:#e6f2f9;
}








#mainbody {
width:99%;
float:left;
display:block;
clear:both;
display: flex;
}

#mainbody #subnavbox {
max-width:195px;
min-height: 86vh;
float:left;
display:block;
width: 200px;
}

#mainbody #subnav {
width:195px;
margin:0 15px 0 0;
padding:0;
float:left;
display:block;
border-right:1px solid #3a4245;
background:#4f585b url(../images/bg-subnav.gif) repeat;

}

#mainbody #subnav a {
color:#FFFFFF;
text-decoration:none;
font-size:14px;
display:block;
width:174px;
height:40px;
line-height:40px;
border-bottom:1px solid #38454e;
border-top:1px solid #79868f;
padding-left:20px;
}

#mainbody #subnav a:hover {
text-decoration:underline;
color:#e6f2f9;
background:#4f585b url(../images/bg-subnav-on.gif) repeat;
}

#mainbody #content {
margin:4px;
min-width:1000px;
}
#q {
width:250px;
height:16px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid #c9c9c9;
background-color:#fff;
padding-left:5px;
}

#actionButtons {
float:right;
margin-left:2px;
cursor: pointer;
cursor: hand;
}
#actionButtons #search {
font-weight:100;
text-align:right;
float:left;
margin-left:2px;
display:inline-block;
margin-right:6px;
}
#actionButtons #search input[type="text"] {
height:30px;
font-size:14px;
font-weight:400;
padding:3px 13px;
}

.buttoncell {
padding:15px;
background-color:#e9e9e9;
}

#content #title {
font-weight:700;
font-size:24px;
color:#4f585b;
margin-left:10px;
display:inline-block;
margin-right:25px;
}

#datatable {
margin-top:8px;
width:100%;
height:100%;
margin-left:10px;
display:block;
border-bottom:1px solid #c9c9c9;
}

#datatablebox {
flex-grow: 50;
max-width:1500px;
}

#datatable td {
padding:3px;
font-size:13px;
background-color:#ffffff;
color:#2f373b;
line-height:25px;
}
#datatable td a {
color:#2f373b;
text-decoration:none;
font-weight:700;
}
#datatable td a:hover {
text-decoration:underline;
color:#9c4109;
}
#datatable tr:nth-child(odd) td {
background-color:#dfeaed;
}


#datatable td {
border-top:1px solid #c9c9c9;
border-left:1px solid #c9c9c9;
}

#datatable td:last-child {
border-right:1px solid #c9c9c9;
}



#datatable #titles td {
font-weight:600;
text-align:center;
}
#datatable .sort {
background:#FFF url(../images/icon-sort.png) no-repeat right center;
}
#datatable .sort-up {
background:#fff8f0 url(../images/icon-sort-up.png) no-repeat right center;
}
#datatable .sort-down {
background:#fff8f0 url(../images/icon-sort-down.png) no-repeat right center;
}
#datatable .sort, #datatable .sort-up, #datatable .sort-down {
cursor: pointer;
cursor: hand;
}
#datatable .sort:hover, #datatable .sort-up:hover, #datatable .sort-down:hover {
color:#9c4109;
}
#datatable #titles td:nth-child(2) {
width:25px;
}

#datatable #entries {
font-weight:100;
text-align:left;
}
.editable input[type="text"] {
height:26px;
font-size:14px;
font-weight:400;
padding:3px 6px;
width:90%;
}
.editable textarea {
height:80px;
width:97%;
font-size:14px;
font-weight:400;
padding:3px 6px;
}

#search {
font-weight:100;
text-align:right;
font-size:14px;
}

#datatable #filters td {
font-weight:300;
background-color:#e9e9e9;
}


#datatable tr:last-child td {
background-color:#e9e9e9;
}


#pagesinfo {
float:left;
line-height:25px;
}
#pages {
float:right;
}

#pages div {
	min-width:15px;
display:inline-block;
background-color:#ffffff;
border:1px solid #c9c9c9;
font-size:11px;
height:25px;
line-height:25px;
text-align:center;
padding-right:5px;
padding-left:5px;
-moz-border-radius: 10px;
border-radius: 10px;
font-weight:400;
color:#6e6e6e;
margin-left:0;
}
#pages div:hover {
color:#000;
background-color:#fff0df;
cursor: pointer;
cursor: hand;
}



.delete div {
background:url(../images/icon-delete.png) left center;
width:25px;
height:25px;
display:block;
overflow:hidden;
cursor: pointer;
cursor: hand;
}
.delete div:hover {
background:url(../images/icon-delete.png) right center;
width:25px;
height:25px;
display:block;
overflow:hidden;
}


.checkall span {
display:block;
background:url(../images/icon-check-all.png) no-repeat left center;
width:25px;
height:25px;
margin:auto;
cursor: pointer;
cursor: hand;
}
.checkall span:hover {
background:url(../images/icon-check-all.png) no-repeat right center;
}
.complete span, .incomplete span, .completed span {
display:block;
width:15px;
height:15px;
margin:auto;
cursor: pointer;
cursor: hand;
}
.completed span {
background:url(../images/icon-complete.png) no-repeat left center;
}
.complete span {
background:url(../images/icon-complete.png) no-repeat center center;
}
.incomplete span {
background:url(../images/icon-complete.png) no-repeat right center;
}

#copyright {
text-align:center;
font-size:12px;
width:100%;
display:block;
margin-top:25px;
margin-bottom:25px;
color:#4f585b;
}

#copyright a {
font-size:12px;
color:#4f585b;
text-decoration:none;
}

#copyright a:hover {
text-decoration:underline;
}