@import url('https://fonts.googleapis.com/css?family=Montserrat:300,500,600');
@import url('https://fonts.googleapis.com/css?family=Roboto+Mono');

.btn {
	cursor: pointer;
	border-radius: 3px;
	background: transparent;
	padding: 5px 10px;
	font-weight: 400;
	font-size: 14px;
	outline: none;
	font-family: 'Montserrat';
	transition: background-color .3s ease;
}

.btn-outline {
	background: transparent;
	border: 1px solid #264CBF;
	color: #264CBF;
	font-weight: 300;
}body, html {
	padding: 0;
	margin: 0;
	overflow: hidden;

	font-size: 14px;
	font-weight: 500;
	font-family: 'Montserrat', sans-serif;

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

body {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

div {
	box-sizing: border-box;
}

.hide {
	display: none !important;
}

#header {
	height: 50px;
	display: flex;
	align-items: stretch;
	background: var(--primary);
}

	#header .inner {
		flex: 1;
		padding: 0 10px;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	#header .replay-alert {
		color: white;
		text-transform: uppercase;
		text-align: center;
		font-weight: 700;
		letter-spacing: 1px;
		opacity: 0.5;
		width: 70px;
		position: absolute;
		left: 50%;
		margin-left: -35px;
		display: none;
	}

	#header .btn {
		color: var(--alternate);
		font-size: 12px;
		background: transparent;
		border: 1px solid;
		border-color: var(--alternate);
	}

.logo {
	height: 20px;
	background-repeat: no-repeat;
}

#metadata {
	background: white;
	padding: 0 10px;
	height: 32px;
	display: flex;
	align-items: center;
	font-size: 14px;
	color: var(--border);
}
	
	#flags {
		font-size: 0;
	}

		#flags img {
			margin-right: 2px;
			border: 1px solid #444;
		}

	#time {
		padding: 0 5px;
		width: 70px;
		text-align: right;
		font-size: 12px;
		font-family: 'Roboto Mono', monospace;
	}

	#date {
		padding: 0 5px;
		font-size: 12px;
		font-family: 'Roboto Mono', monospace;
	}

		#date-long {
			display: inline;
		}

		#date-short {
			display: none;
		}

	#balance {
		text-align: right;
		margin-left: auto;
		margin-top: 4px;
		font-size: 26px;
		font-weight: 600;
	}

		#balance:before {
			content: "$";
			font-size: 20px;
			font-weight: 300;
		}

		#balance.positive {
			color: #5e8c2e;
		}

		#balance.negative {
			color: #9b2835;
		}

#trades {
	height: 32px;
	background: white;
	border-bottom: 1px solid;
	border-color: var(--border);
	display: flex;
	align-items: center;
	overflow: hidden;
}

	#tip {
		padding: 7px 10px;
		color: #999;
	}

	#history {
		flex: 1;
		align-self: stretch;
		position: relative;
		overflow: hidden;
	}

		#history .icon {
			height: 22px;
			border-radius: 10px;
			border: 1px solid white;
			font-size: 12px;
			text-align: left;
			position: absolute;
			background: #8da4e8;
			color: white;
			top: 5px;
			padding: 2px 8px 2px 26px;
		}

			#history .icon:hover, #history .icon:active { z-index: 1000; }

			#history .icon.win:before {
				content: "";
				width: 24px;
				height: 24px;
				background: url('/assets/player/images/tick.png') no-repeat;
				background-size: 24px 24px;
				position: absolute;
				left: -1px;
				top: -2px;
			}

			#history .icon.lose:before {
				content: "";
				width: 24px;
				height: 24px;
				background: url('/assets/player/images/cross.png') no-repeat;
				background-size: 24px 24px;
				position: absolute;
				left: -1px;
				top: -2px;
			}

			#history .icon.neutral:before {
				content: "";
				width: 24px;
				height: 24px;
				background: url('/assets/player/images/neutral.png') no-repeat;
				background-size: 24px 24px;
				position: absolute;
				left: -1px;
				top: -1px;
			}

#news {
	height: 21px;
	background: white;
	border-top: 1px solid #eee;
	padding-top: 1px 
}

	#news-translate {
		will-change: transform;
	}

	#news .item {
		position: absolute;
		width: 24px;
		height: 18px;
		border-radius: 9px;
		border: 2px solid;
		
		background-size: 23px 15px;
		background-position: center;
		background-repeat: no-repeat;
	}

	#news .item.high { border-color: #ff3b00; }
	#news .item.med { border-color: #ffbc00; }

	.item.EUR { background-image: url('/assets/player/images/EUR.png'); }
	.item.USD { background-image: url('/assets/player/images/USD.png'); }
	.item.GBP { background-image: url('/assets/player/images/GBP.png'); }
	.item.AUD { background-image: url('/assets/player/images/AUD.png'); }
	.item.CAD { background-image: url('/assets/player/images/CAD.png'); }
	.item.CHF { background-image: url('/assets/player/images/CHF.png'); }
	.item.JPY { background-image: url('/assets/player/images/JPY.png'); }
	.item.NZD { background-image: url('/assets/player/images/NZD.png'); }

#footer {
	background: #fff;
	border-top: 1px solid #eee;
	/*padding: 5px 10px;*/
	height: 120px;
	z-index: 1000;
}

	#footer.replay-mode {
		
	}

		#footer.replay-mode .ui-trade {
			display: none;
		}

		#footer.replay-mode .ui-lots {
			display: none;
		}

		#footer.replay-mode .ui-row {
			margin-top: 0;
		}

.stage {
	position: relative;
	display: flex;
	flex: 1;
	overflow: hidden;
}

#wrapper {
	position: relative;
	flex: 1;
	overflow: hidden;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

	.replay #wrapper {
		/*bottom: 60px;*/
	}

	#canvas {
		position: absolute;
		z-index: 5;
	}

	#ui-canvas {
		position: absolute;
		z-index: 10;
		transform: scaleZ(1);

		display: none;
	}

	#background-canvas {
		position: absolute;
		z-index: 0;
		display: none;
	}

	.overlay {
		/*display: none;*/
		/*z-index: 100;*/
	}

	#ui-layer {
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 10;
		/*transform: scaleZ(1);*/
	}

#scale {
	order: 1;
	width: 50px;
	overflow: hidden;
	font-size: 10px;
	text-align: left;
	font-family: 'Roboto Mono', monospace;
	cursor: ns-resize;
}

	#scale-wrapper {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding-left: 10px;
	}

		#scale-wrapper span {
			height: 10px;
		}

	.replay #scale {
		
	}

.layout {
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.ui-row {
	display: flex;
}

.ui-lots {
	max-width: 250px;
	flex: 1;
	margin-right: 5px;
	margin-left: 5px;
}

#lots-output {
	font-weight: bold;
	color: #888;
	text-transform: uppercase;
}

.ui-controls {
	padding: 10px;
	margin: 0 -5px;
}

.ui-granularity {
	align-items: center;
	background: #444;
	color: white;
	padding: 0 10px;
	height: 50px;
}

	.ui-granularity .btn {
		border: 0;
		background: transparent;
		text-decoration: underline;
		color: #aaa;
		padding: 10px;
		width: 64px;
	}

		.ui-granularity .btn:hover {
			color: #fff !important;
		}

		.ui-granularity .btn.active {
			text-decoration: none;
			color: #fff !important;
		}

		.ui-granularity .btn.active:before {
			content: "• ";
		}

	.ui-granularity label {
		color: #ccc;
		font-size: 14px;
		padding-right: 10px;
		font-weight: 600;
	}

.ui-trade {
	flex: 2;
	display: flex;
	justify-content: center;
}

	.btn-trade {
		text-transform: uppercase;
		letter-spacing: 1px;
		font-size: 18px;
		padding: 10px;
		flex: 1;
		height: 50px;
		color: black;
		margin: 0 5px;

		transition: box-shadow .3s ease;
	}

		.btn-trade:hover {

		}

	.btn-buy {
		border-color: #5e8c2e;
		color: #5e8c2e;
	}

		.btn-buy .icon {
			color: #5e8c2e;
		}

		.btn-buy:hover {
			box-shadow: inset 0px 0px 5px 0px #5e8c2e; 
		}

	.btn-sell {
		border-color: #9b2835;
		color: #9b2835;
	}

		.btn-sell .icon {
			color: #9b2835;
		}

		.btn-sell:hover {
			box-shadow: inset 0px 0px 5px 0px #9b2835;
		}

	.btn-trade {
		
	}

	#btn-skip {
		display: none;
	}

.btn-group {
	font-size: 0;
	display: flex;
	flex: 1;
	margin: 0 5px;
}

	.btn-group .btn:last-child {
		/*border-left: 0;*/
	}

.btn-close {
	border-color: #444;
	color: #444;
	margin: 0;
	flex: 1;
	border-radius: 0;
}

	.btn-close:hover {
		box-shadow: inset 0px 0px 5px 0px #444;
	}

	.btn-close-full {
		flex: 3;
		border-right: 0;
		border-top-left-radius: 3px;
		border-bottom-left-radius: 3px;
	}

	.btn-close-half {
		color: #666;
	}

	.btn-close-qtr {
		color: #888;
		border-left: 0;
		border-top-right-radius: 3px;
		border-bottom-right-radius: 3px;
	}

.ui-speed {
	display: flex;
	justify-content: flex-end;
	max-width: 250px;
	flex: 1;
}

	.ui-speed .btn {
		height: 50px;
		margin: 0 5px;
		flex: 1;
		border: 1px solid transparent;
	}

		.ui-speed .btn:hover {
			background: #eee;
		}

		.ui-speed .btn svg use {
			fill: var(--buttons);
		}

		.ui-speed .btn.active {
			border-color: var(--buttons);
		}

.btn-controls {
	display: none;
	width: 40px;
	border: 0;
	padding: 7px;
}

	.replay .btn-controls {
		display: none;
	}

#trade-entry-btns, #trade-close-btns {
	display: flex;
	flex: 1;
	max-width: 800px
}

@media (max-width: 620px) {
	.btn-controls {
		display: block;
	}
}

@media (max-width: 480px) {
	#flags {
		margin-top: 1px;
	}

		#flags img {
			width: 18px;
			height: 12px;
			margin-right: 1px;
		}

	#tip {
		font-size: 12px;
	}

	#time, #date {
		font-size: 11px;
	}

	#date-long {
		display: none;
	}

	#date-short {
		display: inline;
	}

	#timeleft {
		width: 55px;
	}

	#time {
		width: 60px;
		padding-right: 2px;
	}

	#balance {
		font-size: 16px;
		margin-top: 0;
	}

		#balance:before {
			font-size: 12px;
		}


	#scale {
		width: 35px;
		font-size: 9px;
	}

		#scale-wrapper {
			padding-right: 5px;
		}

	#footer {
		
	}

	.ui-granularity {
		padding: 0;
	}

	.ui-granularity label {
		display: none;
	}

	.ui-granularity .btn {
		flex: 1;
		width: auto;
		font-size: 12px;
		padding: 8px 0;
	}

	.btn-trade {
		
	}

	.btn-trade .icon {
		display: none;
	}

	.replay-mode .ui-speed {
		flex-direction: row;
	}

	.ui-speed .btn.active {
		border-color: transparent !important;
		background: #eee;
	}
}input[type=range].slider {
  -webkit-appearance: none;
  width: 100%;
  margin: 2.5px 0;
}
input[type=range].slider:focus {
  outline: none;
}
input[type=range].slider::-webkit-slider-runnable-track {
  width: 100%;
  height: 20px;
  cursor: pointer;
  background: #eeeeee;
}
input[type=range].slider::-webkit-slider-thumb {
  height: 25px;
  width: 25px;
  border-radius: 3px;
  background: var(--buttons);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -2.5px;
}
input[type=range].slider:focus::-webkit-slider-runnable-track {
  background: #eeeeee;
}
input[type=range].slider::-moz-range-track {
  width: 100%;
  height: 20px;
  cursor: pointer;
  background: #eeeeee;
}
input[type=range].slider::-moz-range-thumb {
  height: 25px;
  width: 25px;
  border-radius: 3px;
  background: var(--buttons);
  cursor: pointer;
}
input[type=range].slider::-ms-track {
  width: 100%;
  height: 20px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range].slider::-ms-fill-lower {
  background: #eeeeee;
}
input[type=range].slider::-ms-fill-upper {
  background: #eeeeee;
}
input[type=range].slider::-ms-thumb {
  height: 25px;
  width: 25px;
  border-radius: 3px;
  background: var(--buttons);
  cursor: pointer;
  height: 20px;
}
input[type=range].slider:focus::-ms-fill-lower {
  background: #eeeeee;
}
input[type=range].slider:focus::-ms-fill-upper {
  background: #eeeeee;
}#mdl {
	position: absolute;
	top: 118px;
	width: 400px;
	font-size: 16px;
	padding: 10px;
	z-index: 1000;
	background: white;
	transition: right ease .5s, opacity ease .2s;
	opacity: 0;
	display: none;

	border: 1px solid;
	border-color: var(--primary);
	border-right: 0;
	
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;

	pointer-events: none;
}

	#mdl h2 {
		margin-top: 0;
		font-size: 16px;
		margin-bottom: 5px;
		color: var(--border);
	}

	#mdl p {
		font-size: 14px;
		color: #666;
		margin-top: 0;
		margin-bottom: 0;
	}

	#mdl svg {
		float: left;
		margin-right: 4px;
	}

		#mdl svg use {
			fill: var(--buttons);
		}

@media (max-width: 480px) {
	#mdl {
		width: 200px;
	}

		#mdl h2 {
			font-size: 14px;
		}

		#mdl p {
			font-size: 12px;
		}
}#drawables {
	position: absolute;
	left: 2px;
	top: 2px;
	bottom: 0;
	width: 46px;
	z-index: 100;
	overflow: auto;
}

.drawable-container {
	padding: 2px;
	background: white;
	border: 1px solid #eee;
}

	.collapsable {
		overflow: hidden;
		transition: height ease .3s;
	}

	#shelf {
		padding-top: 2px;
		border-bottom: 1px dotted #888;
	}

	.collapsable.closed {
		height: 0px;
	}

	.collapsable.open {
		height: 256px;
	}

	#drawables .btn {
		display: block;
		width: 40px;
		height: 40px;
		border: 1px solid #ccc;
		background: white;
		margin-bottom: 2px;
		padding: 5px;
		cursor: pointer;
	}

		#drawables .btn-draw.active {
			border-color: #888;
			box-shadow: inset 0px 0px 5px 0px #999;
		}

	#drawables .btn svg {
		width: 28px;
		height: 28px;
	}

	#drawables .btn svg use {
		stroke: var(--buttons);
	}

#btn-draw-toggle {
	height: 30px;
	width: 44px;
	background: var(--buttons);
	border: 0;
	outline: none;
	margin: -2px -2px 0 -2px;
	display: block;
	padding: 0;
	cursor: pointer;
}

	#btn-draw-toggle svg {
		width: 28px;
		height: 28px;
	}

	#btn-draw-toggle svg use {
		stroke: white;
	}

path.line, path.hline {
	stroke: rgba(0,0,0,0.6);
	stroke-width: 2;
}

	path.line.invert, path.hline.invert {
		stroke: rgba(255,255,255,0.6);
	}

path.box {
	fill: rgba(38, 76, 191, 0.2);
}

	path.box.invert {
		fill: rgba(138, 176, 251, 0.3);
	}

g.fib path {
	stroke: rgba(0,0,0,0.6);
	stroke-width: 1;
}

	g.fib.invert path {
		stroke: rgba(255,255,255,0.6);
	}

@media (max-height: 520px) {
	.collapsable.open {
		height: 220px;
	}

	#drawables .btn {
		height: 34px;
		padding: 2px;
	}
}#trade {
	visibility: hidden;
	position: absolute;
}

#trade-history {
	position: absolute;
}

#stoploss {
	background: #c73b4c;
	color: white;
	font-size: 12px;
	height: 20px;
	position: absolute;
	width: 100vw;
	padding: 2px 5px;

	will-change: transform;
}

#takeprofit {
	background: #7eb741;
	color: white;
	font-size: 12px;
	height: 20px;
	position: absolute;
	width: 100vw;
	padding: 2px 5px;

	will-change: transform;
}

#entry {
	position: absolute;
	height: 1px;
	width: 100vw;
	border-bottom: 1px dashed #aaa;
	will-change: transform;
}

#order {
	width: 120px;
	height: 20px;
	background: url('/assets/player/images/order.png') no-repeat;
	background-size: 120px 20px;
	position: absolute;

	will-change: transform;
}
	
	#profit {
		font-size: 12px;
		font-weight: bold;
		position: absolute;
		top: 2px;
		left: 13px;
	}

		#profit.positive { color: #7eb741; }
		#profit.negative { color: #c73b4c; }

	#lots {
		font-size: 12px;
		font-weight: bold;
		position: absolute;
		color: #fff;
		top: 2px;
		left: 72px;
	}

.trade-icon {
	position: absolute;
	width: 14px;
	height: 14px;
	background-image: url('/assets/player/images/trade-icons.png');
	background-size: 14px 56px;
	background-repeat: no-repeat;

	will-change: transform;
}

	.trade-icon.entry.buy {
		background-position: 0 0;
	}

	.trade-icon.entry.sell {
		background-position: 0 -14px;
	}

	.trade-icon.close.profit {
		background-position: 0 -28px;
	}

	.trade-icon.close.loss {
		background-position: 0 -42px;
	}

.row {
	display: flex;
}

.col {
	flex: 1;
}

.loading {
	background: url('/assets/player/images/loading.gif') no-repeat;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 32px;
	height: 32px;
	margin-left: -16px;
	margin-top: -16px;
	z-index: 1000;
	opacity: 0.5;
}

.btn-recenter {
	position: absolute;
	z-index: 100;
	top: 5px;
	right: 5px;
	opacity: 0;
	transition: opacity 0.5s ease;
	border-color: var(--buttons);
	color: var(--buttons);
	background: white;
}

.btn-mute {
	position: absolute;
	z-index: 100;
	bottom: 5px;
	right: 5px;
	border: 0;
}

	.btn-mute:hover {
		background: #eee;
	}

.playAnimation {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -64px;
	margin-top: -64px;
	z-index: 1000;
}
	.playAnimation svg {
		animation: expand .5s ease;
	}

@keyframes expand {
	from {  }
	to { transform: scale(3); opacity: 0; }
}

@media (max-height: 480px) {
	text.news-label {
		font-size: 10px;
	}
}

@media (max-width: 480px) {

}.drawer {
	background: #fff;
	border-top: 1px solid #eee;
	position: absolute;
	left: 0;
	right: 0;
	z-index: 100;
	height: 150px;

	transition: bottom ease .3s;
}

.drawer.closed {
	bottom: -50px;
}

.drawer.open {
	bottom: 105px;
}

.drawer-body {
	padding: 10px;
}

.drawer-body .ui-lots,
.drawer-body .ui-speed {
	max-width: none;
}

.drawer-body .ui-speed {
	margin: 20px -5px 0 -5px;
}

.drawer-body .ui-lots {
	margin-right: 0;
	margin-left: 0;
}

.replay .drawer { display: none; }.ts-theme {
  --primary: #264CBF;
  --alternate: #ffffff;
  --border: #264CBF;
  --buttons: #264CBF;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .ts-theme .logo {
    width: 80px;
    background: url("/assets/images/logo-sm.png");
    background-size: 80px 20px; }
  .ts-theme #metadata {
    color: #264CBF; }
  .ts-theme #header {
    background: #264CBF; }
  .ts-theme #header .btn {
    border-color: #ffffff;
    color: #ffffff; }
  .ts-theme .btn-recenter {
    border-color: #264CBF;
    color: #264CBF; }
  .ts-theme #trades {
    border-color: #264CBF; }
  .ts-theme .ui-speed .btn svg use {
    fill: #264CBF; }
  .ts-theme path.start-day {
    stroke: #264CBF; }
  .ts-theme .ui-speed .btn.active {
    border-color: #264CBF; }
  .ts-theme .handle {
    background: #264CBF; }
  .ts-theme #mdl {
    border-color: #264CBF; }
  .ts-theme #mdl h2 {
    color: #264CBF; }
  .ts-theme #mdl svg use {
    fill: #264CBF; }
  .ts-theme #btn-control {
    fill: #264CBF;
    stroke: #264CBF; }

.forexboat-theme {
  --primary: #354145;
  --alternate: #ffffff;
  --border: #df5246;
  --buttons: #df5246;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .forexboat-theme .logo {
    width: 101px;
    background: url("/assets/player/logos/forexboat.png");
    background-size: 101px 20px; }
  .forexboat-theme #metadata {
    color: #df5246; }
  .forexboat-theme #header {
    background: #354145; }
  .forexboat-theme #header .btn {
    border-color: #ffffff;
    color: #ffffff; }
  .forexboat-theme .btn-recenter {
    border-color: #df5246;
    color: #df5246; }
  .forexboat-theme #trades {
    border-color: #df5246; }
  .forexboat-theme .ui-speed .btn svg use {
    fill: #df5246; }
  .forexboat-theme path.start-day {
    stroke: #df5246; }
  .forexboat-theme .ui-speed .btn.active {
    border-color: #df5246; }
  .forexboat-theme .handle {
    background: #df5246; }
  .forexboat-theme #mdl {
    border-color: #354145; }
  .forexboat-theme #mdl h2 {
    color: #df5246; }
  .forexboat-theme #mdl svg use {
    fill: #df5246; }
  .forexboat-theme #btn-control {
    fill: #df5246;
    stroke: #df5246; }

.urbanforex-theme {
  --primary: #e0e4e6;
  --alternate: #2b6475;
  --border: #2b6475;
  --buttons: #2b6475;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .urbanforex-theme .logo {
    width: 71px;
    background: url("/assets/player/logos/urbanforex.png");
    background-size: 71px 20px; }
  .urbanforex-theme #metadata {
    color: #2b6475; }
  .urbanforex-theme #header {
    background: #e0e4e6; }
  .urbanforex-theme #header .btn {
    border-color: #2b6475;
    color: #2b6475; }
  .urbanforex-theme .btn-recenter {
    border-color: #2b6475;
    color: #2b6475; }
  .urbanforex-theme #trades {
    border-color: #2b6475; }
  .urbanforex-theme .ui-speed .btn svg use {
    fill: #2b6475; }
  .urbanforex-theme path.start-day {
    stroke: #2b6475; }
  .urbanforex-theme .ui-speed .btn.active {
    border-color: #2b6475; }
  .urbanforex-theme .handle {
    background: #2b6475; }
  .urbanforex-theme #mdl {
    border-color: #e0e4e6; }
  .urbanforex-theme #mdl h2 {
    color: #2b6475; }
  .urbanforex-theme #mdl svg use {
    fill: #2b6475; }
  .urbanforex-theme #btn-control {
    fill: #2b6475;
    stroke: #2b6475; }

.btmm-theme {
  --primary: #f5f5f5;
  --alternate: #1872bb;
  --border: #f14e24;
  --buttons: #1872bb;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .btmm-theme .logo {
    width: 43px;
    background: url("/assets/player/logos/bttm.png");
    background-size: 43px 20px; }
  .btmm-theme #metadata {
    color: #f14e24; }
  .btmm-theme #header {
    background: #f5f5f5; }
  .btmm-theme #header .btn {
    border-color: #26aae2;
    color: #26aae2; }
  .btmm-theme .btn-recenter {
    border-color: #26aae2;
    color: #26aae2; }
  .btmm-theme #trades {
    border-color: #f14e24; }
  .btmm-theme .ui-speed .btn svg use {
    fill: #26aae2; }
  .btmm-theme path.start-day {
    stroke: #26aae2; }
  .btmm-theme .ui-speed .btn.active {
    border-color: #26aae2; }
  .btmm-theme .handle {
    background: #26aae2; }
  .btmm-theme #mdl {
    border-color: #f5f5f5; }
  .btmm-theme #mdl h2 {
    color: #f14e24; }
  .btmm-theme #mdl svg use {
    fill: #26aae2; }
  .btmm-theme #btn-control {
    fill: #26aae2;
    stroke: #26aae2; }

.learntotrade-theme {
  --primary: #f5f5f5;
  --alternate: #065e87;
  --border: #065e87;
  --buttons: #ed2a59;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .learntotrade-theme .logo {
    width: 78px;
    background: url("/assets/player/logos/learntotrade.png");
    background-size: 78px 20px; }
  .learntotrade-theme #metadata {
    color: #065e87; }
  .learntotrade-theme #header {
    background: #f5f5f5; }
  .learntotrade-theme #header .btn {
    border-color: #065e87;
    color: #065e87; }
  .learntotrade-theme .btn-recenter {
    border-color: #ed2a59;
    color: #ed2a59; }
  .learntotrade-theme #trades {
    border-color: #065e87; }
  .learntotrade-theme .ui-speed .btn svg use {
    fill: #ed2a59; }
  .learntotrade-theme path.start-day {
    stroke: #ed2a59; }
  .learntotrade-theme .ui-speed .btn.active {
    border-color: #ed2a59; }
  .learntotrade-theme .handle {
    background: #ed2a59; }
  .learntotrade-theme #mdl {
    border-color: #f5f5f5; }
  .learntotrade-theme #mdl h2 {
    color: #065e87; }
  .learntotrade-theme #mdl svg use {
    fill: #ed2a59; }
  .learntotrade-theme #btn-control {
    fill: #ed2a59;
    stroke: #ed2a59; }

.forexsignals-theme {
  --primary: #404345;
  --alternate: #fff;
  --border: #2693d2;
  --buttons: #05af4c;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .forexsignals-theme .logo {
    width: 156px;
    background: url("/assets/player/logos/forexsignals.png");
    background-size: 156px 20px; }
  .forexsignals-theme #metadata {
    color: #2693d2; }
  .forexsignals-theme #header {
    background: #404345; }
  .forexsignals-theme #header .btn {
    border-color: #fff;
    color: #fff; }
  .forexsignals-theme .btn-recenter {
    border-color: #05af4c;
    color: #05af4c; }
  .forexsignals-theme #trades {
    border-color: #2693d2; }
  .forexsignals-theme .ui-speed .btn svg use {
    fill: #05af4c; }
  .forexsignals-theme path.start-day {
    stroke: #05af4c; }
  .forexsignals-theme .ui-speed .btn.active {
    border-color: #05af4c; }
  .forexsignals-theme .handle {
    background: #05af4c; }
  .forexsignals-theme #mdl {
    border-color: #404345; }
  .forexsignals-theme #mdl h2 {
    color: #2693d2; }
  .forexsignals-theme #mdl svg use {
    fill: #05af4c; }
  .forexsignals-theme #btn-control {
    fill: #05af4c;
    stroke: #05af4c; }

.globalprime-theme {
  --primary: #f5f5f5;
  --alternate: #ff9600;
  --border: #ff9600;
  --buttons: #2aa9e0;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .globalprime-theme .logo {
    width: 45px;
    background: url("/assets/player/logos/globalprime.png");
    background-size: 45px 20px; }
  .globalprime-theme #metadata {
    color: #ff9600; }
  .globalprime-theme #header {
    background: #f5f5f5; }
  .globalprime-theme #header .btn {
    border-color: #ff9600;
    color: #ff9600; }
  .globalprime-theme .btn-recenter {
    border-color: #2aa9e0;
    color: #2aa9e0; }
  .globalprime-theme #trades {
    border-color: #ff9600; }
  .globalprime-theme .ui-speed .btn svg use {
    fill: #2aa9e0; }
  .globalprime-theme path.start-day {
    stroke: #2aa9e0; }
  .globalprime-theme .ui-speed .btn.active {
    border-color: #2aa9e0; }
  .globalprime-theme .handle {
    background: #2aa9e0; }
  .globalprime-theme #mdl {
    border-color: #f5f5f5; }
  .globalprime-theme #mdl h2 {
    color: #ff9600; }
  .globalprime-theme #mdl svg use {
    fill: #2aa9e0; }
  .globalprime-theme #btn-control {
    fill: #2aa9e0;
    stroke: #2aa9e0; }

.wetalktrade-theme {
  --primary: #f5f5f5;
  --alternate: #403f3f;
  --border: #403f3f;
  --buttons: #e8554e;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .wetalktrade-theme .logo {
    width: 37px;
    background: url("/assets/player/logos/wetalktrade.png");
    background-size: 37px 20px; }
  .wetalktrade-theme #metadata {
    color: #403f3f; }
  .wetalktrade-theme #header {
    background: #f5f5f5; }
  .wetalktrade-theme #header .btn {
    border-color: #403f3f;
    color: #403f3f; }
  .wetalktrade-theme .btn-recenter {
    border-color: #e8554e;
    color: #e8554e; }
  .wetalktrade-theme #trades {
    border-color: #403f3f; }
  .wetalktrade-theme .ui-speed .btn svg use {
    fill: #e8554e; }
  .wetalktrade-theme path.start-day {
    stroke: #e8554e; }
  .wetalktrade-theme .ui-speed .btn.active {
    border-color: #e8554e; }
  .wetalktrade-theme .handle {
    background: #e8554e; }
  .wetalktrade-theme #mdl {
    border-color: #f5f5f5; }
  .wetalktrade-theme #mdl h2 {
    color: #403f3f; }
  .wetalktrade-theme #mdl svg use {
    fill: #e8554e; }
  .wetalktrade-theme #btn-control {
    fill: #e8554e;
    stroke: #e8554e; }

.piranhaprofits-theme {
  --primary: #495d73;
  --alternate: #ffffff;
  --border: #8a7446;
  --buttons: #495d73;
  /*.ui-granularity .btn {
		color: $buttons;
	}*/ }
  .piranhaprofits-theme .logo {
    width: 48px;
    background: url("/assets/player/logos/piranhaprofits.png");
    background-size: 48px 20px; }
  .piranhaprofits-theme #metadata {
    color: #8a7446; }
  .piranhaprofits-theme #header {
    background: #495d73; }
  .piranhaprofits-theme #header .btn {
    border-color: #ffffff;
    color: #ffffff; }
  .piranhaprofits-theme .btn-recenter {
    border-color: #495d73;
    color: #495d73; }
  .piranhaprofits-theme #trades {
    border-color: #8a7446; }
  .piranhaprofits-theme .ui-speed .btn svg use {
    fill: #495d73; }
  .piranhaprofits-theme path.start-day {
    stroke: #495d73; }
  .piranhaprofits-theme .ui-speed .btn.active {
    border-color: #495d73; }
  .piranhaprofits-theme .handle {
    background: #495d73; }
  .piranhaprofits-theme #mdl {
    border-color: #495d73; }
  .piranhaprofits-theme #mdl h2 {
    color: #8a7446; }
  .piranhaprofits-theme #mdl svg use {
    fill: #495d73; }
  .piranhaprofits-theme #btn-control {
    fill: #495d73;
    stroke: #495d73; }