#main section.section.section-banner {
	margin: 0;
	padding: 1em 0;
	color: #fff;
	text-align: center;
	font-size: 14px;
	background-color: #0071e3;
}
#main section.section.section-banner p {
	margin: 0;
	padding: 0;
}
#main section.section.section-banner a {
	color: #fff;
}

.section-topics h4 {
	margin-top: 1.6em;
}

.callout {
	margin-top: -4em;
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section .section-content .callout .row {
	margin-top: 1.6em;
}
#main section.section-console .section-content .callout .row {
	margin-top: 0;
}
#main section .section-content .callout .row.headline-row {
	margin-top: 0;
	margin-bottom: 3em;
}

@media only screen and (max-width: 734px) {
	.callout {
		padding-top: 3em;
		padding-bottom: 3em;
	}
	#main section .section-content .callout .row.headline-row {
		margin-bottom: 2em;
	}
}

.device-hero {
	margin-top: 2em;
}

.icon-cloudkit {
	margin-bottom: 1em;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/cloudkit/cloudkit-96x96.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-cloudkit {
		background-image: url("/assets/elements/icons/cloudkit/cloudkit-96x96_2x.png");
	}
}

.icon-console {
	margin-bottom: 1em;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/cloudkit-console/cloudkit-console-96x96.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-console {
		background-image: url("/assets/elements/icons/cloudkit-console/cloudkit-console-96x96_2x.png");
	}
}

.icon-core-ml {
	margin-bottom: 1em;
	width: 96px;
	height: 96px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/core-ml-file/core-ml-file-96x96.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-core-ml {
		background-image: url("/assets/elements/icons/core-ml-file/core-ml-file-96x96_2x.png");
	}
}

.callout-icon {
	float: right;
	margin-right: 1em;
	width: 48px;
	height: 48px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.callout-icon:first-child {
	margin-top: unset;
}
.icon-articles {
	background-image: url("/icloud/images/articles.svg");
}
.icon-dashboard {
	background-image: url("/icloud/images/dashboard.svg");
}
.icon-developer-forums {
	background-image: url("/icloud/images/developer-forums.svg");
}
.icon-videos {
	background-image: url("/icloud/images/videos.svg");
}
.icon-design {
	background-image: url("/assets/elements/icons/wwdr-unified/design-guidelines.svg");
}

.router-icon-service {
	margin-bottom: 1em;
	width: 64px;
	height: 64px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("/assets/elements/icons/wwdr-unified/service.svg");
}

.router-svg {
	margin-bottom: 1em;
	width: 64px;
	height: 64px;
}

.topic-icon {
	margin-left: 60px;
	width: 64px;
	height: 64px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.callout-svg {
	float: right;
	margin-right: 1em;
	width: 48px;
	height: 48px;
}

.feature-svg {
	margin-bottom: 1em;
	width: 96px;
	height: 96px;
}

.topic-svg,
.topic-png {
	margin-left: 60px;
	width: 64px;
	height: 64px;
}

@media only screen and (max-width: 1068px) {
	.topic-icon,
	.topic-svg,
	.topic-png {
		margin-left: 10px;
	}
}
@media only screen and (max-width: 734px) {
	.icon-articles,
	.icon-dashboard,
	.callout-svg {
		width: 36px;
		height: 36px;
	}
	.topic-icon,
	.topic-svg,
	.topic-png {
		margin-bottom: 0.5em;
		margin-left: 0;
	}
}

.icon-build {
	background-image: url("/assets/elements/icons/xcode-12-project/xcode-12-project-64x64.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-build {
		background-image: url("/assets/elements/icons/xcode-12-project/xcode-12-project-64x64_2x.png");
	}
}
.icon-deploy {
	background-image: url("/assets/elements/icons/core-ml-file/core-ml-file-96x96.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-deploy {
		background-image: url("/assets/elements/icons/core-ml-file/core-ml-file-96x96_2x.png");
	}
}
.icon-logs {
	background-image: url("/assets/elements/icons/logs/logs-64x64.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-logs {
		background-image: url("/assets/elements/icons/logs/logs-64x64_2x.png");
	}
}
.icon-telemetry {
	background-image: url("/assets/elements/icons/telemetry/telemetry-64x64.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (min-resolution: 1.5dppx),
	only screen and (min-resolution: 144dpi) {
	.icon-telemetry {
		background-image: url("/assets/elements/icons/telemetry/telemetry-64x64_2x.png");
	}
}
.cloudkit-authentication {
	background-image: url("/icloud/images/cloudkit-authentication.svg");
}
.cloudkit-console {
	background-image: url("/icloud/images/cloudkit-console.svg");
}
.cloudkit-data {
	background-image: url("/icloud/images/cloudkit-data.svg");
}
.cloudkit-encryption {
	background-image: url("/icloud/images/cloudkit-encryption.svg");
}
.cloudkit-measuring-performance {
	background-image: url("/icloud/images/cloudkit-measuring-performance.svg");
}
.cloudkit-model-archives {
	background-image: url("/icloud/images/cloudkit-model-archives.svg");
}
.cloudkit-model-collections {
	background-image: url("/icloud/images/cloudkit-model-collections.svg");
}
.cloudkit-model-updates {
	background-image: url("/icloud/images/cloudkit-model-updates.svg");
}
.cloudkit-overview {
	background-image: url("/icloud/images/cloudkit-overview.svg");
}
.cloudkit-privacy {
	background-image: url("/icloud/images/cloudkit-privacy.svg");
}
.cloudkit-realtime-views {
	background-image: url("/icloud/images/cloudkit-realtime-views.svg");
}
.cloudkit-reports {
	background-image: url("/icloud/images/cloudkit-reports.svg");
}
.cloudkit-sandbox-views {
	background-image: url("/icloud/images/cloudkit-sandbox-views.svg");
}
.cloudkit-targeted-deployments {
	background-image: url("/icloud/images/cloudkit-targeted-deployments.svg");
}
.cloudkit-cktool {
	background-image: url("/icloud/images/cloudkit-cktool.svg");
}

/* ========== Grid ========== */
#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}
#main section.section.divider-bottom {
	padding-bottom: 0;
	border-bottom: none;
}
#main section.section.divider-bottom .section-content {
	border-bottom: 1px solid #d2d2d7;
	padding-bottom: 4em;
}
#main section .section-content .row {
	margin-left: 0;
	margin-right: 0;
}
#main section.section-topics .section-content > .row {
	margin-top: 2em;
}
#main section.section-topics .section-content > .row:first-of-type {
	margin-top: 0;
}
#main section .section-content .row > .column {
	padding: 0;
}

@media only screen and (max-width: 1068px) {
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
}

@media only screen and (max-width: 734px) {
	#main section.section {
		padding-top: 3em;
		padding-bottom: 3em;
	}
	#main section.section.divider-bottom .section-content {
		border-bottom: 1px solid #d2d2d7;
		padding-bottom: 3em;
	}
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
	#main section .section-content .row > .column {
		padding: 0;
	}
}