@charset "utf-8";
/* CSS Document */
body {
	margin: 0px;
	padding: 0px;
	font-family: 'Open Sans', sans-serif;
}
.clear {
	clear: both;
}
.creatform .errormsg input[type="password"] {
    width: 100%;
    margin-bottom: 0px;
}
.loginfieldwrapper a {
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 10px;
}
ul.submenu {
    position: absolute;
    right: 0px;
    width: 150px !important;
    background-color: #474747;
    margin-top: 5px;
    display: none;
}
.importfiledetails {
    float: left;
    width: 100%;
    background-color: #f3f3f3;
    padding: 15px;
    box-sizing: border-box;
}

.importfiledetails span.filedetails {
    float: left;
    width: 100%;
    color: #000;
    font-weight: bold;
}

.importfiledetails ul {
    float: left;
    width: 100%;
    padding: 0px;
    list-style: none;
    margin: 10px 0;
}

.importfiledetails ul li {
    float: left;
    padding: 0;
    width: 33.333%;
    margin-bottom: 3px;
    font-size: 13px;
}

.downloadbtn {
    float: left;
    width: 100%;
    border-top: 1px solid #dedede;
    text-align: right;
    padding: 10px 0;
}

.downloadbtn a {
    background-color: #00b5ff;
    color: #fff;
    padding: 5px;
    float: right;
    border-radius: 3px;
}

ul.submenu li {
    float: left;
    width: 100%;
    margin-left: 0px !important;
}
.loginfieldwrapper h1 {
    font-size: 20px;
    color: #fff;
    text-transform: uppercase;
    float: left;
    width: 100%;
    text-align: center;
}
#frmForgot input {
	margin-bottom: 0px !important;
}
#frmReset input {
	margin-bottom: 0px !important;
}
span.ortext {
    float: left;
    width: 100%;
    text-align: center;
    color: #fff;
    margin: 15px 0;
}
span.errtext {
    float: left;
    width: 100%;
    color: red;
    margin-bottom: 15px;
}
ul.submenu li a {
    float: left;
    width: 100%;
    padding: 10px 0;
    text-align: center;
    box-sizing: border-box;
    color: #fff;
}

ul.submenu li a:hover {
    color: #f3f3f3;
}

.menu li:hover ul.submenu {
    display: block;
}

.filter .date input#created_date {
    float: left;
    width: 92%;
    border-bottom: 1px solid #dedede;
}
.filter .date input#created_date:before {
  content: '\f061';
  font-family: 'FontAwesome';
  float: right;
  color: #8cc63f;
}
.loginwrapper {
	background-image: url(../images/loginbg.png);
	background-repeat: no-repeat;
	background-size: cover;
	float: left;
	height: 100%;
	min-height: 500px;
	width: 100%;
	position: fixed;
}
.loginlogo {
	background-color: rgba(40, 43, 67, 0.54);
	float: left;
	min-height: 130px;
	padding: 10px 0;
	text-align: center;
	width: 100%;
}
.loginfieldwrapper {
	margin: 13% auto auto;
	width: 27%;
}

.loginfieldwrapper .loginbtn input[type="submit"] {
    color: #fff;
    background-color: #f39846;
    border: 0px;
    margin: auto;
    padding: 7px 37px;
    font-size: 16px;
}
.loginfieldwrapper .err_msg {
    float: left;
    width: 100%;
    color: #b94a48;
    background-color: #f2dede;
    margin-bottom: 2px;
    padding: 7px;
    border-radius: 3px;
}
.uploadfile .errormsg {
    width: 100%;
}
.uploadfile .errormsg input#upload {
    padding: 8px 0;
    margin-top: 0px;
    box-sizing: border-box;
    text-align: center;
}
.success_msg {
    float: left;
    width: 100%;
    background-color: #dff0d8;
    color: #468847;
    padding: 10px;
    border-radius: 3px;
    margin: 6px 0;
}
.error_msg {
    float: left;
    width: 100%;
    background-color: #e8a4a4;
    color: #cc0000;
    padding: 10px;
    border-radius: 3px;
    margin: 6px 0;
}
span.completed {
    color: #48c477;
}
i.fa.fa-calendar {
    color: #468847;
}
span.updated {
    color: #b315fd;
}

.loginfieldwrapper input[type="text"] {
	background-color: #dadbdf;
	float: left;
	width: 100%;
	border-radius: 6px;
	border: 0px;
	padding: 15px;
	margin-bottom: 15px;
	color: #000;
}
.loginfieldwrapper input[type="password"] {
	background-color: #dadbdf;
	float: left;
	width: 100%;
	border-radius: 6px;
	border: 0px;
	padding: 15px;
	margin-bottom: 15px;
	color: #000;
}
.loginfieldwrapper input[type="button"] {
	color: #fff;
	background-color: #f39846;
	border: 0px;
	margin: auto;
	padding: 7px 37px;
	font-size: 16px;
}
.loginbtn {
	margin: auto;
	width: 110px;
}
.mainwrapper {
	width: 1000px;
	height: auto;
	margin: auto;
}
.headerwrapper {
	border-bottom: 1px solid #dfdfdf;
	float: left;
	width: 100%;
	padding: 15px 0;
}
.logo {
	float: left;
	width: auto;
}
.menu {
	float: right;
	width: auto;
	margin-top: 20px;
}
.menu ul {
	float: right;
	list-style: outside none none;
	padding: 0px;
	margin: 0px;
	width: auto;
}
.menu li {
	color: #00b5ff;
	float: left;
	margin-left: 25px;
	position: relative;
}
.menu li a {
	color: #00b5ff;
	text-decoration: none;
	cursor: pointer;
	
}
.menu li a:hover {
	color: #333;
	text-decoration: none;
}
.breadcrumbwrapper {
	border-bottom: 1px solid #f3f3f3;
	float: left;
	width: 100%;
}
.breadcrumb li a {
}
.breadcrumb li a:hover {
	color: #00b5ff;
	text-decoration: none;
}
.toptitle {
	color: #00b5ff;
	float: left;
	font-size: 25px;
	margin-top: 5px;
	text-transform: uppercase;
	width: auto;
}
.mainwrapper h2 {
	color: #00b5ff;
	font-size: 15px;
	width: auto;
	float: left;
}
.dashboardovervidew ul {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}
.dashboardovervidew ul li {
	float: left;
	height: 111px;
	margin-bottom: 15px;
	margin-right: 20px;
	padding: 9px;
	width: 229px;
	text-align: center;
}
.dashboardovervidew {
	float: left;
	width: 500px;
	margin-bottom: 20px;
}
.totalorder {
	background-color: #82ca9c;
	border: 1px solid #82ca9c;
	color: #fff;
	font-size: 25px;
}
.totalproject {
	background-color: #8781bd;
	border: 1px solid #8781bd;
	color: #fff;
	font-size: 25px;
}
.totalusers {
	background-color: #fbaf5d;
	border: 1px solid #fbaf5d;
	color: #fff;
	font-size: 25px;
}
.dashboardovervidew ul li strong {
	float: left;
	font-size: 40px;
	font-weight: 400;
	width: 100%;
}
.dashboardovervidew ul li.totalorder:hover {
	background-color: #61b045;
}
.dashboardovervidew ul li.totalusers:hover {
	background-color: #f7941e;
}
.dashboardovervidew ul li.totalproject:hover {
	background-color: #666197;
}
.confirm {
	float: right !important;
}
.dashboardrightgrid {
	float: right;
	width: 499px;
}
.smallgrid {
	border: 1px solid #d7d7d7;
	float: left;
	width: 100%;
}
.smallgrid td {
	height: 25px;
	padding-left: 10px;
}
.smallgrid th {
	height: 25px;
	padding-left: 10px;
}
.fullgrid {
	border: 1px solid #d7d7d7;
	float: left;
	width: 100%;
	margin-bottom: 20px;
}
.fullgrid th {
	padding-left: 10px;
	font-weight: normal;
}
.fullgrid td {
	border-bottom: 1px solid #f3f3f3;
	color: #7d7d7d;
	padding: 5px 5px 5px 10px;
}
.fullgrid a:hover {
	color: #000;
	text-decoration: none;
}
.innerbodywrapper {
	float: left;
	min-height: 500px;
	width: 100%;
	margin-bottom: 50px;
}
.footerwrapper {
	font-size: 12px;
	margin: auto;
	text-align: center;
	width: 1000px;
}
.footerouter {
	background-color: #fff;
	border-top: 1px solid #dfdfdf;
	bottom: 0;
	float: left;
	margin-top: 50px;
	padding: 8px 0;
	position: fixed;
	width: 100%;
}
.creatform {
	margin: 30px auto;
	width: 83%;
}
.creatform label {
	float: left;
	width: 34%;
	font-size: 16px;
	font-weight: normal;
}
.creatform input[type="text"] {
	float: right;
	width: 66%;
	padding: 10px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.creatform input[type="password"] {
	float: right;
	width: 66%;
	padding: 10px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.creatform textarea {
	float: right;
	width: 66%;
	padding: 10px;
	height: 205px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.creatform select {
	float: right;
	width: 66%;
	padding: 10px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.creatform img {
	border: 1px solid #ccc;
    margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
}
.createbtn {
	float: left;
	width: 100%;
	text-align: right;
	margin-bottom: 30px;
}
.createbtn input[type="button"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 10px 20px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
}
.createbtn input[type="submit"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 10px 20px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
}
.filter {
	background-image: url("../images/filter.png");
	background-position: right top;
	background-repeat: no-repeat;
	border-top: 1px solid #d5e5f5;
	float: left;
	margin-top: 30px;
	min-height: 445px;
	width: 230px;
	padding-right: 20px;
}
.filtersearch {
	border-bottom: 1px solid #dedede;
	float: left;
	margin-top: 10px;
	padding-bottom: 10px;
	width: 100% !important;
	line-height: normal;
}
.selectkeyword {
	border-bottom: 1px solid #dedede;
	float: left;
	overflow: hidden;
	width: 100%;
	padding-bottom: 5px;
}
.selectkeyword input {
	border: 0 none;
	margin: 0 0 5px !important;
	padding: 13px 10px !important;
	width: 100%;
}
.date input#created_date {
	background-color: transparent;
	border: 0 none;
	box-shadow: none;
	margin: 0;
	padding: 0;
	width: auto;
	float: left;
}
.date .controls.date {
	border-bottom: 1px solid #dedede;
	margin-bottom: 10px;
}
.date .date span.add-on {
	float: right;
}
.date .date span.add-on {
	background-color: transparent;
	border: 0 none;
	color: #8cc63f;
	float: right;
	padding: 0;
}
.date .date span.add-on i {
	color: #8cc63f;
}
.selectkeyword select {
	border: 0 none;
	margin-left: -3px;
	width: 100%;
}
.selectkeyword i {
	background-color: #fff;
	float: right;
	margin-left: -24px;
	margin-top: -2px;
	padding: 5px 9px;
	position: absolute;
}
.filter p {
	margin-top: 8px;
}
.date p i.fa.fa-calendar {
	color: #8cc63f;
	float: left;
	margin-right: 6px;
	margin-top: 3px;
}
.date p i.fa.fa-angle-down {
	float: right;
	padding: 3px 9px;
}
.box.user {
	border: 1px solid #dedede;
	float: left;
	height: 130px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.boxes {
	float: left;
	height: auto;
	width: 100%;
}
.boxes p {
	margin-bottom: 0;
}
.box.Company {
	border: 1px solid #dedede;
	float: left;
	height: 75px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.box {
	margin-bottom: 0px;
}
.box select {
	border: 1px solid #dedede;
	border-radius: 0;
	float: left;
	margin-bottom: 20px;
	min-height: 94px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.box.project {
	border: 1px solid #dedede;
	float: left;
	height: 130px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.box.order {
	border: 1px solid #dedede;
	float: left;
	height: 130px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.box.line {
	border: 1px solid #dedede;
	float: left;
	height: 130px;
	overflow-x: hidden;
	overflow-y: scroll;
	padding: 5px;
	width: 100%;
}
.filterbtn input[type="button"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 10px 20px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
}
.filterbtn input[type="submit"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 10px 20px;
	margin-left: 0px;
	box-shadow: 0 3px 0 #4a654d;
}
.filterbtn {
	float: left;
	width: 100%;
}
.filterright {
	float: right;
	margin-top: 30px;
	width: 74%;
}
.location {
	float: left;
	width: 66%;
}
.location select {
	width: 100%;
	margin-bottom: 13px;
}
.newlocation {
	margin-bottom: 25px;
}
.newlocation input[type="button"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	padding: 3px 7px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
	margin-bottom: 13px;
}
.newlocation input[type="text"] {
	display: none;
	float: left;
	width: 66%;
	padding: 10px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.vehicle_type {
	float: left;
	width: 66%;
}
.vehicle_type select {
	width: 100%;
	margin-bottom: 13px;
}
.newvehicletype {
	margin-bottom: 25px;
}
.newvehicletype input[type="button"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	padding: 3px 7px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
	margin-bottom: 13px;
}
.newvehicletype input[type="text"] {
	display: none;
	float: left;
	width: 66%;
	padding: 10px;
	border-radius: 2px;
	border: 1px solid #bdbdbd;
	margin-bottom: 25px;
}
.menulist {
	padding: 8px 0;
	margin-bottom: 0px;
	list-style: none;
	border-radius: 4px;
	float: right;
}
.menulist>li {
	display: inline-block
}
.menulist>li+li:before {
	padding: 0 5px;
	color: #ccc;
	content: "\00a0"
}
.menulist li a {
}
.menulist li a:hover {
	color: #00b5ff;
	text-decoration: none;
	cursor: pointer;
}
.changecolor {
	border: 2px solid red !important;
}
.suspendbtn {
	background-color: #7f7f7f !important;
	border: 1px solid #7f7f7f !important;
	box-shadow: 0 3px 0 #4d4d4d !important;
}
.uploadfile {
	width: 66%;
	float: right;
}
.uploadfile input[type="text"] {
	width: 66%;
	float: left;
}
.uploadfile input[type="button"] {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	padding: 8px 10px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
	margin-bottom: 13px;
}
.uploadfile input[type="file"] {
	display: none;
}
.errormsg {
	width: 66%;
	float: right;
	margin-bottom: 25px;
}
.errormsg input[type="text"] {
	width: 100%;
	float: left;
	margin-bottom: 0px;
}
.errormsg span {
	color: red;
}
#upload_line_image {
	display : none;
}
.uploadfile > img {
    border: 1px solid #ccc;
    margin-bottom: 20px;
    max-width: 100%;
    width: 100%;
}
#search_keyword {
    border-radius: 0;
    height: 30px;
    margin-bottom: 4px;
    padding: 5px;
    width: 100%;
}
#upload_line_template {
	display : block;
}
.menulist input[type="text"] {
	border: 1px solid #dedede;
	border-radius: 7px;
	font-size: 12px;
	padding: 4px 13px;
}
.menulist li label {
	font-weight: normal;
	margin-right: 5px;
	color: #00b5ff;
}
#search_order {
	background-image: url("../images/search_esg.png");
	background-position: 97% center;
	background-repeat: no-repeat;
}
#search_line {
	background-image: url("../images/search_esg.png");
	background-position: 97% center;
	background-repeat: no-repeat;
}
#search_button {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 2px 20px;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
}
#upload {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	color: #fff;
	text-transform: uppercase;
	padding: 2px 20px;
	margin-top: 6px;
	width: 22%;
	margin-left: 7px;
	box-shadow: 0 3px 0 #4a654d;
}
#upload_line_image {
	float: right;
	width: 66%;
}
#upload_image {
	float: left;
	margin-top: 9px;
	width: 36% !important;
}
#image_name {
	float: left;
	width: 40%;
}
#templates_id {
	width: 100%;
}
#upload_line_template {
	float: right;
	width: 66%;
}
#vehicle_type_name {
	margin-bottom: 0;
	margin-top: 15px;
	width: 100%;
}
.newvehicletype {
	float: left;
	width: 100%;
}
.uploadfile #image_name {
	float: left;
	width: 76%;
}
.gridsearch {
	float: left;
	margin-bottom: 29px;
	width: 100%;
}
.paginatn {
	font-size: 13px;
	line-height: 20px;
	padding: 5px;
 *padding: 5px;
	font-style: normal;
	text-decoration: none;
	text-shadow: none;
	float: left;
	padding-right: 10px;
	width: 50%;
	text-align: left;
	margin: 0px;
}
.paginatn font {
	color: #BCC731
}
#popup {
	background-color: #fff;
	border-radius: 4px;
	display: none;
	left: 25%;
	min-height: 100px;
	padding: 30px 0;
	position: fixed;
	right: 25%;
	top: 25%;
	width: auto;
	z-index: 99999;
}
#popupinfo {
	padding: 2px;
	text-align: center;
}
#popupinfo p {
	font-size: 14px;
}
#yesbutton {
	background-color: #39b54a;
	border: 0 none;
	border-radius: 2px;
	color: #fff;
	padding: 4px 19px;
	border-bottom: 3px solid #4a654d;
}
#nobutton {
	background-color: #333;
	border: 0 none;
	border-radius: 2px;
	color: #fff;
	padding: 4px 19px;
	border-bottom: 3px solid #4a654d;
}
#popupinfo .button {
	text-align: center;
}
#popupinfo .button a {
	text-decoration: none;
	border: 1px solid #333;
	width: 20px;
	padding: 5px;
	background: #1A1A1A;
	color: #eee;
}
#popupinfo .button a:hover {
	background: #eee;
	color: #1a1a1a;
}
#mask {
	background: #000;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10;
	width: 100%;
	height: 100%;
	opacity: 0.8;
	z-index: 999;
}
.dashboard tr td + td + td + td + td {
	width: 271px;
}
.projects td + td + td + td {
	width: 286px;
}
.projects td + td + td + td+td {
	width: auto;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>menuresponsive<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
@media screen and (max-width: 769px) {
/* nav-wrap */

#menu-wrap {
	float: left;
	position: relative;
	width: 100%;
}
#menu-wrap * {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
/* menu icon */
#menu-trigger {
	display: block; /* show menu icon */
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	padding: 0 0 0 35px;
	border: 1px solid #222;
	color: #fafafa;
	font-weight: bold;
	background-color: #111;
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, linear-gradient(#444, #111);
	border-radius: 6px;
	box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
}
/* main nav */
#menu {
	margin: 0;
	padding: 10px;
	position: absolute;
	top: 40px;
	width: 100%;
	z-index: 1;
	background-color: #444;
	display: none;
	box-shadow: none;
}
#menu:after {
	content: '';
	position: absolute;
	left: 25px;
	top: -8px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #444;
}
#menu ul {
	position: static;
	visibility: visible;
	opacity: 1;
	margin: 0;
	background: none;
	box-shadow: none;
}
#menu ul ul {
	margin: 0 0 0 20px !important;
	box-shadow: none;
}
#menu li {
	position: static;
	display: block;
	float: none;
	border: 0;
	margin: 5px;
	box-shadow: none;
}
#menu ul li {
	margin-left: 20px;
	box-shadow: none;
}
#menu a {
	display: block;
	float: none;
	padding: 0;
	color: #999;
}
#menu a:hover {
	color: #fafafa;
}
#menu ul a {
	padding: 0;
	width: auto;
}
#menu ul a:hover {
	background: none;
}
#menu ul li:first-child a:after, #menu ul ul li:first-child a:after {
	border: 0;
}
}
 @media screen and (min-width: 769px) {
#menu {
	display: block !important;
}
}
#menu-trigger {
	display: none;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End of Menu Responsive <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/


@media only screen and (min-device-width : 320px) and (max-device-width : 640px) and (orientation : portrait) {
.loginfieldwrapper {
	width: 77%;
}
.mainwrapper {
	padding: 0 10px;
	width: 100%;
}
.logo {
	float: left;
	text-align: center;
	width: 100%;
}
#menu-trigger {
	display: block;
}
.toptitle {
	text-align: center;
	width: 100%;
}
.breadcrumb {
	width: 100%;
}
.dashboardovervidew {
	text-align: center;
	width: 100%;
}
.dashboardovervidew ul li {
	width: 100%;
}
.dashboardrightgrid {
	width: 100%;
}
.creatform {
	width: 100%;
}
.creatform label {
	width: 100%;
}
.creatform input[type="text"] {
	width: 100%;
	margin-bottom: 5px;
}
.creatform input[type="password"] {
	width: 100%;
	margin-bottom: 5px;
}
.errormsg {
	margin-bottom: 5px;
	width: 100%;
}
.creatform select {
	width: 100%;
	margin-bottom: 5px;
}
.createbtn {
	margin-top: 15px;
}
.fullgrid {
	border: 0px;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Dashboard fullwidth div <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.dashboard table {
	display: block;
	border: 0px;
}
.dashboard thead {
	display: block;
}
.dashboard tbody {
	display: block;
}
.dashboard th {
	display: block;
}
.dashboard td {
	display: block;
}
.dashboard tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.dashboard thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.dashboard tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.dashboard td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.dashboard td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.dashboard td:nth-of-type(1):before {
	content: "Order Reference";
	color: #000;
}
.dashboard td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.dashboard td:nth-of-type(3):before {
	content: "Delivery Date";
	color: #000;
}
.dashboard td:nth-of-type(4):before {
	content: "Total Lines";
	color: #000;
}
.dashboard td:nth-of-type(5):before {
	content: "Delivery Address";
	color: #000;
}
.dashboard tr td + td + td + td + td {
	width: auto;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Ebd of Dashboard fullwidth div <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Users Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.users table {
	display: block;
}
.users thead {
	display: block;
}
.users tbody {
	display: block;
}
.users th {
	display: block;
}
.users td {
	display: block;
}
.users tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.users thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.users tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.users td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.users td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.users td:nth-of-type(1):before {
	content: "Name";
	color: #000;
}
.users td:nth-of-type(2):before {
	content: "Job Title";
	color: #000;
}
.users td:nth-of-type(3):before {
	content: "Username";
	color: #000;
}
.users td:nth-of-type(4):before {
	content: "Status";
	color: #000;
}
.users td:nth-of-type(5):before {
	content: "Details";
	color: #000;
}
.users td:nth-of-type(6):before {
	content: "";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End Users Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> company Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
#company table {
	display: block;
}
#company thead {
	display: block;
}
#company tbody {
	display: block;
}
#company th {
	display: block;
}
#company td {
	display: block;
}
#company tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
#company thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
#company tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
#company td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
#company td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
#company td:nth-of-type(1):before {
	content: "Company Name";
	color: #000;
}
#company td:nth-of-type(2):before {
	content: "Location";
	color: #000;
}
#company td:nth-of-type(3):before {
	content: "Number of users";
	color: #000;
}
#company td:nth-of-type(4):before {
	content: "Status";
	color: #000;
}
#company td:nth-of-type(5):before {
	content: "View Users";
	color: #000;
}
#company td:nth-of-type(6):before {
	content: "Details";
	color: #000;
}
#company td:nth-of-type(7):before {
	content: "Confirm";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End company Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> projects Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.projects table {
	display: block;
}
.projects thead {
	display: block;
}
.projects tbody {
	display: block;
}
.projects th {
	display: block;
}
.projects td {
	display: block;
}
.projects tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.projects thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.projects tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.projects td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.projects td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.projects td:nth-of-type(1):before {
	content: "Project Reference";
	color: #000;
}
.projects td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.projects td:nth-of-type(3):before {
	content: "Contact Number";
	color: #000;
}
.projects td:nth-of-type(4):before {
	content: "Address";
	color: #000;
}
.projects td:nth-of-type(5):before {
	content: "Edit";
	color: #000;
}
.projects td:nth-of-type(6):before {
	content: "View Orders";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End projects Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> orders Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.orders table {
	display: block;
}
.orders thead {
	display: block;
}
.orders tbody {
	display: block;
}
.orders th {
	display: block;
}
.orders td {
	display: block;
}
.orders tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.orders thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.orders tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.orders td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.orders td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.orders td:nth-of-type(1):before {
	content: "Order Reference";
	color: #000;
}
.orders td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.orders td:nth-of-type(3):before {
	content: "Delivery Date";
	color: #000;
}
.orders td:nth-of-type(4):before {
	content: "Total Qty";
	color: #000;
}
.orders td:nth-of-type(5):before {
	content: "Edit";
	color: #000;
}
.orders td:nth-of-type(6):before {
	content: "View Lines";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End orders Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> lines Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.lines table {
	display: block;
}
.lines thead {
	display: block;
}
.lines tbody {
	display: block;
}
.lines th {
	display: block;
}
.lines td {
	display: block;
}
.lines tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.lines thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.lines tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.lines td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.lines td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.lines td:nth-of-type(1):before {
	content: "Line Reference";
	color: #000;
}
.lines td:nth-of-type(2):before {
	content: "Glass Type";
	color: #000;
}
.lines td:nth-of-type(3):before {
	content: "Panel Width";
	color: #000;
}
.lines td:nth-of-type(4):before {
	content: "Panel Height";
	color: #000;
}
.lines td:nth-of-type(5):before {
	content: "Quantity";
	color: #000;
}
.lines td:nth-of-type(6):before {
	content: "Process Status";
}
.lines td:nth-of-type(7):before {
	content: "Edit";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End lines Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> linelist Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.linelist table {
	display: block;
}
.linelist thead {
	display: block;
}
.linelist tbody {
	display: block;
}
.linelist th {
	display: block;
}
.linelist td {
	display: block;
}
.linelist tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.linelist thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.linelist tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.linelist td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.linelist td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.linelist td:nth-of-type(1):before {
	content: "Reference";
	color: #000;
}
.linelist td:nth-of-type(2):before {
	content: "Glass Type";
	color: #000;
}
.linelist td:nth-of-type(3):before {
	content: "Panel Width";
	color: #000;
}
.linelist td:nth-of-type(4):before {
	content: "Panel Height";
	color: #000;
}
.linelist td:nth-of-type(5):before {
	content: "Quantity";
	color: #000;
}
.linelist td:nth-of-type(6):before {
	content: "Process Status";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End linelist Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> glasstypes Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.glasstypes table {
	display: block;
}
.glasstypes thead {
	display: block;
}
.glasstypes tbody {
	display: block;
}
.glasstypes th {
	display: block;
}
.glasstypes td {
	display: block;
}
.glasstypes tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.glasstypes thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.glasstypes tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.glasstypes td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 56%;
}
.glasstypes td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.glasstypes td:nth-of-type(1):before {
	content: "";
	color: #000;
}
.glasstypes td:nth-of-type(2):before {
	content: "glasstypes";
	color: #000;
}
.glasstypes td:nth-of-type(3):before {
	content: "Glass Type Description";
	color: #000;
}
.glasstypes td:nth-of-type(4):before {
	content: "Type";
	color: #000;
}
.glasstypes td:nth-of-type(5):before {
	content: "";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End glasstypes Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> edgeworks Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.edgeworks table {
	display: block;
}
.edgeworks thead {
	display: block;
}
.edgeworks tbody {
	display: block;
}
.edgeworks th {
	display: block;
}
.edgeworks td {
	display: block;
}
.edgeworks tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.edgeworks thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.edgeworks tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.edgeworks td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.edgeworks td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.edgeworks td:nth-of-type(1):before {
	content: "Edge Work Code";
	color: #000;
}
.edgeworks td:nth-of-type(2):before {
	content: "Company";
	color: #000;
}
.edgeworks td:nth-of-type(3):before {
	content: "Description";
	color: #000;
}
.edgeworks td:nth-of-type(4):before {
	content: "Edit";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End edgeworks Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.reports table {
	display: block;
}
.reports thead {
	display: block;
}
.reports tbody {
	display: block;
}
.reports th {
	display: block;
}
.reports td {
	display: block;
}
.reports tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.reports thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.reports tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.reports td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.reports td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.reports td:nth-of-type(1):before {
	content: "Project Reference";
	color: #000;
}
.reports td:nth-of-type(2):before {
	content: "Order Reference";
	color: #000;
}
.reports td:nth-of-type(3):before {
	content: "Line Reference";
	color: #000;
}
.reports td:nth-of-type(4):before {
	content: "Glass Type";
	color: #000;
}
.reports td:nth-of-type(5):before {
	content: "Width";
	color: #000;
}
.reports td:nth-of-type(6):before {
	content: "Height";
	color: #000;
}
.reports td:nth-of-type(7):before {
	content: "Quantity";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> templates Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.templates table {
	display: block;
}
.templates thead {
	display: block;
}
.templates tbody {
	display: block;
}
.templates th {
	display: block;
}
.templates td {
	display: block;
}
.templates tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.templates thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.templates tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.templates td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.templates td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.templates td:nth-of-type(1):before {
	content: "Name";
	color: #000;
}
.templates td:nth-of-type(2):before {
	content: "Description";
	color: #000;
}
.templates td:nth-of-type(3):before {
	content: "Edit";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End templates Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/

.createbtn input[type="button"] {
	float: left;
	width: 100%;
}
.menulist > li {
	background-color: #f3f3f3;
	display: inline-block;
	margin-bottom: 4px;
	min-height: 26px;
	padding: 6px 0;
	text-align: center;
	width: 100%;
}
.menulist {
	width: 100%;
}
.menulist > li a:hover {
	color: #000;
}
.creatform textarea {
	margin-bottom: 5px;
	padding: 10px;
	width: 100%;
}
.location {
	float: left;
	width: 100%;
}
.menulist input[type="text"] {
	border: 1px solid #dedede;
	border-radius: 7px;
	font-size: 12px;
	padding: 7px 13px;
	width: 100%;
}
.paginatn {
	width: 100%;
}
.vehicle_type {
	float: left;
	width: 100%;
}
#project .createbtn > input {
	padding: 12px;
}
#upload_line_template {
	width: 100%;
}
.uploadfile {
	float: right;
	width: 100%;
}
.uploadfile #image_name {
	float: left;
	width: 51%;
}
#upload {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	box-shadow: 0 3px 0 #4a654d;
	color: #fff;
	float: right;
	margin-left: 7px;
	margin-top: 6px;
	padding: 2px 20px;
	text-transform: uppercase;
	width: auto;
}
.filter {
	width: 100%;
}
.filterright {
	float: right;
	width: 100%;
}
.menulist li a {
	float: left;
	padding-left: 15px;
}
.createbtn input[type="button"] {
	margin-left: 0px;
}
.createbtn input[type="submit"] {
	margin-left: 0px;
}
.createbtn {
	clear: both;
	float: none;
	margin: auto;
	width: 176px;
}
.createbtn input {
	margin-bottom: 5px;
	width: 100%;
}
.uploadfile > img {
	border: 1px solid #dedede;
	clear: both;
	float: left;
	margin-bottom: 20px;
	margin-top: 11px;
	max-width: 100%;
	width: 100% !important;
}
}
 @media only screen and (min-device-width : 320px) and (max-device-width : 640px) and (orientation : landscape) {
.loginfieldwrapper {
	width: 77%;
}
.mainwrapper {
	padding: 0 10px;
	width: 100%;
}
.logo {
	float: left;
	text-align: center;
	width: 100%;
}
#menu-trigger {
	display: block;
}
.toptitle {
	text-align: center;
	width: 100%;
}
.breadcrumb {
	width: 100%;
}
.dashboardovervidew {
	text-align: center;
	width: 100%;
}
.dashboardovervidew ul li {
	width: 100%;
}
.dashboardrightgrid {
	width: 100%;
}
.creatform {
	width: 100%;
}
.creatform label {
	width: 100%;
}
.creatform input[type="text"] {
	width: 100%;
	margin-bottom: 5px;
}
.creatform input[type="password"] {
	width: 100%;
	margin-bottom: 5px;
}
.errormsg {
	margin-bottom: 5px;
	width: 100%;
}
.creatform select {
	width: 100%;
	margin-bottom: 5px;
}
.createbtn {
	margin-top: 15px;
}
.fullgrid {
	border: 0px;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Dashboard fullwidth div <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.dashboard table {
	display: block;
	border: 0px;
}
.dashboard thead {
	display: block;
}
.dashboard tbody {
	display: block;
}
.dashboard th {
	display: block;
}
.dashboard td {
	display: block;
}
.dashboard tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.dashboard thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.dashboard tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.dashboard td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.dashboard td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.dashboard td:nth-of-type(1):before {
	content: "Order Reference";
	color: #000;
}
.dashboard td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.dashboard td:nth-of-type(3):before {
	content: "Delivery Date";
	color: #000;
}
.dashboard td:nth-of-type(4):before {
	content: "Total Lines";
	color: #000;
}
.dashboard td:nth-of-type(5):before {
	content: "Delivery Address";
	color: #000;
}
.dashboard tr td + td + td + td + td {
	width: auto;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Ebd of Dashboard fullwidth div <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Users Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.users table {
	display: block;
}
.users thead {
	display: block;
}
.users tbody {
	display: block;
}
.users th {
	display: block;
}
.users td {
	display: block;
}
.users tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.users thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.users tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.users td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.users td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.users td:nth-of-type(1):before {
	content: "Name";
	color: #000;
}
.users td:nth-of-type(2):before {
	content: "Job Title";
	color: #000;
}
.users td:nth-of-type(3):before {
	content: "Username";
	color: #000;
}
.users td:nth-of-type(4):before {
	content: "Status";
	color: #000;
}
.users td:nth-of-type(5):before {
	content: "Details";
	color: #000;
}
.users td:nth-of-type(6):before {
	content: "";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End Users Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> company Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
#company table {
	display: block;
}
#company thead {
	display: block;
}
#company tbody {
	display: block;
}
#company th {
	display: block;
}
#company td {
	display: block;
}
#company tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
#company thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
#company tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
#company td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
#company td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
#company td:nth-of-type(1):before {
	content: "Company Name";
	color: #000;
}
#company td:nth-of-type(2):before {
	content: "Location";
	color: #000;
}
#company td:nth-of-type(3):before {
	content: "Number of users";
	color: #000;
}
#company td:nth-of-type(4):before {
	content: "Status";
	color: #000;
}
#company td:nth-of-type(5):before {
	content: "View Users";
	color: #000;
}
#company td:nth-of-type(6):before {
	content: "Details";
	color: #000;
}
#company td:nth-of-type(7):before {
	content: "Confirm";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End company Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> projects Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.projects table {
	display: block;
}
.projects thead {
	display: block;
}
.projects tbody {
	display: block;
}
.projects th {
	display: block;
}
.projects td {
	display: block;
}
.projects tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.projects thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.projects tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.projects td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.projects td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.projects td:nth-of-type(1):before {
	content: "Project Reference";
	color: #000;
}
.projects td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.projects td:nth-of-type(3):before {
	content: "Contact Number";
	color: #000;
}
.projects td:nth-of-type(4):before {
	content: "Address";
	color: #000;
}
.projects td:nth-of-type(5):before {
	content: "Edit";
	color: #000;
}
.projects td:nth-of-type(6):before {
	content: "View Orders";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End projects Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> orders Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.orders table {
	display: block;
}
.orders thead {
	display: block;
}
.orders tbody {
	display: block;
}
.orders th {
	display: block;
}
.orders td {
	display: block;
}
.orders tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.orders thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.orders tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.orders td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.orders td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.orders td:nth-of-type(1):before {
	content: "Order Reference";
	color: #000;
}
.orders td:nth-of-type(2):before {
	content: "Create Date";
	color: #000;
}
.orders td:nth-of-type(3):before {
	content: "Delivery Date";
	color: #000;
}
.orders td:nth-of-type(4):before {
	content: "Total Qty";
	color: #000;
}
.orders td:nth-of-type(5):before {
	content: "Edit";
	color: #000;
}
.orders td:nth-of-type(6):before {
	content: "View Lines";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End orders Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> lines Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.lines table {
	display: block;
}
.lines thead {
	display: block;
}
.lines tbody {
	display: block;
}
.lines th {
	display: block;
}
.lines td {
	display: block;
}
.lines tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.lines thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.lines tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.lines td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.lines td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.lines td:nth-of-type(1):before {
	content: "Line Reference";
	color: #000;
}
.lines td:nth-of-type(2):before {
	content: "Glass Type";
	color: #000;
}
.lines td:nth-of-type(3):before {
	content: "Panel Width";
	color: #000;
}
.lines td:nth-of-type(4):before {
	content: "Panel Height";
	color: #000;
}
.lines td:nth-of-type(5):before {
	content: "Quantity";
	color: #000;
}
.lines td:nth-of-type(6):before {
	content: "Process Status";
}
.lines td:nth-of-type(7):before {
	content: "Edit";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End lines Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> linelist Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.linelist table {
	display: block;
}
.linelist thead {
	display: block;
}
.linelist tbody {
	display: block;
}
.linelist th {
	display: block;
}
.linelist td {
	display: block;
}
.linelist tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.linelist thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.linelist tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.linelist td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.linelist td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.linelist td:nth-of-type(1):before {
	content: "Reference";
	color: #000;
}
.linelist td:nth-of-type(2):before {
	content: "Glass Type";
	color: #000;
}
.linelist td:nth-of-type(3):before {
	content: "Panel Width";
	color: #000;
}
.linelist td:nth-of-type(4):before {
	content: "Panel Height";
	color: #000;
}
.linelist td:nth-of-type(5):before {
	content: "Quantity";
	color: #000;
}
.linelist td:nth-of-type(6):before {
	content: "Process Status";
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End linelist Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> glasstypes Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.glasstypes table {
	display: block;
}
.glasstypes thead {
	display: block;
}
.glasstypes tbody {
	display: block;
}
.glasstypes th {
	display: block;
}
.glasstypes td {
	display: block;
}
.glasstypes tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.glasstypes thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.glasstypes tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.glasstypes td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.glasstypes td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.glasstypes td:nth-of-type(1):before {
	content: "";
	color: #000;
}
.glasstypes td:nth-of-type(2):before {
	content: "glasstypes";
	color: #000;
}
.glasstypes td:nth-of-type(3):before {
	content: "Glass Type Description";
	color: #000;
}
.glasstypes td:nth-of-type(4):before {
	content: "Type";
	color: #000;
}
.glasstypes td:nth-of-type(5):before {
	content: "";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End glasstypes Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> edgeworks Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.edgeworks table {
	display: block;
}
.edgeworks thead {
	display: block;
}
.edgeworks tbody {
	display: block;
}
.edgeworks th {
	display: block;
}
.edgeworks td {
	display: block;
}
.edgeworks tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.edgeworks thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.edgeworks tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.edgeworks td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.edgeworks td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.edgeworks td:nth-of-type(1):before {
	content: "Edge Work Code";
	color: #000;
}
.edgeworks td:nth-of-type(2):before {
	content: "Company";
	color: #000;
}
.edgeworks td:nth-of-type(3):before {
	content: "Description";
	color: #000;
}
.edgeworks td:nth-of-type(4):before {
	content: "Edit";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End edgeworks Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.reports table {
	display: block;
}
.reports thead {
	display: block;
}
.reports tbody {
	display: block;
}
.reports th {
	display: block;
}
.reports td {
	display: block;
}
.reports tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.reports thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.reports tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.reports td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.reports td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.reports td:nth-of-type(1):before {
	content: "Project Reference";
	color: #000;
}
.reports td:nth-of-type(2):before {
	content: "Order Reference";
	color: #000;
}
.reports td:nth-of-type(3):before {
	content: "Line Reference";
	color: #000;
}
.reports td:nth-of-type(4):before {
	content: "Glass Type";
	color: #000;
}
.reports td:nth-of-type(5):before {
	content: "Width";
	color: #000;
}
.reports td:nth-of-type(6):before {
	content: "Height";
	color: #000;
}
.reports td:nth-of-type(7):before {
	content: "Quantity";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> templates Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.templates table {
	display: block;
}
.templates thead {
	display: block;
}
.templates tbody {
	display: block;
}
.templates th {
	display: block;
}
.templates td {
	display: block;
}
.templates tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.templates thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.templates tr {
	border: 1px solid #ccc;
	margin-bottom: 10px;
}
.templates td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.templates td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.templates td:nth-of-type(1):before {
	content: "Name";
	color: #000;
}
.templates td:nth-of-type(2):before {
	content: "Description";
	color: #000;
}
.templates td:nth-of-type(3):before {
	content: "Edit";
	color: #000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End templates Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/

.createbtn input[type="button"] {
	float: left;
	width: 100%;
}
.menulist > li {
	background-color: #f3f3f3;
	display: inline-block;
	margin-bottom: 4px;
	min-height: 26px;
	padding: 6px 0;
	text-align: center;
	width: 100%;
}
.menulist {
	width: 100%;
}
.menulist > li a:hover {
	color: #000;
}
.creatform textarea {
	margin-bottom: 5px;
	padding: 10px;
	width: 100%;
}
.location {
	float: left;
	width: 100%;
}
.menulist input[type="text"] {
	border: 1px solid #dedede;
	border-radius: 7px;
	font-size: 12px;
	padding: 7px 13px;
	width: 100%;
}
.paginatn {
	width: 100%;
}
.vehicle_type {
	float: left;
	width: 100%;
}
#project .createbtn > input {
	padding: 12px;
}
#upload_line_template {
	width: 100%;
}
.uploadfile {
	float: right;
	width: 100%;
}
.uploadfile #image_name {
	float: left;
	width: 55%;
}
#upload {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	box-shadow: 0 3px 0 #4a654d;
	color: #fff;
	float: right;
	margin-left: 7px;
	margin-top: 6px;
	padding: 2px 20px;
	text-transform: uppercase;
	width: auto;
}
.filter {
	width: 100%;
}
.filterright {
	float: right;
	width: 100%;
}
.menulist li a {
	float: left;
	padding-left: 15px;
}
.createbtn input[type="button"] {
	margin-left: 0px;
}
.createbtn input[type="submit"] {
	margin-left: 0px;
}
.createbtn {
	clear: both;
	float: none;
	margin: auto;
	width: 176px;
}
.createbtn input {
	margin-bottom: 5px;
	width: 100%;
}
.uploadfile > img {
	border: 1px solid #dedede;
	clear: both;
	float: left;
	margin-bottom: 20px;
	margin-top: 11px;
	max-width: 100%;
	width: 100% !important;
}
.loginfieldwrapper {
	margin: 0 auto auto;
}
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
.loginfieldwrapper {
	width: 77%;
}
.mainwrapper {
	padding: 0 10px;
	width: 100%;
}
#menu-wrap {
	float: right;
	margin-top: 9px;
	position: relative;
	width: 20%;
}
.logo {
	float: left;
	text-align: center;
	width: auto;
}
#menu-trigger {
	display: block;
}
.toptitle {
	text-align: center;
	width: auto;
}
.breadcrumb {
	width: auto;
}
.dashboardovervidew {
	text-align: center;
	width: 100%;
}
.dashboardovervidew ul li {
	margin-left: 4px;
	width: 30%;
	margin-bottom: 0;
}
.dashboardrightgrid {
	width: 100%;
}
.creatform {
	clear: both;
	margin: 35px auto auto;
	width: 54%;
}
.creatform label {
	width: 100%;
}
.creatform input[type="text"] {
	width: 100%;
	margin-bottom: 5px;
}
.creatform input[type="password"] {
	width: 100%;
	margin-bottom: 5px;
}
.errormsg {
	margin-bottom: 5px;
	width: 100%;
}
.creatform select {
	width: 100%;
	margin-bottom: 5px;
}
.createbtn {
	margin-top: 15px;
}
.fullgrid {
	border: 0px;
}
.createbtn input[type="button"] {
	float: right;
	margin-left: 15px !important;
	width: auto;
}
.menulist > li {
	display: inline-flex;
}
.menulist {
}
.menulist > li a:hover {
	color: #000;
}
.creatform textarea {
	margin-bottom: 5px;
	padding: 10px;
	width: 100%;
}
.location {
	float: left;
	width: 100%;
}
.menulist input[type="text"] {
}
.paginatn {
	width: 100%;
}
.vehicle_type {
	float: left;
	width: 100%;
}
#project .createbtn > input {
	padding: 12px;
}
#upload_line_template {
	width: 100%;
}
.uploadfile {
	float: right;
	width: 100%;
}
.uploadfile #image_name {
	float: left;
	width: 51%;
}
#upload {
	background-color: #39b54a;
	border: 1px solid #39b54a;
	box-shadow: 0 3px 0 #4a654d;
	color: #fff;
	float: right;
	margin-left: 7px;
	margin-top: 6px;
	padding: 2px 20px;
	text-transform: uppercase;
	width: auto;
}
.filterright {
	float: right;
	width: 67%;
}
.menulist li a {
	float: left;
	padding-left: 15px;
}
.createbtn input[type="button"] {
	margin-left: 0px;
}
.createbtn input[type="submit"] {
	margin-left: 0px;
}
.createbtn {
	clear: both;
	float: left;
	margin: auto;
	width: 100%;
}
.createbtn input {
	margin-bottom: 5px;
	width: auto;
}
.uploadfile > img {
	border: 1px solid #dedede;
	clear: both;
	float: left;
	margin-bottom: 20px;
	margin-top: 11px;
	max-width: 100%;
	width: 100% !important;
}
.projects td + td + td + td {
	width: 250px;
}
#vehicle_type_name {
	margin-top: 0px;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.reports table {
	display: block;
}
.reports thead {
	display: block;
}
.reports tbody {
	display: block;
}
.reports th {
	display: block;
}
.reports td {
	display: block;
}
.reports tr {
	display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.reports thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}
.reports tr {
	border: 1px solid #ccc;
	margin-bottom:10px;
}
.reports td {
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 50%;
}
.reports td:before {
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%;
	padding-right: 10px;
	white-space: nowrap;
}
/*
		Label the data
		*/
.reports td:nth-of-type(1):before {
	content: "Project Reference";
	color:#000;
}
.reports td:nth-of-type(2):before {
	content: "Order Reference";
	color:#000;
}
.reports td:nth-of-type(3):before {
	content: "Line Reference";
	color:#000;
}
.reports td:nth-of-type(4):before {
	content: "Glass Type";
	color:#000;
}
.reports td:nth-of-type(5):before {
	content: "Width";
	color:#000;
}
.reports td:nth-of-type(6):before {
	content: "Height";
	color:#000;
}
.reports td:nth-of-type(7):before {
	content: "Quantity";
	color:#000;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>End reports Grid <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
}


/*>>>>>>>>>>>>>>>>>>>>>>>>>import page style <<<<<<<<<<<<<<<<<<<<<<<*/
.fullgrid.imports.imports_est {
    float: left;
    margin-top: 30px;
    padding: 15px;
    width: 100%;
}
select#import-admin {
    border: 1px solid #dedede;
    border-radius: 7px;
    font-size: 12px;
    padding: 4px 13px;
}
.import-fields.firstselect {
    float: left;
    margin-bottom: 16px;
    padding-bottom: 14px;
    width: 48%;
	
}
.fullgrid.imports.imports_est #import-msg {
    background-color: #ff8484;
    border-radius: 5px;
    color: #fff;
    float: left;
    font-size: 12px;
    margin-bottom: 12px;
    margin-left: 6px;
    padding: 5px;
    text-align: left;
    width: 100%;
}
.import-submit.aub {
    border-top: 1px solid #dedede;
    float: left;
    padding-top: 12px;
    width: 100%;
}
.imports_est .succmsg {
    background-color: #6cd36e;
    border-radius: 10px;
    color: #fff;
    float: left;
    font-size: 12px;
    padding: 10px;
    width: 100%;
}
.imports_est .errmsg {
    background-color: #ff8484;
    border-radius: 10px;
    color: #fff;
    float: left;
    font-size: 12px;
    padding: 10px;
    width: 100%;
}
.fullgrid.imports.imports_est #import-msg {
    color: #ff0000;
    float: left;
    font-size: 12px;
    text-align: left;
	color:#fff
}

.import-fields.secondupload {
    float: right;
    width: 48%;
}
.import-submit.aub > input {
    background-color: #39b54a;
    border: 1px solid #39b54a;
    box-shadow: 0 3px 0 #4a654d;
    color: #fff;
    margin-left: 7px;
    padding: 10px 20px;
    text-transform: uppercase;
	float:right;
}
.import-fields.firstselect > label {
    float: left;
    font-weight: normal;
    width: 100%;
}
.import-fields.firstselect > label {
    float: left;
    font-weight: normal;
    width: 100%;
}
.import-fields.secondupload > label{
    float: left;
    font-weight: normal;
    width: 100%;
}
/*>>>>>>>>>>>>>>>>>>>>>>>>> End of  import page style <<<<<<<<<<<<<<<<<<<<<<<*/
@media only screen and (max-width:767px){
	.importfiledetails ul li {
    float: left;
    padding: 0px;
    width: 100%;
    margin-bottom: 3px;
    font-size: 13px;
}
}