/* BOOTSTRAP V4 MODS */

:root {
  --lotarblue: #0068b3;
  --lotarlight: #0095ff;
  --lotargray: #4c4c4c;
  --lotarfaded: #dbdbdb;
}

body {
  background-color: #ebebeb;
}

a {
  color: var(--lotarlight);
  text-decoration: none;
  background-color: transparent;
}

video {
  width: 600px;
  height: 338px;
}

a:hover {
  color: var(--lotarblue);
  text-decoration: underline;
}

@media (min-width:576px) {
  .container{max-width:100vw}
}

@media (min-width:768px) {
  .container{max-width:100vw}
}

@media (min-width: 992px) {
  .container {
     max-width:960px
  }
  .col-fixed-header {
    display: none;
  }
}

@media (max-width: 992px) {
  .col-fixed {
    display: none;
  }
}

@media (min-width:1200px) {
  .container {
    max-width:1140px
  }
  
  video {
    width: 800px;
    height: 450px;
  }
}

.col-fixed {
  width: 280px;
  max-width: 280px;
}

.col-fixed-header, .col-fixed-404 {
  width: 60px;
  max-width: 60px;
}

.table .thead-blue th {
  color: #fff;
  background-color: var(--lotarblue);
  border-color: var(--lotarlight);
}

.table>:not(:first-child) {
  border-top: 2px solid var(--lotarlight);
}

.btn-primary {
  color: #fff;
  background-color: #0068b3;
  border-color: #0068b3;
}

.btn-primary:hover {
  color: #fff;
  background-color: #0068b3;
  border-color: #0068b3;
}

/* ICONS */

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

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-home:before {
  content: "\e900";
}
.icon-books:before {
  content: "\e920";
}
.icon-library:before {
  content: "\e921";
}
.icon-file-text2:before {
  content: "\e926";
}
.icon-copy:before {
  content: "\e92c";
}
.icon-calendar:before {
  content: "\e953";
}
.icon-bubbles:before {
  content: "\e96c";
}
.icon-users:before {
  content: "\e972";
}
.icon-user-tie:before {
  content: "\e976";
}
.icon-search:before {
  content: "\e986";
}
.icon-enlarge2:before {
  content: "\e98b";
}
.icon-shrink2:before {
  content: "\e98c";
}
.icon-airplane:before {
  content: "\e9af";
}
.icon-clipboard:before {
  content: "\e9b8";
}
.icon-tree:before {
  content: "\e9bc";
}
.icon-menu:before {
  content: "\e9bd";
}
.icon-download3:before {
  content: "\e9c7";
}
.icon-sphere:before {
  content: "\e9c9";
}
.icon-attachment:before {
  content: "\e9cd";
}
.icon-arrow-up:before {
  content: "\ea32";
}
.icon-circle-right:before {
  content: "\ea42";
}
.icon-circle-down:before {
  content: "\ea43";
}
.icon-radio-checked:before {
  content: "\ea54";
}
.icon-radio-checked2:before {
  content: "\ea55";
}
.icon-mail2:before {
  content: "\ea84";
}

/* GENERAL */ 

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.contentimg {
  max-width: 100%;
  height: auto;
}

.morespace {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

ul.listofevents > li {
  margin-top: 1rem;
}

.no-padding {
  padding: 0;
}

/* HEADER */

header { position: fixed; z-index: 299; top: 0; left: 0; right: 0; width: 100%; height: 100px; background-color: #fff; overflow: hidden; }

header div:first-of-type { height: 75px; background-color: var(--lotarblue); overflow: hidden; }

header div div#headertitle { padding-top: 37px; }

header div div#headertitle img { width: 190px; height: auto; margin: -32px 65px 0 25px; }

header div div#headertitle h2 { color: #fff; margin: 0; position: absolute; top: 50%; left: 295px; -ms-transform: translateY(-50%); transform: translateY(-50%); }

header div div#headermenu, header div div#menu404button { font-size: 1.5rem; text-align: center; }

header div div#headermenu a, header div div#menu404button a { color: #fff; text-decoration: none; cursor: pointer; }

header div div#headermenu a:hover, header div div#menu404button a:hover { color: #fff; text-decoration: none; cursor: pointer; }

header div div#breadcrumb { padding: 2px 0 0 40px; height: 25px; list-style: none; background-color: var(--lotarfaded); font-size: 0.7rem; border-bottom: 5px solid #fff; }

header div div#breadcrumb a { color: #000; text-decoration: none; }

header div div#breadcrumb a:hover { color: var(--lotarblue); text-decoration: none; }


/* FRONT PAGE */

header#frontpageheader { height: 240px; }

header#frontpageheader div { height: 235px; background-color: #fff; padding-top: 5px; }

header#frontpageheader div div#frontpagemenu { font-size: 1.5rem; text-align: center; position: absolute; top: 10px; right: 20px; background-color: transparent; display: block; }

header#frontpageheader div div#frontpagemenu a { color: var(--lotarblue); text-decoration: none; cursor: pointer; }

header#frontpageheader div div#frontpagemenu a:hover { color: var(--lotarblue); text-decoration: none; cursor: pointer; }

/* CONTENT */

div#pagecontent { background-color:#fff; padding: 105px 20px 40px 0; min-height: 100vh; }

div#pagecontent div.col-fixed { background-image: url("../images/plane_blue.png"); background-repeat: no-repeat; background-position: left bottom; }

div#frontpagecontent { background-color: #fff; padding: 240px 10% 40px 10%; min-height: 100vh; }

ul.section-navigation { margin: 0; padding: 0; }

ul.section-navigation li { list-style: none; float: left; margin: 0; padding: 0 0 0 0.3rem; }

ul.section-navigation li::before { color: var(--lotarfaded); content: " | "; }

ul.section-navigation li:first-child { padding: 0; }

ul.section-navigation li:first-child::before { content: ""; }


/* MENU */

li.widget, ul.menu li, ul.sub-menu li { list-style: none; }

/* MENU LEVEL 1 */

ul#menu-navigation, ul#menu-navigation-1, ul#lotar-widget-list
{ margin: 0; padding: 0; }

ul#lotar-widget-list
{ margin-top: 10px; }

ul#menu-navigation li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarblue); font-size: 1.5rem; }

ul#menu-navigation-1 li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarblue); font-size: 1.25rem; }

ul#menu-navigation li.current_page_item > a, ul#menu-navigation-1 li.current_page_item > a
{ color: #fff; font-weight: bold; }

ul#menu-navigation li.menu-item-has-children, ul#menu-navigation-1 li.current_page_item.menu-item-has-children
{ padding-bottom: 4px; }

ul#menu-navigation li.current_page_ancestor, ul#menu-navigation-1 li.current_page_ancestor
{ padding-bottom: 4px; }

ul#menu-navigation li.current_page_ancestor > a, ul#menu-navigation-1 li.current_page_ancestor > a
{ color: #fff; font-weight: bold; }

ul#menu-navigation li a, ul#menu-navigation-1 li a
{ color: var(--lotarfaded); } 

ul#menu-navigation li a:hover, ul#menu-navigation-1 li a:hover
{ color: #fff; text-decoration: none; }

/* MENU LEVEL 2 */

ul#menu-navigation li ul.sub-menu
{ margin: 0; padding: 0; display: inherit; list-style: none; }

ul#menu-navigation-1 li ul.sub-menu
{ margin: 0; padding: 0; display: none; }

ul#menu-navigation li.current_page_item > ul.sub-menu, ul#menu-navigation li.current_page_ancestor > ul.sub-menu,
ul#menu-navigation-1 li.current_page_item > ul.sub-menu, ul#menu-navigation-1 li.current_page_ancestor > ul.sub-menu
{ display: inherit; list-style: none; }

ul#menu-navigation li ul.sub-menu li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarlight); font-size: 1.25rem; }

ul#menu-navigation-1 li ul.sub-menu li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarlight); font-size: 1.0rem; }

ul#menu-navigation li ul.sub-menu li.menu-item-has-children, ul#menu-navigation-1 li ul.sub-menu li.current_page_item.menu-item-has-children
{ padding-bottom: 4px; }

ul#menu-navigation li ul.sub-menu li.current_page_ancestor, ul#menu-navigation-1 li ul.sub-menu li.current_page_ancestor
{ padding-bottom: 4px; }

ul#menu-navigation li ul.sub-menu li.current_page_item > a, ul#menu-navigation-1 li ul.sub-menu li.current_page_item > a,
ul#menu-navigation li ul.sub-menu li.current_page_parent > a, ul#menu-navigation-1 li ul.sub-menu li.current_page_parent > a
{ color: #fff; font-weight: bold; }

ul#menu-navigation li ul.sub-menu li a, ul#menu-navigation-1 li ul.sub-menu li a
{ color: #000; } 

ul#menu-navigation li ul.sub-menu li a:hover, ul#menu-navigation-1 li ul.sub-menu li a:hover
{ color: #fff; text-decoration: none; }

/* MENU LEVEL 3 */

ul#menu-navigation li ul.sub-menu li ul.sub-menu, ul#menu-navigation-1 li ul.sub-menu li ul.sub-menu
{ margin: 0; padding: 0; }

ul#menu-navigation li ul.sub-menu li ul.sub-menu li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarfaded); font-size: 1.0rem; }

ul#menu-navigation-1 li ul.sub-menu li ul.sub-menu li
{ margin: 2px 0 2px 0; padding: 0 5px 0 5px; background-color: var(--lotarfaded); font-size: 0.8rem; }

ul#menu-navigation li ul.sub-menu li ul.sub-menu li:hover, ul#menu-navigation-1 li ul.sub-menu li ul.sub-menu li:hover
{ background-color: #fff; }

ul#menu-navigation li ul.sub-menu li ul.sub-menu li a, ul#menu-navigation-1 li ul.sub-menu li ul.sub-menu li a
{ color: var(--lotargray); } 

ul#menu-navigation li ul.sub-menu li ul.sub-menu li a:hover, ul#menu-navigation-1 li ul.sub-menu li ul.sub-menu li a:hover
{ color: var(--lotargray); text-decoration: none; }

/* HEADERMENU */

div#dropdownmenuoverlay, div#menu404overlay { position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.5); z-index: 305; display: none; }

div#dropdownmenu, div#menu404 { position: absolute; z-index: 310; top: 10px; left: 0; right: 0; width: 350px; height: auto; margin-bottom: 10px; background-color: #fff; text-align:center; display: none; }

ul#lotar-header-menu-list { margin: 0; padding: 10px 0 10px 0; }

/* SEARCH */

ul#lotar-widget-list form, div#dropdownsearch form, div#search404 form { background-color: var(--lotarblue); padding: 5px; font-size:0.8rem; }

ul#lotar-widget-list form input, div#dropdownsearch form input, div#search404 form input { border:none; background-color: var(--lotarfaded); width: 210px; }

ul#lotar-widget-list form input:focus, div#dropdownsearch form input:focus,div#search404 form input:focus { outline:none; background-color: #fff; }

ul#lotar-widget-list form button, div#dropdownsearch form button, div#search404 form button { border:none; margin: 0 0 0 7px; padding: 0; background-color: var(--lotarblue); color: #fff; font-size:1.05rem;}

/* HEADERSEARCH */

div#dropdownsearch { position: fixed; z-index: 310; top: 300px; left: 0; right: 0; width: 500px; height: 60px; padding-top: 12px; background-color: var(--lotarblue); overflow: hidden; text-align:center; display: none; }

div#search404 { width: 480px; height: 40px; padding-top: 2px; background-color: var(--lotarblue); overflow: hidden; text-align:center; }

div#dropdownsearch form input, div#search404 form input { width: 400px; }

/* FOOTER */

footer { position: fixed; z-index: 299; bottom: 0; left: 0; right: 0; width: 100%; background-color: var(--lotarblue); border-top: 5px solid #fff; height: 35px; padding: 5px 0 0 0; margin: 0; }

footer div { float: left; width: 50%; }

footer div p { margin: 0; padding: 0; color: var(--lotarfaded); text-align: right; }

footer div ul { float: left; margin: 0; padding: 0; }

footer div ul li { list-style: none; float: left; margin: 0; padding: 0 0 0 0.3rem; }

footer div ul li::before { color: var(--lotarfaded); content: " | "; }

footer div ul a { color: var(--lotarfaded); }

footer div ul a:hover { color: #fff; }

/* FRONT PAGE SLIDER */

div#slider-wrapper { width: 90%; margin: 30px auto auto auto; position: relative; min-height: 280px; }

div.slider-block { position: absolute; top: 0; left: 0; }

div.slider-icons { text-align: center; font-size: 3rem; color: var(--lotarblue); background-color: var(--lotarfaded); position: relative; min-height: 100px;  }

div.slider-icons p.slidericons { position: absolute; top: 45%; left: 50%; -ms-transform: translateY(-50%) translateX(-46%); transform: translateY(-50%) translateX(-46%); text-align: center; }

div.slider-icons p.slidericons a { color: var(--lotarblue); }

div.slider-icons p.slidericons a:hover { color: var(--lotarblue); text-decoration: none; }

div.slider-icons p.sliderindicator { font-size: 0.5rem; position: absolute; bottom: -10px; left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); text-align: center; }

div.slider-icons p.sliderindicator span.icon-radio-checked { color: var(--lotargray); }

div.slider-text { text-align: justify; min-height: 100px; padding-top: 1rem; }

div.slider-text button a { color: var(--lotarfaded); }

div.slider-text button a:hover { color: #fff; text-decoration: none; }

div#slider-overview { animation-name: LOTAR-OVERVIEW; animation-duration: 50s; animation-iteration-count: infinite; }

div#slider-organization { animation-name: LOTAR-ORGANIZATION; animation-duration: 50s; animation-iteration-count: infinite; }

div#slider-workgroups { animation-name: LOTAR-WORKGROUPS; animation-duration: 50s; animation-iteration-count: infinite; }

div#slider-dates { animation-name: LOTAR-DATES; animation-duration: 50s; animation-iteration-count: infinite; }

div#slider-standard { animation-name: LOTAR-STANDARD; animation-duration: 50s; animation-iteration-count: infinite; }

@keyframes LOTAR-OVERVIEW {
  0% { opacity: 1; z-index: 200; }
  17% { opacity: 1; z-index: 200; }
  20% { opacity: 0; z-index: 200; }
  20.1% { opacity: 0; z-index: 100; }
  97% { opacity: 0; z-index: 100; }
  100%  { opacity: 1; z-index: 100; }
}

@keyframes LOTAR-ORGANIZATION {
  0% { opacity: 0; z-index: 100;  }
  17% { opacity: 0; z-index: 100; }
  20% { opacity: 1; z-index: 100;  }
  20.1% { opacity: 1; z-index: 200;  }
  37% { opacity: 1; z-index: 200; }
  40%  { opacity: 0; z-index: 200;  }
  40.1%  { opacity: 0; z-index: 100;  }
  100%  { opacity: 0; z-index: 100;  }
}

@keyframes LOTAR-WORKGROUPS {
  0% { opacity: 0; z-index: 100;  }
  37% { opacity: 0; z-index: 100; }
  40% { opacity: 1; z-index: 100;  }
  40.1% { opacity: 1; z-index: 200;  }
  57% { opacity: 1; z-index: 200; }
  60%  { opacity: 0; z-index: 200;  }
  60.1%  { opacity: 0; z-index: 100;  }
  100%  { opacity: 0; z-index: 100;  }
}

@keyframes LOTAR-DATES {
  0% { opacity: 0; z-index: 100;  }
  57% { opacity: 0; z-index: 100; }
  60% { opacity: 1; z-index: 100;  }
  60.1% { opacity: 1; z-index: 200;  }
  77% { opacity: 1; z-index: 200; }
  80%  { opacity: 0; z-index: 200;  }
  80.1%  { opacity: 0; z-index: 100;  }
  100%  { opacity: 0; z-index: 100;  }
}

@keyframes LOTAR-STANDARD {
  0% { opacity: 0; z-index: 100;  }
  77% { opacity: 0; z-index: 100; }
  80% { opacity: 1; z-index: 100;  }
  80.1% { opacity: 1; z-index: 200;  }
  97% { opacity: 1; z-index: 200; }
  100%  { opacity: 0; z-index: 200;  }
}

/* NEWS ARCHIVE */

section#lotar-content article div p { text-align: justify; }

/* SCROLLBARS */

::-webkit-scrollbar {
  width: 0.9em;
  height: 0.9em;
}

::-webkit-scrollbar-track {
  background: #ebebeb;
}

::-webkit-scrollbar-thumb {
  background: var(--lotarblue);
  border-radius: 100vw;
  border: 0.2em solid #ebebeb;
}

@supports(scrollbar-color: red blue) {
  * {
    scrollbar-color: var(--lotarblue) #ebebeb;
    scrollbar-width: thin;
  }
}