.rounded-cell {
	border-radius: 2rem;
	overflow: hidden;
	padding: 1rem;
}

.script-title {
	font-size: 3em;
	text-align: center;
	font-family: $ff-script;
	text-transform: none;
	border-bottom: 1px solid white;
	color: $primary-color;
	line-height: 1;
	small {
		display: block;
		font-weight: 300;
		font-family: $ff-ss-serif;
		color: $font-color;
		font-size: .45em;
	}
}

%button {
	font-weight: 600;
	text-transform: uppercase;
	font-size: $fz-small;
	opacity: .75;

	&:hover {
		opacity: 1;
	}
}

%cancel-button {
	color: $primary-color;
	background-color: white;
	border: 1px solid;

	&:hover {
		color: $primary-color;
		background-color: white;
	}
}

// Header
.site-header {
	border-top: $topLinks_height solid $primary-color;
	#top {
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#logo {
		margin-top: 1rem;
		margin-bottom: 1rem;
		@media ($min-desktop-viewport) {
			margin-top: 1.5rem;
			margin-bottom: 1.5rem;
		}
		a {
			color: black;
			padding-top: 60px;
			text-indent: 0 !important;
			background-size: auto 50px !important;
			background-position: top center !important;
			font-family: $ff-script;
			text-align: center;
		}
	}
}

// User-info
#toplinks {
	// Reset user links
	border: none;
	box-shadow: none;
	border-radius: 0;
	background-color: transparent;
	color: white;
	// position
	top: auto;
	bottom: 100%;
	height: $topLinks_height;
	padding: 0;
	line-height: $topLinks_height;

	a {
		color: inherit;
		font-size: $fz-small;
		text-transform: uppercase;
	}

	// user icon
	&::before {
		content: "\f2c0";
		font-family: fontawesome;
		margin-right: .33em;
	}
}

// Main nav
#nav-wrapper {
	@media ($max-mobile-viewport) {
		margin-top: -52px;
	}
}
div.gru-nav > ul {
	margin: 0;

	@media (min-width: $nav-mobile-limit + 1) {
		text-align: center;
	}

	li {
		a {
			text-transform: uppercase;
			font-weight: 600;
			@media (min-width: $nav-mobile-limit + 1) {
				padding-top: 0;
			}
		}
	}

	@media (min-width: $nav-mobile-limit + 1) {
		// separator
		& > li:not(:first-child)::before {
			content: "";
			width: 1em;
			height: 1em;
			display: inline-block;
			background-color: $nav-active-color;
			vertical-align: sub;
		}
	}
}
// subnav
div.gru-nav > ul ul {
	@media ($min-desktop-viewport) {
		padding-top: .75em;
		box-shadow: 0 0 1px $font-color;
	}
}

// Page picture
body.has-picture .site-nav::after {
	position: static;
	max-width: $width;
	margin-left: auto;
	margin-right: auto;
}

// Carrousel
.top-carrousel {
	max-width: $width;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

// main
main {
	margin-top: 1rem;
}


// Cells

// sidebar cells
#sidebar {
	.cell {
		@extend .rounded-cell;
	}
	.tracking-code-input-cell {
		h2:first-child {
			@extend .script-title;

			& + div {
				padding: 0;
			}
		}
	}
}

// Picture position
.gru-content div.link-list-cell.has-asset-picture,
.gru-content div.wcsformsofcategorycell.has-asset-picture {
	> div {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;

		> * {
			flex: 0 0 100%;
		}

		> h2:first-child {
			flex: 1 0 50%;
		}

		> picture {
			display: block;
			order: -1;
			flex: 0 0 $title-font-size;
			align-self: center;
			margin-left: 1rem;

			img {
				padding: 0;
			}
		}
	}
}

// text Cell
div.text-cell {
	padding: 1px 1rem;
	h3, h4, h5, p, table {
		margin: 1rem 0;
	}
}

// WCS
.gru-content div#tracking-code {
	@extend .cell;
	@extend .rounded-cell;
	text-align: center;
	margin-right: 0;
	margin-left: 0;
	padding: 1rem;

	h3 {
		@extend .script-title;
		font-size: 2em;
	}
	button {
		margin-right: 0;
	}
}
// Title
div#rub_service h2 {
	font-size: 2.5em;
	padding-left: 0;

	@media (max-width: $very-small-limit) {
		font-size: 1.5em;
	}
}
// wcs buttons
div#rub_service .buttons {
	.submit-button button::after {
		content: ">";
		content: ">" / "";
		margin-left: .66em;
	}
	.previous-button button::before {
		content: "<";
		content: "<" / "";
		margin-right: .66em;
	}
}


// Authentic
#registration-blocks > .a2-block,
#login-page > .block {
	background: transparent;
}

// Footer
#footer a {
	color: white;
}

