├── README.md
├── assets
    ├── favicon.ico
    └── img
    │   ├── portfolio
    │       ├── cabin.png
    │       ├── cake.png
    │       ├── circus.png
    │       ├── game.png
    │       ├── safe.png
    │       └── submarine.png
    │   └── avataaars.svg
├── .github
    └── workflows
    │   └── main.yml
├── js
    └── scripts.js
└── index.html


/README.md:
--------------------------------------------------------------------------------
1 | # demo-actions-project


--------------------------------------------------------------------------------
/assets/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/favicon.ico


--------------------------------------------------------------------------------
/assets/img/portfolio/cabin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/cabin.png


--------------------------------------------------------------------------------
/assets/img/portfolio/cake.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/cake.png


--------------------------------------------------------------------------------
/assets/img/portfolio/circus.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/circus.png


--------------------------------------------------------------------------------
/assets/img/portfolio/game.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/game.png


--------------------------------------------------------------------------------
/assets/img/portfolio/safe.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/safe.png


--------------------------------------------------------------------------------
/assets/img/portfolio/submarine.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LondheShubham153/tws-portfolio/HEAD/assets/img/portfolio/submarine.png


--------------------------------------------------------------------------------
/.github/workflows/main.yml:
--------------------------------------------------------------------------------
 1 | name: Portfolio Deployment
 2 | 
 3 | on:
 4 |   push:
 5 |     branches:
 6 |     - main
 7 | 
 8 | jobs:
 9 |   build-and-deploy:
10 |     runs-on: ubuntu-latest
11 |     steps:
12 |     - name: Checkout
13 |       uses: actions/checkout@v1
14 | 
15 |     - name: Configure AWS Credentials
16 |       uses: aws-actions/configure-aws-credentials@v1
17 |       with:
18 |         aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
19 |         aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
20 |         aws-region: us-east-1
21 | 
22 |     - name: Deploy static site to S3 bucket
23 |       run: aws s3 sync . s3://tws-junoon --delete
24 | 


--------------------------------------------------------------------------------
/js/scripts.js:
--------------------------------------------------------------------------------
 1 | /*!
 2 | * Start Bootstrap - Freelancer v7.0.7 (https://startbootstrap.com/theme/freelancer)
 3 | * Copyright 2013-2023 Start Bootstrap
 4 | * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-freelancer/blob/master/LICENSE)
 5 | */
 6 | //
 7 | // Scripts
 8 | // 
 9 | 
10 | window.addEventListener('DOMContentLoaded', event => {
11 | 
12 |     // Navbar shrink function
13 |     var navbarShrink = function () {
14 |         const navbarCollapsible = document.body.querySelector('#mainNav');
15 |         if (!navbarCollapsible) {
16 |             return;
17 |         }
18 |         if (window.scrollY === 0) {
19 |             navbarCollapsible.classList.remove('navbar-shrink')
20 |         } else {
21 |             navbarCollapsible.classList.add('navbar-shrink')
22 |         }
23 | 
24 |     };
25 | 
26 |     // Shrink the navbar 
27 |     navbarShrink();
28 | 
29 |     // Shrink the navbar when page is scrolled
30 |     document.addEventListener('scroll', navbarShrink);
31 | 
32 |     // Activate Bootstrap scrollspy on the main nav element
33 |     const mainNav = document.body.querySelector('#mainNav');
34 |     if (mainNav) {
35 |         new bootstrap.ScrollSpy(document.body, {
36 |             target: '#mainNav',
37 |             rootMargin: '0px 0px -40%',
38 |         });
39 |     };
40 | 
41 |     // Collapse responsive navbar when toggler is visible
42 |     const navbarToggler = document.body.querySelector('.navbar-toggler');
43 |     const responsiveNavItems = [].slice.call(
44 |         document.querySelectorAll('#navbarResponsive .nav-link')
45 |     );
46 |     responsiveNavItems.map(function (responsiveNavItem) {
47 |         responsiveNavItem.addEventListener('click', () => {
48 |             if (window.getComputedStyle(navbarToggler).display !== 'none') {
49 |                 navbarToggler.click();
50 |             }
51 |         });
52 |     });
53 | 
54 | });
55 | 


--------------------------------------------------------------------------------
/assets/img/avataaars.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="utf-8"?>
  2 | <!-- Generator: Adobe Illustrator 23.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
  3 | <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
  4 | 	 viewBox="0 0 264 280" style="enable-background:new 0 0 264 280;" xml:space="preserve">
  5 | <style type="text/css">
  6 | 	.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#E6E6E6;}
  7 | 	.st1{filter:url(#Adobe_OpacityMaskFilter);}
  8 | 	.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
  9 | 	.st3{mask:url(#mask-2_1_);}
 10 | 	.st4{fill-rule:evenodd;clip-rule:evenodd;fill:#2C3E50;}
 11 | 	.st5{filter:url(#Adobe_OpacityMaskFilter_1_);}
 12 | 	.st6{mask:url(#mask-4_1_);}
 13 | 	.st7{fill-rule:evenodd;clip-rule:evenodd;fill:#D0C6AC;}
 14 | 	.st8{filter:url(#Adobe_OpacityMaskFilter_2_);}
 15 | 	.st9{mask:url(#mask-6_1_);}
 16 | 	.st10{fill-rule:evenodd;clip-rule:evenodd;fill:#EDB98A;}
 17 | 	.st11{filter:url(#Adobe_OpacityMaskFilter_3_);}
 18 | 	.st12{mask:url(#mask-6_2_);fill-rule:evenodd;clip-rule:evenodd;fill-opacity:0.1;}
 19 | 	.st13{filter:url(#Adobe_OpacityMaskFilter_4_);}
 20 | 	.st14{mask:url(#react-mask-952_1_);}
 21 | 	.st15{filter:url(#Adobe_OpacityMaskFilter_5_);}
 22 | 	.st16{opacity:0.6;mask:url(#react-mask-952_2_);}
 23 | 	.st17{fill-rule:evenodd;clip-rule:evenodd;fill-opacity:0.16;}
 24 | 	.st18{fill-rule:evenodd;clip-rule:evenodd;fill-opacity:0.7;}
 25 | 	.st19{filter:url(#Adobe_OpacityMaskFilter_6_);}
 26 | 	.st20{mask:url(#react-mask-934_1_);fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
 27 | 	.st21{filter:url(#Adobe_OpacityMaskFilter_7_);}
 28 | 	.st22{mask:url(#react-mask-934_2_);}
 29 | 	.st23{fill-rule:evenodd;clip-rule:evenodd;fill:#FF4F6D;}
 30 | 	.st24{fill-rule:evenodd;clip-rule:evenodd;fill-opacity:0.6;}
 31 | 	.st25{filter:url(#Adobe_OpacityMaskFilter_8_);}
 32 | 	.st26{mask:url(#react-mask-925_1_);}
 33 | 	.st27{fill-rule:evenodd;clip-rule:evenodd;fill:#28354B;}
 34 | 	.st28{filter:url(#Adobe_OpacityMaskFilter_9_);}
 35 | 	.st29{mask:url(#react-mask-924_1_);}
 36 | 	.st30{fill-rule:evenodd;clip-rule:evenodd;fill:#4A312C;}
 37 | </style>
 38 | <desc>Created with getavataaars.com</desc>
 39 | <g>
 40 | 	<g transform="translate(-825.000000, -1100.000000)">
 41 | 		<g transform="translate(825.000000, 1100.000000)">
 42 | 			<g id="Circle" transform="translate(12.000000, 40.000000)">
 43 | 				<g id="Circle-Background">
 44 | 					<circle class="st0" cx="120" cy="120" r="120"/>
 45 | 				</g>
 46 | 				<defs>
 47 | 					<filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="0" y="0" width="240" height="240">
 48 | 						<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
 49 | 					</filter>
 50 | 				</defs>
 51 | 				<mask maskUnits="userSpaceOnUse" x="0" y="0" width="240" height="240" id="mask-2_1_">
 52 | 					<g class="st1">
 53 | 						<circle id="path-1_1_" class="st2" cx="120" cy="120" r="120"/>
 54 | 					</g>
 55 | 				</mask>
 56 | 				<g class="st3">
 57 | 					<rect class="st4" width="240" height="240"/>
 58 | 				</g>
 59 | 			</g>
 60 | 			<g id="Mask">
 61 | 			</g>
 62 | 			<defs>
 63 | 				<filter id="Adobe_OpacityMaskFilter_1_" filterUnits="userSpaceOnUse" x="-1" y="0" width="265" height="280">
 64 | 					<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
 65 | 				</filter>
 66 | 			</defs>
 67 | 			<mask maskUnits="userSpaceOnUse" x="-1" y="0" width="265" height="280" id="mask-4_1_">
 68 | 				<g class="st5">
 69 | 					<path id="path-3_1_" class="st2" d="M12,160c0,66.3,53.7,120,120,120s120-53.7,120-120h12V0H0v160H12z"/>
 70 | 				</g>
 71 | 			</mask>
 72 | 			<g id="Avataaar" class="st6">
 73 | 				<g id="Body" transform="translate(32.000000, 36.000000)">
 74 | 					<g>
 75 | 						<path class="st7" d="M124,144.6V163h4l0,0c39.8,0,72,32.2,72,72v9H0v-9c0-39.8,32.2-72,72-72l0,0h4v-18.4
 76 | 							c-17.2-8.2-29.6-24.9-31.7-44.7C38.5,99.1,34,94.1,34,88V74c0-5.9,4.3-10.9,10-11.8V56l0,0c0-30.9,25.1-56,56-56l0,0l0,0
 77 | 							c30.9,0,56,25.1,56,56v6.2c5.7,1,10,5.9,10,11.8v14c0,6.1-4.5,11.1-10.3,11.9C153.6,119.7,141.2,136.4,124,144.6z"/>
 78 | 					</g>
 79 | 					<defs>
 80 | 						<filter id="Adobe_OpacityMaskFilter_2_" filterUnits="userSpaceOnUse" x="-32" y="0" width="264" height="244">
 81 | 							<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
 82 | 						</filter>
 83 | 					</defs>
 84 | 					<mask maskUnits="userSpaceOnUse" x="-32" y="0" width="264" height="244" id="mask-6_1_">
 85 | 						<g class="st8">
 86 | 							<path id="path-5_1_" class="st2" d="M124,144.6V163h4l0,0c39.8,0,72,32.2,72,72v9H0v-9c0-39.8,32.2-72,72-72l0,0h4v-18.4
 87 | 								c-17.2-8.2-29.6-24.9-31.7-44.7C38.5,99.1,34,94.1,34,88V74c0-5.9,4.3-10.9,10-11.8V56l0,0c0-30.9,25.1-56,56-56l0,0l0,0
 88 | 								c30.9,0,56,25.1,56,56v6.2c5.7,1,10,5.9,10,11.8v14c0,6.1-4.5,11.1-10.3,11.9C153.6,119.7,141.2,136.4,124,144.6z"/>
 89 | 						</g>
 90 | 					</mask>
 91 | 					<g class="st9">
 92 | 						<g id="Color" transform="translate(-32.000000, 0.000000)">
 93 | 							<rect class="st10" width="264" height="244"/>
 94 | 						</g>
 95 | 					</g>
 96 | 					<defs>
 97 | 						<filter id="Adobe_OpacityMaskFilter_3_" filterUnits="userSpaceOnUse" x="44" y="79" width="112" height="79">
 98 | 							<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
 99 | 						</filter>
100 | 					</defs>
101 | 					<mask maskUnits="userSpaceOnUse" x="44" y="79" width="112" height="79" id="mask-6_2_">
102 | 						<g class="st11">
103 | 							<path id="path-5_2_" class="st2" d="M124,144.6V163h4l0,0c39.8,0,72,32.2,72,72v9H0v-9c0-39.8,32.2-72,72-72l0,0h4v-18.4
104 | 								c-17.2-8.2-29.6-24.9-31.7-44.7C38.5,99.1,34,94.1,34,88V74c0-5.9,4.3-10.9,10-11.8V56l0,0c0-30.9,25.1-56,56-56l0,0l0,0
105 | 								c30.9,0,56,25.1,56,56v6.2c5.7,1,10,5.9,10,11.8v14c0,6.1-4.5,11.1-10.3,11.9C153.6,119.7,141.2,136.4,124,144.6z"/>
106 | 						</g>
107 | 					</mask>
108 | 					<path id="Neck-Shadow" class="st12" d="M156,79v23c0,30.9-25.1,56-56,56s-56-25.1-56-56V79v15c0,30.9,25.1,56,56,56
109 | 						s56-25.1,56-56V79z"/>
110 | 				</g>
111 | 				<g transform="translate(0.000000, 170.000000)">
112 | 					<g id="Clothes">
113 | 						<path class="st0" d="M166,29.3c37,3,66,34,66,71.8v8.9H32v-8.9C32,63,61.6,31.8,99,29.2c0,0.4,0,0.7,0,1.1
114 | 							c0,11.9,15,21.5,33.5,21.5S166,42.2,166,30.3C166,30,166,29.6,166,29.3z"/>
115 | 					</g>
116 | 					<defs>
117 | 						<filter id="Adobe_OpacityMaskFilter_4_" filterUnits="userSpaceOnUse" x="0" y="0" width="264" height="110">
118 | 							<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
119 | 						</filter>
120 | 					</defs>
121 | 					<mask maskUnits="userSpaceOnUse" x="0" y="0" width="264" height="110" id="react-mask-952_1_">
122 | 						<g class="st13">
123 | 							<path id="react-path-951_1_" class="st2" d="M166,29.3c37,3,66,34,66,71.8v8.9H32v-8.9C32,63,61.6,31.8,99,29.2
124 | 								c0,0.4,0,0.7,0,1.1c0,11.9,15,21.5,33.5,21.5S166,42.2,166,30.3C166,30,166,29.6,166,29.3z"/>
125 | 						</g>
126 | 					</mask>
127 | 					<g class="st14">
128 | 						<rect class="st2" width="264" height="110"/>
129 | 					</g>
130 | 					<defs>
131 | 						<filter id="Adobe_OpacityMaskFilter_5_" filterUnits="userSpaceOnUse" x="92.9" y="4.9" width="79.3" height="53.8">
132 | 							<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
133 | 						</filter>
134 | 					</defs>
135 | 					<mask maskUnits="userSpaceOnUse" x="92.9" y="4.9" width="79.3" height="53.8" id="react-mask-952_2_">
136 | 						<g class="st15">
137 | 							<path id="react-path-951_2_" class="st2" d="M166,29.3c37,3,66,34,66,71.8v8.9H32v-8.9C32,63,61.6,31.8,99,29.2
138 | 								c0,0.4,0,0.7,0,1.1c0,11.9,15,21.5,33.5,21.5S166,42.2,166,30.3C166,30,166,29.6,166,29.3z"/>
139 | 						</g>
140 | 					</mask>
141 | 					<g id="Shadowy" class="st16">
142 | 						<g transform="translate(92.000000, 4.000000)">
143 | 							<ellipse class="st17" cx="40.5" cy="27.8" rx="39.6" ry="26.9"/>
144 | 						</g>
145 | 					</g>
146 | 				</g>
147 | 				<g id="Face" transform="translate(76.000000, 82.000000)">
148 | 					<g transform="translate(2.000000, 52.000000)">
149 | 						<g id="Mouth">
150 | 							<path class="st18" d="M35.1,15.1C36.2,24.6,44.2,32,54,32c9.8,0,17.9-7.4,18.9-17c0.1-0.8-0.8-2-1.8-2c-14.9,0-26.3,0-34,0
151 | 								C36,13,35,14.2,35.1,15.1z"/>
152 | 						</g>
153 | 						<defs>
154 | 							<filter id="Adobe_OpacityMaskFilter_6_" filterUnits="userSpaceOnUse" x="39" y="2" width="31" height="16">
155 | 								<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
156 | 							</filter>
157 | 						</defs>
158 | 						<mask maskUnits="userSpaceOnUse" x="39" y="2" width="31" height="16" id="react-mask-934_1_">
159 | 							<g class="st19">
160 | 								<path id="react-path-933_1_" class="st2" d="M35.1,15.1C36.2,24.6,44.2,32,54,32c9.8,0,17.9-7.4,18.9-17
161 | 									c0.1-0.8-0.8-2-1.8-2c-14.9,0-26.3,0-34,0C36,13,35,14.2,35.1,15.1z"/>
162 | 							</g>
163 | 						</mask>
164 | 						<path id="Teeth" class="st20" d="M44,2h21c2.8,0,5,2.2,5,5v6c0,2.8-2.2,5-5,5H44c-2.8,0-5-2.2-5-5V7C39,4.2,41.2,2,44,2z"/>
165 | 						<defs>
166 | 							<filter id="Adobe_OpacityMaskFilter_7_" filterUnits="userSpaceOnUse" x="38" y="24" width="32" height="22">
167 | 								<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
168 | 							</filter>
169 | 						</defs>
170 | 						<mask maskUnits="userSpaceOnUse" x="38" y="24" width="32" height="22" id="react-mask-934_2_">
171 | 							<g class="st21">
172 | 								<path id="react-path-933_2_" class="st2" d="M35.1,15.1C36.2,24.6,44.2,32,54,32c9.8,0,17.9-7.4,18.9-17
173 | 									c0.1-0.8-0.8-2-1.8-2c-14.9,0-26.3,0-34,0C36,13,35,14.2,35.1,15.1z"/>
174 | 							</g>
175 | 						</mask>
176 | 						<g id="Tongue" class="st22">
177 | 							<g transform="translate(38.000000, 24.000000)">
178 | 								<circle class="st23" cx="11" cy="11" r="11"/>
179 | 								<circle class="st23" cx="21" cy="11" r="11"/>
180 | 							</g>
181 | 						</g>
182 | 					</g>
183 | 					<g transform="translate(28.000000, 40.000000)">
184 | 						<path id="Nose" class="st17" d="M16,8c0,4.4,5.4,8,12,8l0,0c6.6,0,12-3.6,12-8"/>
185 | 					</g>
186 | 					<g transform="translate(0.000000, 8.000000)">
187 | 						<path id="Squint" class="st24" d="M16.2,22.4C18,18.6,22.2,16,27,16c4.8,0,9,2.6,10.8,6.4c0.6,1.1-0.2,2-1,1.4
188 | 							c-2.5-2.1-5.9-3.4-9.8-3.4c-3.7,0-7.1,1.2-9.6,3.2C16.5,24.3,15.6,23.6,16.2,22.4z"/>
189 | 						<path class="st24" d="M74.2,22.4C76,18.6,80.2,16,85,16c4.8,0,9,2.6,10.8,6.4c0.6,1.1-0.2,2-1,1.4c-2.5-2.1-5.9-3.4-9.8-3.4
190 | 							c-3.7,0-7.1,1.2-9.6,3.2C74.5,24.3,73.6,23.6,74.2,22.4z"/>
191 | 					</g>
192 | 					<g>
193 | 						<path id="Eyebrow" class="st24" d="M26.5,6.1c-5.8,0.3-15.2,4.5-15,10.3c0,0.2,0.3,0.3,0.4,0.1c2.8-3,22.3-5.9,29.2-4.4
194 | 							c0.6,0.1,1.1-0.5,0.7-0.9C38.5,7.5,31.7,5.9,26.5,6.1"/>
195 | 						<path class="st24" d="M86.5,6.1c5.8,0.3,15.2,4.5,15,10.3c0,0.2-0.3,0.3-0.4,0.1c-2.8-3-22.3-5.9-29.2-4.4
196 | 							c-0.6,0.1-1.1-0.5-0.7-0.9C74.5,7.5,81.3,5.9,86.5,6.1"/>
197 | 					</g>
198 | 				</g>
199 | 				<g id="Top">
200 | 					<defs>
201 | 						<filter id="Adobe_OpacityMaskFilter_8_" filterUnits="userSpaceOnUse" x="-1" y="0" width="264" height="280">
202 | 							<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
203 | 						</filter>
204 | 					</defs>
205 | 					<mask maskUnits="userSpaceOnUse" x="-1" y="0" width="264" height="280" id="react-mask-925_1_">
206 | 						<g class="st25">
207 | 							<rect id="react-path-927_1_" class="st2" width="264" height="280"/>
208 | 						</g>
209 | 					</mask>
210 | 					<g class="st26">
211 | 						<g transform="translate(-1.000000, 0.000000)">
212 | 							<g id="Short-Hair">
213 | 								<path class="st27" d="M183.7,38.9c5.4-5,6.7-15,3.6-21.5c-3.8-8-11.4-9-18.7-5.5c-6.9,3.3-13.1,4.4-20.6,2.8
214 | 									c-7.3-1.5-14.1-4.3-21.6-4.7C114,9.3,102,13.9,93.6,23.1c-1.6,1.8-2.9,3.8-4.1,5.8c-1,1.6-2.1,3.4-2.5,5.3
215 | 									c-0.2,0.9,0.2,3.1-0.3,3.8c-0.5,0.8-2.3,1.5-3.1,2.1c-1.6,1.2-2.9,2.5-4.2,4c-2.7,3.2-4.1,6.6-5.4,10.6
216 | 									c-4.1,13.2-4.5,29,0.9,42c0.7,1.7,2.9,5.4,4.2,1.6c0.3-0.7-0.3-3.2-0.3-3.9c0-2.7,1.5-20.7,8-30.8c2.1-3.3,12-15.6,14-15.7
217 | 									c1.1,1.7,11.9,12.5,39.9,11.2c12.7-0.6,22.4-6.3,24.7-8.7c1,5.5,13,13.8,14.8,17.2c5.3,9.8,6.4,30.3,8.4,30.3
218 | 									s3.5-5.2,3.9-6.2c3.1-7.4,3.6-16.6,3.3-24.6C195.5,57,191.3,45.9,183.7,38.9z"/>
219 | 							</g>
220 | 							<defs>
221 | 								<filter id="Adobe_OpacityMaskFilter_9_" filterUnits="userSpaceOnUse" x="0" y="0" width="264" height="280">
222 | 									<feColorMatrix  type="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 1 0"/>
223 | 								</filter>
224 | 							</defs>
225 | 							<mask maskUnits="userSpaceOnUse" x="0" y="0" width="264" height="280" id="react-mask-924_1_">
226 | 								<g class="st28">
227 | 									<path id="react-path-926_1_" class="st2" d="M183.7,38.9c5.4-5,6.7-15,3.6-21.5c-3.8-8-11.4-9-18.7-5.5
228 | 										c-6.9,3.3-13.1,4.4-20.6,2.8c-7.3-1.5-14.1-4.3-21.6-4.7C114,9.3,102,13.9,93.6,23.1c-1.6,1.8-2.9,3.8-4.1,5.8
229 | 										c-1,1.6-2.1,3.4-2.5,5.3c-0.2,0.9,0.2,3.1-0.3,3.8c-0.5,0.8-2.3,1.5-3.1,2.1c-1.6,1.2-2.9,2.5-4.2,4
230 | 										c-2.7,3.2-4.1,6.6-5.4,10.6c-4.1,13.2-4.5,29,0.9,42c0.7,1.7,2.9,5.4,4.2,1.6c0.3-0.7-0.3-3.2-0.3-3.9
231 | 										c0-2.7,1.5-20.7,8-30.8c2.1-3.3,12-15.6,14-15.7c1.1,1.7,11.9,12.5,39.9,11.2c12.7-0.6,22.4-6.3,24.7-8.7
232 | 										c1,5.5,13,13.8,14.8,17.2c5.3,9.8,6.4,30.3,8.4,30.3s3.5-5.2,3.9-6.2c3.1-7.4,3.6-16.6,3.3-24.6
233 | 										C195.5,57,191.3,45.9,183.7,38.9z"/>
234 | 								</g>
235 | 							</mask>
236 | 							<g class="st29">
237 | 								<g transform="translate(0.000000, 0.000000) ">
238 | 									<rect class="st30" width="264" height="280"/>
239 | 								</g>
240 | 							</g>
241 | 						</g>
242 | 					</g>
243 | 				</g>
244 | 			</g>
245 | 		</g>
246 | 	</g>
247 | </g>
248 | </svg>
249 | 


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 |     <head>
  4 |         <meta charset="utf-8" />
  5 |         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  6 |         <meta name="description" content="" />
  7 |         <meta name="author" content="" />
  8 |         <title>TWS Portfolio</title>
  9 |         <!-- Favicon-->
 10 |         <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
 11 |         <!-- Font Awesome icons (free version)-->
 12 |         <script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
 13 |         <!-- Google fonts-->
 14 |         <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
 15 |         <link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css" />
 16 |         <!-- Core theme CSS (includes Bootstrap)-->
 17 |         <link href="css/styles.css" rel="stylesheet" />
 18 |     </head>
 19 |     <body id="page-top">
 20 |         <!-- Navigation-->
 21 |         <nav class="navbar navbar-expand-lg bg-secondary text-uppercase fixed-top" id="mainNav">
 22 |             <div class="container">
 23 |                 <a class="navbar-brand" href="#page-top">Train With Shubham</a>
 24 |                 <button class="navbar-toggler text-uppercase font-weight-bold bg-primary text-white rounded" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
 25 |                     Menu
 26 |                     <i class="fas fa-bars"></i>
 27 |                 </button>
 28 |                 <div class="collapse navbar-collapse" id="navbarResponsive">
 29 |                     <ul class="navbar-nav ms-auto">
 30 |                         <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#portfolio">Portfolio</a></li>
 31 |                         <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#about">About</a></li>
 32 |                         <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#contact">Contact</a></li>
 33 |                     </ul>
 34 |                 </div>
 35 |             </div>
 36 |         </nav>
 37 |         <!-- Masthead-->
 38 |         <header class="masthead bg-primary text-white text-center">
 39 |             <div class="container d-flex align-items-center flex-column">
 40 |                 <!-- Masthead Avatar Image-->
 41 |                 <img class="masthead-avatar mb-5" src="assets/img/avataaars.svg" alt="..." />
 42 |                 <!-- Masthead Heading-->
 43 |                 <h1 class="masthead-heading text-uppercase mb-0">
 44 |                     <a href="https://bit.ly/tws-junoon" style="text-decoration: none; color: inherit;">
 45 |                         DevOps (Junoon Batch 8) Starts October 5th (Sat-Sun 9 to 12)
 46 |                     </a>
 47 |                 </h1>
 48 |                 <!-- Icon Divider-->
 49 |                 <div class="divider-custom divider-light">
 50 |                     <div class="divider-custom-line"></div>
 51 |                     <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
 52 |                     <div class="divider-custom-line"></div>
 53 |                 </div>
 54 |                 <!-- Masthead Subheading-->
 55 |                 <p class="masthead-subheading font-weight-light mb-0">Engineer - Trainer - Learner</p>
 56 |             </div>
 57 |         </header>
 58 |         <!-- Portfolio Section-->
 59 |         <section class="page-section portfolio" id="portfolio">
 60 |             <div class="container">
 61 |                 <!-- Portfolio Section Heading-->
 62 |                 <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">Portfolio</h2>
 63 |                 <!-- Icon Divider-->
 64 |                 <div class="divider-custom">
 65 |                     <div class="divider-custom-line"></div>
 66 |                     <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
 67 |                     <div class="divider-custom-line"></div>
 68 |                 </div>
 69 |                 <!-- Portfolio Grid Items-->
 70 |                 <div class="row justify-content-center">
 71 |                     <!-- Portfolio Item 1-->
 72 |                     <div class="col-md-6 col-lg-4 mb-5">
 73 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
 74 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
 75 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
 76 |                             </div>
 77 |                             <img class="img-fluid" src="assets/img/portfolio/cabin.png" alt="..." />
 78 |                         </div>
 79 |                     </div>
 80 |                     <!-- Portfolio Item 2-->
 81 |                     <div class="col-md-6 col-lg-4 mb-5">
 82 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal2">
 83 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
 84 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
 85 |                             </div>
 86 |                             <img class="img-fluid" src="assets/img/portfolio/cake.png" alt="..." />
 87 |                         </div>
 88 |                     </div>
 89 |                     <!-- Portfolio Item 3-->
 90 |                     <div class="col-md-6 col-lg-4 mb-5">
 91 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal3">
 92 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
 93 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
 94 |                             </div>
 95 |                             <img class="img-fluid" src="assets/img/portfolio/circus.png" alt="..." />
 96 |                         </div>
 97 |                     </div>
 98 |                     <!-- Portfolio Item 4-->
 99 |                     <div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
100 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal4">
101 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
102 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
103 |                             </div>
104 |                             <img class="img-fluid" src="assets/img/portfolio/game.png" alt="..." />
105 |                         </div>
106 |                     </div>
107 |                     <!-- Portfolio Item 5-->
108 |                     <div class="col-md-6 col-lg-4 mb-5 mb-md-0">
109 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal5">
110 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
111 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
112 |                             </div>
113 |                             <img class="img-fluid" src="assets/img/portfolio/safe.png" alt="..." />
114 |                         </div>
115 |                     </div>
116 |                     <!-- Portfolio Item 6-->
117 |                     <div class="col-md-6 col-lg-4">
118 |                         <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal6">
119 |                             <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
120 |                                 <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
121 |                             </div>
122 |                             <img class="img-fluid" src="assets/img/portfolio/submarine.png" alt="..." />
123 |                         </div>
124 |                     </div>
125 |                 </div>
126 |             </div>
127 |         </section>
128 |         <!-- About Section-->
129 |         <section class="page-section bg-primary text-white mb-0" id="about">
130 |             <div class="container">
131 |                 <!-- About Section Heading-->
132 |                 <h2 class="page-section-heading text-center text-uppercase text-white">About</h2>
133 |                 <!-- Icon Divider-->
134 |                 <div class="divider-custom divider-light">
135 |                     <div class="divider-custom-line"></div>
136 |                     <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
137 |                     <div class="divider-custom-line"></div>
138 |                 </div>
139 |                 <!-- About Section Content-->
140 |                 <div class="row">
141 |                     <div class="col-lg-4 ms-auto"><p class="lead">DevOps Junoon (Batch 8) <br> Starts October 5th (Weekends 9 A.M to 12 P.M)  <br> Covering A-Z of DevOps.</p></div>
142 |                     <div class="col-lg-4 me-auto"><p class="lead">See you in the Live Sessions. </p></div>
143 |                 </div>
144 |                 <!-- About Section Button-->
145 |                 <div class="text-center mt-4">
146 |                     <a class="btn btn-xl btn-outline-light" href="https://bit.ly/tws-junoon">
147 |                         <i class="fas fa-download me-2"></i>
148 |                         Checkout Junoon!
149 |                     </a>
150 |                 </div>
151 |             </div>
152 |         </section>
153 |         <!-- Contact Section-->
154 |         <section class="page-section" id="contact">
155 |             <div class="container">
156 |                 <!-- Contact Section Heading-->
157 |                 <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">Contact Me</h2>
158 |                 <!-- Icon Divider-->
159 |                 <div class="divider-custom">
160 |                     <div class="divider-custom-line"></div>
161 |                     <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
162 |                     <div class="divider-custom-line"></div>
163 |                 </div>
164 |                 <!-- Contact Section Form-->
165 |                 <div class="row justify-content-center">
166 |                     <div class="col-lg-8 col-xl-7">
167 |                         <!-- * * * * * * * * * * * * * * *-->
168 |                         <!-- * * SB Forms Contact Form * *-->
169 |                         <!-- * * * * * * * * * * * * * * *-->
170 |                         <!-- This form is pre-integrated with SB Forms.-->
171 |                         <!-- To make this form functional, sign up at-->
172 |                         <!-- https://startbootstrap.com/solution/contact-forms-->
173 |                         <!-- to get an API token!-->
174 |                         <form id="contactForm" data-sb-form-api-token="API_TOKEN">
175 |                             <!-- Name input-->
176 |                             <div class="form-floating mb-3">
177 |                                 <input class="form-control" id="name" type="text" placeholder="Enter your name..." data-sb-validations="required" />
178 |                                 <label for="name">Full name</label>
179 |                                 <div class="invalid-feedback" data-sb-feedback="name:required">A name is required.</div>
180 |                             </div>
181 |                             <!-- Email address input-->
182 |                             <div class="form-floating mb-3">
183 |                                 <input class="form-control" id="email" type="email" placeholder="name@example.com" data-sb-validations="required,email" />
184 |                                 <label for="email">Email address</label>
185 |                                 <div class="invalid-feedback" data-sb-feedback="email:required">An email is required.</div>
186 |                                 <div class="invalid-feedback" data-sb-feedback="email:email">Email is not valid.</div>
187 |                             </div>
188 |                             <!-- Phone number input-->
189 |                             <div class="form-floating mb-3">
190 |                                 <input class="form-control" id="phone" type="tel" placeholder="(123) 456-7890" data-sb-validations="required" />
191 |                                 <label for="phone">Phone number</label>
192 |                                 <div class="invalid-feedback" data-sb-feedback="phone:required">A phone number is required.</div>
193 |                             </div>
194 |                             <!-- Message input-->
195 |                             <div class="form-floating mb-3">
196 |                                 <textarea class="form-control" id="message" type="text" placeholder="Enter your message here..." style="height: 10rem" data-sb-validations="required"></textarea>
197 |                                 <label for="message">Message</label>
198 |                                 <div class="invalid-feedback" data-sb-feedback="message:required">A message is required.</div>
199 |                             </div>
200 |                             <!-- Submit success message-->
201 |                             <!---->
202 |                             <!-- This is what your users will see when the form-->
203 |                             <!-- has successfully submitted-->
204 |                             <div class="d-none" id="submitSuccessMessage">
205 |                                 <div class="text-center mb-3">
206 |                                     <div class="fw-bolder">Form submission successful!</div>
207 |                                     To activate this form, sign up at
208 |                                     <br />
209 |                                     <a href="https://startbootstrap.com/solution/contact-forms">https://startbootstrap.com/solution/contact-forms</a>
210 |                                 </div>
211 |                             </div>
212 |                             <!-- Submit error message-->
213 |                             <!---->
214 |                             <!-- This is what your users will see when there is-->
215 |                             <!-- an error submitting the form-->
216 |                             <div class="d-none" id="submitErrorMessage"><div class="text-center text-danger mb-3">Error sending message!</div></div>
217 |                             <!-- Submit Button-->
218 |                             <button class="btn btn-primary btn-xl disabled" id="submitButton" type="submit">Send</button>
219 |                         </form>
220 |                     </div>
221 |                 </div>
222 |             </div>
223 |         </section>
224 |         <!-- Footer-->
225 |         <footer class="footer text-center">
226 |             <div class="container">
227 |                 <div class="row">
228 |                     <!-- Footer Location-->
229 |                     <div class="col-lg-4 mb-5 mb-lg-0">
230 |                         <h4 class="text-uppercase mb-4">Location</h4>
231 |                         <p class="lead mb-0">
232 |                             2215 John Daniel Drive
233 |                             <br />
234 |                             Clark, MO 65243
235 |                         </p>
236 |                     </div>
237 |                     <!-- Footer Social Icons-->
238 |                     <div class="col-lg-4 mb-5 mb-lg-0">
239 |                         <h4 class="text-uppercase mb-4">Around the Web</h4>
240 |                         <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-facebook-f"></i></a>
241 |                         <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-twitter"></i></a>
242 |                         <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-linkedin-in"></i></a>
243 |                         <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-dribbble"></i></a>
244 |                     </div>
245 |                     <!-- Footer About Text-->
246 |                     <div class="col-lg-4">
247 |                         <h4 class="text-uppercase mb-4">About Freelancer</h4>
248 |                         <p class="lead mb-0">
249 |                             Freelance is a free to use, MIT licensed Bootstrap theme created by
250 |                             <a href="http://startbootstrap.com">Start Bootstrap</a>
251 |                             .
252 |                         </p>
253 |                     </div>
254 |                 </div>
255 |             </div>
256 |         </footer>
257 |         <!-- Copyright Section-->
258 |         <div class="copyright py-4 text-center text-white">
259 |             <div class="container"><small>Copyright &copy; TrainWithShubham.com 2024</small></div>
260 |         </div>
261 |         <!-- Portfolio Modals-->
262 |         <!-- Portfolio Modal 1-->
263 |         <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" aria-labelledby="portfolioModal1" aria-hidden="true">
264 |             <div class="modal-dialog modal-xl">
265 |                 <div class="modal-content">
266 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
267 |                     <div class="modal-body text-center pb-5">
268 |                         <div class="container">
269 |                             <div class="row justify-content-center">
270 |                                 <div class="col-lg-8">
271 |                                     <!-- Portfolio Modal - Title-->
272 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Log Cabin</h2>
273 |                                     <!-- Icon Divider-->
274 |                                     <div class="divider-custom">
275 |                                         <div class="divider-custom-line"></div>
276 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
277 |                                         <div class="divider-custom-line"></div>
278 |                                     </div>
279 |                                     <!-- Portfolio Modal - Image-->
280 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/cabin.png" alt="..." />
281 |                                     <!-- Portfolio Modal - Text-->
282 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
283 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
284 |                                         <i class="fas fa-xmark fa-fw"></i>
285 |                                         Close Window
286 |                                     </button>
287 |                                 </div>
288 |                             </div>
289 |                         </div>
290 |                     </div>
291 |                 </div>
292 |             </div>
293 |         </div>
294 |         <!-- Portfolio Modal 2-->
295 |         <div class="portfolio-modal modal fade" id="portfolioModal2" tabindex="-1" aria-labelledby="portfolioModal2" aria-hidden="true">
296 |             <div class="modal-dialog modal-xl">
297 |                 <div class="modal-content">
298 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
299 |                     <div class="modal-body text-center pb-5">
300 |                         <div class="container">
301 |                             <div class="row justify-content-center">
302 |                                 <div class="col-lg-8">
303 |                                     <!-- Portfolio Modal - Title-->
304 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Tasty Cake</h2>
305 |                                     <!-- Icon Divider-->
306 |                                     <div class="divider-custom">
307 |                                         <div class="divider-custom-line"></div>
308 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
309 |                                         <div class="divider-custom-line"></div>
310 |                                     </div>
311 |                                     <!-- Portfolio Modal - Image-->
312 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/cake.png" alt="..." />
313 |                                     <!-- Portfolio Modal - Text-->
314 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
315 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
316 |                                         <i class="fas fa-xmark fa-fw"></i>
317 |                                         Close Window
318 |                                     </button>
319 |                                 </div>
320 |                             </div>
321 |                         </div>
322 |                     </div>
323 |                 </div>
324 |             </div>
325 |         </div>
326 |         <!-- Portfolio Modal 3-->
327 |         <div class="portfolio-modal modal fade" id="portfolioModal3" tabindex="-1" aria-labelledby="portfolioModal3" aria-hidden="true">
328 |             <div class="modal-dialog modal-xl">
329 |                 <div class="modal-content">
330 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
331 |                     <div class="modal-body text-center pb-5">
332 |                         <div class="container">
333 |                             <div class="row justify-content-center">
334 |                                 <div class="col-lg-8">
335 |                                     <!-- Portfolio Modal - Title-->
336 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Circus Tent</h2>
337 |                                     <!-- Icon Divider-->
338 |                                     <div class="divider-custom">
339 |                                         <div class="divider-custom-line"></div>
340 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
341 |                                         <div class="divider-custom-line"></div>
342 |                                     </div>
343 |                                     <!-- Portfolio Modal - Image-->
344 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/circus.png" alt="..." />
345 |                                     <!-- Portfolio Modal - Text-->
346 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
347 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
348 |                                         <i class="fas fa-xmark fa-fw"></i>
349 |                                         Close Window
350 |                                     </button>
351 |                                 </div>
352 |                             </div>
353 |                         </div>
354 |                     </div>
355 |                 </div>
356 |             </div>
357 |         </div>
358 |         <!-- Portfolio Modal 4-->
359 |         <div class="portfolio-modal modal fade" id="portfolioModal4" tabindex="-1" aria-labelledby="portfolioModal4" aria-hidden="true">
360 |             <div class="modal-dialog modal-xl">
361 |                 <div class="modal-content">
362 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
363 |                     <div class="modal-body text-center pb-5">
364 |                         <div class="container">
365 |                             <div class="row justify-content-center">
366 |                                 <div class="col-lg-8">
367 |                                     <!-- Portfolio Modal - Title-->
368 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Controller</h2>
369 |                                     <!-- Icon Divider-->
370 |                                     <div class="divider-custom">
371 |                                         <div class="divider-custom-line"></div>
372 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
373 |                                         <div class="divider-custom-line"></div>
374 |                                     </div>
375 |                                     <!-- Portfolio Modal - Image-->
376 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/game.png" alt="..." />
377 |                                     <!-- Portfolio Modal - Text-->
378 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
379 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
380 |                                         <i class="fas fa-xmark fa-fw"></i>
381 |                                         Close Window
382 |                                     </button>
383 |                                 </div>
384 |                             </div>
385 |                         </div>
386 |                     </div>
387 |                 </div>
388 |             </div>
389 |         </div>
390 |         <!-- Portfolio Modal 5-->
391 |         <div class="portfolio-modal modal fade" id="portfolioModal5" tabindex="-1" aria-labelledby="portfolioModal5" aria-hidden="true">
392 |             <div class="modal-dialog modal-xl">
393 |                 <div class="modal-content">
394 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
395 |                     <div class="modal-body text-center pb-5">
396 |                         <div class="container">
397 |                             <div class="row justify-content-center">
398 |                                 <div class="col-lg-8">
399 |                                     <!-- Portfolio Modal - Title-->
400 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Locked Safe</h2>
401 |                                     <!-- Icon Divider-->
402 |                                     <div class="divider-custom">
403 |                                         <div class="divider-custom-line"></div>
404 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
405 |                                         <div class="divider-custom-line"></div>
406 |                                     </div>
407 |                                     <!-- Portfolio Modal - Image-->
408 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/safe.png" alt="..." />
409 |                                     <!-- Portfolio Modal - Text-->
410 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
411 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
412 |                                         <i class="fas fa-xmark fa-fw"></i>
413 |                                         Close Window
414 |                                     </button>
415 |                                 </div>
416 |                             </div>
417 |                         </div>
418 |                     </div>
419 |                 </div>
420 |             </div>
421 |         </div>
422 |         <!-- Portfolio Modal 6-->
423 |         <div class="portfolio-modal modal fade" id="portfolioModal6" tabindex="-1" aria-labelledby="portfolioModal6" aria-hidden="true">
424 |             <div class="modal-dialog modal-xl">
425 |                 <div class="modal-content">
426 |                     <div class="modal-header border-0"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
427 |                     <div class="modal-body text-center pb-5">
428 |                         <div class="container">
429 |                             <div class="row justify-content-center">
430 |                                 <div class="col-lg-8">
431 |                                     <!-- Portfolio Modal - Title-->
432 |                                     <h2 class="portfolio-modal-title text-secondary text-uppercase mb-0">Submarine</h2>
433 |                                     <!-- Icon Divider-->
434 |                                     <div class="divider-custom">
435 |                                         <div class="divider-custom-line"></div>
436 |                                         <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
437 |                                         <div class="divider-custom-line"></div>
438 |                                     </div>
439 |                                     <!-- Portfolio Modal - Image-->
440 |                                     <img class="img-fluid rounded mb-5" src="assets/img/portfolio/submarine.png" alt="..." />
441 |                                     <!-- Portfolio Modal - Text-->
442 |                                     <p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia neque assumenda ipsam nihil, molestias magnam, recusandae quos quis inventore quisquam velit asperiores, vitae? Reprehenderit soluta, eos quod consequuntur itaque. Nam.</p>
443 |                                     <button class="btn btn-primary" data-bs-dismiss="modal">
444 |                                         <i class="fas fa-xmark fa-fw"></i>
445 |                                         Close Window
446 |                                     </button>
447 |                                 </div>
448 |                             </div>
449 |                         </div>
450 |                     </div>
451 |                 </div>
452 |             </div>
453 |         </div>
454 |         <!-- Bootstrap core JS-->
455 |         <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
456 |         <!-- Core theme JS-->
457 |         <script src="js/scripts.js"></script>
458 |         <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
459 |         <!-- * *                               SB Forms JS                               * *-->
460 |         <!-- * * Activate your form at https://startbootstrap.com/solution/contact-forms * *-->
461 |         <!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
462 |         <script src="https://cdn.startbootstrap.com/sb-forms-latest.js"></script>
463 |     </body>
464 | </html>
465 | 


--------------------------------------------------------------------------------