/* ---- fix box-sizing ---- */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

/* ---- fix body height ---- */
html, body { width:100%; height:100%; }

/* ---- Layout ---- */

body {font-family:Geneva, Tahoma, Verdana, sans-serif; background:#fff;}
.page {
  display: table;
}
.page-row {
  display: table-row;
  width:100%;
  height:1px;
}
.page-row-expanded { width:100%; height:100%; }

/* ---- Header ---- */

header {display:inline-block;}
header .grid { display:table; width:100%;font-size:0px;}
header .grid-row { display:table-row;}
header .grid-cell { display:table-cell;vertical-align:middle;}
header .grid-cell.left {text-align:left; width:40%;}
header .grid-cell.center {text-align:center; width:20%;}
header .grid-cell.right {text-align:right; width:40%;}

header #logo {}
header #testing {float:right;background:#ffa;padding:3px 5px;color:black;margin-left:20px;vertical-align:middle;cursor:pointer;}

header span#name {font-size:14px;vertical-align:middle;margin-right:20px;}
header #btn_menu {margin-left:20px;}
header #btn_options {margin-right:20px;}
header #btn_menu img,
header #btn_options img {height:20px;vertical-align:middle;}


/* ---- Main ---- */
main {display: table;flex-shrink: 1; font-family:Verdana;font-size:14px;}
div#content {min-height: min-content;min-width: min-content; width:100%;}


/* ---- Footer ---- */

footer {display:inline-block;}
footer .grid { display:flex; flex-flow:row; flex-wrap:wrap; align-items:center;}
footer .grid-cell { flex:1 0 0%; padding:10px 20px; }  /* IE11 fix */
footer #right {text-align:right; font-size:12px;}
footer #right a {color:#1212aa;}


/* ---- Menu ---- */
#navs nav {font-size:14px;position:absolute; background:black;display:none; padding:0 0 10px 0; z-index:100;}
#navs nav#options {right:0;}
#navs nav#options li {text-align:right;}
#navs nav.open {display:inline-block;}
#navs nav ul {list-style-type:none;margin:0;padding:0;display:flex;flex-flow:column;justify-content: space-between;}
#navs nav ul li {display:inline-block;flex-grow: 1;}
#navs nav a {flex-grow:1;display:block;color:#fff; text-decoration:none; padding: 5px 20px;}
#navs nav a:hover {background:rgba(255,255,255,0.2);}
#navs nav ul ul li a {font-size:12px;padding: 5px 20px 5px 40px;}

/* ---- Breadcumb ---- */
nav#breadcrumb {margin:0;background:#fff;display: table-row;height:1px;position:relative;font-size:12px;}
nav#breadcrumb a {display:inline-block;text-decoration:none; color:black;padding:10px 0;}
nav#breadcrumb a:first-child {padding-left:20px;}
nav#breadcrumb a:last-child {font-weight:bold;}
nav#breadcrumb a.selected {font-weight:bold;}
nav#breadcrumb span {
  display:inline-block;
  width: 0px; 
  height: 0px;
  margin:0 10px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid rgba(0,0,0,0.5);
}

/* ---- Boxes ---- */
main .grid { display:flex; flex-flow:row; flex-wrap:wrap; padding:0 20px 20px 0px; }
main .grid-cell { flex:1 0 0%; padding:20px 0 0 20px; }  /* IE11 fix */
.grid--cols-4 > .grid-cell { flex-grow:0; flex-shrink:0; flex-basis:calc(100% - 20px);}  /* IE11 fix */
@media screen and ( min-width: 800px )
{
.grid--cols-4 > .grid-cell { flex-grow:0; flex-shrink:0; flex-basis:calc(50% - 20px); }  /* IE11 fix */
}
@media screen and ( min-width: 1200px )
{
.grid--cols-4 > .grid-cell { flex-grow:0; flex-shrink:0; flex-basis:calc(33.33% - 20px); }  /* IE11 fix */
}
@media screen and ( min-width: 1400px )
{
.grid--cols-4 > .grid-cell { flex-grow:0; flex-shrink:0; flex-basis:calc(25% - 40px); }  /* IE11 fix */
}

main .box {color:black; text-decoration:none; height:100%;
  box-shadow: 5px 5px 10px #aaa;display:flex; flex-flow:row; flex-wrap:wrap;}
main .box .left {padding:10px 0 10px 10px;}
main .box .right {flex:1 0 0%;;padding:10px}  /* IE11 fix */
main .box img {}
main .box h2 {font-size:18px;margin:0;padding:5px 0 0 0;}
main .box p {margin:10px 0 0 0;}








div.tab {
    overflow: hidden;
    padding:10px 0 0 10px;
    background: #ddd;
}
div.tab button {
    float: left;
    border: none;
    background: inherit;
    outline: none;
    cursor: pointer;
    padding: 10px;
    font-size:16px;
}
div.tab button:hover {
    background-color: #eee;
}
div.tab button.active {
    font-weight:bold;
    background-color: white;
}
div.tab2 {
    overflow: hidden;
    padding:20px 0 0 20px;
    background: #fff;
}
div.tab2 button {
    float: left;
    border: none;
    background: inherit;
    outline: none;
    cursor: pointer;
    padding: 5px 10px;
    font-size:16px;
    /*border-top:1px solid rgb(11, 103, 205);
    border-right:1px solid rgb(11, 103, 205);*/
    background-color: rgb(175,188,213); /* #aed3fc; */
}
div.tab2 button:first-child {
    /*border-left:1px solid rgb(11, 103, 205);*/
    margin-left:10px;
}
div.tab2 button:hover {
    color:white;
    background-color: rgb(108,135,179); /*#3688e2;*/
}
div.tab2 button.active {
    color:white;
    background-color: rgb(58,87,138) /*rgb(11, 103, 205);*/
}
div#tabcontent {
  padding:0 20px 0 20px;
}


tr.jtable-data-row>td {padding:4px 10px !important; white-space: nowrap;}
.jtable-column-header {position:relative;}
.jtable-column-header-container {padding-right:20px; overflow:visible;height: auto !important;padding:5px 20px 5px 10px;}
.jtable-title-text {font-size:20px !important;}
div.jtable-main-container,
.jtable-title-text,
.jtable-column-header-container,
.jtable-column-header-text {margin:0 !important;font-family:Geneva, Tahoma, Verdana, sans-serif !important;}
div.jtable-main-container>table.jtable>thead th.jtable-column-header {vertical-align:top !important;}
div.jtable-main-container>table.jtable>thead th.jtable-column-header-sortable div.jtable-column-header-container {padding-right:45px; background-position: top 5px right 5px !important;}
div.jtable-main-container>table.jtable>thead th.jtable-column-header-sortable.sortable div.jtable-column-header-container {background-position: top 5px right 26px !important;}
.jtable-bottom-panel {padding:5px !important;}
.jtable-right-area {padding:5px !important; vertical-align: middle !important;}
div.jtable-main-container>table.jtable>thead>tr>th.jtable-column-header {border-right: 1px solid #7cb3ef !important;}
/*div.jtable-main-container>div.jtable-title {background:#676767 !important;}*/
.jtable-column-header div.filter {width:20px; height:100%; position:absolute;top:0;right:5px;background:no-repeat; background-size:16px 16px; background-position:right 2px top 6px; background-image:url('/static/img/filter_inactive.svg');}
.jtable-column-header .jtable-column-header-container input {display:none;font-size:14px;font-family:Geneva, Tahoma, Verdana, sans-serif;}
.jtable-column-header.showFilter div.filter {float:none;background-image:url('/static/img/filter_active.svg');}
.jtable-column-header.showFilter .jtable-column-header-container input {display:block; z-index:100}
.jtable-column-header.showFilter span.jtable-column-header-text {float:left; height:0px; overflow:hidden; line-height:0px; color:rgb(45, 137, 239); z-index:-1;}
span.missing {color:#ee0000;}
.ui-widget input[type='text'], .ui-widget select, .ui-widget textarea {width:100% !important;}
.ui-dialog .ui-dialog-buttonpane {padding:.2em 1em !important;}
.ui-dialog-buttonset button:last-child {margin-right:0;} 
.jtable-selecting-column {text-align:left !important;}
.jtable-column-header-selecting .jtable-column-header-container {padding:0 !important;}
.jtable-column-header-selecting {border-right:solid 1px rgb(175,188,213) !important;vertical-align: top !important; padding-top:7px !important;}

tr.highlight {background:rgb(79, 171, 255) !important;}
/*.jtable-command-column-header:last-child,
.jtable-command-column-header:nth-last-child(2),
.jtable-command-column:last-child,
.jtable-command-column:nth-last-child(2) {display:none;}*/


div.jtable-main-container>div.jtable-title {
    background-color: rgb(58,87,138) !important;
}
div.jtable-main-container>div.jtable-bottom-panel {
    background-color: rgb(58,87,138) !important;
    border: 1px solid rgb(58,87,138) !important;
    border-top: none;
}
div.jtable-main-container>table.jtable>thead {
    background-color: rgb(108,135,179) !important;
}
div.jtable-main-container>div.jtable-title div.jtable-toolbar span.jtable-toolbar-item {
  background-color: rgb(108,135,179) !important;
  padding-left: 5px !important;
  padding-right: 5px !important;
  margin-left:2px !important;
}
div.jtable-main-container>div.jtable-title div.jtable-toolbar span.jtable-toolbar-item:last-child {
  margin-right:5px !important;
}
div.jtable-main-container>table.jtable>thead>tr>th.jtable-column-header {
    border-right: 1px solid rgb(175,188,213) !important;
}
div.jtable-main-container>table.jtable {
    border: none !important;
}
table.jtable thead th:last-child {
  border-right:solid 1px blue !important;
}
div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-space, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-first, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-last, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-previous, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-next, div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-active {
    background-color: rgb(108,135,179) !important;
}
div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number:hover,div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-first:hover,div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-last:hover,div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-previous:hover,div.jtable-main-container>div.jtable-bottom-panel .jtable-page-list .jtable-page-number-next:hover{background-color:rgb(175,188,213) !important;}

body.projects ul.boxes
{
  width: 100%;
  padding:10px;
  list-style-type:none;

  display: -webkit-box;  
  display: -webkit-flex;
  display: -ms-flexbox;

  display: flex;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;

  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
body.projects .boxes li
{
    width: 100%; /* 4 items per row */
    padding:10px;
    /*min-height:200px;*/
}
body.projects .boxes a {color:black; text-decoration:none; width:100%; height:100%;
  display:block;padding:20px;box-shadow: 5px 5px 10px #aaa;/**/} /* 1 item per row */
body.projects .boxes img {}
body.projects .boxes h2 {font-size:18px;padding:0 0 0 0;}
body.projects .boxes p {margin-top:10px;}



@media screen and ( min-width: 900px )
{
    body.projects .boxes li
    {
        width: 50%;  /* 2 item per row */
        float: none;
    }
}
@media screen and ( min-width: 1200px )
{
    body.projects .boxes li
    {
        width: 33.333%; /* 3 items per row */
    }
}
@media screen and ( min-width: 1500px )
{
    body.projects .boxes li
    {
        width: 25%;  /* 4 items per row */
    }
}
.changed {background:rgb(196, 255, 210);}

body.project #content h2 {padding:20px 20px 10px 20px; font-size:18px;width:100%;}
/*body.project #flowmap {display:block; height:600px; margin:20px;position:relative;border:1px solid grey;background:#eee;}
body.project #flowmap object {display:block;width:100%;height:100%;}
body.project #flowmap #controls {position:absolute;right:0;bottom:0;display:block;}
body.project #flowmap #controls button {cursor:pointer;background:white;padding:7px;display:inline-block;border:none;margin:0;border-top:1px solid grey;border-left:1px solid grey;}
body.project #flowmap #controls img {height:13px;display:block;}*/

#tasklist tr.running {background:rgba(239,118,62,0.25);}
/*#tasklist {
  padding:20px;
}
#tasklist input[type=button] { padding:5px 10px;}
#tasklist table {
  display:block;
  width: 100%;
  padding:0;
  border-collapse: collapse;
  border-spacing: 0;
}

#tasklist table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 5px;
}

#tasklist table th,
#tasklist table td {
  padding: 10px 10px 10px 0;
  text-align: left;
}

#tasklist table th {
  font-size: 14px;
  letter-spacing: 1px;
}*/

/*@media screen and (max-width: 800px) {

  #tasklist table {
   border: 0;
  }

  #tasklist table thead {
   display: none;
  }

  #tasklist table tr {
    margin-bottom: 10px;
    display: block;
    border-bottom: 2px solid #ddd;
  }

  #tasklist table td {
    display: block;
    text-align: right;
    font-size: 13px;
    border-bottom: 1px dotted #ccc;
  }

  #tasklist table td:last-child {
    border-bottom: 0;
  }

  #tasklist table td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
  }
}*/

body.app #content h2 {padding:20px 20px 10px 20px; font-size:18px;width:100%;}

 

/* ----- Media Queries ----- */
@media (min-width: 500px)
{
  /*.list {width: 500px;}*/
    .list_item {width: 50%}
}
@media (min-width: 800px)
{
  /*.list {width: 800px;}*/
    .list_item {width: 33.33333333%}
}

@media print 
{



}