/* CUSTOM DBASE CSS */

/* COLOR LEGEND
 * Blue:  #083b6e
 * Green: #40a249
 */

/* -- CARDS -- */
/* card header */
.card-header-dbase-custom {
	/*background: linear-gradient(60deg, #ab47bc, #8e24aa);*/
	box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(8, 59, 110, 0.46);
	color:#ffffff;
	border-radius: 3px;
	margin-top: -20px;
	padding: 15px;
}
.card .card-header-primary .card-icon,
.card .card-header-primary .card-text,
.card .card-header-primary:not(.card-header-icon):not(.card-header-text),
.card.bg-primary,
.card.card-rotate.bg-primary .front,
.card.card-rotate.bg-primary .back,
.card-header-dbase-custom {
  /*background: linear-gradient(60deg, #ab47bc, #8e24aa);*/
  background: linear-gradient(60deg, #083b6e, #07294a);
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(8, 59, 110, 0.46);
}

/* -- BUTTONS -- */
.btn.btn-primary {
	color: #fff;
	background-color: #083b6e;
	border-color: #083b6e;
	box-shadow: 0 2px 2px 0 rgba(8, 59, 110, 0.14), 0 3px 1px -2px rgba(8, 59, 110, 0.2), 0 1px 5px 0 rgba(8, 59, 110, 0.12);
}
.btn.btn-primary:hover {
	color: #fff;
	background-color: #40a249;
	border-color: #40a249;
	box-shadow: 0 2px 2px 0 rgba(8, 59, 110, 0.14), 0 3px 1px -2px rgba(8, 59, 110, 0.2), 0 1px 5px 0 rgba(8, 59, 110, 0.12);
}

/* -- SIDEBAR -- */
/* menu items */
.sidebar[data-color="blue"] li.active>a {
	background-color: #083b6e;
	border-color: #083b6e;
	box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(8, 59, 110, 0.46);
}
/* display account man in sidebar, only when mobile view (hide on bigger screens) */
@media (min-width:992px) {
	li#accountlogin {display:none;}
}

/* BOUNCING DOWN ARROW ANIMATION */
/*Source: https://techstacker.com/how-to-animate-a-bouncing-svg-icon-with-css/yXrdnAk8PB8gkvRbe/ */


.bounce-container {
	display: flex;
	height: 100vh;
}

.bounce-container-footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: auto auto 1rem auto;
}

.bounce-text-label {
	text-transform: uppercase;
	font-family: helvetica;
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	color: #fff;
}

.arrow-circle-down {
	display: block;
	width: 40px;
	height: 40px;
	margin: 16px 0;
	/*fill: #fff;*/
}

.bounce {
	-webkit-animation: bounce 2s;
	        animation: bounce 2s;
	-webkit-animation-iteration-count: infinite;
	        animation-iteration-count: infinite;
}

@-webkit-keyframes bounce {
	0%,
	25%,
	50%,
	75%,
	100% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	40% {
		-webkit-transform: translateY(-20px);
		        transform: translateY(-20px);
	}
	60% {
		-webkit-transform: translateY(-12px);
		        transform: translateY(-12px);
	}
}

@keyframes bounce {
	0%,
	25%,
	50%,
	75%,
	100% {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
	40% {
		-webkit-transform: translateY(-5px);
		        transform: translateY(-5px);
	}
	60% {
		-webkit-transform: translateY(-3px);
		        transform: translateY(-3px);
	}
}