draft of new version of mainMedia partial

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/HomeResources.java

@@ -42,6 +42,18 @@ public interface HomeResources extends ClientBundle {
         String mainsection_header();
         String mainsection_header_title();
         String mainsection_navigation();
+        
+        String lightbox();
+        String lightbox_overlay();
+        String lightbox_overlayhidden();
+        String lightbox_content();
+        String lightbox_contenthidden();
+        String lightbox_content_enlargedimage();
+        String lightbox_content_enlargedimage_caption();
+        String lightbox_content_enlargedimage_close();
+        String lightbox_data();
+        String lightbox_photo();
+        String lightbox_item();
     }
     
     @Shared 

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/overview/EventOverview.css

@@ -74,97 +74,6 @@
 .columns .latestraceresults_detail_wrapperimage {
   max-width: none;
 }
-.lightbox {
-  font-size: 16px;
-  font-size: 1rem;
-}
-.lightbox_overlay {
-  font-size: 16px;
-  font-size: 1rem;
-  background: #000;
-  opacity: 0.7;
-  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
-  filter: literal("alpha(opacity=70)");
-  width: 100%;
-  height: 100%;
-  position: fixed;
-  left: 0;
-  top: 0;
-  z-index: 2000;
-  -webkit-transition: opacity 0.3s ease;
-  -moz-transition: opacity 0.3s ease;
-  -o-transition: opacity 0.3s ease;
-  -ms-transition: opacity 0.3s ease;
-  transition: opacity 0.3s ease;
-}
-.lightbox_overlayhidden {
-  opacity: 0;
-  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-  filter: alpha(opacity=0);
-}
-.lightbox_content {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  opacity: 1;
-  -ms-filter: none;
-  filter: none;
-  top: 0;
-  left: 0;
-  z-index: 2001;
-  background-repeat: no-repeat;
-  background-position: center center;
-  -webkit-transition: opacity 0.3s ease;
-  -moz-transition: opacity 0.3s ease;
-  -o-transition: opacity 0.3s ease;
-  -ms-transition: opacity 0.3s ease;
-  transition: opacity 0.3s ease;
-}
-.lightbox_contenthidden {
-  opacity: 0;
-  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-  filter: alpha(opacity=0);
-}
-.lightbox_content_enlargedimage {
-  -webkit-transition: margin 0.7s linear;
-  -moz-transition: margin 0.7s linear;
-  -o-transition: margin 0.7s linear;
-  -ms-transition: margin 0.7s linear;
-  transition: margin 0.7s linear;
-  display: inline-block;
-  position: absolute;
-  left: 50%;
-  top: 50%;
-}
-.lightbox_content_enlargedimage_caption {
-  text-align: center;
-  color: #f6f9fc;
-  font-weight: 700;
-}
-.lightbox_content_enlargedimage_close {
-  display: inline-block;
-  background-image: url("../images/x_lightbox.png");
-  background-repeat: no-repeat;
-  background-position: center center;
-  width: 1.25em;
-  height: 0;
-  overflow: hidden;
-  padding-top: 1.25em;
-  position: absolute;
-  top: 1.25em;
-  right: 1.25em;
-  cursor: pointer;
-  z-index: 2003;
-}
-.lightbox_content .media_slideshow_controls {
-  z-index: 2002;
-}
-.lightbox_data {
-  display: none;
-}
-.lightbox_photo {
-  cursor: pointer;
-}
 .mediateaser {
   font-size: 16px;
   font-size: 1rem;

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/overview/EventOverviewResources.java

@@ -29,17 +29,7 @@ public interface EventOverviewResources extends ClientBundle {
         String latestraceresults_detail_datetime();
         String columns();
         String latestraceresults_detail_wrapperimage();
-        String lightbox();
-        String lightbox_overlay();
-        String lightbox_overlayhidden();
-        String lightbox_content();
-        String lightbox_contenthidden();
-        String lightbox_content_enlargedimage();
-        String lightbox_content_enlargedimage_caption();
-        String lightbox_content_enlargedimage_close();
         String media_slideshow_controls();
-        String lightbox_data();
-        String lightbox_photo();
         String mediateaser();
         String mediateaser_title();
         String mediateaser_title_link();

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMedia.css

@@ -1,20 +1,29 @@
-/**
- * Websites main media element
- */
 .media {
-  background: #f8f8f8;
-  font-size: 16px;
+  font-size: 15px;
   font-size: 1rem;
 }
 .media_photo {
   width: 100%;
   height: 100%;
+  -webkit-transition: margin 1s ease;
+  -moz-transition: margin 1s ease;
+  -o-transition: margin 1s ease;
+  -ms-transition: margin 1s ease;
+  transition: margin 1s ease;
+  position: absolute;
+  background-position: center center;
+  background-repeat: no-repeat;
+  cursor: pointer;
 }
 .media_slideshow {
   position: relative;
   height: 550px;
   width: 830px;
   margin: 0 auto;
+  overflow: hidden;
+}
+.media_slideshow_data {
+  display: none;
 }
 .media_slideshow_controls {
   position: absolute;
@@ -23,7 +32,6 @@
   cursor: pointer;
   z-index: 10;
 }
-
 .media_slideshow_controlsnext,
 .media_slideshow_controlsprev {
   top: 50%;
@@ -65,9 +73,9 @@
   color: #fff;
 }
 .videopreview {
-  font-size: 16px;
+  font-size: 15px;
   font-size: 1rem;
-  margin-bottom: 2.5em;
+  margin-bottom: 2.666666666666667em;
   cursor: pointer;
 }
 .videopreview:before {
@@ -88,7 +96,11 @@
   background-size: contain;
 }
 .videopreview_title {
-  font-size: 1.375em;
+  font-size: 1.466666666666667em;
   font-weight: bold;
   margin: 0;
+  color: #fff;
+}
+.videopreview time {
+  display: block;
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMedia.java

@@ -1,6 +1,5 @@
 package com.sap.sailing.gwt.home.client.shared.mainmedia;
 
-import java.util.ArrayList;
 import java.util.List;
 
 import com.google.gwt.core.client.GWT;
@@ -8,23 +7,17 @@ import com.google.gwt.dom.client.DivElement;
 import com.google.gwt.uibinder.client.UiBinder;
 import com.google.gwt.uibinder.client.UiField;
 import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.HTMLPanel;
 import com.google.gwt.user.client.ui.Widget;
 import com.sap.sailing.gwt.home.client.app.PlaceNavigator;
 import com.sap.sailing.gwt.ui.shared.EventDTO;
 
 public class MainMedia extends Composite {
+    @UiField HTMLPanel videoThumbsPanel;
+    @UiField HTMLPanel videoPanel;
+    @UiField HTMLPanel photoThumbsPanel;
 
-    @UiField DivElement photoImage;
-
-    @UiField(provided=true) RecentEventVideo eventVideo1;
-    @UiField(provided=true) RecentEventVideo eventVideo2;
-    @UiField(provided=true) RecentEventVideo eventVideo3;
-
-    private List<EventDTO> recentEvents;
-
-    private final String basePathToImages = "http://static.sapsailing.com/newhome/media/";
-
-    private String[] images = { "main-media-photo-1.jpg" };
+    @UiField DivElement photoUrl;
     
     interface MainMediaUiBinder extends UiBinder<Widget, MainMedia> {
     }
@@ -32,38 +25,27 @@ public class MainMedia extends Composite {
     private static MainMediaUiBinder uiBinder = GWT.create(MainMediaUiBinder.class);
 
     public MainMedia(PlaceNavigator navigator) {
-        eventVideo1 = new RecentEventVideo(navigator);
-        eventVideo2 = new RecentEventVideo(navigator);
-        eventVideo3 = new RecentEventVideo(navigator);
         
         MainMediaResources.INSTANCE.css().ensureInjected();
         initWidget(uiBinder.createAndBindUi(this));
         
-        String imagePath = "url(" + basePathToImages + images[0] + ")";
-        photoImage.getStyle().setBackgroundImage(imagePath);
-
-        recentEvents = new ArrayList<EventDTO>();
     }
 
-    public void setRecentEvents(List<EventDTO> theRecentEvents) {
-        recentEvents.clear();
-        recentEvents.addAll(theRecentEvents);
+    public void setRecentEvents(List<EventDTO> recentEvents) {
+        int videoCounter = 0;
+        for(EventDTO event: recentEvents) {
+            if(event.getVideoURLs().size() > 0) {
+                MainMediaVideoThumb videoThumb = new MainMediaVideoThumb();
+                if(videoCounter <= 3) {
+                    videoThumbsPanel.add(videoThumb);
+                    videoCounter++;
+                }
+            }
+        }
+        
+        photoUrl.setAttribute("data-url", "#1");
+//        String imagePath = "url(" + imageX + ")";
+//      photoUrl.getStyle().setBackgroundImage(imagePath);
         
-        int size = recentEvents.size();
-        if(size > 0) {
-            eventVideo1.setEvent(recentEvents.get(0));
-        } else {
-            eventVideo1.setVisible(false);
-        }
-        if(size > 1) {
-            eventVideo2.setEvent(recentEvents.get(1));
-        } else {
-            eventVideo2.setVisible(false);
-        }
-        if(size > 2) {
-            eventVideo3.setEvent(recentEvents.get(2));
-        } else {
-            eventVideo3.setVisible(false);
-        }
     }
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMedia.ui.xml

@@ -6,22 +6,26 @@
     <ui:with field="res" type="com.sap.sailing.gwt.home.client.HomeResources" />
     <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.shared.mainmedia.MainMediaResources" />
     <g:HTMLPanel>
+
+<!-- Partial for media like image and video-->
 <div class="{res.mainCss.mainsection} {local_res.css.media}">
   <div class="{res.mainCss.grid}">
     <div class="{res.mediaCss.small12} {res.mediaCss.columns}">
       <header class="{res.mainCss.mainsection_header}">
-        <h3 class="{res.mainCss.mainsection_header_title}">Sailing loves Photography</h3>
-        <p>Get lost in the latest and most beautiful impressions from your favorite sailing event.</p>
+        <h3 class="{res.mainCss.mainsection_header_title}"><ui:text from='{i18n.mainMediaTitle}'/></h3>
+        <p><ui:text from='{i18n.mainMediaSubtitle}'/></p>
       </header>
     </div>
   </div>
   <div class="{res.mainCss.grid}">
     <div class="{res.mediaCss.small12} {res.mediaCss.columns}">
       <div class="{local_res.css.media_slideshow}">
-        <div ui:field="photoImage" class="{local_res.css.media_photo}"></div>
+        <div class="{local_res.css.media_slideshow_data}">
+            <g:HTMLPanel ui:field="photoThumbsPanel" />
+        </div>
+        <div ui:field="photoUrl" data-url="photoUrl" style="background-image: url('images/xxx')" class="{local_res.css.media_photo}"></div>
         <div class="{local_res.css.media_slideshow_controls} {local_res.css.media_slideshow_controlsprev}"></div>
         <div class="{local_res.css.media_slideshow_controls} {local_res.css.media_slideshow_controlsnext}"></div>
-        <div class="{local_res.css.media_slideshow_controls} {local_res.css.media_slideshow_controlsfullsize}"></div>
       </div>
     </div>
   </div>
@@ -30,15 +34,16 @@
   <div class="{res.mainCss.grid}">
     <div class="{res.mediaCss.small12} {res.mediaCss.columns}">
       <header class="{res.mainCss.mainsection_header}">
-        <h3 class="{res.mainCss.mainsection_header_title}">Recent Video Entries</h3>
-        <p>Immerse yourself in the world of sailing and check out our latest events for more videos.</p>
+        <h3 class="{res.mainCss.mainsection_header_title}"><ui:text from='{i18n.mainMediaVideosTitle}'/></h3>
+        <p><ui:text from='{i18n.mainMediaVideosSubtitle}'/></p>
       </header>
     </div>
   </div>
-  <div class="{res.mainCss.grid}">
-      <s:mainmedia.RecentEventVideo ui:field='eventVideo1'/>
-      <s:mainmedia.RecentEventVideo ui:field='eventVideo2'/>
-      <s:mainmedia.RecentEventVideo ui:field='eventVideo3'/>
+  <div class="{res.mainCss.grid} {res.mainCss.lightbox}">
+    <div class="{res.mainCss.lightbox_data}">
+        <g:HTMLPanel ui:field="videoThumbsPanel" />
+    </div>
+    <g:HTMLPanel ui:field="videoPanel" />
   </div>
 </div>
     </g:HTMLPanel>

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaPhotoThumb.java

@@ -0,0 +1,23 @@
+package com.sap.sailing.gwt.home.client.shared.mainmedia;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+import com.sap.sailing.gwt.home.client.app.PlaceNavigator;
+
+public class MainMediaPhotoThumb extends Composite {
+
+    
+    interface MainMediaPhotoThumbUiBinder extends UiBinder<Widget, MainMediaPhotoThumb> {
+    }
+    
+    private static MainMediaPhotoThumbUiBinder uiBinder = GWT.create(MainMediaPhotoThumbUiBinder.class);
+
+    public MainMediaPhotoThumb(PlaceNavigator navigator) {
+        MainMediaResources.INSTANCE.css().ensureInjected();
+        initWidget(uiBinder.createAndBindUi(this));
+        
+    }
+
+}

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaPhotoThumb.ui.xml

@@ -0,0 +1,11 @@
+<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
+<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
+  xmlns:g="urn:import:com.google.gwt.user.client.ui"
+    xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared">
+    <ui:with field="i18n" type="com.sap.sailing.gwt.home.client.i18n.TextMessages"/>
+    <ui:with field="res" type="com.sap.sailing.gwt.home.client.HomeResources" />
+    <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.shared.mainmedia.MainMediaResources" />
+    <g:HTMLPanel>
+		{photo.file},{photo.url};
+    </g:HTMLPanel>
+</ui:UiBinder>

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaResources.java

@@ -14,6 +14,7 @@ public interface MainMediaResources extends ClientBundle {
         String media();
         String media_photo();
         String media_slideshow();
+        String media_slideshow_data();
         String media_slideshow_controls();
         String media_slideshow_controlsnext();
         String media_slideshow_controlsprev();

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaVideo.java

@@ -0,0 +1,32 @@
+package com.sap.sailing.gwt.home.client.shared.mainmedia;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.SpanElement;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+import com.sap.sailing.gwt.home.client.app.PlaceNavigator;
+
+public class MainMediaVideo extends Composite {
+
+    
+    interface MainMediaVideoThumbUiBinder extends UiBinder<Widget, MainMediaVideo> {
+    }
+    
+    private static MainMediaVideoThumbUiBinder uiBinder = GWT.create(MainMediaVideoThumbUiBinder.class);
+
+    @UiField SpanElement videoTime;
+    @UiField SpanElement videoTitle;
+    
+//    @UiField videoThumbImage
+//    @UiField videoFile
+//    @UiField videoLink
+    
+    public MainMediaVideo(PlaceNavigator navigator) {
+        MainMediaResources.INSTANCE.css().ensureInjected();
+        initWidget(uiBinder.createAndBindUi(this));
+        
+    }
+
+}

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaVideo.ui.xml

@@ -0,0 +1,18 @@
+<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
+<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
+  xmlns:g="urn:import:com.google.gwt.user.client.ui"
+    xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared">
+    <ui:with field="i18n" type="com.sap.sailing.gwt.home.client.i18n.TextMessages"/>
+    <ui:with field="res" type="com.sap.sailing.gwt.home.client.HomeResources" />
+    <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.shared.mainmedia.MainMediaResources" />
+    <g:HTMLPanel>
+
+<div class="{res.mediaCss.small12} {res.mediaCss.medium6} {res.mediaCss.large4} {res.mediaCss.columns}">
+  <figure data-src="videoFile" class="{local_res.css.videopreview} {res.mainCss.lightbox_item}"><img src="images/videoThumb"></img>
+    <figcaption><a href="videoLink" class="{local_res.css.videopreview_title}"><span ui:field="videoTitle" /></a>
+      <time><span ui:field="videoTime" /></time>
+    </figcaption>
+  </figure>
+</div>
+    </g:HTMLPanel>
+</ui:UiBinder>

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaVideoThumb.java

@@ -0,0 +1,22 @@
+package com.sap.sailing.gwt.home.client.shared.mainmedia;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+
+public class MainMediaVideoThumb extends Composite {
+
+    
+    interface MainMediaVideoThumbUiBinder extends UiBinder<Widget, MainMediaVideoThumb> {
+    }
+    
+    private static MainMediaVideoThumbUiBinder uiBinder = GWT.create(MainMediaVideoThumbUiBinder.class);
+
+    public MainMediaVideoThumb() {
+        MainMediaResources.INSTANCE.css().ensureInjected();
+        initWidget(uiBinder.createAndBindUi(this));
+        
+    }
+
+}

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/mainmedia/MainMediaVideoThumb.ui.xml

@@ -0,0 +1,11 @@
+<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
+<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
+  xmlns:g="urn:import:com.google.gwt.user.client.ui"
+    xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared">
+    <ui:with field="i18n" type="com.sap.sailing.gwt.home.client.i18n.TextMessages"/>
+    <ui:with field="res" type="com.sap.sailing.gwt.home.client.HomeResources" />
+    <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.shared.mainmedia.MainMediaResources" />
+    <g:HTMLPanel>
+{video.thumb},{video.file},{video.title},video;
+    </g:HTMLPanel>
+</ui:UiBinder>

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/stage/UpcomingEventStageTeaser.java

@@ -11,9 +11,9 @@ public class UpcomingEventStageTeaser extends StageTeaser {
         title.setInnerText(event.getName());
         subtitle.setInnerText(event.venue.getName());
         
-        countDown.setAttribute("data-starttime", "");
-        countDown.setAttribute("data-days", "3");
-        countDown.setAttribute("data-hours", "2");
+        countDown.setAttribute("data-starttime", event.startDate.toString());
+        countDown.setAttribute("data-days", "");
+        countDown.setAttribute("data-hours", "");
         countDown.setAttribute("data-minutes", "");
         countDown.setAttribute("data-seconds", "");
 

java/com.sap.sailing.gwt.ui/src/main/resources/com/sap/sailing/gwt/home/main.css

@@ -238,3 +238,101 @@ figcaption {
 .mainsection_navigation {
   text-align: center;
 }
+
+.lightbox {
+  font-size: 16px;
+  font-size: 1rem;
+}
+.lightbox_overlay {
+  font-size: 16px;
+  font-size: 1rem;
+  background: #000;
+  opacity: 0.7;
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
+  filter: literal("alpha(opacity=70)");
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 2000;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  -ms-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
+}
+.lightbox_overlayhidden {
+  opacity: 0;
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+  filter: alpha(opacity=0);
+}
+.lightbox_content {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+  top: 0;
+  left: 0;
+  z-index: 2001;
+  background-repeat: no-repeat;
+  background-position: center center;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  -ms-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
+}
+.lightbox_contenthidden {
+  opacity: 0;
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+  filter: alpha(opacity=0);
+}
+.lightbox_content_enlargedimage {
+  -webkit-transition: margin 0.7s linear;
+  -moz-transition: margin 0.7s linear;
+  -o-transition: margin 0.7s linear;
+  -ms-transition: margin 0.7s linear;
+  transition: margin 0.7s linear;
+  display: inline-block;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+}
+.lightbox_content_enlargedimage_caption {
+  text-align: center;
+  color: #f6f9fc;
+  font-weight: 700;
+}
+.lightbox_content_enlargedimage_close {
+  display: inline-block;
+  background-image: url("images/home/x_lightbox.png");
+  background-repeat: no-repeat;
+  background-position: center center;
+  width: 1.25em;
+  height: 0;
+  overflow: hidden;
+  padding-top: 1.25em;
+  position: absolute;
+  top: 1.25em;
+  right: 1.25em;
+  cursor: pointer;
+  z-index: 2003;
+}
+/**
+.lightbox_content .media_slideshow_controls {
+  z-index: 2002;
+}
+*/
+
+.lightbox_data {
+  display: none;
+}
+.lightbox_photo {
+  cursor: pointer;
+}
+
+.lightbox_item {
+}