@import url("fonts.css");
@import url("solid.min.css");
@import url("fontawesome.min.css");
@import url("brands.min.css");


#b_zenodo {
    display: inline-flex; /* Make sure the text and spinner align horizontally */
    align-items: center; /* Vertically align the text and spinner */
}

#spinner {
    content: ""; /* Spinner content */
    display: inline-block;
    margin-left: 10px;
    width: 15px; /* Size of the spinner */
    height: 15px; /* Size of the spinner */
    border: 3px solid #999; /* Light gray background */
    border-top: 3px solid #fff; /* Spinner color */
    border-radius: 50%;
    animation: spin 1s linear infinite;
    visibility: hidden; /* Initially hidden */
}

.cc-window {
   box-shadow:inset 0 0 12px rgba(0,0,0,.4) !important;
   box-shadow:0px 5px 10px 10px rgba(0,0,0,.9);
}

.cc-dismiss {
   box-shadow:inset 0 0 14px 3px rgba(0,0,0,.7) !important;  
}

.cc-btn {
  border-width: 0px !important;
  border-radius: 0px !important;
}

/* Spinner animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading #spinner {
    visibility: visible; /* Make the spinner visible when loading */
}

.zenodo_title {
  font-weight: bold;
}

:target {
	scroll-margin-top:50px;
}

#minimap {
    position: fixed;
    top: 2em;
    right: 0;
    width: 100px;
    height: 100%;
    z-index: 100;
}


body {
  margin: 0;
  min-height: 100vh;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Crect x='1' y='1' width='5' height='5' fill='%23101010'/%3E%3C/svg%3E"),
    linear-gradient(180deg, #101010 5%, #050505 100%);
  background-repeat: repeat, no-repeat;
  background-attachment: fixed;
  color: #e7ebdf;
  font-family: "Lato","Trebuchet MS","Lucida Grande",Verdana,Arial,sans-serif;
  font-weight: 300;
  position: relative;
  overflow-x: hidden;
}


body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  background:
    radial-gradient(
      ellipse 75% 45% at 50% 82%,
      rgba(255, 245, 235, 0.12) 0%,
      rgba(255, 245, 235, 0.08) 20%,
      rgba(255, 245, 235, 0.04) 40%,
      rgba(255, 245, 235, 0.0) 65%
    );

  filter: blur(45px);
  opacity: 0.85;

  animation: glow 12s ease-in-out infinite;
}

@keyframes glow {
  0%   { opacity: 0.35; transform: scale(0.98); }
  50%  { opacity: 0.89; transform: scale(1.02); }
  100% { opacity: 0.35; transform: scale(0.98); }
}

a
{
   color:rgb(231, 235, 223);
   text-decoration:underline;
	padding-left:4px;
	padding-right:4px;
	margin-left:-4px;
	margin-right:-4px;
}

a:visited
{
   color:rgb(231, 235, 223);
   text-decoration:underline;
}

a:active
{
    background-color:rgb(231, 235, 223);
	color:#000000;
	text-decoration:none;
}

a:hover, a:focus
{
    background-color:rgba(191, 185, 172, 1.0);
	color:#000000;
	text-decoration:none;
	border-radius:2px;
	box-shadow:inset 0 0 12px rgba(0,0,0,.4);
}

a.bildwechsel {
	padding-left:0px;
	padding-right:0px;
}
a.bildwechsel:hover {
    background-color:none;
	box-shadow:none;
   background:#000000;
   background-image:url('0.pictures/xdarkgray-gitter.gif');
}


#b_reversedsorting_talks, #b_reversedsorting, #b_projectlist, #show_thirdparty, #hide_thirdparty, #show_all, #show_posters, #show_invited, #show_talks, #show_lectures, .toggleAbstract, .title {
   cursor:pointer;
   color: #ddd;
   text-decoration: underline;
}

.thirdparty
{
   color:#777;
   display:none;
}

.a_thirdparty, a.a_thirdparty {
   color:#777;
}

#bildwechsel_old {
    content: url('0.pictures/nld.gif');
    transition:.5s ease;
}

#bildwechsel_old:hover {
    filter:brightness(70%);
    transition:.25s ease;
}

div.nav
{
    background-color:#666666;
	color:#FFFFFF;
    height:2em;
    top:0px;
    left:0px;
    right:0px;
    width:auto;
    text-align: center;
    padding-top:0px;
    margin-top:0;
    display:flex;
    flex-direction:row;
    position: sticky;
    top:0; z-index:9000;
    box-shadow:0px 10px 10px -5px rgba(0,0,0,.9);
}

a.nav, a.nav_active
{
   background-color:#666666;
   text-decoration:none;
   font-weight:400;
   border-left:solid #bbb .85px;
   border-right:solid #bbb .85px;
   text-align:center;
   margin-right:0px;
   margin-left:0px;
   padding-top:6px;
   overflow: hidden;
    flex-grow:2;
    vertical-align:middle;
	border-radius:0px;
	box-shadow:inset 0 0 15px rgba(0,0,0,.4);
    transition:.2s ease-out;
    text-shadow: 0 0 3px rgba(249, 224, 169, 0.75), 0 0 12px rgba(227, 235, 212, 0.75);
}

a.nav_active
{
    background-color:#444444;
	color:#FFFFFF;
}

a.nav_active::before {
  content: "";
  position: absolute;
  inset: -40%;
  pointer-events: none;
  z-index: 0;

  background: radial-gradient(
    ellipse at center,
    rgba(255, 200, 160, 0.35) 0%,
    rgba(255, 200, 160, 0.15) 40%,
    rgba(255, 200, 160, 0.0) 70%
  );
  color: red;

  filter: blur(1px);
  opacity: 0.6;

  /*animation: glow2 222s ease-in-out infinite;*/
}
a.nav_active {
  z-index: 1;
}


@keyframes glow2 {
  0%   { opacity: 0.25; transform: scale(0.98); }
  50%  { opacity: 0.89; transform: scale(1.02); }
  100% { opacity: 0.25; transform: scale(0.98); }
}

.label_active {
  display: inline-block;      /* wichtig für transform */
  animation: textGlow 10s ease-in-out infinite;
}
@keyframes textGlow {
  0% {
    text-shadow:
      0 0 2px rgba(249,224,169,0.63),
      0 0 9px rgba(227,235,212,0.53);
    transform: scale(0.98);
  }
  50% {
    text-shadow:
      0 0 4px rgba(249,224,169,1),
      0 0 14px rgba(227,235,212,0.9);
    transform: scale(1.08);
  }
  100% {
    text-shadow:
      0 0 2px rgba(249,224,169,0.63),
      0 0 9px rgba(227,235,212,0.53);
    transform: scale(0.98);
  }
}



a.nav:hover, a.nav_active:hover, a.nav:focus, a.nav_active:focus
{
    text-decoration:none;
    color:#000000;
    background-color:#FFFFFF;
    transition:.15s ease;
}

div.menu_button_bar {
    background-color:#444444;
    display:none;
    height: 3em;
}

img.menu_button {
    height:18px;
    position:absolute;
    right:10px;
    top:10px;
    display:none;
}

.title, .left
{
   padding-left:30px;
   width:80%;
}

h1.name {
   text-transform:uppercase;
}

h1.title {
   margin-bottom:0px;
   padding-bottom:0px;
   padding-top:20px;
   text-transform:uppercase;

}

h2.title {
   padding-top:10px;
   padding-bottom:0px;
}

h2.title:hover {
    cursor:auto;
}

.title:hover {
 text-shadow: 0 0 3px rgba(249, 224, 169, 0.95), 0 0 12px rgba(227, 235, 212, 0.95); 
}
.title {
  position: relative;
  z-index: 2;
  transition: text-shadow 0.34s ease, color 0.34s ease;
}

.title:hover {
  text-shadow:
    0 0 4px rgba(249, 224, 169, 0.5),
    0 0 10px rgba(227, 235, 212, 0.19),
    0 0 20px rgba(255, 240, 200, 0.15);
}

ul.left, ol.left
{
   padding-left:60px;
   width:75%;
}

.imprintlink
{
	position:fixed;
	bottom:0px;
	right:0px;
	margin:9px;
	font-size: 10px;
	clear:both;
	white-space: nowrap;
}
.small
{
   font-size: smaller;
   padding-left:30px;
   width:75%;
   line-height:140%;
}

ul.small
{
   padding-left:60px;
}
ul.small li
{
   margin-bottom: .5em;
}

 .ui-jcoverflip {
        position: relative;
      }
     
      .ui-jcoverflip--item {
        position: absolute;
        display: block;
      }

.figure_right {
   padding-right:100px;
   padding-left:10px;
   float:right;
}

.figure_left {
   padding-right:20px;
   padding-left:30px;
   float:left;
}


.block_right {
   padding:7px;
   margin-left:40%;
   overflow: hidden;

}

.block_left {
   margin-bottom:0;
   float:left;
   text-align:right;
   width:38%;
   padding:7px;

}

div.container {
    width: 100%;
    margin: 0px;
    clear:left;
}

i > small > img, i > small > a > img {
    filter: saturate(0) brightness(0.8);
    transform: scale(0.99);
    transition: filter 0.3s ease, transform 0.3s ease;
    margin-top:2px;
    max-width:120px;
}

i > small > img:hover, i > small > a > img:hover {
    filter: saturate(1) brightness(1);
    transform: scale(1.01);
    background-color:#BB0000;
}

i > small > a:hover {
    background-color:rgba(255,255,255,.00);
    color:#000;
}


a > img.img_slider {
    transform: scale(0.99);
    transition: filter 0.3s ease, transform 0.3s ease;
}

a > img.img_slider:hover {
    transform: scale(1.01);
}

a:has(> img):hover {
  background-color:rgba(1,0,0,.0);
}

.toggle {
font-size:0;
}

.rotate-90 { 
  transform: rotate(90deg);
  transition: transform 1s ease;
}

h3.title {
    padding-top:15px;
    padding-left:0px;
    margin-left:-40px;

}

#t_projectlist {
   display:none;
}

#b_reversedsorting:hover, #b_projectlist:hover {
    cursor:pointer;
    background-color:#BBBBBB;
	color:#000000;
	border-radius:2px;
	box-shadow:inset 0 0 12px rgba(0,0,0,.4);
	padding-left:4px;
	padding-right:4px;
	margin-left:-4px;
	margin-right:-4px;
    text-decoration: none;
}

#me {
    filter:grayscale(100%);
	margin-left:10px;
	margin-right:35px;
	padding:0;
    transition:1.5s ease;
}


#me:hover {
   filter:grayscale(0%);
   transition:.5s ease;
}



#bildwechsel {
	padding-left:0px;
	padding-top:8px;
	padding-right:0px;
    transition:1.5s ease;
    filter:saturate(0);
}


#bildwechsel:hover {
    transition:.5s ease;
    filter:saturate(1);
}

span.toggleAbstract {
    text-decoration:underline;
	padding-left:4px;
	padding-right:4px;
	margin-left:-4px;
	margin-right:-4px;
}

span.toggleAbstract:hover, #show_all:hover, #show_posters:hover, #show_invited:hover, #show_talks:hover, #show_lectures:hover, #show_thirdparty:hover, #hide_thirdparty:hover, #b_reversedsorting_talks:hover {
    background-color:#BBBBBB;
	color:#000000;
	border-radius:2px;
	box-shadow:inset 0 0 12px rgba(0,0,0,.4);
}

span.toggleAbstract:hover {
	text-decoration:none;
}

.abstractBlock {
    padding:10px;
    background-color:#BBBBBB;
	color:#000000;
	border-radius:2px;
	box-shadow:inset 0 0 12px rgba(0,0,0,.4);
    /*font-size: smaller;*/
    font-size: 14px;
    text-indent:0pt;
    display:block;
}

.abstractBlock a {
	color:#000000;
}

.presenter {
  text-decoration: underline dashed;
  text-underline-offset: 2px; 
}

#nav_block {
   padding:5px;
   padding-top:3px;
   padding-bottom:3px;
   z-index:10;
   opacity:0.8;
   filter:alpha(opacity=80);
   background:rgba(0,0,0,.51);
   position:fixed;
   right:60px;
   top:38px;
   width:auto;
   max-width:200px;
   -webkit-border-radius:4px;
   border-radius:4px;
   -webkit-box-shadow:0px 0px 15px rgba(249, 224, 169,.2);
   box-shadow:0px 0px 15px rgba(249, 224, 169,.2);
}

.flash {
   display:inline;
   font-size:11px;
   padding-top:4px;
   padding-bottom:4px;
   padding-left:7px;
   padding-right:7px;
   line-height:160%;
   text-align:center;
}

div.bib_entry {
	display:inline-flex;
}
p.bib_entry {
	display:inline-block;
}

.PlumX-Popup {
   margin-top:-10px;	
   margin-bottom:-10px;	
}

.tooltip {
    visibility:hidden;
    z-index:10000;
    border:0;
    /*position: absolute;*/
    /*transform: translateY(-5px) translateX(-5em);*/
    transform:  translateX(-1.3em);
    transition: all 0.3s ease-in-out;
    opacity: .4;
    border-radius:4px;
    box-shadow: 3px 3px 6px rgba(0, 0, 0, .75);
    background:gray;
    /*
	color:#000;
    font: 16px;
    padding: 5px 10px;
    */
        
}

.label {
	color: gray;
}

.label_hover:hover .label {
	color: white;
    visibility:hidden;
}

.label_hover:hover .tooltip {
    visibility:visible;
    /*transform: translateX(-3em) translateY(-35px);*/
    opacity: 1;
}

.selected {
	/*text-decoration: underline;*/
    /*text-shadow: 0px 0px 7px rgb(255, 255, 255);*/
    font-weight: bold;
    color: white;
}



/*a[rel*="external"]::after {    
a.external::after {    
a:not([href*='://']):not([href*='pik-potsdam.de']):not([href^='?']):not([href^='#']):not([href^='/']):after {*/
a:is([href*='://'], [href^='http://'], [href^='https://']):not([href*='pik-potsdam.de']):not([href^='?']):not([href^='#']):not([href^='/']):not(.noexternal):after {
    content: "";
    width: 13px;
    height: 13px;
    margin-left: 4px;
    margin-bottom: -1px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
}

a.a_thirdparty:is([href*='://'], [href^='http://'], [href^='https://']):not([href*='pik-potsdam.de']):not([href^='?']):not([href^='#']):not([href^='/']):not(.noexternal):after {
    content: "";
    width: 13px;
    height: 13px;
    margin-left: 4px;
    margin-bottom: -1px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='gray' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
}


a:is([href*='://'], [href^='http://'], [href^='https://']):not([href*='pik-potsdam.de']):not([href^='?']):not([href^='#']):not([href^='/']):not(.noexternal):hover:after {
    filter: invert(1);
}


a.a_thirdparty:is([href*='://'], [href^='http://'], [href^='https://']):not([href*='pik-potsdam.de']):not([href^='?']):not([href^='#']):not([href^='/']):not(.noexternal):hover:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
    filter: invert(1);

}


li.zenodo {
	padding-bottom:10px;
}



@media (max-width: 750px) {

    #minimap {
    display:none;
    }
    
    body
        {
        font-size:15px;
        line-height:150%;
        }
        

    div.nav
    {
        -webkit-backface-visibility: hidden;
        line-height:100%;
        display:none;
        position:relative;
        height:auto;
        padding-top:0px;
    }

    a.nav, a.nav_active
    {
    display:block;
    text-align: left;
    margin-top:0em;
    height:1.82em;
    padding-top:15px;
    padding-left:12px;
    border:none; 
    background-color:#444444;
    font-size: 17px;
    }
    a.nav_active {
        background-color:#666666;
    }

    div.menu_button_bar {
        display:block;
        background-color:#444444;
        height: 2.5em;
        position:relative;
        right:0px;
        top:0px;
        left:0px;
        width:auto;
        margin:0;
    }
    img.menu_button {
        background-color:#444444;
        height:20px;
        position:absolute;
        right:10px;
        top:10px;
        display:inline;
    }


    h1, h2
    {
        line-height:130%;
    }

    .title, .left
    {
    padding-left:10px;
    width:90%;
    }

    ul.left, ol.left
    {
    padding-left:30px;
    width:90%;
    }

    .small
    {
    font-size: smaller;
    padding-left:10px;
    width:90%;
    line-height:150%;
    }

    ul.small
    {
    padding-left:30px;
    }

    .figure_right,.figure_left {
    float:none;
    margin-left: auto;
    margin-right: auto;
    display:block;
    top:3em;
    }

    .block_right,.block_left {
    margin-bottom:0;
    float:none;
    clear:both;
    text-align:left;
    width:95%;
    padding:7px;
    margin-left:10px;

    }

    @font-face {
        font-family: 'DISTROBT';
        src: url('../fonts/DISTROBT.eot');
        src: local('DISTROBT'), url('../fonts/DISTROBT.woff') format('woff'), url('../fonts/DISTROBT.ttf') format('truetype');    
    }

    .toggle {
        font-family: 'DISTROBT';
        display: inline;
        margin-right:10px;
        font-size:18px;
    }

    h1.title {
        background-color:#444444;
        width:auto;
        margin:0;
        font-size:22px;
        position:relative;
        !top:2em;
        padding:5px;

    }


    h3.title {
        width:100%;
        margin:0;
        font-size:22px;
        border:none red 1px;
        padding:5px;
        padding-left:15px;
        margin-left:-40px;
        border-bottom:solid #777 1px;
        position:relative;
    }

    ol {
        margin-left:-10px;
        width:102%;
        position:relative;
        left:1em;

    }
    li {
        width:90%;
    }

    #t1{
    display: none;
    }
    #t2{
    display: none;
    }
    #t3{
    display: none;
    }
    #t4{
    display: none;
    }
    .annual_block{
    display: none;
    }

    #me {
    display: none;
    }

    #nav_block {
    display: none;
    }


}
