html
{
 font-size: 1.1em;
 font-family: "Poppins", sans-serif;
 background-color: #000000;
 color: #f0f0f0;
}

div.slogan
{
	max-width: 800px;
	margin: auto;
}

div.page
{
	background-color: white;
	max-width: 790px;
	margin: auto;
}

span.smallpoints
{
  font-size: 0.6em;
}

td.totalstrike
{
  border-style: solid;
  border-width: 0 0 2px 0;
}

tr.tenpoints
{
  background-color: #019f4b;
}

tr.sixpoints
{
  background-color: #fbce03;
  color: #1e1e26;
}

tr.fourpoints
{
  background-color: #1e1e26;
}

tr.nopoints
{
  background-color: #fe000033;
}

input.green
{
  background-color: #ccffcc;
}

#bulletin_message
{
  width: 100%; max-width: 100%;
}

.bulletin_nick
{
  text-decoration: underline;
  margin: 5px 5px 15px 5px;
  padding: 5px 5px 15px 5px;
}

.bulletin_message
{
  border-width: 0px 0px 2px 0px;
  border-style: solid;
  margin: 5px 5px 15px 5px;
  padding: 5px 5px 15px 5px;
  background-color: #304ffe;
}

img
{
  max-width: 100%;
  display: block;
}

* { box-sizing: border-box; }

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

.grid > article
{
  padding: 10px;
}

.menu
{
  grid-row: 2;
  display: none;
}

.menu_small
{
  grid-row: 2;
  display: block;
}

.menucontent
{
  display: none;
  background-color: black;
}

a
{
  cursor: pointer;
  color: #ff5300;
  font-weight: bold;
}

.error
{
  position: fixed;
  top: 100px;
  left: 0px;
  margin: auto;
  width: 100%;
  border-style: dashed;
  border-color: red;
  background-color: #ffcccc;
  color: #000000;
  display: none;
  text-align: center;
}

.success
{
  position: fixed;
  top: 100px;
  left: 0px;
  margin: auto;
  border-style: dashed;
  border-color: #019f4b;
  background-color: #ccffcc;
  color: #000000;
  display: none;
  width: 100%;
  text-align: center;
}

.content_table
{
  margin: auto;
  width: 100%;
}

.content
{
	background-color: black;
	width: 90%;
	margin: auto;
	padding: 10px;
}

.login_table
{
  margin: auto;
  width: 100%;
  max-width: 30em;
}

input.inschrijven
{
  width: 100%;
}

h3
{
  text-align: center;
}

.poule
{
  padding: 10px;
}


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

.allpoules > *
{
  padding: 10px;
}

.green
{
  background-color: #304ffe;
}

.red
{
}

.poule td
{
    font-size: 10pt;
    text-align: center;
    vertical-align: bottom;
}

.poule th
{
    font-size: 10pt;
    text-align: center;
    vertical-align: bottom;
}

.voorspel_row_1 td
{
  font-size: 8pt;
  border-style: solid;
  border-width: 2pt 0 0 0;
}

.voorspel_special td
{
  font-size: 10pt;
  border-style: solid;
  border-width: 0 0 0 0;
  background-color: #000055;
}

.flag
{
  width: 50px;
}

.voorspelling_box
{
  text-align: center;
}

.realresult
{
  color: #019f4b;
  font-weight: bolder;
}

.innertable
{
  margin: 0;
  padding: 0;
  border-spacing: 0;
  width: 100%;
}

.themenu
{
  text-align: center;
  background-color: black;
  width: 90%;
  margin: auto;
  color: #304ffe;
  font-size: 0.95em;
}

a.betaald
{
  color: #ff5300;
}

a.niet_betaald
{
  color: #ffcc01;
}

span.info
{
  font-weight: bold;
  color: #ffcc01;
}


td.nick
{
  font-size: 0.9em;
}

td.smallnick
{
  font-size: 0.7em;
}


@media (min-width: 40em)
{

  .menu
  {
    display: block;
  }

  .menu_small
  {
    display: none;
  }

  .allpoules
  {
    grid-template-columns: 1fr 1fr;
  }


  td.smallnick
  {
    font-size: 0.9em;
  }

}


@media (min-width: 55em)
{
  .grid
  {
    width: 49em;
    margin: auto;
  }
}