body {
	background-image: url('http://fracturedbear.com/wp-content/uploads/2018/09/fractured_bear_background.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;}

#footer-horizontal-widget-area {background-color:#fff;}

/* Make the container relative */
.swap-on-hover {
  position: relative;	
	margin:  0 auto;
	max-width: 400px;
}

/* Select the image and make it absolute to the container */
.swap-on-hover img {
  position: absolute;
  top:0;
  left:0;
	overflow: hidden;
	/* Sets the width and height for the images*/
	width: 259px;
	height: 70px;
}

/* 
	We set z-index to be higher than the back image, so it's alwyas on the front.

We give it an opacity leaner to .25s, that way when we hover we will get a nice fading effect. 
*/
.swap-on-hover .swap-on-hover__front-image {
  z-index: 99;
  transition: opacity .5s linear;
  cursor: pointer;
}

/* When we hover the figure element, the block with .swap-on-hover, we want to use > so the front-image is going to have opacity of 0, which means it will be hidden, to the back image will show */
.swap-on-hover:hover > .swap-on-hover__front-image{
  opacity: 0;
}

.tfb_dl_list {
	width: 800px;
	height: auto;
	margin: 0 auto;
}

.tfb_dl_link {
	border:0px;
	width:200px;
	height:400px;
	line-height:400px;
	padding:0; 
	margin:0;
	float:left;
  overflow: hidden;
  position: relative;
  display: block;
	margin-top:auto;
	text-align:center;
	cursor: pointer;
  background-size: cover;
	border-radius: 5px 5px 5px 5px;
  -moz-border-radius: 5px 5px 5px 5px;
  -webkit-border-radius: 5px 5px 5px 5px;
  background-repeat: no-repeat;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;}

.bg_layout{	
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
  overflow: hidden;
  position: relative;
  display: block;
}

.blank_filler{
	width:200px;
	height:400px;
	border:0;
	padding:0;
}

.bg_layout:hover{
	transform: scale(1.05);
	-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
	z-index:10;
}
	
.bgclasses{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/classes.jpg');
}
.bgcyberpunk{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/cyberpunk.jpg');}
.bgdnd{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/dnd-1.jpg');}
.bgdndspeak{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/dndspeak.jpg');}
.bgfridayforums{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/friday_forums.jpg');}
.bgmisc{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/misc.jpg');}
.bgraces{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/races.jpg');}
.bgtablesmith{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/tablesmith.jpg');}
.tiravalon{background-image:url('http://fracturedbear.com/wp-content/uploads/2018/09/tir_avalon.jpg');}

.bgcosmos_barbarian {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_barbarian-1.jpg');
}
.bgcosmos_bard {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_bard-1.jpg');
}
.bgcosmos_cleric {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_cleric-1.jpg');
}
.bgcosmos_druid {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_druid-1.jpg');
}
.bgcosmos_fighter {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_fighter-1.jpg');
}
.bgcosmos_monk {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_monk-1.jpg');
}
.bgcosmos_paladin {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_paladin-1.jpg');
}
.bgcosmos_ranger {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_ranger-1.jpg');
}
.bgcosmos_rogue {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_rogue-1.jpg');
}
.bgcosmos_sorcerer {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_sorcerer-1.jpg');
}
.bgcosmos_warlock {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_warlock-1.jpg');
}
.bgcosmos_wizard {background-image:url('http://fracturedbear.com/wp-content/uploads/2018/10/cosmos_wizard-1.jpg');
}

#content, #main-wrapper {
    padding-bottom: 2.5em;
    background-color: #ffffff;
}

.cosmo_item{
	-webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
	box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);	
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
}

.cosmo_item:hover{
	z-index:10;
	transform: scale(1.05);
	-webkit-box-shadow: 15px 15px 20px 0px rgba(253,80,13,0.5);
	-moz-box-shadow: 15px 15px 20px 0px rgba(253,80,13,0.5);
	box-shadow: 15px 15px 20px 0px rgba(253,80,13,0.5);	
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
}

.tfb_donate_text{
	color: white;
  text-shadow: 1px 1px 2px black, 0 0 25px #fd500d, 0 0 5px #fd500d;
	margin: -35px auto;
	width: 80%;
	height:auto;
	text-align: center;
}

.tfb_social_icons_footer{
  border:0;
  float:left;
  height:56px;
  width:auto;
  padding: 0 3px 0 2px;
	cursor:pointer;
  }

.tfb_social_icons_footer:hover{
  height:64px;
  }

.character_portrait {
  width: 156px !important;
  height: auto !important;
  margin: 0px auto;
  padding: 0px;
  display: block;
  margin-bottom:10px;
  }
    
.mindartis_bg {background: url(http://fracturedbear.com/wp-content/uploads/2018/10/mindartis_floshem_steel.jpg);background-size: cover;}
.lance_bg {background: url(http://fracturedbear.com/wp-content/uploads/2018/10/lance_cooperson_steel.jpg);background-size: cover;}
.keith_bg {background: url(http://fracturedbear.com/wp-content/uploads/2018/10/keith_appleblossom_steel.jpg);background-size: cover;}
.eloise_bg {background: url(http://fracturedbear.com/wp-content/uploads/2018/10/eloise_montrusse_steel.jpg);background-size: cover;}
.ahvain_bg {background: url(http://fracturedbear.com/wp-content/uploads/2018/10/ahvain_rothenel_steel.jpg);background-size: cover;}
        
.character_portrait_img {
  opacity: 0;
  display: block;
  width: 156px;
  height: auto;
  transition: 1s ease;
  }
    
.character_portrait_img:hover {
  opacity: 1;
  display: block;
  }

.portrait_cell_x5 {
  width: 160px;
  height: auto;
  float: left;
  position:relative;
  display: block;
  text-align: center;
  }

.pc_name{
  transition: 1s ease;  
  line-height:20px;
  text-shadow: 2px 2px 5px black;
  color:#fd500d;  
}

.portrait_cell_x5:hover {
  transition: 1s ease;  
  text-shadow: 2px 2px 10px black, 2px 2px 15px blue, 2px 2px 20px red;
  color:#fd500d;  
  text-transform: uppercase;
	cursor: pointer;
  }

.tfb_clear_block {
  width: 100% !important;
  height:20px !important;
  clear:both;
  }

.equipment_bar {
    width: 650px;
    height: 125px;
    display: block;
    background-image: url('http://fracturedbear.com/wp-content/uploads/2018/11/bar.png');
    background-repeat:  no-repeat;
    background-oisition: center cemter; 
    }
        
.equipment_panel {               
    position: absolute;
    width: 55px;
    height: 20px;
    display: block;  
    float: left;   
    top: 72px;
    text-shadow: 1px 1px rgba(255,255,255,0.8);    
    }
               
.equipment_ammunition {margin-left: 42px;}
.equipment_weapons {margin-left: 143px;}
.equipment_shields {margin-left: 245px;}
.equipment_light_armor {margin-left: 347px;}
.equipment_medium_armor {margin-left: 449px;}
.equipment_heavy_armor {margin-left: 551px;}

.equipment_bar {
			width: 				600px;
			min-width:			600px;
			height:				91px;
			border:				0px;
			margin:	 			0px;
			background-image:	url('http://fracturedbear.com/wp-content/uploads/2018/11/equipment_bar.png');
			background-repeat: 	no-repeat;
			font-size:			13px;
			display: 			block;
			color:				#FFFFFF;
			text-shadow:		1px 2px 2px #000000;
			font-weight:		bold;
			}
		
		.equipment_bar_pane {
			width:				65px;
			height:				15px;
			position:			relative;
			top:				47px;
			}
		
		.pane1 {float: left; margin-left: 48px;}
		.pane2 {float: left; margin-left: 26px}
		.pane3 {float: left; margin-left: 26px}
		.pane4 {float: left; margin-left: 26px}
		.pane5 {float: left; margin-left: 26px}
		.pane6 {float: left; margin-left: 26px}
		
	.tfb_box {
		width:300px;
		max-width:300px;
		min-width:300px;
		border-radius: 15px 0px;
		-moz-border-radius: 15px 0px;
		-webkit-border-radius: 15px 0px;
		-webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.50);
		-moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.50);
		box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.50);
		display:block;
		overflow: hidden;
		cursor: pointer;
		border: 1px solid #222;
		margin: 3px;
		}
	
	.tfb_box_title {
		width:100%;
		background-image:url('http://fracturedbear.com/wp-content/uploads/2018/11/bg.png');
		background-position: centre centre;
		padding: 10px;
		-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,1);
		-moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,1);
		box-shadow: 0px 2px 10px 0px rgba(0,0,0,1);
		display:block;
		font-weight: bold;
		text-align: center; 
		color: #8B8B8B; 
		text-shadow: 0px 2px 3px #555, -1px -1px 0px #222;
		font: 25px inherit;	
		text-transform: capitalize;
		display:block;
		overflow: hidden;
		}
		
	.tfb_box_title:hover {
		color: #fd500d; 
		}
		
	.tfb_box_content {		
		width:100%;
		padding: 10px;
		border-top: 1px solid black;
		display:block;
		overflow: hidden;
		font: inherit;	
		font-size: 11px;
		}
	
.prerolledskillchecks {
		width: 					20%;
		float: 					left;
	  text-align:			center;
		line-height: 		1em;
	  padding:				2px;
		color:	 				inherit;
		}

hr.fracturedbear {
  border-top: 3px groove #fd500d;
  margin: 50px 0;
}
hr.fracturedbear:after {
  content: url( 'http://fracturedbear.com/wp-content/uploads/2018/12/logo_53x29.png' );
  /* Controls the position of the logo */
  left: 50%;
  position: absolute;
  transform: translateY(-50%) translateX(-50%);
  /* Controls the whitespace around the symbol */
  padding: 20px;
  background: #fff;
}