html {
  font-size: 12pt;
 font-family: Allerta, sans-serif;
 line-height: 1.4em;
}

body {
  background-color: black;
  color: #f0f0f0;
  margin: 0;
  padding: 0;
}

div.event
{
  border-radius: 10px;
  position: relative;
}

/*@keyframes shadows {
   0%   { border-color: #b03a84; }
   25%  { border-color: #d3d05b; }
   50%  { border-color: #6eba56; }
   75%  { border-color: #22a3da; }
   100% { border-color: #b03a84; }
}

div.event.today
{
  animation: shadows 10s infinite
}*/

a.mededeling
{
	text-decoration:none;
	color: #22a3da;
}

a.activiteit
{
	text-decoration:none;
	color: #f0f0f0;
}

div.left
{
	color: #d3d05b;
	h4
	{
		color: #22a3da;
	}
}

div.right
{
	color: #d3d05b;
	h4
	{
		color: #6eba56;
	}
}

div.event.JAN.today,div.event.MEI.today,div.event.SEP.today
{
  box-shadow: 0px 0px 20px 2px #b03a84;
}

div.event.FEB.today,div.event.JUN.today,div.event.OKT.today
{
  box-shadow: 0px 0px 20px 2px #22a3da;
}

div.event.MAA.today,div.event.JUL.today,div.event.NOV.today
{
  box-shadow: 0px 0px 20px 2px #6eba56;
}

div.event.APR.today,div.event.AUG.today,div.event.DEC.today
{
  box-shadow: 0px 0px 20px 2px #d3d05b;
}

div.content
{
  border: 2px solid #d3d05b;
  border-radius: 10px;
  background-color: black;
  color: #f0f0f0;
  margin: 10px;
}



div.event.tworows
{
  grid-row: span 2;
}

div.event.threerows
{
  grid-row: span 3;
}

div.event.fourrows
{
  grid-row: span 4;
}

div.event.twocols
{
  grid-column: span 2;
}

div.event.threecols
{
  grid-column: span 3;
}

div.event h3
{
  color: #d3d05b;
  margin: 0;
  margin-top: 60px;
}

h1.event
{
  font-size:24px;
  line-height:30px;
  display: block;
  margin: 15px 0 6px 0;
  padding: 0;
  color: #d3d05b;
}

h2.event
{
  font-size:24px;
  line-height:30px;
  display: block;
  margin: 15px 0 6px 0;
  padding: 0;
  color: #22a3da;
}

div.event.JAN,div.event.MEI,div.event.SEP
{
  background-color: rgba(110, 186, 86, 0.1);
  color: #f0f0f0;
  border: 2px solid #6eba56;
}

div.event.JAN div.canceled,div.event.MEI div.canceled,div.event.SEP div.canceled
{
  background-color: #6eba56;
}

div.event.JAN div.description,div.event.MEI div.description,div.event.SEP div.description
{
    font-weight: bolder;
    color: rgb(34, 163, 218);
}

div.event.JAN a,div.event.MEI a,div.event.SEP a
{
    color: #d3d05b;
}

div.event.FEB,div.event.JUN,div.event.OKT
{
  background-color: rgba(211, 208, 91, 0.1);
  color: #f0f0f0;
  border: 2px solid #d3d05b;
}

div.event.FEB div.canceled,div.event.JUN div.canceled,div.event.OKT div.canceled
{
  background-color: #d3d05b;
}

div.event.FEB div.description,div.event.JUN div.description,div.event.OKT div.description
{
    font-weight: bolder;
    color: rgb(34, 163, 218);
}

div.event.FEB a,div.event.JUN a,div.event.OKT a
{
    color: #d3d05b;
}

div.event.MAA,div.event.JUL,div.event.NOV
{
  background-color: rgba(176, 58, 132, 0.1);
  color: #f0f0f0;
  border: 2px solid #b03a84;
}

div.event.MAA div.canceled,div.event.JUL div.canceled,div.event.NOV div.canceled
{
  background-color: #b03a84;
}

div.event.MAA div.description,div.event.JUL div.description,div.event.NOV div.description
{
    font-weight: bolder;
    color: rgb(34, 163, 218);
}

div.event.MAA a,div.event.JUL a,div.event.NOV a
{
    color: #d3d05b;
}

div.event.APR,div.event.DEC,div.event.AUG
{
  background-color: rgb(34,163,218, 0.1);
  color: #f0f0f0;
  border: 2px solid #22a3da;
}

div.event.APR div.canceled,div.event.AUG div.canceled,div.event.DEC div.canceled
{
  background-color: #22a3da;
}

div.event.APR div.description,div.event.DEC div.description,div.event.AUG div.description
{
    font-weight: bolder;
    color: #22a3da;
}

div.event.APR a,div.event.DEC a,div.event.AUG a
{
    color: #d3d05b;
}

div.body
{
  display: block;
  margin: 15px 0 50px 0;
}

.invisible
{
  display: none;
}

.multicol {
  column-width: 250px;
  column-gap: 20px;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

video {
  width: 100%;
  height: auto;
  display: block;
}

div.logo
{
  text-align: center;
  padding: 0;
}

img.plus
{
  position: absolute;
  width: 15px;
  height: 15px;
  top: 10px;
  right: 10px;
  cursor: pointer;
}


img.min
{
  position: absolute;
  width: 15px;
  height: 15px;
  top: 10px;
  right: 10px;
  cursor: pointer;
  display: none;
}

div.logo.wide
{
  display: none;
}

div.logo.square
{
  display: inline;
}

div.logo.wide div.menu
{
  padding: 5px;
  border: 2px solid #d3d05b;
  border-radius: 10px;
}

div.logo.wide div.menu span
{
  padding: 10px;
}

div.logo.wide div.menu span a
{
  text-decoration: none;
  color: #d3d05b;
  font-weight: bolder;
}

div.menu
{
  display: none;
}

div.logo.square div.menu img
{
  width: 25px;
}

div.logo.square div.menu div.items
{
  background-color: black;
  border: 2px solid #d3d05b;
  border-radius: 10px;
  padding: 10px;

  font-weight: bolder;

  display: none;
}

div.logo.square div.menu div.items a
{
  color: #d3d05b;
  text-decoration: none;
}

span.no_items
{
  color: #f0f0f0;
}

img.socials
{
  width: 25px;
  height: 25px;
}

table.socials
{
  width: 100%;
}

.grid {
  display: grid;
  grid-gap: 1em;
  grid-template-columns: 1fr;
  padding: 10px;
}

.grid > * {
  padding: 10px;
}

.normal {
  display: block;
  padding: 10px;
}

.normal > * {
  padding: 10px;
}

div.canceled
{
  color: black;
  text-align: center;
  border-radius: 10px;
  margin-bottom: 40px;
  font-weight: bolder;
}

div.dag
{
  font-size: 14pt;
  text-align: center;
}


div.livemusic
{
  text-align: center;
  border-radius: 10px;
  position: relative;
  background-color: rgb(34,163,218, 0.3);
  color: #d3d05b;
  border: 2px solid rgb(34,163,218, 1);
  padding: 10px;
  font-size: 1.2em;
  font-weight: bold;
}

div.mededeling
{
  text-align: center;
  border-radius: 10px;
  position: relative;
  background-color: rgba(176, 58, 132, 0.1);
  border: 2px solid #b03a84;
  color: #d3d05b;
  padding: 10px;
  font-size: 1.0em;
  font-weight: bold;
}

div.tickets
{
  position: absolute;
  top: 12px;
  right: 33px;
}

img.tickets
{
  width: 80px;
}

@media (min-width: 640px) {
  /*.grid {
    grid-template-columns: 1fr 1fr;
  }

  div.logo
  {
    grid-column-start: 1;
    grid-column-end: 3;
  }*/

  div.logo.wide img.header
  {
    width: 100%;
    margin: auto;
  }

  div.logo.wide
  {
    display: inline;
  }

  div.logo.square
  {
    display: none;
  }

  img.socials
  {
    width: 25px;
    height: 25px;
  }

  table.socials
  {
    max-width: 800px;
    margin: auto;
  }


  div.tickets
  {
    position: absolute;
    top: 10px;
    right: 120px;
  }

  img.tickets
  {
    width: 120px;
  }
}

@media (min-width: 950px) {
  /*.grid {
    grid-template-columns: 1fr 1fr 1fr;
  }

  div.logo
  {
    grid-column-start: 1;
    grid-column-end: 4;
  }*/
  div.event
  {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
  }

  div.logo.wide img.header
  {
    width: 100%;
    margin: auto;
  }

  div.logo.wide
  {
    display: inline;
  }

  div.logo.square
  {
    display: none;
  }

  div.livemusic
  {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
  }

  div.mededeling
  {
    width: 950px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1020px) {
  /*.grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;;
  }

  img {
    max-width: 100%;
  }

  div.logo
  {
    grid-column-start: 1;
    grid-column-end: 5;
  }
  */
  div.logo.wide img.header
  {
    max-width: 1020px;
    margin: auto;
  }

  div.logo.wide
  {
    display: inline;
  }

  div.logo.square
  {
    display: none;
  }

}

.media {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2em;
}

div.event.canceledevent
{
  border: 2px dashed red;
  background-color: #ff000033;
}

div.eventbackground
{
  height: 60px;
  border-radius: 10px;
  /*opacity: 0.5;*/
  background-position: center;
}