@font-face {
    font-family: 'BelanidiSerif'; 
    src: url("BelanidiSerif-Regular.otf");
}

body{
  background-color: black;
  background-image: url('BowlingAlley.webp');
  background-size: 400px;
  background-attachment: fixed;
  font-family: 'BelanidiSerif', serif;
}

main{
  width: 60%;
  margin: auto;
  padding: 20px 0px;
  background-color: rgba(0,0,0,.5);
  box-shadow: 0px 0px 50px 50px rgba(0,0,0,.5);
}

header, footer, .box{
  background-color: black;
  color: white;
  text-align: center;
  border-radius: 20px;
  border:5px;
  border: 5px solid #ffab91;
  box-shadow: 0 0 0 10px #E64919;
  margin-top: 20px;
  padding: 10px;
  image-rendering: pixelated;
}

p a:link, h1 a:link, h2 a:link, h3 a:link, li a:link,
p a:visited, h1 a:visited, h2 a:visited, h3 a:visited, li a:visited
{
color: #ffab91;
text-decoration: underline;
border: 1px rgba(0,0,0,0);
}

p a:hover, h1 a:hover, h2 a:hover, h3 a:hover, li a:hover{
	border: 1px dashed yellow;
	border-image: url('data:image/gif;base64,R0lGODlhCgAKAPAAAP///wAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQECgD/ACwAAAAACgAKAAACEYwDmagN7FZUcFppq9NNn1AAACH5BAUKAAIALAAAAAAKAAoAAAIPRB6gKu0Po5zu0IvpUigVACH5BAUKAAIALAAAAAAKAAoAAAIPBIJhy+2r3okOSXulrskUACH5BAUKAAIALAAAAAAKAAoAAAIQhINhy+2rHnpgyugw3TCtAgAh+QQFCgACACwAAAAACgAKAAACEIQRGce9fR5EE0lXab1bsQIAIfkEBQoAAgAsAAAAAAoACgAAAhGEHRmy4g+jnFSYijNdzR5QAAAh+QQFCgACACwAAAAACgAKAAACDwx+oYqd3gyctE5562KxAAAh+QQFCgACACwAAAAACgAKAAACD0yAaJYN7KKctNp35MrJFAAh+QQFAQACACwAAAAACgAKAAACEIyBaJEN7BKMtNo6Y27LrQIAOw==') 1 repeat;
	//border-image: url('http://files.eyeburn.info/images/marching-ants/selection_border.gif') 1 repeat;
}

.column a:link {color: #402273}

* {
  box-sizing: border-box;
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 0px 40px;
  text-align: left;
}

.columntable {
  float: left;
  width: 50%;
  padding: 10px 30px;
  text-align: center;
}

.partytable {
    background-color: white;
    background-image: url('41-gingham-red-fabrics-texture-seamless-hr-1041522542.jpg');
    background-size: 50px;
    border-radius: 20px;
    padding: 20px;
}

.partytable a{
  display: block;
  margin-bottom: 10px;
  background-color: white;
  border-radius: 20px;
  border: 2px solid grey;
  box-shadow: 0px 0px 3px 3px white;
}

.partytable a:hover{
  background-color: yellow;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 1200px) {
.columntable {
  padding: 10px 10px;
}}

@media screen and (max-width: 1000px) {
main{
  width: 90%;
  margin: auto;
}

.columntable {
  padding: 10px 30px;}}

@media screen and (max-width: 800px) {
h2{font-size: .8em;}
h1{font-size: 1.3em;}
p{font-size: .8em;}

.columntable {
  width: 100%;
  padding: 10px 50px;
}

.column {
  width: 100%;
}
}