@font-face {
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	src: local('Rubik Light'), local('Rubik-Light'), url(assets/fonts/Rubik-Light.ttf) format('truetype');
}

@font-face {
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	src: local('Rubik'), local('Rubik-Regular'), url(assets/fonts/Rubik-Regular.ttf) format('truetype');
}

@font-face {
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	src: local('Rubik Medium'), local('Rubik-Medium'), url(assets/fonts/Rubik-Medium.ttf) format('truetype');
}

@font-face {
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 700;
	src: local('Rubik Bold'), local('Rubik-Bold'), url(assets/fonts/Rubik-Bold.ttf) format('truetype');
}

header {
	color: white;
	position: relative;
	text-align: center;
}

.session-header {
	vertical-align: bottom;
	justify-content: space-between;
}

.session-header > .datetime {
	font-weight: 900;
	color: #060b06; /* FIXME not in styleguide */
}

a:hover{
	color: inherit;
}

label {
	color: #707478;
}

.bottom-buttons {
	bottom: 0;
	width: calc(100% - var(--RPxl));
	height: calc(var(--BHxl));
	padding: calc(var(--RPxl) / 2);
	padding-bottom: 0;
	position: fixed;
}

.vlogin input {
	border-bottom: solid 1px rgba(0,0,0,0.08);
	transition: all 250ms ease;
}

.vlogin input:focus {
	border-bottom: solid 1px rgba(0,0,0,0.68);
}

.vlogin > div {
	flex-grow: 1;
}

.vlogin > form {
	max-width: 100%;
	flex-grow: 1;
}

ul{
	list-style-type:none;
	margin: 0;
}

.event-image{ height: 90px; }

.loading-spinner{
	height: 40px;
	width: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -20px -20px 0 0;
}

.ibag {
	background: var(--Cpri) url('assets/images/bag.svg') no-repeat center 37%;
	position: absolute;
	left: 0;
	bottom: calc((var(--Sl) + var(--T) / 2) * -1 + var(--RPxl));
}

.counter-number{
	background-color: rgba(3, 8, 46, 0.07);
	color: var(--Cmidnight);
}

button.big {
	width: 282px;
	height: 58px;
	border-radius: 8px;
	background-color: var(--Cpri);
	color: #FFF;
	margin-left: auto;
	margin-right: auto;
	display: block;
	font-weight: bold;
	text-transform: uppercase;
	text-size: var(--T);
}

button { cursor: pointer }
button:disabled {
	cursor: not-allowed;
	background-color: var(--Cgrey);
}

.search {
	color: var(--Cmidnight);
	height: 45px;
	width: calc(100% - 90px);
	border-radius: 4px !important;
	box-shadow: 0 0 4px 0 rgba(37, 41, 55, 0.31);
	text-indent: 5px;
}

@media screen and (min-width: 960px){
	.event{
		float: left;
		display: inline-block;
		width: calc(50% - var(--S)/2);
	}

	.vlogin {
		align-items: center;
		justify-content: center;
	}

	.vlogin > div {
		flex-grow: 0;
	}
	.vlogin > form {
		margin-top: var(--Sl);
		width: 365px;
		flex-grow: 0;
		border-radius: var(--S);
	}
}

@media screen and (max-width: 640px){
	.header-title{
		font-size: 30px;
	}
}

.t { font-size: 14px; }
.t img { height: 20px; }
.t span { vertical-align: middle; }

table.reports { border-spacing: 0px 1px; ; }
table.reports th { text-align: center; background-color: transparent; }
table.reports td { padding: 8px 4px; border-bottom: solid thin var(--Cxlgrey); }
table.reports td:nth-child(2), table.reports th:nth-child(2) { text-align: left; }
table.reports tr { background-color: white; }

td.min {
	width: 1%;
	white-space: nowrap;
}

img { vertical-align: inherit; }
