/* - Colors ---- Crimsons ---- WSU Grays - Dropshadows - Easing - Font Family - Font Size - Font Weights - Heights - Media Sizes - Spacing - Transition Speed - Z-Index */ /* ======================================================== == Border Radius == ==========================================================*/ /* ======================================================== == Breakpoints == ==========================================================*/ /* ======================================================== == Colors == ==========================================================*/ /* WSU Accent colors */ /* WSU Crimson */ /* WSU Grays */ /* ======================================================== == Dropshadows == ==========================================================*/ /* ======================================================== == Easing == ==========================================================*/ /* ======================================================== == Font Family == ==========================================================*/ /* ======================================================== == Font Sizes == ==========================================================*/ /* ======================================================== == Font Weights == ==========================================================*/ /* ======================================================== == Height == ==========================================================*/ /* ======================================================== == Image Sizes == ==========================================================*/ /* ======================================================== == Line Heights == ==========================================================*/ /* ======================================================== == Ratios height/width == ==========================================================*/ /* ======================================================== == Spacing == ==========================================================*/ /* ======================================================== == Transition Speed == ==========================================================*/ /* ======================================================== == Widths == ==========================================================*/ /* ======================================================== == Z-Index == Bootstrap z-index for reference $zindex-dropdown: 1000; $zindex-sticky: 1020; $zindex-fixed: 1030; $zindex-modal-backdrop: 1040; $zindex-offcanvas: 1050; $zindex-modal: 1060; $zindex-popover: 1070; $zindex-tooltip: 1080; ==========================================================*/ /* - Colors ---- Crimsons ---- WSU Grays - Dropshadows - Easing - Font Family - Font Size - Font Weights - Heights - Media Sizes - Spacing - Transition Speed - Z-Index */ /* ======================================================== == Border Radius == ==========================================================*/ /* ======================================================== == Breakpoints == ==========================================================*/ /* ======================================================== == Colors == ==========================================================*/ /* WSU Accent colors */ /* WSU Crimson */ /* WSU Grays */ /* ======================================================== == Dropshadows == ==========================================================*/ /* ======================================================== == Easing == ==========================================================*/ /* ======================================================== == Font Family == ==========================================================*/ /* ======================================================== == Font Sizes == ==========================================================*/ /* ======================================================== == Font Weights == ==========================================================*/ /* ======================================================== == Height == ==========================================================*/ /* ======================================================== == Image Sizes == ==========================================================*/ /* ======================================================== == Line Heights == ==========================================================*/ /* ======================================================== == Ratios height/width == ==========================================================*/ /* ======================================================== == Spacing == ==========================================================*/ /* ======================================================== == Transition Speed == ==========================================================*/ /* ======================================================== == Widths == ==========================================================*/ /* ======================================================== == Z-Index == Bootstrap z-index for reference $zindex-dropdown: 1000; $zindex-sticky: 1020; $zindex-fixed: 1030; $zindex-modal-backdrop: 1040; $zindex-offcanvas: 1050; $zindex-modal: 1060; $zindex-popover: 1070; $zindex-tooltip: 1080; ==========================================================*/ /* ===================== - Fonts - Modals - Menu Items - Transitions - Buttons - Forms ===================== */ /* ======================================================== == Fonts == ==========================================================*/ /* ======================================================== == Menu Items == ==========================================================*/ /* ======================================================== == Modals == ==========================================================*/ /* ======================================================== == Transitions == ==========================================================*/ /* ======================================================== == Buttons == ==========================================================*/ /* ======================================================== == Forms == ==========================================================*/ /* - Colors ---- Crimsons ---- WSU Grays - Dropshadows - Easing - Font Family - Font Size - Font Weights - Heights - Media Sizes - Spacing - Transition Speed - Z-Index */ /* ======================================================== == Border Radius == ==========================================================*/ /* ======================================================== == Breakpoints == ==========================================================*/ /* ======================================================== == Colors == ==========================================================*/ /* WSU Accent colors */ /* WSU Crimson */ /* WSU Grays */ /* ======================================================== == Dropshadows == ==========================================================*/ /* ======================================================== == Easing == ==========================================================*/ /* ======================================================== == Font Family == ==========================================================*/ /* ======================================================== == Font Sizes == ==========================================================*/ /* ======================================================== == Font Weights == ==========================================================*/ /* ======================================================== == Height == ==========================================================*/ /* ======================================================== == Image Sizes == ==========================================================*/ /* ======================================================== == Line Heights == ==========================================================*/ /* ======================================================== == Ratios height/width == ==========================================================*/ /* ======================================================== == Spacing == ==========================================================*/ /* ======================================================== == Transition Speed == ==========================================================*/ /* ======================================================== == Widths == ==========================================================*/ /* ======================================================== == Z-Index == Bootstrap z-index for reference $zindex-dropdown: 1000; $zindex-sticky: 1020; $zindex-fixed: 1030; $zindex-modal-backdrop: 1040; $zindex-offcanvas: 1050; $zindex-modal: 1060; $zindex-popover: 1070; $zindex-tooltip: 1080; ==========================================================*/ /* - Colors ---- Crimsons ---- WSU Grays - Dropshadows - Easing - Font Family - Font Size - Font Weights - Heights - Media Sizes - Spacing - Transition Speed - Z-Index */ /* ======================================================== == Border Radius == ==========================================================*/ /* ======================================================== == Breakpoints == ==========================================================*/ /* ======================================================== == Colors == ==========================================================*/ /* WSU Accent colors */ /* WSU Crimson */ /* WSU Grays */ /* ======================================================== == Dropshadows == ==========================================================*/ /* ======================================================== == Easing == ==========================================================*/ /* ======================================================== == Font Family == ==========================================================*/ /* ======================================================== == Font Sizes == ==========================================================*/ /* ======================================================== == Font Weights == ==========================================================*/ /* ======================================================== == Height == ==========================================================*/ /* ======================================================== == Image Sizes == ==========================================================*/ /* ======================================================== == Line Heights == ==========================================================*/ /* ======================================================== == Ratios height/width == ==========================================================*/ /* ======================================================== == Spacing == ==========================================================*/ /* ======================================================== == Transition Speed == ==========================================================*/ /* ======================================================== == Widths == ==========================================================*/ /* ======================================================== == Z-Index == Bootstrap z-index for reference $zindex-dropdown: 1000; $zindex-sticky: 1020; $zindex-fixed: 1030; $zindex-modal-backdrop: 1040; $zindex-offcanvas: 1050; $zindex-modal: 1060; $zindex-popover: 1070; $zindex-tooltip: 1080; ==========================================================*/ /*============================================= = People = =============================================*/ .wsuwp-people-wrapper { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2.25rem; } .wsuwp-people-filters { grid-column: 1/-1; } .wsuwp-person-container { box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.4); border-radius: 3px; overflow: hidden; padding-bottom: 1.5rem; } .wsuwp-person-container > div:last-child { margin-bottom: 0; } .wsuwp-person-container .wsuwp-person-photo { margin-left: 0 !important; margin-right: 0 !important; margin-top: 0 !important; margin-bottom: 1.5rem; max-width: 100% !important; background: none !important; position: relative; padding-bottom: 75%; } .wsuwp-person-container .wsuwp-person-photo a:focus img, .wsuwp-person-container .wsuwp-person-photo a:hover img { outline: none; box-shadow: none; } .wsuwp-person-container .wsuwp-person-photo img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100% !important; display: block; object-fit: cover; border-radius: 0; } .wsuwp-person-container .wsuwp-person-degree, .wsuwp-person-container .wsuwp-person-name, .wsuwp-person-container .wsuwp-person-position, .wsuwp-person-container .wsuwp-person-office, .wsuwp-person-container .wsuwp-person-address, .wsuwp-person-container .wsuwp-person-email, .wsuwp-person-container .wsuwp-person-phone { margin-left: 1.75rem !important; margin-right: 1.75rem !important; } .wsuwp-person-container .wsuwp-person-name { font-weight: 600; font-size: 1rem; } .wsuwp-person-container .wsuwp-person-position { font-size: 0.875rem; display: block; } .wsuwp-person-container .wsuwp-person-position + :not(.wsuwp-person-position) { margin-top: 0.875rem; } .wsuwp-person-container .wsuwp-person-email { word-wrap: break-word; font-size: 0.875rem; } .wsuwp-person-container .wsuwp-person-degree, .wsuwp-person-container .wsuwp-person-office, .wsuwp-person-container .wsuwp-person-address, .wsuwp-person-container .wsuwp-person-phone { font-size: 0.875rem; } /*---------- Filters ----------*/ .wsuwp-people-filters .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; } .wsuwp-people-filter { display: block !important; margin-bottom: 0.5rem !important; } .wsuwp-people-filter:last-child { margin-bottom: 0 !important; } .wsuwp-people-filters .search input, .wsuwp-people-filter-label { height: auto !important; } .wsuwp-people-filter-label { font-family: "Montserrat", sans-serif; background-color: #A60F2D; color: #fff; border-radius: 6px; border: none; padding: 1em calc( 2.25rem + 0.25rem ); font-size: 1rem; font-weight: 600; line-height: 1.5; cursor: pointer; transition: box-shadow 200ms cubic-bezier(0, 0, 0.03, 1); text-decoration: none; } .wsuwp-people-filter-label:hover, .wsuwp-people-filter-label:focus { box-shadow: 0px 5px 14px rgba(0, 0, 0, 0.4); background-color: #CA1237; } .wsuwp-people-filter.search { position: relative; } .wsuwp-people-filter.search label { position: relative; margin-top: 0; } .wsuwp-people-filter.search label span { position: absolute; bottom: 100%; font-size: 0.7rem; } .wsuwp-people-filter.search label input { height: 56px !important; box-sizing: border-box; } .wsuwp-people-filter-terms { list-style-type: none; max-width: 400px; padding-left: 0 !important; margin-left: 0 !important; padding-top: 1rem !important; padding-right: 1.5rem !important; margin-top: 0.5rem; box-shadow: 0px 5px 14px rgba(0, 0, 0, 0.4); background-color: hsl(0, 0%, 97%); position: absolute !important; z-index: 1; } .wsuwp-people-filter-terms li::before { display: none !important; } .wsuwp-people-filter-terms li label { font-size: 0.8rem; margin-top: 0; display: flex; font-weight: 500; } #wsu-content .wsuwp-people-filter-terms input[type=checkbox] { display: inline-block; vertical-align: middle; height: 1.5em; width: 1.5em; margin-right: 0.5rem; } /*---------- Filters Overrides ----------*/ .wsuwp-people-filters .search input, .wsuwp-people-filter-label { white-space: nowrap; height: auto !important; line-height: 1.5 !important; } .wsuwp-people-filter-label { padding: 1em 3em !important; } @media screen and (min-width: 860px) { .wsuwp-people-filters { display: flex; flex-wrap: wrap; margin-left: -0.5rem; } .wsuwp-people-filter { flex-shrink: 0; margin-left: 0.5rem; } .wsuwp-people-filter .search { order: 1; } .wsuwp-people-filter:first-child + .search:last-child { min-width: calc(75% - 1rem); } .wsuwp-people-filters[data-filters*=search] .wsuwp-people-filter { flex-grow: 1; flex-basis: 25%; } } .wsuwp-person-profile .wsuwp-people-wrapper { display: block; } .wsuwp-person-profile .card { display: flex; border-bottom: 1px solid #ddd; margin-bottom: 2.5rem; } @media screen and (max-width: 800px) { .wsuwp-person-profile .card { display: block; } .wsuwp-person-profile .photo { width: 100%; } } .wsuwp-person-profile .photo { width: 350px; margin-right: 2rem; } .wsuwp-person-profile .contact { flex-grow: 1; } .wsuwp-person-profile .contact h2 { font-size: 2.5rem; } .wsuwp-person-profile .contact span { display: block; font-size: 0.9rem; } /*===== End of People ======*/