@import url(fonts.css);

/* primary classes */
html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}


footer, .push {
	height: 9rem;
	clear: both;
}

footer { 
	background: rgba(0, 0, 0, 0.07);
	color: rgba(0, 0, 0, 0.5);
	padding-top: 1rem;
}

footer small {
	font-size: 0.8rem;
}

footer large {
	font-size: 1.5rem;
	font-weight: bold;
}

footer .icons {
	font-size: 1.75rem;
}

footer .footnote {
	margin-top: 0.5rem;
}

.top-bar ul > li.has-dropdown a::after {
  border-color: rgba(0, 0, 0, 0.4) transparent transparent transparent;
}

.wrapper {
	min-height: 100%;
	margin: 0 auto -8rem;
}

/* body classes */
body.accounts {
	padding-top: 10rem;
}

.page-header {
	padding-top: 1rem;
}
.public.page-header {
	padding-bottom: 1rem;
}

hr {
	margin: 1rem 0;
}

.spacedhr hr:not(.normal) {
	margin: 1.5rem 0 1rem;
} 

.header-sub-nav > dt {
	margin-left: 0;
}

.page-header ul.title-area > li.name > h1 {
	display: inline-block;
	font-size: 1.3rem;
}

div.spacer {
	padding-bottom:1em;
} 

.page-banner {
	width: auto; 
	background-color: #ccc; 
	color:#fff; 
	text-align: center;
	margin-bottom:2rem;
}

.page-banner h1 {
	color: #111;
	font-weight: normal;
	font-size: 2rem;
	padding: 1rem 0;
}

/* ACCOUNTS PAGE */
body.accounts {
	/*color: #dddddd;*/
	background-color: #eaeaea;
}
body.accounts .rm-logo {
	padding-bottom: 1.5rem;
}

body.accounts small.error {
	text-transform: none;
}

body.accounts small.error:not(:last-child) {
	margin-bottom: 0;
}


#container {
	min-height: 100%;
	height: 100%;
	position: relative;
}

/*#footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 70px;
	background: #000050;
}*/

#sidebar #footer {
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 250px;
}

#footer, #footer i.social::before {
	color: #708090;
}

#body.cp {
	display: table;
	table-layout: fixed;
	height: 100%;

	width: 100%;
}

#body.cp .body-wrap {
	display: table-row;
}

#body.cp .body-wrap > div {
	display: table-cell;
	min-height: 100%;
	vertical-align: top;
}


#sidebar {
	width: 250px;

	background: #f5f5f5;
	border-right: 1px solid #d0d0d0;
	margin: 0;
	padding: 0;
}

#sidebar ul {
	margin: 0;
	padding: 0;
}

#sidebar ul li {
	list-style-type: none;
}

#sidebar ul li a {
	padding: 0.5rem 1.1rem;
	display: block;

	color: inherit;
	border-bottom: 1px solid #d0d0d0;
}

#sidebar ul li a:hover {
	background: #dfdfdf;
}

#content {
	width: auto;
	padding: 1rem 2rem;
}

div.billing, div.settings-table {
	display: table;
	padding-bottom: 2rem;
}

input.billing {
	margin-top: -1rem;
	margin-bottom: 3rem;
}

.billing .billing-row, .settings-table .settings-row {
	display: table-row;
}

.billing .billing-row.header > div, .settings-table .settings-row.header > div {
	border-bottom: 1px solid #000;
}

.billing .billing-row > div, .settings-table .settings-row > div {
	display: table-cell;
	padding-top: 0.3rem;
}

.settings-table .settings-row > div.settings-button {
	padding-right: 1rem;
	text-align: center;
}

.settings-table .settings-row > div.settings-button:last-child {
	padding-right: 0;
}

.billing a.billing-row {
	color: #222;
} 

.billing a.billing-row:hover {
	background-color: #f0f0f0;
}

.billing .billing-row > div input[type="checkbox"] {
	margin: 0;
}

.billing .billing-row > div:last-child {
	text-align: right;
}

input.payments.expiry, input.payments.cvv {
	display: inline;
}
input.payments.expiry.month {
	width: 3rem;
}
input.payments.expiry.year {
	width: 4rem;
}
input.payments.cvv {
	width: 4rem;
}

div.center-div.wrapper {
	width: 100%;
	height: 100%;

	display: table;
}

div.center-div.content {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

div.center-div.content > img {
	padding-bottom: 1rem;
}

.twitter-typeahead {
	width: 100%;
}


.tt-query, .tt-input, /* UPDATE: newer versions use tt-input instead of tt-query */
.tt-hint {
    /*width: 396px;*/
    /*height: 30px;*/
    /*padding: 8px 12px;*/
/*    font-size: 24px;
    line-height: 30px;*/
    /*border: 2px solid #ccc;*/
    border-radius: 8px;
    outline: none;
}

.tt-query, .tt-input { /* UPDATE: newer versions use tt-input instead of tt-query */
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: #999;
    background-color: transparent !important;
}

.tt-menu { /* UPDATE: newer versions use tt-menu instead of tt-dropdown-menu */
	width: 100%;
    /*margin-top: 12px;*/
    padding: 0px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0px;
    /*box-shadow: 0 5px 10px rgba(0,0,0,.2);*/
}

.tt-suggestion {
	padding: 0.5rem 1rem;
}

.tt-suggestion.tt-cursor, .tt-suggestion:hover { /* UPDATE: newer versions use .tt-suggestion.tt-cursor */
    color: #fff;
    background-color: #0097cf;
}

.tt-suggestion p {
    margin: 0;
}

.tt-menu.tt-open {
	margin-top: -18px;
}

.ajax-loader {
	background-image: url(data:image/gif;base64,R0lGODlhEAAQAPQAAP///wAAAPj4+Dg4OISEhAYGBiYmJtbW1qioqBYWFnZ2dmZmZuTk5JiYmMbGxkhISFZWVgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAAFUCAgjmRpnqUwFGwhKoRgqq2YFMaRGjWA8AbZiIBbjQQ8AmmFUJEQhQGJhaKOrCksgEla+KIkYvC6SJKQOISoNSYdeIk1ayA8ExTyeR3F749CACH5BAAKAAEALAAAAAAQABAAAAVoICCKR9KMaCoaxeCoqEAkRX3AwMHWxQIIjJSAZWgUEgzBwCBAEQpMwIDwY1FHgwJCtOW2UDWYIDyqNVVkUbYr6CK+o2eUMKgWrqKhj0FrEM8jQQALPFA3MAc8CQSAMA5ZBjgqDQmHIyEAIfkEAAoAAgAsAAAAABAAEAAABWAgII4j85Ao2hRIKgrEUBQJLaSHMe8zgQo6Q8sxS7RIhILhBkgumCTZsXkACBC+0cwF2GoLLoFXREDcDlkAojBICRaFLDCOQtQKjmsQSubtDFU/NXcDBHwkaw1cKQ8MiyEAIfkEAAoAAwAsAAAAABAAEAAABVIgII5kaZ6AIJQCMRTFQKiDQx4GrBfGa4uCnAEhQuRgPwCBtwK+kCNFgjh6QlFYgGO7baJ2CxIioSDpwqNggWCGDVVGphly3BkOpXDrKfNm/4AhACH5BAAKAAQALAAAAAAQABAAAAVgICCOZGmeqEAMRTEQwskYbV0Yx7kYSIzQhtgoBxCKBDQCIOcoLBimRiFhSABYU5gIgW01pLUBYkRItAYAqrlhYiwKjiWAcDMWY8QjsCf4DewiBzQ2N1AmKlgvgCiMjSQhACH5BAAKAAUALAAAAAAQABAAAAVfICCOZGmeqEgUxUAIpkA0AMKyxkEiSZEIsJqhYAg+boUFSTAkiBiNHks3sg1ILAfBiS10gyqCg0UaFBCkwy3RYKiIYMAC+RAxiQgYsJdAjw5DN2gILzEEZgVcKYuMJiEAOwAAAAAAAAAAAA==) !important;
}

input.ajax-loader {
	background-position: right 0.7rem center !important;
	background-repeat: no-repeat !important;
}

.journeylist {
	text-align: center;
}

.journeylist .journey {
	background-color: #eee;
	border-radius: 1rem;
	padding: 0.5rem;
	margin: 0.25rem 0.25rem;
}

.journeylist .journey.deleted {
    background-color: #eee;
    color: #888;
}

.journeylist .journey.deleted .journey-type {
    color: #aaa;
}

.journeylist .journey .journey-type {
    font-size: 2rem;
    filter: invert(0.4);
	margin: 0 0.5rem 0 1rem;
}

.journeylist .journey .journey-details > small {
	font-size: 0.8rem;
	line-height: 1.2rem;
	display: block;
}

.journeylist .journey .journey-details .date {
	font-size:0.9rem;
} 

.journeylist .journey .journey-details .spacer {
	padding-bottom:0.5rem;
} 

.journeylist .journey .journey-details {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.journeylist .journey > .buttons {
	margin-top: 0.25rem;
	margin-bottom: 0.25rem;
}

.journeylist .journey > .buttons > a {
	padding: 0 0.75rem;
	display: inline-block;
}

#journeys_nav_pen .chevron a .glyphicons, .journeylist .journey > .buttons > a .glyphicons, .buttons > a .glyphicons {
	filter: invert(0.5);
}

.journeylist .journey > .buttons > a:hover .glyphicons, #journeys_nav_pen .chevron a:hover .glyphicons, .buttons > a:hover .glyphicons {
	filter: none;
}

#journeys_nav_pen {
	margin: 0rem 0;
}

#journeys_nav_pen .chevron {
	font-size: 2rem;
	margin-top: -0.3rem;
}

#journeys_nav_pen select {
	margin: 0;
}

.notification-number {
	position: relative;
	/*float: left;*/
	top: -0.5rem;
	left: -0.1rem;
	font-size: 0.7rem;
	/*height: 0.1re;*/

	background-color: red;
	padding: 0.1rem 0.4rem;
	border-radius: 1rem;
	color: white;
	font-weight: bold;
}

.friend.panel, .league-member.panel {
	padding: 0.7rem 1rem;
}

.friend.panel .avatar, .league-member.panel .avatar, .public.avatar, .tractionleague.panel .position {
	width:40px; 
	height:40px; 
	border-radius: 20px; 
	margin-right: 1rem; 
	text-align: center;
}

.public.avatar {
	margin-top: 0.3rem;
	margin-bottom: -0.3rem;
	margin-left: 0.5rem;
}

.league-member.panel .avatar > .rank, .tractionleague.panel .position > .rank {
	padding: 5px;
	position: relative;
	z-index: 1;
	font-weight: bold;
	font-size: 1.5rem;
}

.league-member.panel .user {
	font-weight: 600;
	overflow: hidden; 
	text-overflow: ellipsis; 
	white-space: nowrap;
}


.friend.panel .avatar > .image, .league-member.panel .avatar > .image {
	position: absolute;
	top: 0; left: 0; width: 40px; height: 40px;
	margin-left: 30px;
	margin-top: 12px;
	border-radius: 20px; 
	opacity: 0.1;
}

.friend.request.panel .buttons {
	font-size: 1.3rem;
}

.product-bank .product-image-container > .product-image {
	width: 5rem;
	height: 5rem;

	display: block;
	background-repeat: none;
	background-size: contain;
	margin: 0 auto;
}

.product-bank .product-image-container {
	padding-bottom: 1rem;
}

.product-bank .product.panel, .service > .panel {
	cursor: pointer;
}

.product-bank .product.panel:hover, .service > .panel:hover, a > .panel:hover {
	background-color: #E2E2E2;
}

.product-bank .product.panel.selected {
	background-color: #B5FFC1;
}

.product-bank .product.panel.selected:hover {
	background-color: #A3E8AF;
}

.error > .signal {
  text-align: center;
}

.error > .signal > div {
  margin-left: auto;
  margin-right: auto;
}

.error > .signal > .head {
  min-width: 4rem;
  max-width: 6rem;
  
  background-color: #000;
  padding: 1rem;
  border-radius: 1rem;
}

.error > .signal > .head > .aspect {
  width: 2.5rem;
  height: 2.5rem;
  background-color: #999;
  border-radius: 1.25rem;
  
  margin-left: auto;
  margin-right: auto;
  
  margin-bottom: 0.5rem;
}

.error > .signal > .head > .aspect.skip {
  background: none;
}

.error > .signal > .head > .aspect.red {
   background-color: #f00;
}

.error > .signal > .head > .aspect.yellow {
   background-color: #ff0;
}

.error > .signal > .head > .aspect.green {
  background-color: #008000;
}

.error > .signal > .head > .aspect:last-child {
  margin-bottom: 0rem;
}

.error > .signal > .signalpost {
  width: 3rem;
  height: 1rem;
  background-color: #666;
}

.error > .signal > .signalplate {
  max-width: 5rem;
  color: #fff;
  background-color: #000;
  
  padding: 0.5rem 0rem;
  border-radius: 0.5rem;
  
  font-size: 1.5rem;
}

.error > .signal > .signalpost.fade {
  width: 3rem;
  height: 1rem;
  background-color: #666;
  background: linear-gradient(to bottom, #666, #fff);
}

.box-flash {
	-webkit-transition: flash 1s ease-out;
	-moz-transition: flash 1s ease-out;
	-o-transition: flash 1s ease-out;
	transition: flash 1s ease-out;
	animation: flash 1s forwards linear normal;
}

@keyframes flash {
	0% { 
		background: green;
	}
	60% { 
		background: none;
	}
}

@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.panel-top-stats h3 {
	font-size: 1rem;
	line-height: 1rem;	
	margin-bottom: 0.3rem;
}

.panel-top-stats .significant-value {
	font-size: 1.8rem;
}
.panel-top-stats .significant-value div[data-sub] {
	font-size: 1rem;
	min-height: 1rem;
}

.journeymasthead {
	padding-top: 2rem;
	font-size: 3rem;
}

.journeymasthead > p {
	padding-top: 1rem;
	font-size: 1.5rem;
}
.panel-top-stats .significant-value > .glyphicons, .journeymasthead > .glyphicons.rotate {
	margin-top: 0.5rem;
	margin-bottom: -0.5rem;

	animation: rotating 2s linear infinite;
}

#servicedetail-modal .glyphicons {
	margin-top: 0.3rem;
	margin-bottom: -0.3rem;
}

.panel-top-stats .value {
	font-size: 1rem;
}

.button.suppressbottom {
	margin-bottom: 0;
}

.top-bar-section>ul>.divider,.top-bear-section>ul>[role="separator"] {
	border-right: solid 1px #ddd;
	margin: 0 0.5rem;
}

.top-bar-section .dropdown li {
	border-left: 1px solid #e9e9e9;
	border-right: 1px solid #e9e9e9;
	border-top: 1px solid #e9e9e9;
}

.top-bar-section .dropdown li:last-child {
	border: 1px solid #e9e9e9;
}

table.journeytable {
	width: auto;
	border: 0;
	margin: 0 1rem;
}

table.journeytable td.nowrap {
	width: 1%;
	white-space: nowrap;
}

table.journeytable tbody tr td {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	font-size: 0.9rem;
}
table.journeytable tr { border-bottom: 1px solid #e9e9e9 ;}
table.journeytable tr:nth-of-type(even){background:#fff;}
table.journeytable tr.even { background:#eeeeee; border-bottom: 1px solid #d6d6d6 ;}
table.journeytable td.time.late {
	font-weight: bold;
	color: #f00;
}
table.journeytable td.time.early {
	font-weight: bold;
	color: #006400;
}

table.journeytable td.buttons a:link span.glyphicons {
	filter: invert(0.5);
}

table.journeytable td.buttons a:hover span.glyphicons {
	filter: invert(0.2);
}

.search-box, .search-term, #journeysearchpage .searchbutton {
	display: inline-block;
	padding: 0.2857142857rem 1rem 0.2857142857rem;

	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;
	user-select: none;
}

.search-box, .search-term {
	margin-bottom: 0.3rem;
	margin-right: 0.3rem;
	white-space-collapse: discard;
}

#journeysearchpage .searchbutton {
	margin-bottom: 0;
}

.search-box {
	background-color: #e7e7e7;

}

.search-term {
	background-color: #008CBA;
	color: #fff;
}

.search-term a {
	display: inline-block;
	padding-left: 1rem;

	position:relative;
	/* top: 0.2rem; */
}

.search-term a span.glyphicons {
	filter: invert(0.9);
}

.search-term a:hover span.glyphicons {
	filter: invert(0.7);
}

.spacedhr hr.normal {
	margin: 0.7rem 0 1rem;
} 

#addterm-modal .tab-title.active a {
	background-color: #ccc;
}

#addterm-modal .tab-title {
    border-right: 1px solid #a9a9a9;
}

#addterm-modal .tab-title a { 
    font-size: 1em;
    padding: 0.5em 1em;
}

#addterm-modal .tab-title:last-child {
    border-right: none;
}

.tractionlist-boxes .panel {
	font-size: 1.5rem;
	text-align: center;
}

.airtravel-set > label {
	display: inline-block;
	padding-right: 1rem;
}

.airtravel-set > label > input {
	margin-right: 0.5rem;
}

fieldset {
	margin-top: 0;
    padding-top: 1rem;
}

input[data-toggle] {
  display: none; }

input[data-toggle] + label {
	padding: 0.65rem 1.5rem;
	background-color: #ccc;
}

input[data-toggle]:checked + label,
input[data-toggle]:checked + label:active {
  background-color:#008CBA; font-weight:bold;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.05); }

.button-group.toggle li:not(first-child) {
  margin: 0 -0.9rem; }

.quicklinks { 
    text-align: center;
    font-size: 1.3em;
}

.quicklinks i {
    display: block;
    margin-left: auto; margin-right: auto;
    font-size: 1.3em;
    padding-bottom: 0.5em;
}

#industry_viapoints_container button {
	margin: 0 0 0.5em;
	padding: 0.5em;
}