├── index.html └── style └── style.css /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | CSS Handson 4 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |
16 |

OUR OFFERINGs

17 |
18 |
19 | 20 | 21 |
22 |
23 | 28 |
29 | 30 |
31 | 32 | 33 |
34 | 35 |
36 |

37 | Lorem ipsum dolor, sit amet consectetur adipisicing elit. Illo rerum quas vel illum atque iure, a obcaecati libero laborum tenetur asperiores, totam provident! Dolor, in! Repellat eius possimus itaque ut! 38 |

39 |
40 | 41 | 42 |
43 |

44 | Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, eum sit vitae, quam soluta odit assumenda iusto, laboriosam ipsum numquam saepe accusamus labore unde asperiores recusandae iste laborum cupiditate voluptatem. 45 |

46 |
47 | 48 |
49 |

50 | Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nihil quisquam corporis vero animi quia nesciunt doloremque placeat ipsum temporibus! Excepturi voluptates, blanditiis totam accusamus eos quae a placeat rerum nemo? 51 |

52 |
53 | 54 |
55 |

56 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus magni, quo veritatis architecto ipsam sequi? Nesciunt provident non temporibus velit doloribus vero voluptate officia. Minima modi in culpa tempore labore. 57 |

58 |
59 |
60 |
61 | 62 | 63 | 64 |
65 |

OUR TOP PERFORMER IN JEE ADVANCE.

66 |
67 | 68 | 69 | 70 |
71 | 72 |
73 |

AKASH GUPTA

74 |

213/300

75 |

GOT IT BOMBAY.

76 |
77 | 78 | 79 |
80 |

Rishav

81 |

203/300

82 |

GOT DELHI

83 |
84 | 85 |
86 |

Gavrav Raj

87 |

192/300

88 |

GOT IT ROORKEE.

89 |
90 | 91 |
92 |

Shivam Chauhan

93 |

176/300

94 |

GOT IT KANPUR.

95 |
96 |
97 | 98 | 99 | 100 |
101 | 102 |
103 |

THE BEST PLACE FOR THE BEST CAREER.

104 |
105 | 106 | 107 |
108 |

You can ask doubt

109 |

in our doubt section.

110 |
111 | 112 |
113 |

Get 30% Off by applying code

114 |

while purchasing course.

115 |
116 | 117 |
118 |

We assure that your hard

119 |

work & our teachin will

120 |

give bright result.

121 |
122 | 123 | 124 |
125 |
126 |
    127 |
  1. Study Material
    2. 128 |
  2. Test
    3. 129 |
  3. Doubt Mentor
    4. 130 |
  4. Lecture
    5. 131 |
  5. Our Subscription
    6. 132 |
  6. Our Faculty
    7. 133 |
134 |
135 |
136 | 137 | 138 |
139 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident temporibus dolore velit, quis quos ducimus natus cupiditate 140 | adipisci tenetur explicabo sint, aperiam quidem qui vita optio reiciendis quasi soluta assumenda officiis consequuntur labore. Odit 141 | blanditiis nisi temporibus debitis culpa dicta?

142 |
143 | 144 |
145 |

ALL THE BEST !

146 |
147 |
148 | 149 | -------------------------------------------------------------------------------- /style/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | /* Header Style */ 7 | .header{ 8 | background: linear-gradient(to right, red 30%, green 50%, yellow); 9 | text-align: center; 10 | text-decoration: underline; 11 | width: 100vw; 12 | 13 | } 14 | .center-contanier{ 15 | width: 700px; 16 | height: 80px; 17 | border: 2px solid red; 18 | background-color: rgba(86, 152, 152, 0.452); 19 | border-radius: 10px; 20 | position: relative; 21 | left: 50%; 22 | transform: translate(-50%); 23 | top: 30px; 24 | text-align: center; 25 | 26 | } 27 | .center-child{ 28 | margin-left: 30%; 29 | padding-right: 30%; 30 | padding-top: 10px; 31 | } 32 | 33 | 34 | /* Grid-contanier style */ 35 | 36 | .Grid-contanier{ 37 | height: 200px; 38 | width: 100vw; 39 | background-color: aqua; 40 | margin-top: 50px; 41 | border: 5px solid grey; 42 | border-radius: 20px; 43 | display: grid; 44 | grid-template-columns: 1fr 1fr 1fr; 45 | column-gap: 40px; 46 | grid-template-rows: 95px 95px; 47 | text-align: center; 48 | font-weight: 900; 49 | 50 | } 51 | .grid-child{ 52 | /* width: 300px; */ 53 | /* height: 70px; * */ 54 | background-color: aquamarine; 55 | border-radius: 5px; 56 | border: 3px solid rgb(16, 62, 1); 57 | } 58 | .child1{ 59 | margin-left: 20px; 60 | } 61 | .child3{ 62 | margin-right: 20px; 63 | } 64 | .child4{ 65 | grid-column: 2/3; 66 | grid-row: 2/3; 67 | } 68 | 69 | /* header-strip Style */ 70 | .strip{ 71 | background: linear-gradient(to right, red, yellow, red); 72 | width: 100%; 73 | height: 40px; 74 | text-align: center; 75 | text-decoration: underline red; 76 | font-weight: 700; 77 | font-size: 20px; 78 | margin: 20px 0; 79 | } 80 | 81 | /* flex-contanier style */ 82 | .flex-contanier{ 83 | width: 100%; 84 | height: 300px; 85 | background-image: radial-gradient(rgba(28, 28, 212, 0.735),rgba(9, 234, 9, 0.794)); 86 | border: 2px solid green; 87 | display: flex; 88 | justify-content: space-evenly; 89 | align-items: center; 90 | } 91 | .flex-child{ 92 | width: 250px; 93 | height: 100px; 94 | border: 2px solid red; 95 | border-radius: 20px; 96 | margin-right: 50px; 97 | background-color: rgba(255, 255, 0, 0.755); 98 | } 99 | .flex-child p{ 100 | padding: 5px; 101 | text-align: center; 102 | text-decoration: underline red; 103 | font-size: 20pxs; 104 | color: red; 105 | font-weight: 700; 106 | } 107 | 108 | /* Lower-grid Style */ 109 | 110 | .Lower-grid-Contanier{ 111 | border: 2px solid grey; 112 | height: 405px; 113 | width: 100%; 114 | display: grid; 115 | grid-template-columns: 1fr 1fr 1fr 100px; 116 | grid-template-rows: 50px 100px 150px 40px; 117 | gap: 20px; 118 | margin: 40px 0; 119 | border: 2px solid grey; 120 | 121 | } 122 | .grid-child1{ 123 | grid-column: 1/5; 124 | grid-row: 1/2; 125 | background-color: rgba(255, 0, 0, 0.795); 126 | text-align: center; 127 | font-size: 30px; 128 | color: #ffff; 129 | font-weight: 700; 130 | } 131 | .grid-child2{ 132 | grid-column: 1/2; 133 | grid-row: 2/3; 134 | background-color: rgba(45, 238, 71, 0.766); 135 | text-align: center; 136 | font-size: 35px; 137 | padding: 5px; 138 | color: #ffff; 139 | font-weight: 700; 140 | } 141 | .grid-child3{ 142 | grid-column: 2/3; 143 | grid-row: 2/3; 144 | background-color: rgb(8, 176, 242); 145 | text-align: center; 146 | font-size: 30px; 147 | padding: 10px; 148 | color: #ffff; 149 | font-weight: 700; 150 | } 151 | .grid-child4{ 152 | grid-column: 3/4; 153 | grid-row: 2/3; 154 | background-color: rgb(63, 63, 196); 155 | text-align: start; 156 | font-size: 30px; 157 | color: #ffff; 158 | font-weight: 700; 159 | 160 | } 161 | .grid-child5{ 162 | grid-column: 4/5; 163 | grid-row: 2/4; 164 | background-color: rgba(0, 0, 0, 0.858); 165 | text-align: center; 166 | font-size: 20px; 167 | color: #ffff; 168 | } 169 | .list{ 170 | margin-left: 5px; 171 | padding-left: 18px; 172 | padding-right: 50px; 173 | text-decoration: underline; 174 | } 175 | 176 | .grid-child6{ 177 | grid-column: 1/4; 178 | grid-row: 3/4; 179 | background-color: rgb(233, 160, 51); 180 | text-align: start; 181 | color: #ffff; 182 | font-size: 25px; 183 | font-weight: 700; 184 | } 185 | .grid-child7{ 186 | grid-column: 1/5; 187 | grid-row: 4/5; 188 | background: skyblue; 189 | text-align: center; 190 | font-size: 25px; 191 | font-weight: 700; 192 | } 193 | 194 | 195 | 196 | --------------------------------------------------------------------------------