<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CodePen - FlexBox Exercise #3 - Image carousel</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- partial:index.partial.html -->
<link href="https://fonts.googleapis.com/css?family=Exo:700&display=swap" rel="stylesheet">
<div id="reviews-carousel">
<div class="carousel">
<!-- NAVIGATION -->
<div class="carousel__nav">
<span id="moveLeft" class="carousel__arrow">
<svg class="carousel__icon" width="24" height="24" viewBox="0 0 24 24"><path d="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"></path></svg>
</span>
<span id="moveRight" class="carousel__arrow" >
<svg class="carousel__icon" width="24" height="24" viewBox="0 0 24 24"><path d="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"></path></svg>
</span>
</div>
<!-- CAROUSEL -->
<div class="carousel-item carousel-item--1 active">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/review-climbworks-compressor.png" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__client"><a href="#" target="_blank">CLIMB Works</a></p>
<p class="carousel-item__description">Make Me Modern hosts 5 of our websites that have accumulated over 2.5 million pageviews in the last year. Thomas and his team builds and maintains websites for us, they've migrated them to their servers, performed SEO mods that resulted in increased rankings, and are always quick to fix any issues that arise or to make requested changes. We're very careful about who we give this much access to such a vital part of our businesses and Make Me Modern has become a valuable resource to us.</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--2">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/review-climbworks-compressor.png" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Make Me Modern was incredible throughout the entire process of developing our new website. I cannot say enough good things about Thomas. The level of responsiveness and customer service demonstrated by him is extremely rare. Make Me Modern has my highest recommendation.</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--3">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Thomas & team are so easy to work with - they're responsive and good at what they do. It's a true partnership, not just a company you send a list to. Make Me Modern brings insight and great ideas to the table. "No" isn't in their vocabulary. MMM is the only company in consideration for my future projects - no need to look anywhere else!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--4">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Thomas and his team are incredibly talented across a broad array of branding and video/web capabilities. He has a collaborative style that works very well to accomplish your business goals in record time. I can't recommend Thomas and the team highly enough and have referred many of my business colleagues to him. I'd post this as "6 Stars" if possible!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--5">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Thomas and his team went above and beyond with the build of our website and custom software! Couldn't ask for a better person to work with. Highly recommend!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--6">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Met with Thomas at Make Me Modern and he was able to translate my ideas to update my existing website into great design. I don't have a huge "web vocabulary" and really no experience with web design, and I'm very happy with the end product and result. Fair prices, quick turnaround, and easy suggestions to improve our website. Highly recommend!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--7">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Excellent company to work with when having a website built. They were professional and courteous. The build was quick and looks amazing. Communication was great as they were always quick to respond to questions in a timely manner. Even after the work is done they still are there when you need them. Highly recommend if you need a quality website that will stand out from the rest!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--8">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Whether you want to build a new website from scratch, or need to update the one you have, I highly recommend you call Thomas Truett and the folks at Make Me Modern. They take the time to learn about you and your business so they can create exactly what you envision. These guys rock!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--9">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">We were so pleased with this company! Affordable, personable, willing to work around our schedules and come to our locations, and prompt, all whilst providing us with a killer and somehow professional yet fun website!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--9">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Experts in e-commerce, design and user experience. Highly recommended.</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--9">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Love Make Me Modern. They are friendly, prompt and take great care of all of our needs! Highly recommend them!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--9">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Thomas has been so unbelievably helpful and efficient with everything. Plus, we absolutely love our new site - it's everything we wanted, and more!! We had to have him design a site from scratch going off of our very old one. Along with doing a fantastic job with creating the new site, he also made it very easy for us to go in and edit everything manually whenever we want/need to, which was imperative for us. It's been so simple to learn how to do everything, plus he's made everything much easier by always being so reachable, and thorough with explaining everything. We couldn't be happier with choosing him as our site designer.</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--9">
<div class="carousel-item__image"><img src="https://makememodern.com/wp-content/uploads/mmm-logo-light" /></div>
<div class="carousel-item__info">
<div class="carousel-item__container">
<p class="carousel-item__description">Thomas was great to work with. He was very efficient in his correspondence with us. Our website has had a total makeover, and is everything we could want for our company! Thank you Thomas and everyone at Make Me Modern!</p>
<a class="link-to-review" href="https://www.google.com/search?q=make+me+modern" title="Read more Knoxville web design reviews." target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 269.64 106.31" id="svg_resize" width="115" height="50"><path d="M115.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#ea4335"></path><path d="M163.39 46.71a22.25 22.25 0 01-44.5 0 22.25 22.25 0 0144.5 0zm-9.74 0c0-8-5.79-13.44-12.51-13.44s-12.51 5.46-12.51 13.44 5.79 13.44 12.51 13.44 12.51-5.55 12.51-13.44z" fill="#fbbc05"></path><path d="M209.39 25.87v39.82c0 16.38-9.66 23.07-21.08 23.07a21.12 21.12 0 01-19.66-13.07l8.48-3.53c1.51 3.61 5.21 7.87 11.17 7.87 7.31 0 11.84-4.51 11.84-13v-3.19h-.34a15.1 15.1 0 01-11.68 5c-11.09 0-21.25-9.66-21.25-22.09S177 24.53 188.12 24.53a15.37 15.37 0 0111.68 5h.34v-3.65h9.25zm-8.56 20.92c0-7.81-5.21-13.52-11.84-13.52S176.64 39 176.64 46.79s5.63 13.36 12.36 13.36 11.83-5.63 11.83-13.36z" fill="#4285f4"></path><path d="M224.64 2.53v65h-9.5v-65z" fill="#34a853"></path><path d="M261.66 54l7.56 5a22.08 22.08 0 01-18.48 9.83c-12.6 0-22-9.74-22-22.18 0-13.19 9.49-22.18 20.92-22.18s17.14 9.16 19 14.11l1 2.52L240 53.43c2.27 4.45 5.8 6.72 10.75 6.72s8.4-2.44 10.92-6.14zm-23.27-8l19.82-8.23c-1.09-2.77-4.37-4.7-8.23-4.7A12.17 12.17 0 00238.39 46z" fill="#ea4335"></path><path d="M34.93 40.94v-9.41h31.71a31.18 31.18 0 01.47 5.68c0 7.06-1.93 15.79-8.15 22-6.05 6.3-13.78 9.66-24 9.66C16 68.88 0 53.42 0 34.44S16 0 34.94 0a32.82 32.82 0 0123.6 9.49l-6.64 6.64a24 24 0 00-17-6.72 24.7 24.7 0 00-24.7 25 24.7 24.7 0 0024.7 25c9 0 14.11-3.61 17.39-6.89 2.66-2.66 4.41-6.46 5.1-11.65z" fill="#4285f4"></path><path d="M15.72 76.4l3.72 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07L6 106.31l3.72-11.43L0 87.82h12zM47.22 76.4l3.71 11.42h12l-9.71 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.71-11.43-9.7-7.06h12zM78.72 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.71-7.07-9.71 7.07 3.71-11.43L63 87.82h12zM110.21 76.4l3.71 11.42h12l-9.72 7.06 3.71 11.43-9.72-7.07-9.72 7.07 3.72-11.43-9.72-7.06h12zM141.71 76.4l3.71 11.42h12l-9.72 7.06 3.72 11.43-9.72-7.07-9.7 7.07 3.71-11.43-9.71-7.06h12z" fill="#fbbc05" fill-rule="evenodd"></path></svg></a>
</div>
</div>
</div>
</div>
</div>
<!-- partial -->
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script><script src="./script.js"></script>
</body>
</html>
html,
body {
height: 100%;
width: 100%;
background-color: #efefef;
margin: 0;
}
#reviews-carousel { padding: 5rem }
.carousel {
min-height: 400px;
overflow: hidden;
position: relative;
border-radius: 10px;
margin: 0 auto;
-webkit-box-shadow: 0 13px 27px -5px rgba(100,100,115,.15), 0 8px 16px -8px rgba(50,50,50,.15), 0 -6px 16px -6px rgba(50,50,50,.015);
box-shadow: 0 13px 27px -5px rgba(100,100,115,.15), 0 8px 16px -8px rgba(50,50,50,.15), 0 -6px 16px -6px rgba(50,50,50,.015);
}
.carousel-item {
visibility:visible;
display: flex;
width: 100%;
height: 100%;
align-items: center;
justify-content: flex-end;
-webkit-align-items: center;
-webkit-justify-content: flex-end;
position: relative;
background-color: #fff;
flex-shrink: 0;
-webkit-flex-shrink: 0;
position: absolute;
z-index: 0;
transition: 0.6s all linear;
}
.carousel-item__info {
align-items: center;
display: flex;
order: 1;
left: 0;
margin: auto;
padding: 40px 20px 40px 40px;
width: 60%;
}
.carousel-item__image {
width: 40%;
height: 100%;
order: 2;
align-self: center;
flex-basis: 40%;
-webkit-order: 2;
-webkit-align-self: flex-end;
-webkit-flex-basis: 40%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position:relative;
transform: translateX(100%);
transition: 0.6s all ease-in-out;
}
.carousel-item__image img {
z-index: 100;
width: 200px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-35%, -50%);
}
.carousel-item__image:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #424242;
opacity: 0.75;
z-index: 0;
}
.carousel-item__image:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 30%;
height: 100%;
background: #fff;
-webkit-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transform: skew(-15deg);
-ms-transform: skew(-15deg);
transform: skew(-15deg);
z-index: 1;
}
.carousel-item__description {
transform: translateY(25%);
opacity: 0;
visibility: hidden;
transition: 0.6s all ease-in-out;
font-family: 'Open Sans', sans-serif;
font-size: 16px;
font-weight: 300;
color: #7e7e7e;
line-height: 1.5;
margin: 0 0 1.5rem;
font-style: italic;
}
.carousel-item__client {
font-family: 'Exo', sans-serif;
font-style: normal !important;
font-weight: 700;
font-size: 20px;
margin: 0 0 1rem;
}
.carousel-item__client a {
color: #e45323;
text-decoration: none
}
.carousel-item__info .link-to-review,
.carousel-item__info .link-to-review svg { display: block }
/* Navigation */
.carousel__nav {
position: absolute;
right: 0;
z-index: 2;
background-color: #fff;
bottom: 0;
overflow: hidden;
border-top-left-radius: 10px;
}
.carousel__icon {
display: inline-block;
vertical-align: middle;
width: 16px;
fill: #5d5d5d;
}
.carousel__arrow {
cursor: pointer;
display: inline-block;
position: relative;
}
.carousel__arrow:nth-child(1) { padding: 10px 5px 10px 15px }
.carousel__arrow:nth-child(2) { padding: 10px 15px 10px 5px }
/* Active */
.active {
z-index: 1;
display: flex;
visibility: visible;
}
.active .carousel-item__subtitle,
.active .carousel-item__title,
.active .carousel-item__description {
transform: translateY(0);
opacity: 1;
transition: 0.6s all ease-in-out;
visibility: visible;
}
.active .carousel-item__image {
transition: 0.6s all ease-in-out;
transform: translateX(0);
}
/* Image Specifics */
.carousel-item--1 .carousel-item__image:before { background: rgba(0,0,0,0.35) }
.carousel-item--1 .carousel-item__image { background-image: url('https://makememodern.com/wp-content/uploads/review-climbworks-bg-compressor.jpg') }
.carousel-item--2 .carousel-item__image:before { background: #424242 }
.carousel-item--2 .carousel-item__image { background-image: url('https://images.pexels.com/photos/921294/pexels-photo-921294.png?auto=compress&cs=tinysrgb&h=750&w=1260') }
.carousel-item--3 .carousel-item__image:before { background: #424242 }
.carousel-item--3 .carousel-item__image { background-image: url('https://images.pexels.com/photos/92733/pexels-photo-92733.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260') }
.carousel-item--4 .carousel-item__image:before { background: #424242 }
.carousel-item--4 .carousel-item__image { background-image: url('https://images.pexels.com/photos/1008732/pexels-photo-1008732.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260') }
.carousel-item--5 .carousel-item__image:before { background: #424242 }
.carousel-item--5 .carousel-item__image { background-image: url('https://images.pexels.com/photos/1029614/pexels-photo-1029614.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940') }
$(function(){
// Review Carousel
var total = $('.carousel-item').length;
var current = 0;
$('#moveRight').on('click', function() {
var next = current;
current = current + 1;
setSlide(next, current);
});
$('#moveLeft').on('click', function() {
var prev = current;
current = current - 1;
setSlide(prev, current);
});
function setSlide(prev, next) {
var slide = current;
if (next > total - 1) {
slide = 0;
current = 0;
}
if (next < 0) {
slide = total - 1;
current = total - 1;
}
$('.carousel-item').eq(prev).removeClass('active');
$('.carousel-item').eq(slide).addClass('active');
}
});