body
{
	background-color:inherit;
	color:inherit;
}
.overflow-wrap {
  overflow-wrap: break-word;
}
#header
{
    height:160px;
    max-height:300px;
    border-bottom: 1px solid;
}

#leftBox
{
 width:124px;
 height:125px;
 float:left;
}
#rightBox
{
	padding:10px;
	margin-left:134px;
	max-height:125px;
}
#topBox
{
    text-align:left;
}

#bottomBox
{
	margin-top:10px;
}


ul
{
	  padding-left:20;
	  padding-right:20;
	  margin:0;

}
li
{
    list-style-type:none;
    float:left;
}


.clearList ul ol
{
	  padding-left:0;
	  padding-right:0;
	  margin:0;

}
.clearList li
{
    list-style-type:none;
    float:none;
    	  list-style-type:circle;
}

ol li
{
	list-style-type: inherit;
	float: none;
}
ul a
{
    padding:2px;
}

ul a
{
    padding:2px;
}
a
{
	border-style:none;
	border-width:0;
	text-decoration:none;

}
a:hover
{
	background-color:Transparent;
	text-decoration:none;
}

a:visited
{
	border-style:none;
	border-width:0;
	text-decoration:none;
	outline:none;
}




.itemHeader
{
    text-align:center;
    font-family:Times New Roman;
    font-style:italic;
    font-size:200%;
}

.item b
{
    text-align:center;
    font-family:Times New Roman;
    font-style:italic;
    font-size:100%;
}

.spellHeader
{
    text-align:left;
    font-family:Times New Roman;
    font-style:italic;
    color:Maroon;

}

.nav a
{
	padding-left:20px;
	border-style:none;
	border-width:0;
	text-decoration:none;
	line-height:1.4em;
}
.nav a:hover
{
	text-decoration:none;
	padding-left:20px;
	padding-right:20px;
	width:100%;
}

.nav a:visited
{
	padding-left:20px;
	border-style:none;
	border-width:0;
	text-decoration:none;
	outline:none;
}

td
{
  padding-left:5px;
  padding-right:5px;
}
th
{
  vertical-align:top;
}

.right
{
    float:right;
}

.fullWidth
{
    width:100%;
    border-bottom-style:solid;
    border-bottom-width:1;
    border-bottom-color:Black;
}

.right
{
    float:right;
}

.odd
{
    background-color:Lime;
}
.col1
{
    text-align:left;
    width:110px;
}
.col2
{
    width:250px;
    text-align:left;
}
.col3
{
    width:50px;

}
.skilldesc .item
{
  float: left;
  padding-top:5px;
  margin-bottom:2px;
  border-bottom-width :1px;
  border-bottom-color:#696969;
  border-bottom-style:solid;
  width:100%;
}
.skilldesc .name
{
    font-weight:bold;
    float: left;
    text-align:left;
    width:150px;
}
.skilldesc .content
{
    width:70%;
    text-align:left;
    float: left;
}
img .item
{
    float:right;
    vertical-align:top;
}

.smallTable td
{
    padding-left:10px;
    padding-right:10px;
}
.smallTable th
{
    padding-left:10px;
    padding-right:10px;
}

.skilldesc .item
{
  float: left;
  padding-top:5px;
  margin-bottom:2px;
  border-bottom-width :1px;
  border-bottom-color:#696969;
  border-bottom-style:solid;
  width:100%;
}
.skilldesc .name
{
    font-weight:bold;
    float: left;
    text-align:left;
    width:150px;
}


.skilldesc .content
{
    width:70%;
    text-align:left;
    float: left;
}



.sphere
{
	cursor: pointer;

}

.glade
{
z-index: 1;
background: url("http://www.myszka.co.uk/greyhawk/Pics/glade.jpg") no-repeat;
width:1200px;
height:700px;
opacity:0.3;
}

.illusion
{
z-index: 1;
background: url("http://www.myszka.co.uk/greyhawk/Pics/illusion.2.jpg") no-repeat;
width:1200px;
height:700px;
opacity:0.3;
}

.item
{
z-index: 10;
}

th.rotate
{
  valign:top;
  height: 180px;
  word-break:normal;
  word-wrap: break-word;
}

th.rotate > div
{
  transform:
    /* Magic Numbers */
    translate(25px, 51px)
    /* 45 is really 360 - 45 */
    rotate(295deg);

     word-break: normal;
     word-wrap: break-word;
}
th.rotate > div > span
{
  border-bottom: 1px solid #ccc;
  padding: 5px 10px;
}


#audio
{
border-top-width: thick;
border-top-style: ridge;
margin-top: 10px;
}

audio
{

}