diff --git a/components/slices/Logos.vue b/components/slices/Logos.vue index 8f6d07ec8..a8971f5b9 100644 --- a/components/slices/Logos.vue +++ b/components/slices/Logos.vue @@ -6,7 +6,7 @@ :field="title" /> -
+
.logos { + margin: 0 16px; + &__title h2 { font-family: $font-open-sans; - font-size: 2rem; font-weight: $font-normal; - height: 49px; - letter-spacing: 0.009rem; - line-height: 49px; + color: $blue-5; + letter-spacing: 0.00938rem; text-align: center; + font-size: 1.75rem; + height: 40px; + line-height: 40px; margin-top: 24px; + margin-bottom: 24px; + } + + &__wrapper { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: center; + margin-bottom: 32px; + } + + .wrapper__item { + img { + margin: 0 5px; + } + } + + @include device-is('tablet') { + margin: 0 32px; + + .wrapper { + margin-bottom: 44px; + } + } + + @include device-is('desktop') { + &__title h2 { + margin-bottom: 48px; + } + + &__wrapper { + margin-bottom: 60px; + } + + .wrapper__item { + img { + margin: 0 8px; + } + } } -} -.wrapper { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: center; - padding: 64px 98px; + @include device-is('large-screen') { + max-width: 1920px; - &__item img { - max-height: 66px; - margin: 0 30px 24px; + &__title h2 { + font-size: 2.125rem; + height: 49px; + line-height: 49px; + } } }