/* BACKGROUNDS */ 

body {
	background-attachment: fixed;
}

.background-no-repeat { background-repeat: no-repeat; }
.background-repeat { background-repeat: repeat; }
.background-repeat-x { background-repeat: repeat-x; }
.background-repeat-y { background-repeat: repeat-y; }

.background-pos-tl { background-position: top left; }
.background-pos-tc { background-position: top center; }
.background-pos-tr { background-position: top right; }
.background-pos-cl { background-position: center left; }
.background-pos-c { background-position: center; }
.background-pos-cr { background-position: center right; }
.background-pos-bl { background-position: bottom left; }
.background-pos-bc { background-position: bottom center; }
.background-pos-br { background-position: bottom right; }

.background-size-auto { background-size: auto; }
.background-size-contain { background-size: contain; }
.background-size-cover { background-size: cover; }

/* LAYOUT */
.game-container {
	display: flex;
	flex-direction: row;
	padding-bottom: 50px;
}

.side-bar {
	width: 300px;
	padding:  0px 5px;
}

.game-area {
	flex-grow: 1;
	padding:  0px 5px;
}

/* BOOTSTRAP OVERIDES */
.popover {
	max-width: 350px;
}

.popover-content > .list-group {
	margin-bottom: 0px;
}

/* CHARACTER INFORMATION */
.character-information .progress {
	margin-bottom: 5px;
}

/* NAVIGATION MENU */

.navigation-menu {
	padding: 0px;
	margin: 0px;
}

.navigation-menu > li {
	list-style: none;
}

.navigation-menu > li > a {
	background-color: var(--brand-primary);
	background: -webkit-linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15));  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15)); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	display: block;
	padding: 0px 5px;
	line-height: 26px;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	font-size: 110%;
}

.navigation-menu > li > ul  {
	padding-left: 0px;
}

.navigation-menu > li > ul > li {
	list-style: none;
}

.navigation-menu > li > ul > li > a {
	display: block;
	padding: 1px 6px;
	border-bottom: 1px solid var(--gray-lighter);
	line-height: 21px;
	font-size: 90%;
}	
.navigation-menu > li > ul > li > a > .pull-right {
	line-height: 21px;
}	

.navigation-menu > li > ul > li:nth-last-child(1) > a {
	border-bottom: none;
}


/* TIMERS */
[data-timer] {
	background-color: var(--gray-lighter);
	padding: 2px 4px;
	border-radius: 4px;
}

/* CRIME HOLDER */

.crime-holder {
    position: relative;
    background-color: var(--gray-lighter);
    border: 1px solid var(--gray-light);
    border-radius: 4px;
    margin-bottom: 15px;
	overflow: hidden;
    padding: 15px;
}

.crime-holder > p {
	margin: 0px;
	text-align: left;
	display: flex;
	flex-direction: row;
}

.crime-holder .action {
	justify-content: flex-start;
	flex-grow: 1;
	order:  1;
}

.crime-holder .cooldown {
	justify-content: flex-end;
	order:  2;
	padding: 0px 15px;
}

.crime-holder .commit {
	background-color: var(--gray-light);
	padding: 0px 10px;
	border-radius: 4px;
	justify-content: flex-end;
	order:  3;
}

.crime-holder .crime-perc {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 4px;
	background-color: var(--gray-light);
	overflow: hidden;
}

.crime-holder .crime-perc .perc {
	position: absolute;
	display: block;
	height: 100%;
	left: 0px;
	top: 0px;
	right: 0px;
	background-color: var(--brand-success);
}