/* Triangle Select */
	
	.triangle-hp-background.triangle-select{
		background: #051C2C;
		color: #FFF;
	}
	
	.triangle-hp-background.triangle-select .triangle-container .triangle-grid div span{
		color: #00C8B3;
	}
	
	.triangle-hp-background.triangle-select .triangle-container .legal{
		color: #FFF;
	}

	.triangle-hp-background.triangle-select .triangle-container .triangle-grid div section a{
		background-color: #FFF;
		color: #222426;
	}
	
	.triangle-hp-background.triangle-select .triangle-container .triangle-grid div section a:hover{
		background-color: #FFFFFFE6;
	}

	.triangle-hp-background.triangle-select .triangle-container .triangle-grid div section a:active{
		background-color: #FFFFFFCC;
	}

	/* Triangle Hp */

	.triangle-hp-background{
		background: #22242605;
		padding: 24px 0 12px;
	}
	
	.triangle-container .triangle-grid{
		display: grid;
		grid-template-columns: 5fr 7fr;
		gap: 24px;
	}

	.triangle-container .triangle-grid section{
		position: relative;
		overflow: hidden;
		cursor: pointer;
	}

	.triangle-container .triangle-grid section:hover img{
		transform: scale(1.03);
	}

	.triangle-container .triangle-grid section img{
		width: 100%;
		transition: all 0.6s;
	}

	.triangle-container .triangle-grid div{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		padding: 24px 0 0;
	}

	.triangle-container .triangle-grid div h3{
		font-size: 22px;
		font-weight: 400;
		line-height: 28px;
		margin: 0;
	}
	
	.triangle-container .triangle-grid div span{
		color: #EE422A;
	}

	.triangle-container .triangle-grid div p{
		font-size: 16px;
		line-height: 24px;
		margin: 8px 0 0;
	}

	.triangle-container .triangle-grid div section{
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 16px;
		flex-wrap: wrap;
		margin: 16px 0 0;
	}

	.triangle-container .triangle-grid div section a{
		padding: 16px 20px;
		background-color: #222426;
		border-radius: 8px;
		font-size: 16px;
		color: #FFF;
		width: fit-content;
		text-decoration: none;
		cursor: pointer;
	}

	.triangle-container .triangle-grid div section a:hover{
		background-color: #222426CC;
	}
	
	.triangle-container .triangle-grid div section a:active{
		background-color: #222426B3;
	}

	.triangle-container .legal{
		font-size: 12px;
		line-height: 16px;
		margin: 12px 0 0;
		color: #22242699;
	}
	
	@media (max-width: 992px){
		.triangle-hp-background{
			padding: 0 0 12px;
		}
		
		.triangle-container .triangle-grid{
			grid-template-columns: repeat(2, 6fr);
			gap: 16px;
		}
		
		.triangle-container .triangle-grid div h3{
			font-size: 20px;
			line-height: 24px;
		}
	}
	
	@media (max-width: 768px){
		.triangle-container .triangle-grid{
			grid-template-columns: 12fr;
		}
		
		.triangle-container .triangle-grid section {
			margin: 0 -16px;
		}
		
		.triangle-container .triangle-grid div{
			padding: 0;
		}
		
	}