*{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
html {
	height: 100%;
}
body {
	font-size:14px;
	color: #666;
	font-family: 'Century Gothic', 'Avant Garde', helvetica, sans-serif;
	padding:0;
	margin:0;
	height:100%;
	background: #F6F6F6;
}
a{
	color: #092e58;
}
html>body {
	min-height: 100%;
	height: auto;
}
p, li{
	font-size: 12px;
	line-height: 15px;
	margin: 0;
	padding: 0;
}
h1,h2,h4{
	color: #092e58;
	margin: 0;
	line-height: 15px;
	padding: 0;
}
h1{
	font-size: 16px; 
	color: #092e58;
}
h2{
	font-size: 16px;
	color: #092e58;
}
h3{
	color: #092e58;
	font-size: 20px;
	font-weight: 400;
	margin: 5px;
}
h4{
	font-size: 10px;
	font-weight: bolder;
}
h5 {
	margin: 10px 0;
	color: green;
	font-size: 18px;
	font-weight: normal;
}
hr{
	height: 10px;
	border: 1px solid #666;
	border-width: 0 0 1px 0;
}
.container {
	max-width: 1092e58px;
	min-width:600px;
	margin: 0 ;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	text-align: center;
	border: none;
}
#Header {
	position: fixed;
	left: 0; top: 0;
	padding: 0;
	background: white;
	width: 260px;
	height: 100vh;
	border-top: 5px solid #092e58;
	z-index: 100;
	box-shadow: 0px 0px 5px rgba(0,0,0,.3);
}
#Header .container{
	text-align: right;
	position: relative;
}
#Header #Logo {
	width: 100%; height: 60px;
	background: url(/layout/eastside-hire-warwick.png) no-repeat 50% 50%;
	background-size: 95% auto;
	margin: 0 20px 0 0;
	display: block;
}
#Header h1 {
	font-size:24px;
	line-height: 40px;
	margin: 0;
	color: #999;
	height: 60px;
}
#Header #admin {
	display: inline-block;
	text-align: right;
	height: 20px;
	color: #FFF;
	background: #EEE;
	text-decoration: none;
	border-radius: 5px;
	margin: 5px 0;
	padding: 3px 8px 0;
}
#Header #admin:hover {
	background: #AAA;
}
#Logout{
	float: right;
}
#Logout a{
	font-size: 16px;
	line-height: 25px;
	margin-top: 5px;
	background: #CCC;
	border-radius: 5px;
	padding: 0 20px;
	color: white;
}
#Logout a:hover{
	background-color: #092e58;
}
.menu {
	height: 35px;
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
}
.menu ul {
	list-style: none;
	text-align: center;
	margin: 0;
	padding: 0;
}
.menu li {
	list-style: none;
	display: block;
	border: 1px solid transparent;
	-moz-border-image: -moz-linear-gradient(#FFF,#EEE);
	-webkit-border-image: -webkit-linear-gradient(#FFF,#EEE);
	border-image: linear-gradient(#FFF,#EEE);
	border-image-slice: 1;
	border-width: 0 1px 0 0;
}
.menu a {
	text-decoration: none;
	font-size: 22px;
	font-weight: normal;
	text-align: left;
	height: 40px;
	line-height:40px;
	display: block;
	padding: 0 10px 0 53px;
	background-position: 20px 10px;
	background-size: 50px 20px;
	background-repeat: no-repeat;
}
.menu a:hover, .menu a.current{
	text-decoration: none;
	background-color: #092e58;
	color: #FFF;
	background-position: -5px 10px;
	opacity: 1;
}
.mOrders, .mShops, .mProducts, .mRecipes, .mPages, .mConfig{
}	
.mOrders{ background-image: url(images/quotes.png) }
.mCustomers{ background-image: url(images/customers.png) } 
.mShops{ background-image: url(images/locations.png) } 
.mProducts{ background-image: url(images/products.png) }
.mPages{ background-image: url(images/pages.png) }
.mConfig{ background-image: url(images/config.png) }
.submenu {
	position: fixed;
	top:0; left: 0;
	width: 100%;
	border-top: 5px solid #092e58;
	min-height: 40px;
	margin: 0;
	padding: 15px 20px 0 300px;
	text-align: center;
	display: block;
	border-bottom: 1px solid #EEE;
	background: rgba(255,255,255,1);
	box-shadow: 0px 0px 5px rgba(0,0,0,.3);
}
.submenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.submenu li {
	margin: 0;
	padding: 0;
	display: inline;
	float: left;
	border: 1px solid transparent;
	-moz-border-image: -moz-linear-gradient(#FFF,#EEE);
	-webkit-border-image: -webkit-linear-gradient(#FFF,#EEE);
	border-image: linear-gradient(#FFF,#EEE);
	border-image-slice: 1;
	border-width: 0 1px 0 0;
}
.submenu a {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #666;
	font-size: 18px;
	padding:0 10px;
	line-height: 35px;
}

.submenu a:hover, .submenu a.current{
	color: #FFF;
	text-decoration: none;
	background: #092e58;
}
.mainContent {
	min-height: 600px;
	padding: 85px 20px 100px 300px;
}
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
	display: none;
}
.CollapsiblePanelTab {
	margin: 0px auto; padding:3px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	line-height: 1.4em;
	background: #fff939;
	-moz-border-radius-topright:10px;
	-moz-border-radius-topleft:10px;
	-webkit-border-top-right-radius:10px;
	-webkit-border-top-left-radius:10px;
	font-size: 20px;
	color: #092e58;
	border: 1px solid #092e58;
}
.CollapsiblePanelContent {
	margin: 0px auto; padding: 10px 30px;
	background:white;
	border-top:none;
	-moz-border-radius-bottomright:10px;
	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
}
.CollapsiblePanelContent h2{
	padding-right: 10px;
}
.CollapsiblePanelContent h2{
	font-weight: normal;
	color: white;
}
.CollapsiblePanelTab a {
	color: white;
	text-decoration: none;
}
#sideMenu{
	width: 250px;
	background: #FFF;
	float: left;
	margin-right: 20px;
	text-align: left;
}
#sideMenu h2{
	cursor: pointer;
}
#sideMenu ul{
	cursor: pointer;
	list-style: none;
	padding: 0;
	margin: 0;
	display: none;
}
#sideMenu ul ul{
	display: block;
}
#sideMenu h2{
	padding: 10px 5px;
	border-bottom: 1px solid #CCC;
}
#sideMenu .subcat{
	padding: 2px 10px;
	background: #CCC;
	color: white;
	display: block;
}
#sideMenu li{
	padding: 0;
	border-bottom: 1px solid #CCC;
}
#sideMenu li.selected button{
	background: black;
	color: white;
}
#sideMenu ul.active{
	display: block;
}
#sideMenu li li:last-child{
	border-bottom: none;
}
#sideMenu li a{
	display: block;
	padding: 5px 0;
	border-bottom: 1px solid #CCC;
	text-decoration: none;
}
#sideMenu li a.current{
	background: #092e58;
	color: #CCC;
}
#sideMenu li a:hover{
	background: #CCC;
	color: #092e58;
}
#sideMenu form{
	margin: 0;
}
#sideMenu button{
	border: none;
	width: 100%;
	background: none;
	float: none;
	color: #092e58;
	text-transform: none;
	margin: 0;
	font-size: 12px;
	line-height: 15px;
	padding: 5px 0 5px 27px;
	text-align: left;
	border-radius: 0;
}
#sideMenu button:hover{
	background: black;
	color: white;
}
#sideMenu .sortable li{
	min-height: 20px;
}
.colMain{
	margin-left: 270px;
}
.mainContent table{
	text-align: left;
	padding: 0px;
}
.mainContent th{
	text-align: right;
	padding:2px 10px 2px 0;
	font-weight: normal;
	vertical-align: top;
	line-height: 20px;
}
.mainContent td{
	padding: 2px 4px 2px 0;
}
.mainContent td h2{
}
.mainContent .table{
	border: 1px solid #092e58;
	border-width: 1px 0 0 1px;
	background: #CCC;
}
.mainContent .table td{
	border: 1px solid #092e58;
	border-width: 0 1px 1px 0;
}
.CollapsiblePanelContent td{
	padding: 2px 10px 4px 0;
}
.mainContent .updated td{
	background: #e5f4d1;
}
.actionOnOff, .actionDel, .actionEdit{
	float: right;
}
.orderable .header{
	background: #092e58 url(/layout/sortable.png) 98% 50% no-repeat;
}
.orderable .headerSortUp{
	background: #092e58 url(/layout/sort_up.png) 98% 50% no-repeat;
}
.orderable .headerSortDown{
	background: #092e58 url(/layout/sort_down.png) 98% 50% no-repeat;
}
.orderby{display: none}
.sortable{
	margin: auto;
	padding: 0;
	width: 100%;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background: white;
}
.sortable li{
	list-style: none;
	min-height: 40px;
	clear: both;
}
.sortable li:nth-child(even){
	background: #F9f9f9;
}
li.sortable-placeholder {
	border: 1px dashed #CCC;
	background: none;
}
.sortable ul.sortable{
	background: none;
	border-bottom:1px solid #CCC;
}
.sortable ul.sortable li{
	background: none;
	border-top:1px solid #CCC;
	background-image: url(images/sub_menu.png);
	background-repeat: no-repeat;
	background-position: 20px 10px;
}
.sortable .prodimage{
	float: left;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	margin-right: 10px;
	overflow: hidden;
	display: inline-block;
	background: black;
}
.sortable h2, .sortable p{
	text-align: left;
	padding: 12px 10px 0;
	font-size: 14px;
}
.sortable p, .sortablex p {
	padding: 5px 10px 0;
}
.sortable .actionOnOff, .sortable .actionDel, .sortable .actionEdit{
	float: right;
	display: inline-block;
	text-align: right;
	margin: 5px;
}
.sortable .actionOnOff{
	width: 30px;
	margin-right: 3px;
}
.sortable .actionDel{
	width: 30px;
	margin-right: 3px;
}
.sortable .actionEdit{
	width: 30px;
	margin-right: 10px;
}
.sortable li li{
	padding-left: 30px; 
}
.list{
	background: white;
}
.list tr:nth-child(even) td{
	background: #F9f9f9;
}
.list tr:nth-child(even).updated td{
	background: #cee6b0;
}
.clone{
	font-size:11px;
	background: rgba(255,255,255,.2);
	position: relative;
}
.EditContButton, .AddContButton{
	display: block;
	padding: 4px 5px;
	line-height: 16px;
	font-size: 12px;
	margin-top: 2px;
	margin-left: 5px;
	background: rgba(100, 0, 0, .2);
	color: #092e58;
	float: right;
	border-radius: 12px;
	cursor: pointer;
}
.AddContButton{
	background: rgba(0, 0, 100, .2);
}
.searchdiv{
	position: relative;
}
.col{
	float: left;
	width: 28%;
	padding: 5px 2%;
	margin-left: 1%;
	border: 1px solid #697579;
	background: rgba(100, 100, 100, 0.05);
	margin-bottom: 5px;
}
.maincat{
	text-align: left;
	height: 40px;
	line-height: 40px;
	font-size: 22px;
	background-repeat: no-repeat;
	background-position: 5px 50%; 
	background-size: auto 80%; 
	padding-left: 35px;
	margin-top: 10px;
}
.subcat{
	display: block;
	text-align: left;
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	background-repeat: no-repeat;
	background-position: 5px 50%; 
	background-size: auto 80%;  
	padding-left: 25px;
	margin-top: 10px;
}
.staffcolour{
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-right: 8px;
}
.subCat{
	display: none;
}
.cols{
	-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}
.hide{
	display: none;
}
.feedbacklist{
	list-style: none;
	padding: 0; margin: 0;
	border: 1px solid #092e58;
	max-height: 200px;
	overflow: scroll;
	overflow-x: hidden;
	margin-bottom: 20px;
	background: #CCC;
}
.feedbacklist li{
	display: block;
	padding: 5px;
	border-bottom: 1px solid #092e58;
	position: relative;
}
.feedbacklist li .Commenter{
	display: block;
	position: absolute;
	right: 2px;
	bottom: 2px;
	width: 25px;
	height: 20px;
	background: url(images/Commenter.png)
}
.Bar{
	height: 20px;
	background: #092e58;
}
.version{
	position: relative;
	display: block;
	margin: 5px 0;
	font-size: 11px;
	letter-spacing: -1px;
}
.versionhtml{
	position: absolute;
	left: 90%;
	top:0;
	width: 830px;
	height: 800px;
	display: none;
	text-align: justify;
	z-index: 999;
	box-shadow: 0px 0px 10px black;
	color: black;
	letter-spacing: normal;
	font-size: 12px;
	border: none;
}
.version:hover .versionhtml{
	display: block;
}
.mainContent th.rotate {
  height: 200px;
  white-space: nowrap;
  padding: 0;
}
.mainContent th.rotate > div {
	-webkit-transform: translate(30px, 75px) rotate(315deg);
	-ms-transform: translate(30px, 80px) rotate(315deg);
	transform: translate(30px, 80px) rotate(315deg);
  width: 30px;
}
.mainContent th.rotate > div > span {
  border-bottom: 1px solid #ccc;
  padding: 7px 10px 7px 5px;
  background: #092e58;
}
.Button{
	width:123px;
	height:123px;
	padding:10px;
	cursor:pointer;
	background-image:url(images/Button1.jpg);
	color:#092e58;
	font-size:12px;
	text-decoration:none;
	float:left;
}
.delete{
	float: right;
	color:#092e58;
	font-weight: bold;
	font-size: 20px;
	text-decoration: none;
}
.deleteClone{
	color: #ccc;
}
button, .button {
	padding: 2px;
	background: #092e58;
	color: white;
	border: 2px solid #092e58;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 16px;
	cursor: pointer;
	min-width: 10px;
	min-height: 16px;
}
button:hover{
}
span.edit_button, span.delete_button, span.undelete_button, span.on_button, span.off_button{
	background-position:50% 50%;
	background-repeat: no-repeat;
	padding-left: 22px;
	background-size: 70%;
}
span.edit_button{
	background-image: url(images/edit_button.png);
}
span.delete_button{
	background-image: url(images/del_button.png);
	background-size: 50%;
}
span.undelete_button{
	background-image: url(images/undel_button.png);
	background-size: 50%;
}
span.on_button, span.off_button{
	background-image: url(images/on_off.png);
}
span.off_button{
	background-position:100% 50%;
	background-color: #D00;
	padding-left: 22px;
	border-radius: 10px;
	background-size: 78%;
}
small{
	color: #092e58;
	font-size: 11px;
}
.keyword{
	float: left;
	padding: 5px 15px 5px 5px;
	margin-left: 5px;
	border: 1px solid #697579;
	background: rgba(100, 100, 100, 0.05);
	margin-bottom: 5px;
	position: relative;
	border-radius: 5px;
}
.keyword .del{
	position: absolute;
	top:-2px;
	right: -2px;
	background: #092e58;
	color: maroon;
	font-size: 9px;
	border-radius: 6px;
	line-height: 12px;
	width: 12px;
	height: 12px;
	text-align: center
}
.olddata{
	padding: 5px 10px;
	background: #fce9e9;
	border: 1px solid #b88686;
	margin-bottom: 10px;
}
#list {
	margin-top: 30px;
}
#list h1{
	font-size: 50px;
	font-weight: normal;
	letter-spacing: 5px;
	margin-bottom: 5px;
}
#list table{
	width: 100%;
	padding: 0;
	margin: 0;	
	border-width: 1px;
}
#list th, #list td{
	border: none;
	padding: 5px;
}
#list tbody{
}
#list tbody td{
	border-right: 1px solid rgba(153, 153, 153, .1);
}
#list tbody tr:hover{
	cursor: pointer;
}
#list tbody tr:hover td {
	background: rgba(119, 185, 0, 0.2);
	color: #2B2D2C;
}
#list tbody tr:hover .jobLink{
	color: #2B2D2C;
}
#list tbody tr:nth-child(even){
	background: rgba(153, 153, 153, .1);
}
#list thead{
	display: block;
	width: 100%;
}
#list thead tr{
	width: 100%;
	display: block;
	clear: both;
}
#list thead th, #list thead td{
	display: block;
	padding: 5px 0;
	float: left;
	background: #2a2b2b;
}
#list thead td{
	text-align: center;
}
#list th{
	text-align: center;
	color: #999999;
}
#list thead input,
#list thead select{
	width: 96%;
	padding: 2px 2%;
	background: #3c3d3d url("/layout/search_mini.png") 2% 50% no-repeat;
	border: none;
	border-radius: 2px;
}
#list thead select option {color: #999;}
#list thead input:focus,
#list thead input.search_by, #list thead select.search_by {
	background: maroon;
}
#list tbody{
	clear: both;
	display: block;
	height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    background: white;
}
#list thead .header{
	background: url("/layout/sortable.png") 98% 50% no-repeat;
}
#list thead .headerSortUp{
	background: url("/layout/sort_up.png") 98% 50% no-repeat;
}
#list thead .headerSortDown{
	background: url("/layout/sort_down.png") 98% 50% no-repeat;
}
#footer {
	display: block;
	font-size: 11px;
	color:#222;
	clear: both;
	position:fixed;
	left: 0;
	z-index: 9999;
	bottom:0;
	width: 260px;
	margin: 0 auto;
	text-align:center;
	padding:10px 0;
}
input[type=text], input[type=password], textarea{
	padding: 5px 10px;
	width:95%;
	border: 1px solid #ddd;
	border-radius: 5px; 
} 
#footer a{
	color:#222;
	text-decoration:none;
}
#footer a:hover{
	text-decoration:underline;
}
.shd{
    background: url(http://stevenharris.com.au/shd.png) no-repeat 0 50%;
    padding-left: 25px;
    height: 30px;
}
.columns{
	column-count:3;
}
@media only screen and (max-width: 767px) {
	#Header{
		width: 50px;
	}
	.submenu{
		padding: 0 0 0 50px;
	}
	.mainContent{
		padding: 80px 5px 20px 55px;
	}
	.container{
		min-width: inherit;
	}
	.menu li{
		overflow: hidden;
	}
	.menu a{
		background-position: 10px 10px;
		padding:  0 0 0 50px;
	}
	.menu a:hover, .menu a.current{
		background-position: -15px 10px;
	}
	.sortable .actionOnOff{
		margin-right: 0;
	}
	#footer{
		width: 100%;
		text-align: right;
		padding-right: 20px;
	}
	.CollapsiblePanelContent{
		padding: 10px 5px;
	}
	.columns{
		column-count:1;
	}
	th{
		display: none;
	}
	input[type=text], input[type=password], textarea{
		width: 100%;
	}
}