html, body
{
	height: 100%;
}

.navbar-dark .navbar-toggler-icon,
.navbar-light .navbar-toggler-icon
{
	background-image: none !important;
	width: auto;
	height: auto;
}
.navbar-brand
{
	font-size: 18px !important;
	font-weight: bold;
	text-transform: uppercase;
}
.navbar-brand span
{
	letter-spacing: .15em;
	margin-left: 6px;
}
.card {
	border: 0;
	box-shadow:
  0 2.8px 2.4px -11px rgba(0, 0, 0, 0.017),
  0 6.7px 5.9px -11px rgba(0, 0, 0, 0.024),
  0 12.5px 11px -11px rgba(0, 0, 0, 0.03),
  0 22.3px 19.7px -11px rgba(0, 0, 0, 0.036),
  0 41.8px 36.8px -11px rgba(0, 0, 0, 0.043),
  0 100px 88px -11px rgba(0, 0, 0, 0.06);
}
.card-footer, .card-header {
	background: #fff;
}

.bgLogin, .bgPage{
	position: relative;
}
.bgLogin::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(/images/login-bg.jpg);
	background-size: cover;
	background-position: center center;
	background-attachment: fixed;
}
.bgPageCard{
	overflow: hidden;
}
.bgPageCard > div {
	z-index: 99;
	background: transparent !important;
}
.text-light::placeholder{
	color: #f8f9fa !important;
}

.red{
	color: #f8f9fa;
}

.bgPageCard::before {
	content: "";
	position: absolute;
	top: -10%;
	left: -10%;
	width: 120%;
	height: 120%;
	background-image: url(/images/login-bg.jpg);
	background-size: cover;
	background-position: center center;
	background-attachment: fixed;
	filter: blur(35px);
	opacity: .75;
}

.bgPage::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(/images/login-bg.jpg);
	background-size: cover;
	background-position: center center;
	background-attachment: fixed;
	filter: blur(35px);
	opacity: .15;
}

.btn-gradient {background-image: linear-gradient(45deg, #ff3569 0%, #ff6a2d  51%, #ff3569  100%); border: none !important; z-index: 999;}
.btn-gradient { 
	transition: background 0.5s;
	background-size: 200% auto;
	color: white !important;   
	position: relative;
}

.btn-gradient:hover {
	background-position: right center; /* change the direction of the change here */
	color: #fff;
	text-decoration: none;
}
.btn-gradient::before{
	content: "";
	top: 10px;
	left: 0px;
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: linear-gradient(45deg, #ff3569 0%, #ff6a2d  51%, #ff3569  100%);
	transition: background 0.5s;
	background-size: 200% auto;
	filter: blur(15px);
	transform: scale(95%, 90%);
	z-index: -1;
	opacity: 0.65;
}
.btn-gradient:hover::before {
	background-position: right center; /* change the direction of the change here */
}


.btn-success {background-image: linear-gradient(45deg, #00a780 0%, #56d28f  51%, #00a780  100%); border: none !important; z-index: 999;}
.btn-success { 
	transition: background 0.5s;
	background-size: 200% auto;
	color: white !important;   
	position: relative;
}

.btn-success:hover {
	background-position: right center; /* change the direction of the change here */
	color: #fff;
	text-decoration: none;
}
.btn-success::before{
	content: "";
	top: 10px;
	left: 0px;
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: linear-gradient(45deg, #00a780 0%, #56d28f  51%, #00a780  100%);
	transition: background 0.5s;
	background-size: 200% auto;
	filter: blur(15px);
	transform: scale(95%, 90%);
	z-index: -1;
	opacity: 0.65;
}
.btn-success:hover::before {
	background-position: right center; /* change the direction of the change here */
}
.max-length {
	margin-top: 5px;
    width: 20ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	color: #999999
}

.saved {
	color: #00a780
}
#mainDiv > img
{
  max-width: 1920px;
  width: 100%;
  height: auto;
}