@charset "UTF-8";

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/Roboto-Light.ttf');
}

:root {
  --main-color: #0088AE;
  --secondary-color: #FFDA00;
  --dark-grey: #979797;
  --light-grey: #EFEFEF;
  --red: #b30000;
  --green: #00802b;
  --btn-color: #f4a100;
  --btn-color-light: #f1be31;
  --btn-color-dark: #cc8800;
  --btn-menu-light: #FFFBE0;
  --btn-menu-dark: #FFF6BE;
}

.main-color {
	color: var(--main-color) !important;
}

.bg-main-color {
	background: var(--main-color) !important;
}

.secondary-color {
	color: var(--secondary-color) !important;
}

.background-light-grey {
	background: var(--light-grey) !important;
}

.background-white {
	background: white !important;
}



.main-button {
	font-size: 16px;
	padding: 5px 7px;
	border-radius: 5px;
	cursor: pointer;
	color: black;
	background-color:var(--btn-color);
	border: 1px solid var(--btn-color);
}

.main-button:hover {
	color: black;
	background-color: var(--btn-color-light);
}

.main-button:active, .main-button-inverted:active, .login-button:active {
	transform: translateY(1px);
	box-shadow: 0 5px var(--light-grey);
}

.main-button:disabled {
	cursor: default;
	background: var(--dark-grey);
	border: 1px solid var(--dark-grey);
}

.main-button-inverted {
	font-size: 16px;
	padding: 5px 7px;
	border-radius: 5px;
	cursor: pointer;
	color: var(--btn-color-dark);
	background-color: white;
	border: 1px solid var(--btn-color-dark);
}

.login-button {
	font-size: 16px;
	padding: 5px 7px;
	border-radius: 5px;
	cursor: pointer;
	color:var(--main-color);
	background-color:var(--secondary-color);
	border: 1px solid var(--main-color);
	font-weight: bold;
}

.cs-title {
	color: var(--main-color);
	flex-wrap: unset !important;
	width: max-content;
}

.cs-title .underlined {
	border-bottom: 4px solid var(--secondary-color);
}


a {
	cursor: pointer;
	color: var(--main-color);
}
a.nav-link {
	color:black;
}

.nav-link.active {
	font-weight: bold !important;
}

.server-response {
	background-color: white;
	padding: 6px;
}
.server-response.error{
	color: var(--red);
}

.server-response.success{
	color: var(--green);
}

.img-overlay {
    position: absolute;
    bottom: 0;
}

.cal-menu {
	margin-left: -15px;
	margin-right: -15px;
}

.cal-menu .nav-link{
	color: white;
}


.menu-btn {
	font-size: 18px;
	padding: 5px 5px;
	border-radius: 5px;
	cursor: pointer;
	color: var(--main-color);
	background-color:var(--btn-menu-light);
	border: 1px solid var(--btn-menu-dark);
	text-align: center;
}

.menu-btn:active {
	transform: translateY(1px);
	box-shadow: 0 5px var(--light-grey);
}

.menu-btn:hover {
	background-color: var(--btn-menu-dark);
}

.menu-btn svg{
	height: 50%;
	width: 50%;
	fill: var(--main-color);
	margin: 0px 10px;
}

.menu-btn .title{
	
}
