#HomePagesMain { display: flex; flex-direction: column; overflow: hidden; flex: 1 1 auto; height: 100%; width: 100%; flex-wrap: wrap; } /* .layout-01, */ .layout-02, .layout-03, .layout-04, .layout-05, .layout-06, .layout-07 { height: 0; text-align: justify; align-content: center; justify-content: top; } .layout-01 { text-align: left; font-size: 1.8rem; font-weight: normal; line-height: 2.1rem; padding: 8px; justify-content: center; text-shadow: 1px 2px 2px rgb(100, 100, 100, 0.4); } .layout-03 { padding: 8px; background-color: rgba(100, 100, 100, 0.1); } .layout-04 { padding: 8px; } #NavbarLayout04 { border: none; height: 42px; background-color: rgba(100, 100, 100, 0.1); } #NavbarLayout04 * { font-size: 1.2rem; } .bannerimage { width:90%; } .banner-image-title { font-weight: bold; line-height: 1.1rem; } .layout-05 { padding: 8px; } .layout-06 { overflow: hidden; padding: 8px; } /* ==================================================================== */ .layout-07 { background-color: rgba(100, 100, 100, 0.1); } #HomeLinkedPlatform { background-color: transparent; } .HomeLinkedPlatform-paging>b { color: greenyellow; } .HomeLinkedPlatform-dev { padding: 5px 20px 5px 0; text-align: left; align-self: center; font-size: small; } .HomeLinkedPlatform-dev>i { font-size: smaller; } .HomeLinkedPlatform-item { text-align: justify; } .HomeLinkedPlatform-item img { width: 100%; height: auto; border-radius: 3rem 0 3rem 0; } #HomeLinkedPlatform .dx-button-content { text-align: justify; justify-content: left; } .HomeLinkedPlatform-item-detail { text-align: left; font-size: small; } .HomeLinkedPlatform-item-detail>i { font-size: smaller; } .clearfix:after { content: ""; display: table; clear: both; } /* ==================================================================================== */ #HomePageContains { text-align: center; justify-content: center; } /* ==================================================================================== */ @media only screen and (max-width: 960px) { /* .pageButton { margin: 1%; width: 23%; } */ #BannerImage>div { font-size: smaller; } } @media only screen and (max-width: 600px) { .layout-01 { text-align: center; font-size: 1.3rem; line-height: 1.5rem; } .layout-03 { background-color: transparent; } .bannerimage { width: 75%; } #BannerImage>div { font-size: small; } /* .pageButton{ margin: 1.5%; width: 30.33%; } */ } @media only screen and (max-width: 480px) { .bannerimage { width: 75%; } /* .pageButton{ margin: 0.9%; width: 48.2%; } */ } @media only screen and (max-width: 368px) { /* .pageButton { margin: auto; margin-bottom: 10px; width: 100%; } */ }