Fix README wrong image path issue

Author: gotbahn

README.md

@@ -62,7 +62,7 @@ By default Flex Box Grid have 12 columns.
 - Content should be placed within columns with classes <code>.X-n, .S-n, .M-n, .L-n, .XL-n</code> where n is columns number from 1 to 12 (by default).
 - Columns create gutters (gaps between column content) via padding. That padding is offset in rows for the first and last column via negative margin on <code>.row</code>, by default it's 10px.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/base-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/base-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/base-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/base-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -81,7 +81,7 @@ Media queries is a basis of any Responsive Grid System. To change column behavio
 
 As example column with <code>.M6</code> class will be halfwidth until the window width becomes equal to 768px or less matching <code>$screen--M</code>.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/media-queries.png" width="500" alt="Areas">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/media-queries.png" width="500" alt="Areas">
 
 Predefined break points:
 ```scss
@@ -115,7 +115,7 @@ To change column content behavior...
 
 Wanna different behavior on multiple devices? Try to mix columns.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/mixin-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/mixin-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/mixin-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/mixin-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -137,7 +137,7 @@ You can mix any number of different grid classes
 
 Grid columns can be nested one into another.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/nesting-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/nesting-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/nesting-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/nesting-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -163,7 +163,7 @@ Grid columns can be nested one into another.
 
 Move columns right using <code>--offsetN</code> suffix on grid classes. These will increase left indent of a column. As example <code>.M--offset2</code> moves <code>.M6</code> block over 2 columns.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/offsetting-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/offsetting-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/offsetting-M.jpg" width="90px" alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/offsetting-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -186,8 +186,8 @@ Move columns right using <code>--offsetN</code> suffix on grid classes. These wi
 Grid columns order can be changed in any way with <code>--orderN</code> suffix.
 You can change swap blocks position on different devices. No need to duplicate blocks anymore.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/reordering-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/reordering-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/reordering-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/reordering-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -208,8 +208,8 @@ alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/ma
 
 Well, hard to say what for, but columns can be also reversed with <code>N--reverse</code>
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/reversing-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/reversing-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/reversing-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/reversing-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -237,8 +237,8 @@ alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/ma
 
 There is predefined classes for horizontal alignment with <code class="line-sass-class">--start</code>, <code class="line-sass-class">--center</code>, <code class="line-sass-class">--end</code>.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/aligning-horizontal-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/aligning-horizontal-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/aligning-horizontal-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/aligning-horizontal-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -262,8 +262,8 @@ alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/ma
 There is also predefined classes for vertical alignment with <code class="line-sass-class">--top</code>, <code class="line-sass-class">--middle</code>, <code class="line-sass-class">--bottom</code>.
 Also you can do full height stretch with <code>N--stretch</code>.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/aligning-vertical-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/aligning-vertical-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/aligning-vertical-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/aligning-vertical-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -292,8 +292,8 @@ alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/ma
 
 Another helpful feature can be distribution columns space between or around columns.
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/distribution-between-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/distribution-between-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/distribution-between-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/distribution-between-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">
@@ -308,8 +308,8 @@ alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/ma
 
 #### <a name="distributionAround"></a>Around
 
-<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/distribution-around-M.jpg" width="90px" 
-alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/demo/images/distribution-around-L.jpg" width="307px" alt="Laptop">
+<img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/distribution-around-M.jpg" width="90px" 
+alt="Mobile"><img src="https://raw.githubusercontent.com/godban/flex-box-grid/master/docs/images/distribution-around-L.jpg" width="307px" alt="Laptop">
 
 ```html
 <div class="container">