/* Adding used tailwind shortcuts in case user does not want to use it (relax, it's less than 1kb...) */
.flex{
	display: flex;
}
.flex-1{
	flex: 1 1 0%;
}
.shrink-0{
	flex-shrink: 0;
}
.flex-col{
	flex-direction: column;
}
.flex-col-reverse{
	flex-direction: column-reverse;
}
.justify-between{
	justify-content: space-between;
}
.justify-center{
	justify-content: center;
}
.justify-end{
	justify-content: flex-end;
}
.justify-around{
	justify-content: space-around;
}
.items-start{
	align-items: flex-start;
}
.items-end{
	align-items: flex-end;
}
.items-center{
	align-items: center;
}
.items-baseline{
	align-items: baseline;
}
.items-stretch{
	align-items: stretch;
}
.h-full{
	height: 100%;
}
.truncate{
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.cursor-pointer{
	cursor: pointer;
}
.fixed{
	position: fixed;
}
.absolute{
	position: absolute;
}
.inset-0{
	top: 0;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.overflow-y-auto{
	overflow-y: auto;
}
.inline-block{
	display: inline-block;
}
.h-screen{
	height: 100vh;	
}
.min-h-screen{
	min-height: 100vh;
}
.text-inherit{
	color: inherit;
}
.mb-2{
	margin-bottom: 0.5rem;
}
.mr-1{
	margin-right: 0.25rem;
}

/* Personal shortcuts */
.flex-center{
	display: flex;
	justify-content: center;
	align-items: center;	
}
.vlFlex{
	display: flex;
}
.vlHidden{
	display: none;
}

.bg-primary-light{
	background-color: var(--primary-light);
}

@include media-breakpoint-up(md) {
	.vlAlignCenterMd{
		align-items: center;
	}
}