body
{
	margin: 0;
	background-repeat: no-repeat;
}

/*
Use the most appropiate background image for the screen size 
*/
body
{
	background-color: rgb(216,216,216);
}


#header .TopMenu
{
	height: 50px;	
}

#version
{
	font-size: 0.75em;
	/*color: #DCDCDC;*/
	color: #606060;
}

/* We want to see every element separator in the drop down menus (default hidden in core) */
ul.submenu hr.ElementSeparator
{
	display: inherit;
}

/**********************************/
/***			colors			***/
/**********************************/

/* primary background (light grey with blue) */
#menucontainer li.PortalSelector,
#menucontainer li.PortalSelector:hover,
#menucontainer li.PortalSelector select
{
	background-color: rgb(255,255,255);
}

/* secondary background (grey) */
.TFPPanel,
table.TFPTable
{
	background-color: #dbdbdb;
}

.TFPPanel
{
/*	background-color: White;*/
	color: Black;
}

#header #menu
{
	position: absolute;
	top: 47px;
	right: 36px;
	height: 20px;
}

/* primary color (blue) */
a.ShowLink,
h1,
#CustomerInvoice>table>tbody>tr.HeaderRow>td.HeaderTitle,
#menucontainer li select,	/* combo box in menu */
.PortalGridMenuText,		/* primary text in grid menu */
#PortalButtonGrid td a:hover .imageText,	/* portal grid mouse over */
#PortalButtonGrid td a:hover .imageText div	/* portal grid mouse over */
{
	/*color: rgb(1,54,98);*/
}

/* secondary color (blue) */
H4, .h4						/* header */
{
	color: rgb(1,54,98);
}

#HaulierOrdersPanel #HaulierOrdersList tr.OrderEntry .Link:hover
{
	border-color: #646464;
}

.TFPTable td a ~ span 
{ 
	color: #ccc;
}

/* light yellow */
#ConsolidationPanel tr.UnapprovedRow, 
#MileageCalculatorPanel tr.ManualRow, 
#DeliveryDetails table tr.highlight, 
#CustomerDocuments table tr.NewRow,
#BulletinBoardPanel #ThreadList table tbody>tr:hover
{ 
	background-color: #ffffcc; 
}

/* green */
#OfdPanel table td.delivery a
{
	color: #4b2;
}

/* green */
#OfdPanel table td.DifferentUsage input
{
	background-color: #dfb;
}

/* orange */
#OfdPanel table td.delivery .smallLoads
{
	color: #d51;
}

/* red */
#OfdPanel td.Alarm
{
	color: #f22;
}

#ResourcePlanningPanel .TotalRow td
{
	background-color: #efefef;
	color: Red;
}

#driverShiftReport ul.Trips li.success, #DriverDetailsView ul.Trips li.success,
#ResourcePlanningPanelGraphics ul.Trips li.Loaded
{
	background-color: #22aa44;
}

#driverShiftReport ul.Trips li.warning, #DriverDetailsView ul.Trips li.warning,
#ResourcePlanningPanelGraphics ul.Trips.MissingResource li
{
	background-color: #aa2244 !important;
}

#ResourcePlanningPanelGraphics ul.Trips.MissingResource li
{
	border-color: #aa2244;
}

/* menu
----------------------------------------------------------*/

#menu
{
	margin: 0;
	margin-top: -40px;
	text-align: right;
	white-space: nowrap;
}

#menu>li
{ 
	padding: 2px 6px 0px 6px;
	text-align: left;
}

#menu>li.ui-selected
{
	border-bottom: 2px solid White;
	height: 24px;
}

#menu a:link #menu a:visited { text-decoration: none; }

#menu .ui-icon { background-image: url(../Areas/Core/Content/Images/ui-icons_ffffff_256x240.png); }

#menu ul.submenu
{ 
	padding: 6px 0 6px 0;
	width: 200px;
	z-index: 2000;
}

input[type="checkbox"]
{
	background: transparent;
	border: 0;
}

#menu ul.submenu hr { margin: 0 4px 0 4px; border: 1; border-top: 1px }
#menu ul.submenu li:hover { text-decoration: underline; }

#menu>li:hover .ui-icon,
ul#menu li a,
ul#menu li span
{
	margin: 0;
	line-height: 29px;
	text-decoration: none;
}
#menu a { cursor: pointer; }

#menucontainer li select { border: 1px solid #999; }


/* Page header
----------------------------------------------------------*/
#pageheader 
{
	position: absolute;
	top: 5px;
	left: 36px;
	height: 24px;
	margin: 5px;
}

#pageheader .ui-icon
{
	display: inline-block;
	vertical-align: sub;
	background-image: url(../Areas/Core/Content/Images/ui-icons_ffffff_256x240.png);
}

#pageheader.HoverOver
{
	cursor: pointer;
	border-bottom: 2px solid White;
}

#pageheader h1
{
	margin-top: 5px;
}

/* Panels
----------------------------------------------------------*/
.TFPPanel
{
	background-color: rgba(0,0,0,0);
	border: 0px solid #ccc;
	padding: 0px;
}

.TFPPanel tbody th { font-weight: normal; }

/* Groups
----------------------------------------------------------*/
.TFPEditGroup
{
	background: #fff;
	padding: 10px;
	overflow-y: hidden;
}

/* Button fonts
----------------------------------------------------------*/
button, .ui-button span, input[type='submit'], input[type='button'] { /*font-size: 0.75rem;*/ font-size: 0.75em; }


/* Tables
----------------------------------------------------------*/

table.dataTable 
{
	font-size: 0.875em;
	text-align: left;
}

/* 
	IE bug: Header cells are not always left-aligned.
	Adding the header cell specific CSS below fixes the problem.
*/
table.dataTable th 
{
    text-align: left;
}

table.dataTable th.sorting, 
table.dataTable th.sorting_disabled
{
	background: 0;
}

table.dataTable thead th td
{
	padding: 0px;
}

table.dataTable thead tr>th { border-bottom: 0; }
table.TFPTable
{
	border-collapse: inherit;
	border-spacing: 0;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
}

table.TFPTable a
{
	color: rgb(63, 104, 141);
}

.TFPTable th { padding: 6px 6px 4px 6px; }
.TFPTable td { padding: 2px 6px 2px 6px; }

/*  Row separator */
table.TFPTable>tbody>tr>td { border-color: #DDD }

.dataTables_scroll, .ColumnFilterPlaceHolder
{
	border-left: 2px solid #003057;
	border-right: 2px solid #003057;
}

.dataTables_wrapper table.TFPTable,
.dataTables_scroll table.TFPTable
{
	-moz-border-radius: inherit;
	-webkit-border-radius: inherit;
	-khtml-border-radius: inherit;
	border-radius: inherit;
	border-bottom: 0;
}

/* It's very important that the inner table doesn't have borders otherwise widht calculation fails */
.dataTables_wrapper div.dataTables_scroll table.dataTable,
.dataTables_wrapper div.dataTables_scroll table.dataTable.TFPTable
{ border: 0; }

/* Side borders between header an and footer */
div.dataTables_wrapper,
table.TFPTable:not(.dataTable)
{
	border-left: 1px solid;
	border-right: 1px solid;
}

/* No. of records selector */
.ui-toolbar .LengthWrapper.Open
{ 
	-webkit-border-top-right-radius: 4px;
	-khtml-border-top-right-radius: 4px;
	border-top-right-radius: 4px;
	-webkit-border-top-left-radius: 4px;
	-khtml-border-top-left-radius: 4px;
	border-top-left-radius: 4px;
}
.ui-toolbar .LengthWrapper.Open { background-color: #ddd; color: #003057; }
.ui-toolbar .LengthWrapper.Open .Subdued { color: black; }
.ui-toolbar .LengthWrapper.Open ul { background-color: #ddd; color: #003057; }
.ui-toolbar .LengthWrapper.Open span.ui-icon { background-image: url(../Areas/Core/Content/Images/ui-icons_222222_256x240.png); }
.ui-toolbar .LengthWrapper.Open ul 
{
	-webkit-border-bottom-right-radius: 4px;
	-khtml-border-bottom-right-radius: 4px;
	border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-khtml-border-bottom-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.ui-toolbar .dataTables_info .Bold { font-weight: bold; }
.TFPTable thead th { font-weight: bold; /*padding: 3px 16px 3px 8px;*/ color:white;}
.TFPTable tbody tr { border-bottom: 1px solid #EEE; background-color:#fff; }
.TFPTable tfoot tr { border-bottom: 1px solid #EEE; background-color:#003057; }
.TFPTable tfoot td { background-color: rgb(78,115,127); }
.TFPTable tfoot tr td.WorkedHours, .TFPTable tfoot tr td.PaymentHours, .TFPTable tfoot tr td.OvertimeHours { background-color:#fff !important; }
.TFPTable tfoot tr td.GuaranteedHours { color:#fff !important; font-weight: bold; }
.TFPTable thead th { border-bottom: 0; }
.ui-widget-footer { background: rgb(232,232,232); }
.TFPTable tbody tr:last-child td { border-bottom-color: #eee; }

#siteManagerPanel .outerscrolltable, #resourcePanel .outerscrolltable
{
	border-top: 35px solid #003057;
}
.outerscrolltable thead tr { color:#003057; }
.outerscrolltable thead th { color: #fff; font-size: 0.8em; font-weight:bold; }
.outerscrolltable tbody td { background:#fff; border: 1px solid #EEEEEE; color: #646464; }
.innerscrolltable { background: #fff; }

.outerscrolltable2 
{
	margin:0 auto 20px auto;
	border: 2px solid #003057;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
}
.outerscrolltable2 thead, .outerscrolltable2 th { border: 0; }
.outerscrolltable2 thead tr { padding-left:2px; }
.outerscrolltable2 thead tr th { background: #003057; color: #fff; }
.innerscrolltable2 { background:#fff; }

.outerscrolltable2 td { border: 1px solid #5c87b2; }
.outerscrolltable2 td:first-child { border-left: 0; }
.outerscrolltable2 td:last-child { border-right: 0; }

.outerscrolltable2 tbody td
{
	padding:0px;
	padding-top:5px;
	min-width:50px;
}

.outerscrolltable2 div.SchedulingGroup
{
	display: block;
	font-weight:bold;
	font-style:oblique;
	margin-left: 4px;	
	margin-right: 2px;
	text-align: left;
}

/* Selected table rows
----------------------------------------------------------*/
table tr.selected td, table tr.ui-selected td { color: #003057; background-color: #ccc;}
table tr.selected td input { color: #003057; background-color: #ccc; border:1px solid #eee; }

/* click-able table elements */
table td.cursor, table td .cursor { color: #003057 !important; text-decoration: underline;}
table td.cursor:hover { color:#FFFFFF !important; background-color: rgb(63, 104, 141) !important;}

/* Table Icon buttons
----------------------------------------------------------*/
.TFPTable td .cursor.ui-icon:hover,
.TFPTable td .cursor .ui-icon:hover
{
	border: 1px solid #003057;
	background-image: url(../Areas/Core/Content/Images/ui-icons_ffffff_256x240.png);
	background-color: #003057;
}


/* Table Button list
----------------------------------------------------------*/

.TFPTable td .ButtonList li
{
	padding: 2px 6px 3px 2px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
	margin: 2px;
}

.TFPTable td .ButtonList li
{
	text-decoration: underline;
}

.TFPTable td .ButtonList li:hover,
.TFPTable td .ButtonList li:hover span,
.TFPTable td .ButtonList li:hover a
{
	background-color: rgb(242,234,215);
	text-decoration: inherit;
}


/* Disable existing rules for table icons */
.TFPTable td .ButtonList .ui-icon:hover,
.TFPTable td .ButtonList .ui-icon
{
	border: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	-khtml-border-radius: 0;
	border-radius: 0;
	margin: 0;
}


/* Table buttons */
.TFPTable .TableButton
{
	padding: 1px;
	cursor: pointer;
	border: 1px solid #999;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
	margin: 2px;
	width: 16px;
}

.TFPTable .TableButton:hover { background-color: #003057; }
.TFPTable .TableButton:hover .ui-icon
{
	background-image: url(../Areas/Core/Content/Images/ui-icons_ffffff_256x240.png);
	background-color: #003057;
}

.dataTables_filter .ui-icon-search
{
	position:relative;
	left: 2px;
	top: -1px;
}

/* Touch table 
----------------------------------------------------------*/
.TFPTable.Touch td,
.TFPTable.Touch th
{
	padding-top: 16px;
	padding-bottom: 16px;
}
.TFPTable.Touch .TableButton { padding: 4px;}


/* headings
----------------------------------------------------------*/


/* PAGE TITLE */
h1 
{ 
	font-weight: bold;
	text-transform: uppercase; /* force text to proper case */
	font-size: 0.937em;
}

/* PAGE TITLE SUB */
H2
{
	color: #003057; 
	font-weight: bold;
	font-size: 0.937em;
}

/* HEADER (blue) */
H3
{
	color: #003057;
	font-weight: bold;
	font-size: 0.937em;
}
h3 i
{
	color: #222;
	display: block;
	font-size: 0.8em;
	font-weight: normal;
	margin-top: 4px;
}

/* HEADER (green) */
H4, .h4, .PortalGridMenuText
{
	text-transform: uppercase; /* force text to proper case */
	font-weight: bold;
	font-size: 0.937em;
}

/* TEXT MAIN (blue) */
.PortalGridMenuSubText { font-size: 0.812em; }

/* TEXT MAIN (grey) */
h6, .h6 {color: #646464; font-size: 0.812em; }

/* TEXT SML (green) */
.h10 { color: #84BD00; font-size: 0.687em; }

/* TABLE TEXT BOLD */
.h12 {color: #646464; font-weight:bold; font-size: 0.75em;  }

/* TABLE TEXT (grey) */
.h13 {color: #646464; font-size: 0.75em;  }


/* TABLE TEXT (blue) */
.h14 { color: #003057; font-size: 0.75em;  }

/* TABLE TEXT (white) */
.h15 { color: #003057; font-size: 0.75em;  }

.Header { font-weight: bold; }

/* Ensure label and value are on one line in components */
.WpComponent .Header,
.WpComponent .Value
{
	display: inline-block;
}

.WpMessage .Icon
{
	display: inline-block;
}

/* Segment alignment */
.Segments
{
	display: flex;
	justify-content: space-between;
	flex-wrap:wrap;
}

.Segments .Segment
{
	padding-top: 2px;
	padding-bottom: 2px;
	width: 100%;
	position:relative;
}

.Segments .Segment.Inline .Header
{
	display: inline-flex;
	width: 150px;
}

.Segments .Segment.Inline .Value
{
	display: inline-flex;
	max-width: calc(100% - 160px);
}

.Segments .Segment.Inline .IgnoreMaxWidth 
{
	width: 100%;
}

.Segments .Segment.Inline .Value .ReadOnly
{
	padding-left: 2px;
}

.Segments .Segment.Inline .Value input
{
	width: 180px;
}
.Segments .Segment.Inline .Value select
{
	width: 184px;
}
.Segments .Segment.Inline .Value textarea
{
	width: 178px;
}



/* PORTAL MENU */
.PortalMenuText 
{ 
	font-weight: bold;
	font-size: 1.25em;
	text-transform: uppercase;
}

/* PORTAL MENU SUB */
.PortalMenuSubText 
{
	font-size: 1.125em;
}

/* NAV MAIN */
.MenuItem
{
	font-weight: bold;
	font-size: 0.937em;
	text-transform: uppercase;
}

/* NAV SUB */
.MenuSubItem 
{
	font-size: 0.812em;
}

.NumericInputButtons button
{
	width: 80px;
}

.eventsOnTrip
{
	background-color: #84BDFF;
}

.EventsInCell
{ background-color: #b4d0d0; }
.FullCellEventOverlap,
.NonDrivingShift
{
	background-color: #94b0b0; 
}
.CellSelectedNoTrip
{ background-color: #84BD00; }

.statusValidated
{
    background-image: url(images/orange.png);
    background-repeat:no-repeat;
    background-position:bottom right;
}

.statusReleased
{
    background-image: url(images/yellow.png);
    background-repeat:no-repeat;
    background-position:bottom right;
}

.statusScheduled
{
    background-image: url(images/lightblue.png);
    background-repeat:no-repeat;
    background-position:bottom right;
}

.nonlocaltrip
{
    opacity: 0.5;
    filter: alpha(opacity=50); /* for IE 8*/
}

td.eventsOnTrip
{
    font-weight:bold;
    background-color:#ffb;
}

td.trip
{
    background-color:#efe;
}

td.CalendarShift
{
    background-color: rgb(240,245,240);
}

td.driverAssigned
{
    font-weight:bold;
    background-color:#fcc;
}


/* Portal button list
----------------------------------------------------------*/
#PortalButtonList
{
	margin: 0px auto 0 auto;
}

#PortalButtonList .PortalButton,
#PortalButtonList .SubPortalButton
{
	position: relative;
	margin: 4px;
	-moz-box-shadow: 4px 4px 6px #666;
	-webkit-box-shadow: 4px 4px 6px #666;
	box-shadow: 4px 4px 6px #666;
	padding: 15px;
	margin: 15px;
}

#PortalButtonList .PortalButton .imageText
{
	position: absolute;
	top: 36px;
	left: 146px;
	width: 500;
}

#PortalButtonList .SubPortalButton .imageText
{
	position: absolute;
	top: 16px;
	left: 50px;
}


#PortalButtonGrid td a:hover .imageText div:first-child { text-decoration: underline; }

#PortalButtonGrid td .Disabled .imageText,
#PortalButtonGrid td .Disabled .imageText div,
#PortalButtonGrid td .Disabled:hover .imageText,
#PortalButtonGrid td .Disabled:hover .imageText div
{ color: #646464; }

#PortalButtonGrid td .PortalButton {margin: 10px;}
#PortalButtonGrid td:first-child .PortalButton {margin-right: 20px;}
#PortalButtonGrid td:last-child .PortalButton {margin-left: 20px;}

/* Order List specifics
----------------------------------------------------------*/
#ordersPanel .search_init
{
	color: #cccccc;
}


/* Tanks specifics
----------------------------------------------------------*/

#SiteTanksTable .isScheduled { color: red; }
#SiteTanksTable .todaysReading input { font-size: 0.75em; }
#SiteTanksTable .Warning { background-color:#fcc}
#TankDipReadingsTable .deliveries input { font-size: 0.75em; }

#RemainderPanel .deliveries .Disabled, #RemainderPanel .deliveries .Disabled td { background-color: #cccccc; }
#RemainderPanel table.TFPTable tbody tr.supplementOrder, 
#RemainderPanel table.TFPTable tbody tr.supplementOrder td { background-color:#ffe000; }
.newRemainderRow { background-color: #eea; }

/* Site order specifics
----------------------------------------------------------*/
#orderListTable .OpenRow { background-color: #DCDCDC !important; }
#orderListTable .OpenRow td { background-color: inherit !important; }
#ordersPanel #unresolvedTable td.releaseOveraccounted {color: Blue !important; font-weight: bold; }
#ordersPanel #unresolvedTable td.releaseUnaccounted {color: Red !important; font-weight: bold; }

#selectGeneratorSite .selected
{
	background-color: #ddd;
}


/* Timesheet specifics
----------------------------------------------------------*/
#timesheetPanel .selected
{
	background-color: #ddd;
}

/* Work Schedule specifics
----------------------------------------------------------*/
#WorkScheduleDate { width: 84px; text-align: center; }
#WorkScheduleInputArea { height: 26px;}
#WorkScheduleTable tr th.Name { width: 100%;}

.ifrmPanel
{
	font-size: 0.75em;
}

/*This is a hack to compensate for browser zoom. Some browsers have a tendency to mess with alignments when they zoom
This hack doesn't work in IE
*/
.dataTables_scrollHead
{
	/*background-color:rgb(232,232,232);*/
}

/* Info message box */
.InfoMessageBox
{
	background-color: #84BD00;
	padding: 2px;
}
.InfoMessageBox .Message { color: #003057; background-color: #84BD00; }
.InfoMessageBox .Close { color: #222222; float: right; }


/* Automatic input validation errors 
-----------------------------------------------------------*/
.field-validation-error { color: red; }
.input-validation-error
{
	border: 1px solid #ff0000;
	background-color: #ffeeee;
}

.validation-summary-errors { color: #ff0000; }
.validation-summary-errors ul { list-style: none; padding: 0; }

/* Selectable
----------------------------------------------------------*/

#selectable .ui-selecting td { color: #FFF; background-color: #898989; }
#selectable .ui-selected td { color: #FFF; background-color: #898989; }

/* Route Navigation
----------------------------------------------------------*/
.navPanel 
{
	 background-color: #fff;
}
/* Route details
----------------------------------------------------------*/
#stopdetails
{
	background-color: #fff;
}

#routemap
{
  background-color: #fff;
}

#routemap th
{ 
	background:#5c87b2; color:#fff; 
}

#stops
{
	background-color: #fff;
}

/* Terminal calendar */
.terminalCalendarTable, #terminalCalendarDetailsPanel
{
	background-color: #fff;
}

#terminalCalendarDetailsPanel .terminalCalendarDetailsTitle
{
   font-weight:bold;
   color: #a0a0a0;
}

/* Key Figures
----------------------------------------------------------*/
.keyfigures
{
	background-color: #fff;
}

.kpigraph .graphterm     { background-color: #0D2; color: #000; }
.kpigraph .graphtrans    { background-color: #099; color: #FFF; }
.kpigraph .graphhandle   { background-color: #02D; color: #FFF; }
.kpigraph .graphmax      { background-color: #F00; }
.kpigraph .graphempty    { background-color: #FFF;  }


/* Change index
----------------------------------------------------------*/
#changeindex
{
	background-color: #fff;
}

.textMessage
{
	color: #fff;
	background: #666666 url(images/ui-bg_diagonals-medium_20_666666_40x40.png) 50% 50% repeat; opacity: .50;filter:Alpha(Opacity=50);
}

 
/* Call Center
----------------------------------------------------------*/
#callcentermap
{
    background-color: #fff;
}

/* Roles*/
#canvasContainer
{
	background-color:#fff;
	color:Gray;    
}

/* Driver Schedule */
.driverScheduleDayShift
{
    background-color: #ae9;
}

.driverScheduleNightShift
{
    background-color: #8a7;
}

.driverScheduleDayOff
{
    background-color: #ff8;
}

.driverScheduleTraining
{
    background-color: #a47;
}

.driverScheduleRest
{
    background-color: #88f;
}

.driverScheduleSick
{
    background-color: #f88;
}

.driverScheduleOther
{
    background-color: #d8d;
}

.driverScheduleExtraNightShift
{
    background-color: #282;
}

.driverScheduleExtraDayShift
{
    background-color: #5c4;
}

#schedulePanel table tfoot tr:nth-child(odd)
{
    background-color: #eee;
}

/* Log On
----------------------------------------------------------*/

.LogonPanel
{
	background-color: transparent;
}

/* Dash board container */
.containerTitle b
{
	color: #aeaeae;
	font-size: 1em;
}

#addView:hover
{
	background-color:#ccc;
}

.DashboardButtons a
{
	color:#8e8e8e;
} 

.DashboardButtons li
{
	color:#8e8e8e;
}

.DashboardButtons a:hover, .DashboardButtons li:hover
{
	color:#84BD00;
}

ul.DropDown, ul.SubMenu 
{
	background-color:#ccc;
}

/* Reports */
#reports
{
	background-color: #fff;
}

/* Site */
#customerTable th
{
	color: #646464;
}

/* Greenergys specific customer portal */
h1.Welcome
{
	text-align: center;
	font-size: 1.5em;
	margin-bottom: 30px;
}
table#iFrameAndMenuDivider
{
	margin-left:auto;
	margin-right:auto;
}

table#iFrameAndMenuDivider th.OptionsHeader
{
	padding-bottom: 15px;
}

table#iFrameAndMenuDivider td
{
	text-align:left;
}

table#iFrameAndMenuDivider td#MenuSection
{
	width: 600px;
    vertical-align: top;
} 

#PortalButtonGrid.SpecificCustomerPortal
{
	position: relative;
	top: 0px;
	left: 15px;
	width:100%;
}

#PortalButtonGrid.SpecificCustomerPortal td
{
	text-align: left;
}

#GreenergyCustomerWelcomeScreen th
{
	font-size: 1.5em;
	text-align: center;
	color: #000050; 
}

#GreenergyCustomerWelcomeScreen td
{
	font-size: 0.937em;
	text-align: center;
	color: #000050; 

}

div#NotificationTable
{
	margin-top:25px;
	padding-left:25px;
}

div#NotificationTable table td
{
	font-weight: bold;
	height: 30px;
	text-align: left;
}


#GreenergyCustomerWelcomeScreen td#InfoSection
{
	vertical-align: top;
}

#GreenergyCustomerWelcomeScreen td#InfoSection div#ContactsTable td
{
	text-align:center;
}

#GreenergyCustomerWelcomeScreen #NotificationTable table
{
	width:600px;
	border: 2px solid #000040;
}

#GreenergyCustomerWelcomeScreen #UsefulLinksTable table
{
	position: relative;
	margin-left:30px;
	margin-top: 30px;
	width:500px;
	border: 2px solid #000040;
}

#GreenergyCustomerWelcomeScreen #ContactsTable table
{
	width:500px;
	border: 2px solid #000040;
	left: 0px;
	margin-left: 30px;
}

#GreenergyCustomerWelcomeScreen td.NotificationEntry
{
	font-weight: normal;
	padding-bottom: 5px;
	border-bottom-style: solid;
	border-width: 0px;
}
#GreenergyCustomerWelcomeScreen span.NotificationDate
{
	font-weight: bold;
}

.SpecificCustomerPortal.Header, .SpecificCustomerPortal.SubHeader
{
	background-color: #84BD00; 
	
}

/* override jquery ui border color - hack for making button seem more click-able*/
#AddOrderDialog .PotConfiguration button.Next.ui-state-default, #AddOrderDialog .PotConfiguration button.Prev.ui-state-default
{
	border-color: #a3a3a3; 
}

#CustomerInvoice>table>tbody>tr.TotalBalanceRow>td { border-bottom-color: #003057; }


#MileageCalculatorPanel .TFPTable tfoot tr,
#MileageCalculatorPanelV2 .TFPTable tfoot tr,
#ScheduledMileagePanel .TFPTable tfoot tr
{
	background-color: #dbdbdb; 
}
#MileageCalculatorPanel td { border-right-color: #dbdbdb; }
#MileageCalculatorPanel #TableWrapper tbody td { border-right-color: #fff; }
#MileageCalculatorPanel tbody td.BorderRight { border-right-color: #dbdbdb;  }
#MileageCalculatorPanel th { border-right-color: #003057; }

#BulletinBoardPanel #ThreadsContainer h2 { text-align: center; }
#BulletinBoardPanel .ThreadPanel { background-color: #FFF; }

#BulletinBoardPanel .BulletinPostTable th:first-child { text-align: left; padding-right: 8px; }
#BulletinBoardPanel .BulletinPostTable th
{
	border-bottom: 1px solid #ccc;
	padding: 2px;
	color: #646464;
}
#BulletinBoardPanel .BulletinPostTable td
{
	padding: 2px;
}

#BulletinBoardPanel .CommentLeft { border: 1px solid #84BD00; }
#BulletinBoardPanel .CommentLeft .Header th { background-color: #84BD00; color: #444; }
#BulletinBoardPanel .CommentRight { border: 1px solid #003057; }
#BulletinBoardPanel .CommentRight .Header th { background-color: #003057; color: #FFF; }

/* Fullcalendar override - don not show time in bold */
.fc-event-time { font-weight: normal !important; }

.DropDownFilter
{
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 40px;
	padding-right: 40px;

	-moz-box-shadow: 4px 4px 6px Black;
	-webkit-box-shadow: 4px 4px 6px Black;
	box-shadow: 4px 4px 6px Black;
	color: White;
	display: flex;
	flex-direction: row;
	justify-content:flex-start;
	flex-wrap: wrap;
	align-items: flex-start;
	align-content: space-around;
}

.DropDownFilter .ui-multiselect,
.DropDownFilter select,
.DropDownFilter input
{
	padding: 2px 0 2px 4px;
}

.DropDownFrame
{
	position: absolute;
	width: 100%;
	left: 0px;
	top: 48px;
	z-index: 40;
}


.DropDownFrame .FilterItem
{
	margin-left: 2px;
	margin-right: 2px;
	margin-bottom: 2px;
}

#PortalButtonList a
{
	display: block;
	width: 500px;
}

/*----------------------------------------------------------
- Logon
----------------------------------------------------------*/

#logon
{
	position: absolute;
	top: 250px;
	left: 10px;	
	background: none;
	width: 250px;
	max-width: none !important;
}

/*----------------------------------------------------------
- Buttons
----------------------------------------------------------*/

#logon .buttons
{
	position: relative;
	right: -13px;
}

/*----------------------------------------------------------
- Input fields
----------------------------------------------------------*/

#UserName:-webkit-autofill, #Password:-webkit-autofill
{
	-webkit-box-shadow: 0 0 0 1000px white inset;
}

#UserName, #Password, #NewPassword, #NewPasswordRetype
{
	border: 1px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 4px;
	font-size: 0.75em;
	padding: 4px 7px;
	outline: 0;
	-webkit-appearance: none;
	margin: 5px;
	background: rgb(255,255,255) !important;
	padding: 5px;
	width: 242px;
}

#UserName:focus, #Password:focus
{
	border-color: rgb(1,54,98);
}




.DateIntervalPicker, .DatePickerWrapper
{
	display: inline-block;
	white-space: nowrap;
	padding-left: 2px;
	padding-right: 2px;
}

.DatePickerButton
{
	margin-left: 1px;
	margin-right: 1px;
	padding-left: 2px;
	padding-right: 2px;
}

.ui-icon.ui-icon-inline
{
	display: inline-block;
}

.DropDownFrame #DatePickerHoverButton
{
	background-image: url(../Areas/Core/Content/Images/ui-icons_ffffff_256x240.png);
}

.DatePickerButtonGroup
{
	position: absolute;
	z-index: 51;
	padding: 5px;
	-moz-box-shadow: 4px 4px 6px #666;
	-webkit-box-shadow: 4px 4px 6px #666;
	box-shadow: 4px 4px 6px #666;
}

.AjaxLoadingPopup .TFPPanel { padding: 10px; }

.DateSelector, input.hasDatepicker { width: 7em; }
.TimeSelector, .TimeInput { width: 3em; }
.DateTimeSelector, input.hasDatepicker.DateTimeSelector { width: 8.5em; }

.RightAligned { text-align: right; }

.Centered { text-align: center; }

/* Other icon colours */
.ui-icon.ui-icon-red, .ui-widget-content .ui-icon.ui-icon-red
{
  background-image: url("images/ui-icons_cd0a0a_256x240.png");
}
.ui-widget-content.ui-icon.ui-icon-green, .ui-widget-content .ui-icon.ui-icon-green, .ui-icon.ui-icon-green
{
  background-image: url("images/ui-icons_00a300_256x240.png");
}
.ui-widget-content.ui-icon.ui-icon-yellow, .ui-widget-content .ui-icon.ui-icon-yellow, .ui-icon.ui-icon-yellow
{
  background-image: url("images/ui-icons_ef8c08_256x240.png");
}
.ui-widget-content.ui-icon.ui-icon-grey, .ui-widget-content .ui-icon.ui-icon-grey, .ui-icon.ui-icon-grey
{
  background-image: url("images/ui-icons_888888_256x240.png");
}

#MainPortalButtonGrid, #PortalButtonGrid
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
}

#PortalButtonList
{
	top: 50px;
	left: 0px;
	width: 100%;
}

#PortalButtonList .PortalAnchor, #PortalButtonList .PortalButton, #PortalButtonGrid .PortalAnchor, #PortalButtonGrid .PortalButton
{
	width: 200px;
	height: 200px;
	padding: 0px;
	margin: 0px;
	box-shadow: none;
	border-radius: 0px;
}

#PortalButtonList .PortalAnchor, #PortalButtonGrid .PortalAnchor
{
	padding: 30px;
}

#PortalButtonList .PortalButton, #PortalButtonGrid .PortalButton
{
	position: relative;
	background-image: none;
	background-color: rgb(78,115,127);
}

/* Home button icons http://www.entypo.com/ */
/*#PortalButtonList a[href$="/RoutesView"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/address.svg'); }
#PortalButtonList a[href$="/OrderBooking"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/clipboard.svg'); }
#PortalButtonList a[href$="/CustomerService"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/man.svg'); }
#PortalButtonList a[href$="/Forecast"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/rainbow.svg'); }
#PortalButtonList a[href$="/OrderTrackAndTrace"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/paper-plane.svg'); }
#PortalButtonList a[href$="/RoutesView"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/address.svg'); }
#PortalButtonList a[href$="/StandardKpi"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/open-book.svg'); }
#PortalButtonList a[href$="/SiteManager"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/shop.svg'); }
#PortalButtonList a[href$="/Documents"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/documents.svg'); }
#PortalButtonList a[href$="/Orders"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/news.svg'); }
#PortalButtonList a[href$="/TrailerTracking"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/unread.svg'); }
#PortalButtonList a[href$="/MobileWeb/Index"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/tablet.svg'); }
#PortalButtonList a[href$="/Emission"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/air.svg'); }
#PortalButtonList a[href$="/TerminalLoading"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/shop.svg'); }
#PortalButtonList a[href$="/GeocodingPortal"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/direction.svg'); }
#PortalButtonList a[href$="/Geopositioning"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/direction.svg'); }
#PortalButtonList a[href$="/TransportPaymentView"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/credit.svg'); }
#PortalButtonList a[href$="/MultiLegBooking"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/login.svg'); }
#PortalButtonList a[href$="/MSReports"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/text-document.svg'); }
#PortalButtonList a[href$="/SaverOrders"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/news.svg'); }
#PortalButtonList a[href$="/ParcelsFk"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/news.svg'); }
#PortalButtonList a[href$="/InvoicesFK"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/uninstall.svg'); }
#PortalButtonList a[href$="/Loads"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/publish.svg'); }
#PortalButtonList a[href$="/Rates"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/line-graph.svg'); }
#PortalButtonList a[href$="/TrpCloudService/IndexTester"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/lab-flask.svg'); }
#PortalButtonList a[href$="/TrpCloudService/IndexServers"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/drive.svg'); }
#PortalButtonList a[href$="/TrpCloudService/IndexActivity"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/rocket.svg'); }
#PortalButtonList a[href$="/TrpCloudService/IndexRoutePlanning"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/notification.svg'); }
#PortalButtonList a[href$="/DanishCrown"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/flower.svg'); }
#PortalButtonList a[href$="/DanishCrown/TransporterIndex"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/compass.svg'); }
#PortalButtonList a[href$="/Assets"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/tag.svg'); }
#PortalButtonList a[href$="/Assets/AssetManager"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/sports-club.svg'); }
#PortalButtonList a[href$="/Assets/Registration"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/pencil.svg'); }
#PortalButtonList a[href$="/Assets/UnnamedAssets"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/shareable.svg'); }
#PortalButtonList a[href$="/VmiAnalytics"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/flat-brush.svg'); }
#PortalButtonList a[href$="/VisitFrequency"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/remove-user.svg'); }
#PortalButtonList a[href$="/ContainerPositioning"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/pencil.svg'); }
#PortalButtonList a[href$="/DataWarehouseReports"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/home.svg'); }
#PortalButtonList a[href$="/Rcc"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/flag.svg'); }
#PortalButtonList a[href$="/Launcher"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/arrow-with-circle-right.svg'); }
#PortalButtonList a[href$="#"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/dots-three-horizontal.svg'); }*/

/* Admin button icons http://www.entypo.com/ */
/*#PortalButtonGrid a[href$="/ManageUsersIndex"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/users.svg'); }
#PortalButtonGrid a[href$="/ManageGroupsIndex"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/grid.svg'); }
#PortalButtonGrid a[href$="/ManageRolesIndex"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/mask.svg'); }
#PortalButtonGrid a[href$="/Settings"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/tools.svg'); }
#PortalButtonGrid a[href$="/UserActivities"] .PortalButton .ButtonImage { background-image: Url('../Content/images/Icons/Orange/v-card.svg'); }*/

#PortalButtonList .PortalButton .ButtonImage, #PortalButtonGrid .PortalButton .ButtonImage
{
	position: absolute;
	z-index: 2;
	background-image: Url('../Content/images/LogoA60.svg');
	background-repeat: no-repeat;
	
	width: 160px;
	height: 125px;
	margin-left: 20px;
	margin-top: 35px;
}

.PortalMenuText
{
	position: absolute;
	z-index: 3;
	top: 55px;
	font-size: 18px;
	font-weight: 200;
	width: 100%;
	text-align: center;
	margin-top: 25px;
}

#PortalButtonList .PortalButton, #PortalButtonGrid .PortalButton
{
	border: none;
}

.FadeText
{
	position: absolute;
	padding: 5px;
}

/* Custom Fields */
.CustomFields
{
	position: relative;
	display: table;
}

/* make sure textarea and input have same width */
.CustomFields textarea, .CustomFields input
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.CustomFields .CustomField
{
	display: table-row;
}

.CustomFields .CustomField>*
{
	padding-bottom: 4px;
}

.CustomFields .CustomField .Header
{
	display: table-cell;
	width: 35%;
	vertical-align: middle;
}

.CustomFields .CustomField .Value
{
	display: table-cell;
}

.CustomFields .CustomField .Value>*
{
	width: 100%;
}

.CustomFields .CustomField .Value textarea
{
	vertical-align: middle;	
	resize: vertical;
}



/*----------------------------------------------------------
- Mobile logon
----------------------------------------------------------*/

@media only screen and (max-device-width: 480px)
{
	body
	{
		background-position: 0px 50px;
	}
	
	#logon
	{
		position: absolute;
		width: 85% !important;
		margin-left: -52%;
		left: 50%;	
		top: 55px;
		background: none;
		visibility: hidden;
	}

	#logon table td:first-child
	{
		color: #84BD00;
	}

	h1
	{
		color: rgb(0,0,0);
	}

	#logon .h4, 
	#logon .h10
	{
		margin-top: 8px;
	}

	#NewPassword
	{
		background: none;
	}

	/*----------------------------------------------------------
	- Buttons
	----------------------------------------------------------*/

	#logon .buttons
	{
		position: relative;
		left: 0px;
		width: 100%;
	}

	#logon .ui-button
	{
		width: 100%;
		height: 50px;
		font-size: 1.5em !important;
		-moz-border-radius: 10px !important;
		-webkit-border-radius: 10px !important;
		-khtml-border-radius: 10px !important;
		border-radius: 10px !important;
	}

	/*----------------------------------------------------------
	- Input fields
	----------------------------------------------------------*/

	#logon input[type='text'], 
	#logon input[type='password']
	{
		height: 46px !important;
		font-size: 1.5em !important;
	}

	#UserName, #Password
	{
		background: rgb(255,255,255) !important;
	}

	#logon input:-webkit-autofill
	{
		-webkit-box-shadow: 0 0 0 100px white inset;
	}

	#logon span
	{
		margin-left: 5px;
	}

	#logon input,
	#logon #ChangeServerUrlForNativeApp
	{
		border: 1px solid #ccc;
		-moz-border-radius: 10px !important;
		-webkit-border-radius: 10px !important;
		-khtml-border-radius: 10px !important;
		border-radius: 10px !important;
		font-size: 1.5em;
		padding: 4px 7px;
		outline: 0;
		-webkit-appearance: none;
		margin: 5px;
	}

	input:focus 
	{
		border-color: rgb(1,54,98);
	}

}

@media only screen and (max-device-width: 480px) {

	#PortalButtonList .PortalAnchor, #PortalButtonList .PortalButton, #PortalButtonGrid .PortalAnchor, #PortalButtonGrid .PortalButton {
		width: 100px;
		height: 100px;
		padding: 0px;
		margin: 0px;
		box-shadow: none;
		border-radius: 0px;
	}
	
	#PortalButtonList .PortalButton .ButtonImage, #PortalButtonGrid .PortalButton .ButtonImage 
	{
		position: absolute;
		z-index: 2;
		background-image: Url('../Content/images/LogoA60.svg');
		background-repeat: no-repeat;
		width: 80px;
		height: 62px;
		margin-left: 10px;
		margin-top: 17px;
	}
	.PortalMenuText 
	{
	    position: absolute;
	    z-index: 3;
		top: 27px;
		font-size: 9px;
		font-weight: 200;
		width: 100%;
		text-align: center;
		margin-top: 12px;
	}

	.PortalMenuText {
	    font-weight: bold;
		font-size: 0.6em;
		text-transform: uppercase;
	}

	#PortalButtonList .PortalAnchor, #PortalButtonGrid .PortalAnchor 
	{
		padding: 15px;
	}

}
/* Mobile adaption*/
body.MobileMode .TopMenu .MenuClass
{
	display: none;
}

body.MobileMode.NotTwpMain .TopMenu .AdminEntry
{
	display: none;
}

body.MobileMode #header
{
	min-width: initial;
}

/* Make multiselect filters blend in to (un)check-all buttons in multiselect */
.ui-multiselect-filter 
{
	margin-bottom: 5px;
	font-size: 0.9em;
}

.ui-multiselect-filter input
{
	border: 0;
	padding: 0;
	margin: 0 0.4em 0 0.2em;
	width: 95%;
}

.dataTables_wrapper.FullScreen
{
	position: fixed;
	top: 100px;
	left: 10px;
	right: 10px;
}

.LargeDataSizeWarning{	
	color: red;
}

.DataTable_Footer_Bold{	
	font-weight: 800;
}