--- /dev/null
+.poster-view {
+ margin-top: 30px;
+}
+.poster {
+ overflow: hidden;
+ position: relative;
+ display: flex;
+ height: 350px;
+ width: 33.3%;
+ float: left;
+ border: 10px solid #FFF;
+ box-sizing: border-box;
+ align-items: center;
+ justify-content: center;
+}
+.poster_show {
+ width: 100% !important;
+ border: 0 !important;
+ margin-bottom: 30px;
+}
+.poster > img {
+ min-width: 100%;
+ min-height: 100%;
+ flex-shrink: 0;
+}
+.poster.poster-wide {
+ width: 66.6%;
+}
+
+@media all and (max-width: 768px) {
+ .poster {
+ width: 100% !important;
+ }
+}
+
+.poster_date {
+ position: absolute;
+ background: #FFF;
+ font-family: "Oswald", sans-serif;
+ font-size: 22px;
+ font-weight: 300;
+ color: #000;
+ top: 0;
+ left: 20px;
+ text-transform: uppercase;
+ text-align: center;
+ padding: 10px 15px;
+}
+
+.poster:hover {
+ .poster_overlay {
+ display: block;
+ opacity: 1;
+ }
+ .poster_date {
+ display: none;
+ }
+}
+
+.poster_overlay {
+ background-color: rgba(255,255,255,0.8);
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ display:none;
+ opacity: 0;
+
+ .poster_content {
+ text-align: center;
+ position: absolute;
+ top: 20px;
+ width: 100%;
+ color: #000;
+ padding: 20px;
+
+ .avatar {
+ display: block;
+ margin: 0 auto;
+ }
+
+ .user {
+ font-size: 16px;
+ margin: 0 0 5px;
+ }
+
+ h3 {
+ margin: 0 0 10px;
+ font-family: "Oswald", sans-serif;
+ text-transform: uppercase;
+ font-weight: 700;
+ font-size: 20px;
+ }
+
+ .rating {
+ font-size: 18px;
+ }
+ }
+}
\ No newline at end of file