@font-face {
	font-family: PathfinderIcons;
	src: url("../assets/font/Pathfinder2eActions.ttf");
  }
  
div {
	font-family: myFirstFont;
  }

html{
	background-color: red;
}

a.as-menu-item.nav-link-item-id-109.nav-link.item-link-component.item-level-1 {
	display:inline-block;
	padding:0.7em 1.4em;
	margin:0 0.3em 0.3em 0;
	border-radius:0.15em;
	box-sizing: border-box;
	text-decoration:none;
	font-family:'Roboto',sans-serif;
	text-transform:uppercase;
	font-weight:400;
	color:#000000;
	background-color:#28a745;
	box-shadow:inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17);
	text-align:center;
	position:relative;
}

a.as-menu-item.nav-link-item-id-109.nav-link.item-link-component.item-level-1:active{
	top:0.1em;
}
@media all and (max-width:30em){
	a.as-menu-item.nav-link-item-id-109.nav-link.item-link-component.item-level-1{
		display:block;
		margin:0.4em auto;
	}
}
.banner_img{
	display: block;
	margin-left: auto;
	margin-right: auto;
	height: 300px;
}
.header{
	background-color:#032417;
	width: 100%;
}
.header_float-container{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
	padding: 20px;
	text-align: center;
}
.header_float_child{
    float: left;
    padding: 20px;
}
.flexbox {
	display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}
.flexbox > img {
    margin-top: 10px;
    padding: 20px;
}
.flexbox > p {
    margin-top: 10px;
    padding: 20px;
}
  /* The sidebar menu */
.sidebar {
	height: 100%; /* 100% Full-height */
	width: 0; /* 0 width - change this with JavaScript */
	position: fixed; /* Stay in place */
	z-index: 1; /* Stay on top */
	top: 0;
	left: 0;
	background-color: #111; /* Black*/
	overflow-x: hidden; /* Disable horizontal scroll */
	padding-top: 60px; /* Place content 60px from the top */
	transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
  }
  
  /* The sidebar links */
  .sidebar a {
	padding: 8px 8px 8px 32px;
	text-decoration: none;
	font-size: 25px;
	color: #818181;
	display: block;
	transition: 0.3s;
  }
  
  /* When you mouse over the navigation links, change their color */
  .sidebar a:hover {
	color: #f1f1f1;
  }
  
  /* Position and style the close button (top right corner) */
  .sidebar .closebtn {
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px;
	margin-left: 50px;
  }
  
  /* The button used to open the sidebar */
  .openbtn {
	font-size: 20px;
	cursor: pointer;
	background-color: #111;
	color: white;
	padding: 30px 45px;
	border: none;
	position:fixed;
	margin: -20px;
  }
  h2 {
	font-weight: bold;
	margin-top: 0;
  }
  h3 {
	padding-left: 15px;
	margin-left: 15px;
  }
  
  .openbtn:hover {
	background-color: #444;
  }
  
  /* Style page content - use this if you want to push the page content to the right when you open the side navigation */
  #main {
	transition: margin-left .5s; /* If you want a transition effect */
	padding: 20px;
  }
  
  /* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
  @media screen and (max-height: 450px) {
	.sidebar {padding-top: 15px;}
	.sidebar a {font-size: 18px;}
  }

  .back_to_main {
	font-weight: bold;
	font-size: large;
	text-align: center;
  }

div.bubble {
	position: relative;
	width: 60%;
	text-align: center;
	line-height: 1.4em;
	margin: 40px auto;
	background-color: #5d5d5d;
	border: 8px solid #333;
	border-radius: 30px;
	font-family: sans-serif;
	padding: 20px;
	font-size: large;
	color: white;
}

div.thought {
	border: 8px dashed #333;
	display:flex;
	border-radius: 200px;
	padding: 30px;	
}

div.bubble:before,
div.bubble:after {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
}

div.speech:before {
	left: 30px;
	bottom: -50px;
	border: 25px solid;
	border-color: #333 transparent transparent #333;
}

div.speech:after {
	left: 38px;
	bottom: -30px;
	border: 15px solid;
	border-color: #5d5d5d transparent transparent #5d5d5d;
}

div.thought:before,
div.thought:after {
	left: 10px;
	bottom: -30px;
	width: 40px;
	height: 40px;
	background-color: #5d5d5d;
	border: 8px solid #333;
	-webkit-border-radius: 28px;
	-moz-border-radius: 28px;
	border-radius: 28px;
}

div.thought:after {
	width: 20px;
	height: 20px;
	left: 5px;
	bottom: -40px;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

.flex_bubble_container{
	display: flex;
    flex-flow: row;
    float:left;
	padding: 20px;
	text-align: center;
	width: 100%;
}
.flex_bubble_child{
	margin-left:10px;
}
.flex_bubble_child > img{
	flex: 0 0 50px;
}

table, th, td {
	border: 2px solid black;
	border-collapse: collapse;	
}
 th, td {
	text-align: left;

}

.borderless {
	border: 0px solid black;
	border-collapse: collapse;
}
.dc_table.table{
	border: 0px solid black;
}

.dc_table td{ 
	width:25%;
	text-align:center;
	vertical-align: top;
	border: 0px solid black;
}

.sticky-content {
	color: white;
	background: black;
	width: 200px;
	padding: 10px;
	position: fixed;
	right: 0;
	bottom: 0;
}

.parchment{
	background-image: url("../kingmaker_media/parchment.jpg");
	background-color: red;
	object-fit: fill;
	margin-left: auto;
	margin-right: 0;
}
.parchment > p{
	text-align: justify;
	padding: 5%;
	padding-left: 10%;
	padding-right: 10%;
	font-weight: bolder;
	line-height: 1.6;
}

.parchment > h2{
	color:#033421;
	text-align: center;
	padding-top: 10%;
}

.map{
	width:100%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	margin-right: auto;
	background-color: beige;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

th {
	margin-bottom: 10px;
    margin-left: -2px;
    color: #cbc18f;
    background-color: #6f413e;
    min-height: 26px;
    line-height: 1em;
    vertical-align: middle;
    padding: 4px 9px;
    border-radius: 3px;
}
.attentionmark {
	height: 50px;
	width: auto; 
	margin-top: auto; 
	margin-bottom: auto;
}
.questmarker {
	height: 20px;
}
.pficon {
	font-family: PathfinderIcons; 
	font-size: 22px;
}
.infocard {
	width:50%; 
	margin-left: auto; 
	margin-right: auto; 
	background-color: beige; 
	border-radius: 3px;
}

.tb_custom_category{
padding-top: 50px;
padding-left: 16px;
padding-right: 16px;
padding-bottom: 16px;
}

li.list-group-item.border-0.py-0.px-0 {
    margin-right: 15px;
	margin-bottom: 15px;
}

.edit.item-page {
	margin-top: 20px;
	background-color: light-blue;
}