@font-face {
    font-family: 'robotoregular';
    src: url('fonts/Roboto-Regular-webfont.eot');
    src: url('fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotomedium';
    src: url('fonts/Roboto-Medium-webfont.eot');
    src: url('fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Roboto-Medium-webfont.woff') format('woff'),
         url('fonts/Roboto-Medium-webfont.ttf') format('truetype'),
         url('fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: "robotoregular";
    color: #222;
    font-weight: 400;
    font-size: 10pt;
    font-style: normal;
    line-height: 14pt;
    text-align: left;
    background-color: #F3F5F6;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
p {
    text-align: left;
    text-indent : 0em;
    margin-top: 0px;
    margin-bottom: 15px;
    /* line-height: 18pt; */
}
.smallfont {
  font-family: "robotoregular";
  font-weight: 400;
  font-size: 9pt;
  font-style: normal;
  line-height: 13pt;
}
.mainpage {
    min-width: 1100px;
    /* min-height: 1000px; */
    margin: auto;
    background-color: #F3F5F6;
    padding: 0px;
    overflow: hidden;
}
.column_left {
    float: left;
    width: 170px;
    padding: 4px;
    overflow: hidden;
}
.column_right {
    float: right;
    /* margin-left: 178px; */
    width: 742px;
    padding-top: 10px;
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 10px;
    overflow: hidden;
}

/* Clear floats after the columns */
.row_page:after {
    content: "";
    display: table;
    clear: both;
}
ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}
li {
    background-image: url(image/dotredsmall.gif);
    background-repeat: no-repeat;
    background-position: 5px center;
    padding-left: 25px;
    font-style: italic;
}
textarea, input {
   font-family: inherit;
   font-size: inherit;
}
.button {
    font-size: 10pt;
    font-style: normal;
    font-weight: bold;
    color: #0050A8;
    text-decoration: none;
    background-color: #BFDEFF;
    display: block;
    padding: 4px;
    width: 125px;
    text-align: center;
    border: solid 1px #64ADFF;
    margin: 4px 0px 4px 0px;
}
.button:hover {
    background-color: #A6D0FF;
}

.formvelden {
    font-size: 10pt;
    font-weight: normal;
    font-style: normal;
    color: rgb(64, 64, 64);
    border: solid #0077FF 1px;
    padding: 3px 3px 3px 3px;
    margin: 4px 0px 4px 0px;
}
.formlabels {
    font-size: 10pt;
    color: rgb(96, 96, 96);
    font-weight: bold;
    text-align: left;
    letter-spacing: normal;
    line-height: 20px;
    font-style: italic;
}
.kopklein {
    font-size: 16px;
    color: #222;
    font-weight: bold;
    text-align: left;
    letter-spacing: normal;
    line-height: 25px;
    font-style: italic;
}
h2 {
    margin: 5px 0px 15px 0px;
}
h3 {
    margin: 5px 0px 5px 0px;
}
.formblok {
    /* float: left; */
    box-shadow: 1px 2px 3px #d0d0d0;
    background-color: #FFFFFF;
    padding: 0px;
    margin: 16px 0px  2px 16px;
    /* overflow: hidden; */
}
.formblokheader {
  background-color: #0080FF;
  font-size: 11pt;
  color: #FFFFFF;
  padding: 2px 8px 2px 8px;
}
.formblokcontent {
  /* display: block; */
  padding: 8px 8px 8px 8px;
}
.pageblok {
    width: 918px;
    border: solid 1px #f0f0f0;
    border-radius: 4px;
    box-shadow: 1px 2px 4px #e0e0e0;
    background-color: #FFFFFF;
    padding: 10px 20px 10px 20px;
    margin: 30px 20px 30px 20px;
    overflow: hidden;
}
.textred {
  color: #CC0000;
}

.columnswrapper {
  width: 1314px;
  overflow: hidden;
}
.columnleft {
  width: 250px;
  float: left;
}
.columnright {
  width: 1064px;
  float: right;
}

/************/
/* Menu CSS */
/************/

.navbar {
    overflow: hidden;
    background-color: #333;
    font-family: "robotoregular";
    font-size: 10pt;
    line-height: 16px;
    /* height: 30px; */
    box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);
}

.navbar a {
    float: left;
    font-size: 10pt;
    font-weight: normal;
    line-height: normal;
    color: white;
    text-align: center;
    padding: 8px 16px;
    text-decoration: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 10pt;
    border: none;
    outline: none;
    color: white;
    padding: 8px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
    background-color: #0080FF;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f6f6f6;
    min-width: 160px;
    box-shadow: 4px 6px 16px 4px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    float: none;
    color: #333333;
    padding: 4px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {
    background-color: #BBDDFF;
}

.dropdown:hover .dropdown-content {
    display: block;
}


.button_more {
  display: inline-block;
  border-radius: 4px;
  background-color: #0080ff;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 10pt;
  padding: 6px;
  width: 120px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 0px 0px 0px 0px;
}
.button_more:hover {
  background-color: #3399ff;
}

.button_more span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
  color: #FFFFFF;
}

.button_more span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button_more:hover span {
  padding-right: 25px;
  color: #FFFFFF;
}

.button_more:hover span:after {
  opacity: 1;
  right: 0;
}


/* define height and width of scrollable area. Add 16px to width for scrollbar          */
div.tableContainer {
	clear: both;
	border: 1px solid #98bde8;
	height: 263px;
	overflow: auto;
	width: 900px;
    color: #222222;
    font-family: "robotoregular";
    font-size: 9pt;
    line-height: 12pt;
    font-style: normal;
    font-weight: normal;
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: 8px;
}

/* Reset overflow value to hidden for all non-IE browsers. */
html>body div.tableContainer {
	overflow: hidden;
	width: 900px;
}

/* define width of table. IE browsers only                 */
div.tableContainer table {
	float: left;
	/* width: 740px */
}

/* define width of table. Add 16px to width for scrollbar.           */
/* All other non-IE browsers.                                        */
html>body div.tableContainer table {
	/* width: 756px */
}

/* set table header to a fixed position. WinIE 6.x only                                       */
/* In WinIE 6.x, any element with a position property set to relative and is a child of       */
/* an element that has an overflow property set, the relative value translates into fixed.    */
/* Ex: parent element DIV with a class of tableContainer has an overflow property set to auto */

thead.fixedHeader tr {
	position: relative;
}

/* set THEAD element to have block level attributes. All other non-IE browsers            */
/* this enables overflow to work on TBODY element. All other non-IE, non-Mozilla browsers */

/* make the TH elements pretty */
thead.fixedHeader th {
    color: #FFFFFF;
    background: #68B9FF;
    border-top: 1px solid #A4CEFE;
    border-left: 1px solid #A4CEFE;
    border-right: 1px solid #6AA7D9;
    font-weight: normal;
    padding: 3px 3px;
    text-align: left;
}

html>body tbody.scrollContent {
	display: block;
	height: 240px;
	overflow-y: auto;
	width: 100%;
}

html>body thead.fixedHeader {
	display: table;
	overflow: auto;
	width: 100%;
}

/* make TD elements pretty. Provide alternating classes for striping the table */
/* http://www.alistapart.com/articles/zebratables/                             */

tbody.scrollContent td, tbody.scrollContent td {
    /* background-color: #EEF7FF; */
    text-decoration: none;
    padding: 2px 4px 2px 4px;
    border-right: solid 1px #98bde8;
    border-bottom: none;
    border-left: none;
}

tbody.scrollContent tr, tbody.scrollContent tr.normalRow {
    background-color: #EEF7FF;
    color: #222;
}

tbody.scrollContent tr:hover, tbody.scrollContent tr.normalRow:hover {
    cursor: pointer;
    background-color: #0066FF;
    color: #EEEEEE;
}

tbody.scrollContent tr, tbody.scrollContent tr.alternateRow {
    background-color: #DEEEFF;
    color: #222;
}

tbody.scrollContent tr:hover, tbody.scrollContent tr.alternateRow:hover {
    cursor: pointer;
    background-color: #0066FF;
    color: #EEEEEE;
}

tbody.scrollContent tr, tbody.scrollContent tr.selectedRow {
    background-color: #0044DD;
    color: #EEEEEE;
}

/*
 * logbook
 */

/*
.ajaxtable {
    color: #222222;
    font-family: "robotoregular";
    font-size: 9pt;
    line-height: 12pt;
    font-style: normal;
    font-weight: normal;
    margin-top: 8px;
    margin-bottom: 8px;
}

.ajaxtable table {
    border-Left: solid 1px #505050;
    border-bottom: solid 1px #505050;
}

.ajaxtable th {
    color: #FFFFFF;
    font-weight: bold;
    text-align: left;
    background: linear-gradient(to bottom, #505050 0%, #202020 100%) repeat scroll 0% 0% transparent;
    padding: 4px;
    border-top: solid 1px #505050;
    border-right: solid 1px #505050;
}
.ajaxtable .tablerow1 {
    cursor: default;
    background-color: #E6F2FF;
}

.ajaxtable .tablerow1:hover {
    cursor: pointer;
    background-color: #0066FF;
    color: #EEEEEE;
}

.ajaxtable .tablerow2 {
    cursor: default;
    background-color: #D2E8FF;
}
.ajaxtable .tablerow2:hover {
    cursor: pointer;
    background-color: #0066FF;
    color: #EEEEEE;
}
.ajaxtable .tablerownodata1 {
    background-color: #E6F2FF;
}
.ajaxtable .tablerownodata2 {
    background-color: #D2E8FF;
}
.ajaxtable .tablecel {
    text-decoration: none;
    padding: 2px 4px 2px 4px;
    border-right: solid 1px #505050;
    margin: 0px 0px 0px 0px;
}
.ajaxtable .textleftalign {
    text-align: left;
}
.ajaxtable .textrightalign {
    text-align: right;
}
*/

.widthleftarea{
  width: 250px;
}
.widthworkarea {
    width: 1032px;
}
.width1000 {
    width: 1000px;
}
.width960 {
    width: 960px;
}
.width500 {
    width: 500px;
}
.width250 {
    width: 250px;
}
.width200 {
    width: 200px;
}
.width150 {
    width: 150px;
}
.width125 {
    width: 125px;
}
.width100 {
    width: 100px;
}
.width75 {
    width: 75px;
}
.width60 {
    width: 60px;
}
.width50 {
    width: 50px;
}


input[type="submit"], button {
  height: 28px;
  display: inline-block;
  border-radius: 3px;
  background-color: #0080ff;
  border: none;
  color: #FFFFFF;
  text-align: center;
  vertical-align: middle;
  font-size: 10pt;
  padding: 0px;
  /* width: 120px; */
  transition: all 0.5s;
  cursor: pointer;
  margin: 16px 4px 4px 4px;
}
input[type="submit"]:hover, button:hover {
  background-color: #3399ff;
}

input[type="checkbox"] {
    display: inline-block;
    width:  16px;
    height: 16px;
    margin: -1px 10px 0px 20px;
    vertical-align: middle;
}

input[type="radio"] {
  margin: 2px 4px 4px 4px;
  vertical-align: middle;
}

input, select {
    color: #222;
    border: solid #98bde8 1px;
    border-radius: 3px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 3px;
    height: 25px;
}

input {
    padding-left: 4px;
    padding-right: 4px;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    padding-left: 1px;
    padding-right: 24px;
    background: url(img/pull-down-16.png) no-repeat 98% center;
    background-color: #FFFFFF;
}

label {
    display: inline-block;
    text-align: right;
    color: #222222;
    padding-right: 4px;
    margin: 0;
}


/*
label {
    display: inline-block;
    text-align: right;
    color: #222222;
    padding-right: 0px;
    margin-right: 0px;
}

input {
    color: #222;
    height: 25px;
    padding-left: 4px;
    padding-right: 4px;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-right: 0px;
    margin-left: 3px;
    border: solid #98bde8 1px;
    border-radius: 3px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    appearance: none;
    display: inline-block;
    background: url(img/pull-down-16.png) no-repeat 95% center;
    background-color: #FFFFFF;
    border: solid #98bde8 1px;
    border-radius: 3px;
    padding-left: 2px;
    padding-right: 24px;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-right: 0px;
    margin-left: 0px;
    height: 25px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
*/

textarea {
  border: solid #98bde8 1px;
  border-radius: 3px;
  /* padding: 3px 3px 3px 3px; */
  /* margin: 0px 0px 8px 0px; */
  color: #222;
  /* border: 1px solid #B0B0B0; */
  padding: 4px;
  margin: 3px;
}

textarea:focus, input:focus, select:focus {
    /* border: 1px solid #09C; */
    border: 1px solid #0055CC;
    /* box-shadow: 1px 1px 3px 0px #C0C0C0; */
}


/* Style the tab */
.tab {
  overflow: hidden;
  border: 0px solid #ccc;
  background-color: #f1f1f1;
  margin-left: 8px;
  margin-right: 8px;
}

/* Style the buttons inside the tab */
.tab button {
  height: unset;
  border-radius: unset;
  color: unset;
  text-align: unset;
  margin: unset;
  display: unset;
  vertical-align: unset;
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 4px 16px;
  transition: 0.3s;
  font-size: 11pt;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #BBDDFF;
  /* color: #FFFFFF; */
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #0080FF;
  color: #FFFFFF;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #98bde8;
  /* border-top: none; */
  margin-left: 8px;
  margin-right: 8px;
}

:focus {
    outline: none;
}