@page
{ size: A4 portrait;
  margin: 8mm;
  counter-increment: page;
  @top-right-corner { content: counter(page) }
}

body
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif;
  padding:0;
  margin:0;
}

@media print {
html, body
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif;
  background-color:none; }
  
td { font-size: 12px; }

.HeaderLine { display:none; }
.Content { display:none; }
#PrintPage { display: block; }
#PrintPage table { border-collapse: collapse; }
/*#PageNumber:after
{ content: "Page " counter(page);
  text-align: right;
}*/
#PrintPage table thead tr.Title td { border: none; background-color: none; font-weight: normal; }
#PrintPage table td { border: 1px solid black; }
#PrintPage table thead td {font-weight: bold; }
#PrintPage table tbody tr.Footer td { font-weight: bold; }
}
/******************* End of Print Styles ******************************/

@media screen {
body
{ font: 12px/1.2 Verdana, Arial, Helvetica, sans-serif;
  /*background-image: url('Images/Background.jpg');*/
  background-position:center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size:cover;
}
#PrintPage { display: none; }

.HeaderLine
{ background-color: rgba(210,245,255,1);
  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('Images/LeftHIcon.png'),url('Images/RightHIcon.png');
  background-position:left 2px,right 2px;
  background-size: auto 36px;
  background-repeat: no-repeat;
}
.Header h1
{ margin: 0px;
  padding: 0px 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); */
}

.FirstPageMsg
{ Width:50%;
  border: 4px solid Green;
  border-radius: 15px;
  background-color: PaleGreen;
  padding: 20px;
  margin:50px auto;
  text-align:center;
  font-size:14px;
}
/************************************************************/
.RespInfoList
{ border-collapse: collapse;
  width: 100%;
  margin-top:3px;
}

.RespInfoList thead td
{ background-color: SkyBlue;
  text-align: center;
  font-weight: bold; }
  
.RespInfoList thead tr:first-child td
{ background-color: PaleTurquoise; }

.RespInfoList thead tr:nth-child(2) td
{ background-color: transparent; 
  height: 3px; }

.RespInfoList td
{ border: 1px solid grey; }

.RespInfoList tbody td
{ background-color: whitesmoke; }

.RespInfoList tbody td.Separator
{ background-color: transparent;
  height: 3px; 
  border: none; }

.RespInfoList tbody td.CarEquip
{ text-align: left;
  padding-left:10px; }

.RespInfoList tbody td.Cnt
{ text-align: center;
  width: 40px; }

.RespInfoList tbody td.ValidUntil
{ text-align: center;
  width: 75px; }

/************************************************************/

.Photo
{ width: 350px;
  height:350px;
  /*float: left;*/
  /*display: inline-block;*/
  margin:20px auto;
  border-top   :1px solid darkgrey;
  border-right :1px solid whitesmoke;
  border-bottom:1px solid whitesmoke;
  border-left  :1px solid darkgrey;
  overflow: hidden;
  text-align:center;
  position: relative;
}

/*.Photo:first-child
{ margin-left:2px; }*/

.Photo img
{ max-width: 100%; 
  max-height:100%; 
  position:relative;
/*  left:50%;
  transform: translateX(-50%);*/
  top:50%;
  transform: translateY(-50%);
  margin:0 auto;
}

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

.Photo:hover button
{ visibility:visible; }

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

.AddPhoto .Camera
{ font-size:4em;
/*  font-size:2em;*/
  line-height:160%; }
 
.AddPhoto:hover
{ color:gray; }

/*********************************************************/
.WC_FieldSet
{ margin-left:5px; 
  padding:0 0 5px 0; 
  float:left; 
  border:1px solid grey;
}

.WC_FieldSet h1
{ margin:0px; 
  width:100%; 
  box-sizing:border-box; 
  background-color:#ccc; 
  padding:2px 5px;
  font-size:12px;
}

.WC_FieldSet h1 span[name="Dist"],span[name="Cln"]
{ cursor:pointer;

}

.WC_FieldSet h1 span[name="Dist"].Selected,span[name="Cln"].Selected
{ cursor:pointer;
  color:#f22;
}

/****************************************************/
.InfoField
{ background: whitesmoke;
  height:16px;
  padding:2px 3px 1px;
  border: 1px solid grey;
  display: inline-block;
  vertical-align:middle;
}

.TaskInfo
{ width: 500px;
  margin:5px;
}

.TaskInfo h1
{ font-size: 12px;
  margin:0;
  padding: 0;
}