/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.drawer-nav-menu{padding:24px;}.drawer-nav-wrapper-component .drawer-nav-inner > ul{padding:24px;}@media screen and (min-width:740px){.drawer-nav-menu{padding:40px 40px 30px 40px;}.drawer-nav-wrapper-component .drawer-nav-inner > ul{padding:40px;}}.drawer-nav-menu > ul > li{font-size:1rem;margin-bottom:12px;padding:0 0 4px;}@media screen and (min-width:980px){.drawer-nav-menu > ul > li{margin-bottom:16px;}}.drawer-nav-menu ul li a{display:block;margin-bottom:8px;padding:0;}.drawer-nav-inner > ul li a{display:block;}@media screen and (min-width:320px) and (max-width:500px){.drawer-nav-inner > ul,.drawer-nav-menu > ul{display:block;column-count:2;column-gap:40px;column-fill:balance;}}.drawer-nav-wrapper-component .drawer-nav-inner > ul{column-fill:balance;break-before:avoid;break-after:avoid;}
.page_header.page_header_default{background:#4E3629;background-image:linear-gradient(to bottom,rgb(78 54 41 / 0%) 40%,rgb(78 54 41 / 90%) 60%,rgb(38 26 20 / 100%) 90%),url(/sites/default/files/2025-08/history-timeline.brown.edu_BannerImage.png);background-size:cover;background-position:center;}.page_header_default .page_title{color:white;text-shadow:0 0 8px #271a14;}
Skip to main content
Toolbar items
Toolbar Menu Logo
Manage
Administration menu
Drupal
Content
Structure
Appearance
Extend
People
Reports
Configuration
Help
Vertical orientation
Shortcuts
Siteimprove
tskoglun@brown.edu
Breadcrumb
Back to site  Administration  Configuration  Development  Asset Injector  CSS Injector  Edit CSS Injector
Edit CSS Injector
Add to Default shortcuts
Label
PM - Flex List Expanded
 Machine name:pm_flex_list_expanded
Label for the CSS Injector.
 Enabled
Code@keyframes fadein{from{opacity:0;}to{opacity:1;}}@keyframes movein-bottom{from{opacity:0;top:-25px;}to{opacity:1;top:0;}}@keyframes movein-left{from{left:-25px;opacity:0;}to{left:0;opacity:1;}}@keyframes movein-right{from{opacity:0;right:-25px;}to{opacity:1;right:0;}}@keyframes movein-top{from{opacity:0;top:50px;}to{opacity:1;top:0;}}@media screen and (min-width:740px){.bottom.in-view{animation-name:movein-bottom;top:0;}.flex-listing-expanded.component_item.in-view{animation-delay:0.0125s;animation-duration:1s;animation-fill-mode:both;animation-name:movein-top;animation-timing-function:ease-in-out;position:relative;top:0;}.left.in-view{animation-name:movein-left;left:0;}.right.in-view{animation-name:movein-right;right:0;}}.typography p:last-of-type{margin:25px 0 0 0;}.component_items{display:flex;flex-direction:column;gap:60px;}.flex-listing-expanded.component_item{border-bottom:2px solid #f8f7f5;margin:0;padding:0 0 60px 0;align-items:center;}.flex-listing-expanded .component_body{display:flex;flex-direction:column;}.flex-listing-expanded .flex_field-container{order:0;}.flex-listing-expanded .flex_field-container .flex_field p{color:var(--color-red);font-size:1.125rem;font-weight:bold;line-height:1.25;margin:0;position:relative;}.flex-listing-expanded .flex_field-container .flex_field:before{background:#E2D8D2;border-radius:10px;content:"";height:2px;left:-50px;position:absolute;top:10px;width:40px;}.flex-listing-expanded .flex-intro{color:var(--color-brown);font-size:1.25rem;line-height:1.5;order:2;}.flex-listing-expanded .flex-intro p:first-child{margin:0;}.flex-listing-expanded .title-link{order:1;}.flex-listing-expanded .title-link h3.component_title{color:var(--color-brown);font-weight:bold;margin:0 0 16px 0;}.typography img{width:100%;}@media screen and (min-width:980px){.flex-listing-expanded.component_item .component_figure .flex_img{aspect-ratio:1 / 1;}}@media screen and (min-width:1140px){.flex-listing-expanded.component_item .component_figure{max-width:30%;}}The actual code goes in here. Do NOT include the wrapping <style> element.
 

Advanced options
Media

All
Which media types is the CSS used.
 Preprocess CSS
If the CSS is preprocessed,and CSS aggregation is enabled,the script file will be aggregated.
Conditions
PagesNot restricted
Not restricted
(active tab)
Response status
Current Theme- None -
- None -
User RoleNot restricted
Not restricted
Content type
Vocabulary
Condition RequirementsRequire ALL conditions
Require ALL conditions
Pages
Specify pages by using their paths. Enter one path per line. The '*' character is a wildcard. An example path is /user/* for every user page. <front> is the front page.
Negate the condition
Show for the listed pages
Hide for the listed pages
Delete
Tray "Administration menu" opened.

Login