document.write("<style type=\"text/css\"> /* container for the widget */ .localist_widget_container { width: 100%; background-color: #fff; overflow: hidden; } /* all links within an event item */ .localist_widget_container li a { text-decoration: none; color: #444; } /* all hovered links within an event item */ .localist_widget_container li a:hover { text-decoration: underline; color: #444; } /* container for the list of event items */ .localist_widget_container ul.lw_event_list { list-style: none; padding: 0; max-width: 960px; } /* container for each event item */ .localist_widget_container li.lw_event_item { margin: 5px 0; border: 1px solid #ddd; font: normal 14px/20px \"Helvetica Neue\",Helvetica,Arial,sans-serif; background: #fafafa; overflow: hidden; } /* container for event photo */ .localist_widget_container a.lw_event_item_image { display: block; float: left; overflow: hidden; max-width: 35%; position:relative; } /* event photo (makes it center on the image if dimensions grow/shrink) */ .localist_widget_container a.lw_event_item_image img { top: 50%; left: 50%; position:relative; transform: translate(-50%, 0%) } /* container for non-image content */ .localist_widget_container div.lw_event_content { padding: 10px 20px; overflow: hidden; vertical-align: text-top; } /* event title */ .localist_widget_container div.lw_event_item_title { color: #444; font-weight: bold; line-height: 40px; } /* event description */ .localist_widget_container div.lw_event_item_description { font-size: 12px; } /* container for event meta data */ .localist_widget_container .lw_event_meta { width: 50%; float:left; overflow: hidden; } /* event location and time shared code */ .localist_widget_container div.lw_event_item_location, .localist_widget_container div.lw_event_item_time { font-size: 12px; text-transform: uppercase; margin-left: 15px; } /* event location overrides */ .localist_widget_container div.lw_event_item_location { margin-top: 10px; } /* event date */ .localist_widget_container span.lw_event_item_date { background-color:rgba(0, 0, 0, 0.5); color: #fff; position:absolute; bottom: 0; left: 0; padding: 5px 0px; width: 100%; font-size: 10px; text-transform: uppercase; text-align: center; } /* event cta */ .localist_widget_container .action_button a { display: block; background: #ccc; color: #fff; line-height: 40px; text-decoration: none; text-align: center; margin-top: 10px; max-width: 200px; font-weight: bold; } /* event cta hover */ .localist_widget_container .action_button a:hover { text-decoration: none; background-color: #ddd; } .localist_widget_container .lw_view_all_cta a { display: block; text-align: center; font: normal 14px/20px \"Helvetica Neue\",Helvetica,Arial,sans-serif; } /* icons */ .localist_widget_container .pin,.localist_widget_container .pin:after{position:absolute}.localist_widget_container .pin{width:10px;height:10px;border-radius:50% 50% 50% 0;background:#ccc;transform:rotate(-45deg);float:left;margin-top:13px}.localist_widget_container .pin:after{content:\"\";width:4px;height:4px;margin:3px 0 0 3px;background:#fff;border-radius:50%} .localist_widget_container .clock{float:left;margin-top:4px;border:2px solid #ccc;display:inline-block;position:relative;vertical-align:top;border-radius:100%;height:7px;width:7px}.localist_widget_container .clock:after,.localist_widget_container .clock:before{background:#ccc;border:1px solid #ccc;content:'';position:absolute;border-left:none;width:0}.localist_widget_container .clock:after{height:2px;left:3px;top:0}.localist_widget_container .clock:before{height:3px;left:5px;top:1px;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)} </style> <div class=\"localist_widget_wrapper\"> <div class=\"localist_widget_container\"> <ul class=\"lw lw_event_list\"> <li class=\"lw lw_event_item nocontent\"> <div class=\"lw_event_item_title\">No events found</div> </li> <p class=\"lw lw_view_all_cta\"><a href=\"https://calendar.ucsf.edu/calendar\">View all events...</a></p> </ul> </div> </div>");