├── README.md └── position ├── README.md ├── images ├── boy.jpg ├── girl.jpg ├── boy - 1.jpg ├── boy - 2.jpg ├── girl - 1.jpg └── moshack.jpg ├── index.html └── style └── style.css /README.md: -------------------------------------------------------------------------------- 1 | # position -------------------------------------------------------------------------------- /position/README.md: -------------------------------------------------------------------------------- 1 | # position -------------------------------------------------------------------------------- /position/images/boy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/boy.jpg -------------------------------------------------------------------------------- /position/images/girl.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/girl.jpg -------------------------------------------------------------------------------- /position/images/boy - 1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/boy - 1.jpg -------------------------------------------------------------------------------- /position/images/boy - 2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/boy - 2.jpg -------------------------------------------------------------------------------- /position/images/girl - 1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/girl - 1.jpg -------------------------------------------------------------------------------- /position/images/moshack.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Arshia-mvp/position/HEAD/position/images/moshack.jpg -------------------------------------------------------------------------------- /position/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 |
12 | 22 |
your cart
23 |
(0)
24 |
25 |
26 |
27 |

Your cart is Empty

28 |

Discover something intriguing?
Seize the opportunity now, or other users
might cliam it.

29 | 30 |

or

31 |

Check What Best Sellers Offer

32 |
33 |
34 |
35 |
36 |
37 | 38 |
39 |
40 | 41 | -------------------------------------------------------------------------------- /position/style/style.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-image: url(../images/moshack.jpg); 3 | background-repeat: no-repeat; 4 | background-size: cover; 5 | } 6 | .box{ 7 | width: 100vw; 8 | height: 60px; 9 | background-color: rgba(192, 192, 192, 0.76); 10 | margin-top: -10px; 11 | margin-left: -8px; 12 | } 13 | 14 | .box-3{ 15 | width: 400px; 16 | height: 500px; 17 | background-color: rgba(192, 192, 192, 0.76); 18 | border-radius: 30px; 19 | margin-left: 830px; 20 | margin-top: 40px; 21 | position: absolute; 22 | } 23 | 24 | .p{ 25 | margin-left: 130px; 26 | margin-top: 50px; 27 | } 28 | .p-1{ 29 | margin-left: 10px; 30 | text-align: center; 31 | } 32 | 33 | .input{ 34 | width: 300px; 35 | height: 35px; 36 | border-radius: 30px; 37 | margin-left: 45px; 38 | margin-top: 10px; 39 | } 40 | .input-1{ 41 | width: 300px; 42 | height: 35px; 43 | text-align: center; 44 | background-color: rgb(132, 0, 255); 45 | margin-top: 100px; 46 | border-radius: 30px; 47 | margin-left: -305px; 48 | margin-top: 65px; 49 | position: absolute; 50 | } 51 | .input-1:hover{ 52 | background-color: rgba(97, 9, 179, 0.795); 53 | } 54 | 55 | .p-2{ 56 | margin-left: 190px; 57 | margin-top: 100px; 58 | } 59 | .p-3{ 60 | margin-left: 95px; 61 | } 62 | 63 | .box-4{ 64 | width: 60px; 65 | height: 60px; 66 | background-color: red; 67 | border-radius: 30px; 68 | background-image: url(../images/boy.jpg); 69 | background-size: cover; 70 | margin-top: 30px; 71 | margin-left: 20px; 72 | position: absolute; 73 | } 74 | .box-5{ 75 | width: 60px; 76 | height: 60px; 77 | background-color: red; 78 | border-radius: 30px; 79 | background-image: url(../images/boy\ -\ 1.jpg); 80 | background-size: cover; 81 | margin-left: 95px; 82 | margin-top: 47px; 83 | } 84 | .box-6{ 85 | width: 60px; 86 | height: 60px; 87 | background-color: red; 88 | border-radius: 30px; 89 | background-image: url(../images/boy\ -\ 2.jpg); 90 | background-size: cover; 91 | margin-left: 170px; 92 | margin-top: -60px; 93 | } 94 | .box-7{ 95 | width: 60px; 96 | height: 60px; 97 | background-color: red; 98 | border-radius: 30px; 99 | background-image: url(../images/girl.jpg); 100 | background-size: cover; 101 | margin-left: 245px; 102 | margin-top: -60px; 103 | } 104 | .box-8{ 105 | width: 60px; 106 | height: 60px; 107 | background-color: red; 108 | border-radius: 30px; 109 | background-image: url(../images/girl\ -\ 1.jpg); 110 | background-size: cover; 111 | margin-left: 320px; 112 | margin-top: -60px; 113 | } 114 | .li-1{ 115 | display: block; 116 | margin-top: 18px; 117 | position: absolute; 118 | margin-left: 370px; 119 | } 120 | .li-2{ 121 | display: block; 122 | margin-top: 18px; 123 | position: absolute; 124 | margin-left: 460px; 125 | } 126 | .li-3{ 127 | display: block; 128 | margin-top: 18px; 129 | position: absolute; 130 | margin-left: 580px; 131 | } 132 | .li-4{ 133 | display: block; 134 | margin-top: 18px; 135 | position: absolute; 136 | margin-left: 700px; 137 | } 138 | .li-5{ 139 | display: block; 140 | margin-top: 18px; 141 | position: absolute; 142 | margin-left: 780px; 143 | } 144 | .li-6{ 145 | display: block; 146 | margin-top: 18px; 147 | position: absolute; 148 | margin-left: 1010px; 149 | } 150 | .card-yourcart{ 151 | color: black; 152 | margin-top: 18px; 153 | position: absolute; 154 | margin-left: 1150px; 155 | } 156 | i-1{ 157 | color: black; 158 | margin-top: -545px; 159 | position: absolute; 160 | margin-left: 405px; 161 | } 162 | .f{ 163 | color: black; 164 | margin-top: 18px; 165 | position: absolute; 166 | margin-left: 1270px; 167 | } 168 | --------------------------------------------------------------------------------