blob: 399e8679e3320172e2eb99460778b0f2052eb894 [file] [log] [blame]
.partner-list {
max-width: $max-width-l;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.partner {
display: inline-block;
vertical-align: middle;
width: 100%;
max-width: 18em;
padding: 1em;
margin: 0 1em 2.75em;
border-radius: 1em;
transition: box-shadow 0.4s ease-out, background 0.4s ease-out;
display: flex;
align-items: center;
&:hover,
&:focus {
box-shadow: 0 0 20px rgba(0,0,0,0.2);
background: #fff;
img {
filter: none;
}
}
&:focus {
outline: 1px dashed $dark-purple;
outline-offset: -0.625em;
}
img {
width: 100%;
max-width: 15em;
filter: var(--filter);
transition: filter 0.3s ease-out;
}
}
.partner-quote {
max-width: $max-width-m;
margin: 0 auto;
padding-top: 2em;
background-image: url('data:image/svg+xml;utf8,
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135 20">/
<path fill="%233D1067" fill-rule="nonzero" d="M79 0a31 31 0 00-1.4 4c-.3 1-.5 2.2-.5 3.1 0 1.1.2 2 .5 2.9l.8 2.3c.3.7.5 1.6.5 2.6 0 1.3-.5 2.4-1.5 3.3-1 1-2.3 1.4-4 1.4-1.6 0-3-.5-3.9-1.5-1-1-1.4-2.5-1.4-4.4 0-1.3.3-2.7.9-4.4A27.5 27.5 0 0174.9 0H79zM66 0a31 31 0 00-1.5 4C64.2 5 64 6.1 64 7c0 1.1.2 2 .5 2.9l.9 2.3c.3.7.4 1.6.4 2.6 0 1.3-.5 2.4-1.5 3.3-1 1-2.3 1.4-4 1.4-1.6 0-3-.5-3.9-1.5-1-1-1.4-2.5-1.4-4.4 0-1.3.3-2.7.9-4.4a27.5 27.5 0 016-9.3h4zM35 9.6v2H0v-2h35zm100 0v2h-35v-2h35z"/>/
</svg>');
background-size: 8.4375em 1.25em;
background-repeat: no-repeat;
background-position: center top;
&__item {
margin: 0 0 calc(2em + 1vw);
}
.quote {
color: $blue;
}
footer {
font-weight: 700;
margin-top: 1em;
font-size: 1.125em;
}
}
// Slider
.tns-outer .tns-controls {
display: inline-flex;
margin: 1em auto;
padding: 0.5em;
width: 7em;
justify-content: space-between;
&:focus {
outline: 1px dashed $dark-purple;
outline: 1px dashed var(--text-color);
outline-offset: 4px;
}
button {
border: none;
-webkit-appearance: none;
color: $white;
color: var(--background);
width: 2.5em;
height: 2.5em;
padding: 0;
display: block;
background: $dark-purple;
background: var(--text-color);
font-size: 1em;
svg {
width: 2.5em;
height: 2.5em;
display: inline-block;
}
&[disabled] {
opacity: 0.5;
cursor: auto;
}
}
}