.rounded {
	border-radius: 5px;
}

.centered {
	display: block;
	margin: auto;
}

.relative {
	position: relative;
}

.navbar-brand {
	margin-left: 0;
}

.navbar-default {
  /* Set the background color to a gradient */
	background-image: linear-gradient(to bottom, #2D3034, #34373C);
}

.navbar-collapse {
    padding-right: 30px;
}

.navbar-toggle .icon-bar {
  background-color: #fff;
}

.navbar-header {
	padding-left: 40px;
}

.navbar-bright {
  color: #aeb3b8;
  font-family: 'Rajdhani', serif;
  letter-spacing: 0.05em;
}

.collapsed {
  color: white;
}

.dropdown-menu {
  color: white;
  background-color: #514259;
}

.dropdown-menu>li>a {
  color: white;
}

.nav>li>a:focus, .nav>li>a:hover, .nav.open>a:hover, .nav.open>a:focus, .nav .open>a {
  background-color: #514259;
}

.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
  background-color: #514259;
}

.a:focus, a:hover {
  color: white;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: #26282F;
    color: #e4e5e7 ;
    display: inline-block; /* Display the list items as inline-block elements */
    font-weight: bold;
}

/* Increase the font size for larger screens */
@media (min-width: 1440px) {
    .navbar-default .navbar-nav > li > a,
    .navbar-default .navbar-nav > li > a:hover,
    .navbar-default .navbar-nav > li > a:focus {
        font-size: 20px;
    }
}

.navbar-default .navbar-nav > li > a {
    padding-top: 32px;
    padding-bottom: 0px;
    color: #ff00ff;
    color: whitesmoke ;
    display: inline-block; /* Display the list items as inline-block elements */
}

.nav-link {
  color: #ff00ff;
}

.panel-default>.panel-heading {
  background-color: #2c4c5a;
}

.panel-body {
  background-color: #222227;
}

.panel-transparent {
  background: none;
}

.panel-transparent .panel-heading {
  background: none;
  padding: 0px 0px;
}

.panel-transparent .panel-body {
  background: rgba(46, 51, 56, 0.2)!important;
}

.panel-title {
  color: #FFFFFF;
}

.te-btn {
  text-align: left;
  border-radius: 0;
  font-family: 'Rajdhani', sans-serif;
  font-size: 10pt;
  font-weight: 900;
}

.btn:focus {
    outline: none;
}

.te-btn:focus {
  outline: none;
}

.te-small-device-text {
  text-align: left;
  border-radius: 0;
  font-family: 'Rajdhani', sans-serif;
  font-size: 8pt;
  font-weight: 900;
}

.te-device-description {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  border-radius: 0;
  font-family: 'Rajdhani', sans-serif;
  font-size: 11pt;
  font-weight: 900;
  color: white;
}

.device-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-transform: uppercase;
}


.te-label {
  font-family: 'Rajdhani', sans-serif;
  background-color: #aba491;
  color: white;
}

.te-panel {
    padding-left: -17.5px;
}

label {
  color:whitesmoke;
}

.red-block {
  background-color: red;
  height: 100%;
  width: 10%;
  display: inline-block;
  vertical-align: top;
}

.streaming-status {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid white;
  padding: 5px 5px;
  line-height: 1.2;
}


.te-button-group {
    display: inline-flex;
    justify-content: flex-end;
    margin-bottom: 10px;
    width: 100%;
    border: solid #393b42;
    border-width: 1px;
}

.te-button-group button:first-child {
    margin-right: -5px;
}

.te-button-group button:last-child {
    margin-left: 0;
    width: 100%;
    opacity: 0.5;
}

.te-active-back {
    background-color: #26282f;
    color: #d8d9dc;
}

.te-active-back:hover {
    color: white;
}

.te-inactive-back {
    background-color: #1b1b20;
    color: #d8d9dc;
}

.te-inactive-back:hover {
    color: #d8d9dc;
}

.te-streaming {
  background-color: #aba491;
}

.te-stream-margin {
    margin-left: 10px;
}

.te-footer-margin {
    color: #898a8d;
    margin-left: 38px;
    margin-right: 30px;
    border-top: 1px solid #898a8d;
}

.te-streaming img {
    display: block;
}

.te-streaming:hover img {
    content: url("/static/images/CLOSE_v2.png")
}


.te-transparent {
  background-color: transparent;
}

.navbar-brand .diamond {
  width: 3px;
  height: 3px;
  transform: rotate(45deg) translateY(-5px);
  background-color: #aba491;
  margin: 0 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.navbar-brand strong {
  font-weight: 1000;
  color: #b2b2b7; 
}

.navbar-dark {
    font-family: 'Rajdhani', sans-serif;
  color: #b2b2b7;
    padding: 0px;
    padding-left: -29px
}

.navbar-nav {
    font-family: 'Rajdhani', sans-serif;
  color: white !important;
}

.custom-bar {
    height: 4px; /* Maximum thickness of the bar */
    background: linear-gradient(to right, #aeb3b8 50%, transparent 50%, transparent),
    linear-gradient(to bottom, #aeb3b8 50%, transparent 50%, transparent);
    margin-top: 0px;
    margin-bottom: 5px;
}

.custom-bar::after {
    content: ""; /* Empty content for the pseudo-element */
    position: absolute; /* Position the pseudo-element absolutely within the custom-bar */
    right: 0; /* Align the pseudo-element to the right edge of the custom-bar */
    top: 0; /* Align the pseudo-element to the top edge of the custom-bar */
    height: 36%; /* Set the height of the pseudo-element to match the height of the custom-bar */
    width: 10px; /* Set the width of the pseudo-element (you can adjust this value) */
    background: url('/static/images/arrow_divider.png') no-repeat center center; /* Set the background image */
    background-size: contain; /* Scale the background image to fit within the pseudo-element */
}

h5.navbar-dark {
    margin-top: 0;
}

.margin-sm {
	margin: 5px !important;
}
.margin-md {
	margin: 10px !important;
}
.margin-xl {
	margin: 20px !important;
}
.margin-bottom-sm {
	margin-bottom: 5px !important;
}
.margin-bottom-md {
	margin-bottom: 10px !important;
}
.margin-bottom-xl {
	margin-bottom: 20px !important;
}

.divider {
	width: 100%;
	text-align: center;
}

.divider hr {
	margin-left: auto;
	margin-right: auto;
	width: 45%;
}

.fa-2 {
	font-size: 2em !important;
}
.fa-3 {
	font-size: 4em !important;
}
.fa-4 {
	font-size: 7em !important;
}
.fa-5 {
	font-size: 12em !important;
}
.fa-6 {
	font-size: 20em !important;
}

div.no-video-container {
	position: relative;
}

.no-video-icon {
	width: 100%;
	height: 240px;
	text-align: center;
}

.no-video-text {
	text-align: center;
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	font-size: 24px;
}

.meetecho-logo {
	padding: 12px !important;
}

.meetecho-logo > img {
	height: 26px;
}

.spacer {
  padding-top: 80px;
  padding-bottom: 40px;
}

.btn-primary {
  background-color: #1b1b20;
  border-color: #1b1b20;
  // color: #dedfe3;
  color: white;
}

.btn-primary:focus {
    background-color: transparent;
}

.btn-primary:hover {
    background-color: #1b1b20;
    border-color: #1b1b20;
}

.btn-success {
  background-color: #2c4c5a;
  border-color: #2c4c5a;
    color:white;
}

.btn-success:hover {
  background-color: #406f83;
  border-color: #406f83;
}

.btn-success img {
    display: block;
}

.btn-success:hover img {
    content: url("/static/images/PLAY_rollover_v2.png")
}

.btn-success:focus {
    background-color: #2c4c5a;
    border-color: #2c4c5a;
}

.divider-item:not(:last-child):after {
    content: '|';
    margin: 0 5px; /* Adjust spacing around the divider */
    color: #4a4e43; /* Adjust the color of the divider */
}

body {
  /* background-image: url("/static/images/TELINK_clean_dark.png"); */
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  font-family: 'Rajdhani', serif !important;
  /* background-color: #202125; */
  /* Set the background color to a gradient */
	background-image: linear-gradient(to bottom, #28292E, #2B2D32);
  background-size: cover;
  background-attachment: fixed;
  color: black;
}


input {
  color: black;
}