/* main tags */
html {
	height: 100%;
}
body {
	/* color: #d6e5ff; */
	color: #000;
	background-color: #C0C0C0;
	/* background-image: url(/common/shared_content/images/bg_flair_dark.jpg); */
	height: 100%;
}
a {
	color: #0a7af2;
	text-decoration: none;
}
a:hover {
	color: #0864c7;
	text-decoration: none;
}
hr {
	border: 3px solid #bfbfbf;
	margin-top: 3px;
	margin-bottom: 3px;
}
input, textarea, select {
	border: 1px solid #fff;
	background-color: #fff;
}
input.ng-touched.ng-invalid, textarea.ng-touched.ng-invalid, select.ng-touched.ng-invalid {
	border: 1px dashed #f20f0f;
	background-color: #ffffcc;
}
input.ng-touched.ng-valid, textarea.ng-touched.ng-valid, select.ng-touched.ng-valid {
	background-color: #d3ffbf;
}
input.ng-invalid-required, textarea.ng-invalid-required, select.ng-invalid-required {
	border: 1px dashed #f20f0f;
}
.input-util-container {
	background-image: url(/images/dark-texture.png);
	border-top: 2px dashed black;
	border-right: 2px dashed black;
	border-bottom: 2px dashed black;
}
label {
	font-weight: bold;
}
/* main tags */

/* header */
.environment {
	font-weight: bold;
	size: 20px;
}
.environment-development {
	color: red;
	border: 2px dashed red;
	border-radius: 4px;
	padding: 4px;
}
.header {
	height: 50px;
	padding-top: 10px;
	padding-bottom: 5px;
	background-image: url(/images/dark-texture.png);
	border-bottom: 2px dashed black;
}
.header-dropdown-menu {
	font-size: 25px;
	background-image: url(/images/dark-texture.png);
	display: block;
	position: absolute;
	z-index: 10;
	max-height: calc(100vh - 100px);
	right: 0px;
	top: 46px;
	border-bottom: 2px dashed black;
	border-left: 2px dashed black;
	border-bottom-left-radius: 10px;
	padding: 10px;
	overflow-y: scroll;
	overflow-x: hidden;
}
.header-dropdown-menu-item {
	padding-right: 5px;
}
.user-name-header {
	color: #000;
	font-size: 15pt;
	font-weight: bold;
}
/* /header */

/* footer */
.scrolling-footer {
	position: fixed;
	bottom: 0px;
	z-index: 9000;
	overflow: hidden;
	padding: 3px;
	/* background-color: #292929; */
	background-image: url(/images/dark-texture.png);
	color: #000;
	border-top: 2px dashed black;
	width: 100%;
}
.footer-size {
	height: 40px;
}
.height-100-header {
	height: calc(100% - 50px);
}
.height-100-footer {
	height: calc(100% - 40px);
}
.height-100-footer-15 {
	height: calc(100% - 40px - 15px);
}
/* /footer */

/* inputs */
::placeholder {
	font-style: italic;
	color: #adadad;
}
:placeholder-shown {} /* for styling the input when placeholder is shown */
/* /inputs */

/* spinner */
.spinner-backdrop {
	display: block;
	position: fixed;
	z-index: 10000;
	bottom: 0px;
	left: 0px;
	right: 0px;
	top: 0px;
	background-color: rgba(0,0,0,0.65);
	backdrop-filter: blur(7px) contrast(60%) grayscale(85%);
	-webkit-backdrop-filter: blur(7px) contrast(60%) grayscale(85%);
}
.spinner-message {
	position: fixed;
	z-index: 10003;
	width: calc(100vw/2);
	top: 0px;
	left: 50%;
	transform: translate(-50%, 0%);
	color: #adadad;
	font-weight: bold;
	text-align: center;
	background-image: url(/images/dark-texture.png);
	border-left: 2px dashed black;
	border-right: 2px dashed black;
	border-bottom: 2px dashed black;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	padding: 10px;
}
.spinner-timer {
	position: fixed;
	z-index: 10003;
	width: 75px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #1bde09;
	font-weight: bold;
	text-align: right;
	/* border: 1px solid yellow; */
}
.spinner-timer:hover {
	color: #15ad07;
}
.spinner-content {
	text-align: center;
	position: fixed;
	z-index: 10002;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/* opacity: 0.75; */
	color: #000;
	font-weight: bold;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: spinner-text-glow 1s ease-in-out infinite alternate;
}
@-webkit-keyframes spinner-text-glow {
  from {
    text-shadow:
			0 0 1px #00fffb,
			0 0 2px #00fffb,
			0 0 3px #00fffb,
			0 0 4px #00fffb,
			0 0 5px #00fffb,
			0 0 6px #00fffb,
			0 0 7px #00fffb
		;
  }
  to {
    text-shadow:
			0 0 2px #d0ff00,
			0 0 3px #d0ff00,
			0 0 4px #d0ff00,
			0 0 5px #d0ff00,
			0 0 6px #d0ff00,
			0 0 7px #d0ff00,
			0 0 8px #d0ff00
		;
  }
}
.spinner-close-button {
	float: right;
	padding-top: 10px;
  padding-right: 20px;
	font-size: 25px;
}
.spinner-icon {
  width: 25vw;
}
/* /spinner */

/* tags */
.tag-cell {
	background-image: url(/images/dark-texture.png);
	border: 1px solid black;
	border-radius: 4px;
	padding: 4px;
	margin-left: 5px;
	margin-top: 15px;
	overflow-x: hidden;
}
.tag-cell:hover {
	color: purple;
}
/* /tags */

/* file input */
.file-drop-box {
	border: 2px dashed gray;
	border-radius: 5px;
	padding: 5px;
	color: gray;
	background-color: rgba(255,255,255,0.075);
}
.file-drop-box-hover {
	border: 2px dashed white;
	color: white;
	background-color: rgba(255,255,255,0.25);
}
/* /file input */

/* random common stuff */
.nowrap {
	white-space: nowrap;
}
.clickable {
	cursor: pointer;
}
.block {
	width: 100%;
}
textarea.block {
	width: 100%;
	height: calc(100vh / 3);
}
.height-100 {
	height: 100%;
}
.width-0 {
	width: 0%;
}
.width-30 {
	width: 30px;
}
.width-60 {
	width: 60px;
}
.width-100 {
	width: 100%;
}
.width-50 {
	width: 50%;
}
table.wide {
	width: 100%;
}
table.padded {
	padding: 2px;
	border-spacing: 5px;
	border-collapse: separate;
}
.float-right {
	float: right;
}
.align-center, .align-middle {
	text-align: center;
}
.align-right {
	text-align: right;
}
.valign-top {
	display: table-cell;
	vertical-align: top;
}
.valign-middle, .valign-center {
	display: table-cell;
	vertical-align: middle;
}
.muted {
	color: #525252;
}
.padding-top-5 {
	padding-top: 5px;
}
.padding-top-10 {
	padding-top: 10px;
}
.padding-top-15 {
	padding-top: 15px;
}
.padding-top-20 {
	padding-top: 20px;
}
.padding-top-25 {
	padding-top: 25px;
}
.padding-top-100 {
	padding-top: 100px;
}
.padding-bottom-15 {
	padding-bottom: 15px;
}
.padding-bottom-100 {
	padding-bottom: 100px;
}
.padding-left-5 {
	padding-left: 5px;
}
.padding-left-10 {
	padding-left: 10px;
}
.padding-left-15 {
	padding-left: 15px;
}
.padding-left-20 {
	padding-left: 20px;
}
.padding-right-5 {
	padding-right: 5px;
}
.padding-right-10 {
	padding-right: 10px;
}
.outline-red {
	border: 1px solid red;
}
.outline-orange {
	border: 1px solid orange;
}
.outline-yellow {
	border: 1px solid yellow;
}
.outline-green {
	border: 1px solid green;
}
.outline-cyan {
	border: 1px solid cyan;
}
.outline-blue {
	border: 1px solid blue;
}
.outline-purple {
	border: 1px solid purple;
}
/* /random common stuff */

/* button colors */
.btn-babyblue {
	background-color: #d6e5ff;
}
.btn-babyblue:hover {
	background-color: #becde6;
}
.btn-green {
	color: white;
	background-color: #1bde09;
}
.btn-green:hover {
	color: white;
	background-color: #15ad07;
}
.btn-gray {
	color: black;
	background-color: #adadad;
}
.btn-gray:hover {
	color: white;
	background-color: #808080;
}
/* /button colors */

/* glyphicon/colors */
.glyphicon-25 {
	font-size: 25px;
}
.glyphicon-babyblue, .text-babyblue {
	color: #d6e5ff;
}
.glyphicon-babyblue:hover, .text-babyblue:hover {
	color: #becde6;
}
.glyphicon-blue, .text-blue {
	color: #0a7af2;
	/* text-shadow: 0px 0px 6px #b38619; */
}
.glyphicon-blue:hover, .text-blue:hover {
	color: #0864c7;
}
.glyphicon-black, .text-black {
	color: #000000;
	/* text-shadow: 0px 0px 7px #244746; */
}
.glyphicon-black:hover, .text-black:hover {
	color: #3b3b3b;
}
.glyphicon-black-blue {
	color: #000000;
	/* text-shadow: 0px 0px 7px #244746; */
}
.glyphicon-black-blue:hover {
	color: #0864c7;
}
.glyphicon-black-yellow {
	color: #000000;
}
.glyphicon-black-yellow:hover {
	color: #bdbd0f;
}
.glyphicon-black-purple {
	color: #000000;
}
.glyphicon-black-purple:hover {
	color: #8205b0;
}
.glyphicon-black-cyan {
	color: #000000;
}
.glyphicon-black-cyan:hover {
	color: #00a8a8;
}
.glyphicon-black-red {
	color: #000000;
}
.glyphicon-black-red:hover {
	color: #bd0f0f;
}
.glyphicon-black-green {
	color: #000000;
}
.glyphicon-black-green:hover {
	color: #15ad07;
}
.glyphicon-black- {
	color: #000000;
}
.glyphicon-black-purple:hover {
	color: #8205b0;
}
.glyphicon-white, .text-white {
	color: #ffffff;
}
.glyphicon-white:hover, .text-white:hover {
	color: #e3e3e3;
}
.glyphicon-gray, .text-gray {
	color: #adadad;
}
.glyphicon-gray:hover, .text-gray:hover {
	color: #808080;
}
.glyphicon-red, .text-red {
	color: #f20f0f;
	/* text-shadow: 0px 0px 4px #62f20f; */
}
.glyphicon-red:hover, .text-red:hover {
	color: #bd0f0f;
}
.glyphicon-orange, .text-orange {
	color: #f2660f;
}
.glyphicon-orange:hover, .text-orange:hover {
	color: #bd580f;
}
.glyphicon-yellow, .text-yellow {
	color: #f2e70f;
}
.glyphicon-yellow:hover, .text-yellow:hover {
	color: #bdbd0f;
}
.glyphicon-green, .text-green {
	color: #1bde09;
	/* text-shadow: 0px 0px 8px #b8078f; */
}
.glyphicon-green:hover, .text-green:hover {
	color: #15ad07;
}
.glyphicon-purple, .text-purple {
	color: #a509de;
}
.glyphicon-purple:hover, .text-purple:hover {
	color: #8205b0;
}
.glyphicon-cyan, .text-cyan {
	color: #00ffff;
}
.glyphicon-cyan:hover, .text-cyan:hover {
	color: #00a8a8;
}
/* /glyphicon/colors */
/* border colors */
.border-orange {
	border: 1px solid orange;
}
/* /border colors */
/* wordle */
.wordle-letter-input {
	width: 25px;
	text-align: center;
}
.wordle-suggested-word {
	padding: 5px;
	margin: 5px;
	border: 1px solid #111;
	border-radius: 3px;
}
.wordle-suggested-word:hover {
	background-color: #333;
}
.wordle-available-letter {
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 9px;
	padding-left: 9px;
	margin: 3px;
	border: 1px solid #111;
	border-radius: 3px;
	font-weight: bold;
}
.wordle-available-letter:hover {
	background-color: #333;
}
/* /wordle */