diff --git a/src/style/organisms/_house.scss b/src/style/organisms/_house.scss index 9e1ae91..8ec723c 100644 --- a/src/style/organisms/_house.scss +++ b/src/style/organisms/_house.scss @@ -37,7 +37,7 @@ } .info { display: block; - margin-top: 16px; + margin-top: 12px; color: $color-lightgray; line-height: 1.5; opacity: 0; @@ -45,6 +45,9 @@ transition-delay: var(--delay); @include bp (sm) { + margin-top: 16px; + } + @include bp (md) { margin-top: 24px; } @@ -71,18 +74,19 @@ opacity: 0; transition: opacity 2s var(--ease-quart); - @include bp (sm) { - border-radius: 8px; - } - picture { position: relative; z-index: 3; + border-radius: 0; + + @include bp (md) { + border-radius: 8px; + } } img { display: block; - width: calc(100% + 1px); - height: calc(100% + 1px); + width: calc(100% + 2px); + height: calc(100% + 2px); object-fit: cover; transform: scale3d(1.125, 1.125, 1.125); transition: transform 2s var(--ease-quart), opacity 1.2s var(--ease-quart); @@ -90,11 +94,13 @@ } // Scale down image on hover - a:hover { - img { - opacity: 0.6; - transform: scale3d(1.03, 1.03, 1.03) !important; - transition-duration: 1.2s; + @media (hover: hover) { + a:hover { + img { + opacity: 0.6; + transform: scale3d(1.03, 1.03, 1.03) !important; + transition-duration: 1.2s; + } } } } diff --git a/src/style/pages/_location.scss b/src/style/pages/_location.scss index 21a08f4..473e5c1 100644 --- a/src/style/pages/_location.scss +++ b/src/style/pages/_location.scss @@ -3,7 +3,7 @@ background: #fff; // Intro - .location-page__intro { + &__intro { position: relative; background: $color-primary; @@ -71,6 +71,11 @@ .city { text-align: center; margin-left: auto; + + @include bp (md) { + margin-right: auto; + padding-left: min(400px, 16vw); + } } } } @@ -187,9 +192,12 @@ // House .house { &:not(:last-child) { - margin-bottom: 86px; + margin-bottom: 72px; @include bp (sm) { + margin-bottom: 88px; + } + @include bp (md) { margin-bottom: 120px; } }