saphire-new-in

-

 <!DOCTYPE html>

<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
    <script src="https://kit.fontawesome.com/b766c6b920.js" crossorigin="anonymous"></script>
    <link rel="icon" type="image/x-icon" href="/Users/FAIZAN/Desktop/practice/img/sapphiere1.png">
    <title>new-in</title>
</head>

<style>
    * {
        margin: 0;
        padding: 0;
    }
   
    .round {
        position: absolute;
        left: 100px;
        top: 300px;
        width: 525px;
        height: 620px;
        padding: 5px;
    }
   
    .myslides2 {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 300px;
        height: 400px;
    }
   
    .myslides {
        position: absolute;
        left: 20px;
        top: 350px;
        width: 280px;
        height: 350px;
        padding: 5px;
    }
   
    .box1 {
        position: absolute;
        left: 20px;
        top: 700px;
        float: left;
        padding: 3px;
        font-size: small;
    }
   
    .myslides1 {
        position: absolute;
        left: 300px;
        top: 350px;
        width: 280px;
        height: 350px;
        padding: 5px;
    }
   
    .box2 {
        position: absolute;
        left: 300px;
        top: 700px;
        float: left;
        padding: 3px;
        font-size: small;
    }
   
    .myslides2 {
        position: absolute;
        left: 580px;
        top: 350px;
        width: 280px;
        height: 350px;
        padding: 5px;
    }
   
    .box3 {
        position: absolute;
        left: 580px;
        top: 700px;
        float: left;
        padding: 3px;
        font-size: small;
    }
   
    .myslides7 {
        position: absolute;
        left: 860px;
        top: 350px;
        width: 280px;
        height: 350px;
        padding: 5px;
    }
   
    .box4 {
        position: absolute;
        left: 860px;
        top: 700px;
        float: left;
        padding: 3px;
        font-size: small;
    }
   
    .myslides3 {
        position: absolute;
        left: 0px;
        top: 930px;
        width: 400px;
        height: 500px;
        padding: 5px;
    }
   
    .myslides4 {
        position: absolute;
        left: 540px;
        top: 930px;
        width: 400px;
        height: 500px;
        padding: 5px;
    }
   
    .myslides5 {
        position: absolute;
        left: 1075px;
        top: 930px;
        width: 400px;
        height: 500px;
        padding: 5px;
    }
   
    .tutorial {
        position: absolute;
        left: 205px;
        top: 150px;
        width: 120px;
        height: 120px;
        color: grey;
        border: 1px solid grey;
        cursor: pointer;
        border-radius: 50%;
    }
   
    .div {
        position: absolute;
        width: 300px;
        top: 50px;
        left: 100px;
        border-radius: 50%;
    }
   
    .h4 {
        margin: 10px 0px 0px;
        color: black;
        font-size: 12px;
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif
    }
   
    .clothes {
        position: absolute;
        left: 500px;
        top: 140px;
        width: 120px;
        height: 120px;
        border-radius: 50%;
    }
   
    .Ladies {
        position: absolute;
        left: 70px;
        top: 50px;
        width: 500px;
        color: black;
        height: 500px;
        border-radius: 50%;
    }
   
    .text1 {
        position: absolute;
        left: 220px;
        top: 270px;
    }
   
    .kids {
        position: absolute;
        left: 650px;
        top: 140px;
        width: 120px;
        height: 120px;
        border: 1px solid grey;
        cursor: pointer;
        border-radius: 50%;
    }
   
    .costume {
        position: absolute;
        left: 800px;
        top: 140px;
        width: 120px;
        height: 120px;
        border: 1px solid grey;
        cursor: pointer;
        border-radius: 50%;
    }
   
    .sleepwear {
        position: absolute;
        left: 940px;
        top: 140px;
        width: 120px;
        height: 120px;
        border: 1px solid grey;
        cursor: pointer;
        border-radius: 50%;
    }
   
    .dress {
        position: absolute;
        left: 200px;
        top: 800px;
        width: 400px;
        height: 500px;
        margin: 200px;
        border-radius: 50%;
    }
   
    .pretty {
        position: absolute;
        left: 300px;
        top: 800px;
        width: 400px;
        height: 500px;
        border-radius: 50%;
    }
   
    .sample {
        position: absolute;
        left: 450px;
        top: 800px;
        width: 1500px;
        height: 150px;
        border-radius: 50%;
    }
   
    .lady {
        position: absolute;
        left: 300px;
        top: -200px;
        width: 150px;
        height: 150px;
        margin: 200px;
        border-radius: 50%;
    }
   
    .sample-1 {
        position: absolute;
        left: 350px;
        top: 140px;
        width: 120px;
        height: 120px;
        border-radius: 50%;
    }
   
    .pic {
        position: absolute;
        left: 300px;
        top: 400px;
        width: 150px;
        height: 350px;
        border-radius: 50%;
        top: 100px;
    }
   
    .space {
        position: absolute;
        left: 1078px;
        top: 145px;
        width: 120px;
        height: 120px;
        border-radius: 50%;
    }
   
    h2 {
        position: relative;
        left: 50px;
        top: 130px;
    }
   
    .text2 {
        position: absolute;
        left: 400px;
        top: 270px;
    }
   
    .text3 {
        position: absolute;
        left: 550px;
        top: 270px;
    }
   
    .text4 {
        position: absolute;
        left: 700px;
        top: 270px;
    }
   
    .text5 {
        position: absolute;
        left: 810px;
        top: 270px;
    }
   
    .text6 {
        position: absolute;
        left: 970px;
        top: 270px;
    }
   
    .black {
        position: absolute;
        left: 1140px;
        top: 350px;
        width: 280px;
        height: 350px;
        padding: 5px;
    }
   
    .flex-container {
        display: flex;
        flex-wrap: wrap;
    }
   
    .boys {
        position: absolute;
        left: 100px;
        top: 150px;
    }
   
    .good {
        position: absolute;
        left: 150px;
        top: 160px;
    }
   
    body::-webkit-scrollbar {
        display: none;
    }
   
    @media screen and (max-width: 600px) {
        /* styles for screens with a maximum width of 600px */
    }
   
    .header {
        position: relative;
        padding: 10px;
        color: black;
        border-style: solid;
        border-width: 1px;
        width: 100%;
        height: 70px;
    }
   
    .logo {
        position: absolute;
        top: 20px;
        left: 25px;
        height: 30px;
        width: 150px;
    }
   
    * {
        box-sizing: border-box;
    }
   
    form.example input[type=text] {
        position: absolute;
        padding: 10px;
        font-size: 17px;
        border: 1px solid grey;
        left: 400px;
        width: 500px;
        background: #f1f1f1;
        border-radius: 10px 0px 0px 10px;
        border-right: none
    }
   
    form.example button {
        position: absolute;
        left: 900px;
        width: 50px;
        padding: 10px;
        color: grey;
        font-size: 17px;
        border: 1px solid grey;
        border-left: none;
        cursor: pointer;
        border-radius: 0px 10px 10px 0px;
    }
   
    .menu {
        position: absolute;
        left: 400px;
        top: 90px;
        font-size: 24px;
    }
   
    .text7 {
        position: absolute;
        left: 1110px;
        top: 270px;
    }
   
    .box5 {
        position: absolute;
        left: 1130px;
        top: 700px;
        float: left;
        padding: 3px;
        font-size: small;
    }
</style>

<body>
    <div class="header">
        <a href="/Users/FAIZAN/Desktop/practice/html/index.html">
            <img class="logo" src="/Users/FAIZAN/Desktop/practice/img/Sapphire_Logo.png" alt="sapphire-logo">
        </a>

        <form class="example" action="/action_page.php">
            <input type="text" placeholder="FIND YOUR FAVIOURITE" name="search">
            <button type="submit"><i class="fa fa-search"></i></button>
        </form>

        <a href="https://www.faizanssj.com/blog/">
            <i class="fa-solid fa-truck-fast" style="font-size: 32px; position: absolute; left: 1200px;top: 10px;  "></i>
        </a>
        <a href="https://www.faizanssj.com/blog/">
            <i class="fa-solid fa-person" style="font-size: 32px; position: absolute; left: 1250px; top:10px;"></i>
        </a>
        <a href="https://www.faizanssj.com/blog/">
            <i class="fa-solid fa-bag-shopping" style="font-size: 32px; position: absolute; left: 1300px; top:10px;"></i>
        </a>
        <div class="menu">
            <a href="/Users/FAIZAN/Desktop/practice/html/new-in.html" style="text-decoration: none; left: 0px;">New in</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/women.html" style="text-decoration: none;">Women</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/man.html" style="text-decoration: none;">Men</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/beauty.html" style="text-decoration: none;">Beauty</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/accessories.html" style="text-decoration: none;">Accessorries</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/home.html" style="text-decoration: none ;">Home</a>
            <a href="/Users/FAIZAN/Desktop/practice/html/the-edit.html" style="text-decoration: none;">The edit</a>

        </div>
        <h2>NEW IN</h2>



        <div class="flex-container">
            <div>
                <a href="https://www.faizanssj.com/blog/">
                    <img class="tutorial" src="/Users/FAIZAN/Desktop/practice/img/clothes.jpg">
                    <img class="tutorial" src="/Users/FAIZAN/Desktop/practice/img/clothes.jpg">
                    <img class="tutorial" src="/Users/FAIZAN/Desktop/practice/img/to.jpg">
                    <img class="space" src="/users/FAIZAN/Desktop/practice/img/00PRDY23V211_2.jpg">
                    <div class="text7">
                        <h4>dress</h4>
                    </div>
                    <div class="text1">

                        <h4>Ready To Wear</h4>
                    </div>
                    <div>
                        <a href="https://www.faizanssj.com/blog/">
                            <img class="sample-1" src="/Users/FAIZAN/Desktop/practice/img/girl2.jpg">
                            <div class="text2">
                                <h4>Women</h4>
                            </div>

                    </div>

                    <div>
                        <a href="https://www.faizanssj.com/blog/">
                            <img class="clothes" src="/users/FAIZAN/Desktop/practice/img/0F1ELX23V220.1.jpg">
                            <div class="text3">
                                <h4>West</h4>
                            </div>
                    </div>

                    <div>
                        <a href="https://www.faizanssj.com/blog/">
                            <img class="kids" src="/users/FAIZAN/Desktop/practice/img/kids.jpg">
                            <div class="text4">
                                <h4>Kids</h4>
                            </div>
                            <div>
                                <a href="https://www.faizanssj.com/blog/">
                                    <img class="costume" src="/users/FAIZAN/Desktop/practice/img/unstitched-cloth.jpg">
                                    <div class="text5">
                                        <h4>Unstitched</h4>
                                    </div>
                                    <div>
                                        <a href="https://www.faizanssj.com/blog/">
                                            <img class="sleepwear" src="/users/FAIZAN/Desktop/practice/img/sleepwear.jpg">
                                            <div class="text6">
                                                <h4>Sleepwear</h4>
                                            </div>
                                    </div>
                                    <div>
                                        <a href="https://www.faizanssj.com/blog/">
                                            <img class="clothes" src="/users/FAIZAN/Desktop/practice/img/0F1ELX23V220.1.jpg">
                                            <div class="text3">
                                                <h4>West</h4>
                                            </div>
                                            <img class="myslides" src="/Users/FAIZAN/Desktop/practice/img/clothes.jpg">
                                            <div class="box1">PRINTED TISSUE DUPATTA<br>Rs.1990</div>

                                            <img class="myslides1" src="/Users/FAIZAN/Desktop/practice/img/lawn-vol1.jpg">
                                            <div class="box2">PRINTED TISSUE DUPATTA<br>Rs.1990</div>



                                            <img class="myslides2" src="/Users/FAIZAN/Desktop/practice/img/1.jpg ">
                                            <div class="box3">PRINTED CHIFFON DUPATTA><br>Rs.2090</div>
                                            <img class="myslides7" src="/Users/FAIZAN/Desktop/practice/img/dress.jpg ">
                                            <div class="box4"> PRINTED CHIFFON DUPATTA><br>Rs.2090</div>
                                            <img class="black" src="/Users/FAIZAN/Desktop/practice/img/black.jpg" alt="black.jpg">
                                            <div class="box5">PRINTED TISSUE DUPATTA<br>Rs.1990</div>







</body>
</html>

Comments

Post a Comment

Popular posts from this blog

Petroleum

-
 The process is long but some characteristics may resemble and others are common with petroleum @Infrastructure-of-Pakistan  1. Petroleum reactions 2. Catalytic Cracking 3.catalytic Reforming  3. Hydrocracking 4. Isomerization 5. Alkylation 6. Catalytic Cracking 7. Fischer-Tropsch Synthesis 8. Steam Methane Reforming 9. Coal Gasification 10. Methanol Synthesis 11. Methyl Tertiary Butyl Ether (MTBE) Production 12. Ethylene Glycol Production 13. Dimethyl Ether (DME) Synthesis 14. Propylene Glycol Production 15. Naphtha Reforming 16. Bioethanol Production 17. Carbonylation 18. Oxidative Coupling of Methane (OCM) 19. Styrene Production 20. Toluene Disproportionation 21. Benzene Hydrogenation 22. Butadiene Production 23. Ethylene Oxide Production 24. Cumene Process 25. Phenol Production 26. Catalytic Hydration 27. Ethylene Dichloride (EDC) Production 28. Vinyl Chloride Monomer (VCM) Production 29. Chlorination 30. Hydrodechlorination 31. Ethylbenzene Production 32. Chlorohydri...
Read more