@media screen and (max-width: 600px) {
	

	table.mobileBlock td, table.mobileBlock th {
		display:block;
		clear: both;
		line-height: 35px!important;
		
	}
	table.mobileBlock td:nth-child(1) {
		background-color: #f8fbfa;
		font-weight: bold;
		background-color: unset;
		
	}
	
	table.mobileTable td.mobileInlineBlock {
		display:inline-block;
	}
		table.mobileTable th.mobileInlineBlock {
		display:inline-block;
	}
		table.mobileTable td.mobileInlineGrid {
		display:inline-grid;
	}
		table.mobileTable th.mobileInlineGrid {
		display:inline-grid;
	}
	tr.attributeItem {
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
		tr.attributeItem:nth-child(odd) {
		background-color: rgba(241, 249, 249, 0.81);
	}
	tr.attributeItem td {
		border-bottom: 0px solid #ccc;
	}
	.twentyPercent, .eightyPixels, .fifteenPercent, .hundredPixels, .twohundredPixels, .tenPercent, .fiftyPercent, .seventyPixels, .onefortyPixels, .twentyfivePercent, .fortyPercent {
		width: 100%;
	}

	.companylist {
		height:45px;
		border: 0px;
		padding-top: 8px;
	}
	
	.pagination {
		height: 150px;
	}
	.mobileBold {
		font-weight: bold!important;
	}
	h3 {
		white-space: normal;
		line-height: 35px
	}
	h3.searchTitle {
		padding-bottom:15px;
		
	}
	h3.fileQuota {
		white-space: normal;
		width:100%;
	}
	.showpageArea, .pag_list {
		min-height: 60px!important;
	}

		table.mobileFirst td:nth-child(1) {
		border-top: 3px solid #d8dcdf;
		
	}
	td#companyLabel, .tdCompanyName {
		border-top: 1px solid #d8dcdf;
	}
	a.CompanyName {
		border-top: 1px solid #d8dcdf;
	}
	.table_wrapper th h3.contactTitle {
		margin-left: -10px;
		width: calc(100% + 18px)
	}

	a {
		line-height: 26px;
		
	}
	#user_details {
	display:none;
	}
	#logo {
	background: none;
	}
	.table_wrapper th h3.contactTitle {
		margin-top:0px!important;
	}
	
	#sideBar {
	/*display: none;*/
	}
	.table_wrapper {
	margin-left: 3px;
	margin-right: 3px;
	border-bottom: 2px solid #D3E5ED;
	border-radius: 0px 0px 0px 0px;
	padding-bottom: 30px;
	}
	.table_wrapper td:first-child {
	border: 0px;
    border-left: 0px solid #d8dcdf;

	}
	.table_wrapper th:last-child {
	border-left: 0px;
    border-right: 0px solid #d8dcdf;

	}
	tbody[id^="Row"] tr td:first-child, tbody[class*="customRow"] tr td:first-child {
		border: 0px;
		background-color: unset;
	}
	tbody[class*="customRow"] tr:first-child td {
		border-right: 0px;
		background-color: unset;
	}
	tbody[class*="customRow"] tr:first-child {
		background-image: none;
		background-color: unset;
	}
	.addAnother a img {
		padding-bottom: 0px!important;
		
	}
	.table_wrapper td, .tdbg td {
		border-right:0px;
	}
	tbody[class*="customRow"] tr:first-child td {
		border-top:0px;
	}
	img.demo-img-swap {
		display: none!important;
	}
	
	.system_name {
		display: none;
	}
	
	.title_wrapper {
	    background: none repeat scroll 0% 0% #715699;
	    padding: 0px;
	    margin: 0px 3px 0px 3px;
	    position: relative;
	    top: 0px;
	    left: 0px;
	    color: #FFF;
	    min-height: 0px;
	    height: 0px;
	    border-top-right-radius: 0px;
	    border-top-left-radius: 0px;
	}
	
	.noShowMobile {
	display: none!important;
	
	}
	.functionsContact {
		background-color: #f8fbfa;
	}
	
	.rowtwo {
		float:right!important;
		margin-top: -35px!important;
	}
	
	
	.ui-dialog .ui-dialog-content {
	overflow: visible;
	}
	.stickyFooter {
		height: 60px;
	}
	.stickyFooter .buttons {
		padding-top: 10px;
	}
	#footer {
	display: none;
	}
	.wrapper {
	    min-width: 100%;
	    min-height: 100%;
	    position: relative;
	    width: 100%;
		z-index: 1;
		margin-bottom: -40px;
		padding-bottom: -40px;
		
	}
	#mobileMenu {
	width: 60px;
	height: 60px;
	background-color: #715699;
	float:left;
	background-image: url('/images/menuMobile.png');
	}
	li#searchLinkMenu, li#supportLink {
		display:none;
	}
	
	.companyFiles, .publicFiles {
		margin-left: 0%;
		width: 50%;
		display:block;
	}
	.userFiles {
		width:50%;
	}
	
	#logo {
	    margin: 0px;
	    padding: 0px 0px 0px 0px;
	    width: 250px;
	    height: 67px;
	    float: right;
	    background: url('layout/site/logo_bg.png') repeat-x scroll right center transparent;
	}
	#logo a {
	    display: block;
	    width:256px;
	    height: 60px;
	    margin-top: px;
	    
	    text-indent: -3000px;
	    overflow: hidden;
	    right:0px;
	    float: right;
	    background: url('layout/site/logo_mobile.png') no-repeat scroll 0% 0% transparent;
	}
	#logo_user_details {
	    width: 100%;
	    float: left;
	    height: 60px;
	    background-color: #900;
	}
	
	.table_wrapper tr, .tdbg tr {
	    background-image: none;
	}
	.table_wrapper td, .table_wrapper th, .tdbg td {
	    text-align: left;
	    padding: 0px 8px;
	    line-height: 22px;
	    font-size: 15px!important;
	}
	
	h3 {
	font-size: 24px; 
	padding-top: 0px;
	background-color: none;
	}
	.table_wrapper th h3 {
		padding-left: 15px!important;
		margin-left: -11px;
		width: calc(100% + 20px);
		float:left;
		
	}
	
	/*draganddrop.css - start*/
	
	.groupWrapper {
	    width: 100% !important;
	    float: none;
	    margin-right: 0px;
	    min-height: 20px;
	}
	
	.section {
	    margin-left: 0px;
	    padding: 0px 0px 10px 0px;
	}
	#page {
	    float: left;
	    margin-left: 0px;
	    width: 100%;
	    min-height: 100%;
	}
	.ui-widget {
	    margin: 0px 4px 14px 4px;
	}
	.groupItem { 
	box-shadow: 0px 0px 0px 0px #ffffff;
	}
	
	.groupItem .itemHeader {
	
	    height: 25px;
	    
	}
	
	.itemHeader .headerTitle a {
	
	    top: 2px;
	
	}
	#companyLabel {
		width: 100%;
	}
	
	.itemHeader {
	    color: #FFF;
	    padding: 0px;
	    cursor: move;
	    font-weight: bold;
	    font-size: 17px;
	    height: 0px;
	}
	.headerTitle {
	    color: #FFF;
	    padding: 5px;
	    cursor: move;
	    font-weight: bold;
	    font-size: 15px;
	    height: 0px;
	}
	
	#content {
	    width: 100%;
	    min-height: 100%;
	    padding: 5px 0px 22px 0px;
	    background: url('layout/site/content_dtop.png') repeat-x scroll 0% 0% #FCFCFC;
	    
	}
	/*draganddrop.css - end*/
	
	/*menu - purple dropdowns-start */
	ul#css3menu1 {
	    font-size: 0px;
	    z-index: 999;
	    position: relative;
	    display: none;
	    padding: 0px;
	    
	}
	
	
	
	
	
	/*menu - purple dropdowns-end */
	
	/*menu - redtop-start */
	#main_menu ul {
	    margin: 0px;
	    padding: 0px 0px;
	    float: left;
	    width: 100%;
	    background-color: #780800;
	}
	#menus_wrapper {
	    border-style: solid;
	    border-color: #783DB4;
	    border-width: 0px;
	    width: 100%;
	    float: left;
	    padding: 0px 0px 0px 0px;
	    background:  #FFFFFF;
	    background-image: none;
	    min-height: 1px;
	}
	#main_menu {
	    font-size: 14px;
	    width: 100%;
	    /*float: left;*/
		float:none;
	    border-top: 1px solid #ffffff;
	}
	
	#main_menu li {
	    float: left;
	    list-style: none outside none;
	    padding: 0px 0px 0px 0px;
	    margin: 0px;
	    
	    background-color: #780800;
	    border-right: 1px solid #ffffff;
	}
	
	#main_menu span span#searchRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 8px 6px;
	     
	}
	
	#main_menu span span#searchRed:after {
	    content: url('/images/searchRed.png');
	   
	}
	
	#main_menu a.selected:link span#searchRed, #main_menu a.selected:visited span#searchRed, #main_menu a.selected:hover span#searchRed, #main_menu a.selected:active span#searchRed {
	    background-color: #4d1783;
	    cursor: default;
	    
	}
	
	
	#main_menu span span#dashboardRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 8px 6px;
	    
	}
	
	#main_menu span span#dashboardRed:after {
	    content: url('/images/dashboardRed.png');
	    
	}
	
	#main_menu a.selected:link span#dashboardRed, #main_menu a.selected:visited span#dashboardRed, #main_menu a.selected:hover span#dashboardRed, #main_menu a.selected:active span#dashboardRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	#main_menu span span#statboardRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 8px 6px;
	    
	}
	
	#main_menu span span#statboardRed:after {
	    content: url('/images/statboardRed.png');
	    
	}
	
	#main_menu a.selected:link span#statboardRed, #main_menu a.selected:visited span#statboardRed, #main_menu a.selected:hover span#statboardRed, #main_menu a.selected:active span#statboardRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	
	#main_menu span span#configRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 8px 6px;
	    display: none;
	     
	}
	
	#main_menu span span#configRed:after {
	    content: url('/images/configRed.png');
	    
	}
	
	#main_menu a.selected:link span#configRed, #main_menu a.selected:visited span#configRed, #main_menu a.selected:hover span#configRed, #main_menu a.selected:active span#configRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	
	#main_menu span span#logOutRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 8px 6px;
	    
	     
	}
	
	#main_menu span span#logOutRed:after {
	    content: url('/images/logOutRed.png');
	    
	}
	
	#main_menu a.selected:link span#logOutRed, #main_menu a.selected:visited span#logOutRed, #main_menu a.selected:hover span#logOutRed, #main_menu a.selected:active span#logOutRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	
	#main_menu span span#supportRed {
	    background-image: none;
	    background-color: #780800;
	   padding: 8px 6px;
	    
	}
	
	#main_menu span span#supportRed:after {
	    content: url('/images/supportRed.png');
	    
	}
	
	#main_menu a.selected:link span#supportRed, #main_menu a.selected:visited span#supportRed, #main_menu a.selected:hover span#supportRed, #main_menu a.selected:active span#supportRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	
	#main_menu span span#feedRed {
	    background-image: none;
	    background-color: #780800;
	    padding: 2px 8px;
	     display: none;
	}
	
	#main_menu span span#feedRed:after {
	    content: url('/images/configRed.png');
	    
	}
	
	#main_menu a.selected:link span#feedRed, #main_menu a.selected:visited span#feedRed, #main_menu a.selected:hover span#feedRed, #main_menu a.selected:active span#feedRed {
	    background-color: #4d1783;
	    cursor: default;
	}
	
	#main_menu li form {
	    line-height: 40px;
	    padding: 7px 6px 8px 6px;
	    border-top-right-radius: 0px;
	    border-top-left-radius: 0px;
	    height: 47px;
	    background-image: none;
	    background-color: #780800;
	    width: 100%;
	    }
	    
	#main_menu li form input{
	    line-height: 30px;
	    border-radius: 0px;
	    padding-left: 4px;
	    width: 150px;
	    border: 1px solid #ffffff;
	    height: 30px;
	}
	
	#main_menu li#searchBoxRed {
		border-right: 0px;
		
		
	    
	}
	
	#main_menu li input {
	    margin-top: 2px;
	    padding: 0px ;
	    
	}
	#main_menu li input#goButton {
	width: 30px;
	
	height: 30px;
	margin-top: 4px;
	border-radius: 0px;
	background-color: #4D1783;
	color: #ffffff;
	font-weight: bold;
	border: none;
	text-transform: uppercase;
	padding-left: 0px;
	font-size: 12px;
	-webkit-appearance: none;
	   -moz-appearance: none;
	   appearance: none;
	   margin-left: 2px;
	}
	
	
	a.yellowButton, .yellowButton, input.yellowButton, a.blueButton, .blueButton, input.blueButton, a.greenButton, .greenButton, input.greenButton, a.redButton, .redButton, input.redButton, a.purpleButton, .purpleButton, input.purpleButton, a.blueButton, .blueButton, input.blueButton {
		border-bottom: 0px;
		border-radius: 2px;
		padding: 9px 12px 9px 12px;
	}
	.greenButton:active, .yellowButton:active, .blueButton:active, .redButton:active, .purpleButton:active, .orangeButton:active {
		top:0px;
		border-bottom: 0px;
	}
	
	.floatLeft {
	float:none;
	}
	
	td.mobileTable {
	display:block;
	width: 100%;
	
	}
	th.mobileTable {
	display:block;
	
	}
	.pag_list {
	float:none;
	}
	
	.showpagePoint {
		display: inline-block;
		margin-top: 10px;
	padding: 6px 8px;
	}
	.showpageNum a {
	padding: 6px 8px;
	}
	
	/*buttons old*/
	
	}
	
	@media screen and (max-width: 600px) {
	/*menu*/
	
	
	/* ---------------
	 * Slidebars Theme
	 *
	 * ---------
	 * CSS Index
	 *
	 * 001 - Box Model
	 * 002 - Site
	 * 003 - Slidebars
	 * 004 - Slidebar Menus
	 * 005 - Slidebar Widgets
	 * 006 - Top Navigation Bar
	 * 007 - Slidebar Controls
	 *
	 * ---------------
	 * 001 - Box Model
	 */
	
	* {
		/* Highly recommended to avoid any width alterations in the Slidebars or Site, which may cause horizontal scrolling. */
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	/* ----------
	 * 002 - Site
	 */
	
	#sb-site {
		
		
	}
	
	/* ---------------
	 * 003 - Slidebars
	 */
	
	.sb-slidebar {
		height:100%;width:30%;overflow-y:auto;position:fixed;top:0;z-index:0;visibility:hidden;background-color:#48157B;color: #e8e8e8; /* Text colour. */
	}
	
	.sb-slidebar a {
		color: #f2f2f2; /* Link colour. */
		text-decoration: none;
	}
	
	.sb-slidebar a:hover {
		color: #fbb1b1; /* Link hover colour. */
		text-decoration: underline;
	}
	
	/* --------------------
	 * 004 - Slidebar Menus
	 */
	 
	/* Main Menu */
	.sb-menu { /* Apply to <ul> or <ol>. */
		padding: 0;
		margin: 0;
		list-style-type: none;
		font-size: 14px;
		
	}
	
	.sb-menu li {
		width: 100%;
		padding: 0;
		margin: 0;
		border-top: 1px solid rgba(255, 255, 255, 0.1); /* Will lighten any background colour you set. */
		border-bottom: 1px solid rgba(0, 0, 0, 0.1); /* Will darken any background colour you set. */
	}
	
	.sb-menu > li:first-child {
		 /* Removes top border from first list item.. */
	}
	
	.sb-menu > li:last-child {
		 /* Removed bottom border from last list item. */
	}
	
	
	.sb-menu li a {
		width: 100%; /* Makes links full width. */
		display: inline-block;
		padding: 12px; /* Creates an even padding the same size as your font. */
	}
	
	.sb-menu li a:hover {
		text-decoration: none;
		background-color: rgba(255, 255, 255, 0.05); /* Will lighten any background colour you set. */
	}
	
	/* Borders */
	.sb-left .sb-menu li a {
		border-left: 3px solid transparent;
	}
	
	.sb-left .sb-menu li a:hover {
		border-left: 3px solid; /* Removes transparent colour, so border colour will be the same as link hover colour. */
	}
	
	.sb-right .sb-menu li a {
		border-right: 3px solid transparent;
	}
	
	.sb-right .sb-menu li a:hover {
		border-right: 3px solid; /* Removes transparent colour, so border colour will be the same as link hover colour. */
	}
	
	/* Submenus */
	.sb-submenu {
		display: none;
		padding:0px;
		margin: 0px;
		list-style-type: none;
		background-color: rgba(255, 255, 255, 0.12); /* Submenu background colour. */
	}
	
	/* Caret */
	span.sb-caret {
		width: 0;
		height: 0;
		display: inline-block;
		margin: 0 5px;
		border: 5px solid transparent;
	}
	
	span.sb-caret { /* Caret Down */
		border-top: 5px solid;
		border-bottom: 0px solid transparent;
	}
	
	.sb-submenu-active > span.sb-caret { /* Caret Up */
		border-top: 0px solid transparent;
		border-bottom: 5px solid;
	}
	
	
	/* ----------------------
	 * 005 - Slidebar Widgets
	 */
	
	.sb-widget {
		border-radius: 3px;
		border: 1px solid rgba(255, 255, 255, 0.1); /* Will lighten any background colour you set. */
		margin: 14px;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25); /* Slight shadow. */
	}
	
	.sb-widget-header {
		border-bottom: 1px solid rgba(0, 0, 0, 0.1); /* Will darken any background colour you set. */
		padding: 14px;
		background-color: #292929; /* Widget title background colour. */
	}
	
	.sb-widget-title {
		margin: 0; /* Removes browser default margins for heading tags. */ 
	}
	
	.sb-widget-content {
		border-top: 1px solid rgba(255, 255, 255, 0.1); /* Will lighten any background colour you set. */
		padding: 14px;
		background-color: #262626; /* Widget content background colour. */
	}
	
	/* ------------------------
	 * 006 - Top Navigation Bar
	 */
	
	.sb-navbar {
		width: 100%;
		height: 50px;
		position: fixed;
		top: 0;
		left: auto;
		right: auto;
		z-index: 1000;
		background-color: #219AEB; /* Bar colour. */
		
		box-shadow:
			/* Layered single pixel shadows to create a one sided shadow effect. */
			0 5px 0 0 rgba(0, 0, 0, 0.01),
			0 4px 0 0 rgba(0, 0, 0, 0.02),
			0 3px 0 0 rgba(0, 0, 0, 0.04),
			0 2px 0 0 rgba(0, 0, 0, 0.06),
			0 1px 0 0 rgba(0, 0, 0, 0.08),
			/* Top highlight */
			0 1px 0 0 rgba(255, 255, 255, 0.1) inset,
			/* Left highlight */
			1px 0 0 0 rgba(255, 255, 255, 0.1) inset,
			/* Right highlight */
			-1px 0 0 0 rgba(255, 255, 255, 0.1) inset,
			/* Bottom lowlight */
			0 -1px 0 0 rgba(0, 0, 0, 0.1) inset;
			
		/* Glass gradient overlay, works with any colour background. */
		background-image: -webkit-linear-gradient(top, rgba(255,255,255, 0.05) 50%, rgba(0,0,0, 0.02) 51%); /*  Webkit syntax. */
		background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 50%, rgba(0, 0, 0, 0.02) 51%); /* Final syntax. */
		background-size: 100%;
		background-repeat: no-repeat;
	}
	
	html.sb-android .sb-navbar {
		position: absolute; /* Fix navbar to top for old versions of Android Browser. */
	}
	
	/* Navbar Menu Items */
	.sb-navbar-menu {
		list-style-type: none;
		padding: 0;
		margin: 0;
	}
	
	.sb-navbar-menu-left {
		float: left;
	}
	
	.sb-navbar-menu-right{
		float: right;
	}
	
	.sb-navbar-menu li {
		padding: 0;
		margin: 0;
		display: block;
		float: left;
	}
	
	.sb-navbar-menu li a {
		display: inline-block;
		color: #f2f2f2; /* Navbar link colour */
		padding: 14px;
		text-decoration: none;
	}
	
	.sb-navbar-menu li a:hover {
		color: #f2f2f2; /* Navbar link hover colour */
		background-color: rgba(0, 0, 0, 0.05); /* Will lighten any background colour you set. */
	}
	
	/* -----------------------
	 * 007 - Slidebar Controls
	 */
	 
	.sb-toggle-left, .sb-toggle-right, .sb-open-left, .sb-open-right, .sb-close {
		cursor: pointer; /* Help desktop users with Slidebar controls. */
	}
	
	/* Navicons */
	/* These are prefixed with .sb-navbar to avoid styling other Slidebar toggles you may be using. */
	.sb-navbar .sb-toggle-left {
		width: 52px;
		float: left;
		padding: 14px;
	}
	
	.sb-navbar .sb-toggle-right {
		width: 52px;
		float: right;
		padding: 14px;
	}
	
	.navicon-line {
		width: 24px;
		height: 4px;
		border-radius: 1px;
		margin-bottom: 3px;
		background-color: #fff; /* Colour of navicon lines. */
	}
	
	/* Hover states to match navbar menu item hover. */
	.sb-navbar .sb-toggle-left:hover {
		background-color: rgba(0, 0, 0, 0.05); /* Will lighten any background colour you set. */
	}
	
	.sb-navbar .sb-toggle-right:hover {
		background-color: rgba(0, 0, 0, 0.05); /* Will lighten any background colour you set. */
	}
	
	/* -------------------
	 * 006 - Media Queries
	 */
	
	.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
		padding: 4px 8px;
	}
	
	#tabs .ui-tabs, #tabs .ui-tabs-nav li {
		top: 0px!important;
		}
		
		#tabs .ui-widget-content, #tabs.ui-state-active, #tabs .ui-widget-header .ui-state-active {
	    background: #e7f3f8!important;
	}
	
	}






@media screen and (max-width: 600px) {

    table.mobileTable {
      border: 0;
	  margin-left: 35px;
	  width: calc(100% - 33px);
    }

    table.mobileTable thead {
      display: none;
    }

    table.mobileTable tr {
      margin-bottom: 0px;
      display: block;
      border-bottom: 2px solid #ddd;
      
    }

    table.mobileTable td {
      display: block;
      text-align: left;
      font-size: 13px;
      border-bottom: 1px dotted #ccc;
      min-height: 30px;
      padding: 8px 10px;
      
   
    }

    table.mobileTable td:last-child {
      border-bottom: 0px solid #ccc;
	  height: 55px;
    }

    table.mobileTable td:before {
      content: attr(data-label);
      
      font-weight: bold;
    }
    table.mobileTable td:first-child {
      /*background-color: #d7edfa; why?*/
    }
    

    .actions {
	    float:none;
    }
	tr.first {
		/*border-top: 3px solid #b1ddf4;why?*/
	}


  }

@media (max-width: 767px) {
	/* This is entirely optional, it hides the navbar menu items when device width is under 768px. */
	.sb-navbar-menu {
		display: none;
	}
	.mobileHide {
		display:none!important;
	}
	.mobileCompany {
		font-size: 16px;
		margin-top: 4px;
		font-weight: 900;
	}
	.mobileContact {
		font-size: 15px;
		font-weight: bolder;
	}

}		
