/* Witte pagina zonder margin en padding */
.bodyStyle {
  font-size: 14px;
  font-family: Arial, "Arial CE", "Lucida Grande CE", lucida, "Helvetica CE", sans-serif;
  color: #000000; 
  padding: 0;
  margin: 0;
}

/*Pagina indeling in een header menu aan linker kant, naast de main area en een footer */
.container {
  position: absolute;
  display: grid;
  grid-template-columns: 250px auto;
  grid-template-rows: auto  /*hoogte header */
    1fr                     /*hoogte middenstuk */
    20px;                   /*hoogte footer */
  grid-template-areas: 
    "header header"
    "menu main"
    "footer footer";
  width: 100%;
  height: 99%;
}

.header {
  grid-area: header;
  display: grid;
  grid-template-columns: 250px auto 180px;
  grid-template-areas: 
    "header-left header-center header-right";
}

.header-center{
  padding: 10px;
}

.header-right{
  padding-top: 20px;
}

.menu {
  grid-area: menu;
  overflow-y: auto;
}

.main {
  grid-area: main;
  padding: .2em;
  overflow-y: auto;
}

.footer {
  grid-area: footer;
  border-top: 1px solid #a8a8a8;
  padding: 5px;
  color: #4f4f4f;
}

.taal-link{
  position: relative;
  float: left;
  margin-right: 30px;
}  

.logout-link{
  float: left;
  position: relative;
}


/* Einde pagina indeling */


/*Vlak om uitleg in te geven in de linker menu kolom   */
.uitleg-vlak {
  font-size: 14px;
  background: #f5f5f5;
  vertical-align:top; 
  height: 100%
}

/*Vlak om plaatjes in te geven in de linker menu kolom   */
.start-picture-vlak{
  background: white;
  height: 100%;
}

/* Menu header */ 
.ui-menu .menu-item-header{
  font-size:150%;
  font-weight: bold;
  opacity: 1;
}  

/* image met actie aanpassen in formaat */
.menuImg { transition: all .2s ease-in-out; }
.menuImg:hover { transform: scale(1.3); }


.info-icon{
  cursor:pointer;
  margin-left:10px;
  vertical-align: top;
}

/* buttons onderaan de pagina */
.horizontalButtons{
  float:right;
  margin-top:10px;
}

/* Voor prompt die in h:panelGroup achter elkaar worden geplaatst */
.gridPrompt{
  margin-left: 10px;
  margin-right: 5px;
}

/* Div waarin tekst wordt afgebeeld wat te doen bij een onbekende fout*/
#onbekendeFout{
  width : 465px;
  height : 300px; 
  overflow : auto; 
}

/*Plaatsen menu in facet van table */
.table-menu{
  width: 100%;
  display: inline-block;
}

.table-menu-left{
  text-align:left;
  float: left;
  display: inline-block;
}

.table-menu-right{
  text-align:right;
  float: right;
  display: inline-block;
}



/* Primefaces  */

/* Maak menu width en kleur gelijk gelijk aan het menu div */
.ui-menu{
  width: inherit;
  background:none;
  margin: .2em;
}

.ui-datatable thead th, .ui-datatable tbody td, .ui-datatable tfoot td { 
  padding: 2px 2px 2px 2px;
}

.ui-datatable div.ui-dt-c {
  padding: 2px 2px;
}

.ui-datatable-scrollable-theadclone {
  visibility: collapse;
}

.ui-autocomplete {
  white-space: nowrap;
}

.ui-autocomplete-dropdown {
  position: relative;
}

.ui-menuitem-text{
  font-size:100%;
}

#ui-datepicker-div{
  z-index: 1000;
}

.ui-picklist .ui-picklist-list {
  width:inherit;
  height:85%;
}

.ui-datatable .ui-column-filter {
  width: 90%;
}

.ui-datatable-scrollable-header-box{
  margin-right: 15px;
}

.ui-icon-triangle-1-s,
.ui-icon-triangle-1-n,
.ui-icon-circle-triangle-e,
.ui-icon-circle-triangle-w,
.ui-icon-gear,
.ui-menuitem-icon {
  zoom: 125%; -moz-transform: scale(1.25); -webkit-zoom: 1.25; -ms-zoom: 1.25; 
  margin-top:-4px;
}

.ui-menuitem-icon{
  margin:0px;
}

.ui-dashboard-column {
  padding-bottom: 10px;
}  

/* einde primefaces override */



/* Standaard HTML componenten  */

h1 {
  font-family: Arial, "Arial CE", "Lucida Grande CE", lucida, "Helvetica CE", sans-serif;
  font-size:  20px;
  font-weight: bold;
  margin: 0px;
  padding: 0px;
}

h2{
  font-family: Arial, "Arial CE", "Lucida Grande CE", lucida, "Helvetica CE", sans-serif;
  font-size:  16px;
  font-weight: bold;
  margin: 0px;
  padding: 0px;
}

p{
  font-size: 14px;
  margin-top:0;
  margin-bottom:0;
}

/* Geen randen om een image  */
img
{  border-style: none;
}


.signalerings-tab.ui-datatable.ui-widget thead th {
  padding:0px;
  border:none;
  background-color:white;
  color: #2B3A40;
}

/*voorkom  horizontale scrollbar (bij zoom) */
.ui-datatable-tablewrapper,.ui-datatable-scrollable-body{
 overflow-x: hidden;  
}


/* Einde standaar HTML componenten  */