.btnMain.secMainNavInsideSecRightInsideBtnBell { background: rgba(76,130,163,0); color: rgb(76,130,163); position: relative; } .btnMainIcon.btnMainIconNotification { color: #ff7f68; position: absolute; font-size: 8px; top: 26%; right: 26%; outline: solid 2px white; border-radius: 1000px; } .secMainBodySecInside_DashboardSecMidNotifications { display: flex; flex-direction: column; grid-gap: 15px; } .secMainBodySecInside_DashboardSecMidNotificationsCard { transition: ease 0.3s; width: 100%; background: white; border-radius: 5px; padding: 10px; border-left: solid 4px rgba(139,202,140,0); display: flex; flex-direction: row; grid-gap: 25px; } @media (max-width: 576px) { .secMainBodySecInside_DashboardSecMidNotificationsCard { transition: ease 0.3s; width: 100%; background: white; border-radius: 5px; padding: 10px; border-left: solid 4px rgba(139,202,140,0); display: flex; flex-direction: column; grid-gap: 25px; } } .secMainBodySecInside_DashboardSecMidNotificationsCard:hover { transition: ease 0.3s; border-radius: 0 5px 5px 0; border-left: solid 4px #8bca8c; box-shadow: 0 0 4px 0 rgb(0,0,0,0.1); transform: scale(1.01); } .sMBSI_DSMNotificationsCardSec { display: flex; flex-direction: column; justify-content: center; align-items: center; } .sMBSI_DSMNotificationsCardSec.sMBSI_DSMNotificationsCardSecTop { font-size: 18px; min-width: 35px; color: #4c82a3; } @media (max-width: 576px) { .sMBSI_DSMNotificationsCardSec.sMBSI_DSMNotificationsCardSecTop { align-items: start; } } .sMBSI_DSMNotificationsCardSec.sMBSI_DSMNotificationsCardSecMid { flex-grow: 1; align-items: start; flex-direction: column; } .sMBSI_DSMNotificationsCardSec.sMBSI_DSMNotificationsCardSecBottom { flex-direction: row; } .btnMain.sMBSI_DSMNotificationsCardSecBottomBtn { background: rgba(76,130,163,0); color: rgb(76,130,163); font-size: 20px; height: 100%; flex-grow: 1; } .sMBSI_DSMNotificationsCardSecMidText { font-size: 16px; } .sMBSI_DSMNotificationsCardSecMidText.sMBSI_DSMNotificationsCardSecMidTextTime { color: rgba(0,0,0,0.5); font-size: 14px; }