publik-base-theme/static/saumur/_custom.scss

$logo-height: 140px;
$banner-height: 300px;

%button {
    box-shadow: none;
    &:hover {
    text-transform: uppercase;
        box-shadow: none;
    }
}

%title {
    text-transform: uppercase;
}

// global layout

main {
    background: white;
    padding: $space-large 0;
}


// header and navigation

.site-header {
    background-color: white;
    height: 200px;
    @media screen and ($min-desktop-viewport) {
        height: 300px;
    }
}

body.has-header-background .site-header {
    background-color: white;
    background-image: var(--banner-url, url(/assets/header:background));
    background-size: cover;
    background-position: center;
}

div#header {
    max-width: 1600px;
}

#top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    @media ($max-mobile-viewport) {
        flex-wrap: wrap;
    }
    @media ($min-desktop-viewport) {
        padding-top: 2.5rem;
    }
}

#logo.has-logo {
    padding-left: 0;
    max-width: 50%;
    a {
        height: 100px;
        width: 250px;
        max-width: 100%;
        @media screen and ($min-desktop-viewport) {
            height: 200px;
            width: 500px;
        }
    }
}

.logo-commune {
    max-width: 40%;
    &--link {
        display: block;
    }
    &--img {
        width: 100px;
        height: 100px;
        object-fit: contain;
        @media screen and ($min-desktop-viewport) {
            height: 200px;
            width: 200px;
        }
    }
}

div#nav {
    max-width: 100%;
    @media screen and ($min-desktop-viewport) {
        text-align: center;
    }
    & > ul {
        margin: 0;
    }
}

#toplinks {
    @media screen and ($max-mobile-viewport) {
        position: static;
        order: -1;
        flex: 1 1 100%;
        padding-right: calc(#{$nav-menu-side} + 2em);
        max-width: none;
        min-height: $nav-menu-side;
        margin-left: -0.7em;
        margin-right: -0.7em;
    }
}
div.gru-nav {
    @media screen and ($max-mobile-viewport) {
        .gru-nav-button {
            top: 0;
            right: 0.7rem;
            left: unset;
            & + ul::before {
                display: none;
            }
        }
        &.togglable .menu {
            box-shadow: 0 9px 9px 0 rgba(0, 0, 0, 0.1);
            & > li {
                border-bottom: 1px solid $gray-light-3;
            }
        }
    }
}

// content and cells

h1:not(.has-logo), h2, h3, h4, h5, h6 {
    @extend %title;
}
h1 {
    font-size: $fz-1;
}
h2 {
    font-size: $fz-2;
}
h3 {
    font-size: $fz-3;
}

%cell-links-list {
    font-family: Roboto, sans-serif;
    li a {
        padding-top: 0.65rem;
        padding-bottom: 0.65rem;

        &:hover + .description {
            background-color: $cell-entry-hover-background;
        }
    }
    li div.description {
        margin-top: -0.65rem;
        padding-bottom: 0.65rem;
        p {
            margin: 0;
            position: relative;
        }
    } 
}

.search-cell.transparent {
    border: none;
    background: transparent;
    form {
        padding: 0;
    }
}

div.link-cell {
    &.pk-button, &.pk-big-button {
        background: transparent;
        border: none;
    }
}

#sidebar {
    div#rub_service div.category h3,
    div.a2-block h2,
    .block h2,
    div.links-list h2,
    div.textcell h2:first-child,
    div.cell h2:first-child {
        background-color: $gray-dark-1;
        color: $white;
        font-weight: 600;
        &::before {
			content: '\f054';
			font-family: FontAwesome;
			margin-right: 0.6em;
            font-size: 0.6em;
			display: inline-block;
			vertical-align: middle;
		}
    }
}

#main-content #sidebar + #columns-wrapper > * {
    border: none;
}

%orange-border {
    content: " ";
    display: block;
    margin: $space-xsmall auto;
    border-bottom: 3px solid $orange;
}

#columns-wrapper {
    div#rub_service div.category h3,
    div.a2-block h2,
    .block h2,
    div.links-list h2,
    div.textcell h2:first-child,
    div.cell:not(.has-asset-picture) h2:first-child {
        @extend %orange-border;
        padding-top: $space-small;
        padding-bottom: $space-small;
    }
}

.gru-content div.cell.has-asset-picture {
    & > div {
        position: relative;
    }
    h2:first-child {
        padding-left: $space-xlarge;
        padding-top: $space-small;
        padding-bottom: $space-small;
        width: 100%;
        @extend %orange-border;
    }
    img {
        position: absolute;
        padding: 0 !important;
        width: $space-xlarge;
        top: -$space-xsmall;
        left: 0;
    }
}

.wcs-forms-of-category-cell .add-more-items--button {
    color: $gray-dark-1;
    &::after {
        content: " DE SERVICES"
    }
}
// borderless cells in grid

body:not(.authentic-page):not(.wcs-page) #columns,
.form-content {
    border: $widget-border;
    background: white;
    padding: $space-medium;
    .cell {
        border: none;
    }
}
// tracking code cell
.tracking-code-input-cell {
    p {
        display: none;
    }
}
// communes selector

div#services-communes {
	select {
		width: 100%;
	}
}

// forms

.form-previous {
    &::before {
        content: '\f100';
        font-family: FontAwesome;
        margin-right: 0.6em;
        font-size: 0.6em;
        display: inline-block;
        vertical-align: middle;
    }
}
.form-next {
    &::after {
        content: '\f101';
        font-family: FontAwesome;
        margin-left: 0.6em;
        font-size: 0.6em;
        display: inline-block;
        vertical-align: middle;
    }
}

// footer

#footer-wrapper {
    padding-bottom: 0;
    #footer {
        max-width: $width * 0.75;
    }
    margin-top: 0;
    border-top: 3px solid $orange;
    .cell {
        a {
            text-decoration: none;
        }
    }
    .text-cell{
        strong {
            color: $orange;
        }
    }
}
.orange-footer-wrapper {
    background: $orange;
    color: white;
    a {
        color: white;
    }
}

div#tracking-code a {
    padding-right: 0;
    font-size: 110%;
}