body{
	width: 100%;
    height: 100%;
	margin: 0;
	font-size: 15px;
	font-family: "Lato", sans-serif;
	padding-bottom:95px;
}
/************************************************************/
/*				Footer										*/
/************************************************************/
.footer{
	position:fixed;
    bottom:0;
    height:60px;   /* Height of the footer */
	width: 100%;
	color: black;
	text-align: right;
	padding-top: 20px;
	padding-right: 20px;
	font-size: 10px;
	vertical-align: middle;
	background-color: #e9ecef;
	padding-top: 25;
}
div.footer p{
	padding-top: 25;
}

/*
.content {
	text-align : center;
	padding: 20px;
}*/

/************************************************************/
/*					POPUP : DONATE							*/
/************************************************************/


.overlay {
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    background-color: rgb(5,0,0);
    background-color: rgba(5,0,0, 0.9);
    overflow-x: hidden;
    transition: 0.5s;
	text-align: center;
}

.overlay-content {
	max-width: 700px;
    margin: auto;
    position: relative;
    top: 15%;
    text-align: center;
    margin-top: 30px;
	background-color: #D4D4D4;
	padding: 50px 0px;
}

.overlay-message{
	padding: 30px 30px;
	text-align: left;
}

.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;
}

.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}

/************************************************************/
/*					Arrow									*/
/************************************************************/

.gb_arrow {
    border: solid white;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
	margin-left: 10px;
}


.gb_right {
    transform: rotate(-45deg);
	-ms-transform:rotate(45deg);
    -webkit-transform: rotate(-45deg);
}

.gb_left {
    transform: rotate(135deg);
	-ms-transform:rotate(-135deg);
    -webkit-transform: rotate(135deg);
}

.gb_up {
    transform: rotate(-135deg);
	-ms-transform:rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.gb_down {
    transform: rotate(45deg);
	-ms-transform:rotate(45deg);
    -webkit-transform: rotate(45deg);
}

/************************************************************/
/*					Check									*/
/************************************************************/

.gb_check-ok {
	border: solid green;
    border-width: 0px 3px 3px 0px;
    display: inline-block;
    padding: 3px;
	padding-top: 10px;
	margin-left: 10px;
	
    transform: rotate(45deg);
	-ms-transform:rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.gb_check-ko {
	border: solid red;
    border-width: 0px 3px 3px 0px;
    display: inline-block;
    padding: 3px;
	padding-top: 10px;
	margin-left: 10px;
	
    transform: rotate(45deg);
	-ms-transform:rotate(45deg);
    -webkit-transform: rotate(45deg);
}

/************************************************************/
/*					Cross									*/
/************************************************************/

.gb_cross {
	width: 20px;
	height: 20px;
	position: relative;
	display: inline-block;
	transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
}

.gb_cross:before, .cross:after {
	content: "";
	position: absolute;
	~~~~~~z-index: auto;
	background: red;
}

.gb_cross:before {
	left: 20%;
	width: 15%;
	margin-left: 40%;
	height: 100%;
}
.gb_cross:after {
	top: 0%;
	left: 20%;
	height: 15%;
	margin-top: 40%;
	width: 100%;
}

/************************************************************/
/*					Table									*/
/************************************************************/
table{
	border-collapse: collapse; 
	border: 1px solid black;
}
td, th{
	border: 1px solid black;
	padding: 10px;
}


.table-controls {
	margin-bottom: 10px;
	padding: 10px 5px 0 5px;
	background: #fff;
	border-top: 2px solid #dee2e6;
	--border-bottom: 2px solid #dee2e6;
	font-size: 18px;
}

.table-controls input,
.table-controls select,
.table-controls > span {
	margin: 0 5px 10px 5px;
}
.table-controls button{
	margin: 10px 5px 10px 5px;
}

.table-controls input,
.table-controls select {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 4px 10px;
	border: 2px solid #6c757d;
	background: #fafafa;
	outline: none;
}

/************************************************************/
/*					Chart									*/
/************************************************************/
	.axis path,
	.axis line {
		fill: none;
		stroke: #000;
		shape-rendering: crispEdges;
	}

	path.candle {
		stroke: #000000;
	}

	path.candle.body {
		stroke-width: 0;
	}

	path.candle.up {
		fill: #00AA00;
		stroke: #00AA00;
	}

	path.candle.down {
		fill: #FF0000;
		stroke: #FF0000;
	}

	.trendline {
		stroke: blue;
		stroke-width: 0.8;
	}

	.trendline circle {
		stroke-width: 0;
		display: none;
	}

	.mouseover .trendline path {
		stroke-width: 1;
	}

	.mouseover .trendline circle {
		stroke-width: 1;
		display: inline;
	}

	.dragging .trendline {
		stroke: darkblue;
	}

	.interaction path, .interaction circle {
		pointer-events: all;
	}

	.interaction .body {
		cursor: move;
	}

	.interaction .start, .interaction .end {
		cursor: nwse-resize;
	}

	.tooltip{
		position: absolute;
		display: none;
		padding: 5px;
		background: rgba(255,255,255, .9);
	}

	.pane {
		fill: none;
		pointer-events: all;
	}
/************************************************************/
/*					Chart									*/
/************************************************************/
	g.scope-composed-annotation{
		font: 10px sans-serif;
	}
	g.close text{
		color: #000;
		font: 10px sans-serif;
		text-shadow: none;
		opacity:1.0;
	}
	/*
	g.close g text{
		color: #000;
		font: 10px sans-serif;
	}*/
	.bg_chart{
		/*margin: top right bottom left;*/
		margin: 20px 0px 0px 0px;
		--width: 100%;
		background: white;
		font: 10px sans-serif;
		fill: #000;
		overflow:scroll;
	}
	
	.bg_chart_night{
		margin: 20px 0px 0px 0px;
		width: 1200px;
		background: black;
		color: white;
		font: 10px sans-serif;
		fill: #FFF;
		text-align: center;
	}
	
	.bg_chart_gray{
		margin: 20px 0px 0px 0px;
		width: 1200px;
		background: #555555;
		color: white;
		font: 10px sans-serif;
		fill: #000;
		text-align: center;
	}
	
	.bg_chart_night text {
        fill: #FFF;
    }
	
    text.symbol {
        fill: #BBBBBB;
    }

    path {
        fill: none;
        stroke-width: 1;
    }

    path.candle {
        stroke: #000000;
    }

    path.candle.body {
        stroke-width: 0;
    }

    path.candle.up {
        fill: #00AA00;
        stroke: #00AA00;
    }

    path.candle.down {
        fill: #FF0000;
        stroke: #FF0000;
    }

    .close.annotation.up path {
        fill: #00AA00;
    }

    path.volume {
        fill: #DDDDDD;
    }

    .indicator-plot path.line {
        fill: none;
        stroke-width: 1;
    }

    .ma-0 path.line {
        stroke: #1f77b4;
    }

    .ma-1 path.line {
        stroke: #aec7e8;
    }

    .ma-2 path.line {
        stroke: #ff7f0e;
    }
    /*
    button {
        position: absolute;
        right: 110px;
        top: 25px;
    }
    */
    path.macd {
        stroke: #0000AA;
    }

    path.signal {
        stroke: #FF9999;
    }

    path.zero {
        stroke: #BBBBBB;
        stroke-dasharray: 0;
        stroke-opacity: 0.5;
    }

    path.difference {
        fill: #BBBBBB;
        opacity: 0.5;
    }

    path.rsi {
        stroke: #000000;
    }

    path.overbought, path.oversold {
        stroke: #FF9999;
        stroke-dasharray: 5, 5;
    }

    path.middle, path.zero {
        stroke: #BBBBBB;
        stroke-dasharray: 5, 5;
    }

    .analysis path, .analysis circle {
        stroke: blue;
        stroke-width: 0.8;
    }

    .trendline circle {
        stroke-width: 0;
        display: none;
    }

    .mouseover .trendline path {
        stroke-width: 1.2;
    }

    .mouseover .trendline circle {
        stroke-width: 1;
        display: inline;
    }

    .dragging .trendline path, .dragging .trendline circle {
        stroke: darkblue;
    }

    .interaction path, .interaction circle {
        pointer-events: all;
    }

    .interaction .body {
        cursor: move;
    }

    .trendlines .interaction .start, .trendlines .interaction .end {
        cursor: nwse-resize;
    }

    .supstance path {
        stroke-dasharray: 2, 2;
    }

    .supstances .interaction path {
        pointer-events: all;
        cursor: ns-resize;
    }

    .mouseover .supstance path {
        stroke-width: 1.5;
    }

    .dragging .supstance path {
        stroke: darkblue;
    }

    .crosshair {
        cursor: crosshair;
    }

    .crosshair path.wire {
        stroke: #DDDDDD;
        stroke-dasharray: 1, 1;
    }

    .crosshair .axisannotation path {
        fill: #DDDDDD;
    }

    .tradearrow path.tradearrow {
        stroke: none;
    }

    .tradearrow path.buy {
        fill: #0000FF;
    }

    .tradearrow path.sell {
        fill: #9900FF;
    }

    .tradearrow path.highlight {
        fill: none;
        stroke-width: 2;
    }

    .tradearrow path.highlight.buy {
        stroke: #0000FF;
    }

    .tradearrow path.highlight.sell {
        stroke: #9900FF;
    }