publik-base-theme/static/vendee-cd85/_custom.scss

@media ($max-mobile-viewport) {
	.site-header {
		background: white;
	}
}

a {
	text-decoration: underline;
}

div.link-cell.pk-button {
	border-radius: $button-border-radius;
	&.pk-button ul > li > a, a.pk-button.pk-button {
		padding: 1rem;
	}
}

div#header {
	max-width: 100%;
	@media ($max-mobile-viewport) {
		h1 {
			padding-left: 50px;
			padding-top: 40px;
		}
	}
}

#toplinks {
	align-items: center;
	background-color: $gray;
	display: flex;
	height: 60px;
	justify-content: right;
	right: 0;
	padding-right: 60px;

	@media ($max-mobile-viewport) {
		padding-right: 20px;
		background-color: transparent;
	}

	width: 100%;
	a {
		color: $dark-gray;
		font-size: 0.875rem;
		font-weight: 700;
		text-decoration: none;
		&:hover {
			color: $link-hover-color;
		}
	}
}

#logo.has-logo {
	@media ($min-desktop-viewport) {
		min-height: 160px;
		padding-left: 100px;
		padding-top: 60px;

		a {
			margin-top: 0.5rem;
			min-height: 120px;
			min-width: 100%;
		}
	}
	@media ($max-mobile-viewport) {
		a {
			min-height: 60px;
			background-size: cover;
		}
	}
}

a:hover {
	color: $link-hover-color;
}

div#nav {
	@media ($min-desktop-viewport) {
		max-width: 100%;
		padding-left: 100px;
		padding-right: 100px;
	}
	> ul {
		@media ($min-desktop-viewport) {
			border-top: 2px solid black;
			margin: 0px;
			> li {
				> a {
					font-weight: 400;
					position: relative;

					&:hover {
						color: $dark-gray;
					}

					&::before {
						background: black;
						bottom: 0.5rem;
						content: '';
						height: 1px;
						left: 1rem;
						position: absolute;
						right: 1rem;
						transform-origin: 100% 0;
						transform: scaleX(0);
						transition: transform 0.25s ease;
					}
				}

				&.selected > a::before, > a:hover::before {
					transform: scaleX(1);
					transform-origin: 0 0;
					color: $dark-gray;
				}

				ul {
					li {
						a {
							font-size: 0.85rem;
							font-weight: 400;
							&:hover {
								color: $dark-gray;
								font-weight: 700;
							}
						}
					}
				}
			}
		}
	}
}

div#page {
	main {
		background: $x-light-gray;
	}

	div#main-content-wrapper {
		max-width: $width;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}
}

%cell {
    box-shadow: 3px 3px 10px $gray;
}

%arrow-icon {
	&::before {
		color: $link-hover-color;
		content: "\f0a9";
		display: inline-block;
		font-family: FontAwesome;
		padding-right: 0.7rem;
		text-decoration: none;
	}
}

%cell-links-list {
	& > li > a {
		@extend %arrow-icon;
		display: inline-block;
		
		&:hover {
			text-decoration: $link-hover-decoration;
		}
	}
}

div.text-cell {
	h1, h2:not(:first-child), h6 {
		margin: 0.7rem 1rem;
	}
}

div.wcsformcell {
	padding: 1rem;
	div {
		> a:first-child {
			@extend %arrow-icon;
		}

		div.description {
			margin-top: 1rem;
		}
	}
}

%button {
	box-shadow: none;
	font-size: 0.9rem;
	font-weight: 700;
	padding: 0.8rem 2rem 0.8rem 2rem;
	transition-duration: 0.2s;

	&:hover {
		box-shadow: none;
		border-color: $primary-color;
	}
}

.form-content--title {
	align-items: center;
	background: transparent;
	color: $dark-gray;
	display: flex;
	font-size: 1.75rem;
	font-weight: 700;
	justify-content: center;
	padding: 1.5rem 0;
	text-align: center;

	&::before, &:after {
		content: '';
		display: block;
		border-top: 1px solid black;
		width: 10rem;
	}

	&::before {
		margin-right: 2.5rem;
	}

	&::after {
		margin-left: 2.5rem;
	}
}

#footer-wrapper {
	padding-top: 0;

	&::before {
		background: url(img/footer-top-logo.png) white no-repeat;
		background-position: 100px 20px;
		background-size: 170px 63px;
		content: " ";
		display:block;
		height: 180px;
		padding-left: 100px;

		@media ($max-mobile-viewport) {
			padding-left: 10px;
			background-position: 10px 0;
			height: 150px;
		}
	}

	#footer {
		background: url(img/footer-background.png) $footer-background no-repeat;
		background-size: contain;
		background-position: 85% 100%;
		margin: 50px 100px;
		max-width: 100%;
		position: relative;

		&::before {
			background: $x-dark-gray;
			box-shadow: 0 -8px 8px 0 $gray;
			content: " ";
			left: -100px;
			min-height: 80px;
			position: absolute;
			top: -130px;
			transform-origin: 100% 100%;
			transform: skewY(-2.1deg);
			width: calc(100% + 200px);
		}

	}

	@media ($max-mobile-viewport) {
		#footer {
			margin: 10px 10px;
			&::before {
				top: -80px;
				left: -10px;
				width: calc(100% + 20px);
			}
		}

		&::before {
			padding-left: 10px;
			background-position: 10px 0;
			height: 150px;
		}
	}

	div.link-cell.pk-button ul > li > a, a.pk-button {
		background: transparent;
		border-color: white;
		padding: 1rem;
		&::before {
			content: none;
		}

		&:hover {
			border-color: white;
			text-decoration: underline;
		}
	}
}