/* Table of contents
- Normalize
- Grid
- Fonts
- Base Styles
- Typography
- Links
- Lists
- Code
- Tables
- Blockquotes
- Spacing
- Fontawsome
- Utilities
- Navigation
- Footer
- Clearing
- Media Queries
*/

/* Normalize*/
* {
  margin: 0;
  padding: 0;
}


/* Grid*/
.container {
  position: relative;
  width: 100%;
  max-width: 75vw;
  margin: 0 auto;
  padding: 0 2em;
  box-sizing: border-box; 
}

/* rows */
.row {
	padding: 0;
	margin: 0;
}
.row:before,
.row:after {
  content:"";
  display:table;
}
.row:after {
  clear:both;
}

/* columns */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 4%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

/* cells */
.cell1of1 {	width: 100%;}
.cell2of2 {	width: 100%;}
.cell1of2 {	width: 48%;}
@media only screen and (max-width: 480px) {
  .cell1of2, .cell2of2 { width: 100%; }
}

.cell3of3 {	width: 100%; }
.cell2of3 {	width: 65.33%; }
.cell1of3 {	width: 30.66%; }
@media only screen and (max-width: 600px) {
	.cell1of3, .cell2of3, .cell3of3 { margin: 0; width: 100%; }
}

.cell4of4 { width: 100%; }
.cell3of4 { width: 74%; }
.cell2of4 {	width: 48%; }
.cell1of4 {	width: 22%; }
@media only screen and (max-width: 700px) {
	.cell1of4, .cell2of4, .cell3of4, .cell4of4 { margin: 0; width: 100%; }
}

.cell5of5 { width: 100%; }
.cell4of5 { width: 79.2%; }
.cell3of5 { width: 58.4%; }
.cell2of5 { width: 37.6%; }
.cell1of5 { width: 16.8%; }
@media only screen and (max-width: 480px) {
	.cell1of5, .cell2of5, .cell3of5, .cell4of5, .cell5of5 { width: 100%; }
}

.cell6of6 { width: 100%; }
.cell5of6 { width: 82.66%; }
.cell4of6 { width: 65.33%; }
.cell3of6 { width: 48%; }
.cell2of6 { width: 30.66%; }
.cell1of6 { width: 13.33%; }
@media only screen and (max-width: 480px) { 
  .cell1of6, .cell2of6, .cell3of6, .cell4of6, .cell5of6, .cell6of6 { width: 100%; }
}

.cell7of7 { width: 100%; }
.cell6of7 { width: 85.14%; }
.cell5of7 { width: 70.28%; }
.cell4of7 { width: 55.42%; }
.cell3of7 { width: 40.57%; }
.cell2of7 { width: 25.71%; }
.cell1of7 { width: 10.85%; }
@media only screen and (max-width: 480px) { 
  .cell1of7, .cell2of7, .cell3of7, .cell4of7, .cell5of7, .cell6of7, .cell7of7 { width: 100%; }
}

.cell8of8 { width: 100%; }
.cell7of8 { width: 87%; }
.cell6of8 { width: 74%; }
.cell5of8 { width: 61%; }
.cell4of8 { width: 48%; }
.cell3of8 { width: 35%; }
.cell2of8 { width: 22%; }
.cell1of8 { width:  9%; }
@media only screen and (max-width: 480px) { 
  .cell1of8, .cell2of8, .cell3of8, .cell4of8, .cell5of8, .cell6of8, .cell7of8, .cell8of8 { 	width: 100%; }
}


/* Fonts*/
@font-face {
  font-family: 'roboto_light';
  src: url('../fonts/roboto_light.woff')            format('woff');}
@font-face {
  font-family: 'roboto_regular';
  src: url('../fonts/roboto_regular.woff')          format('woff');}
@font-face {
  font-family: 'roboto_medium';
  src: url('../fonts/roboto_medium.woff')            format('woff');}


/* Base Styles*/
html, header { 
  background: url("../img/bg.png") repeat scroll 0% 0%, #F5F1E8 none repeat scroll 0% 0%;
  font-size: 100%; height: 100%; 
  line-height: 1.5; }
.wrap {
  background: #FFF;
  margin: -2.5em -2em -3em;
  padding: 3em 2em 2.5em 2em;
}


/* Typography*/
body {
  color: #000;
  font-family: 'roboto_light', sans-serif;
  font-size: 1em;
  font-weight: 400; }
h1, h2, h3, h4, h5, h6 {
  color: #222;
  font-family: 'roboto_regular', sans-serif;
  font-weight: 300;
  letter-spacing: -.03em;
  line-height: 1;
  margin: 0 0 .8em; }
h1 { font-size: 1.6em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.3em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.1em; }
.home h1 {font-size: 1.5em}

p { line-height: 1.4em; }

strong, b, .bold, dt { font-family: 'roboto_regular', sans-serif; font-weight: normal;}

em, i, .italic { font-style: italic; letter-spacing: .03em; }


/* Links */
a         { color: #005DB7; text-decoration: none; }
a:hover   { text-decoration: underline; }
a:visited { color: #005DB7; }
a:active,
a:focus   { outline: 0; }
a:target  { color: #007F00; }


/* Lists */
ul {
  list-style: circle; }
ol {
  list-style: decimal; }
ol, ul {
  padding-left: 1em;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.2em 0 1.2em 3em;
  font-size: 90%; }
li {
  margin-bottom: 0.3em; }
.lsn { list-style: none; }

ul.team, ul.team ul { list-style: inside none; margin: .5em 0 2em;}
ul.team ul { margin: 0 0 2em 1em; }
ul.team ul li { margin: 0; }
ul.team li img { border-radius: 50%; float: left; margin: 0 .8em 0 0; height: 50px; width: 50px;}
ul.team a span {color: #000;}
ul.team a {word-break: break-all; display: inline-block;}


/* Code and code-like */

pre {white-space: pre-wrap;}

code {
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px;
  font-size: 90%;
  margin: 0 .2em;
  padding: .2em .5em;
  white-space: nowrap; }
pre > code {
  display: block;
  overflow: auto;
  padding: 1rem 1.5em;
  white-space: pre;
  word-wrap: normal; }


/* Tables */
th,
td {
  padding: 1em 1.2em;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }


/* Blockquotes */
blockquote {
  border-left: 2px solid #999;
  font-style: italic;
  padding: 0 0 0 .6em;
}


/* Spacing */
article { margin: 0; }
button,
.button {
  margin-bottom: 1em; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5em; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 1.5em; }


/* Fontawsome */
span.fa { color: #555; margin: 0 0.5em 0 0;}


/* Utilities */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Header */
header { margin: 0 -2em 1.5em; }
header a img { display: block; margin: 1em auto 1.2em; padding-top: .6em; }
header span { position: absolute !important; top: -9999em !important; left: -9999em !important; }


/* Navigation */
nav { position: relative; }
nav ul { background: #008080; list-style: none; margin: 0; padding: 0; text-align: center; width: 100%; }
nav ul li { display: inline-block; margin: -1px 0 0 0; }
nav ul li a, 
nav ul li a:visited,
nav ul li a:hover { color: #FFF; display: block; padding: .4em .8em; text-align: center; text-decoration: none; }
nav ul li a:hover { text-decoration: underline; }
nav ul li.active a,
nav ul li.active a:hover { background: #FFF; color: #000; }
nav li:hover ul a { background: #FFF; color: #005DB7; }
nav li ul a:hover { color: #000; }
nav li ul { display: none; position: absolute; width: auto; }
nav li ul li { display: block; float: none; }
nav li ul li a { min-width: 8em; width: auto; }
nav ul li a:hover + .sub, .sub:hover { display: block; }

.show-menu { text-decoration: none; color: #fff; background: #008080; text-align: center; padding: .5em 0; display: none; }

nav input[type=checkbox] { display: none; -webkit-appearance: none; }
nav input[type=checkbox]:checked ~ ul { display: block; }

@media screen and (max-width : 700px){
  nav ul {
    position: static;
    display: none;
  }
  nav ul li {
    display: block;
    width: auto;
  }
  .show-menu {
    display:block;
  }
}


/* Footer */
footer {
  background: #565A50;  /* was #565A5E  changed to increase contrast ratio  */
  color: #FFF;          /* was #BBB     changed to increase contrast ratio  */
  font-size: 0.9em;
  margin: 0 -2.2em -3em;
  padding: 1.5em 2em 1em 2em;
}
footer a, footer a:visited { color: #80e0ff; }
footer svg { margin: 0 0 0.7em; }
footer ul { list-style: none; }
footer li { border-bottom: 1px solid #555; }
footer li a {display: block; font-size: 0.9em;}
footer li a:hover { color: #EEE; text-decoration: none; }


/* Misc */
hr {
  clear: both;
  color: #e3e3e5;
  background: #e3e3e5;
  height: 1px;
  border: 0;
  margin: 0 0 2.5em; }

hr.conference-start {
  clear: both;
  color: #e3e3e5;
  background: #e3e3e5;
  height: 4px;
  border: 0;
  margin: 0 0 0.5em; }

hr.conference-end {
  clear: both;
  color: #e3e3e5;
  background: #e3e3e5;
  height: 4px;
  border: 0;
  margin: -2.2em 0 2.5em; }



    

/* Various */
/* cookie consent */
@media print{.cc_banner-wrapper,.cc_container{display:none}}
.cookieconsent { background: #FFF; margin: 0 -2em; padding: 0 2em; }
.cookieconsent .btn { background: #f1d600; border-radius: 4px; color: #000; float: right; padding: .2em .4em .1em; text-align: center; }

/* search */
.search { float: right; height: 20px; margin: 0 0 -.5em; padding: .5em 1.8em; overflow: hidden; }
.search form { text-align: right; }


/* home */
.home { padding: 2.5em 2em 2.5em 2em; }
.home dt { margin: 1em 0 .3em; }

/* teaser */
.teaser a:hover { display: inline-block; text-decoration: none; }
.teaser section a h2,
.teaser section a h3 { color: #005DB7; font-size: 1.2em; margin: 0 0 .5em; padding: .2em 0; }
.teaser section a p { color: #000; }
.teaser section a:hover p { color: #005DB7; }

/* news */
span.fa-rss-square { color: #fe9900;}
small span.fa-rss-square { margin: 0 .2em; }
ul.news-posts, 
ul.all-news-posts { list-style: none; margin: 0 0 1em; }
ul.news-posts li, 
ul.all-news-posts li { margin: 0 0 0.6em; }
ul.news-posts a, 
ul.all-news-posts a { display: block; }
ul.news-posts a:hover, 
ul.all-news-posts a:hover { text-decoration: none; }
ul.news-posts span.post-date,
ul.all-news-posts span.post-date { color: #555; display: block; font-size: 0.8em; }
ul.news-posts h3 { color: #005DB7; font-size: 1.2em; margin: 0; padding: 0 0 .6em; }
ul.news-posts p { color: #000; }
ul.news-posts a:hover p, 
ul.all-news-posts a:hover h3 { color: #005DB7; }
ul.all-news-posts h3 {font-size: 1em;}
ul.all-news-posts h1, 
ul.all-news-posts p {display: none;}
ul.all-news-posts {margin: 0 0 2.5em;}

/* toc */
.toc { background: #f8f9fa; border: 1px solid #999; border-radius: 4px; list-style: none; padding: .6em;}
.toc li:before { content: "\27A4 \2002 \2005"; color: #777; white-space: nowrap;}
.toc li { border-bottom: 1px dotted #999; margin: 0; padding: .2em .5em;}
.toc li:last-child { border: none;}
.toc li a { display: inline-block; width: auto; word-break: break-all;}
.toc a:hover { color: #000; text-decoration: none; }
.toc li ul { list-style: none; margin: 0.5em 0 0.5em 1.2em;}
.toc li li { border-bottom: none ;}

/* logos */
.endorse, .reject { list-style: none; }
.endorse li, .reject li { padding: .2em 0; }
.endorse li:before { content: "\2705 \2002 \2005"; color: #777; white-space: nowrap; }
.reject li:before { content: "\274E \2002 \2005"; color: #777; white-space: nowrap; }

/* links */
.links ul { list-style: none; }
.links ul li { margin: 0 0 1em; }
.links ul li a:first-child { font-weight: bold; }
.links .toc li a:first-child { font-weight: normal; }
.links .toc li { margin: 0; }

/* books */
.books img { float: left; margin: .3em 1em .2em 0; padding: .1em; border: 1px solid #DDD; }

/* team */
.team h2 { font-size: 1.2em; margin: 1.4em 0 .6em; padding: 0.15em 0 0 0; }
.team h2 .role { color: #999; font-size: 0.7em; }

/* flattr */
a[href*="flattr.com/submit/auto"] { float: right; }


/* Clearing */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }


/* Media Queries */

/* === Site title (centered & bigger) === */
.site-title{
  display:block;
  text-align:center;
  margin:1.2rem 0;
  font-weight:700;
  font-size:clamp(1.8rem, 4vw, 2.6rem);
  line-height:1.2;
  letter-spacing:-0.02em;
}
.site-title,
.site-title:visited{
  color:#000;
  text-decoration:none;
}
.site-title:hover{ text-decoration:underline; }

/* === Language / tech badges (icons next to links) === */
.language-badge-wrapper {
  display: inline-block;
  vertical-align: middle;
  margin-left: 4px;   /* small gap from the text */
}
.language-badge {
  height: 24px;       /* make icons 24px tall */
  width: auto;        /* keep aspect ratio */
  vertical-align: middle;
  display: inline-block;
  object-fit: contain;
}

/* Make H1 clearly bigger and bold */
h1 {
  font-size: 1.8em;   /* bigger than h2 (1.5em) */
  font-weight: 350;   /* normal */
}

/* If you keep the .home class, stop it shrinking the H1 */
.home h1 {
  font-size: 1.8em;
}