Merge pull request #32 from ElizabethBil/your-order

order section add 1440 and edits

src/css/order.css

@@ -12,7 +12,7 @@
 
 @media screen and (min-resolution: 192dpi) and (min-width:375px) {
     .your-order-section {
-        background-image: url('../img/order/[email protected]')
+        background-image: url('../img/order/[email protected]');
     }
 }
 
@@ -135,7 +135,8 @@
 
 @media screen and (min-resolution: 192dpi) and (min-width:768px) {
     .your-order-section {
-        background-image: url('../img/order/[email protected]')
+        background-image: url('../img/order/[email protected]'),
+            url('../img/order/[email protected]');
     }
 }
 
@@ -202,7 +203,8 @@
 
 @media screen and (min-resolution: 192dpi) and (min-width:1280px) {
     .your-order-section {
-        background-image: url('../img/order/[email protected]')
+        background-image: url('../img/order/[email protected]'),
+            url('../img/order/[email protected]');
     }
 }
 
@@ -224,7 +226,6 @@
         margin-bottom: 150px;
     }
 
-
     .order-form-wrapper {
         margin-bottom: 0;
     }
@@ -238,25 +239,52 @@
         margin-left: 50px;
     }
 
-
     .order-title {
         max-width: 545px;
         margin-bottom: 40px;
     }
 
-    .order-content-img-wrapper {
-        margin-left: auto;
-    }
-
     .order-content-img {
-        display: block;
+        margin-left: -36px;
+        height: 521px;
     }
 
     .bkg-ornament-placeholder {
         display: none;
     }
 }
 
-/* ======DESKTOP===== */
+/* ======DESKTOP 1440===== */
+
+@media screen and (min-resolution: 192dpi) and (min-width:1440px) {
+    .your-order-section {
+        background-image: url('../img/order/[email protected]'),
+            url('../img/order/[email protected]');
+    }
+}
+
+
+@media screen and (min-width: 1440px) {
+
+    .your-order-section {
+        background-image: url('../img/order/order-bkg-desktop-1440.jpg'),
+            url('../img/order/bkg-element-desktop-1440.png');
+        background-size: 100% 776px, 323px 484px;
+    }
+
+
+    .order-title {
+        max-width: 666px;
+    }
+
+    .order-content-img {
+        margin-left: 0;
+    }
+
+}
+
+
+
+
 
-@media screen and (min-width: 1440px) {}
+/* ======/DESKTOP===== */

src/partials/order.html

@@ -36,14 +36,13 @@ <h2 class="section-title order-title">
                     </button>
                 </form>
             </div>
-            <div class="order-content-img-wrapper">
-                <img class="order-content-img" srcset="../img/order/order-img-tablet.jpg 638w,
+            <img class="order-content-img" srcset="../img/order/order-img-tablet.jpg 638w,
                             ../img/order/[email protected] 1276w,
                             ../img/order/order-img-desktop.jpg 524w,
                             ../img/order/[email protected] 1048w"
-                    sizes="(min-width: 1280px) 524px, (min-width: 768px) 638x" src="../img/order/order-img-tablet.jpg"
-                    alt="girl-wearing-embroidered-shirt">
-            </div>
+                sizes="(min-width: 1440px) 524px, (min-width: 1280px) 524px, (min-width: 768px) 638x"
+                src="../img/order/order-img-tablet.jpg" alt="girl-wearing-embroidered-shirt">
+
         </div>
         <div class="bkg-ornament-placeholder "></div>
     </div>