* { padding:0px; margin:0px; }

body {
  min-height: 100vh;
}

.container { width:96%; max-width:75rem; margin-left:auto; margin-right:auto;}
.row { position:relative; width:100%; margin: 0 0 30px 0px; }
.row [class^="col"] { float:left; margin:0px 2%; }
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
  width:96%;
}
.col-1-sm { width:4.33%; }
.col-2-sm { width:12.66%; }
.col-3-sm { width:21%; }
.col-4-sm { width:29.33%; }
.col-5-sm { width:37.66%; }
.col-6-sm { width:46%; }
.col-7-sm { width:54.33%; }
.col-8-sm { width:62.66%; }
.col-9-sm { width:71%; }
.col-10-sm { width:79.33%; }
.col-11-sm { width:87.66%; }
.col-12-sm { width:96%; }
.row::after { content:""; display:table; clear:both; }
@media only screen and (min-width:720px) {
  .col-1-md { width:4.33%; }
  .col-2-md { width:12.66%; }
  .col-3-md { width:21%; }
  .col-4-md { width:29.33%; }
  .col-5-md { width:37.66%; }
  .col-6-md { width:46%; }
  .col-7-md { width:54.33%; }
  .col-8-md { width:62.66%; }
  .col-9-md { width:71%; }
  .col-10-md { width:79.33%; }
  .col-11-md { width:87.66%; }
  .col-12-md   { width:96%; }
}
@media only screen and (min-width:960px) {
  .col-1-lg { width:4.33%; }
  .col-2-lg { width:12.66%; }
  .col-3-lg { width:21%; }
  .col-4-lg { width:29.33%; }
  .col-5-lg { width:37.66%; }
  .col-6-lg { width:46%; }
  .col-7-lg { width:54.33%; }
  .col-8-lg { width:62.66%; }
  .col-9-lg { width:71%; }
  .col-10-lg { width:79.33%; }
  .col-11-lg { width:87.66%; }
  .col-12-lg { width:96%; }
}

body { background:#E5E3DA; min-width:260px }
header { background-image:url(../img/prague.jpg); height:20vw; min-height:250px; background-position:center; background-size:cover;}
header .row { position:relative; height:20vw; min-height:250px; }
header .cover { background:rgba(0,0,0,0.25); width:100%; min-height:250px; height:20vw; }
header .bot { position:absolute; bottom:20px; }

header h1 { color:white; font:700 30pt "Neuton", serif; background:#822D1C; padding:0px 20px 6px 20px; margin-bottom:20px; width:fit-content; }
header h2 { color:white; font:200 18pt "Neuton", serif; background:#4F7740; padding:2px 20px 8px 20px; margin-bottom:20px; width:fit-content; }
@media only screen and (min-width:720px) {
  header h1 { font-size:34pt; }
  header h2 { font-size:20pt; }
}
@media only screen and (min-width:1000px) {
  header h1 { font-size:40pt; }
  header h2 { font-size:24pt; }
}

header a { color: inherit; text-decoration: none; }
header a:hover { text-decoration: none; }

article { padding:30px 0px 0px 0px; }
article h2 { color:white; font:300 22pt "Neuton", serif; background:#4F7740; padding:0px 15px 6px 15px; margin:20px 0px 20px 0px; width:fit-content; }
article h3 { color:white; font:300 16pt "Neuton", serif; background:#822D1C; padding:0px 10px 5px 10px; margin:30px 0px 10px 0px; width:fit-content; }
article ul { margin-left:30px; }
article p, article li { font:200 14pt "Manrope", sans-serif; line-height:1.5em; margin-bottom:10px; }
article p { hyphens:auto; }
article .condensed li { margin-bottom:0px; }
article li p { margin-bottom:0px; }
article strong { font-weight:500; }

.signup-wrapper { background-color:#4F7740; padding:30px 0px 40px 0px;}
article .signup h2 { color:white; font:300 22pt "Neuton", serif; background:none; padding:0px; margin:0px 0px 5px 0px; }
article .signup p { color:white; }
.signup button, .signup input { font:400 13pt "Manrope", sans-serif; line-height:1.5em; }
.signup input { padding:2px 10px; margin:0px 10px 10px 0px;  width:calc(100% - 200px); min-width:200px; background:#E5E3DA; border:solid 2px #38572d; border-radius:8px; }
.signup button { width:160px; background:#38572d; color:white; border-style:none; border-radius:8px; padding:5px 10px; cursor:pointer; }
.signup button:hover { background:#294220; }

article a, article a:visited { color:#a92b12; text-decoration:none; }
article a:hover, article a:active { text-decoration:underline; }

.events li { list-style-type:none; }
.events i { font-size:30pt; float:left; margin:8px 10px 10px 0px; }
.events ul { margin:0px 0px 15px 50px; }

.event {
  margin-bottom: 20px;
  padding: 15px 20px;
  background: #ffffff;
  border-left: 5px solid #822D1C;
  position: relative;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.event h3 {
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 18pt;
  color: white;
  background: #822D1C;
  padding: 5px 15px;
  display: inline-block;
  font-weight: 300;
  width: auto;
}

.event h3 a {
  color: white;
  text-decoration: none;
}

.event h3 a:hover {
  text-decoration: none;
}

.event .date-recording {
  margin-bottom: 15px;
}

.event .date-recording p {
  margin-right: 30px;
  margin-bottom: 5px;
}

.event ul {
  margin: 10px 0 5px 0;
  list-style-type: none;
}

.event li {
  margin: 0;
  position: relative;
  padding-left: 1.5em;
}

.event li::before {
  content: "•";
  color: #822D1C;
  font-weight: bold;
  display: inline-block;
  position: absolute;
  left: 0;
  font-size: 20pt;
}

.event a {
  color: #822D1C;
  font-weight: 400;
  text-decoration: none;
}

.event a:hover {
  text-decoration: underline;
}

.icon, .icon, .icon {
  margin-right: 5px;
  font-weight: normal;
}

.people img { max-width:140px; float:left; margin-top:20px; box-shadow:0px 0px 7px rgba(0,0,0,0.5); }
.people .info h3 { margin-top:20px; }
.people .info { margin-left:160px; margin-bottom:20px; }
.people p { margin-bottom:0px;}