/* ---- FRONT-END ---- */
#brx-links-wrapper #brx-links-border-top-wrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-left-container {
	display: flex;
	flex-direction: row;
	flex-basis: 50%;
	flex: 0 0 50%;
	height: 100px;
	border-radius: 0 100px 0 0;
}

#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-right-container {
	display: flex;
	flex-direction: row;
	flex-basis: 50%;
	flex: 0 0 50%;
	height: 100px;
	border-radius: 100px 0 0 0;
}



#brx-links-wrapper .brx-links-container #brx-links-content-wrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	border-radius: 30px;
	background-color: #FFFFFF;
	overflow: hidden;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container {
	position: relative;
	display: flex;
	flex-direction: column;
	flex-basis: 50%;
	flex: 0 0 50%;
	aspect-ratio: 80 / 100; 
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper {
	display: flex;
	flex-direction: column;
	flex-basis: 50%;
	flex: 0 0 50%;
	padding: 80px 100px 80px 60px;
	justify-content: center;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-basis: 100%;
	align-items: center;
	height: 80px;
	border-bottom: 1px solid #F0F0F0;
	font-size: var(--font-size-28);
	font-weight: 600;
	color: #1E1E4B;
	padding-left: 20px;
	transition: all .3s ease-in-out;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper .brx-links-content-all-links-single-item-content-container:first-of-type a {
	border-top: 1px solid #F0F0F0;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:hover,
#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:focus {
	background-color: #1E1E4B05;
	transition: all .3s ease-in-out;
}

#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a::after {
	position: absolute;
	right: 20px;
	content: '';
	height: 100%;
	width: 25px;
	background-image: url('images/Tetra - Bricks - Blue link icon.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 25px;
}





@media( max-width: 767px ) {
	#brx-links-wrapper .brx-links-container {
		padding: 35px 0!important;
	}
	
			#brx-links-wrapper #brx-links-border-top-wrapper {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
			}

	#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-left-container {
		display: flex;
		flex-direction: row;
		flex-basis: 50%;
		flex: 0 0 50%;
		height: 50px;
		border-radius: 0 50px 0 0;
	}

	#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-right-container {
		display: flex;
		flex-direction: row;
		flex-basis: 50%;
		flex: 0 0 50%;
		height: 50px;
		border-radius: 50px 0 0 0;
	}



			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				border-radius: 30px;
				background-color: #FFFFFF;
				overflow: hidden;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container {
		position: relative;
		display: flex;
		flex-direction: column;
		flex-basis: 100%;
		flex: 0 0 100%;
		aspect-ratio: 80 / 100; 
	}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container img {
				position: absolute;
				top: 0;
				left: 0;
				height: 100%;
				width: 100%;
				object-fit: cover;
				object-position: center;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper {
		display: flex;
		flex-direction: column;
		flex-basis: 100%;
		flex: 0 0 100%;
		padding: 30px;
		justify-content: center;
	}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a {
		position: relative;
		display: flex;
		flex-direction: row;
		flex-basis: 100%;
		align-items: center;
		height: 60px;
		border-bottom: 1px solid #F0F0F0;
		font-size: var(--font-size-24);
		font-weight: 600;
		color: #1E1E4B;
		padding-left: 20px;
		transition: all .3s ease-in-out;
	}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper .brx-links-content-all-links-single-item-content-container:first-of-type a {
				border-top: 1px solid #F0F0F0;
			}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:hover,
			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:focus {
				background-color: #1E1E4B05;
				transition: all .3s ease-in-out;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a::after {
		position: absolute;
		right: 20px;
		content: '';
		height: 100%;
		width: 25px;
		background-image: url('images/Tetra - Bricks - Blue link icon.svg');
		background-position: right center;
		background-repeat: no-repeat;
		background-size: 15px;
	}
}
				

@media only screen
  and (min-width: 768px) 
  and (max-width: 1200px) 
  and (orientation: portrait) {
	  #brx-links-wrapper .brx-links-container {
		padding: 35px 0!important;
	}
	
			#brx-links-wrapper #brx-links-border-top-wrapper {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
			}

	#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-left-container {
		display: flex;
		flex-direction: row;
		flex-basis: 50%;
		flex: 0 0 50%;
		height: 50px;
		border-radius: 0 50px 0 0;
	}

	#brx-links-wrapper #brx-links-border-top-wrapper .brx-links-border-top-right-container {
		display: flex;
		flex-direction: row;
		flex-basis: 50%;
		flex: 0 0 50%;
		height: 50px;
		border-radius: 50px 0 0 0;
	}



			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper {
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				border-radius: 30px;
				background-color: #FFFFFF;
				overflow: hidden;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container {
		position: relative;
		display: flex;
		flex-direction: column;
		flex-basis: 100%;
		flex: 0 0 100%;
		aspect-ratio: 80 / 100; 
	}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper .brx-links-image-container img {
				position: absolute;
				top: 0;
				left: 0;
				height: 100%;
				width: 100%;
				object-fit: cover;
				object-position: center;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper {
		display: flex;
		flex-direction: column;
		flex-basis: 100%;
		flex: 0 0 100%;
		padding: 30px;
		justify-content: center;
	}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a {
		position: relative;
		display: flex;
		flex-direction: row;
		flex-basis: 100%;
		align-items: center;
		height: 60px;
		border-bottom: 1px solid #F0F0F0;
		font-size: var(--font-size-24);
		font-weight: 600;
		color: #1E1E4B;
		padding-left: 20px;
		transition: all .3s ease-in-out;
	}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper .brx-links-content-all-links-single-item-content-container:first-of-type a {
				border-top: 1px solid #F0F0F0;
			}

			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:hover,
			#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a:focus {
				background-color: #1E1E4B05;
				transition: all .3s ease-in-out;
			}

	#brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper a::after {
		position: absolute;
		right: 20px;
		content: '';
		height: 100%;
		width: 25px;
		background-image: url('images/Tetra - Bricks - Blue link icon.svg');
		background-position: right center;
		background-repeat: no-repeat;
		background-size: 15px;
	}
}



@media only screen
  and (min-width: 768px) 
  and (max-width: 1200px) 
  and (orientation: landscape) {
	  #brx-links-wrapper .brx-links-container #brx-links-content-wrapper #brx-links-content-all-links-wrapper {
		  padding: 50px 50px 50px 50px;
	  }
}