@import url('https://fonts.googleapis.com/css?family=PT+Sans');
@import url('https://fonts.googleapis.com/css?family=Patua+One');

/* Cards */

.sl_cards{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:20px;
	margin:10px 0;
}

.sl_card{
	position:relative;
	display:flex;
	align-items:flex-end;
	aspect-ratio:2 / 1;
	border-radius:8px;
	overflow:hidden;
	text-decoration:none;

	font-family:'PT Sans',sans-serif;

	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% auto;

	border:1px solid #ddd;
}

.sepi_sec_head + .sl_cards,
#most_view_tlt + .gen_center_bx .sl_cards{
margin-top:25px;
margin-bottom:50px;
}

.sl_card.patri{
	background-image:url("img/bgCustom/bgSuccession_600.gif");
}

.sl_card.guide{
	background-image:url("img/bgCustom/bgGuide_plain_600.jpg");
}

.sl_card.library{
	background-image:url("img/bgCustom/bgLibrary_02_plain_600.jpg");
}

.sl_card.video{
	background-image:url('img/bgCustom/bgVideo02_plain_600.jpg');
}

.sl_card.blog{
	background-image:url('img/bgCustom/bgBlog_plain_600.jpg');
}


/* Transparent overlay shown only on hover */
.sl_card:before{
	content:"";
	position:absolute;
	inset:0;
	background:rgba(80,80,80,.30);
	opacity:0;
	transition:opacity .2s;
	pointer-events:none;
}

.sl_card:hover:before{
	opacity:1;
}

.sl_card_txt{
	position:relative;
	z-index:1;
	width:100%;
	box-sizing:border-box;
	padding: clamp(10px, calc(-18px + 4vw), 18px);
	color:#fff;
}

.sl_card_tlt{
	font-family:'Patua One',serif;
	font-size: clamp(18px, calc(-3px + 3vw), 27px);
	font-weight:normal;
	line-height:1.15;
	margin-bottom:6px;

	color:#182c85;
	background:rgba(255,255,255,.7);
	padding:3px 7px;
	border-radius:5px;
	border:1px solid #ddd;
}

.sl_card_sub{
	font-family:'PT Sans',sans-serif;
	font-size: clamp(11px, calc(-3px + 2vw), 15px);
	line-height:1.3;

	color:#182c85;
	background:rgba(255,255,255,.7);
	padding:4px 7px;
	border-radius:5px;
	border:1px solid #ddd;
}

@media only screen and (max-width:700px){

	.sl_cards{
		grid-template-columns:1fr;
		gap:15px;
	}

	.sl_card_txt{
		/* 18px at 500px, 10px at 350px */
		padding: clamp(10px, calc(-8.67px + 5.33vw), 18px);
	}

	.sl_card_tlt{
		/* 27px at 600px, 18px at 350px */
		font-size: clamp(18px, calc(5.4px + 3.6vw), 27px);
	}

	.sl_card_sub{
		/* 15px at 500px, 11px at 350px */
		font-size: clamp(11px, calc(1.67px + 2.67vw), 15px);
	}
}

/******************************************************************************************************/



/** sepi section TITLE */

.sepi_sec_head{
	margin:42px 0 24px;
	text-align:center;
}

.sepi_sec_head:first-child{
	margin-top:10px;
}

.sepi_sec_tlt{
	margin:0;
	padding:0;

	font-family:'Patua One',serif;
	font-size:26px;
	font-weight:normal;
	line-height:1.25;
	color:#182c85;
	text-align:center;
}

.sepi_sec_tlt:after{
	content:"";
	display:block;
	width:100px;
	height:1px;
	margin:6px auto 0;
	background:#b8c9db;
}

.sepi_sec_sub{
	margin:6px auto 0;

	font-family:'PT Sans',sans-serif;
	font-size:17px;
	line-height:1.35;
	color:#777;
	text-align:center;
}

.sepi_sec_head + #srv_grp_lst{
	padding-top:0;
}

@media only screen and (max-width:700px),
only screen and (max-device-width:700px){

	.sepi_sec_head{
		margin:34px 0 20px;
		padding:0 15px;
	}

	.sepi_sec_tlt{
		font-size:23px;
	}

	.sepi_sec_tlt:after{
		width:40px;
		height:3px;
		margin-top:9px;
	}

	.sepi_sec_sub{
		margin-top:9px;
		font-size:15px;
		line-height:1.35;
	}
}