/* Adobe Fonts import */
/*@import url("https://use.typekit.net/mix4jpz.css"); */

/*** Root Properties  ***/

:root {
	/* colors */
	--primary: hsla(216, 63%, 31%, 1);
	--primary-hover: hsla(207, 100%, 33%, 1);
	--link-secondary: hsla(0, 0%, 55%, 1);
	/*--secondary-grey: #C8CFD5;*/
	--secondary-grey: #AAA;
	--background-grey: #f5f6ff;
	--secondary-grey-light: hsla(233, 100%, 98%, 1);
	--secondary-red: #e15140;
	--secondary-red-light: #fcede0;
	--secondary-green: #00b300;
	--secondary-green-light: #ccffcc;
	--flash-msg-red: #db2828;
	--flash-msg-green: #1ebc30;
	--flash-msg-green-light: #e5f9e7;
	--progress-bar-grn: #AFE6AC;
	--progress-bar-yellow: #FFC567;
	--progress-bar-red: #FFBAC2;
	/* breakpoints (unuseable in vanilla css?) */
	--bp-phone-max: 600px;
	--bp-tablet-portrait-max: 900px;
	--bp-tablet-landscape-max: 1200px;
	--bp-desktop-min: 1800px;
	/* icons */
	--fa-exclamation-triangle: '\f071';
}

/*******************
 *  Core Elements  *
 *******************/

html {
	background-color: white;
}

body {
	/*font-family: proxima-nova, sans-serif;*/
	font-family: sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 16px;
	margin-bottom: 50px;
	position: relative;
}

/*
*:fullscreen, *:-webkit-full-screen, *:-moz-full-screen {
    background-color: rgba(255,255,255,0);
}
*/

/*
 * For use with js to globally convert the cursor to a progress indicator when
 * waiting on a request, etc.
 */
body.waiting * {
	cursor: progress;
}

header {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	height: auto;
	background-color: hsla(233, 100%, 98%, 1);
	color: black;
	box-sizing: border-box;
	border-left: 5px solid var(--primary);
	margin-bottom: 50px;
	padding: 10px;
}

h2 {
	font-weight: 400;
	font-size: 28px;
}

a {
	color: var(--primary);
	text-decoration: none;
}

a:hover {
	color: var(--primary-hover);
	text-decoration: underline;
}

/*  Modals  */

.modal {
	display: none;
	position: fixed;
	z-index: 10;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0, 0, 0); /* fallback */
	background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
	background-color: white;
	margin: 15% auto;
	padding: 20px;
	border: 2px solid var(--primary);
	border-radius: 3px;
	width: 400px;
}

#modal-message {
	text-align: center;
	margin-bottom: 10px;
}

.modal-actions {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}

/*****************************************
 *  Globally Accessable Utility Classes  *
 *****************************************/

.fullscreenable {
	background-color: white;
}

.fullscreenable:fullscreen {
	padding: 10px;
}

.fullscreen-button {
	font-size: 1.5rem;
	width: 40px;
	padding: 1px;
}

.monospace {
	font-family: monospace;
}

.centered {
	margin-left: auto;
	margin-right: auto;
}

.preserve-whitespace {
	white-space: pre-wrap;
}

.small-container {
	width: 300px;
}

.hidden {
	visibility: hidden;
}

.no-display {
	display: none !important;
}

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

.http-error-box {
	margin: auto;
	width: 500px;
}

#error-description {
	font-size: 4rem;
}

#error-message {
	font-size: 2rem;
}

.warning-color {
	color: #dc0000;
}

.configuration-input-bar {
	display: flex;
	flex-direction: row;
	margin-bottom: 15px;
}

/* fake field to stop bots */
#account {
	display: none;
}

input[type=text]:focus {
	outline: 0;
	border: 1px solid hsla(0, 0%, 0%, 0.5); 
}

input[type=text] {
	width: 100%;
}

/* Buttons */

button {
	cursor: pointer;
}

.flex-row {
	display: flex;
	flex-direction: row;
}

.flex-row-mobile-column {
	display: flex;
	flex-direction: row;
}

.flex-column-mobile-row {
	display: flex;
	flex-direction: column;
}

.flex-break {
	flex-basis: 100%;
	margin-top: 15px;
	margin-bottom: 15px;
	/*width: 0;
	height: 0;
	overflow: hidden;*/
}

.text-align-left {
	text-align: left;
}

.text-align-right {
	text-align: right;
}

.button-primary {
	display: inline-flex;
	align-items: center; 
	cursor: pointer;
	color: #fff;
	min-width: 120px;
	height: 36px;
	background-color: var(--primary);
	border-color: var(--primary);
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	border: 1px solid transparent;
	padding: auto .75rem;
	margin: 1em 0;
	font-size: 1rem;
	line-height: 1.5rem;
	border-radius: 0.375rem;
	text-decoration: none;
}

.button-primary:hover {
	background-color: var(--primary-hover);
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.button-primary:active {
	background-color: var(--primary-hover);
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.button-action {
	cursor: pointer;
	color: hsla(216, 63%, 31%, 1);
	min-width: 120px;
	background-color: none;
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	border: 1px solid hsla(212, 74%, 82%, 1);
	padding: .375rem .75rem;
	margin: 0.125em 0.375em;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: 0.375rem;
	text-decoration: none;
}

.button-action:hover {
	background-color: hsla(212, 90%, 90%, 1);
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.button-primary-action {
	color: var(--primary);
	background-color: hsla(212, 74%, 82%, 1);
	border: none;
	font-weight: bold;
}

.button-primary-action:hover {
	background-color: var(--primary-hover);
	color: white;
	transition: color .35s ease-in-out, background-color .35s ease-in-out, border-color .35s ease-in-out, box-shadow .35s ease-in-out;
}

.button-delete {
	color: var(--link-secondary);
	background-color: white;
	border-color: var(--secondary-grey);
}

.button-delete:hover {
	background-color: white;
	border-color: red;
	color: red;
	transition: color .35s ease-in-out, background-color .35s ease-in-out, border-color .35s ease-in-out, box-shadow .35s ease-in-out;
}

.button-claim {
	cursor: pointer;
	color: rgb(111, 169, 255);
	width: 120px;
	background-color: none;
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select: none;
	border: 1px solid hsla(212, 74%, 82%, 1);
	padding: .375rem .75rem;
	margin: 0.125em 0.375em;
	font-size: 1rem;
	line-height: 1.3;
	border-radius: 1rem;
	text-decoration: none;
}

.button-claim:hover {
	background-color: white;
	border-color: hsla(216, 63%, 31%, 1);
	color: hsla(216, 63%, 31%, 1);
	transition: color .35s ease-in-out, background-color .35s ease-in-out, border-color .35s ease-in-out, box-shadow .35s ease-in-out;
}

.button-disabled, .button-disabled:hover, .button-disabled:active {
	cursor: default;
	background-color: rgb(217, 217, 217);
	border-color: rgb(217, 217, 217);
}

/*** tooltips ***/

.tooltip-container {
	position: relative;
	display: inline-block;
}

.tooltip-button {
	border: none;
	background: none;
	font: inherit;
	color: var(--primary);
}

.tooltip-msg-container {
	background-color: #ffffff;
	z-index: 3;
	border-radius: 3px;
	position: absolute;
	overflow: visible;
	left: 0px;
	bottom: calc(100% + 10px);
	width: 300px;
	border: 2px solid var(--primary);;
	padding: 5px;
	box-sizing: border-box;
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
	text-align: left;
}

.tooltip-text a {
	color: blue;
}

.tooltip-hidden {
	visibility: hidden;
}

.tooltip-revealed {
	visibility: visible;
}

/*@media only screen and (max-width: 370px) {
	.tooltip-msg-container {
		width: 100%;
	}
}*/

/***  tables  ***/
.full-width-table {
	width: 100%;
}

.sorting-draggable:hover {
	cursor: move;
}

/***  Countdown Timer Bars  ***/

.countdown-bar-container {
	position: relative;
}

.countdown-bar {
	height: 30px;
}

.countdown-time-left {
	position: absolute;
	width: 100%;
	text-align: center;
	line-height: 30px;
	font-weight: 700;
}

.table-countdown-time-left.countdown-time-left {
	width: calc(100% - 20px);
}

.time-left-long {
	background-color: var(--progress-bar-grn);
	color: #2F4D2E;
}

.time-left-mid {
	background-color: #FFC567;
	color: #8A5600;
}

.time-left-short {
	background-color: #ff1833;
	color: #bb0016;
}

.time-left-expired {
	font-size: 1.5rem;
	text-align: center;
	color: var(--secondary-red);
}

.attempted-label {
	font-weight: bold;
	text-align: center;
	color: #e69500; /* dark orange */
}

tr .countdown-time-left.time-expired {
	font-weight: 400;
}

.tile .time-left-expired {
	color: rgb(220, 0, 0);
}

/*** icons ***/

.icon {
	margin: 3px;
}

/*** link pills ***/

.link-pill {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	margin: 3px;
	text-decoration: none;
	padding: 3px;
	background-color: #e6e6e6;
	/*border: 1px solid #e6e6e6; */
	border-radius: 3px;
}

button.link-pill {
	border: none;
}

.link-pill:hover {
	background-color: #f2f2f2;
}

.no-data-pill {
	background-color: var(--primary);
	color: white;
	text-decoration: none;
}

.no-data-pill:hover {
	color: white;
	background-color: var(--primary-hover);
}

/*.claim-link {
	background-color: var(--primary);
	color: white;
	text-decoration: none;
}*/

/*.claim-link:hover {
	color: white;
	background-color: var(--primary-hover);
}*/

/*.user-link .userpic {
	margin-right: 3px;
}*/

/***  Markup   ***/

.bad-markup-type {
	color: var(--secondary-red);
}

.bad-markup-target {
	background-color: var(--secondary-grey);
}

.markup-bold {
	font-weight: bold;
}

.markup-italic {
	font-style: italic;
}

/*** Select2 Options ***/

.select2-results {
	max-height: 500px;
}

.formatted-select-option {
	border: 1px solid var(--secondary-grey);
	padding: 5px;
}

/*** charts ***/

.square-chart-container {
	width: 300px;
	height: 300px;
}

.rect-chart-container {
	width: 600px;
	height: 300px;
}

/*** Data Lists ***/

.data-item-list {
	text-align: left;
}

.data-item-label {
	font-weight: bold;
}

/*** Information Blocks ***/

.information-block-list {
	display: flex;
	flex-wrap: wrap;
}

.information-block-list.column-block-list {
	flex-wrap: nowrap;
	flex-direction: column;
}

.information-block {
	margin-right: 20px;
	margin-bottom: 20px;
}

.information-block-content {
	border-left: 2px solid #f5f6ff;
	border-right: 2px solid #f5f6ff;
	padding: 5px;
}

.flex-block-content {
	display: flex;
	flex-direction: row;
}


.information-block-footer {
	border-left: 2px solid #f5f6ff;
	border-right: 2px solid #f5f6ff;
	border-bottom: 2px solid #f5f6ff;
	padding: 5px;
}

.information-block-title {
	border-left: 5px solid var(--primary);
	padding: 3px;
	background-color: #f5f6ff;
	text-align: center;
}

/*.information-block-footer {
	margin-top: auto;
}*/

/*** Simple Labels With Data ***/

/* container for field-items */
.field-group, .wrap-list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

/* container for field-labal and field-value */
.field-item {
	margin: 10px;
}

.field-label {
	margin-bottom: 10px;
}

.field-value {
	
}

/* Task status pips/bars */

.task-status-pip {
	color: var(--secondary-green);
}

.task-status-pip.status-expired {
	color: var(--secondary-red);
}

.task-status-pip.status-prepared {
	color: var(--secondary-grey);
}

.task-status-completed {
	font-size: 1.5rem;
	text-align: center;
	color: var(--secondary-green);
}

.task-status-prepared {
	font-size: 1.5rem;
	text-align: center;
	color: var(--primary)
}

.task-status-expired {
	font-size: 1.5rem;
	text-align: center;
	color: var(--secondary-red);
}

.task-status-cant-delay {
	color: var(--secondary-red);
}

/*************************************
 *  Top Level Components/Containers  *
 *************************************/

/***  Top level page grid  ***/

#page-grid {
	display: grid;
	grid-template-columns: 200px auto;
	min-height: 100vh;
	/*padding-right: 40px;*/
}

/***  Navigation  ***/

#mobile-navigation, #mobile-nav-toggle-container {
	display: none;
}

#navigation {
	background-color: hsla(223, 100%, 99%, 1);
	display: flex;
	flex-direction: column;
}

#navigation .logo {
	margin: 20px 0 45px 0;
	max-width: 80px;
	align-self: center;
}

#navigation ul.menu {
	list-style-type: none;
	padding-inline-start: 0;
	text-align: left;
	line-height: 36px;
	margin: 0 auto;
	width: 175px;
}

#navigation ul li {
	margin: 0;
}

#navigation ul a, #navigation .accordian-header {
	text-decoration: none;
	color: var(--link-secondary);
	font-size: 16px;
}

#navigation .accordian-header:hover {
	cursor: pointer;
	text-decoration: underline;
}

#navigation ul a:hover {
	text-decoration: underline;
}

#navigation ul li a.selected {
	font-weight: bold;
	color: var(--primary);
}

#navigation ul li a.selected:hover {
	text-decoration: none;
	cursor: default;
}

#navigation .accordian-sub-menu {
	display: none;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	/* A little bit of padding helps distinguish multiple nested menus */
	/* located at the bottom of the list */
	padding-bottom: 2px;
}

/***  Flashed Messages ***/

#flashed-messages-container {
	/*width: 300px;*/
	margin: 10px auto;
	text-align: center;
	box-sizing: border-box;
}

.flashed-message {
	border-radius: 6px;
	font-size: 1.15rem;
	border: solid 1px;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	align-content: center;
}

.flashed-message button {
	color: #2D2D2D;
	opacity: .45;
	border: none;
	background-color: transparent;
}

/*.flashed-message-green {
	color: var(--flash-msg-green);
}*/

.flashed-message:not(:last-child) {
	margin-bottom: 5px;
}

/* necessary? */
.flash-category-content {
	border-color: var(--primary);
	background-color: var(--secondary-grey-light);
}

.flash-category-message {
	color: var(--primary);
	border-color: var(--primary);
	background-color: var(--secondary-grey-light);
}

.flash-category-error {
	color: var(--flash-msg-red);
	border-color: var(--flash-msg-red);
	background-color: var(--secondary-red-light);
}

.flash-category-success {
	color: var(--flash-msg-green);
	border-color: var(--flash-msg-green);
	background-color: var(--flash-msg-green-light);
}

.flash-category-debug p::before {
	color: red;
	content: 'DEBUG '
}
.flash-category-debug p::after {
	color: red;
	content: ' DEBUG'
}

/*** Connection Loss Indicator ***/
#connection-error-alert-container {
	text-align: center;
	padding: 10px;
}

#connection-error-spinner {
	display: inline-block;
	font-size: 2.5rem;
	color: red;
	margin-bottom: 10px;
}

/***  Global Search Bar  ***/

#global-search-bar {
	margin: 10px 0;
}

#global-search-bar form {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	height: 40px;
}

#global-search-bar form .form-field {
	flex-grow: 2;
	margin: auto 5px;
}

#global-search-bar form * {
	height: 100%;
}

#global-search-bar form select {
	height: 2.5rem;
	width: 10rem;
	border: solid 1px var(--secondary-grey);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

#global-search-bar input#query-string {
	padding-bottom: 0;
}

#global-search-bar input[type=text]#query_string {
	box-sizing: border-box;
	border: 1px solid hsla(0, 0%, 0%, 0.1);
	border-radius: 5px;
	text-align: center;
	font-size: 1.5rem;
	line-height: 2.5rem;
	margin-bottom: 0;
}

#global-search-bar form button {
	margin: 0;
}

/*** Inner Page Content ***/

#content-body {
	padding: 0px 25px;
}

#inner-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.header-logo {
	width: 300px;
}

/** inner page headers **/

header .header-title {
	text-align: center;
	line-height: 56px;
	font-size: 36px;
	font-weight: 900;
	cursor: default;
}

header .header-actions {
	font-weight: bold;
	font-size: 18px;
	margin: 1em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

/*** Activity Feed ***/

#activity-feed {
	position: fixed;
	top: 0px;
	right: 0px;
	height: 100vh;
	z-index: 1;
	display: flex;
	flex-direction: column;
	border-left: 5px solid var(--primary);
	background-color: var(--secondary-grey-light);
}

/*#activity-feed.open {
	flex-direction: column;
}*/

#feed-toolbar {
	background-color: var(--secondary-grey-light);
	padding: 5px;
	height: 100%;
	width: 32px;
	z-index: 2;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.feed-toolbar-tool {
	/*display: block;*/
	margin-bottom: 10px;
}

#feed-toolbar i {
	font-size: 2rem;
	color: var(--primary);
	cursor: pointer;
}

#feed-toolbar i.flipped-180 {
	-ms-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

#unread-feed-message-counter {
	font-size: 1.5rem;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: pointer;
	color: var(--secondary-grey-light);
}

#feed-messages {
	background-color: white;
	/*display: block;*/
	display: flex;
	flex-direction: column;
	width: 0px;
	height: 100%;
	z-index: 2;
	transition: width 0.5s;
	overflow-y: hidden;
	/*transition: background-color 2s linear;*/
}

#feed-messages #personal-notifications {
	/*height: 100%;*/
	/*flex-shrink: 0;*/
	flex-grow: 1;
	overflow-y: auto;
	min-height: 0;
	/*overflow-y: scroll;*/
}

#feed-messages.expanded {
	width: 450px;
}

#activity-feed-filter-options {
	padding: 10px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	border-bottom: 1px solid var(--primary);
}

#activity-feed-filter-options.no-display {
	display: none;
}

.activity-feed-filter-option {
	margin: 5px;
}

.activity-feed-filter-option input[type=checkbox] {
	margin-right: 3px;
}

.feed-section-title {
	padding: 5px;
	border-bottom: 1px solid var(--primary);
	background-color: hsla(223, 100%, 99%, 1);
}

.feed-major-message, #station-message-of-the-day {
	display: none;
	padding: 10px;
	/*background-color: var(--flash-msg-green-light);*/
	border-bottom: 1px solid var(--primary);
}

#station-message-of-the-day {
	/*background-color: hsla(223, 100%, 99%, 1);*/
}

.feed-message:last-child {
	/*margin-bottom: 30px;*/
	border-bottom: none;
}

.feed-message {
	cursor: pointer;
	display: none;
	word-wrap: break-word;
	padding: 5px;
	border-bottom: 1px solid var(--primary); 
	/*background-color: hsla(223, 100%, 99%, 1);*/
	background-color: #ffffff;
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.feed-message.read {
	background-color: var(--secondary-grey-light);
}

.feed-message:hover {
	border-bottom: 2px solid var(--primary);
}

.feed-message.unread.marked-for-deletion, .feed-message.marked-for-deletion {
	background-color: var(--secondary-red-light);
}

.feed-message:hover .delete-event-button {
	display: inline-block;
}

.feed-message .event-timestamp {
	font-weight: bold;
	margin-right: 5px;
}

.feed-message .event-tags {
	display: none;
}

.feed-message:hover .event-tags {
	margin-top: 3px;
	padding: 3px;
	display: block;
}

.event-tag {
	padding: 3px;
	border-radius: 3px;
	margin-right: 3px;
}

.message-tag {
	background-color: hsla(223, 100%, 99%, 1);;
}

.user-status-tag {
	color: white;
	background-color: #00cc99; 
}

.company-status-tag {
	color: white;
	background-color: #6699ff;
}

.task-status-tag {
	background-color: #ff9900;
}

#activity-feed.open #feed-messages .feed-section #feed-message-list .feed-message {
	display: block;
}

#activity-feed.open #feed-messages .feed-section #feed-major-message-list .feed-major-message {
	display: block;
}

#activity-feed.open #feed-messages .feed-section #station-message-of-the-day {
	display: block;
}

.no-decoration, .no-decoration:visited, .no-decoration:hover {
	text-decoration: none;
	cursor: default;
	color: inherit;
}

#activity-feed.open #feed-toolbar {
	width: 100%;
	height: 32px;
	border-bottom: 2px solid var(--primary);
	flex-direction: row;
	align-items: flex-start;
}

#activity-feed.open #feed-toolbar .feed-toolbar-tool {
	margin-bottom: 0px;
	margin-right: 10px;
}

#paging-buttons {
	border-top: 2px solid var(--primary);
	display: none;
}

#activity-feed.open #paging-buttons {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 20px;
}

/***********************************************
 *  Mobile Styles (At end to ensure override)  *
 ***********************************************/

@media only screen and (max-width: 760px) {
	/***  Top Level Components/Containers  ***/
	#page-grid {
		display: flex;
		flex-direction: column;
	}
	#mobile-navigation-container {
		background-color: hsla(233, 100%, 98%, 1);
		border-bottom: 1px solid hsla(212, 74%, 82%, 1);
	}
	#mobile-nav-toggle-container {
		display: block;
		display: flex;
		/*justify-content: flex-start;*/
		justify-content: flex-end;
	}
	#mobile-nav-toggle-button {
		margin: 10px;
		font-size: 2rem;
		background-color: hsla(233, 100%, 98%, 1);
		border: none;
	}
	/* drop from top */
	#mobile-navigation.menu-shown {
		display: block;
		/*
		 * TODO: Fix these temporary alignment fixes with a better container
		 * structure.
		 */
		padding-right: 45px;
		margin-bottom: 10px;
	}
	.menu {
		margin-top: 0px;
		list-style: none;
		padding: 0px 10px;
	}
	.menu li {
		font-size: 1.5rem;
		padding: 5px;
		border-radius: 3px;
		background-color: white;
		border: solid 2px hsla(216, 63%, 31%, 1);
	}
	.menu li:not(:last-child) {
		margin-bottom: 5px;
	}
	.menu li a {
		text-decoration: none;
	}
	.modal-content {
		width: 80%;
	}
	#mobile-navigation .accordian-header:hover {
		cursor: pointer;
	}
	#mobile-navigation .accordian-sub-menu {
		display: none;
	}
	#navigation {
		display: none;
	}
	#global-search-bar > form {
		display: flex;
		flex-direction: column;
		height: auto;
	}
	#global-search-bar > form > .form-field {
		width: 100%;
	}
	#global-search-bar > form > *:not(:first-child) {
		margin-bottom: 5px;
	}
	#global-search-bar > form > select {
		width: 100%;
	}
	#global-search-bar > form > button {
		width: 100%;
		height: 40px;
	}
	#content-body {
		padding: 0px 10px;
	}
	#feed-messages.expanded {
		width: 100%;
	}
}

@media only screen and (max-width: 400px) {
	.modal-content {
		padding: 10px;
	}
}

/* ??????????????????????? */

.ui-autocomplete-loading {
	background: white url("/static/images/in_progress.svg") right center no-repeat;
}

.tag {
	position: absolute;
	margin-top: 2.05rem;
	margin-left: 0.75rem;
	margin-right: 2px;
	background:rgb(206, 255, 206);
	text-align: left;
	padding: 5px;
	color: rgb(0, 78, 0);
	cursor: pointer;
	font-weight: bold;
}

.errored .tag {
	margin-top: 2.5rem;
}

span.fa-stack {
	font-size: 75%;
}

.tag i {
	color: rgb(255, 96, 96);
	padding-left: 5px;
}

i.fa-check-circle {
	color: rgb(175, 230, 172);
}

/*span.stop-ship i {
	color: rgb(255, 0, 0);
}
*/
.stop-ship {
	color: rgb(255, 0, 0);
}

.unverified {
	background:rgb(253, 255, 132);
	color: #563500;
}

.tag.unverified i {
	color: rgb(255, 96, 96);
}

.wrapper
{
	padding: 5px;
}

.stopship, span.stopship > a {
	color: red;
	/*font-weight: 900;*/
	text-decoration: none
}