body{
  background-color : #ffcccc ;
  background-image : url('wallpaper.jpg') ;
}
h1{
  font-family : arial , sans-serif ;
  text-align : center ;
  background : #ffeeee ;
  padding-top : 0.5em ;
  padding-bottom : 0.5em ;
  font-style : normal ;
  border : 2px solid black ;
  width : 596px ;
  margin : auto ;
  margin-bottom : 10px ;
  margin-top : 20px ;
  border-radius : 20px ;
}
h2{
  font-family : georgia , sans-serif ;
  font-style : italic ;
  text-align : center ;
  background-color : #ffffff ;
  width : 596px ;
  padding : 0px ;
  margin : auto ;
  border : 2px solid #000000 ;
  margin-top : 20px ;
  margin-bottom : 5px ;
  font-size : 16pt ;
  border-radius : 1em ;
}
table{
  width : 600px ;
  margin : auto ;
  background-color : #ffffff ;
  border : 2px solid black ;
  border-radius : 20px ;
}
table#table_dice, table#roll{
  width : 596px ;
  border : 0px solid black ;
}

div#roll_container{
  border-radius : 20px ;
}

tbody:first-child tr:first-child td:first-child{ border-top-left-radius    : 16px ; }
tbody:first-child tr:first-child td:last-child { border-top-right-radius   : 16px ; }

thead tr:first-child th:first-child{ border-top-left-radius    : 16px ; }
thead tr:first-child th:last-child { border-top-right-radius   : 16px ; }
tbody tr:last-child td:first-child { border-bottom-left-radius : 16px ; }
tbody tr:last-child td:last-child  { border-bottom-right-radius: 16px ; }


th, td{
  text-align : center ;
  font-family : arial ;
  font-size : 12pt ;
}
th{
  color : #ffffff ;
  background-color : #aa0000 ;
}
td{
  background-color : #ffeeee ;
  height : 	50px ;
  font-size : 20px ;
  padding : 2px ;
}
td.name{
  width : 180px ;
}
td.score{
  width : 45px ;
}
td.this_roll{
  width : 45px ;
  padding : 0px ;
}
td.spacer{
  height : 20px ;
  background-color : #ffffff ;
}
td.roll{
  background-color : #ffffff ;
}
td.dice_fade{
  color : #cccccc ;
}

td.dice_full{
  color : #aa0000 ;
}

td.dice{
  width : 150px ;
  height : 150px ;
  vertical-align : middle ;
  text-align : center ;
  font-size : 100px ;
  padding : 0px ;
  line-height : 150px ;
  background-color : #ffffff ;
  margin : 0px ;
}

td.dice_full:hover{
  /*color : #ff0000 ;*/
}

span#nRolls, span#roll{
  font-family : georgia , sans-serif ;
  font-size : 16pt ;
}

input.button{
  width : 100px ;
  height : 20px ;
  font-size : 12px ;
  margin : 2px ;
  background-color : #ffffff ;
  border : 2px solid #000000 ;
}
input.score{
  width  : 40px ;
  height : 40px ;
  font-size : 20px ;
}
input#button_roll{
  height : 40px ;
  font-size : 24px ;
}
input.button_full{
  border : 2px solid #000000 ;
  color : #000000 ;
}
input.button_fade{
  border : 2px solid #ffffff ;
  color : #cccccc ;
}

div#roll_container, div#websites_container{
  width : 596px ;
  background-color : #ffffff ;
  border : 2px solid #000000 ;
  margin : auto ;
  margin-top : 10px ;
  margin-bottom : 10px ;
  text-align : center ;
}

div#websites_container{
  border-radius : 20px ;
}


a.blogpost, a.github{
  color : black ;
  text-decoration : none ;
}
a.blogpost:hover, a.github:hover{
  text-decoration : underline ;
}