/**
 * A copy of these styles is present in the webshop-frontend.css because the USP list is also on the PDP.
 * Please make any changes on this CSS on both places
 */

.at-usps__mainTitle {
	font-size: 1.5em;
	font-weight: normal;
	font-style: italic;
}

.at-usps__list {
	margin: 0;
	padding: 1em;
	list-style: none;
	background-color: #e2ecf3;
}

.at-usps__item {
	position: relative;
	display: block;
}

.at-usps__item:before {
	position: absolute;
	top: 10px;
	left: 0;
	content: '\f06d';
	font-family: "icons";
	font-size: 1.5em;
}

.at-usps__title,
.at-usps__subtitle {
	margin: 0;
	padding-left: 2.5rem;
	font-size: 1em;
	font-weight: 600;
}

.at-usps__subtitle {
	font-size: .9em;
	font-weight: 400;
}

.at-usps__link {
	text-indent: -999em;
}

.at-usps__item--hasLink:hover {
	text-decoration: underline;
}

@media (max-width: 767px) {
	.at-usps__item {
		margin-bottom: 2em;
	}
}

@media (min-width: 568px) {
	.at-usps__item {
		display: inline-block;
		vertical-align: top;
		width: 48%;
	}

	.at-usps__item:nth-child(even) {
		margin-left: 2%;
	}
}

@media (min-width: 768px) {
	/* one item */
	.at-usps__item:nth-child(1):nth-last-child(1) {
		width: 100%;
	}

	/* two items */
	.at-usps__item:nth-child(1):nth-last-child(2),
	.at-usps__item:nth-child(2):nth-last-child(1) {
		width: 48%;
	}

	/* three items */
	.at-usps__item:nth-child(1):nth-last-child(3),
	.at-usps__item:nth-child(2):nth-last-child(2),
	.at-usps__item:nth-child(3):nth-last-child(1) {
		width: 31.3333%;
	}

	/* four items */
	.at-usps__item:nth-child(1):nth-last-child(4),
	.at-usps__item:nth-child(2):nth-last-child(3),
	.at-usps__item:nth-child(3):nth-last-child(2),
	.at-usps__item:nth-child(4):nth-last-child(1) {
		width: 23%;
	}

	.at-usps__item + .at-usps__item {
		margin-left: 2%;
	}
}