diff --git a/css/index.css b/css/index.css
index caa9582..e85971e 100644
--- a/css/index.css
+++ b/css/index.css
@@ -49,12 +49,19 @@ body, html {
     float: left;
 }
 
-.aboutPic {
+.aboutPicContainer {
     width: 60%;
     height: 300px;
     float: left;
 }
 
+#aboutPic {
+    float: right;
+    margin-top: 10%;
+    box-shadow: rgba(2, 12, 27, 0.7) 0px 10px 30px -15px;
+    height: 100%;
+}
+
 /* screen larger than 600px -- desktop */
 @media screen and (min-width: 1201px) {
     .tile {
@@ -129,12 +136,19 @@ body, html {
         width: 100%;
     }
 
-    .aboutPic {
+    .aboutPicContainer {
         width: 100%;
         height: 150px;
     }
 
-    #section2{
+    #section2 {
         height: 130%;
     }
+
+    #aboutPic {
+        float: initial;
+        margin-left: auto;
+        margin-right: auto;
+        /*    todo nof loating right in middle */
+    }
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index e4031b8..bae2554 100644
--- a/index.html
+++ b/index.html
@@ -94,8 +94,8 @@
                 <li>OpenSCAD</li>
             </ul>
         </div>
-        <div class="aboutPic">
-            <img src="rsc/self4.jpg" height="100%" style="float:right; margin-top: 10%">
+        <div class="aboutPicContainer">
+            <img src="rsc/self4.jpg" id="aboutPic">
         </div>
     </div>
 </div>