/*** 1. THEME TWEAKS ***/

/* Site Wrapper */
.site-wrapper {
	width: 100%;
	max-width: 1920px;
	margin-inline: auto;
	background-color: #fff;
}

p:last-child:last-of-type {
 margin-bottom: 0;
}

/* Set the main content area height */
/*#main {
 min-height: 100vh;
}*/

/***
*
*
* 2. UTILITIES
*
*
* ***/

/* Visually Hidden - hide object visually but show object if needed for SEO etc.*/ 
visually-hidden:not(:focus):not(:active){
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowarp;
	width: 1px;
}

/* Line Limits - for a card max lines etc. */
.line-limit-3, .line-limit-2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow:hidden;
}
.line-limit-3 {
	-webkit-line-clamp: 3;
}
.line-limit-2 {
	-webkit-line-clamp: 2;
}

/* Transistion */
.transition {
	transition: all 0.25s ease-in-out;
}
/* Fade in */
.fade-in {
  animation: fadein 2s ease;
}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* -- GP MENU ACCESSIBILTY TWEAK */
/* Shows sub menu when hover. */
/*
#site-navigation ul.sub-menu {
	display:block;
}
#site-navigation li:hover .gp-icon svg {
	transform: rotate(180deg);
}
#site-navigation li:hover .sub-menu {
	visibility: visable;
}*/

/* Aspect Ratios */
.ar-16-9, .ar-9-16, .ar-4-3 {
	object-fit:cover;
}
.ar-16-9 {
	aspect-ratio: 16/9;
}
.ar-9-16 {
	aspect-ratio: 9/16;
}
.ar-4-3 {
	aspect-ratio: 4/3;
}
.ar-1-1 {
	aspect-ratio: 1/1;
}

/* No Underline */
.no-ul .no-ul a {
	text-decoration: none !important;
}
/* Make link look its unclickable */
.unclickable > a:hover {
       cursor: default !important;
}
/* Set container and image as background image instead of css background image - better for SEO */
.image-background {
	position: relative;
	isolation: isolate;
	
	& img:first-of-type {
		position: absolute;
		inset:0;
		z-index: -1;
		width: 100%;
		height: 100%;
	}
}
/* Make sure you only have ONE link inside your card */ 
.stretch-link{
	position: relative;
}
.stretch-link a::after{
	content: '';
	position: absolute;
	inset: 0;
}
.stretch-link a:is(:focus-visible)::after{
	outline: 2px solid;
}
.stretch-link a:is(:hover, :focus){
	outline: none;
}