a {
	color:inherit !important;
}

.atlasknop {
	margin-top:1vw;
}

.box {
	position:relative;
	padding: 22%; 
	/* border-radius: 2vw; */ 
	transition: transform 0.3s ease-in-out; 
	/* margin-bottom: 0.3vw; */
	color:#000000;
	float: left;
	border: 0.1vw solid #ccc;
	background: #f5f3f2;
	width:100%;
}

.box > .disabled {
	display:block;
	opacity:0.5;
	z-index:3;
	cursor:not-allowed;
	top:0vw;
	bottom:0vw;
	left:-0.2vw;
	right:0vw;
	/* padding:3.9vw; */
	/* border-radius:1vw; */
	height:103%;
	position:absolute !important;
}

.box.active {
	background:#ffffff;
	border: 0.1vw solid #0d6efd;
}

.box.buttons {
    background: #0d6efd !important;
    transition: none !important;
    border: 1px solid #000 !important;
    color: #fff !important;
    font-weight: 600;
    padding-bottom: 0px !important;
    width: 100%;
    padding-top: 2vw;
	border-bottom:1px solid black;
}

.box.buttons:hover {
    border-bottom: 0.2vw solid black !important;
    border-right: 0.2vw solid black !important;
    transition: none !important;
    transform: none !important;
    margin-bottom: 0.895vw !important;
}

.box.active > .disabled {
	display:none;
}

.box.active > .innerContent {
	background: #ffffff;
	color: #000;
}

.box.buttons > .innerContent {
	background: #0d6efd;
	color: #fff;
}

.factsheetslink:hover {
	background:#0d6efd !important;
	color:#ffffff !important;
}

.box.active:hover, .box.buttons:hover {
	transform: scale(1.05); 
	background:#0d6efd;
	border:0.1vw solid black;
}

.box.active:hover > .innerContent, .box.buttons:hover > .innerContent{
	cursor:pointer;
	color:#ffffff;
	background: #0d6efd;
}

.box.active:hover > .innerContent > .atlaslink > .tileText > .tileTextTitle {
	color:#fff !important;
	border-color:#fff !important;
}

.box.active:hover > .innerContent > .atlaslink > .tileText > .tileTextSubtitle {
	color:#fff !important;
}

.box:hover > .innerContent > div > a {
	color:#ffffff;
	text-decoration:none;
}

.box.active.webapp {
	/*border: 0.1vw solid red;*/
	padding:28% !important;
}

.box.active.webapp.mobile {
	padding:1vw !important;
}

.box.active.webapp:hover {
	transform: scale(1.05); 
	/*background:red;*/
	border:0.1vw solid black;
}

.box.active.webapp:hover > .innerContent > .atlaslink > div > .icoon {
	color:#ffffff !important;
}

.box.active.webapp:hover > .innerContent {
	cursor:pointer;
	color:#0d6efd;
	/* background: red; */
}

#buttons {
    color: #000;
    padding-top: 1vw;
}

#geonavigator {
    color: #000;
    font-size: 0.55vw;
}

#buttonInfo, #buttonResetFilters {
    cursor:pointer;
	font-weight: 600;
    position: absolute;
    bottom: 0.5vw;
    right: 0.5vw;
    z-index: 1;
    border: 0px;
    margin: 0.5vw;
    width: 2vw;
    text-decoration: none;
    padding-bottom: 0px;
    height: 2vw;
    color: #0d6efd !important;
}

#closeInfo {
    font-weight: 600;
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 99999999;
    border: 0px;
    margin: 0.5vw;
    width: 2vw;
    text-decoration: none;
    padding-bottom: 0px;
    height: 2vw;
    color: #000 !important;
}

#buttonInfo.activeInfo {
	text-decoration: none !important;
    box-shadow: none;
	color: #000 !important;
}

#buttonInfo.activeInfo:hover {
	cursor:auto;
	box-shadow: none;
}

#buttonInfo:hover, #buttonResetFilters:hover {
	text-decoration: none !important;
    box-shadow: 5px 6px 7px -3px #000;
	cursor:pointer;
}

#closeInfo:hover {
	cursor:pointer;
	color:#0d6efd !important;
	text-decoration: none !important;
}

#buttonInfo:active, #closeInfo:active, #buttonResetFilters:active {
	color: #000 !important;
	/* box-shadow: none; */
	box-shadow: 5px 6px 7px -3px #000;
}

#filterbuttonsTitle {
	top:0.4vw !important;
}

#filterbuttons, #filterbuttonsTitle {
    position: relative;
    color: #000;
    font-size: 0.5vw;
    /* display: inline-block; */
    overflow-y: auto;
	padding-left:0.5vw;
	padding-right:0.5vw;
	top:0.85vw;
	margin-bottom:0.25vw;
}

.filterbutton {
	opacity:0.5;
	font-weight:600;
	padding-top:0px;
	/* background:#0d6efd; */
	/* background:#f5f3f2; */
	background:#fff;
	margin-right:-0.3vw;
	margin-bottom:-0.1vw;
}

.filterbutton:hover {
	opacity:0.5;
	background:#0d6efd !important;
}

.filterbutton:active, .filterbutton.activeFilterButton {
	opacity:1.0;
	background:#0d6efd;
	color:#fff;
}

.filterbutton.activeFilterButton:hover {
	opacity:0.5;
	/* background:#f5f3f2; */
	background:#fff;
}

@media screen and (max-width: 1199px) {
	.background {
		height:210vw !important;
	}

	.box {
		padding:15%;
	}
	
	.icoon {
		min-height:14vw !important;
		max-height:14vw !important;
	}
}

h1 {
	font-size:2vw !important;
	margin-bottom:1vw;
}

.h5, h5 {
	font-size:0.55vw !important;
	word-wrap:break-word;
	word-break:break-word;
	white-space:pre-wrap;
	line-height:1.6;
}

h5.h5mobile {
	font-size:2.5vw !important;
	word-wrap:break-word;
	word-break:break-word;
	white-space:pre-wrap;
	min-height:41px;
}

svg.deletefilter {
    width: 0.75vw;
    height: 0.75vw;
    top: 0.2vw;
    position: relative;
	color:transparent;
}

svg.deletefilter.deletefilteractive {
	color:#fff;
}

.innerContent {
	position: absolute;
	left: 0vw;
	right: 0vw;
	top: 0vw;
	bottom: 0vw;
	background: #f5f3f2;
	/* color:#757575; */
	color:#bbb;
	padding: 1vw;
	font-size: 1vw;
	/* border-radius:2vw; */
}

.background {
	background-color: #fff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	width: inherit;
	/* height: 36.5vw; */
	height: 28.5vw;
	border-radius: 10px;
	padding: 0.1vw;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5px;
	margin-bottom: 5px;
	opacity: 0.6;
	position: absolute;
	z-index: -1;
}
  
.buttonicon {
    margin-right: 0.5vw;
    margin-top: 0vw;
    min-height: 1vw;
    min-width: 1vw;
    float: left;
}  

.generalButton {
    text-decoration: none;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 2.25vw;
    width: 100%;
    padding-top: 1vw;
    padding-left: 1vw;
}

.generalButton:hover {
	text-decoration: none !important;
}

.icoon {
	max-width: 76%;
	min-height: 3vw;
	max-height: 5vw;
	height: auto;
	color:inherit;
	margin-top:1vw;
}  

.link {
  cursor:inherit; 
  color:inherit; 
  text-decoration:none; 
  font-family: var(--fontsBaseFamily),Avenir Next;  
}
  
.row { 
	display: flex; 
	flex-wrap: wrap; 
} 
  
.tile {
	/* 
	width:170px;
	height: 190px;
	*/
	
	width:23%;
	height:36%;
	background: #ffffff; 
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); 
	padding: 8px; 
	border-radius: 10px; 
	transition: transform 0.3s ease-in-out; 
	margin: 5px 5px 5px 5px;
	color:#000000;
	border: 2.5px solid #A3BACD;
	float: left;
} 
  
.tilePictogram, .tilePictogramIconBox {
    text-align: center;
    height: 100%;
    padding: 0px;
    background: #ffebcd;
    border-right: 0px solid #126cbf;
}

.tilePictogramIconBox {
	/* background: #00b4ff; */
}

.tilePictogramLogo, .tilePictogramLogoMobile{
	position: relative;
    height: 82%;
    bottom: 0px;
    margin-top: 10%;
    max-height: 85%;
    margin-bottom: auto;
}

.tilePictogramLogoMobile {
    max-height: 11vh !important;
}

.tilePictogramIcon {
    max-height: 50%;
	top: 1vw;
	position:relative;
	padding:0.5vw;
}

.tileText {
    text-align: center;
    padding-left: 0.5vw;
    padding-top: 0.5vw;
    font-family: Segoe UI;	
	overflow-x: hidden;
}

.tileTextTitle {
	font-weight: 700;
    text-align: left;
    width: auto;
    margin-right: 3vw;
    padding-bottom: 0.5vw;
    border-bottom: 5px solid #126cbf;
    color: #126cbf;
    font-size: 1.33vw;
    font-family: Segoe UI;
}

.tileTextSubtitle {
    font-weight: 100;
    text-align: left;
    width: 95%;
    margin-right: 2vw;
    padding-bottom: 0.5vw;
    color: #000;
    font-size: 0.75vw;	
}

.tile:hover {
	transform: scale(1.05); 
	cursor:pointer;
	color:#ffffff;
	background: #0d6efd;
}

.tile:hover > div > a > .icoon{
	transform: inherit;
	cursor:pointer;
	color:#ffffff;
}

.tile:hover > div > a {
	text-decoration:none;
	transform: inherit;
	cursor:pointer;
	color:#ffffff;
}

.tile:active {
	border-bottom:2px solid black;
	text-decoration:none;
}

.tile:active > div > a {
	text-decoration:none;
}

.tiles-container { 
	display: block; 
	top: 2%;
	position:relative;
	margin-left:8%;
	color: #fff;
}