/* Copyright RTrack/ Luke Shadwell 2019 */

body {
	font-family: 'Hind Siliguri', sans-serif;
    background-color: rgb(50, 50, 50);
    overflow-x: hidden;
}

h1 {
	font-family: 'Hind Siliguri', sans-serif;
    color: #fff;
    font-weight:700
}

.h3 {
	font-weight:500;
}

.h5 {
	font-weight:500;
}

.dropdown-menu-left {
    left: 0;
    right: auto;
}

.text-purp {
	color: #BB33FF;
}

p {
	font-family: 'Hind Siliguri', sans-serif;
    font: 15px;
    color: #FFFFFF;
    font-weight:200
}

.btn {
    font: 15px;
    color: #fff
}

.container-fluid .padded {
    padding-right: 6vw;
    padding-left: 6vw;
}

@media screen and (max-width: 992px) {
	.rtrack-logo {
    	width:20vw !important;
	}
	.realtimeCollated, .generalgraph, .gamepass {
    	min-width: 100% !important;
        min-height: 25vw !important;
    	flex: 0 0 100% !important;
    	max-width:100% !important;
  	}
	.tab-pane {
    	margin-left:1vw !important;
    	margin-right:1vw !important;
	}
    h1, h2 {
    	font-size: 4rem;
    }
	button {
    	font-size:2rem;
	}
}

.global {
	font-size:50vw;
}

.rtrack-logo {
	width:6vw;
}

.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}

.hide {
	display:none
}

.ForceHide {
	display:none
}

.bg-black {
    background-color: black !important;
}

.bg-dark {
    background-color: rgb(40, 40, 40) !important;
}

.bg-secondary {
    background-color: rgb(30, 30, 30) !important;
}

.text-dark {
    color: black !important;
}

.text-rtrack {
    color: #DC6509;
}

.gradient-seperator {
    padding: 1rem;
    position: relative;
    background: radial-gradient(#EE7074, #dc3545);
    padding: 3px;
}

.border-3 {
    border-width: 3px !important;
    border-style: solid;
}

.landing-chart {
    padding-top: 10%;
}

.landing-top-block {
    background: radial-gradient(#1A1A1A, black);
}

9 .bg-rtrack {
    background-color: #DC6509;
}

.bg-rtrackcream {
    background-color: #F6EDCE;
}

.bg-upgrade {
    background-color: black
}

.text-upgrade {
    color: white;
}

.footer {
    background: linear-gradient(to bottom right, #3b3530 0%, #171412 100%);
}

.row {
    margin-right: -15px;
    margin-left: -15px;
}

.navbar {
    background: linear-gradient(to bottom right, #3b3530 0%, #171412 100%);
    border-bottom: 3px solid rgb(26, 26, 26);
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 0rem;
    padding-top:0rem
}

.navbar-nav {
    padding-left: 1rem;
}

.nav-item {
    padding-left: 1rem;
    height: 60%;
    width: auto;
}

.nav-link {
    color: #ffff;
    font-size: 1.2rem;
}

.header {
    font-size: 1.2rem;
    /*padding-top: 0.5rem; */
}

.nav-link:hover {
    color: #c73235;
}

.form-inline {
    height: 30%;
}

.panel {
    text-align: center;
    color: white;
}

.panel:hover {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0), 0 1px 5px rgba(200, 200, 200, 0.35);
}

.panel-body {
    padding: 0px;
    background: linear-gradient(to bottom right, #383838 0%, #141414 100%);
    text-align: center;
}

.the-price {
    background-color: rgb(30, 30, 30);
    box-shadow: 0 1px 0 #dcdcdc, inset 0 1px 0 #fff;
    color: white;
    padding: 20px;
    margin: 0;
}

.the-price h1 {
    color: white;
    line-height: 1em;
    font-weight: 800;
    padding: 0;
    margin: 0;
}

.text-purple {
	color: #573ba3;
}

.text-pink {
	color: #FF21EA;
}

.Count {
	margin-bottom: 0rem !important;
}

.general-time-selector:hover {
	background-color: #dc3545;
}

.general-time-selector.active {
	background-color: #dc3545;
}

.time-selector:hover {
	background-color: #dc3545;
}

.time-selector.active {
	background-color: #dc3545;
}

.red {
	background-color: #dc3545;
}

.rowoverlay{
  position: relative;
  top: -25vw;
  text-align:center;
  z-index:1;
  bottom:0;
}

.backgroundblur {
	filter: blur(8px);
  -webkit-filter: blur(8px);
}

.heavyBlur {
	filter: blur(20px);
  -webkit-filter: blur(20px);
}

.gradientbutton {
	background: linear-gradient(to bottom right, #FF750A 0%, #c73235 100%);
}

.Count.Pro {
    background: linear-gradient(to bottom right, #FF750A 0%, #c73235 100%);
}

.Count.Basic {
    background: linear-gradient(to bottom right, #4DF4FF 0%, #3579DF 100%);
}

.Count.Complete {
    background: linear-gradient(to bottom right, #FF6464 0%, #C31919 100%);
}

.Count.Orange {
    background: linear-gradient(to bottom right, #DC6509 0%, #c73235 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.Count.Green {
    background: linear-gradient(to top right, #1cc41a 0%, #8bb839 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.Count.Blue {
    background: linear-gradient(to bottom right, #FF750A 0%, #E63A3C 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.Count.Red {
    background: linear-gradient(to top, #e6eb88 0%, #c8cf3e 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.Count.White {
    background: linear-gradient(to top, #1a7aa3 0%, #8c1aa3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.panel-title {
    font-weight: 450;
}

.subscript {
    color: white;
    font-size: 25px;
}

.text-player-sub {
    color: white;
}

.upgradeTable {
    color: white;
    font-weight: 400;
    font-size: 18;
}

/* CSS-only ribbon styles    */
.cnrflash {
    /*Position correctly within container*/
    position: absolute;
    top: -9px;
    right: 4px;
    z-index: 1;
    /*Set overflow to hidden, to mask inner square*/
    overflow: hidden;
    /*Set size and add subtle rounding  		to soften edges*/
    width: 100px;
    height: 100px;
    border-radius: 3px 5px 3px 0;
}

.cnrflash-inner {
    /*Set position, make larger then 			container and rotate 45 degrees*/
    position: absolute;
    bottom: 0;
    right: 0;
    width: 145px;
    height: 145px;
    -ms-transform: rotate(45deg);
    /* IE 9 */
    -o-transform: rotate(45deg);
    /* Opera */
    -moz-transform: rotate(45deg);
    /* Firefox */
    -webkit-transform: rotate(45deg);
    /* Safari and Chrome */
    -webkit-transform-origin: 100% 100%;
    /*Purely decorative effects to add texture and stuff*/
    /* Safari and Chrome */
    -ms-transform-origin: 100% 100%;
    /* IE 9 */
    -o-transform-origin: 100% 100%;
    /* Opera */
    -moz-transform-origin: 100% 100%;
    /* Firefox */
    background-image: linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .1) 50%), linear-gradient(0deg, transparent 0%, rgba(1, 1, 1, .2) 50%);
    background-size: 4px, auto, auto, auto;
    background-color: #aa0101;
    box-shadow: 0 3px 3px 0 rgba(1, 1, 1, .5), 0 1px 0 0 rgba(1, 1, 1, .5), inset 0 -1px 8px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 0 rgba(255, 255, 255, .2);
}

.cnrflash-inner:before,
.cnrflash-inner:after {
    /*Use the border triangle trick to make  				it look like the ribbon wraps round it's 				container*/
    content: " ";
    display: block;
    position: absolute;
    bottom: -16px;
    width: 0;
    height: 0;
    border: 8px solid #800000;
}

.cnrflash-inner:before {
    left: 1px;
    border-bottom-color: transparent;
    border-right-color: transparent;
}

.cnrflash-inner:after {
    right: 0;
    border-bottom-color: transparent;
    border-left-color: transparent;
}

.cnrflash-label {
    /*Make the label look nice*/
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    padding-bottom: 5px;
    color: #fff;
    text-shadow: 0 1px 1px rgba(1, 1, 1, .8);
    font-size: 0.95em;
    font-weight: bold;
    text-align: center;
}