body
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif;
  background-image: url('img/Background.jpg');
  background-position:center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding:0;
  margin:0;
}

.HeaderLine
{ background-color: rgba(160,220,255,0.7);
  margin:0;
/*  border-bottom: 2px solid whitesmoke;*/
  box-shadow: 0px 10px 30px black;
}

.HeaderLine a
{ text-decoration: none;
  color: black;
}

.Header
{ width: 1200px;
  height: 100px;
  margin: 0 auto;
  background-image: url('img/LeftTruck.png'),url('img/RightTruck.png');
  background-position:left,right;
  background-repeat: no-repeat;
}
.Header h1
{ margin: 0px;
  padding: 10px 0;
  font-size:2.5em;
  color: #800;
  text-align:center;
}

.Header_Logged
{ width:1200px;
  height:40px;
  margin:0 auto; }

/************************************************************/
.Content
{ width: 1200px;
  height: calc(100vh - 40px);
  margin:0px auto;
  position:relative; 
/*  background-color: rgba(255,255,255,0.6); */
}

.EditImage
{ width: 80px;
  height:110px;
  float: left;
  margin:0 0 0 5px;
  border-top   :2px solid darkgrey;
  border-right :2px solid whitesmoke;
  border-bottom:2px solid whitesmoke;
  border-left  :2px solid darkgrey;
  overflow: hidden;
  text-align:center;
  position: relative;
}

.EditImage img
{ height: 100%; 
  min-height:100%; 
  position:relative;
  left:50%;
  transform: translatex(-50%);
}

.EditImage button
{ visibility:hidden; 
  position: absolute; 
  top:0; right:0; 
}

.EditImage:hover button
{ visibility:visible; }

.EditImage .AddImg
{ width:100%;
  height:90px;
  color: darkgrey;
  font-size: 1.1em;
  text-align:center;
  text-transform: uppercase;
  font-weight:bold;
  line-height:140%;
  cursor:pointer;
  padding:10px 0 0 0;
}

.EditImage .AddImg:hover
{ color:gray; }

.AddFile
{ cursor:pointer;
  text-align: center;
  padding:2px;
  margin:0 1px;
}

.AddFile:hover
{ color: darkred;
  background-color:rgba(0,0,0,0.2); }
  
.FileExt
{ float: left; 
  padding: 2px; } 
  
.FileLink 
{ cursor:pointer; }

.FileLink:hover
{ color: #e00; }

/*********************************************************/
.FlagCountry
{ width: 25px;
  height: 18px;
  border: 1px inset #999;
/*  background-color: rgb(240,240,240);*/
  background-size: 100% 100%;
  float: left;
}

/**********************************************************/
/*
.Stations 
{ margin-top: 5px;
  float:left;
  width: 750px;
}
*/
.Station
{ width:415px; 
  border:1px solid grey; 
  margin:-1px 0 0 5px; 
  clear:both;
}

.Station.Loading
{ background-color: Aquamarine;
}

.Station.Unloading
{ background-color: #ffc8b3;;
  display: none; }

.LoadAction
{ list-style:none;
  padding: 0;
  margin:5px 5px 0px 5px;
  z-index:1;
}

.LoadAction li
{ float:left;
  display: block;
  padding:2px;
  border: 1px solid grey;
  text-align:center;
  border-radius:8px 8px 0 0;
  margin:0px 8px -1px 8px;
  padding: 2px 10px;
  background-color: Aquamarine;
  cursor: pointer;
  position: relative;
}

.LoadAction li:last-child
{ float:right; 
  background-color: #ffc8b3;
}

.LoadAction li.Select:first-child
{ border-bottom-color: Aquamarine; }

.LoadAction li.Select:last-child
{ border-bottom-color: #ffc8b3; }

.LoadAction li:hover
{ color: #e00; }

.LoadAction .Loading
{ background-color: Aquamarine; }

.LoadAction .Unloading
{ background-color: #ffc8b3; }


.LoadAction>div.Edit
{ border:1px solid grey;
  margin:-1px 2px 0 2px;
}

button[name='NewCln']
{ position: absolute;
  bottop:55px;
  right:5px;
}
.ClnRating
{ margin: 15px 0 0 5px;
  padding: 2px 5px;
  float:left;
  cursor: pointer;
/*  display: none;*/
}

.ClnRating:hover
{ color: #e00;
  background-color: #ddd;
  border-radius: 5px;
}
/**********************************************************/

.VehicleReq
{ width:137px;
 /* border:1px solid grey;*/
  padding-top:3px;
  z-index:1;
  height: 30px;
  position:absolute;
  left:5px;
  top:50px;
}

.VehicleReq h1.leg
{ padding: 2px 0;
  text-align: center;
  margin:3px 0 0 0;
  background-color: #ded;
  color: black;
  cursor: pointer;
  border-radius: 8px;
  border:1px outset grey;
  font-size:12px;
}

.VehicleReq h1.leg:hover
{ color: red; }

.VehicleReq h1.Select
{ background-color: #dde; 
  border-radius: 8px 8px 0 0;
}

.VehicleReq ul
{ display: none; 
  list-style:none;
  margin:0 0 2px 0;
  padding:0 0 2px 0;
  background-color: whitesmoke;
  border: 1px solid grey;
  width: 135px;
}

.VehicleReq ul.Select
{ display: block; 
  position: absolute;
  top:40px;
}

.VehicleReq li
{ display: block;
  margin-top:2px;
}

.VehReqText
{ width:140px;
/*  border:1px solid grey;*/
  padding:0;
  height: 43px;
  position:absolute;
  left:145px;
  top:58px;
  overflow: hidden;
  z-index:1;
}

.VehReqText:hover
{ height:auto;
  background-color:rgba(255,255,255,0.8);
}

.CoursePoint
{ width: 345px; 
  float:left;
  margin:5px 3px;
  border:1px solid grey;
}

.CoursePoint h1
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif; 
  background-color:AntiqueWhite;
  margin:0;
  padding:2px 0;
  text-align:center;
}

.TotalField { height:15px; background-color:white; text-align:right; padding:2px;}
.ChangeCurrency { width:52px; }

/**********************************************************/
.LangData
{ border:1px solid grey;
  margin:-1px 0 0px 5px;
  padding-bottom:5px;
  clear:both;
}
  
.LangData.BG { background-color: Aquamarine; }
.LangData.EN { background-color: #ffc8b3; }

.Lang
{ list-style:none;
  padding: 0;
  margin:5px 5px 0px 5px;
  z-index:1;
}

.Lang li
{ float:left;
  display: block;
  padding:2px;
  border: 1px solid grey;
  text-align:center;
  border-radius:8px 8px 0 0;
  margin:0px 8px -1px 8px;
  padding: 2px 10px;
  background-color: Aquamarine;
  cursor: pointer;
  position: relative;
}

.Lang li:last-child
{ float:right;
  background-color: #ffc8b3;
}

.Lang li.Select:first-child { border-bottom-color: Aquamarine; }
.Lang li.Select:last-child  { border-bottom-color: #ffc8b3; }
.Lang li:hover { color: #e00; }

.Lang .BG { background-color: Aquamarine; }
.Lang .EN { background-color: #ffc8b3; }

/********************************************************/
.LangSwitch
{ position: absolute;
  top:0px;
  list-style:none;
  z-index:1;
  width:40px;
  padding:0;
  margin:0;
}

.LangSwitch li
{ border-top:1px solid grey;
  border-bottom:1px solid grey;
  margin: 5px 0;
  padding:0px 3px;
  cursor: pointer;
  width:25px;
  text-align: center;
  transition: width 0.3s;
}

.LangSwitch li.Select { width: 40px; }

.LangSwitch li.BG { background-color: Aquamarine; }
.LangSwitch li.EN { background-color: #ffc8b3; }

.LangSwitch.Left { left: 0; }
.LangSwitch.Right { right:0; }

.LangSwitch.Left li { border-right:1px solid grey;  border-radius:0 8px 8px 0; float: left;}
.LangSwitch.Right li { border-left:1px solid grey;  border-radius:8px 0 0 8px; float: right;}

/********************************************************/
#PaymentPeriod
{ margin-top:5px; float:left;
}

/********************************************************/
.Months
{ list-style: none;
  padding:0;
}

.Months li
{ float: left;
  padding: 3px;
  margin: 0 0px -1px 1px;
  border-radius: 8px 0 0px 0;
  border:1px solid grey;
  background-color: #ddd;
  color: #777;
  cursor: pointer;
}

.Months li:hover
{ background-color: yellow;
  color: #e00;
}

.Months li.Selected:hover
{ color: #e00; }

.Months li.Selected
{ background-color: white;
  color: black;
}

div[name='ReqSpedList']
{ position:absolute;
  left:360px;   top:135px;
  width:534px;  /*height:300px; */
  border:1px solid grey; 
  display:none;
  background-color: whitesmoke;
  z-index:1;
  text-align:center;
}