wOOP

SRC/public/css/frontend.css

@@ -7,7 +7,7 @@
 html, body {
     font-family: 'Oswald', sans-serif;
     background: #ebebeb;
-    background: url('../imgs/bg.jpg') no-repeat bottom center fixed;
+    background: url('../imgs/bg.png') no-repeat bottom center fixed;
     background-size: cover;
         font-weight:300;
 
@@ -160,10 +160,16 @@ button:active {
     height:100%;
 }
 
-img#imgRef {
+#imgRef {
-    border-radius:50%; height:100px;width:100px;margin:40px;       cursor:pointer;
+    display: inline-block;
-
+    border-radius:50%;
+    height:100px;
+    width:100px;
+    margin:40px;
+    cursor:pointer;
+    background-position: center center;
+    background-size:cover;
 }
-img#imgRef:active {
+#imgRef:active {
     cursor:wait;
 }

SRC/resources/views/frontend/games.blade.php

@@ -4,11 +4,11 @@
 @section('content')
     <div style="text-align:center">
         
-       <img id="imgRef" src="{{ $ref -> image }}"><br>
+        <div id="imgRef" style="background-image:url('{{ $ref -> image }}');"></div><br>
         
         
         <div class="game" onclick="location.href='{{ URL::to('memo') }}'"><img src="imgs/memo/memo2.png"></div>
-       <div class="game" onclick="location.href='{{ URL::to('puzzle') }}'"><img src="imgs/puzzle/puzzle.png"></div> 
+        <div class="game" onclick="location.href='{{ URL::to('puzzle') }}'"><img src="imgs/puzzle/puzzle.png"></div> 
         
     </div>
 @endsection