diff --git a/src/components/breadcrumbs-title/style.module.scss b/src/components/breadcrumbs-title/style.module.scss index 90e17cd..a2a9110 100644 --- a/src/components/breadcrumbs-title/style.module.scss +++ b/src/components/breadcrumbs-title/style.module.scss @@ -68,5 +68,9 @@ font-size: 48px; line-height: 56px; } + + @media (max-width: 1024px) { + margin: 0 0 40px; + } } } diff --git a/src/components/sidebar/style.module.scss b/src/components/sidebar/style.module.scss index 651defc..b8071e5 100644 --- a/src/components/sidebar/style.module.scss +++ b/src/components/sidebar/style.module.scss @@ -1,11 +1,22 @@ .sidebar { display: flex; + + @media (max-width: 1024px) { + display: block; + } + &__list { + ul { list-style: none; padding: 0; margin: 0 90px 0 80px; + @media (max-width: 1024px) { + margin: 0; + } + + li { margin: 20px 16px; @@ -25,6 +36,10 @@ } } } + + @media (max-width: 1024px) { + margin: 0 0 10px 0; + } } &__divider { diff --git a/src/components/sobre/style.module.scss b/src/components/sobre/style.module.scss index b6e275c..4e8d344 100644 --- a/src/components/sobre/style.module.scss +++ b/src/components/sobre/style.module.scss @@ -1,7 +1,21 @@ .sobre { - width: 748px; + // width: 748px; + width: 58.438%; height: auto; - margin: 0 30px; + margin: 0 0 0 30px; + + @media (min-width: 2500px) { + width: 67.2%; + } + + @media (max-width: 1024px) { + width: 96.88%; + margin: auto; + } + + @media (max-width: 599px) { + width: 91.6%; + } h3 { font-weight: 700; @@ -9,6 +23,15 @@ line-height: 28px; color: var(--dark-gray-200); margin: 12px 0; + + @media (min-width: 2500px) { + font-size: 48px; + line-height: 56px; + } + + @media (max-width: 1024px) { + text-align: center; + } } p { @@ -17,5 +40,15 @@ line-height: 15px; color: var(--medium-gray-200); margin: 12px 0; + + @media (min-width: 2500px) { + font-size: 26px; + line-height: 30px; + } + + @media (max-width: 1024px) { + font-size: 12px; + line-height: 18px; + } } }