body, html {
    height: 100%;
}

table.menutable {
    width: 400px;
}

#dailysurprise, #latestnews {
    float: left;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    padding: 4px;
    overflow: auto;
    width: 48%;
}

@media (min-width: 768px) {
  .hbutton {
    width:96%;
    margin: 2px;
    background-color:#dfdfdf;
  }
  .ubutton {
    width:98%;
    font-size:120%;
  }
  .wbutton {
    width:93%;
    font-size:100%;
    margin: 2px;
    background-color: darkgrey;
  }
  .mbutton {
    margin: 2px;
    width:91%;
    padding: 0px 0px 0px;
    font-size:120%;
    background-color:#dfdfdf;
  }
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
  .hbutton {
    width:96%;
    margin: 2px;
    background-color:#dfdfdf;
  }
  .ubutton {
    width:98%;
  }
  .wbutton {
    margin: 2px;
    width:93%;
    background-color: darkgrey;
  }
  .mbutton {
    margin: 2px;
    width:91%;
    padding: 0px 0px 0px;
    background-color:#dfdfdf;
  }
  .introimg {
  }
}
p {
  text-indent: 20px;
}

.hbutton,.mbutton {
    width:96%;
    white-space: nowrap;
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
	background:-moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf',GradientType=0);
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid black;
	display:inline-block;
	cursor:pointer;
	color:black;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.hbutton:hover,.mbutton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
	background:-moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed',GradientType=0);
	background-color:#dfdfdf;
}
.hbutton:active,.mbutton:active {
	position:relative;
	top:1px;
}

.wbutton {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #c7b3c7));
	background:-moz-linear-gradient(top, #ededed 5%, #c7b3c7 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #c7b3c7 100%);
	background:-o-linear-gradient(top, #ededed 5%, #c7b3c7 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #c7b3c7 100%);
	background:linear-gradient(to bottom, #ededed 5%, #c7b3c7 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#c7b3c7',GradientType=0);
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid black;
	display:inline-block;
	cursor:pointer;
	color:black;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.wbutton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c7b3c7), color-stop(1, #ededed));
	background:-moz-linear-gradient(top, #c7b3c7 5%, #ededed 100%);
	background:-webkit-linear-gradient(top, #c7b3c7 5%, #ededed 100%);
	background:-o-linear-gradient(top, #c7b3c7 5%, #ededed 100%);
	background:-ms-linear-gradient(top, #c7b3c7 5%, #ededed 100%);
	background:linear-gradient(to bottom, #c7b3c7 5%, #ededed 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c7b3c7', endColorstr='#ededed',GradientType=0);
	background-color:#c7b3c7;
}
.wbutton:active {
	position:relative;
	top:1px;
}

.dueldialog {
    display: none;
    position: absolute;
    left: 320px;
    top: 200px;
    border: 3px solid black;
    padding: 4px;
    margin: 4px;
}

/* Landscape */
@media only screen 
  and (max-device-width: 568px)
  and (orientation: landscape) {

  .introimg {
    max-height: 280px;
    max-width: 280px;
  }
  .hbutton {
    width:96%;
    margin: 2px;
    background-color:#dfdfdf;
  }
  .ubutton {
    width:98%;
  }
  .wbutton {
    width:93%;
    font-size:100%;
    margin: 2px;
    background-color: darkgrey;
  }
  .mbutton {
    margin: 2px;
    width:91%;
    padding: 0px 0px 0px;
    background-color:#dfdfdf;
  }
}

@media only screen
  and (min-width: 1024px)
  and (orientation: landscape) {

    #dailysurprise, #latestnews {
        width: 48%;
    }

}

@media only screen 
  and (max-device-width: 568px)
  and (orientation: portrait) {
  .introimg {
    max-height: 280px;
    max-width: 280px;
  }

}

@media only screen
  and (orientation: portrait) {

    #dailysurprise, #latestnews {
        float: left;
        width: 98%;
    }
}

html {
      -webkit-text-size-adjust: none; /* Never autoresize text */
}

.middlecontent {
    border: 1px solid black;
    width: 99.5%;
    margin: 0 auto;
}

#matchlist {
    overflow: hidden;
}

#content, #boarddialog {
    height: inherit;
}