.secMainBodySecInside_Dashboard { width: 100%; display: flex; flex-direction: column; grid-gap: 25px; } .secMainBodySecInside_DashboardSec { display: flex; flex-direction: column; grid-gap: 10px; } .secMainBodySecInside_DashboardSec.secMainBodySecInside_DashboardSecTop { flex-direction: row; } @media (max-width: 768px) { .secMainBodySecInside_DashboardSec.secMainBodySecInside_DashboardSecTop { flex-direction: column; } } .secMainBodySecInside_DashboardSec.secMainBodySecInside_DashboardSecMid { display: flex; flex-direction: column; grid-gap: 25px; } .secMainBodySecInside_DashboardSec.secMainBodySecInside_DashboardSecFilters { flex-direction: row; flex-wrap: wrap; } .secMainBodySecInside_DashboardSec.secMainBodySecInside_DashboardSecUpload { } .secMainBodySecInside_DashboardSecTopSec { flex-grow: 1; display: flex; flex-direction: row; grid-gap: 10px; align-items: center; } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecTopSec { height: 37px; } } .secMainBodySecInside_DashboardSecTopSec.secMainBodySecInside_DashboardSecTopSecLeft { } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecTopSec.secMainBodySecInside_DashboardSecTopSecLeft { order: 2; } } .secMainBodySecInside_DashboardSecTopSec.secMainBodySecInside_DashboardSecTopSecRight { justify-content: end; } .secMainBodySecInside_DashboardSecTopSecRightSec { display: flex; flex-direction: row; grid-gap: 10px; height: 100%; } .secMainBodySecInside_DashboardSecTopSecRightSec.secMainBodySecInside_DashboardSecTopSecRightSecSearch { } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecTopSecRightSec.secMainBodySecInside_DashboardSecTopSecRightSecSearch { width: 100%; } } .secMainBodySecInside_DashboardSecTopSecRightSec.secMainBodySecInside_DashboardSecTopSecRightSecBtns { align-items: stretch; } .secMainBodySecInside_DashboardSecTopSecDivider { width: 1px; background: rgba(0,0,0,0.1); height: 100%; max-height: 25px; } .btnMain.secMainBodySecInside_DashboardSecTopSecRightSecBtnsBtn { height: 100%; } .secMainBodySecInside_DashboardSecMidCards { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 25px; } @media (max-width: 1200px) { .secMainBodySecInside_DashboardSecMidCards { grid-template-columns: 1fr 1fr; } } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecMidCards { grid-template-columns: 1fr; } } .secMainBodySecInside_DashboardSecMidCardsWrap { transition: ease 0.2s; display: flex; flex-direction: row; grid-gap: 0px; background: white; border-radius: 4px; overflow: hidden; border-left: solid 4px rgba(76,130,163,0); position: relative; } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecMidCardsWrap { flex-direction: column; } } .secMainBodySecInside_DashboardSecMidCardsWrap:hover { transition: ease 0.2s; border-left: solid 4px #4c82a3; border-radius: 0 4px 4px 0; } .secMainBodySecInside_DashboardSecMidCardsWrap:hover > .secMainBodySecInside_DashboardSecMidCardsWrapBtns { transition: ease 0.2s; padding: 10px 5px; width: 50px; } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecMidCardsWrap:hover > .secMainBodySecInside_DashboardSecMidCardsWrapBtns { transition: ease 0.2s; width: auto; padding: 5px; } } .secMainBodySecInside_DashboardSecMidCardsWrapLink { width: 100%; padding: 15px; color: unset; text-decoration: unset; display: flex; flex-direction: column; grid-gap: 15px; } .secMainBodySecInside_DashboardSecMidCardsWrapLink:hover { color: unset; text-decoration: unset; } .secMainBodySecInside_DashboardSecMidCardsWrapBtns { transition: ease 0.2s; display: flex; flex-direction: column; grid-gap: 5px; justify-content: start; align-items: center; padding: 0px; width: 0px; overflow: hidden; border-left: solid 1px rgba(0,0,0,0.1); position: absolute; right: 0; top: 0; bottom: 0; background: white; z-index: 2; } @media (max-width: 768px) { .secMainBodySecInside_DashboardSecMidCardsWrapBtns { position: relative; width: 100%; flex-direction: row; height: auto; border-top: solid 1px rgba(0,0,0,0.1); border-left: none; padding: 5px; } } .btnMain.secMainBodySecInside_DashboardSecMidCardsWrapBtnsBtn { background: rgba(76,130,163,0); color: rgb(76,130,163); flex-grow: 1; padding: 5px 10px; } @media (max-width: 768px) { .btnMain.secMainBodySecInside_DashboardSecMidCardsWrapBtnsBtn { height: 100%; padding: 10px 10px; } } .secMainBodySecInside_DashboardSecMidCardsWrapLinkTop { flex-grow: 1; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMid { display: flex; flex-direction: row; grid-gap: 10px; position: relative; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkBottom { display: flex; flex-direction: column; grid-gap: 10px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkTopText { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 2; font-size: 20px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidPrimary { } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidSecondary { flex-grow: 1; display: flex; flex-direction: row; grid-gap: 5px; padding: 0 0 0 15px; flex-wrap: wrap; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidDivider { height: 100%; width: 1px; background: rgba(0,0,0,0.1); } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUser { transition: ease 0.2s; position: relative; width: 40px; height: 40px; background: rgba(0,0,0,0.15); border-radius: 100px; display: flex; flex-direction: column; justify-content: center; align-items: center; border: solid 2px #4c82a3; z-index: 1; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserOther { transition: ease 0.2s; margin: 0 0 0 -15px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUser.secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserOther:hover { transition: ease 0.2s; margin: 0 15px 0 0px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserStatus { display: flex; flex-direction: column; justify-content: center; align-items: center; color: white; background: #4c82a3; border-radius: 100px; padding: 6px; position: absolute; top: -4px; right: -4px; font-size: 10px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUser.secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserOtherFirst { margin: 0 0 0 -15px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUser.secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserOtherFirst:hover { } .secMainBodySecInside_DashboardSecMidCardsWrapLinkBottomRow { display: flex; flex-direction: row; grid-gap: 10px; align-items: center; color: rgba(0,0,0,0.3); font-size: 14px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkBottomSplit { display: flex; flex-direction: row; grid-gap: 25px; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkBottomRowVisual { display: flex; flex-direction: column; justify-content: center; align-items: center; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkBottomRowText { display: flex; flex-direction: column; justify-content: center; align-items: start; flex-grow: 1; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUser.secMainBodySecInside_DashboardSecMidCardsWrapLinkMidUserNumber { background: white; color: rgba(0,0,0,0.5); font-weight: bold; font-size: 14px; line-height: 1.25; } .secMainBodySecInside_DashboardSecMidCardsWrapLinkAlt { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }