Pre-git development branch upload

assets/css/main.css

@@ -1,277 +1,271 @@
-@font-face {
-    font-family: 'oswald';
-	src: url('../fonts/Oswald-Regular.ttf');
-	/*			../fonts/SILOpenFontLicense.txt			*/
-}
 
 :root {
-	--nav-height: 65px;
+	--lm-color: #309d66;
+	--card-height: 550px;
 	--cool-looking-gradient: linear-gradient(to right, #3ad559 0%, #606dc2 100%);
 }
 
 html, body {
 	font-size: 13.5pt;
-	font-family: 'Oswald', sans-serif;
+	font-family: 'Roboto', sans-serif;
     margin: 0;
     height: 100%;
-    background-color: #e6e6e6;
+	background-color: #dfdfdf;
 }
 
 nav {
 	display: flex;
 	flex-direction: row;
-	justify-content: center;
-	position: fixed;
-	height: var(--nav-height);
-	background-color: white;
+	justify-content: start;
+	height: 100px;
 	width: 100%;
-	border-bottom: 5px solid transparent;
-	border-image: var(--cool-looking-gradient);
-	border-image-slice: 1;
+	border-bottom: 1px solid rgba(255,255,255,.15);
 	font-size: 22px;
 	user-select: none;
 	z-index: 1;
+	background: rgba(0,0,0,.6);
+	box-shadow: inset 0 -2px 5px rgba(0,0,0,.5);
 }
 
 nav .logo {
-	background-image: url("../imgs/logo.png");
-	background-repeat: no-repeat;
-	background-size: auto 100%;
 	height: 100%;
 	width: 300px;
-	margin-right: auto;
+	margin-left: 40px;
 }
 
-nav .blank {
-	width: 300px;
-	margin-left: auto;
-}
 
 nav .links {
+	margin-left: auto;
+	margin-right: 60px;
 	display: flex;
 	flex-direction: row;
-	justify-content: center;
+	justify-content: space-between;
+	width: 400px;
+
 }
 
 
 nav .links a {
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	height: 100%;
-	margin: auto 10px auto 10px;
+	font-size: 18px;
+	font-weight: 700;
+	letter-spacing: normal;
+	line-height: 100px;
 	text-align: center;
-	color: #6d6b6b;
+	color: #ffffff;
 	text-decoration: none;
-	transition: color 10ms;
-	font-weight: 900;
+	transition: color 100ms;
+	position: relative;
 }
 
-nav a:hover {
-	color: black;
-	text-shadow: rgba(0, 0, 0, 0.1) 1px 0 5px;
+nav .links a:before, a:after {
+	content: "";
+	position: absolute;
+	bottom: 2px;
+	left: 0;
+	right: 0;
+	height: 2px;
+	background-color: #7df372;
 }
 
-footer {
-	height: 10px;
-	background-color: rgb(59, 59, 59);
-	width: 100%;
-	background-image: var(--cool-looking-gradient);
+nav .links a:before {
+	opacity: 0;
+	transform: translateY(-8px);
+	transition: transform 0s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0s;
 }
 
-#content {
-	display: flex;
-	padding-top: var(--nav-height);
-	flex-direction: column;
-	width: 100%;
+nav .links a:after {
+	opacity: 0;
+	transform: translateY(4px);
+	transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s;
 }
 
-#content #banner {
-	display: flex;
-	min-height: 450px;
-	margin-bottom: 30px;
-	justify-content: center;
-	align-items: center;
-	background-image: url('../imgs/banner.JPG');
-	background-repeat: no-repeat;
-	background-position: 0 -150px;
-	background-size: auto auto;
-	background-attachment: fixed;
+nav .links a:hover:before, a:hover:after, a:focus:before, a:focus:after {
+	opacity: 1;
+	transform: translateY(0);
 }
 
-#content #banner #bannerTxt {
-	margin-right: auto;
-	margin-left: 80px;
-	width: 500px;
-	font-size: 30px;
-	line-height: 1.3;
-	font-weight: 600;
-	color: white;
+nav .links a:hover:before, a:focus:before {
+	transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.2s;
 }
 
-#content #banner #quickInfo {
-	display: flex;
-	align-items: center;
-	flex-direction: column;
-	margin-right: 40px;
-	margin-left: auto;
-	width: 320px;
-	height: 340px;
-	font-size: 20px;
-	line-height: 1.15;
-	font-weight: 600;
-	color: white;
-	background-color: #000000a1;
-	border: 1px solid;
-	border-image-slice: 1;
-	border-image-source: linear-gradient(to left, #004abe, #1e6f07);
+nav .links a:hover:after, a:focus:after {
+	transition: transform 0s 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0s 0.2s;
 }
+  
 
-#content #banner #quickInfo span {
-	align-self: flex-start;
-	margin-left: 20px;
-}
-
-#content #banner #quickInfo span:first-child {
-	margin-top: 10px;
-}
 
-#content #banner #quickInfo p {
-	padding: 0;
-	margin: 10px;
-}
-
-#content .container {
+#wrapper{
+	height: 100%;
+	width: 100%;
 	display: flex;
+	overflow: auto;
 	flex-direction: column;
-	align-items: center;
-	text-align: center;
-	margin-bottom: 20px;
-	width: 100%;
 }
 
-#content .container .row {
+#banner {
+	flex-shrink: 0;
 	display: flex;
-	flex-wrap: wrap;
-	justify-content: center;
+	flex-direction: column;
+	height: 550px;
 	width: 100%;
+	background-image: url('../imgs/22.JPG');
+	background-repeat: no-repeat;
+	background-position: 0 -295px;
+	background-size: 100% auto;
 }
 
-#content .container .service {
-	order: 1;
+.banner-container{
 	display: flex;
+	height: 240px;
+	margin: auto 0 auto 0;
 	flex-direction: column;
 	justify-content: center;
-	margin: 20px;
-	width: 400px;
-	height: 255px;
-	border: solid 1px rgb(94, 94, 94);
-	transition: transform 40ms;
-	user-select: none;
-	cursor: pointer;
+	margin-left: 200px;
+	width: 650px;
+	color: rgb(255, 255, 255);
+	font-family: 'Source Sans Pro', sans-serif;
+	border-style: solid;
+	border-color: #ffffff;
+	border-left-width: 0;
+	border-right-width: 0;
+	border-top-width: 1px;
+	border-bottom-width: 1px;
+	padding: 20px;
+	background: rgba(0,0,0,.6);
+	box-shadow: inset 0 -2px 5px rgba(0,0,0,.33);
+	
 }
 
-#content .container .service:hover{
-	transform: scale(1.1);
+
+.banner-container .header{
+	font-size: 15px;
 }
 
-#content .container .service.active:hover{
-	transform: scale(1);
+.banner-container .title{
+	font-size: 40px;
+	font-weight: 500;
 }
 
-#content .container .service.active {
-	order: 0;
-	width: 100%;
-	min-height: 500px;
-	height: auto;
+.banner-container .buttons{
+	display: flex;
 	flex-direction: row;
-	justify-content: start;
+	font-size: 40px;
+	font-weight: 500;
+	align-self: flex-end;
 }
 
-#content .container .service.active h1 {
-	display: none;
+.banner-container button {
+	font-family: inherit;
+    border: none;
+    margin: 0 0 0 5px;
+    text-decoration: none;
+	background: none;
+    color: #ffffff;
+	font-size: 25px;
+    cursor: pointer;
+    text-align: center;
+	line-height: 1.1;
+	transition: 220ms all ease-in-out;
+	border-style: solid;
+	border-color: #717171;
+	border-width: 1px;
+	padding: 0.25em 0.75em;
+	min-width: 10ch;
+	min-height: 44px;
 }
 
-#content .container .service.active .image {
-	width: 100%;
-	height: 100%;
-	background-size: cover;
+.banner-container button.highlight{
+	background: #309d6691;
 }
 
-#content .container .service.active .image .discription {
-	display: flex;
+.banner-container button:hover,
+.banner-container button:focus {
+    background: var(--lm-color);
 }
 
-#content .container .service h1 {
-	margin-top: auto;
-	font-size: 15pt;
-	width: 100%;
+.banner-container button:focus {
+    outline: 1px solid #fff;
+    outline-offset: -4px;
 }
 
-#content .container .service .image {
-	margin-bottom: auto;
-	height: 200px;
-	width: 100%;
-	background-size: 100% auto;
-	background-repeat: no-repeat;
-	background-position: 0 0;
+.banner-container button:active {
+    transform: scale(0.99);
 }
 
-#content .container .service .image .discription {
-	display: none;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
+
+
+.container{
+	flex-shrink: 0;
 	width: 100%;
-	height: 100%;
-	color: white;
-	background-color: rgba(0, 0, 0, 0.9);
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
 }
 
-#content .container .service .image .discription ul{
-	text-align: left;
+.info-cards{
+	max-width: 1280px;
+	min-height: 500px;
+	background: #f9f9f9;
+	margin-top: -50px;
+	display: flex;
+	flex-direction: row;
+	border-radius: 5px;
 }
 
-#content .container .service .image .discription .contactLink{
-	color: rgb(130, 253, 137);
-	text-decoration: none;
-	font-weight: 900;
-	font-size: 20px;
+.card{
+	flex-shrink: 0;
+	flex-grow: 1;
+	display: flex;
+	flex-direction: column;
+	width: 318px;
+	align-items: center;
 }
 
-#content .container .service .image.pc {
-	background-image: url('../imgs/pc.jpg');
+.card.boarder{
+	border-right-style: solid;
+	border-color: #d9d9d9;
+	border-width: 1px;
 }
 
-#content .container .service .image.pd {
-	background-image: url('../imgs/pd.jpg');
+.card .icon {
+	flex-shrink: 0;
+	color: var(--lm-color);
+	color: rgb(255, 118, 7);
+	margin-top: 50px;
+	width: 70px;
+	height: 70px;
+	stroke: currentColor;
+	stroke-width: 1;
+	stroke-linecap: round;
+	stroke-linejoin: round;
+	fill: none;
 }
 
-#content .container .service .image.hvac {
-	background-image: url('../imgs/hvac.jpg');
+.card .title{
+	flex-shrink: 0;
+	font-family: "Rubik", sans-serif;
+	font-size: 21px;
+	font-weight: 500;
+	color: rgb(27, 26, 26);
 }
 
-#content .container .service .image.pcs {
-	background-image: url('../imgs/pcs.jpg');
+.card p {
+	font-family: "Roboto", sans-serif;
+	font-weight: 400;
+	color: rgb(81, 80, 80);
+	margin: 20px;
+	font-size: 14px;
+	word-wrap: normal;
+	line-height: 24px;
+	text-align: center;
 }
 
-#content .container .contactBox {
-	display: flex;
-	flex-direction: row;
-	justify-content: space-around;
-	align-items: center;
-	width: 100%;
-	padding-top: 20px;
-	background-image: linear-gradient(to bottom, #ccc, transparent);
-	font-size: 20px;
-	font-weight: 600;
-}
 
-#content .container .contactBox .infoContainer {
-	padding-top: 5px;
-	padding-bottom: 5px;
-	border-bottom: solid 1px white;
-}
+
+
+
+
 
 .coolLookingBox {
 	background-color: #f5f5f5;
@@ -320,23 +314,6 @@ footer {
 	margin: auto;
 }
 
-.divider{	/*		Thanks Milan! https://codepen.io/Oddgson		*/
-	
-	position: relative;
-	margin-top: 10px;
-	height: 1px;
-}
-
-.div-transparent:before{
-	content: "";
-	position: absolute;
-	top: 0;
-	left: 5%;
-	right: 5%;
-	width: 90%;
-	height: 2px;
-	background-image: linear-gradient(to right, transparent, #008cff65, transparent);
-}
 
 @media screen and (max-width: 1200px) {
 	nav .blank {
@@ -366,24 +343,10 @@ footer {
 	nav .blank {
 	  display: none;
 	}
-
-	#content {
-		padding-top: 0;
-	}
-	#content #banner {
-		justify-content: center;
-
-	}
-	#content #banner #bannerTxt {
-		margin: 10px;
-	}
-	#content .container .contactBox {
-		flex-direction: column;
-	}
 }
 
 @media screen and (max-width: 320px) {
 	nav .links {
 		flex-direction: column;
 	}
-}
+}

assets/js/main.js

@@ -1,4 +1,4 @@
-
+//Writen by Bedirhan Teymur @ LM Control
 function init_map(){
 	let map = L.map('map', {scrollWheelZoom: false}).setView([-36.8762668, 174.7325985], 16);
 

assets/logo.svg

@@ -0,0 +1,411 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:ooo="http://xml.openoffice.org/svg/export"
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   inkscape:version="1.0 (4035a4fb49, 2020-05-01)"
+   sodipodi:docname="LMC Logo SVG22.svg"
+   id="svg138"
+   xml:space="preserve"
+   stroke-linejoin="round"
+   stroke-width="28.222"
+   fill-rule="evenodd"
+   preserveAspectRatio="xMidYMid"
+   viewBox="0 0 25000 7000"
+   height="70mm"
+   width="250mm"
+   version="1.2"><metadata
+   id="metadata142"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><sodipodi:namedview
+   inkscape:current-layer="container-id1"
+   inkscape:window-maximized="1"
+   inkscape:window-y="-8"
+   inkscape:window-x="1912"
+   inkscape:cy="109.01461"
+   inkscape:cx="515.23903"
+   inkscape:zoom="1.203325"
+   showgrid="false"
+   id="namedview140"
+   inkscape:window-height="1017"
+   inkscape:window-width="1920"
+   inkscape:pageshadow="2"
+   inkscape:pageopacity="0"
+   guidetolerance="10"
+   gridtolerance="10"
+   objecttolerance="10"
+   borderopacity="1"
+   bordercolor="#666666"
+   pagecolor="#990000" />
+ <defs
+   id="defs8"
+   class="ClipPathGroup">
+  <clipPath
+   clipPathUnits="userSpaceOnUse"
+   id="presentation_clip_path">
+   <rect
+   id="rect2"
+   height="7000"
+   width="25000"
+   y="0"
+   x="0" />
+  </clipPath>
+  <clipPath
+   clipPathUnits="userSpaceOnUse"
+   id="presentation_clip_path_shrink">
+   <rect
+   id="rect5"
+   height="6986"
+   width="24950"
+   y="7"
+   x="25" />
+  </clipPath>
+ 
+      
+      
+      
+      
+      
+      
+      
+      
+      
+      
+      
+     
+       
+      
+        
+        
+       
+       
+      
+        
+        
+       
+     
+    </defs>
+ <defs
+   id="defs12"
+   class="TextShapeIndex">
+  <g
+   id="g10"
+   ooo:id-list="id3 id4 id5 id6 id7 id8 id9 id10 id11 id12 id13"
+   ooo:slide="id1" />
+ </defs>
+ <defs
+   id="defs44"
+   class="EmbeddedBulletChars">
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-57356">
+   <path
+   id="path14"
+   d="M 580,1141 L 1163,571 580,0 -4,571 580,1141 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-57354">
+   <path
+   id="path17"
+   d="M 8,1128 L 1137,1128 1137,0 8,0 8,1128 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-10146">
+   <path
+   id="path20"
+   d="M 174,0 L 602,739 174,1481 1456,739 174,0 Z M 1358,739 L 309,1346 659,739 1358,739 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-10132">
+   <path
+   id="path23"
+   d="M 2015,739 L 1276,0 717,0 1260,543 174,543 174,936 1260,936 717,1481 1274,1481 2015,739 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-10007">
+   <path
+   id="path26"
+   d="M 0,-2 C -7,14 -16,27 -25,37 L 356,567 C 262,823 215,952 215,954 215,979 228,992 255,992 264,992 276,990 289,987 310,991 331,999 354,1012 L 381,999 492,748 772,1049 836,1024 860,1049 C 881,1039 901,1025 922,1006 886,937 835,863 770,784 769,783 710,716 594,584 L 774,223 C 774,196 753,168 711,139 L 727,119 C 717,90 699,76 672,76 641,76 570,178 457,381 L 164,-76 C 142,-110 111,-127 72,-127 30,-127 9,-110 8,-76 1,-67 -2,-52 -2,-32 -2,-23 -1,-13 0,-2 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-10004">
+   <path
+   id="path29"
+   d="M 285,-33 C 182,-33 111,30 74,156 52,228 41,333 41,471 41,549 55,616 82,672 116,743 169,778 240,778 293,778 328,747 346,684 L 369,508 C 377,444 397,411 428,410 L 1163,1116 C 1174,1127 1196,1133 1229,1133 1271,1133 1292,1118 1292,1087 L 1292,965 C 1292,929 1282,901 1262,881 L 442,47 C 390,-6 338,-33 285,-33 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-9679">
+   <path
+   id="path32"
+   d="M 813,0 C 632,0 489,54 383,161 276,268 223,411 223,592 223,773 276,916 383,1023 489,1130 632,1184 813,1184 992,1184 1136,1130 1245,1023 1353,916 1407,772 1407,592 1407,412 1353,268 1245,161 1136,54 992,0 813,0 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-8226">
+   <path
+   id="path35"
+   d="M 346,457 C 273,457 209,483 155,535 101,586 74,649 74,723 74,796 101,859 155,911 209,963 273,989 346,989 419,989 480,963 531,910 582,859 608,796 608,723 608,648 583,586 532,535 482,483 420,457 346,457 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-8211">
+   <path
+   id="path38"
+   d="M -4,459 L 1135,459 1135,606 -4,606 -4,459 Z" />
+  </g>
+  <g
+   transform="scale(0.00048828125,-0.00048828125)"
+   id="bullet-char-template-61548">
+   <path
+   id="path41"
+   d="M 173,740 C 173,903 231,1043 346,1159 462,1274 601,1332 765,1332 928,1332 1067,1274 1183,1159 1299,1043 1357,903 1357,740 1357,577 1299,437 1183,322 1067,206 928,148 765,148 601,148 462,206 346,322 231,437 173,577 173,740 Z" />
+  </g>
+ </defs>
+ <defs
+   id="defs46"
+   class="TextEmbeddedBitmaps" />
+ <g
+   id="g51">
+  <g
+   class="Master_Slide"
+   id="id2">
+   <g
+   class="Background"
+   id="bg-id2" />
+   <g
+   class="BackgroundObjects"
+   id="bo-id2" />
+  </g>
+ </g>
+ <g
+   transform="translate(-153.91381,329.81531)"
+   id="g136"
+   class="SlideGroup">
+  <g
+   id="g134">
+   <g
+   id="container-id1">
+    <g
+   id="g58"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id3">
+        <rect
+   id="rect53"
+   height="3189"
+   width="2260"
+   y="2027"
+   x="12693"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path55"
+   d="M 14798,4928 V 2049 h 150 c 1,19 3,38 3,57 0,976 0,1953 0,2929 0,30 4,63 -6,90 -11,32 -30,76 -56,86 -30,11 -76,-4 -108,-20 -24,-12 -41,-43 -57,-68 -615,-925 -1229,-1851 -1842,-2776 -9,-13 -18,-24 -35,-47 v 2895 h -154 v -55 c 0,-989 0,-1978 0,-2967 0,-9 0,-18 0,-27 0,-46 4,-91 54,-110 54,-21 98,-1 135,37 18,19 34,41 48,63 610,919 1220,1840 1831,2759 8,13 18,25 27,37 3,-1 7,-2 10,-4 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g65"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id4">
+        <rect
+   id="rect60"
+   height="3156"
+   width="2042"
+   y="2044"
+   x="8012"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path62"
+   d="m 10046,5041 v 154 c -18,2 -33,3 -49,3 -441,0 -882,1 -1323,0 -146,0 -286,-30 -407,-116 -146,-103 -213,-253 -242,-423 -9,-52 -12,-106 -12,-159 -1,-608 -3,-1217 1,-1825 2,-321 225,-569 541,-614 65,-9 131,-15 196,-15 418,-1 836,-1 1254,-1 14,0 28,2 47,3 v 158 h -64 c -404,0 -807,0 -1211,0 -114,1 -227,5 -335,47 -166,65 -263,196 -266,370 -9,617 -8,1235 -9,1852 0,67 10,135 24,200 54,239 237,357 488,362 433,8 867,3 1301,4 21,0 42,0 66,0 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g72"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id5">
+        <rect
+   id="rect67"
+   height="3153"
+   width="2199"
+   y="2052"
+   x="10224"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path69"
+   d="m 12266,4458 c -1,140 -29,276 -118,389 -110,140 -265,191 -432,196 -259,7 -517,10 -774,-1 -272,-11 -475,-140 -538,-405 -17,-76 -24,-155 -25,-232 -2,-511 -2,-1022 0,-1533 1,-109 9,-219 50,-323 73,-186 214,-286 404,-321 57,-11 117,-15 175,-15 242,0 484,-5 726,5 187,7 351,74 451,247 59,104 80,220 81,338 2,279 0,558 0,838 0,273 2,545 0,817 z m 149,-828 c 0,-314 4,-627 -1,-939 -3,-135 -46,-262 -127,-372 -133,-184 -327,-253 -541,-260 -276,-10 -552,-7 -827,-1 -132,2 -260,37 -375,104 -224,131 -312,342 -314,586 -7,588 -10,1178 0,1766 6,412 248,640 641,677 186,18 376,13 564,12 139,-1 279,0 415,-22 343,-56 542,-266 562,-608 18,-313 3,-629 3,-943 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g79"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id6">
+        <rect
+   id="rect74"
+   height="3153"
+   width="2198"
+   y="2052"
+   x="20131"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path76"
+   d="m 22173,4458 c -1,140 -28,276 -118,389 -109,140 -264,191 -431,196 -258,7 -516,10 -774,-1 -272,-11 -474,-140 -538,-405 -18,-76 -25,-155 -25,-232 -2,-511 -2,-1022 0,-1533 0,-109 9,-219 51,-323 72,-186 213,-286 404,-321 57,-11 116,-15 175,-15 242,0 484,-5 725,5 187,7 351,74 450,247 60,104 81,220 81,338 2,279 1,558 1,838 0,273 2,545 -1,817 z m 150,-828 c 0,-314 4,-627 -2,-939 -2,-135 -45,-262 -126,-372 -133,-184 -328,-253 -541,-260 -275,-10 -551,-7 -826,-1 -132,2 -260,37 -376,104 -224,131 -312,342 -315,586 -6,588 -9,1178 0,1766 7,412 250,640 642,677 187,18 376,13 565,12 138,-1 278,0 413,-22 344,-56 543,-266 562,-608 18,-313 4,-629 4,-943 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g86"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id7">
+        <rect
+   id="rect81"
+   height="3225"
+   width="2279"
+   y="2017"
+   x="17622"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path83"
+   d="m 19175,2018 c 70,14 140,24 208,41 280,70 464,279 478,569 12,234 12,469 -1,702 -16,290 -223,502 -520,519 -334,20 -667,14 -1000,19 -26,1 -52,1 -82,12 543,451 1088,901 1642,1360 -87,0 -161,2 -235,-2 -18,0 -37,-16 -52,-29 -240,-200 -480,-400 -720,-600 -268,-224 -536,-447 -804,-671 -15,-12 -30,-24 -44,-37 -41,-36 -50,-83 -33,-132 15,-45 58,-51 99,-52 151,-2 302,-3 453,-5 207,-2 414,-2 620,-6 107,-2 210,-22 307,-70 142,-71 207,-196 214,-345 9,-214 8,-430 1,-645 -8,-225 -172,-399 -402,-438 -81,-14 -163,-22 -244,-22 -406,-2 -812,-1 -1219,-1 h -60 v 3051 h -159 V 2018 Z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g93"
+   class="com.sun.star.drawing.PolyPolygonShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id8">
+        <rect
+   id="rect88"
+   height="3221"
+   width="2066"
+   y="2017"
+   x="15235"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path90"
+   d="m 17300,2018 v 165 h -954 v 3054 h -160 V 2185 h -951 v -167 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><g
+   id="g100"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id9">
+        <rect
+   id="rect95"
+   height="3232"
+   width="1960"
+   y="1994"
+   x="22641"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path97"
+   d="m 22641,1995 h 164 v 62 c 0,795 0,1590 1,2385 0,120 11,238 66,348 69,139 184,219 332,248 89,18 182,25 273,26 355,3 711,1 1066,1 h 57 v 159 c -14,0 -29,0 -45,0 -383,0 -765,1 -1148,0 -145,-1 -286,-20 -420,-83 -180,-85 -278,-234 -316,-424 -16,-78 -21,-159 -30,-239 z"
+   stroke="none"
+   fill="#309d66" />
+       </g>
+      </g><rect
+   id="rect102"
+   height="4766"
+   width="7032"
+   y="956.14783"
+   x="573.95074"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" /><path
+   d="m 1855.9703,956.16286 c -703.9072,0 -1281.00708,576.94354 -1281.00708,1279.97344 v 2203.9998 c 0,703.9072 577.09988,1281.0071 1281.00708,1281.0071 h 1583.986 L 3559.2772,5439.145 H 1855.9703 c -550.0929,0 -999.00878,-448.9161 -999.00878,-999.0089 V 2236.1363 c 0,-548.9699 448.91588,-997.9752 999.00878,-997.9752 h 3480.9762 l 119.3207,-281.99824 z m 4707.0511,22.73763 -115.5486,267.06381 c 492.51,60.7933 875.5023,482.4849 875.5023,990.172 v 2203.9998 c 0,550.2428 -447.934,999.0089 -998.0271,999.0089 H 4633.0101 l -122.0081,281.9982 h 1813.946 c 703.9073,0 1279.9737,-577.2499 1279.9737,-1281.0071 V 2236.1363 c 0,-621.6663 -450.7428,-1144.6102 -1041.9003,-1257.23581 z"
+   style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-variant-east-asian:normal;font-feature-settings:normal;font-variation-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;shape-margin:0;inline-size:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:281.993;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;stop-color:#000000;stop-opacity:1"
+   id="path3495" /><rect
+   id="rect109"
+   height="6176"
+   width="3742"
+   y="-238.85225"
+   x="3348.9507"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" /><g
+   id="g121"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id12">
+        <rect
+   id="rect116"
+   height="3107"
+   width="1904"
+   y="2037"
+   x="1337"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path118"
+   d="m 1337,2037 h 401 v 54 c 0,733 -1,1468 1,2201 0,66 6,134 19,198 28,136 124,223 262,241 69,9 139,15 209,15 320,2 640,1 961,1 h 50 v 393 c -13,1 -25,2 -37,2 -382,0 -762,1 -1143,-1 -126,0 -250,-18 -368,-68 -188,-81 -289,-231 -326,-428 -15,-79 -20,-159 -29,-239 z"
+   stroke="none"
+   fill="#ffffff" />
+       </g>
+      </g><g
+   id="g128"
+   class="com.sun.star.drawing.ClosedBezierShape"
+   transform="translate(87.950752,-263.85224)">
+       <g
+   id="id13">
+        <rect
+   id="rect123"
+   height="3175"
+   width="3112"
+   y="2003"
+   x="3654"
+   fill="none"
+   stroke="none"
+   class="BoundingBox" />
+        <path
+   id="path125"
+   d="M 6765,5142 H 6384 V 2647 c -3,0 -6,-1 -10,-1 -53,139 -107,278 -161,417 -235,611 -470,1222 -706,1832 -31,78 -66,153 -128,213 -103,100 -278,91 -354,-29 -58,-94 -101,-198 -142,-301 -263,-664 -523,-1331 -783,-1996 -18,-45 -36,-91 -63,-135 v 2494 h -383 v -50 c 0,-901 0,-1804 0,-2705 0,-87 7,-174 60,-248 71,-101 174,-132 291,-131 159,1 252,90 306,229 175,456 348,913 523,1369 118,312 236,622 354,933 5,12 11,24 21,46 41,-105 78,-201 115,-297 256,-671 512,-1341 770,-2010 23,-59 53,-118 92,-166 86,-105 237,-134 379,-83 117,42 192,155 199,299 1,15 0,31 0,46 1,905 1,1810 1,2714 z"
+   stroke="none"
+   fill="#ffffff" />
+       </g>
+      </g>
+   </g>
+  </g>
+ </g>
+</svg>

index.html

@@ -6,11 +6,13 @@
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<meta property="og:description" content="LM Control | Switchboards & Control Panels"/>
+	<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> 
+	<link href="https://fonts.googleapis.com/css2?family=Rubik:wght@500&display=swap" rel="stylesheet">
+	<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@600&display=swap" rel="stylesheet">
+	<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/>
 	<link href="assets/css/main.css" rel="stylesheet">
 
-	<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"
-   integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
-   crossorigin=""/>
+	<script src="https://unpkg.com/feather-icons"></script>
 
 </head>
 
@@ -21,187 +23,65 @@
 		}
 	</script>
 
-	<nav>
-		<div class="logo"></div>
-		<div class="links">
-			<a href="#">Home</a> 
-			<a href="#wwd">Services</a> 
-			<a href="#au">About us</a> 
-			<a href="#cu">Contact us</a> 
-		</div>
-		<div class="blank"></div>
-	</nav>
-
-	<section id="content">
-		<div id="banner">
-			<span id="bannerTxt">LM Control will design and build the best solution for your control panel and switchboard needs, and provide you with excellent service every step of the way.</span>
-			<div id="quickInfo">
-				<span>Street address:</span>
-				<p>
-   					31 Taylors Road<br>
-   					Morningside<br>
-					Auckland 1025
-				</p>
-				<p>
-					<a href="tel:098496374" class="coolLookingBox landline">09 849 6374</a>
-					<a href="tel:021849634" class="coolLookingBox mobile">021 849 634</a>
-					<a href="mailto:info@lmc.co.nz" class="coolLookingBox email">info@lmc.co.nz</a>
-				</p>
-			</div>
-		</div>
-		
-		<div class="container" id="wwd">
-			<h1>What we do</h1>
-			(Click to expand)
-			<div class="row">
-				<div class="service">
-					<div class="image pc">
-						<div class="discription">
-							<h2>Process Control</h2>
-							<span>Extensive experience in PLC, motor control and automation design and manufacturing means we know the importance of designing and building PLC panels that have efficient layouts.  This allows for future changes and additions.</span>
-							<h2>Process control services</h2>
-							<span>We build PLC, motor control and automation control panels for:</span>
-							<ul>
-								<li>Pumping equipment</li>
-								<li>Process machinery</li>
-								<li>Pneumatic equipment</li>
-								<li>Large integrated systems</li>
-								<li>Manufacturing and packaging control systems</li>
-								<li>Motor starting</li>
-								<li>Food industry machinery</li>
-								<li>Motor control centres</li>
-							</ul>
-
-							<span><a class="contactLink" href="mailto:info@lmc.co.nz">Contact us</a> to find out how we can meet your process control needs!</span>
-						</div>
-					</div>
-					<h1>Process Control</h1>
-				</div>
-
-				<div class="service">
-					<div class="image pd">
-						<div class="discription">
-							<h2>Power Distribution Systems & Switchboards</h2>
-							<span>You are assured of quality power distribution systems / switchboards that are well made, fully tested and work correctly.</span>
-							<span>This level of care and attention applies to all of our power distribution switchboard work, which specialises in low voltage switchboards that are used in the following:</span>
-							<ul>
-								<li>Power distribution systems</li>
-								<li>Lighting control</li>
-								<li>Electricity retailer metering</li>
-								<li>Power factor correction</li>
-								<li>Heating and air conditioning control systems.</li>
-							</ul>
-							<span><a class="contactLink" href="mailto:info@lmc.co.nz">Contact us</a> to find out how we can meet your switchboards & distribution system needs!</span>
-						</div>
-					</div>
-					<h1>Power distribution</h1>
+	<main id="wrapper">
+		<section id="banner">
+			<nav>
+				<img class="logo" src="assets/logo.svg"></img>
+				<div class="links">
+					<a href="#">Home</a> 
+					<a href="#">Services</a> 
+					<a href="#">Gallery</a> 
+					<a href="#">About Us</a> 
+					<a href="#">Contact Us</a> 
 				</div>
-
-				<div class="service">
-					<div class="image hvac">
-						<div class="discription">
-							<h2>HVAC control panels</h2>
-							<span>We are experts in designing and manufacturing HVAC control panels for dedicated building services control systems that are used in the following applications:</span>
-							<ul>
-								<li>Large commercial and industrial buildings</li>
-								<li>Factories</li>
-								<li>Warehouses</li>
-								<li>High-rise apartments</li>
-								<li>Offices</li>
-								<li>Retail outlets</li>
-							</ul>
-
-							<h2>HVAC control panels for building services control systems</h2>
-							<span>LM Control designs and manufactures HVAC control panels for building services control systems, such as:</span>
-							<ul>
-								<li>Heating</li>
-								<li>Ventilation</li>
-								<li>Air conditioning</li>
-								<li>Lighting</li>
-								<li>Security</li>
-							</ul>
-							<span><a class="contactLink" href="mailto:info@lmc.co.nz">Contact us</a> to find out how we can meet your HVAC needs!</span>
-						</div>
-					</div>
-					<h1>HVAC</h1>
-				</div>
-
-				<div class="service">
-					<div class="image pcs">
-						<div class="discription">
-							<h2>Pump control systems</h2>
-							<span>We are experienced designers and manufacturers of pump control systems ranging from single small pumps, to large pump stations.</span>
-							<span>We also supply custom fabricated cabinets and outdoor control pillars.</span>
-							<h2>Pump control system applications</h2>
-							<span>Our pump controls are used in the following applications:</span>
-							<ul>
-								<li>Pump stations</li>
-								<li>Fire pumps</li>
-								<li>Sump pumps</li>
-								<li>Header tank pumps</li>
-								<li>Level control pumps</li>
-								<li>Stormwater and sewerage pumps.</li>
-							</ul>
-							<span><a class="contactLink" href="mailto:info@lmc.co.nz">Contact us</a> to find out how we can meet your pump control system needs!</span>
-						</div>
-					</div>
-					<h1>Pump control systems</h1>
+			</nav>
+			<div class="banner-container">
+				<div class="header">From Design To Manufacture</div>
+				<div class="title">Innovative & Reliable Electrical Solutions</div>
+				<div class="buttons">
+					<button class="button highlight">Discover</button>
+					<button class="button">Request a quote</button>
 				</div>
+				
 			</div>
-		</div>
-
-		<div class="divider div-transparent"></div>
+		</section>
 
-		<div class="container" id="au">
-			<h1>About us</h1>
-			<p>If you are looking for a highly experienced power distribution system and switchboard designer and manufacturer, then you have come to the right place.</p>
-			<p>LM Control’s founder Don McLean established the company in 1993, building panels ranging from small distribution to large main switchboards, power factor correction units, power retailer metering and control panels.</p>
-			<p>Over the years&nbsp;the team’s&nbsp;focus has widened to also include motor control, HVAC control and PLC / automation panels (e.g. fire pump panels, panels for pneumatic systems and machine automation).</p>
-			<p>We have been commissioned to do work in a wide range of sectors, with jobs including:</p>
-			<ul style="text-align: start;">
-				<li>Control systems for airports all around the world</li>
-				<li>HVAC controls: for many buildings at Auckland University, Eden Park’s South Stand upgrade, UNITEC building upgrades</li>
-				<li>Building a large number of PLC and field panels for DB Berweries’ Otahuhu brewery</li>
-				<li>Refurbishing motor starter units for Bluescope Steels’ Glenbrook steelmill</li>
-				<li>Building 50VDC distribution components for Telecom exchanges</li>
-				<li>Motor starter control panels for fire pump sprinkler systems.</li>
-			</ul>
-			<p>We are a power distribution system / switchboard / control panel manufacturer in Auckland who works with clients in Auckland, New Zealand and internationally.</p>
-			<p>The LM Controls team is committed to providing customers with a personal service. Click <a href="mailto:info@lmc.co.nz">here</a> to contact us for a no-obligations quote.</p>
-		</div>
-
-		<div class="divider div-transparent"></div>
-
-		<div class="container" id="cu">
-			<h1>Where are we?</h1>
-			<div id="map"></div>
-			<div class="contactBox">
-				<div class="infoContainer">
+		<section class="container" id="sec1">
+			<div class="info-cards">
+				<div class="card boarder">
+					<i class="icon" data-feather="cpu"></i>
+					<h1 class="title">Experience</h1>
 					<p>
-						<a href="tel:098496374" class="coolLookingBox landline">09 849 6374</a>
-						<a href="tel:021849634" class="coolLookingBox mobile">021 849 634</a>
-						<a href="mailto:info@lmc.co.nz" class="coolLookingBox email">info@lmc.co.nz</a>
+						You can't beat experience, from conveyor lines, OEM machinery, and electric motors, we have designed and built custom control panels for nearly every industrial application. This depth of experience enables us to provide the optimal solution for your specific application and provide design recommendations for improved functionality, reliability and value.
 					</p>
 				</div>
-				<div class="infoContainer">
-					<span>Postal address:</span>
+				<div class="card boarder">
+					<i class="icon" data-feather="layers"></i>
+					<h1 class="title">Quality</h1>
 					<p>
-						PO Box 10 011<br>
-						Dominion Road<br>
-						Auckland 1446
+						We are committed to providing high-quality products and services that meet or exceed our clients’ requirements and regulatory standards. From concept to completion, we follow established procedures designed to ensure every project detail is accounted for, including multi-point control panel build inspections, and thorough testing to verify quality and functionality.
+					</p>
+				</div>
+				<div class="card">
+					<i class="icon" data-feather="tool"></i>
+					<h1 class="title">Support</h1>
+					<p>
+						We provide numerous remote and on-site services to our customers, including software upgrades, troubleshooting, hardware replacement, and feature additions.
 					</p>
 				</div>
-
 			</div>
-		</div>
-		
-		<div class="container" id="gal">
-			<h1></h1>
-		</div>
+		</section>
+
+		<section class="container" id="sec2">
+			<div style="height: 100px;"></div>
+		</section>
+
+	</main>
 
-	</section>
-	
-	<footer></footer>
+
+    <script>
+		feather.replace()
+	</script>
 
 	<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"
 			integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="