.icon-phone, 
.icon-email, 
.icon-clock, 
.icon-logo-mark,
.icon-lock,
.icon-spyglass,
.icon-facebook,
.icon-twitter,
.icon-instagram,
.icon-linkedin,
.icon-youtube,
.icon-srjc-app {
	--size: 1.375rem;
	display: inline-block;
	min-width: var(--size);
	min-height: var(--size);
  position: relative;
}

:where(.icon-phone, .icon-email, .icon-clock)::before,
:where(.icon-phone, .icon-email, .icon-clock)::after {
	content: "";
  position: absolute;
}

:where(.icon-phone, .icon-email, .icon-clock)::before {
	background-color: var(--srjc-red);
  border-radius: 50%;
  height: var(--size);
  width: var(--size);
}

.light:where(.icon-phone, .icon-email, .icon-clock)::before {
	background-color: #fff;
}

:where(.icon-phone, .icon-email, .icon-clock)::after {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 55%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0.75rem;
}

.icon-phone::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.5 13.5'%3E%3Cpath fill='none' stroke='%23002654' stroke-width='1.5px' d='m3.85.75h-1.83c-.7,0-1.26.57-1.26,1.26,0,5.93,4.81,10.74,10.74,10.74.7,0,1.26-.57,1.26-1.26v-1.83c0-.55-.33-1.04-.84-1.24l-1.76-.7c-.45-.18-.97-.1-1.35.21l-.45.38c-.53.44-1.31.41-1.8-.08l-1.28-1.28c-.49-.49-.52-1.27-.08-1.8l.38-.45c.31-.38.4-.89.21-1.35l-.7-1.76c-.2-.51-.69-.84-1.24-.84Z'/%3E%3C/svg%3E");
}

:where(.icon-phone, .icon-email, .icon-clock):not(.light)::after {
	filter: brightness(0) invert(1);
}

.icon-email::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.5 11.1' fill='none'%3E%3Cpath stroke='%23002654' stroke-width='1.5px' d='m1.95.75h9.6c.66,0,1.2.54,1.2,1.2v7.2c0,.66-.54,1.2-1.2,1.2H1.95c-.66,0-1.2-.54-1.2-1.2V1.95c0-.66.54-1.2,1.2-1.2Z'/%3E%3Cpath stroke='%23002654' stroke-width='1.5px' d='m12.5,1.96l-5.75,4.2L.99,1.96'/%3E%3C/svg%3E");
}

.icon-clock::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.5 13.5'%3E%3Cpath fill='none' stroke='%23002654' stroke-width='1.5px' d='m6.75,3.42v3.33h3.33m2.67,0c0,3.31-2.69,6-6,6S.75,10.06.75,6.75,3.44.75,6.75.75s6,2.69,6,6Z'/%3E%3C/svg%3E");
}


.icon-logo-mark {
	--size: 4rem;
}

.icon-lock,.icon-spyglass {
	--size: 1.75rem;
}

.icon-facebook,.icon-twitter,.icon-instagram,.icon-linkedin,.icon-youtube {
	--size: 2rem;
}

:where(.icon-logo-mark,.icon-lock,.icon-spyglass,.icon-facebook,.icon-twitter,.icon-instagram,.icon-linkedin,.icon-youtube,.icon-srjc-app)::before {
	background-position: 50% 50%;
	background-size: contain;
	content:"";
	display: inline-block;
	height: var(--size);
	width: var(--size);
}

.icon-logo-mark::before {
	background-image: url('/assets/icons.svg#logo-mark');
}

.icon-lock::before {
	background-image: url('/assets/icons.svg#lock');
}

.icon-spyglass::before {
	background-image: url('/assets/icons.svg#spyglass');
}

.icon-facebook::before {
	background-image: url('/assets/icons.svg#facebook');
}

.icon-twitter::before {
	background-image: url('/assets/icons.svg#twitter');
}

.icon-instagram::before {
	background-image: url('/assets/icons.svg#instagram');
}

.icon-linkedin::before {
	background-image: url('/assets/icons.svg#linkedin');
}

.icon-youtube::before {
	background-image: url('/assets/icons.svg#youtube');
}

.icon-srjc-app::before {
	background-image: url('/assets/icons.svg#srjc-app');
}