/*

csa-expert.ru

SMALL ELEMENTS - CSS
03/14/2026

*/

/* small elements - heading graphic element */

.item--csa-graph-el {
	position: relative;
	display: flex;
	flex-flow: row wrap;
}
.item--csa-graph-el > .i {
	flex: 0 0 20%;
	aspect-ratio: 1;
}
.item--csa-graph-el > .i.c {
	background-color: red;
}

/* small elements - socials block */

.cmp--socials {}
.cmp--socials > div {
	display: flex;
	flex-flow: row wrap;
	justify-content: end;
	gap: 10px;
}
.cmp--socials > div > a {}
.cmp--socials.small > div > a > div {
	width:26px;
	height:26px;
	border-radius: 26px;	
}
.cmp--socials.large > div > a > div {
	width:40px;
	height:40px;
	border-radius: 40px;	
}
.cmp--socials > div > a > div {
	background-color: #fff;
	transition: .2s
}
.cmp--socials > div > a > div {}
.cmp--socials > div > a:hover > div {
	opacity: .6;
	transform: scale(.95);
}

.cmp--socials {}
.cmp--socials > .wrapper {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: right;
}
.cmp--socials > .wrapper > a {}
.cmp--socials > .wrapper > a > div {}
.cmp--socials > .wrapper > a > div > img {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}

.cmp--socials.small > .wrapper {
	gap: 4px;
}
.cmp--socials.small > .wrapper > a > div {
	width: 30px;
	height: 30px;
}
.cmp--socials.small > .wrapper > a > div > img {
	border-radius: 35px;
}