Outiref

Code source de l'URL : http://maximeridou.fr

<!DOCTYPE html>

<html lang="en">
	<head>

		<!-- Title -->
			<title>Maxime Ridou — Creative Product Designer</title>

		<!-- Meta -->
		<meta charset="utf-8">
		<meta name="description" content="Available to collaborate together from September - Hello, I'm Maxime Ridou! A young UX/UI Designer based in Paris. Find all my work on my portfolio.">
		<meta name="author" content="Maxime Ridou — Creative UX/UI Designer">

		<!-- Mobile Meta -->
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

		<!-- Favicon (http://www.favicon-generator.org/) -->
		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
		<link rel="icon" href="favicon.ico" type="image/x-icon">

		<!-- Google Analytics - Global site tag (gtag.js) -->
		<!-- Paste your Google Anaytics code here. -->

		<!-- Google fonts (https://www.google.com/fonts) -->
		<link rel="preconnect" href="https://fonts.gstatic.com">
		<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet"> <!-- Body font -->
		<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;900&display=swap" rel="stylesheet"> <!-- Secondary/Alter font -->

		<!-- Libs and Plugins CSS -->
		<link rel="stylesheet" href="assets/vendor/normalize/normalize.min.css"> <!-- Normalize CSS (https://necolas.github.io/normalize.css/) -->
		<link rel="stylesheet" href="assets/vendor/fontawesome/css/fontawesome-all.min.css"> <!-- Font Icons CSS (https://fontawesome.com) Free version! -->
		<link rel="stylesheet" href="assets/vendor/swiper/css/swiper-bundle.min.css"> <!-- Swiper CSS (https://swiperjs.com/) -->
		<link rel="stylesheet" href="assets/vendor/lightgallery/css/lightgallery.min.css"> <!-- lightGallery CSS (http://sachinchoolur.github.io/lightGallery) -->

		<!-- Template master CSS -->
		<link rel="stylesheet" href="assets/css/helper.css">
		<link rel="stylesheet" href="assets/css/theme.css">

	</head>


	<!-- ===========
	///// Body /////
	================
	* Use class "tt-boxed" to enable page boxed layout globally (affects all elements containing class "tt-wrap").
	* Use class "tt-smooth-scroll" to enable page smooth scrolling.
	* Use class "tt-transition" to enable page transitions.
	* Use class "tt-magic-cursor" to enable magic cursor.
	-->
	<body id="body" class="tt-transition tt-boxed tt-smooth-scroll tt-magic-cursor">


		<!-- *************************************
		*********** Begin body inner *************
		************************************** -->
		<main id="body-inner">

			<!-- Begin page transition (do not remove!!!)
			=========================== -->
			<div id="page-transition">
				<div class="ptr-overlay"></div>
				<div class="ptr-preloader">
					<div class="ptr-prel-content">
						<!-- Hint: You may need to change the img height and opacity to match your logo type. You can do this from the "theme.css" file (find: ".ptr-prel-image"). -->
						<img src="assets/img/logo-light.png" class="ptr-prel-image tt-logo-light" alt="Logo">
					</div> <!-- /.ptr-prel-content -->
				</div> <!-- /.ptr-preloader -->
			</div>
			<!-- End page transition -->

			<!-- Begin magic cursor
			======================== -->
			<div id="magic-cursor">
				<div id="ball"></div>
			</div>
			<!-- End magic cursor -->

			<!-- Begin noise background -->
			<div class="bg-noise"></div>
			<!-- End noise background -->


			<!-- *****************************************
			*********** Begin scroll container ***********
			****************************************** -->
			<div id="scroll-container">

				<!-- ===================
				///// Begin header /////
				========================
				* Use class "tt-header-fixed" to set header to fixed position.
				-->
				<header id="tt-header" class="tt-header-fixed">
					<div class="tt-header-inner"> <!-- add/remove class "tt-wrap" to enable/disable element boxed layout (class "tt-boxed" is required in <body> tag!). Note: additionally you can use prepared helper class "max-width-*" to add custom width to "tt-wrap". Example: "max-width-1500" (class "tt-wrap" is still required!). More info about helper classes can be found in the file "helper.css". -->

						<div class="tt-header-col">

							<!-- Begin logo
							================ -->
							<div class="tt-logo">
								<a href="index">
									<!-- Hint: You may need to change the img height to match your logo type. You can do this from the "theme.css" file (find: ".tt-logo img"). -->
									<img src="assets/img/logo-light.png" class="tt-logo-light magnetic-item" alt="Logo"> <!-- logo light -->
									<img src="assets/img/logo-dark.png" class="tt-logo-dark magnetic-item" alt="Logo"> <!-- logo dark -->
								</a>
							</div>
							<!-- End logo -->

						</div> <!-- /.tt-header-col -->

						<div class="tt-header-col">

							<!-- Begin overlay menu toggle button -->
							<div id="tt-ol-menu-toggle-btn-wrap">
								<div class="tt-ol-menu-toggle-btn-text">
									<span class="text-menu" data-hover="Open">Menu</span>
									<span class="text-close">Close</span>
								</div>
								<div class="tt-ol-menu-toggle-btn-holder">
									<a href="#" class="tt-ol-menu-toggle-btn magnetic-item"><span></span></a>
								</div>
							</div>
							<!-- End overlay menu toggle button -->

							<!-- Begin overlay menu
							========================
							* Use class "tt-ol-menu-center" to align menu to center.
							* Use class "tt-ol-menu-count" to enable menu counter.
							-->
							<nav class="tt-overlay-menu tt-ol-menu-center tt-ol-menu-count">
								<div class="tt-ol-menu-holder">
									<div class="tt-ol-menu-inner tt-wrap">
										<div class="tt-ol-menu-content">

											<!-- Begin menu list -->
											<ul class="tt-ol-menu-list">

												<li><a href="index">Home</a></li>
												<li><a href="all_projects">All projects</a></li>
												<li><a href="mailto:maximeridou2@gmail.com">Contact</a></li>

											</ul>
											<!-- End menu list -->

										</div> <!-- /.tt-ol-menu-content -->
									</div> <!-- /.tt-ol-menu-inner -->
								</div> <!-- /.tt-ol-menu-holder -->

								<!-- Begin noise background -->
								<div class="bg-noise"></div>
								<!-- End noise background -->

							</nav>
							<!-- End overlay menu -->

						</div> <!-- /.header-col -->
					</div> <!-- /.header-inner -->
				</header>
				<!-- End header -->


				<!-- *************************************
				*********** Begin content wrap ***********
				************************************** -->
				<div id="content-wrap">


					<!-- ========================
					///// Begin page header /////
					=============================
					* Use class "ph-full" to enable fullscreen size.
					* Use class "ph-cap-sm", "ph-cap-lg", "ph-cap-xlg" or "ph-cap-xxlg" to set caption size (no class = default size).
					* Use class "ph-center" to enable content center position.
					* Use class "ph-bg-image" to enable page header background image (required for a portfolio single project!).
					* Use class "ph-bg-image-is-light" if needed, it makes the elements dark and more visible if you use a very light image (effect only with class "ph-bg-image").
					* Use class "ph-image-shadow" to enable page header background image (effect only with class "ph-bg-image").
					* Use class "ph-image-cropped" to crop image. It fixes image dimensions (no effect for "ph-bg-image"!).
					* Use class "ph-image-cover-*" to set image overlay opacity. For example "ph-image-cover-2" or "ph-image-cover-2-5" (up to "ph-image-cover-9-5").
					* Use class "ph-content-parallax" to enable content parallax.
					* Use class "ph-stroke" to enable caption title stroke style.
					-->
					<div id="page-header" class="ph-full ph-cap-sm ph-image-cropped ph-image-cover-2 ph-content-parallax">
						<div class="page-header-inner tt-wrap">

							<!-- Begin page header image
							============================= -->
							<!-- <div class="ph-image">
								<div class="ph-image-inner">
									<img src="assets/img/page-header/ph-6.jpg" alt="Image">
								</div>
							</div>
							-->
							<!-- End page header image -->

							<!-- Begin page header caption
							===============================
							Use class "max-width-*" to set caption max width if needed. For example "max-width-1000". More info about helper classes can be found in the file "helper.css".
							-->
							<div class="ph-caption max-width-1600">
								<h1 class="ph-caption-title ph-appear font-normal">Hello ✌️<br>I'm <f class="special">Maxime Ridou</f>, a <f class="special">Product Designer</f> based in Paris @Leeto. </h1>
								<div class="ph-caption-title-ghost ph-appear ph-appear">Product Designer</div>
								<div class="ph-caption-subtitle ph-appear">
									<!-- <h2 class="ph-caption-title ph-appear text-lg">I'm looking for a Product Designer job starting soon.</h2> -->
									<div class="tt-btn tt-btn-link margin-top-20">
										<a href="MAXIME_RIDOU_CV.pdf" target="_blank" data-hover="Go here 👉">Download my CV</a>
									</div>
							</div>
							</div>
							<!-- End page header caption -->

						</div> <!-- /.page-header-inner -->

						<!-- Begin scroll down circle (you can change "data-offset" to set scroll top offset)
						============================== -->
						<a href="#page-content" class="scroll-down-circle" data-offset="30">
							<div class="sdc-inner ph-appear">
								<div class="sdc-icon"><i class="fas fa-chevron-down"></i></div>
								<svg viewbox="0 0 500 500">
									<defs>
										<path d="M50,250c0-110.5,89.5-200,200-200s200,89.5,200,200s-89.5,200-200,200S50,360.5,50,250" id="textcircle"></path>
									</defs>
									<text dy="30">
										<textpath xlink:href="#textcircle">Scroll down - Scroll down -</textpath>
									</text>
								</svg>
							</div> <!-- /.sdc-inner -->
						</a>
						<!-- End scroll down circle -->

						<!-- Begin made with love
						========================== -->
						<div class="made-with-love ph-appear">
							<div class="mwl-inner">
								<div class="mwl-text">Made with</div>
								<div class="mwl-icon"><i class="far fa-heart"></i></div>
							</div>
						</div>
						<!-- End made with love -->

					</div>
					<!-- End page header -->


					<!-- *************************************
					*********** Begin page content ***********
					************************************** -->
					<div id="page-content">

						<!-- =======================
						///// Begin tt-section /////
						============================
						* You can use padding classes if needed. For example "padding-top-xlg-150", "padding-bottom-xlg-150", "no-padding-top", "no-padding-bottom", etc. Note that each situation may be different and each section may need different classes according to your needs. More info about helper classes can be found in the file "helper.css".
						-->
						<div class="tt-section no-padding-bottom">
							<div class="tt-section-inner">

								<!-- Begin tt-Heading
								======================
								* Use class "tt-heading-xsm", "tt-heading-sm", "tt-heading-lg", "tt-heading-xlg" or "tt-heading-xxlg" to set caption size (no class = default size).
								* Use class "tt-heading-stroke" to enable stroke style.
								* Use class "tt-heading-center" to align tt-Heading to center.
								* Use prepared helper class "max-width-*" to add custom width if needed. Example: "max-width-800". More info about helper classes can be found in the file "helper.css".
								-->
								<div class="tt-heading tt-heading-lg tt-heading-center margin-bottom-10-p anim-fadeinup">
									<h3 class="tt-heading-subtitle text-gray">Latest Projects</h3>
									<h2 class="tt-heading-title">Works</h2>
									<div class="tt-btn tt-btn-link margin-top-20">
										<a href="all_projects" data-hover="Find out 👉">See All Works</a>
									</div>
								</div>
								<!-- End tt-Heading -->


								<!-- Begin portfolio grid (works combined with tt-Ggrid!)
								==========================
								* Use class "pgi-hover" to enable portfolio grid item hover effect (behavior depends on "ttgr-gap-*" classes below!).
								* Use class "pgi-cap-hover" to enable portfolio grid item caption hover effect (effect only with class "pgi-cap-inside"! Also no effect on mobile devices!).
								* Use class "pgi-cap-center" to position portfolio grid item caption to center.
								* Use class "pgi-cap-inside" to position portfolio grid item caption to inside.
								-->
								<div id="portfolio-grid" class="pgi-cap-inside pgi-hover">

									<!-- Begin tt-Grid
									===================
									* Use class "ttgr-layout-2", "ttgr-layout-3", "ttgr-layout-4" to set grid layout (columns). No class = one column.
									* Use class "ttgr-layout-1-2", "ttgr-layout-2-1", "ttgr-layout-2-3", "ttgr-layout-3-2", "ttgr-layout-3-4" or "ttgr-layout-4-3" to set grid mixed layout (columns).
									* Use class "ttgr-layout-creative-1" or "ttgr-layout-creative-2" to set grid creative mixed layout (no effect with classes "ttgr-portrait", "ttgr-portrait-half", "ttgr-not-cropped" and "ttgr-shifted").
									* Use class "ttgr-portrait" or "ttgr-portrait-half" to enable portrait mode (no effect with classes "ttgr-layout-creative-1", "ttgr-layout-creative-2" and "ttgr-not-cropped").
									* Use class "ttgr-gap-1", "ttgr-gap-2", "ttgr-gap-3", "ttgr-gap-4", "ttgr-gap-5" or "ttgr-gap-6" to add space between items.
									* Use class "ttgr-not-cropped" to enable not cropped mode (effect only with classes "ttgr-layout-2", "ttgr-layout-3" and "ttgr-layout-4").
									* Use class "ttgr-shifted" to enable shifted layout (effect only with classes "ttgr-layout-2", "ttgr-layout-3" and "ttgr-layout-4").
									-->
									<div class="tt-grid ttgr-layout-creative-2 ttgr-not-cropped ttgr-gap-4">

										<!-- Begin tt-Grid items wrap
										============================== -->
										<div class="tt-grid-items-wrap isotope-items-wrap">

											<!-- Begin tt-Grid item
											======================== -->
											<div class="tt-grid-item isotope-item people">
												<div class="ttgr-item-inner">

													<!-- Begin portfolio grid item
													===============================
													* Use class "pgi-image-is-light" if needed, it makes the caption visible better if you use light image (only effect if "pgi-cap-inside" is enabled on "portfolio-grid"! Also no effect on small screens!).
													-->
													<div class="portfolio-grid-item">
														<a href="project_leeto" class="pgi-image-wrap" data-cursor="View<br>Project">
															<!-- Use class "cover-opacity-*" to set image overlay if needed. For example "cover-opacity-2". Useful if class "pgi-cap-inside" is enabled on "portfolio-grid". Note: It is individual and depends on the image you use. More info about helper classes in file "helper.css". -->
															<div class="pgi-image-holder cover-opacity-3">
																<div class="pgi-image-inner anim-zoomin">
																	<figure class="pgi-image ttgr-height">
																		<img src="assets/img/leeto/leeto_home.png" alt="image">
																	</figure> <!-- /.pgi-image -->
																</div> <!-- /.pgi-image-inner -->
															</div> <!-- /.pgi-image-holder -->
														</a> <!-- /.pgi-image-wrap -->

														<div class="pgi-caption">
															<div class="pgi-caption-inner">
																<h2 class="pgi-title">Leeto</h2>
																<div class="pgi-categories-wrap">
																	<div class="pgi-category">UX/UI Design</div>
																	<!-- <div class="pgi-category">Varia</div> -->
																</div> <!-- /.pli-categories-wrap -->
															</div> <!-- /.pgi-caption-inner -->
														</div> <!-- /.pgi-caption -->
													</div>
													<!-- End portfolio grid item -->

												</div> <!-- /.ttgr-item-inner -->
											</div>
											<!-- End tt-Grid item -->

											<!-- Begin tt-Grid item
											======================== -->
											<div class="tt-grid-item isotope-item creative">
												<div class="ttgr-item-inner">

													<!-- Begin portfolio grid item
													===============================
													* Use class "pgi-image-is-light" if needed, it makes the caption visible better if you use light image (only effect if "pgi-cap-inside" is enabled on "portfolio-grid"!).
													-->
													<div class="portfolio-grid-item anim-parallax">
														<a href="cheerz_projects" class="pgi-image-wrap" data-cursor="View<br>Project">
															<!-- Use class "cover-opacity-*" to set image overlay if needed. For example "cover-opacity-2". Useful if class "pgi-cap-inside" is enabled on "portfolio-grid". Note: It is individual and depends on the image you use. More info about helper classes in file "helper.css". -->
															<div class="pgi-image-holder cover-opacity-3">
																<div class="pgi-image-inner anim-zoomin">
																	<figure class="pgi-image ttgr-height">
																		<img src="assets/img/cheerz/cheerz_home.png" alt="image">
																	</figure> <!-- /.pgi-image -->
																</div> <!-- /.pgi-image-inner -->
															</div> <!-- /.pgi-image-holder -->
														</a> <!-- /.pgi-image-wrap -->

														<div class="pgi-caption">
															<div class="pgi-caption-inner">
																<h2 class="pgi-title">Cheerz</h2>
																<div class="pgi-categories-wrap">
																	<div class="pgi-category">UX/UI Design</div>
																	<!-- <div class="pgi-category">Varia</div> -->
																</div> <!-- /.pli-categories-wrap -->
															</div> <!-- /.pgi-caption-inner -->
														</div> <!-- /.pgi-caption -->
													</div>
													<!-- End portfolio grid item -->

												</div> <!-- /.ttgr-item-inner -->
											</div>
											<!-- End tt-Grid item -->

											<!-- Begin tt-Grid item
											======================== -->
											<div class="tt-grid-item isotope-item people">
												<div class="ttgr-item-inner">

													<!-- Begin portfolio grid item
													===============================
													* Use class "pgi-image-is-light" if needed, it makes the caption visible better if you use light image (only effect if "pgi-cap-inside" is enabled on "portfolio-grid"!).
													-->
													<div class="portfolio-grid-item">
														<a href="project_leboncoin" class="pgi-image-wrap" data-cursor="View<br>Project">
															<!-- Use class "cover-opacity-*" to set image overlay if needed. For example "cover-opacity-2". Useful if class "pgi-cap-inside" is enabled on "portfolio-grid". Note: It is individual and depends on the image you use. More info about helper classes in file "helper.css". -->
															<div class="pgi-image-holder cover-opacity-3">
																<div class="pgi-image-inner anim-zoomin">
																	<figure class="pgi-image ttgr-height">
																		<img src="assets/img/leboncoin/lbc_home.png" alt="image">
																	</figure> <!-- /.pgi-image -->
																</div> <!-- /.pgi-image-inner -->
															</div> <!-- /.pgi-image-holder -->
														</a> <!-- /.pgi-image-wrap -->

														<div class="pgi-caption">
															<div class="pgi-caption-inner">
																<h2 class="pgi-title">Leboncoin</h2>
																<div class="pgi-categories-wrap">
																	<div class="pgi-category">Branding</div>
																	<!-- <div class="pgi-category">Varia</div> -->
																</div> <!-- /.pli-categories-wrap -->
															</div> <!-- /.pgi-caption-inner -->
														</div> <!-- /.pgi-caption -->
													</div>
													<!-- End portfolio grid item -->

												</div> <!-- /.ttgr-item-inner -->
											</div>
											<!-- End tt-Grid item -->

											<!-- Begin tt-Grid item
											======================== -->
											<div class="tt-grid-item isotope-item nature">
												<div class="ttgr-item-inner">

													<!-- Begin portfolio grid item
													===============================
													* Use class "pgi-image-is-light" if needed, it makes the caption visible better if you use light image (only effect if "pgi-cap-inside" is enabled on "portfolio-grid"!).
													-->
													<div class="portfolio-grid-item">
														<a href="project_betagouv" class="pgi-image-wrap" data-cursor="View<br>Project">
															<!-- Use class "cover-opacity-*" to set image overlay if needed. For example "cover-opacity-2". Useful if class "pgi-cap-inside" is enabled on "portfolio-grid". Note: It is individual and depends on the image you use. More info about helper classes in file "helper.css". -->
															<div class="pgi-image-holder cover-opacity-3">
																<div class="pgi-image-inner anim-zoomin">
																	<figure class="pgi-image ttgr-height">
																		<img src="assets/img/betagouv/betagouv_home.png" alt="image">
																	</figure> <!-- /.pgi-image -->
																</div> <!-- /.pgi-image-inner -->
															</div> <!-- /.pgi-image-holder -->
														</a> <!-- /.pgi-image-wrap -->

														<div class="pgi-caption">
															<div class="pgi-caption-inner">
																<h2 class="pgi-title">Libère ta voie</h2>
																<div class="pgi-categories-wrap">
																	<div class="pgi-category">UX/UI Design</div>
																	<!-- <div class="pgi-category">Varia</div> -->
																</div> <!-- /.pli-categories-wrap -->
															</div> <!-- /.pgi-caption-inner -->
														</div> <!-- /.pgi-caption -->
													</div>
													<!-- End portfolio grid item -->

												</div> <!-- /.ttgr-item-inner -->
											</div>
											<!-- End tt-Grid item -->

										</div>
										<!-- End tt-Grid items wrap  -->

									</div>
									<!-- End tt-Grid -->

								</div>
								<!-- End portfolio grid -->

							</div> <!-- /.tt-section-inner -->
						</div>
						<!-- End tt-section -->


						<!-- =======================
						///// Begin tt-section /////
						============================
						* You can use padding classes if needed. For example "padding-top-xlg-150", "padding-bottom-xlg-150", "no-padding-top", "no-padding-bottom", etc. Note that each situation may be different and each section may need different classes according to your needs. More info about helper classes can be found in the file "helper.css".
						-->
						<!-- End tt-section -->


						<!-- =======================
						///// Begin tt-section /////
						============================
						* You can use padding classes if needed. For example "padding-top-xlg-150", "padding-bottom-xlg-150", "no-padding-top", "no-padding-bottom", etc. Note that each situation may be different and each section may need different classes according to your needs. More info about helper classes can be found in the file "helper.css".
						-->
						<!-- End tt-section -->


						<!-- =======================
						///// Begin tt-section /////
						============================
						* You can use padding classes if needed. For example "padding-top-xlg-150", "padding-bottom-xlg-150", "no-padding-top", "no-padding-bottom", etc. Note that each situation may be different and each section may need different classes according to your needs. More info about helper classes can be found in the file "helper.css".
						-->
						<div class="tt-section padding-top-xlg-150 padding-bottom-xlg-150">
							<div class="tt-section-inner">

								<!-- Begin scrolling text
								==========================
								Change data-scroll-speed="*" to adjust scrolling speed.
								Use class "scr-text-reverse" to reverse scrolling direction.
								Use class "scr-text-stroke" to enable text stroke style (no effect on smaller screens!).
								-->
								<div class="tt-scrolling-text scr-text-stroke font-italic" data-scroll-speed="18">
									<div class="tt-scrolling-text-inner text-dark-3" data-text="Let's create something awesome together! -">
										Let's create something awesome together! -
									</div> <!-- /.tt-scrolling-text-inner -->
								</div>
								<!-- End scrolling text -->

								<!-- Begin scrolling text
								==========================
								Change data-scroll-speed="*" to adjust scrolling speed.
								Use class "scr-text-reverse" to reverse scrolling direction.
								Use class "scr-text-stroke" to enable text stroke style (no effect on smaller screens!).
								-->
								<div class="tt-scrolling-text scr-text-stroke scr-text-reverse font-italic" data-scroll-speed="18">
									<div class="tt-scrolling-text-inner text-dark-3" data-text="Let's create something awesome together! -">
										Let's create something awesome together! -
									</div> <!-- /.tt-scrolling-text-inner -->
								</div>
								<!-- End scrolling text -->

							</div> <!-- /.tt-section-inner -->
						</div>
						<!-- End tt-section -->


						<!-- =======================
						///// Begin tt-section /////
						============================
						* You can use padding classes if needed. For example "padding-top-xlg-150", "padding-bottom-xlg-150", "no-padding-top", "no-padding-bottom", etc. Note that each situation may be different and each section may need different classes according to your needs. More info about helper classes can be found in the file "helper.css".
						-->
						<div class="tt-section padding-bottom-xlg-150">
							<div class="tt-section-inner tt-wrap">

								<!-- Begin page nav
								====================
								* Use class "tt-pn-stroke" to enable title stroke style.
								* Use class "tt-pn-scroll" to enable hover title scroll. Note: If "tt-pn-hover-title" text is wider than "tt-pn-link" then it scrolls by default. The longer the text, the faster it scrolls.
								-->
								<div class="tt-page-nav tt-pn-scroll">
									<a href="mailto:maximeridou2@gmail.com" class="tt-pn-link anim-fadeinup">
										<div class="tt-pn-title tt-pn-title-white">Let's talk 👋</div>
										<div class="tt-pn-hover-title">Let's talk 👋</div>
									</a> <!-- /.tt-pn-link -->

									<!-- Use if destination page contains page header image -->
								</div>
								<!-- End page nav -->

							</div> <!-- /.tt-section-inner -->
						</div>
						<!-- End tt-section -->

					</div>
					<!-- End page content -->


					<!-- ======================
					///// Begin tt-footer /////
					=========================== -->
					<footer id="tt-footer">
						<div class="tt-footer-inner">

							<!-- Begin footer column
							========================= -->
							<div class="footer-col tt-align-center-left">
								<div class="footer-col-inner">

									<!-- You can use whatever button or link here -->
									<div class="tt-btn tt-btn-link">
										<a href="#" class="scroll-to-top" data-hover="Back to top">Back to top</a>
									</div>

								</div> <!-- /.footer-col-inner -->
							</div>
							<!-- Begin footer column -->

							<!-- Begin footer column
							========================= -->
							<div class="footer-col tt-align-center order-m-last">
								<div class="footer-col-inner">



								</div> <!-- /.footer-col-inner -->
							</div>
							<!-- Begin footer column -->

							<!-- Begin footer column
							========================= -->
							<div class="footer-col tt-align-center-right">
								<div class="footer-col-inner">

									<div class="footer-social">
										<div class="footer-social-text"><span>Social networks 👉</span></div>
										<div class="social-buttons">
											<ul>
												<li><a href="https://www.linkedin.com/in/maxime-ridou-17317a153/" class="magnetic-item" target="_blank" rel="noopener">In.</a></li>
												<li><a href="https://www.instagram.com/vysokoskorostno/" class="magnetic-item" target="_blank" rel="noopener">Ig.</a></li>
												<li><a href="https://www.behance.net/vysokoskorostno" class="magnetic-item" target="_blank" rel="noopener">Be.</a></li>
											</ul>
										</div> <!-- /.social-buttons -->
									</div> <!-- /.footer-social -->

								</div> <!-- /.footer-col-inner -->
							</div>
							<!-- Begin footer column -->

						</div> <!-- /.tt-section-inner -->
					</footer>
					<!-- End tt-footer -->


				</div>
				<!-- End content wrap -->

			</div>
			<!-- End scroll container -->


		</main>
		<!-- End body inner -->




		<!-- ====================
		///// Scripts below /////
		===================== -->

		<!-- Core JS -->
		<script src="assets/vendor/jquery/jquery.min.js"></script> <!-- jquery JS (https://jquery.com) -->

		<!-- Libs and Plugins JS -->
		<script src="assets/vendor/gsap/gsap.min.js"></script> <!-- GSAP JS (https://greensock.com/gsap/) -->
		<script src="assets/vendor/gsap/ScrollToPlugin.min.js"></script> <!-- GSAP ScrollToPlugin JS (https://greensock.com/scrolltoplugin/) -->
		<script src="assets/vendor/gsap/ScrollTrigger.min.js"></script> <!-- GSAP ScrollTrigger JS (https://greensock.com/scrolltrigger/) -->

		<script src="assets/vendor/smooth-scrollbar.js"></script> <!-- Smooth Scrollbar JS (https://github.com/idiotWu/smooth-scrollbar/) -->
		<script src="assets/vendor/swiper/js/swiper-bundle.min.js"></script> <!-- Swiper JS (https://swiperjs.com/) -->
		<script src="assets/vendor/isotope/imagesloaded.pkgd.min.js"></script> <!-- imagesloaded JS (more info: https://imagesloaded.desandro.com/) -->
		<script src="assets/vendor/isotope/isotope.pkgd.min.js"></script> <!-- Isotope JS (http://isotope.metafizzy.co) -->
		<script src="assets/vendor/isotope/packery-mode.pkgd.min.js"></script> <!-- Isotope Packery Mode JS (https://isotope.metafizzy.co/layout-modes/packery.html) -->
		<script src="assets/vendor/lightgallery/js/lightgallery-all.min.js"></script> <!-- lightGallery Plugins JS (http://sachinchoolur.github.io/lightGallery) -->
		<script src="assets/vendor/jquery.mousewheel.min.js"></script> <!-- A jQuery plugin that adds cross browser mouse wheel support (https://github.com/jquery/jquery-mousewheel) -->

		<!-- Theme master JS -->
		<script src="assets/js/theme.js"></script>



	</body>

</html>