/* Global */
div {
    box-sizing:border-box;
}
body {
	background-image: url('/images/support-background.png');
	background-repeat: no-repeat;
	background-size: 100%;
	background-color:#000;
	color:#fff;
}
ul {margin:0;}
i.dark {color:#222 !important;}
small.error {margin-top: -1.3rem; background-color: #E43D58}
.centered {margin:auto !important; float:none;}
h5 {
	font-family: 'hopfer_hornbookregular' !important;
	text-transform: uppercase;
	color:#425c5c;
	font-size: 1.5em;
	margin:0;
}
h6 {
	font-family: 'hopfer_hornbookregular' !important;
	text-transform: uppercase;
	color:#fff;
	margin:0;
}
h1 {color: rgba(24,19,25, 1);}
a, a:visited {color:#aac2ab;}
a:hover {color:#fff;}

/* General Layout */
.margin-top-1 {margin-top: 1em !important;}
.page-width {min-width: 1200px; margin:auto !important; float:none;}
.columns img {width:100%;}

p.message {
	font-style: italic;
	margin:2em 0;
	padding:1rem 1.5rem;
	background-color: #3AAD62;
	border: thin solid #114B25;
}

p.error {
	font-style: italic;
	margin:2em 0;
	padding:1rem 1.5rem;
	background-color: #DF5C5C;
	border: thin solid #F75656;
}

/* Top Bar */
section#topbar {
	background: rgba(0, 0, 0, 0.6);
	font-family: 'hopfer_hornbookregular' !important;
	text-transform: uppercase;
	margin-bottom:4em;
}
section#topbar li.social a {
	color:#b4b6a4; 
	margin:0 0.3em;
	text-shadow: 0px 0px 10px #b4b6a4;
	font-size: 1.2em;
}
section#topbar li.social i.icon-rss {font-size: 0.9em;}
section#topbar a i:hover {color:#cb830a; text-shadow: 0px 0px 10px #b4b6a4;}

section#topbar .small-2 i {
	font-size: 2.4em; 
	text-shadow: 0px 0px 20px #b4b6a4;
	color:#BED4BF; 
	margin-top:0.3em;
    position: relative;
    top: 0.05em !important;
}
section#topbar img {width:2.2em;}
section#topbar nav ul {list-style:none;}
section#topbar nav ul li {display:inline;}

section#topbar nav#main-mobile {display:none;}
section#topbar i#show-main-menu {display:none;}

section#topbar nav#main {padding:0.8em 0;}
section#topbar nav#main ul {margin:0 !important;}
section#topbar nav#main ul li {
	margin:0 0.6em;
	letter-spacing: 0.15em;
}
section#topbar nav#main ul li a {
	font-size:0.8em;
	color:#aac2ab;
}
section#topbar nav#main ul li a:hover {
	color:#fff;
};

section#topbar nav#auth {
	position: relative; 
	top:0.2em;
}
section#topbar nav#auth ul {
	margin:0.75em 0 1em 0;
	float:right;
	display:inline-block;
}
section#topbar nav#auth ul li:not(.social) a {
	font-size: 0.85em !important;
	color:#222;
	background: url('/images/stone.png');
	background-size: auto 100%;
	-webkit-border-radius: 34;
	-moz-border-radius: 34;
	border-radius: 34px;
	color: #000;
	font-size: 20px;
	padding: 0.3em 1.2em;
	border: solid #2ab9d4 3px;
	text-decoration: none;
}
section#topbar nav#auth ul li#enroll a {
	border-color:#cb8b2a;
	box-shadow: -2px -0px 15px 0 rgba(255,255,255,0.6);
	margin-left: 1em;
}
section#topbar nav#auth ul li#login a {box-shadow: 2px -0px 15px 0 rgba(255,255,255,0.6);}
section#topbar div.small-2 {text-align: center; padding:0.3em;}

.login h1 {color:#A8CACA; margin-bottom:1em; font-family: 'hopfer_hornbookregular' !important; text-transform: uppercase; text-align: center;}
.login button {width:100%;}

/* Column Menu & User Info */
section#nav-column {background-color: #555A59;}
div#user-info {
	width:100%;
	border-bottom: #aac29e thin solid;
	opacity:0.8;
	margin:0;
}
div#user-info h6 {
	padding:0.4em 0 0.3em;
	color:#fff;
	width:100%;
}

nav#column-menu {
	border-top: #aac29e thin solid;
	width:100%;
	opacity:0.9;
	min-height:100vh;
}

nav#column-menu ul {width:100%; padding:1em;}
nav#column-menu ul li a {
	color:#fff;
}

#members-online-box {
	margin-top:2em;
	width:auto;
	float: right;
	display: inline-block;
	opacity: 0.9;
	position: relative;
	padding:0.4em 0.6em 0.5em 0.2em;
	background: rgba(0, 0, 0, 0.6);
}

#members-online-box i {
	font-size: 1.5em;
    position: relative;
    top: 0.1em;
    margin-right: 0em;
}

#main-content {
	min-height: 10em
}
footer {
	color:#425c5c;
	padding: 6em 0 3em 0;
	width:100%;
    position: relative;
	background-size: 100% auto;
	background-position: bottom;
    background-repeat-y: no-repeat;
	background-image: url('http://img.hexrpg.com/images/footer.png');
}
footer nav {
	margin-bottom:6em;
}
footer nav ul {
	margin-top:0.5em;
	list-style: none;
}
footer nav ul li {
	display: inline-block;
	font-family: 'hopfer_hornbookregular' !important;
	text-transform: uppercase;
	font-size: 0.8em;
	margin:0.25em 0 0 2em;
}

footer .small-12 .row {font-size:80%;}
footer h5 {margin:2em 0 1em;}

table {
	overflow: hidden;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	box-shadow: 0 0 10px 10px rgba(0,0,0,0.5);
	width:100%;
}
table, table thead {
	background: transparent;
}
table tbody tr td {
	color: #222 !important; 
	padding:0.7em 2em;
}
table thead tr th {
	color: #222 !important; 
	padding: 1em 2em;
}
table tr:last-of-type {}
table tr:nth-child(odd) {
	background-color: #fff;
}
table tr:nth-child(even) {
	background-color: #fafafa;
}

table thead {
	overflow: hidden;
}
table thead tr {
	background-color: #ccc !important;
}
table tbody tr:first-of-type td {
	padding-top:1.5em;
}
table tbody tr:last-of-type td {
	padding-bottom:1.5em;
}
table tr td:last-of-type:not(.dont-auto-align), table tr th:last-of-type:not(.dont-auto-align) {
	text-align: right;
}

button.tiny, .button.tiny {
	margin:0;
	box-shadow: 0 0 10px 2px rgba(0,0,0,0.1);
}

.button.xtiny {	
    padding: 0.4em 0.5em 0.3em;
    font-size: 60%;
}
.button.square {
	padding: 0.5rem 0.7rem;
}
.button.square i{
	font-size:120%;
}

.p-top--02 {position:relative; top:-0.2em;}
.m-right-05 {margin-right: 0.5em !important}
.m-right-1 {margin-right: 1em !important}
.m-left-0 {margin-left: 0em !important}
.m-left-05 {margin-left: 0.5em !important}
.m-left-1 {margin-left: 1em !important}
.m-bottom-1 {margin-bottom: 1em !important}
.m-top-1 {margin-top: 1em !important}
.m-top-15 {margin-top: 1.5em !important}
.m-top-2 {margin-top: 2em !important}
.m-top-3 {margin-top: 3em !important}
.m-top-4 {margin-top: 4em !important}
.m-bottom-2 {margin-top: 2em !important}
.m-left-2 {margin-left: 2em !important}
.m-down-1 {margin-top:1em !important}
.m-down-11 {margin-top:1.1em !important}
.m-down-2 {margin-top:2em !important}
.m-down-15 {margin-top:1.5em !important}
.m-down-3 {margin-top:3em !important}
.m-down-05 {margin-top:0.5em !important;}
.bold {font-weight: bold !important}

.support #main-content {margin-bottom: 4em}
.support h1 {color: #fafafa;}
.support h3 {color: #fafafa; margin-top: -0.5em}
.support h5 {color: #aac2ab;}
.support, .support label {color:#fafafa;}
.support[placeholder] {font-style: italic;}

p{font-size: 95%}

p.usernotes:not(.sub) {
	height:175px;
	font-size: 90%; 
	margin-top:1em;
	margin-left:2em !important;
	overflow-y: auto;
	padding-right: 1em;
	color:#fff;
}

p.usernotes.sub {
	font-size: 90%; 
	display: block;
	margin-top:5em;
	padding-right: 1em;
	color:#000;
	margin-left:1.5em;
	max-height:200px;
	overflow: auto;
}
	
.divide-right {
	border-right: thin solid #222527;
	padding-right:2em;
}

.divide-right-light {
	border-right: thin solid #EAEBEB;
}

.divide-left-light {
	padding-left:2em;
	border-left: thin solid #EAEBEB;
}

dl {border-bottom-left-radius: 5px; border-top-left-radius: 5px; overflow: hidden;}

.tabs.vertical {width:100%; max-width: 100%; margin:0 !important;}
dd a {background-color: #C5DCD0 !important; padding:0.3em 0.6em !important; border-bottom:solid thin #A0BEAE !important; border-right:solid thin #A0BEAE !important;}
dd:first-of-type a {border-top:none !important;}
dd.active a {background-color: #fafafa !important; border-right:none !important;}
dd:not(.active):hover a {background-color: #D6E9DF !important;}
dd .log-date {font-size: 70%; color:#7A9184; margin-top:-0.2em; display: block; position: relative; top:1px;}
dd.active a .log-date {color: #9CABA2 !important;}


.matching-users {
	border-radius: 5px;
	overflow: hidden;
	color:000;
	margin:2em 1em;
	padding:0;
}

.hover {cursor: pointer;}
.user-info {overflow-wrap: break-word; font-size: 90%}

h1 i, h3 i, h5 i {font-size: 85%; cursor: pointer; color:#fff; position: relative; top:-2px; margin-left: 0.5em;}
h4 i {font-size: 85%; cursor: pointer; position: relative; top:-2px; margin-left: 0.5em;}

#main-content > div > div.row.m-top-2 > div.small-7.columns.m-top-2 textarea.usernotes-textarea {
	margin: 20px 0 0 2em !important;
}

.clearfix {clear: both}
.match-count {
	background-color: #70B9C6;
	border:thin solid #3392A3;
	color:#fff;
	font-size: 70%;
    padding: 0rem 0.7rem 0rem 0.3rem;
	border-radius: 100%;
	display: block;
	margin-top: 0.8em;
	position: relative;
    left: -0.6em;
	box-shadow: 0 0 10px 0px rgb(90, 140, 114, 0.75);
}
.match {color:#70B9C6; font-weight: bold}

.tabs-content .content {
	color: #000 !important;
	padding:0.5em 2em;
	font-size: 80%
}

.log-summary a, .log-summary a:visited {color:#2AB9D4;}
.log-summary a:hover {color:#198FA5;}

.log-summary {
	background-color: #fafafa;
    position: relative;
    left: -1em;
    padding-bottom:0em;
    margin-bottom: 4em !important;
}
.log-summary textarea {
	margin-top: 2em;
}


.offset-top-05 {position: relative; top:0.6em !important;}
.wrap {overflow-wrap: break-word;}

.red {color:red;}
.green {color:green;}
.grey {color:#aaa;}

.pagination-container {
	margin-top:2em;
	text-align: center;
}
.pagination-container ul {
	display: inline-block;
}
.pagination li {
	padding: 0.3em 0.65em !important;
}
.pagination li a {
	padding: 0 !important;
}
.pagination li.disabled {	
	opacity: 0.5;
}
.pagination li.active {	
	background-color: #62A7C7;
	border:thin solid #4287A7;
	font-size: 70%;
	padding: 0.3em 0.7em;
	border-radius: 0.3em;
	color:#fff;
}
.pagination li:not(.active) {	
	background-color: #fff;
	border:thin solid #A7ABB5;
	font-size: 70%;
	border-radius: 0.3em;
	color:#29282B;
}
.pagination li:not(.active) a {	
	color:#29282B;
}
.pagination li:first-of-type {padding: 0.15em 0.7em 0.35em !important; height:auto;}
.pagination li:last-of-type {padding: 0.15em 0.6em 0.35em !important; height:auto;}

.bg-grey {background-color: #EDEDED; color: #000; font-weight: normal; border: thin solid #C2C2C2;}
.bg-grey:focus {background-color: #EDEDED; color: #000; font-weight: normal}
.log-summary .bg-grey {width:90%;}
textarea {padding: 1em 1.2em !important}
.date-today {
    float: right;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    margin-top: 0.7em;
    color: #BED4BF;
    text-transform: none;
}

.aside {
	background-color: rgba(98, 167, 199, 0.38);
  	border: thin solid #2F5566;
  	padding:1em 1.5em ;
}
.aside hr {border-color:#375462; margin:1em 0;}
.aside small {color:#fafafa;}
small:not(.error) {font-size: 70%}
small {text-transform: none !important}

.low-priority {color:#7CDC8A;}
.medium-priority {color:#FFA35B;}
.high-priority {color:#FF5B5B;}

.edit-button, .save-button {margin-left:1em; cursor:pointer;}
.cancel-button {margin-left:0.5em; cursor:pointer;}
.edit-group input[type="text"], select {padding:0.3em 0.4em !important; margin:0 !important; width:40%; height:auto;}

.button.approve {
	background-color:#62B94C;
	border-color: #448B32;
}
.button.deny {
	background-color:#EE3E3E;
	border-color: #B92121;
}
.button.copy {
	background-color:#DFBD41;
	border-color: #BEA032;
}

.flag {
	font-size: 70%;
	border-radius:5px;
	font-weight: bold;
	background-color: #fff;
	border:#ccc solid thin;
	padding: 0.5em 1em;
}
.flag.tracking {
	color:#fff;
	border:#52783F solid thin;
	background-color: #72A757;
}

i.fi-eye {position: relative; top:1px;}

.reveal-modal#track {width:40%; color:#000 !important;}
.color-purple {color:#6C1BA4 !important;}

.flow-button {
    background-color: #E4E6EC;
    border-color: #9E9999;
    position: relative;
    top: -0.2em;
    color: #575D61!important;
    margin-left: 0.5em;
    padding: 0.05em 0.35em 0 0.3em !important;
    font-size: 0.45em !important;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.italic {font-style:italic;}
i.tiny {font-size: 0.6em}

.menu-col {
	border-left:thin solid #2F2F2F;
	margin-top: -1.5em;
	padding-top: 1.5em
}

.scrumMenu {
	list-style:none;
	padding:1.5em 0 0 3em;
}


.scrumMenu ul {
	list-style: none;
	margin-bottom:0.5em;
}
.scrumMenu ul li {
	margin-left:2em;
	font-size: 0.8em;
}

.issueCard {
	border:thin solid #7B7B7B;
	margin:1em 0.5em;
	background-color: #fafafa;
	border-radius: 5px;
	padding:1em 1.5em;
    box-shadow: 0 0 20px 0 rgba(255,255,255, 0.3);
	color:#222;
}

hr.scrum {
	border-color:#2F2F2F;
}

.scrumMenu h3, .scrumMenuAside h3 {
	font-size:1.5em;
}

.scrumMenuAside {
	margin-left:3em;
}

	
.cardButtons {
    position: relative;
    top: 0.6em;
}

.cardButtons a {
	position: relative;
	top:0.2em;
    left: 0.3em;
	font-size: 1.5em;
	margin-left: 0.5em;
	color:#ccc;
}

.cardButtons a:hover {color:#aac2ab;}

.cardButtons .count span {
	cursor: pointer;
    font-size: 1.75em;
    display: block;
    background-color: #B4D8C7;
    top: 0.3em;
    border-radius: 100%;
    border: thin solid #70827B;
    color: #256F50;
    position: relative;
    left: -1.3em;
    width: 1.6em;
    text-align: center;
    height: 1.6em;
    box-shadow: 0 0 10px 0px rgba(0,0,0,0.3);
}

.cardButtons .count span:hover {
	opacity: 0.8;
}

.hidden {display: none !important;}

.votesLeft {
    color: #AAC2AB;
    float: left;
    font-size: 2.5em;
}

button.inactive, .button.inactive {
    background-color: #ccc;
    border-color: #B5B5B5;
    opacity: 0.5;
}
.no-margin {margin:0 !important;}

.wide-column {
	min-width:10em;
}

.white {color:#F1ECEC;}
.text-left {text-align:left !important;}

table a:not(.button) i {
	color:#ccc;
}
table a:not(.button):hover i {color:#aac2ab;}
.activeItem a {color:#5A7A68; font-weight: bold;}

hr.chambers {
	border-color: #606359;
}

.department-block a {
	display: block;
    color: #44255F;
}
.department-block {
    background-color: #ccc;
    width: 100%;
    text-align: center;
    color: #fff;
    border: 7px solid #FFFFFF;
    margin: 0 0 1em 0;
    font-weight: bold;
    opacity: 0.9;
    padding-left: 1em;
    padding-right: 1em;
    border-radius: 5px;
    font-size: 1.2em;
    cursor: pointer;
}

.department-block:hover {
	opacity: 1;
}

.add-more {
	font-size: 1000%;
    opacity: 0.3;
}

.add-more a {
	color:#fff;
}

.add-more:hover {
    opacity: 0.6;
}

.content {float:none !important;}
.content.with-menu {padding-left:3% !important;}

.menu {
	height:100vh;
	background-color: #DCE6F1;
	border-right:thin solid #ccc;
	color:#222;
    padding: 2em;
	position: absolute;
	top:45px;
}

.menu a {
	color:#6CA183;
}

.menu ul {
	list-style: none;
}

.menu h4 {
    margin-top: 1em;
    font-size: 1.2375rem;
}

.hasER a#start-verify {
	opacity:0.7;
	cursor: default;
}