diff --git a/hlx_statics/blocks/banner/banner.css b/hlx_statics/blocks/banner/banner.css index 3b3430ee..31d717c5 100644 --- a/hlx_statics/blocks/banner/banner.css +++ b/hlx_statics/blocks/banner/banner.css @@ -14,3 +14,9 @@ main div.banner-wrapper div.banner h1 { line-height: 210px; color: rgb(255, 255, 255); } + +@media screen and (max-width:768px) { + main div.banner-wrapper div.banner h1 { + line-height: 60px; + } +} diff --git a/hlx_statics/blocks/discoverblock/discoverblock.css b/hlx_statics/blocks/discoverblock/discoverblock.css index 4d13ac6a..499a3f4c 100644 --- a/hlx_statics/blocks/discoverblock/discoverblock.css +++ b/hlx_statics/blocks/discoverblock/discoverblock.css @@ -1,82 +1,69 @@ - -/* main .discover-nonheading-child-container div.button-container { - padding-top: 23.4px; -} */ - -/* main .discover-nonheading-child-container div{ - padding-top: 5px; -} */ - -main div.discoverblock-wrapper div.discover-child-container { - /* width: 25%; */ - /* padding-right: 30px; */ - box-sizing: border-box; - /* margin-top: 28px; */ +main div.discoverblock-container-wrapper div.discover-container:has(.discover.background-color-white) { + background-color: white !important; } -main div.discoverblock-wrapper div.discover-child-container a { +main div.discoverblock-container-wrapper div.discover-child-container a { font-size: 16px; text-decoration: none; color: #0054b6; } -main div.discoverblock-wrapper .break { - flex-basis: 100%; - height: 0; -} -main div.discoverblock-wrapper .discover-child-inner-container { +main div.discoverblock-container-wrapper div.discover-child-inner-container { display: flex; gap: 30px; } -main div.discoverblock-wrapper .discover-img-child-container { +main div.discoverblock-container-wrapper div.discover-img-child-container { width: 50%; } @media screen and (max-width : 1300px) { - main div.discoverblock-wrapper .discover { + .discover { width: 768px !important; } - main div.discoverblock-wrapper .discover-child-container { + main div.discoverblock-container-wrapper div.discover-child-container { width: 33.3%; + padding: 20px; } } @media screen and (max-width : 800px) { - main div.discoverblock-wrapper .discover { + .discover { width: 600px !important; } - main div.discoverblock-wrapper .discover-child-container { + main div.discoverblock-container-wrapper div.discover-child-container { width: 50%; + padding:20px; } } @media screen and (max-width : 650px) { - main div.discoverblock-wrapper .discover { + .discoverblock { width: 370px !important; } - main div.discoverblock-wrapper .discover-child-container { + main div.discoverblock-container-wrapper div.discover-child-container { width: 100%; + padding: 20px; } } -main div.discoverblock-wrapper{ +main div.discoverblock-container-wrapper{ display: flex; flex-wrap: wrap; column-gap: 50px; margin: 20px 0; row-gap: 40px; } -main div.discoverblock-wrapper div.discoverblock-column{ +main div.discoverblock-container-wrapper div.discoverblock-column{ width: 650px; display: flex; flex-direction: column; gap: 10px; margin-top: 20px; } -main div.discoverblock-wrapper .discover-nonheading-child-container.discover-child-container { +main div.discoverblock-container-wrapper div.discover-nonheading-child-container.discover-child-container { font-size: 16px; }