html{height: 100%}
body{
    font-size: 12px;
    font-family: Verdana, Tahoma, Arial, "Helvetica Neue", Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: #ffffff;
}

#downloadGeofenceUrl 
{
    display: inline-block;
    font-size: 0.8em;
    text-decoration: underline;
    margin-top: 4px;
}

#downloadGeofenceUrl:hover
{
    text-decoration: none;
}

#downloadGeofenceLoadImage 
{
    width: 16px;
    height: 16px;
    display: none;
}

#header 
{
    height: 75px;
    background-repeat: repeat-x;
}
#logo
{
    float: left;
    width: 190px;
    height: 60px;
    margin: 5px;
    background-image: url(/Images/logos/mobiletrack_logo_150_transperent.gif);
    background-position: center;
    background-repeat: no-repeat;
}
#menu
{
    padding: 34px 0 5px 0;
}
button, .button
{
    border: solid 1px #639A63;
    color: #ffffff;
    background-image: url(/Images/fillers.ashx?size=75&start=7fa540&end=1d4616);
    padding: 5px 10px;
    cursor: pointer ;
}
.button a{
    color:#ffffff;
}

button:disabled 
{
    color: red;
    background-image: initial !important; /* url(); initial */
    background-color: black;
    cursor: not-allowed !important;
}

button:enabled
{
    color: #ffffff;
    background-image: url(/Images/fillers.ashx?size=75&start=7fa540&end=1d4616);
    background-color: white;
    cursor: default;
}

button:hover, .button:hover, button:focus, .button:focus
{
    /* background-image: url(/Images/fillers.ashx?size=75&start=91d231&end=436c3d); */
}

.infobutton
{
    border: 0;
    cursor: help;
}

#infopanel
{
    text-align: right;
    float: right;
    margin: 5px;
}

.objectlist, .historylist
{
    position: relative;
    top:0px;
    width: 213px;
    padding: 2px 2px 10px 3px;
    max-height: 601px;
    overflow: auto;
    z-index: 4;
}

#gpsobjectlistfilter
{
    position: absolute;
    left:0px;
    display: none;
}

.historylist
{
    width: 340px;
}

#gpsobjectlist, #gpsobjectinfo, #alertslist
{
    float: left;
}

#gpsobjectinfo
{
    display: none;
}

.objectitem, .historyitem
{
    width: 190px;
    min-height: 44px;
    margin-top: 1px;
    padding: 2px;
    border-radius:3px;
    background-color: White;
    opacity: 1;
    cursor: pointer;
}

.animatedListItem_White
{
    animation-name: FadeInOut_White;
    animation-iteration-count: 1;
    animation-duration: 3s;
    animation-play-state:paused;
}

@keyframes FadeInOut_White
{
  0%   {background-color: white;}
  50%  {background-color: gold;}
  100% {background-color: white;}
}

.animatedListItem_LightGreen
{
    animation-name: FadeInOut_LightGreen;
    animation-iteration-count: 1;
    animation-duration: 3s;
    animation-play-state:paused;
}

@keyframes FadeInOut_LightGreen
{
  0%   {background-color: #daf7a6;}
  50%  {background-color: gold;}
  100% {background-color: #daf7a6;}
}

.alertlisttitle
{
    font-weight:bold;
    color: Yellow;
    background-color: Red;
}

#details
{
    padding-left: 42px;
}

.historyitem
{
    min-height: 20px;
    width: 317px;
    cursor: default;    
 /* MA: do NOT fix height since MUST be resizable! */
 /* max-height: 400px; */
    overflow: auto;
}
.objectimage
{
    width: 32px;
    height: 32px;
    margin: 5px;
    float: left;
}
.objecttitle
{
    font-weight: bold;
    color: #000000;
}
.objecttitleupdate
{
    font-weight: bolder;
    color: #207f0f;
}
.speedometer
{
    width: 190px;
    height: 100px;
}

.map
{
    border-top: solid 1px black;
    position: absolute;
    width: 100%;
    height: 100%;
    top:76px;
    left: 0px;
    z-index: 1;
    
}

.tilemenucontainer
{
    min-height: 600px;
    margin:  20px 100px;
    border: 1px solid #639A00;
    overflow:hidden;
}
.tilemenutitle
{
    color: #ffffff;
    border: 1px solid #639A00;
    background-image: url(/Images/fillers.ashx?size=75&start=6e8f3e&end=ffffff);
    padding: 8px;
    display: inline block;
    font-size: 1.5em;

    margin-bottom: 20px;
}

.tilemenu
{
    margin:0px 25px 25px;
    padding:10px 25px 20px 20px;
    font-size: 11px;
}
.tilemenuitemcontainer
{
    border: 1px solid #639A00;
    float:left;
	margin:0px 5px 15px;
	padding:10px 20px 20px 20px;
	font-size: 11px;	
	height: 110px;
}

.tilemenuitemtitle
{
    color: #ffffff;
    border: 1px solid #639A00;
    background-image: url(/Images/fillers.ashx?size=75&start=6e8f3e&end=ffffff);
	padding:7px 7px 7px 23px;
	font-weight: bold;
	font-size: 12px;
	margin:-11px -21px 15px -21px;
}

.tilemenuitem
{
    border-top: solid 2px #fff;
    width: 90px;
    text-align: center;
    cursor: pointer;
    margin: 3px 2px;
}

.tileitem, .tilemenuitem
{
    float: left;
}

.tilemenuitem img
{
    display: block;
    width: 48px;
    height: 48px;
    margin: 0 auto;
}
.tilemenuitem:hover
{
     border-top: solid 1px #efefef;
}

.logon
{
    margin: 50px auto;
    padding: 0;
    width: 450px;
}
.logonbox
{
    padding: 50px;
    border: 1px solid #77D5F7;
}

a{
	text-decoration: none;
	color:#000000;
	display:inline;   
}
a img{
    /*IE fix*/
    border:none;
}

table {
    width: 100%;
    border: 0px;
    margin: 0px;
}

th {
    text-align: left;
}
td
{
    padding-left: 2px;
    vertical-align: middle;
}

p{margin-left: 20px;}

select#Owner 
{
    max-width: 280px;
}

.editor-label,.editor-field
{
	padding-top: 5px;
	padding-right: 10px;
    margin: 2px 0 5px 20px;
	font-size: small;
	color: #646464;
}

.label-float-left
{
    float: left;
    width: 150px;
    margin-bottom: 10px;
    vertical-align: middle;
}
.cbHistory
{
    display: none;
    margin: 0;
}

.closebutton
{
    width: 14px;
    height: 14px;
    float: right;
    cursor: pointer;
    background-image: url(/images/icons/close.png);
    background-repeat: no-repeat;
    z-index: 1;
}
.dummy-image { width: 14px; height: 14px; vertical-align: top; border: none; }

.alpha30, .alphaRed
{
    background-image: url('/content/images/alpha30.png');
    background-repeat: repeat;
    background-attachment: fixed;
}
.alphaRed
{
    background-image: url('/images/alertheader.gif');
}
.ui-corner-tl, .ui-corner-all, .button, .tilemenucontainer, .tilemenuitemcontainer, .tilemenutitle, .tilemenuitemtitle
{
    border-top-left-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
}
.ui-corner-tr, .ui-corner-all, .button, .tilemenucontainer, .tilemenuitemcontainer, .tilemenutitle, .tilemenuitemtitle
{
    border-top-right-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
}
.ui-corner-bl, .ui-corner-all, .button, .tilemenucontainer, .tilemenuitemcontainer
{
    border-bottom-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
}
.ui-corner-br, .ui-corner-all, .button, .tilemenucontainer, .tilemenuitemcontainer
{
    border-bottom-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff0000;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid
{
    display: none;
}
.inline-edit-error{
    background-color: #FFA3A3;
}
/* Beheer menu
-------------------------------*/
div.menu
{
    display: inline-block;
    border-bottom: 1px solid #6e8f3e;
    border-left: 1px solid #6e8f3e;
    border-right: 1px solid #6e8f3e;
    margin-left: 10px;
    margin-bottom: 10px;
    float: left;
}
div.menu .title 
{
    background-image: url(/Images/fillers.ashx?size=75&start=6e8f3e&end=ffffff);
    color: White;
    padding: 5px 0 5px 15px;
    font-size: 1.1em;
    font-weight: bold;
}
div.menu img{
    width: 48px;
    height: 48px;
    padding: 10px 20px 7px 20px;
}
div.menu .item
{
    float: left;
    width: 100px; 
    height: 100px;
    margin: 5px;
    font-size: 11px; 
    text-align: center;
}
div.menu .item-selected
{
    padding-top: 8px;
}

div.mt_iconpicker 
{
    width: 248px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.mt_iconpicker .mt_iconitem {
    margin: 1px;
    padding: 12px;
    background-color: #DDD;
    display: inline-block;
    height: 32px;
    width: 32px;
    background-position: center;
    background-repeat: no-repeat;
}

.mt_iconpicker .mt_iconitem.active {
    background-color: #444;
}

.mt_iconpicker .mt_iconitem:not(.active):hover {
    background-color: #F0F0F0;
    cursor: pointer;
}

.mt_iconpicker .mt_iconitem:active {
    transform: scale(0.8);
}