$flags-images-path: '../../../images/icons' !default;

$countries: (
	EU: 18px,
	AD: 34px,
	AE: 50px,
	AF: 66px,
	AG: 82px,
	AI: 98px,
	AL: 114px,
	AM: 130px,
	AO: 146px,
	AQ: 162px,
	AR: 178px,
	AS: 194px,
	AT: 210px,
	AU: 226px,
	AW: 242px,
	AX: 258px,
	AZ: 274px,
	BA: 290px,
	BB: 306px,
	BD: 322px,
	BE: 338px,
	BF: 354px,
	BG: 370px,
	BH: 386px,
	BI: 402px,
	BJ: 418px,
	BM: 434px,
	BN: 450px,
	BO: 466px,
	BR: 482px,
	BS: 498px,
	BT: 514px,
	BW: 530px,
	BY: 546px,
	BZ: 562px,
	CA: 578px,
	CD: 594px,
	CF: 610px,
	CG: 626px,
	CH: 642px,
	CI: 658px,
	CK: 674px,
	CL: 690px,
	CM: 706px,
	CN: 722px,
	CO: 738px,
	CR: 754px,
	CU: 770px,
	CV: 786px,
	CY: 802px,
	CZ: 818px,
	DE: 834px,
	DJ: 850px,
	DK: 866px,
	DM: 882px,
	DO: 898px,
	DZ: 914px,
	EC: 930px,
	EE: 946px,
	EG: 962px,
	EH: 978px,
	ER: 994px,
	ES: 1010px,
	ET: 1026px,
	FI: 1042px,
	FJ: 1058px,
	FM: 1074px,
	FO: 1091px,
	FR: 1106px,
	BL: 3698px,
	// CP: -2848px, // Missing flag.
		MF: 3778px,
	YT: 4018px,
	GA: 1122px,
	GB: 1138px,
	SH: 3890px,
	GD: 1154px,
	GE: 1170px,
	GG: 1186px,
	GH: 1202px,
	GI: 1218px,
	GL: 1234px,
	GM: 1250px,
	GN: 1266px,
	GP: 1282px,
	GQ: 1298px,
	GR: 1314px,
	GT: 1330px,
	GU: 1346px,
	GW: 1362px,
	GY: 1378px,
	HK: 1394px,
	HN: 1410px,
	HR: 1426px,
	HT: 1442px,
	HU: 1458px,
	ID: 1474px,
	MC: 3762px,
	IE: 1490px,
	IL: 1507px,
	IM: 1522px,
	IN: 1538px,
	IQ: 1554px,
	IR: 1570px,
	IS: 1586px,
	IT: 1602px,
	JE: 1618px,
	JM: 1634px,
	JO: 1650px,
	JP: 1666px,
	KE: 1682px,
	KG: 1698px,
	KH: 1714px,
	KI: 1730px,
	KM: 1746px,
	KN: 1762px,
	KP: 1778px,
	KR: 1794px,
	KW: 1810px,
	KY: 1826px,
	KZ: 1842px,
	LA: 1858px,
	LB: 1874px,
	LC: 1890px,
	LI: 1906px,
	LK: 1922px,
	LR: 1938px,
	LS: 1954px,
	LT: 1970px,
	LU: 1986px,
	LV: 2002px,
	LY: 2018px,
	MA: 2034px,
	MD: 2050px,
	ME: 2066px,
	MG: 2082px,
	MH: 2098px,
	MK: 2114px,
	ML: 2130px,
	MM: 2146px,
	MN: 2162px,
	MO: 2178px,
	MQ: 2194px,
	MR: 2210px,
	MS: 2226px,
	MT: 2242px,
	MU: 2258px,
	MV: 2274px,
	MW: 2290px,
	MX: 2306px,
	MY: 2322px,
	MZ: 2338px,
	NA: 2354px,
	NC: 2370px,
	NE: 2386px,
	NG: 2402px,
	NI: 2418px,
	NL: 3826px,
	BQ: 2434px,
	NO: 3842px,
	BV: 2450px,
	// NQ: -5536px, // Missing flag.
		SJ: 3906px,
	NP: 2466px,
	NR: 2482px,
	NZ: 2498px,
	OM: 2514px,
	PA: 2530px,
	PE: 2546px,
	PF: 2562px,
	PG: 2578px,
	PH: 2594px,
	PK: 2610px,
	PL: 2626px,
	PR: 2642px,
	PS: 2658px,
	PT: 2674px,
	PW: 2690px,
	PY: 2706px,
	QA: 2722px,
	RE: 2738px,
	RO: 2754px,
	RS: 2770px,
	RU: 2786px,
	RW: 2802px,
	SA: 2818px,
	SB: 2834px,
	SC: 2850px,
	SD: 2866px,
	SE: 2882px,
	SG: 2898px,
	SI: 2914px,
	SK: 2930px,
	SL: 2946px,
	SM: 2962px,
	SN: 2978px,
	SO: 2994px,
	SR: 3010px,
	ST: 3026px,
	SV: 3042px,
	SY: 3058px,
	SZ: 3074px,
	TC: 3090px,
	TD: 3106px,
	TG: 3122px,
	TH: 3138px,
	TJ: 3154px,
	TL: 3170px,
	TM: 3186px,
	TN: 3202px,
	TO: 3218px,
	TR: 3234px,
	TT: 3250px,
	TV: 3266px,
	TW: 3282px,
	TZ: 3298px,
	UA: 3314px,
	UG: 3330px,
	US: 3346px,
	UY: 3362px,
	UZ: 3378px,
	VA: 3394px,
	VC: 3410px,
	VE: 3426px,
	VG: 3442px,
	VI: 3458px,
	VN: 3474px,
	VU: 3490px,
	WS: 3506px,
	YE: 3522px,
	ZA: 3538px,
	ZM: 3554px,
	ZW: 3570px,
	// ZX: -7808px, // Missing flag.
		CW: 3586px,
	SS: 3602px,
	NU: 3618px,
	AN: 3634px,
	// New flag.
		CC: 3650px,
	// New flag.
		cx: 3666px,
	// New flag.
		FK: 3682px,
	// New flag.
		GF: 3714px,
	// New flag.
		GS: 3730px,
	// New flag.
		IO: 3746px,
	// New flag.
		MP: 3794px,
	// New flag.
		NF: 3810px,
	// New flag.
		PM: 3858px,
	// New flag.
		PN: 3874px,
	// New flag.
		SX: 3922px,
	// New flag.
		TF: 3938px,
	// New flag.
		TK: 3954px,
	// New flag.
		UM: 3970px,
	// New flag.
		WF: 3986px,
	// New flag.
		XK: 4002px,
	// New flag.
);

@include body-class(true) {
	.beehive-flag {
		&:before {
			content: ' ';
			width: 15px;
			height: 11px;
			display: block;
			margin: 0 auto;
			background-color: transparent;
			background-image: url(#{$flags-images-path}/flags.png);
			background-repeat: no-repeat;
			background-size: 17px auto;
			background-position: -1px -2px;

			@media only screen and (-webkit-min-device-pixel-ratio: 1.25),
				only screen and (min--moz-device-pixel-ratio: 1.25),
				only screen and (-o-min-device-pixel-ratio: 1.25/1),
				only screen and (min-device-pixel-ratio: 1.25),
				only screen and (min-resolution: 200dpi),
				only screen and (min-resolution: 1.25dppx),
				only screen and (min-resolution: 192dpi) {
				background-image: url(#{$flags-images-path}/flags@2x.png);
			}
		}

		@each $country, $position in $countries {
			&.beehive-flag-#{$country}:before {
				background-position: -1px -#{$position};
			}
		}

		&:not(.beehive-flag-unframed) {
			width: 24px;
			height: 24px;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: $border-radius;
			background-color: #f7f7f7;
		}
	}
}