.custom-header { border-bottom: solid 1pt #777; min-width: 375px; margin-top: 3px; } .rss-subscribe { float: right; font-size: smaller; height: 50px; } div.alert { padding: .75rem 1.25rem; border: 1px solid transparent; border-radius: 3px; margin: 10px; font-weight: 300; } div.alert > h3 { font-weight: 600; margin-bottom: 3px } div.alert.warning { border-color: #feedbb; background-color: #fef5cf; color: #846102; } div.alert.info { border-color: #baeeff; background-color: #c3e5ff; color: #045689; } div.alert.success { border-color: #eeffff; background-color: #d5eadb; color: #048956; } div.alert.danger { border-color: #f6c6cf; background-color: #f8ddd3; color: #721a1c; } div.alert.primary { border-color: #b9dbfe; background-color: #cde6fe; color: #014184; } // Normal (desktop) ======================================================== .img-uni-lu { bottom: -2px; border: solid 1pt #777; border-bottom: solid 2px white; border-radius: 20px 20px 0 0; margin-left: 8%; padding: 20px 27px 0px 27px; position: relative; width: 77px; height: 66px; background-color: white; // necessary on FF to cover bottom line } .img-banner { bottom: -20px; position: relative; } .img-banner-main { margin-left: 2%; height: 30px; } .img-banner-motto { width: 256px; margin-left: 10px; } .img-lcsb { float: right; width: 250px; position: absolute; right: 0px; } .footer-text-container { margin-bottom: 4px; left: 0; width: 100%; position: absolute; text-align: center; } .r3-logo-container { float: left; position: relative; left: 11%; } .r3-logo { height: 30px; } .lcsb-logo { height: 30px; padding-left: 1em; } .social-container { float: right; padding-right: 7%; padding-top: 0.5em; position: sticky; z-index: 100; } .svg-icon { margin: 0px; padding: 0px; } // Big screen ==================================================================================== @media(max-width: 1050px) { .img-logo-big { display: none; } .social-container { position: relative; left:0; width: 100%; text-align: center; float: unset; } .r3-logo-container { position: relative; left:0; width: 100%; text-align: center; padding-bottom: 1em; } .footer-text-container { margin-bottom: 4px; left: 0; width: 100%; position: relative; text-align: center; } } // Normal screen ================================================================================= @media (max-width: 900px) { .img-banner-motto { display: none; } .img-uni-lu { margin-left: 55px; } } // Small-screen ================================================================================== @media (max-width: 700px) { .img-logo-small { display: none; } } @media (max-width: 680px) { .lcsb-logo { height: 32px; margin: 0px auto; float: none; position: initial; top: unset; left: unset; } .footer-text-container { margin-bottom: 4px; left: 0; width: 100%; position: relative; text-align: center; } } @media (max-width: 640px) { .img-banner-main { margin-left: 3%; } .img-banner-motto { display: none; } .img-lcsb { margin-right: 1%; width: 120px; display: none; } } // Ultra-small screen ================================================================================== @media (max-width: 650px) { .img-banner-main { margin-left: 9px; bottom: -8px; max-width: 160px; } .img-uni-lu { margin-left: 20px; width: 40px; height: auto; padding: 12px 17px 0px 16px; } .img-lcsb { display: none; bottom: -6px; margin-right: 10%; position: relative; width: 80px; } }