* { 
    box-sizing:border-box;}
    html, body {
    margin:0;color-scheme: light;
    }

/* Widths in viewport units */
.w-10 {
width: 10vw;
}
.w-20 {
width: 20vw;
}
.w-30 {
width: 30vw;
}
.w-40 {
width: 40vw;
}
.w-50 {
width: 50vw;
}
.w-60 {
width: 60vw;
}
.w-70 {
width: 70vw;
}
.w-80 {
width: 80vw;
}
.w-90 {
width: 90vw;
}
/*Height in viewports go here*/
.h-0{
height: 0vh;
}
.h-10 {
height: 10vh;
}
.h-20 {
height: 20vh;
}
.h-30 {
height: 30vh;
}
.h-40 {
height: 40vh;
}
.h-50 {
height: 50vh;
}
.h-60 {
height: 60vh;
}
.h-70 {
height: 70vh;
}
.h-80 {
height: 80vh;
}
.h-90 {
height: 90vh;
}
.h-100 {
height: 100vh;
}

.center-in-div {
	display: flex;justify-content: center;align-items: center;
}
.center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.space-around {
	display: flex;justify-content: space-around;align-items: center;
}
.space-btn {
	display: flex;justify-content: space-between;align-items: center;
}
.img-fit-center {
object-fit: cover;object-position: center;
}
.img-fit-contain {
object-fit: contain;object-position: center;
}
.img-fit-top {
object-fit: cover;object-position: top;
}
.absolute {
	position: absolute;
}
.relative {
	position: relative;
}
.sticky {
	position: sticky;
}
.fixed {
	position: fixed;
}
.bottom {
    bottom: 0;
}
.top {
    top: 0;
}
.left{
    left: 0;
}
.right {
    right: 0;
}
/*Background colors*/
.body-bg {
    background-color: #222339;
}
.accent-bg{
    background-color: #1D1E31;
}
.accent2-bg{
    background-color: #2b2b42;
}
.darkgreen-bg {
    background: radial-gradient(circle, rgba(16,50,53,1) 0%, #2b2b42 100%);
}

.trans-input {
   background-color: transparent;border : 1px solid #222339;
}
.transparent-input {
    border:none;
    border-bottom: 1px solid;
    background: transparent;
    outline: none;
    display: flex;
    width: 100%;
}
/*Text colors*/
.text-green{
    color: green;
}
.text-muted2 {
    color: #A9A9CA !important;
}
ul {
    list-style-type: none;
}

.theme-bg { background: -webkit-linear-gradient(to top left, rgba(255, 255, 255, 0.8) 0%, rgb(43, 43, 66) 100%);
    background: linear-gradient(to top left, rgba(255, 255, 255, 0.8) 0%, rgb(43, 43, 66) 50%);
}
.text-ellipsis {
    white-space: nowrap;overflow:hidden;text-overflow: ellipsis;
}
a {
    text-decoration: none;
    color: unset;
}
a:hover {
    text-decoration: none;
    color: unset;
}
.profile-container {
    z-index: 10;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 300px;height: fit-content;border-radius: 20px; top: 70px;background-color: #1D1E30;
}

.profile-container::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 8px;
    border-style: solid;
    border-color: transparent transparent #2b2b42 transparent;
}
.tiny-text {
    font-size: 10px;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}