├── .eslintrc.json ├── .github └── workflows │ └── linters.yml ├── .gitignore ├── .hintrc ├── .stylelintrc.json ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── SVG ├── 10-about_2013.png ├── 11-about_2011.png ├── BG-about_bg_01.png ├── BGMobile-intro-bg.png ├── Icon - Menu.svg ├── Partner-msme.jpg ├── cross.svg ├── crossWhite-64.png ├── crosswhite.png ├── geminy.jpg ├── gte-ahmedabad-2023.jpg ├── hamburger-menu.svg ├── icon_01.png ├── icon_02.png ├── icon_03.png ├── icon_04.png ├── icon_05.png ├── icons8-facebook-f.svg ├── icons8-twitter.svg ├── lectureIcon.png ├── partner-automation.jpg ├── partner-ex.jpg ├── partner-gear.jpg ├── partner-ggma.jpg ├── program-bg.jpg ├── speaker1.png ├── speaker2.png ├── speaker3.png ├── speaker4.png ├── speaker5.png ├── speaker6.png └── twitter.svg.svg ├── about.css ├── about.html ├── index.html ├── modal.js ├── package-lock.json ├── package.json └── style.css /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es6": true, 5 | "jest": true 6 | }, 7 | "parser": "babel-eslint", 8 | "parserOptions": { 9 | "ecmaVersion": 2018, 10 | "sourceType": "module" 11 | }, 12 | "extends": ["airbnb-base"], 13 | "rules": { 14 | "no-shadow": "off", 15 | "no-param-reassign": "off", 16 | "eol-last": "off", 17 | "import/extensions": [ 1, { 18 | "js": "always", "json": "always" 19 | }] 20 | }, 21 | "ignorePatterns": [ 22 | "dist/", 23 | "build/" 24 | ] 25 | } -------------------------------------------------------------------------------- /.github/workflows/linters.yml: -------------------------------------------------------------------------------- 1 | name: Linters 2 | 3 | on: pull_request 4 | 5 | env: 6 | FORCE_COLOR: 1 7 | 8 | jobs: 9 | lighthouse: 10 | name: Lighthouse 11 | runs-on: ubuntu-22.04 12 | steps: 13 | - uses: actions/checkout@v2 14 | - uses: actions/setup-node@v1 15 | with: 16 | node-version: "12.x" 17 | - name: Setup Lighthouse 18 | run: npm install -g @lhci/cli@0.7.x 19 | - name: Lighthouse Report 20 | run: lhci autorun --upload.target=temporary-public-storage --collect.staticDistDir=. 21 | webhint: 22 | name: Webhint 23 | runs-on: ubuntu-22.04 24 | steps: 25 | - uses: actions/checkout@v2 26 | - uses: actions/setup-node@v1 27 | with: 28 | node-version: "12.x" 29 | - name: Setup Webhint 30 | run: | 31 | npm install --save-dev hint@7.x 32 | [ -f .hintrc ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.hintrc 33 | - name: Webhint Report 34 | run: npx hint . 35 | stylelint: 36 | name: Stylelint 37 | runs-on: ubuntu-22.04 38 | steps: 39 | - uses: actions/checkout@v2 40 | - uses: actions/setup-node@v1 41 | with: 42 | node-version: "12.x" 43 | - name: Setup Stylelint 44 | run: | 45 | npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x 46 | [ -f .stylelintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.stylelintrc.json 47 | - name: Stylelint Report 48 | run: npx stylelint "**/*.{css,scss}" 49 | eslint: 50 | name: ESLint 51 | runs-on: ubuntu-22.04 52 | steps: 53 | - uses: actions/checkout@v2 54 | - uses: actions/setup-node@v1 55 | with: 56 | node-version: "12.x" 57 | - name: Setup ESLint 58 | run: | 59 | npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x 60 | [ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.eslintrc.json 61 | - name: ESLint Report 62 | run: npx eslint . 63 | nodechecker: 64 | name: node_modules checker 65 | runs-on: ubuntu-22.04 66 | steps: 67 | - uses: actions/checkout@v2 68 | - name: Check node_modules existence 69 | run: | 70 | if [ -d "node_modules/" ]; then echo -e "\e[1;31mThe node_modules/ folder was pushed to the repo. Please remove it from the GitHub repository and try again."; echo -e "\e[1;32mYou can set up a .gitignore file with this folder included on it to prevent this from happening in the future." && exit 1; fi -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /.hintrc: -------------------------------------------------------------------------------- 1 | { 2 | "connector": { 3 | "name": "local", 4 | "options": { 5 | "pattern": ["**", "!.git/**", "!node_modules/**"] 6 | } 7 | }, 8 | "extends": ["development"], 9 | "formatters": ["stylish"], 10 | "hints": [ 11 | "button-type", 12 | "disown-opener", 13 | "html-checker", 14 | "meta-charset-utf-8", 15 | "meta-viewport", 16 | "no-inline-styles:error" 17 | ] 18 | } -------------------------------------------------------------------------------- /.stylelintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["stylelint-config-standard"], 3 | "plugins": ["stylelint-scss", "stylelint-csstree-validator"], 4 | "rules": { 5 | "at-rule-no-unknown": [ 6 | true, 7 | { 8 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 9 | } 10 | ], 11 | "scss/at-rule-no-unknown": [ 12 | true, 13 | { 14 | "ignoreAtRules": ["tailwind", "apply", "variants", "responsive", "screen"] 15 | } 16 | ], 17 | "csstree/validator": true 18 | }, 19 | "ignoreFiles": ["build/**", "dist/**", "**/reset*.css", "**/bootstrap*.css", "**/*.js", "**/*.jsx"] 20 | } -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5502 3 | } 4 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 Mujeeb ur Rahman 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![](https://img.shields.io/badge/Microverse-blueviolet) 2 | 3 | # FirstCapStone 4 | 5 | > This project is Microverse Module 1 Capstone project and made with HTML, CSS and JavaScript. 6 | This a website for garment expo India which showcases main events ,highlights and contact informations. 7 | ## Built With 8 | 9 | - HTML 10 | 11 | - Use semantic HTML tags. 12 | - Apply best practices in HTML code. 13 | 14 | - CSS 15 | 16 | - Use CSS selectors correctly. 17 | - Use CSS box model. 18 | - Use Flexbox to place elements in the page. 19 | - Use grid to place elements in the page. 20 | - Media queries use to create UIs adaptable to different screen sizes. 21 | - Mobile Max-width: 768px 22 | - Desktop Min-width: 768px 23 | 24 | - JavaScript 25 | 26 | - Apply JavaScript best practices and language style guides in code. 27 | - Use JavaScript to manipulate DOM elements. 28 | - Use JavaScript events. 29 | - Use objects to store and access data. 30 | 31 | - GitHub 32 | - Use GitHub Pages to deploy web pages. 33 | 34 | ## Live Demo 35 | 36 | - [Live link](https://karanj2212.github.io/CapstoneModule1/) 37 | 38 | ## Getting Started 39 | 40 | **This is an example of how you may give instructions on setting up your project locally.** 41 | **Modify this file to match your project, remove sections that don't apply. For example: delete the testing section if the currect project doesn't require testing.** 42 | 43 | To get a local copy up and running follow these simple example steps. 44 | 45 | ### Prerequisites 46 | 47 | Browser and git 48 | 49 | ### Install 50 | 51 | git clone https://github.com/karanJ2212/CapstoneModule1.git 52 | 53 | ### Usage 54 | 55 | Open in browser 56 | 57 | ### Project Documantaion and short descriptive Video 58 | 59 | - Click on the link for [Short video](https://drive.google.com/file/d/1lVp3tX_Gg4A4OJAKOvW0nrvCbBvRF_CM/view?usp=share_link) 60 | 61 | ## Authors 62 | 63 | 👤 **Author1** 64 | 65 | - GitHub: [@karanJ2212](https://github.com/karanJ2212) 66 | - Twitter: [@karanjain2212](https://twitter.com/karanjain2212) 67 | - LinkedIn: [Karan Jain](https://www.linkedin.com/in/karanjain2212/) 68 | 69 | ## 🤝 Contributing 70 | 71 | Contributions, issues, and feature requests are welcome! 72 | 73 | Feel free to check the [issues page](../../issues/). 74 | 75 | ## Show your support 76 | 77 | Give a ⭐️ if you like this project! 78 | 79 | ## Acknowledgments 80 | 81 | - Thanks to the Microverse team for the great curriculum. 82 | - Thanks to the Code Reviewer(s) for the insightful feedback. 83 | - A great thanks to My coding partner(s), morning session team, and standup team for their contributions. 84 | - Cindy Shin the author of the original design [www.behance.net](https://www.behance.net/gallery/29845175/CC-Global-Summit-2015/) 85 | 86 | ## 📝 License 87 | 88 | This project is [MIT](./LICENSE) licensed. 89 | 90 | Copyright (c) 2022 Mujeeb ur Rahman 91 | 92 | Permission is hereby granted, free of charge, to any person obtaining a copy 93 | of this software and associated documentation files (the "Software"), to deal 94 | in the Software without restriction, including without limitation the rights 95 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 96 | copies of the Software, and to permit persons to whom the Software is 97 | furnished to do so, subject to the following conditions: 98 | 99 | The above copyright notice and this permission notice shall be included in all 100 | copies or substantial portions of the Software. 101 | 102 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 103 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 104 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 105 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 106 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 107 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 108 | SOFTWARE. 109 | -------------------------------------------------------------------------------- /SVG/10-about_2013.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/10-about_2013.png -------------------------------------------------------------------------------- /SVG/11-about_2011.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/11-about_2011.png -------------------------------------------------------------------------------- /SVG/BG-about_bg_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/BG-about_bg_01.png -------------------------------------------------------------------------------- /SVG/BGMobile-intro-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/BGMobile-intro-bg.png -------------------------------------------------------------------------------- /SVG/Icon - Menu.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /SVG/Partner-msme.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/Partner-msme.jpg -------------------------------------------------------------------------------- /SVG/cross.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /SVG/crossWhite-64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/crossWhite-64.png -------------------------------------------------------------------------------- /SVG/crosswhite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/crosswhite.png -------------------------------------------------------------------------------- /SVG/geminy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/geminy.jpg -------------------------------------------------------------------------------- /SVG/gte-ahmedabad-2023.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/gte-ahmedabad-2023.jpg -------------------------------------------------------------------------------- /SVG/hamburger-menu.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /SVG/icon_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/icon_01.png -------------------------------------------------------------------------------- /SVG/icon_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/icon_02.png -------------------------------------------------------------------------------- /SVG/icon_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/icon_03.png -------------------------------------------------------------------------------- /SVG/icon_04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/icon_04.png -------------------------------------------------------------------------------- /SVG/icon_05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/icon_05.png -------------------------------------------------------------------------------- /SVG/icons8-facebook-f.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /SVG/icons8-twitter.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /SVG/lectureIcon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/lectureIcon.png -------------------------------------------------------------------------------- /SVG/partner-automation.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/partner-automation.jpg -------------------------------------------------------------------------------- /SVG/partner-ex.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/partner-ex.jpg -------------------------------------------------------------------------------- /SVG/partner-gear.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/partner-gear.jpg -------------------------------------------------------------------------------- /SVG/partner-ggma.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/partner-ggma.jpg -------------------------------------------------------------------------------- /SVG/program-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/program-bg.jpg -------------------------------------------------------------------------------- /SVG/speaker1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker1.png -------------------------------------------------------------------------------- /SVG/speaker2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker2.png -------------------------------------------------------------------------------- /SVG/speaker3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker3.png -------------------------------------------------------------------------------- /SVG/speaker4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker4.png -------------------------------------------------------------------------------- /SVG/speaker5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker5.png -------------------------------------------------------------------------------- /SVG/speaker6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/karanJ2212/CapstoneModule1/4c436ab59f75eab04b5db1611270dd44d19b4371/SVG/speaker6.png -------------------------------------------------------------------------------- /SVG/twitter.svg.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /about.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,700&display=swap"); 2 | 3 | * { 4 | font-family: "Lato", sans-serif; 5 | font-style: normal; 6 | box-sizing: border-box; 7 | margin: 0; 8 | scroll-behavior: smooth; 9 | } 10 | 11 | .bgImg { 12 | background-image: url("SVG/BG-about_bg_01.png"); 13 | background-repeat: no-repeat; 14 | background-size: 100% auto; 15 | background-color: #f7f7f8; 16 | } 17 | 18 | .navbar-mob-about { 19 | background-color: #f7f7f8; 20 | } 21 | 22 | .main { 23 | display: flex; 24 | flex-direction: column; 25 | align-items: center; 26 | justify-content: center; 27 | text-align: center; 28 | } 29 | 30 | .headline { 31 | padding-top: 10px; 32 | text-align: center; 33 | margin: 0 25px; 34 | color: #ef1f08; 35 | margin-top: 5px; 36 | line-height: 30px; 37 | margin-bottom: 10px; 38 | } 39 | 40 | .main hr { 41 | width: 32px; 42 | border: 1px solid #ec5242; 43 | margin: 0 auto 24px; 44 | } 45 | 46 | .headline_detail { 47 | font-size: 12px; 48 | padding: 16px; 49 | margin: 26px; 50 | line-height: 20px; 51 | background-color: #fff; 52 | } 53 | 54 | .desktopHeadlineDetail { 55 | display: none; 56 | } 57 | 58 | .contact { 59 | display: flex; 60 | flex-direction: column; 61 | margin: 0 42px; 62 | font-size: 12px; 63 | line-height: 20px; 64 | margin-bottom: 30px; 65 | } 66 | 67 | .contact-details { 68 | display: flex; 69 | flex-direction: column; 70 | gap: 5px; 71 | } 72 | 73 | .icon-list { 74 | display: flex; 75 | margin-bottom: 12px; 76 | gap: 10px; 77 | text-align: left; 78 | font-size: 12px; 79 | line-height: 20px; 80 | align-items: center; 81 | } 82 | 83 | .headline > h4 { 84 | font-weight: 400; 85 | } 86 | 87 | .headline > h1 { 88 | font-weight: 900; 89 | } 90 | 91 | /* logo */ 92 | .logo1 { 93 | display: flex; 94 | flex-direction: column; 95 | align-items: center; 96 | text-align: center; 97 | margin: 50px; 98 | } 99 | 100 | .logo_dtitle { 101 | display: none; 102 | } 103 | 104 | .guidbar { 105 | width: 32px; 106 | height: 16px; 107 | border-bottom: 1px solid #ec5242; 108 | margin: 0 auto 24px; 109 | } 110 | 111 | .logo_details { 112 | margin: 0 40px 40px 40px; 113 | color: #808080; 114 | font-size: 18px; 115 | background-color: white; 116 | padding: 18px; 117 | } 118 | 119 | .logo_img img { 120 | width: 90%; 121 | margin-bottom: 40px; 122 | } 123 | 124 | /* photos section */ 125 | 126 | .photos { 127 | display: flex; 128 | flex-direction: column; 129 | align-items: center; 130 | justify-content: center; 131 | text-align: center; 132 | } 133 | 134 | .photos_details { 135 | padding: 10px 80px; 136 | margin-bottom: 30px; 137 | color: #808080; 138 | } 139 | 140 | .photos img { 141 | width: 90%; 142 | margin-bottom: 12px; 143 | } 144 | 145 | /* partner section start */ 146 | 147 | .partner { 148 | background-color: #272a31; 149 | color: #fff; 150 | display: flex; 151 | flex-direction: column; 152 | align-items: center; 153 | margin-top: 12px; 154 | } 155 | 156 | .partner_title { 157 | margin-top: 30px; 158 | } 159 | 160 | .partner_logo { 161 | display: grid; 162 | grid-template-columns: 1fr 1fr 1fr; 163 | column-gap: 20px; 164 | row-gap: 20px; 165 | margin: 0 40px; 166 | margin-bottom: 20px; 167 | justify-content: center; 168 | align-items: center; 169 | } 170 | 171 | .partner_logo img { 172 | width: 100%; 173 | } 174 | 175 | /* footer start */ 176 | 177 | .mobile-footer { 178 | display: flex; 179 | align-items: center; 180 | justify-content: center; 181 | gap: 20px; 182 | } 183 | 184 | .mobile-footer img { 185 | width: 50%; 186 | padding-left: 80px; 187 | padding-top: 20px; 188 | padding-bottom: 20px; 189 | } 190 | 191 | .mobile-footer h6 { 192 | color: #272a31; 193 | margin-right: 30px; 194 | font-weight: 800; 195 | font-size: 16px; 196 | } 197 | 198 | @media (min-width: 768px) { 199 | .socialWrapper { 200 | position: relative; 201 | display: block; 202 | background: #272a31; 203 | height: 30px; 204 | width: 100%; 205 | align-items: center; 206 | justify-content: right; 207 | } 208 | 209 | .social { 210 | position: absolute; 211 | right: 170px; 212 | display: flex; 213 | gap: 20px; 214 | } 215 | 216 | .navItem a { 217 | color: #6f7074; 218 | font-size: 18px; 219 | } 220 | 221 | .box a { 222 | color: #fff; 223 | font-size: 18px; 224 | } 225 | 226 | .social a { 227 | text-decoration: none; 228 | color: #fff; 229 | } 230 | 231 | .social a:hover { 232 | color: #ec5242; 233 | text-decoration: underline; 234 | } 235 | 236 | .nav-bar { 237 | position: relative; 238 | width: 100%; 239 | background-color: #fff; 240 | height: 80px; 241 | display: flex; 242 | align-items: center; 243 | } 244 | 245 | .hamburger { 246 | display: none; 247 | } 248 | 249 | .logo { 250 | display: flex; 251 | } 252 | 253 | .logoListWrapper { 254 | display: flex; 255 | width: 100%; 256 | align-items: center; 257 | justify-content: space-around; 258 | margin: 20px 0; 259 | } 260 | 261 | .nav-list { 262 | position: relative; 263 | transform: translateY(0); 264 | display: flex; 265 | align-items: center; 266 | transition: none; 267 | background: none; 268 | gap: 25px; 269 | margin: 0; 270 | padding: 0; 271 | } 272 | 273 | .navItem { 274 | margin: 0; 275 | } 276 | 277 | .navItem:hover { 278 | transform: none; 279 | } 280 | 281 | .navItem a:hover { 282 | text-decoration: underline; 283 | color: #ec5242; 284 | } 285 | 286 | .box { 287 | margin: 0; 288 | padding: 0; 289 | height: 40px; 290 | width: 140px; 291 | background-color: #ec5242; 292 | border: none; 293 | padding-top: 2px; 294 | } 295 | 296 | .box a:hover { 297 | color: #272a31; 298 | } 299 | 300 | .bgImg { 301 | margin-top: 0; 302 | } 303 | 304 | /* ----- Main section and headline start */ 305 | 306 | .headline { 307 | padding: 20px; 308 | font-size: 2.2rem; 309 | line-height: 56px; 310 | } 311 | 312 | .headline_detail { 313 | display: none; 314 | } 315 | 316 | .desktopHeadlineDetail { 317 | display: block; 318 | font-size: 16px; 319 | line-height: 30px; 320 | padding: 20px 25px; 321 | margin: 85px; 322 | margin-top: 10px; 323 | background-color: #fff; 324 | text-align: justify; 325 | } 326 | 327 | .contact { 328 | font-size: 16px; 329 | margin-bottom: 80px; 330 | } 331 | 332 | .contact p { 333 | font-size: 1.1rem; 334 | line-height: 40px; 335 | } 336 | 337 | .logo_title { 338 | display: none; 339 | } 340 | 341 | .logo_dtitle { 342 | display: block; 343 | font-size: 30px; 344 | } 345 | 346 | /* photos section */ 347 | 348 | .photos { 349 | border-top: #f3f3f3 solid 1px; 350 | width: 100%; 351 | } 352 | 353 | .photos_title { 354 | font-size: 30px; 355 | padding-top: 30px; 356 | } 357 | 358 | .photos_details { 359 | font-size: 18px; 360 | } 361 | 362 | .images { 363 | display: flex; 364 | gap: 24px; 365 | } 366 | 367 | /* partner section start */ 368 | 369 | .mainProgramHeading-abt { 370 | /* font-size: 36px; */ 371 | display: none; 372 | } 373 | 374 | .partner_logo { 375 | display: none; 376 | 377 | /* display: grid; 378 | grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 379 | padding: 0 100px; 380 | align-items: center; 381 | justify-content: center; 382 | padding-bottom: 30px; 383 | column-gap: 0; 384 | row-gap: 0; */ 385 | } 386 | 387 | .partner_logo img { 388 | width: 80%; 389 | } 390 | 391 | /* footer start */ 392 | 393 | .mobile-footer { 394 | display: grid; 395 | grid-template-columns: 1fr 1fr; 396 | background-color: #272a31; 397 | } 398 | 399 | .mobile-footer img { 400 | width: 60%; 401 | padding-left: 100px; 402 | padding-top: 20px; 403 | padding-bottom: 20px; 404 | } 405 | 406 | .mobile-footer h6 { 407 | margin-right: 30px; 408 | font-size: 18px; 409 | font-weight: 400; 410 | padding-right: 200px; 411 | color: #fff; 412 | } 413 | } 414 | -------------------------------------------------------------------------------- /about.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 13 | 17 | About 18 | 19 | 20 |
21 |
22 |
23 | menu 29 | menu 36 |
37 |
38 | 46 |
47 | 48 |
49 |
50 | 65 |
66 |
67 | 70 | 77 |
78 |
79 |
80 |
81 | 82 |
83 |
84 |

About Garment Technology Expo

85 |

86 | South East Asia's most comprehensive apparel production technology 87 | show. 88 |

89 |
90 |
91 |

92 | GTE, known to showcase the latest machines and processes. Nearly 85% 93 | of the participants in the initial editions of GTE continue to be 94 | steadfast. New innovations, productlaunches, product upgrades, live 95 | demonstrations, new materials, etc. are the cornerstone of each 96 | successive show. 97 |

98 |

99 | The biggest industry show in the subcontinent, GTE New Delhi is 100 | patronized by trade professionals who include manufacturers, 101 | exporters, institutions and other volume consumers. Besides, Owners, 102 | CEOs, MDs and Production Heads who visit to see, compare and 103 | negotiate deals for new machinery,designers, technical supervisors, 104 | shop floor managers, etcvisit to update themselves on new 105 | technologies, materials, the latest product launches and new 106 | innovations at GTE. 107 |

108 | 119 |
120 |

Garment Technology Expo Pvt. Ltd.

121 |
122 | 123 |

124 | C-17, 2nd Floor, DDA Sheds, Okhla Industrial Area, Phase-I,
125 | New Delhi - 110020, INDIA 126 |

127 |

128 |
129 |
130 | 131 |

+91-11 41601663

132 |

133 |
134 |
135 | 136 |

137 | 138 | info@garmenttechnologyexpo.com 140 |

141 |

142 |
143 |
144 |
145 | 146 | 147 |
148 | 149 | 159 | 176 | 177 | 178 |
179 |

See the past DY Global Summits

180 |
181 |

182 | Take a look at the last two DY Global Summits which took place in 183 | Buenos Aires and in warsaw. 184 |

185 |
186 | GTE Summit 2013 in MUMBAI 190 | GTE Summit 2011 in CHENNAI 194 |
195 |
196 | 197 | 198 |
199 |
200 |

Partners

201 |
202 |
203 | 204 | 211 |
212 | 213 | 214 | 218 |
219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | 228 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 16 | 17 | Garment expo 2022 18 | 19 | 20 |
21 |
22 |
23 |
24 | menu 30 | menu 37 |
38 | 48 | 49 |
50 |
51 | 66 |
67 |
68 | 71 | 78 |
79 |
80 |
81 | 82 |
83 |
84 |

Hello World ! Welcome To

85 |

GARMENT TECHNOLOGY EXPO (GTE)

86 |
87 |
88 |

89 | Garment Technology Expo, south east Asia’s largest events 90 | committed to apparel technology in India is going to hold it’s 91 | 32nd edition. 92 |

93 |
94 |
95 |

AHEMDABAD 2-3-4 march 2023

96 |

DELHI NCR 23 24 july 2023

97 |
98 |
99 |
100 |
101 |
102 |

Main Program

103 |
104 |
105 |
106 |
107 |
108 | 109 |
110 |
lecture
111 |

112 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae 113 | cupiditate quia et, reiciendis . 114 |

115 |
116 | 117 |
118 |
119 | 120 |
121 |
Theory
122 |

123 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae 124 | cupiditate quia et, reiciendis 125 |

126 |
127 | 128 |
129 |
130 | 131 |
132 |
Forum
133 |

134 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae 135 | cupiditate quia et, reiciendis 136 |

137 |
138 |
139 |
140 | 141 |
142 |
workshop
143 |

144 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae 145 | cupiditate quia et, reiciendis c 146 |

147 |
148 |
149 |
150 | 151 |
152 |
CC Ignite
153 |

154 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae 155 | cupiditate quia et, reiciendis 156 |

157 |
158 |
159 | 160 | SEE THE WHOLE PROGRAM 161 |
162 | 163 | 164 |
165 |
166 |

Featured Speakers

167 |
168 |
169 |
170 |
171 | 172 | 173 |
174 |
175 |

Partners

176 |
177 |
178 | 179 | 186 |
187 | 188 | 189 | 193 |
194 | 195 | 196 | 197 | -------------------------------------------------------------------------------- /modal.js: -------------------------------------------------------------------------------- 1 | // mobile menu toggle 2 | 3 | const hamburger = document.querySelector('.hamburger'); 4 | const closebtn = document.querySelector('.closebtn'); 5 | const navHeader = document.querySelector('.header'); 6 | const toggleNavlist = () => { 7 | navHeader.classList.toggle('active'); 8 | }; 9 | 10 | hamburger.addEventListener('click', () => toggleNavlist()); 11 | 12 | closebtn.addEventListener('click', () => { 13 | if (navHeader.classList.contains('active')) { 14 | navHeader.classList.remove('active'); 15 | } 16 | }); 17 | 18 | // dynamically populating speakers section start 19 | 20 | const speakersData = [ 21 | { 22 | speakerName: 'Yochai Benkler', 23 | speakerTitle: 'Professor at Harvard Law School', 24 | speakerImage: 'SVG/speaker1.png', 25 | speakerabout: 26 | 'Focusing on a collaborative approach in a networked environment, he created the concept of co-production based on sharing, such as open source software and Wikipedia.', 27 | }, 28 | { 29 | speakerName: 'Kilnam Chon', 30 | speakerTitle: 31 | 'Emeritus Professor, Korea Advanced Institute of Science and Technology (KAIST)', 32 | speakerImage: 'SVG/speaker2.png', 33 | speakerabout: 34 | "By developing Asia's first Internet protocol network SDN and leading Korea's first private line Internet connection in 1990, it ushered in the era of the Internet in earnest.", 35 | }, 36 | { 37 | speakerName: 'Sohyeong Noh', 38 | speakerTitle: 'Art Center Nabi Director, CC Korea Director', 39 | speakerImage: 'SVG/speaker3.png', 40 | speakerabout: 41 | "As the author of , he opened 'Art Center Nabi', Korea's first digital art institution in 2000, and is currently serving.", 42 | }, 43 | { 44 | speakerName: 'Julia Reda', 45 | speakerTitle: 'Head of the Young Pirates of Europe', 46 | speakerImage: 'SVG/speaker4.png', 47 | speakerabout: 48 | "European integration and online youth participation in politics and democracy are major concerns, and a report has been published that will potentially affect the revision of the EU's copyright law in July.", 49 | }, 50 | { 51 | speakerName: 'Lila Tretikov', 52 | speakerTitle: 'Secretary General of the Wikimedia Foundation', 53 | speakerImage: 'SVG/speaker5.png', 54 | speakerabout: 55 | "Layla Tretikov is the general secretary of the Wikimedia Foundation, a non-profit organization that runs Wikipedia. Wikipedia is provided free of charge in 290 languages ​​every month to over 100 million people, nearly half of the world's population.", 56 | }, 57 | { 58 | speakerName: 'Ryan Merkley', 59 | speakerTitle: 'Creative Commons CEO, Former Mozilla Foundation COO', 60 | speakerImage: 'SVG/speaker6.png', 61 | speakerabout: 62 | 'He led open source projects at the Mozilla Foundation and joined CC as CEO in 2014. He has been active in open movements such as open government and open source.', 63 | }, 64 | ]; 65 | 66 | const speakerGrid = document.querySelector('.speakerGrid'); 67 | for (let i = 0; i < speakersData.length; i += 1) { 68 | speakerGrid.innerHTML += `
69 | 70 |
71 |
${speakersData[i].speakerName}
72 |
73 | ${speakersData[i].speakerTitle} 74 |
75 |
76 |

77 | ${speakersData[i].speakerabout} 78 |

79 |
80 |
81 | `; 82 | } 83 | 84 | // end 85 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "firstcapstone", 3 | "version": "1.0.0", 4 | "description": "This project is First Capstone and made with HTML, CSS and JavaScript.", 5 | "main": "modal.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "git+https://github.com/Mujeeb4582/FirstCapStone.git" 12 | }, 13 | "keywords": [], 14 | "author": "", 15 | "license": "ISC", 16 | "bugs": { 17 | "url": "https://github.com/Mujeeb4582/FirstCapStone/issues" 18 | }, 19 | "homepage": "https://github.com/Mujeeb4582/FirstCapStone#readme", 20 | "devDependencies": { 21 | "babel-eslint": "^10.1.0", 22 | "eslint": "^7.32.0", 23 | "eslint-config-airbnb-base": "^14.2.1", 24 | "eslint-plugin-import": "^2.26.0", 25 | "hint": "^7.1.3", 26 | "stylelint": "^13.13.1", 27 | "stylelint-config-standard": "^21.0.0", 28 | "stylelint-csstree-validator": "^1.9.0", 29 | "stylelint-scss": "^3.21.0" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,700&display=swap"); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | font-family: "Lato", sans-serif; 7 | font-style: normal; 8 | box-sizing: border-box; 9 | scroll-behavior: smooth; 10 | } 11 | 12 | .container { 13 | max-width: 100% !important; 14 | overflow-x: hidden; 15 | } 16 | 17 | header { 18 | /* mobile menu changes */ 19 | position: relative; 20 | } 21 | 22 | .menuIcon { 23 | width: 50px; 24 | margin: 5%; 25 | z-index: 999; 26 | } 27 | 28 | .menuIcon[name="cross"] { 29 | display: none; 30 | } 31 | 32 | .navlinks { 33 | display: flex; 34 | flex-direction: column; 35 | background: #d3d3d3; 36 | mix-blend-mode: normal; 37 | box-shadow: 0 48px 48px rgba(37, 47, 137, 0.08); 38 | width: 120%; 39 | height: 100vh; 40 | position: absolute; 41 | top: 0; 42 | right: -40px; 43 | padding: 73px 20px 0 20px; 44 | transform: translateY(-100%); 45 | transition: all 0.5s linear; 46 | 47 | /* opacity: 0; 48 | visibility: hidden; 49 | pointer-events: none; */ 50 | } 51 | 52 | .menuList { 53 | /* display: none; */ 54 | 55 | list-style: none; 56 | } 57 | 58 | .navItem { 59 | display: block; 60 | margin: 2rem 0; 61 | font-size: 1.5rem; 62 | text-decoration: none; 63 | text-align: center; 64 | } 65 | 66 | .box { 67 | border: #d3d3d3 solid 3px; 68 | border-radius: 8px; 69 | margin: 0 130px; 70 | padding: 15px 0; 71 | } 72 | 73 | .box:hover { 74 | border-color: #272a31; 75 | transform: scale(1.2); 76 | } 77 | 78 | .menuList a { 79 | color: #fff; 80 | text-decoration: none; 81 | font-family: Inter, sans-serif; 82 | font-size: 32px; 83 | font-weight: 700; 84 | line-height: 44px; 85 | letter-spacing: 0; 86 | text-align: left; 87 | } 88 | 89 | .navItem:hover { 90 | transform: scale(1.1); 91 | } 92 | 93 | .navItem a:hover { 94 | text-decoration: underline; 95 | color: #272a31; 96 | } 97 | 98 | .menuIcon:hover { 99 | background-color: #ec5242; 100 | color: #fff; 101 | border-radius: 4px; 102 | transform: scale(1.3); 103 | } 104 | 105 | .active .navlinks { 106 | transform: translateY(0); 107 | 108 | /* opacity: 1; 109 | visibility: visible; 110 | pointer-events: auto; */ 111 | } 112 | 113 | .active .closebtn { 114 | display: block; 115 | position: absolute; 116 | } 117 | 118 | .active .hamburger { 119 | display: none; 120 | } 121 | 122 | .navbar-dt { 123 | display: none; 124 | } 125 | 126 | .bgImg { 127 | background-image: url(SVG/BGMobile-intro-bg.png); 128 | background-size: cover; 129 | height: 100vh; 130 | width: 100vw; 131 | margin-bottom: 40px; 132 | background-position: top; 133 | } 134 | 135 | .intro { 136 | display: flex; 137 | flex-direction: column; 138 | gap: 20px; 139 | padding: 5%; 140 | margin-bottom: 10px; 141 | align-items: center; 142 | 143 | /* max-width: 575px; */ 144 | } 145 | 146 | .homePage { 147 | margin-bottom: 200px; 148 | } 149 | 150 | .heading > h4 { 151 | font-weight: 400; 152 | font-size: 21px; 153 | } 154 | 155 | .heading > h1 { 156 | font-weight: 900; 157 | font-size: 36px; 158 | } 159 | 160 | .heading { 161 | text-align: left; 162 | margin: 0 55px; 163 | color: #ef1f08; 164 | line-height: 40px; 165 | } 166 | 167 | .discription { 168 | margin: 57px 25px 0 25px; 169 | padding: 0px 30px; 170 | line-height: 25px; 171 | word-break: break-all; 172 | text-align: justify; 173 | background-color: rgb(247, 247, 248); 174 | color: rgb(111, 112, 116); 175 | flex-wrap: wrap; 176 | } 177 | 178 | .timing { 179 | text-align: center; 180 | width: 100%; 181 | margin: 0; 182 | padding-top: 60px; 183 | padding-bottom: 10px; 184 | background-color: rgb(247, 247, 248); 185 | color: #272a31; 186 | font-weight: 900; 187 | font-size: 20px; 188 | line-height: 40px; 189 | } 190 | 191 | /* main program section */ 192 | .mainProgram { 193 | background-image: url("SVG/program-bg.jpg"); 194 | color: #fff; 195 | text-align: center; 196 | padding-top: 50px; 197 | padding-left: 16px; 198 | padding-right: 16px; 199 | } 200 | 201 | .mainProgramHeading { 202 | display: flex; 203 | flex-direction: column; 204 | align-items: center; 205 | } 206 | 207 | .mainProgramHeading h3 { 208 | font-size: 26px; 209 | } 210 | 211 | .mainProgramHeading hr { 212 | border: 2px solid #ff6b00; 213 | width: 50px; 214 | } 215 | 216 | .guidbar { 217 | width: 53px; 218 | height: 16px; 219 | border-bottom: 1px solid #ec5242; 220 | margin: 0 auto 54px; 221 | } 222 | 223 | .mainProgramEvents { 224 | background: rgba(255, 255, 255, 0.1); 225 | display: flex; 226 | align-items: center; 227 | padding: 16px; 228 | margin-bottom: 8px; 229 | gap: 8px; 230 | } 231 | 232 | .mainProgramTitle { 233 | font-size: 14px; 234 | color: #ec5242; 235 | float: left; 236 | text-align: center; 237 | width: 50%; 238 | } 239 | 240 | .mainprogramDescription { 241 | text-align: left; 242 | font-size: 12px; 243 | width: calc(100% - 6.5em); 244 | color: #d3d3d3; 245 | } 246 | 247 | .joinNow { 248 | background-color: #ec5242; 249 | color: #d3d3d3; 250 | border: none; 251 | font-size: 14px; 252 | padding: 16px; 253 | margin: 40px 0; 254 | cursor: pointer; 255 | } 256 | 257 | .joinNow:hover { 258 | background-color: #d3d3d3; 259 | color: #ec5242; 260 | transform: scale(1.1); 261 | } 262 | 263 | .see { 264 | display: none; 265 | } 266 | 267 | /* speaker section */ 268 | 269 | .speakerGrid { 270 | display: grid; 271 | row-gap: 24px; 272 | padding: 5% 5%; 273 | } 274 | 275 | .speakerWraper { 276 | display: flex; 277 | gap: 12px; 278 | } 279 | 280 | .speakerDescription { 281 | display: flex; 282 | flex-direction: column; 283 | gap: 15px; 284 | } 285 | 286 | .speakerDescription hr { 287 | width: 100px; 288 | color: #ec5242; 289 | } 290 | 291 | .speakerDescription h5 { 292 | color: black; 293 | font-weight: 700; 294 | font-size: 24px; 295 | } 296 | 297 | .speakerDescription h6 { 298 | color: #ec5242; 299 | text-decoration: wavy; 300 | font-style: italic; 301 | font-size: 14px; 302 | } 303 | 304 | .speakerDescription p { 305 | width: 90%; 306 | max-width: 577px; 307 | } 308 | 309 | .partner { 310 | background-color: #272a31; 311 | color: #fff; 312 | display: flex; 313 | flex-direction: column; 314 | align-items: center; 315 | margin-top: 12px; 316 | } 317 | 318 | .partner_logo { 319 | display: grid; 320 | grid-template-columns: 1fr 1fr 1fr; 321 | column-gap: 20px; 322 | row-gap: 20px; 323 | margin: 0 40px; 324 | margin-bottom: 20px; 325 | justify-content: center; 326 | align-items: center; 327 | } 328 | 329 | .partner_logo img { 330 | width: 80%; 331 | } 332 | 333 | /* footer start */ 334 | 335 | .mobile-footer { 336 | display: flex; 337 | align-items: center; 338 | justify-content: center; 339 | gap: 20px; 340 | } 341 | 342 | .mobile-footer img { 343 | width: 20%; 344 | padding-left: 80px; 345 | padding-top: 20px; 346 | padding-bottom: 20px; 347 | } 348 | 349 | .mobile-footer h6 { 350 | color: #272a31; 351 | margin-right: 30px; 352 | font-weight: 800; 353 | font-size: 10px; 354 | } 355 | 356 | @media all and (min-width: 768px) { 357 | .navbar-dt { 358 | display: block; 359 | } 360 | 361 | .navbar-mob { 362 | display: none; 363 | } 364 | 365 | .socialHeader { 366 | background-color: black; 367 | } 368 | 369 | .socialHeaderList { 370 | list-style: none; 371 | display: flex; 372 | justify-content: flex-end; 373 | align-items: center; 374 | gap: 25px; 375 | padding-right: 10%; 376 | } 377 | 378 | .socialHeaderList img { 379 | width: 20px; 380 | } 381 | 382 | .socialHeaderList li a { 383 | text-decoration: none; 384 | color: white; 385 | } 386 | 387 | .mainHeader { 388 | background-color: white; 389 | height: 60px; 390 | display: flex; 391 | justify-content: space-around; 392 | align-items: center; 393 | padding-left: 5%; 394 | } 395 | 396 | .logo img { 397 | width: 100px; 398 | } 399 | 400 | .menuList { 401 | list-style: none; 402 | display: flex; 403 | gap: 60px; 404 | padding-right: 5%; 405 | } 406 | 407 | .menuList li a { 408 | text-decoration: none; 409 | font-size: 20px; 410 | font-weight: 700; 411 | color: black; 412 | } 413 | 414 | /* homepage/heading section */ 415 | .homePage { 416 | display: flex; 417 | flex-direction: column; 418 | justify-content: left; 419 | } 420 | 421 | .heading { 422 | text-align: left; 423 | margin-left: 100px; 424 | line-height: 80px; 425 | } 426 | 427 | .heading > h4 { 428 | font-size: 46px; 429 | } 430 | 431 | .heading > h1 { 432 | font-size: 72px; 433 | } 434 | 435 | .discription { 436 | margin: 83px 25px 0 25px; 437 | padding: 0px 8px; 438 | line-height: 25px; 439 | word-break: break-all; 440 | text-align: justify; 441 | background-color: rgb(247, 247, 248); 442 | color: rgb(111, 112, 116); 443 | flex-wrap: wrap; 444 | } 445 | 446 | .timing { 447 | text-align: left; 448 | padding-left: 95px; 449 | } 450 | 451 | .timing h3 { 452 | font-size: 46px; 453 | line-height: 66px; 454 | } 455 | 456 | /* main program start */ 457 | .programWraper { 458 | display: flex; 459 | justify-content: center; 460 | align-items: center; 461 | gap: 8px; 462 | margin: 0 40px; 463 | } 464 | 465 | .mainProgramHeading { 466 | font-size: 30px; 467 | } 468 | 469 | .mainProgramEvents { 470 | flex-direction: column; 471 | border-radius: 10px; 472 | } 473 | 474 | .mainProgramTitle { 475 | font-size: 20px; 476 | width: 100%; 477 | } 478 | 479 | .mainprogramDescription { 480 | text-align: center; 481 | font-size: 14px; 482 | width: 100%; 483 | padding-bottom: 12px; 484 | } 485 | 486 | .mainProgramEvents:hover { 487 | border: #ec5242 3px solid; 488 | transform: scale(1.001); 489 | } 490 | 491 | .joinNow { 492 | display: none; 493 | } 494 | 495 | .see { 496 | display: block; 497 | color: #d3d3d3; 498 | font-size: 18px; 499 | padding: 66px; 500 | letter-spacing: 2px; 501 | } 502 | 503 | .see:hover { 504 | color: #ec5242; 505 | } 506 | 507 | /* speaker section */ 508 | 509 | .speakerGrid { 510 | display: grid; 511 | grid-template-columns: 1fr 1fr; 512 | padding: 60px; 513 | min-width: 100%; 514 | } 515 | 516 | .mainProgramHeading h3 { 517 | text-align: center; 518 | margin-top: 36px; 519 | margin-top: 90px; 520 | font-size: 36px; 521 | } 522 | 523 | .partner_logo { 524 | display: grid; 525 | grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 526 | padding: 0 100px; 527 | align-items: center; 528 | justify-content: center; 529 | padding-bottom: 30px; 530 | column-gap: 0; 531 | row-gap: 0; 532 | } 533 | 534 | .partner_logo img { 535 | width: 80%; 536 | } 537 | 538 | .mobile-footer { 539 | display: grid; 540 | grid-template-columns: 1fr 1fr; 541 | } 542 | 543 | .mobile-footer img { 544 | width: 60%; 545 | padding-left: 100px; 546 | padding-top: 20px; 547 | padding-bottom: 20px; 548 | } 549 | 550 | .mobile-footer h6 { 551 | margin-right: 30px; 552 | font-size: 18px; 553 | font-weight: 400; 554 | padding-right: 200px; 555 | } 556 | } 557 | --------------------------------------------------------------------------------