/* Cleaned & Consolidated CSS
   - Redundant definitions merged
   - Grouped thematically for clarity
   - All rules listed in full (no omissions)
*/

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

/* ---------------------------
   Base / Typography
   --------------------------- */
body {
  font-family: "TheSans", open sans, sans-serif, Arial;
  font-weight: 300;
  margin:0;
  color:#001c3d;
  background-color:#fff;
  padding:0; 
  background-repeat:no-repeat;
  background-position:right 110px;
  background-repeat: repeat-y;
  background-size: 140px;
  font-size:12pt;
  line-height:16pt;
}

.license {
  padding-left: 10px;
  font-size: 12px;
}

p, ul, ol, td.big, li, u {
  font-size:12pt;
  line-height:16pt;
}

.cc-window {
  font-family: "TheSans", open sans, sans-serif, Arial;
  font-size:11pt;
  font-weight: lighter;
}

.smaller { font-size: 10pt; }
small { font-size:8.5pt; }

/* Math / Equations */
.math { font-family:times, serif; }
.variable { font-family:times, serif; font-style:italic; }
.vector { font-family:times, serif; font-weight:bold; }
.equation { padding-left:20px; font-family:times, serif; }

.shadow {
   /*-webkit-border-radius:5px;
   border-radius:5px;*/
   -webkit-box-shadow:2px 2px 15px #bababa;
   box-shadow:2px 2px 15px #bababa;
   max-width:90%;
}

#map {
  border-radius: 5px;
}

.note
{
     color:#001c3d;
     background:#ffdcbf;
     padding:10px;
     width:80%;
     border-radius:5px;
}


/* ---------------------------
   Header / Title / Subtitle
   --------------------------- */
.stickyheader { position: sticky; top:0; z-index:9000; }

.title {
  color:#fff;
  background:#001c3d;
  width:100%;
  display:flex;
  justify-content: space-between;
  align-items: center;
  padding:5px;
}

.title600 {
  color:#000;
  background:#fff;
  width:100%;
  height:29px;
}

.banner {
  padding:3px 30px;
  display:inline-block;
  flex-basis:100%;
  float:right;
}

h1.banner {
  font-family: 'TheSans';
  font-weight:400;
  font-size:18pt;
  margin:0 auto;
  padding-left:30px;
  margin-right: 0px;
}

h2.banner {
  color:#001c3d;
  font-size:14pt;
  font-weight:300;
  margin:1px 0 0 6px;
}

.confplace {
  display:inline-block;
  font-size:12px;
  flex-basis:20%;
  margin-right:6px;
  padding-bottom:10px;
}

.logo { padding-top:5px; }
.logo_title { display:inline-flex; margin-right:20px; float:left; flex-shrink:0; }

.subtitle {
  font-size:12pt;
  height:54px;
  color:#001c3d;
  background:#fff;
  width:100%;
  padding:1px 0 2px;
}

.subtitle_description { padding-left:20px; }

/* ---------------------------
   Links / Anchors
   --------------------------- */
a:link, a:visited { color:#0e71bb; text-decoration:underline; transition:.1s ease; }
a:hover { color:#00497d; text-decoration:underline; transition:.12s ease-out; }
a:active { color:#00497d; background:#fff; text-decoration:none; }

/* External link icons */
a:is([href*='://'], [href^='http://'], [href^='https://']):not([href*='recurrence-plot.tk']):not([href^='?']):not([href^='#']):not([href^='/']):not(.noexternal):after {
  content: "\f14c";
  width:13px; height:10px; margin-left:2px; padding-left:3px;
  background-position: bottom;
  vertical-align: -0.12em;   /* kleiner Offset nach unten */
  background-repeat: no-repeat;
  background-size: contain;
  font-size: 1em;
  display:inline-block;
    font-family: "Font Awesome 7 Free";
  font-weight: 900;        /* wichtig für Solid */
  display: inline-block;   /* sonst kann es verschwinden */
  margin-right: 0.2em;     /* optional: Abstand vor Linktext */
}

.hotels a:is([href*='://'], [href^='http://'], [href^='https://']):after,
.box a:is([href*='://'], [href^='http://'], [href^='https://']):after,
.speakers a:is([href*='://'], [href^='http://'], [href^='https://']):after {
  background-image: url("data:image/svg+xml,...fill='white'...");
}

.note>a { color:white; }
.note>a.external:after { fill:white; }

/* ---------------------------
   Navigation
   --------------------------- */
a.nav {
  font-size:12pt; color:#001c3d; font-weight:100;
  text-align:left; display:block;
  padding:5px 10px; text-decoration:none;
}
a.nav:hover { font-size:13pt; font-weight:400; padding:6px 10px 4px; transition:.1s ease-out; }
a.nav:active { color: #df362f;}
#selected { font-weight:500; font-size:13pt; height:20px; }
#selected:hover { padding:5px 10px; }

.navcolumn {
  background:#EBEDEF;
  padding:4px 4px 8px;
  font-size:12px;
  margin:20px 0 0 20px;
  width:150px;
  border-radius:6px;
  display:flex; flex-direction:column;
  position:sticky; top:100px; z-index:8000;
}

.leftcolumn { width:159px; margin-left:20px; padding:0; }
.infocolumn {
  padding:10px 2px;
  font-size:12px; text-align:center;
  color:#001c3d; background:#fff;
  width:148px; position:sticky; top:600px;
}


.menu_button_bar {
   display:none;
}

.img_right {
  float:right;
}

/* ---------------------------
   Content / Layout
   --------------------------- */
.page-container { display:flex; width:90%; }
.content {
  position:relative;
  top:.5em; left:60px; right:100px;
  width:auto; 
  height:auto;
  padding-right:180px;
  box-sizing:border-box;
}

.content_dark { color:#fff; background:#e4f3ff; padding:0; }
.content_darker { color:#fff; background:rgb(0,15,40); }

/* ---------------------------
   Lists / Boxes
   --------------------------- */
ul.speakers, ul.hotels, ul.box {
  list-style:none; padding:0;
  display:grid; gap:15px;
  grid-template-columns: repeat(3,1fr);
  /*grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
  width: 100%;
  box-sizing: border-box;
}

li.speakers, li.hotels, li.box {
  border-radius:.375rem;
  padding:10px 10px;
  padding-right: 0px;
  display:flex; flex-direction:column;
  box-sizing:border-box;
  padding-left: 20px;
  padding-bottom: 20px;
}

li.speakers { background:#468f5a; color:white; }
li.hotels { background:#ffdcbf; color:#001c3d; }

li.box { 
  background:#E6F3FE; 
  color:#001c3d;
  margin: 0px;
  padding: 0px;
}

li.speakers a { color:#ddd; }
li.speakers a:hover { color:#fff; }

li.box a, li.hotels a { color:#0e71bb; }
li.box a:hover, li.hotels a:hover { color:#001c3d; }

li.speakers a::before, li.hotels a::before  {
    content: "\f138";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;        /* wichtig für Solid */
    display: inline-block;   /* sonst kann es verschwinden */
    margin-right: 0.3em;     /* optional: Abstand vor Linktext */
}


li.box div {
  margin: 5px;         /* kein Offset */
  padding: 5px;
  box-sizing: border-box;  
}
li.box figure {
  margin: 0;         /* kein Offset */
  padding: 0px;
  box-sizing: border-box;  
}

li.box img {
  width: 100%;       /* Bild passt sich der Box an */
  height: auto;      /* Seitenverhältnis bleibt erhalten */
  margin: 0;         /* kein Offset */
  padding: 0px;
  display: block;    /* verhindert extra whitespace unter dem Bild */
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}



/* ---------------------------
   Forms / Inputs / Buttons
   --------------------------- */
input, textarea, select {
  background:rgb(250,250,250);
  border:1px solid rgb(210,210,210);
  font-size:11pt;
  padding:7px; margin:5px 0 5px 1px;
  font-family: "TheSans", open sans, sans-serif, Arial;
  color:#444;
    border: 1px solid #ffdad6;
    border-radius: 0.25rem;
}
input:focus, textarea:focus, select:focus {
  border:1px solid #df362f; outline:none;
  box-shadow: inset 0 0 6px rgba(0,0,0,.15);
}

input.nav:hover {
  background: #df362f;
  color: white;
}
input.nav {
  color: #df362f;
  background: white;
    border: 1px solid #ffdad6;
    border-radius: 0.25rem;
  }}

.fullwidth { width:100%; box-sizing:border-box; }

/* Buttons etc. (keine Änderungen, nur gruppiert) */
.confirmbutton { background-color: rgb(225,226,213); border-radius:8px;   font-family: "TheSans", open sans, sans-serif, Arial;
 padding:7px; margin:5px; margin-left:10px; margin-right:30px; display:inline-block; outline:none; box-sizing:border-box; text-decoration:none; border:none; transition:.2s ease; }
.confirmbutton:hover { background:#1C32F5; box-shadow:inset 0 0 15px rgba(0,0,0,.2); color:#fff; }
.confirmbutton:focus { border:2px solid rgb(152,203,204); margin:3px; transition:.3s ease; }

figure.group { width:350px; margin-left:0; }


/* ---------------------------
   Media Queries
   --------------------------- */
@media (max-width:910px) {
  ul.hotels, ul.speakers, ul.box { grid-template-columns: repeat(2,1fr); }
  .confplace { float:left; margin-left:-20px; padding-top:10px; }
  .links_programme { margin-top:10px; margin-right:20px; padding:10px; display:flex; flex-wrap:wrap; justify-content:space-between; background-color:rgb(225,226,213); border-radius:10px; width:100%; box-sizing:border-box; }
  .links_programme div:not(:last-child)::after { content:unset; }
  .links_programme>div { flex:1 1 45%; min-width:200px; }
  .right, .left, .rightright { float:none; max-width:100%; margin-left:0; }
  figure.group { width:350px; margin-left:0; }
}

@media (max-width:820px) {
  .title { flex-wrap:nowrap; }
  .content { top:.5em; }
  .links_programme { line-height:36px; }
}

@media (max-width:670px) {
  .page-container { display:block; width:97%; }

  h1.banner { font-size:16pt; margin-left:5px; padding-left:0; }
  .navcolumn { display:none; width: calc(100% - 30px); column-count:2; margin-left:0; z-index:100001; border:none; padding-bottom:10px; opacity:.9; float:none; }
  .leftcolumn { display:none; width:100%; float:none; }
  .infocolumn { background-color:#87C7FF; display:none; }
  .content { margin-left:0; box-sizing:border-box; top:3em; left:0; right:0; padding:0 20px;}
  .menu_button_bar { display:inline; float:left; padding:8px 0 0 10px; }
  .subtitle { height:40px; padding:0; width:100%; display:inline-block; color:#000; line-height:20pt; }
  .subtitle_description { padding-top:10px; margin-left:35px; float:right; margin-right:20px; }
  #directions img { max-width:100px; }
  .confplace { font-size:9pt; float:right; column-count:2; }
  .note { width:100%; margin:0 10px 0 0; box-sizing:border-box; }
  .banner { float:none; padding:3px 5px 3px 10px; flex-basis:auto; margin:0; }
  .logo { display:none; }
  .title { display:block; flex-wrap:nowrap; }
  h2.banner { margin-top:-9px; }
  body { background-image:none; background-repeat:repeat-y; background-size:20px; }
  ul.hotels, ul.speakers, ul.box { grid-template-columns: repeat(1,1fr); }
  
  a.nav, a.nav:hover, a.nav:active, #selected, #selected:hover {
    font-size:13pt; color:#001c3d; font-weight:100;
    text-align:left; display:block;
    padding:8px 10px; text-decoration:none;
  }
  a.nav:hover, #selected:hover { font-weight:400;  transition:.1s ease-out; }
  a.nav:active { color:#df362f; }
  #selected { font-weight:500; }


  .img_right {
    float:none;
  }
}