body
{
  font-family: "Poppins", sans-serif;
  background-color: #fc5b00;
  font-size: 1em;
  background-image: url('../images/back.jpg');
  
  background-attachment: fixed;
  background-position: center;
}

.menutd
{
	width: 100%;
}

.logo
{
   width: 320px;
   display: block;
   margin: auto;
}

.hide_when_big
{
  display: none;
}

.bordered
{
	border-style: solid;
  border-width: 2px;
  border-color: black;
  border-radius: 5px;
  background-color: #ffffff80;
  color: black;
  padding: 10px;
}

img.avatar
{
  border-radius: 5px;
  vertical-align: middle;
}

div.error
{
  border: solid 2px #ff0000;
  background-image: linear-gradient(#ffff0033, #ffffff33, #fc5b0033);
  color: #ffffff;
  display: none;
  text-align: center;
  font-weight: bolder;
  text-shadow: 0.5px 0.5px black;
}


h1
{
  border-style: solid;
  border-width: 2px;
  border-color: black;
  text-align: center;
  border-radius: 5px;
  background-color: #ffffff80;
  color: black;
}

a
{
  text-decoration: none;
  color: #000000;
  font-weight: bold;
}

a.menu
{
  font-size: 1.2em;
  font-weight: bold;
  color: black;
}


div#bigmenu
{
  display: none;
}

div#smallmenu
{
  position: absolute;
  border: 2px solid black;
  background-color: #fc5b00;
  width: 180px;
  display: none;
  padding: 10px;
}

div#hamburger
{
  display: inline;
  cursor: pointer;
}

@media (min-width: 40em)
{
  div#bigmenu
  {
    display: inline;
  }
  
  div#hamburger
  {
    display: none;
  }
  
  .logo
  {
    width: 220px;
    margin-right: 10px;
  }
  
  .hide_when_big
  {
    display: inline;
  }
  
	.menutd
	{
		width: 50%;
	}
}



@media (min-width: 60em)
{
  div#content, div#header
  {
    margin:auto;
    width: 50em;
  }
  
  body
  {
    font-size: 1.1em;
  }
  
  .logo
  {
    width: 260px;
    margin-right: 10px;
  }
}

@media (min-width: 70em)
{
  body
  {
    font-size: 1.3em;
  }
  
  .logo
  {
    width: 325px;
    margin-right: 10px;
  }
}