commit 91bf9e3183c73463b4e0feec504e4e227b1f3a58
Author: Dm1tr1y147 <me@dmitry.icu>
Date: Sat Oct 6 19:50:45 2018 +0500
Initial commit
diff --git a/arrow.svg b/arrow.svg
new file mode 100644
index 0000000..79c6a24
--- /dev/null
+++ b/arrow.svg
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 612.004 612.004" style="enable-background:new 0 0 612.004 612.004;" xml:space="preserve" width="32px" height="32px">
+ <g>
+ <g>
+ <path d="M499.147,160.094L330.222,329.019c-6.472,6.472-15.075,10.035-24.223,10.035c-9.146,0-17.749-3.561-24.218-10.035 L112.854,160.094c-25.822-25.817-67.674-25.817-93.491,0c-25.817,25.819-25.817,67.674,0,93.491L188.29,422.508 c31.443,31.445,73.245,48.764,117.712,48.764s86.269-17.319,117.714-48.761l168.925-168.925c25.817-25.817,25.817-67.674,0-93.491 C566.822,134.277,524.962,134.277,499.147,160.094z" fill="#415a6b" />
+ </g>
+ </g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+</svg>
diff --git a/circle.svg b/circle.svg
new file mode 100644
index 0000000..5320c63
--- /dev/null
+++ b/circle.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 453.689 453.689" style="enable-background:new 0 0 453.689 453.689;" xml:space="preserve">
+ <g>
+ <g>
+ <path d="M231.245,16.365c-9.744,0-19.646,0.582-29.551,1.737c-4.649,0.592-9.272,1.285-13.729,2.049 c-2.869,0.442-5.512,1.29-7.894,2.511c-93.32,12.423-164.763,82.37-178.08,174.695C-14.323,310.471,71.365,417.058,193,434.952 c10.694,1.574,21.703,2.372,32.717,2.372c0.005,0,0,0,0.01,0c111.657,0,208.656-75.921,225.617-176.597 c9.78-58.016-11.34-121.679-57.93-174.67C353.899,41.115,296.299,16.365,231.245,16.365z M244.331,68.285 c43.407,3.062,81.091,21.048,112.071,53.506c36.444,38.182,52.704,91.861,42.432,140.084 c-13.065,61.383-77.612,123.521-175.675,123.521c-11.382,0-22.589-0.99-33.299-2.96c-90.146-16.539-151.098-99.701-135.874-185.4 c13.062-73.488,77.733-124.812,157.285-124.812c5.367,0,10.821,0.241,16.204,0.718C234.099,73.525,239.776,71.847,244.331,68.285z " fill="#415a6b" />
+ </g>
+ </g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+</svg>
diff --git a/house.ico b/house.ico
new file mode 100644
index 0000000..d2c6493
Binary files /dev/null and b/house.ico differ
diff --git a/house.svg b/house.svg
new file mode 100644
index 0000000..554c02b
--- /dev/null
+++ b/house.svg
@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve" width="512px" height="512px">
+ <rect x="382.933" y="73.6" style="fill:#F05540;" width="58.667" height="102.4" />
+ <rect x="360.533" y="21.333" style="fill:#F3705A;" width="103.467" height="55.467" />
+ <path style="fill:#FFD15C;" d="M44.8,276.267V512h418.133V276.267c-82.133-82.133-128-128-209.067-209.067l0,0 C172.8,149.333,126.933,195.2,44.8,276.267z" />
+ <path style="fill:#F7B64C;" d="M464,276.267c-82.133-82.133-128-128-209.067-209.067c-41.6,40.533-73.6,72.533-105.6,104.533 s-64,64-104.533,104.533v48c82.133-82.133,128-128,209.067-209.067c82.133,82.133,128,128,209.067,209.067v6.4l0,0v-54.4H464z" />
+ <path style="fill:#415A6B;" d="M216.533,512H90.667V388.267c0-35.2,28.8-62.933,62.933-62.933l0,0c35.2,0,62.933,28.8,62.933,62.933 V512z" />
+ <rect x="253.867" y="325.333" style="fill:#344A5E;" width="164.267" height="144" />
+ <g>
+ <rect x="270.933" y="342.4" style="fill:#8AD7F8;" width="56.533" height="109.867" />
+ <rect x="344.533" y="342.4" style="fill:#8AD7F8;" width="56.533" height="109.867" />
+ </g>
+ <path style="fill:#F3705A;" d="M502.4,232.533L279.467,9.6c-12.8-12.8-35.2-12.8-48,0L9.6,232.533c-12.8,12.8-12.8,35.2,0,48 c12.8,12.8,35.2,12.8,48,0L256,82.133l198.4,198.4c12.8,12.8,35.2,12.8,48,0C515.2,266.667,515.2,245.333,502.4,232.533z" />
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+ <g></g>
+</svg>
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..58a883d
--- /dev/null
+++ b/index.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Not free houses, be ready to buy!</title>
+ <link href="https://fonts.googleapis.com/css?family=Concert+One|Lato" rel="stylesheet">
+ <link rel="stylesheet" href="main.css">
+ <link href="house.ico" rel="icon" type="image/x-icon" />
+</head>
+<body>
+ <nav>
+ <ul>
+ <li id="logo"><button><img src="house.svg"></button></li>
+ <li><a href="#intro" class="link">Intro</a></li>
+ <li><a href="#articles" class="link">Articles</a></li>
+ <li><a href="#pricing" class="link">Pricing</a></li>
+ <li><a href="#contacts" class="link">Contacts</a></li>
+ </ul>
+ </nav>
+ <header id="intro">
+ <div><h1>Hello, do you wanna have your own flat?</h1>
+ <h2>We know, you do. You're lucky, because here we can sell you the house of your dreams</h2></div>
+ <a href="#articles" class="link"><img src="arrow.svg" alt="scroll down to see more"></a>
+ </header>
+ <main id="articles">
+ <article>
+ <h1>Are you ready?</h1>
+ <p>Hello. Nice to see you here. Most likely, you live with your parents or rent a small flat in underbelly. It's time to change it. Have you ever dreamed to have your own large, spacious apartment in the center of your city? We can help you to realize your dream. Just look at our catalog and find your best place for living. We have the best price-quality ratio for every budget. After you chose, just call one of our operators and we will we will start processing of all documents.</p>
+ </article>
+ <article>
+ <h1>New Year — New Discounts</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+ tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+ quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+ consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+ cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+ proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </article>
+ <article>
+ <h1>We have been opened</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+ tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+ quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+ consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+ cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+ proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </article>
+ <article id="pricing">
+ <ul>
+ <li>
+ <img src="triangle.svg" />
+ <h2>Lite</h2>
+ <h3>$30000</h3>
+ <ul>
+ <li>Little flat</li>
+ <li>Necessary amenities</li>
+ </ul>
+ </li>
+ <li>
+ <img src="square.svg" />
+ <h2>Medium</h2>
+ <h3>$500000</h3>
+ <ul>
+ <li>Nice houce</li>
+ <li>Garage</li>
+ <li>Little garden</li>
+ </ul>
+ </li>
+ <li>
+ <img src="circle.svg" />
+ <h2>Prime</h2>
+ <h3>$1000000</h3>
+ <ul>
+ <li>Big cottage</li>
+ <li>Two grounds</li>
+ <li>Jacuzzi</li>
+ <li>Two garages</li>
+ </ul>
+ </li>
+ </ul>
+ </article>
+ </main>
+ <footer id="contacts">
+ <address><a href="https://www.google.ru/maps/place/Wyandotte,+MI+48192/@42.203647,-83.1901824,13z/data=!3m1!4b1!4m8!1m2!2m1!1s82+Oak+Meadow+Lane+Wyandotte,+MI+48192!3m4!1s0x883b30ca764d1d3d:0x2e0d7dd45fc6683b!8m2!3d42.204837!4d-83.15954">82 Oak Meadow Lane Wyandotte, MI 48192</a></address>
+ <a href="tel:14686058205">+1 (468) 605-8205</a>
+ <a href="mailto:meder@sbcglobal.net">meder@sbcglobal.net</a>
+ </footer>
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+ <script type="text/javascript" src="main.js"></script>
+<!-- <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script> -->
+</body>
+</html>
\ No newline at end of file
diff --git a/main.css b/main.css
new file mode 100644
index 0000000..d6d8431
--- /dev/null
+++ b/main.css
@@ -0,0 +1,225 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ color: #415a6b;
+ font-family: 'Lato', sans-serif;
+ font-size: 3vmin;
+ transition: all .5s ease;
+}
+*::-webkit-scrollbar {
+ display: none;
+}
+nav ul {
+ display: flex;
+ align-items: center;
+ padding: 0 4vh;
+ position: fixed;
+ top: 2vh;
+ left: 2vh;
+ height: 8vh;
+ background-color: #8ad7f8;
+ z-index: 1000;
+ border-radius: 200em;
+ max-width: calc(100vw - 4vh);
+}
+li {
+ list-style-type: none;
+}
+nav li {
+ padding: 2vh;
+}
+a {
+ text-decoration: none;
+}
+button {
+ background-color: transparent;
+ border: none;
+}
+#logo img {
+ height: 6vh;
+}
+header {
+ background-color: #8ad7f8;
+ height: 100vh;
+ padding-top: 10vh;
+ display: flex;
+ align-items: center;
+ background-size: auto 80vh;
+ background-position: right 7.5vh bottom;
+ background-repeat: no-repeat;
+ background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiPgo8cmVjdCB4PSIzODIuOTMzIiB5PSI3My42IiBzdHlsZT0iZmlsbDojRjA1NTQwOyIgd2lkdGg9IjU4LjY2NyIgaGVpZ2h0PSIxMDIuNCIvPgo8cmVjdCB4PSIzNjAuNTMzIiB5PSIyMS4zMzMiIHN0eWxlPSJmaWxsOiNGMzcwNUE7IiB3aWR0aD0iMTAzLjQ2NyIgaGVpZ2h0PSI1NS40NjciLz4KPHBhdGggc3R5bGU9ImZpbGw6I0ZGRDE1QzsiIGQ9Ik00NC44LDI3Ni4yNjdWNTEyaDQxOC4xMzNWMjc2LjI2N2MtODIuMTMzLTgyLjEzMy0xMjgtMTI4LTIwOS4wNjctMjA5LjA2N2wwLDAgIEMxNzIuOCwxNDkuMzMzLDEyNi45MzMsMTk1LjIsNDQuOCwyNzYuMjY3eiIvPgo8cGF0aCBzdHlsZT0iZmlsbDojRjdCNjRDOyIgZD0iTTQ2NCwyNzYuMjY3Yy04Mi4xMzMtODIuMTMzLTEyOC0xMjgtMjA5LjA2Ny0yMDkuMDY3Yy00MS42LDQwLjUzMy03My42LDcyLjUzMy0xMDUuNiwxMDQuNTMzICBzLTY0LDY0LTEwNC41MzMsMTA0LjUzM3Y0OGM4Mi4xMzMtODIuMTMzLDEyOC0xMjgsMjA5LjA2Ny0yMDkuMDY3YzgyLjEzMyw4Mi4xMzMsMTI4LDEyOCwyMDkuMDY3LDIwOS4wNjd2Ni40bDAsMHYtNTQuNEg0NjR6Ii8+CjxwYXRoIHN0eWxlPSJmaWxsOiM0MTVBNkI7IiBkPSJNMjE2LjUzMyw1MTJIOTAuNjY3VjM4OC4yNjdjMC0zNS4yLDI4LjgtNjIuOTMzLDYyLjkzMy02Mi45MzNsMCwwYzM1LjIsMCw2Mi45MzMsMjguOCw2Mi45MzMsNjIuOTMzICBWNTEyeiIvPgo8cmVjdCB4PSIyNTMuODY3IiB5PSIzMjUuMzMzIiBzdHlsZT0iZmlsbDojMzQ0QTVFOyIgd2lkdGg9IjE2NC4yNjciIGhlaWdodD0iMTQ0Ii8+CjxnPgoJPHJlY3QgeD0iMjcwLjkzMyIgeT0iMzQyLjQiIHN0eWxlPSJmaWxsOiM4QUQ3Rjg7IiB3aWR0aD0iNTYuNTMzIiBoZWlnaHQ9IjEwOS44NjciLz4KCTxyZWN0IHg9IjM0NC41MzMiIHk9IjM0Mi40IiBzdHlsZT0iZmlsbDojOEFEN0Y4OyIgd2lkdGg9IjU2LjUzMyIgaGVpZ2h0PSIxMDkuODY3Ii8+CjwvZz4KPHBhdGggc3R5bGU9ImZpbGw6I0YzNzA1QTsiIGQ9Ik01MDIuNCwyMzIuNTMzTDI3OS40NjcsOS42Yy0xMi44LTEyLjgtMzUuMi0xMi44LTQ4LDBMOS42LDIzMi41MzNjLTEyLjgsMTIuOC0xMi44LDM1LjIsMCw0OCAgYzEyLjgsMTIuOCwzNS4yLDEyLjgsNDgsMEwyNTYsODIuMTMzbDE5OC40LDE5OC40YzEyLjgsMTIuOCwzNS4yLDEyLjgsNDgsMEM1MTUuMiwyNjYuNjY3LDUxNS4yLDI0NS4zMzMsNTAyLjQsMjMyLjUzM3oiLz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==)
+}
+header div {
+ width: 75vw;
+ padding: calc(13vw - 10vh) 18vw 13vw 6vw;
+}
+h1,h2 {
+ font-family: 'Concert One', cursive;
+}
+header h1 {
+ font-size: 10vmin;
+}
+header h2 {
+ font-size: 6vmin;
+ max-width: 40vw;
+}
+header img {
+ position: absolute;
+ top: 87.5vh;
+ left: 46.25vw;
+ height: 7.5vh;
+ width: 7.5vw;
+}
+
+main {
+ background-color: #ffd15c;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ grid-gap: 10vh;
+ padding: 10vh;
+ min-height: 100vh;
+ align-items: end;
+}
+article h1 {
+ font-size: 8vmin;
+ margin-bottom: 5vh;
+}
+
+#pricing {
+ grid-column: 1 / span 3;
+ margin-top: -10vh;
+ padding-top: 10vh;
+ min-height: 90vh;
+}
+#pricing > ul {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ grid-gap: 10vh;
+}
+#pricing > ul > li {
+ border-radius: 5vh;
+ background-color: #f7b64c;
+ min-height: 75vh;
+ display: grid;
+ justify-content: center;
+ align-content: center;
+ max-width: 50vw;
+}
+#pricing h2, #pricing img, #pricing h3 {
+ text-align: center;
+ padding: 1vh;
+}
+#pricing h2 {
+ font-size: 8vmin;
+}
+#pricing img {
+ height: 10vh;
+ margin: 0 auto;
+}
+#pricing h3 {
+ font-size: 5vmin;
+}
+#pricing ul ul {
+ margin: 1vh;
+}
+#pricing ul ul li {
+ list-style-type: circle;
+ list-style-position: inside;
+}
+
+footer {
+ background-color: #f3705a;
+ padding: 10vh;
+ display: grid;
+ grid-gap: 1vh;
+ grid-template-columns: auto auto auto;
+}
+footer * {
+ color: #344a5e;
+}
+@media screen and (max-device-aspect-ratio: 8/5) {
+ header img {
+ left: 6vw;
+ width: auto;
+ }
+ footer {
+ grid-template-columns: 1fr;
+ }
+ #pricing > ul {
+ grid-template-columns: 1fr;
+ justify-items: center;
+ }
+ #pricing > ul > li {
+ width: 50vw;
+ }
+}
+@media screen and (max-device-aspect-ratio: 4/3) {
+ header div {
+ width: 100vw;
+ padding-left: 5vh;
+ padding-right: 5vh;
+ }
+ header h2 {
+ max-width: 100%;
+ }
+ header img {
+ left: 13vw;
+ }
+ main {
+ grid-template-columns: 1fr;
+ }
+ #pricing {
+ grid-column: 1 / span 1;
+ }
+}
+@media screen and (orientation: portrait) {
+ header img {
+ left: auto;
+ right: 13vw;
+ }
+ #pricing > ul > li {
+ width: calc(100vw - 10vh);
+ max-width: calc(100vw - 10vh);
+ }
+ nav ul {
+ width: calc(100vw - 4vh);
+ justify-content: space-between;
+ }
+ main {
+ padding: 5vh;
+ }
+ footer * {
+ text-align: center;
+ }
+}
+@media screen and (max-device-aspect-ratio: 2/3) {
+ * {
+ font-size: 3vmax;
+ }
+ nav ul {
+ flex-direction: column;
+ }
+ .opened ul {
+ height: auto;
+ border-radius: 5vh;
+ }
+ nav li {
+ padding: 3.5vh;
+ }
+ #logo {
+ padding: 1vh;
+ height: 8vh !important;
+ }
+ nav .link {
+ display: block;
+ height: 0;
+ overflow: hidden;
+ }
+ .opened .link {
+ height: auto;
+ }
+ nav a {
+ font-size: 3vmax;
+ }
+}
\ No newline at end of file
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..25626ac
--- /dev/null
+++ b/main.js
@@ -0,0 +1,15 @@
+$(function() {
+ $('#logo').click(function() {
+ $('nav').toggleClass('opened')
+ });
+ $(".link").click(function (event) {
+ event.preventDefault();
+ var id = $(this).attr('href'),
+ top = $(id).offset().top,
+ time = Math.abs(window.pageYOffset - top) * 2;
+ if(window.innerHeight > window.innerWidth){
+ time = 1500;
+ }
+ $('body,html').animate({scrollTop: top}, time);
+ });
+});
\ No newline at end of file
diff --git a/square.svg b/square.svg
new file mode 100644
index 0000000..d829132
--- /dev/null
+++ b/square.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 414.951 414.951" style="enable-background:new 0 0 414.951 414.951;" xml:space="preserve">
+<g>
+ <g>
+ <path d="M409.275,40.212l-0.015-3.093c-0.016-1.727-0.219-3.433-0.609-5.18c-1.387-11.913-10.71-20.913-22.628-21.617 c-10.115-0.597-63.378-1.158-130.818-1.866C164.814,7.499,41.021,6.194,27.091,4.526c-4.331-0.531-8.097,0.051-11.669,1.559 C4.992,9.31-1.101,18.711,0.166,29.901C2.74,52.587,4.342,356.907,3.037,383.013c-0.261,5.099,0.973,9.877,3.567,13.894 c4.004,7.216,11.298,11.766,19.712,12.223c25.766,1.401,348.164,1.483,361.875,1.488h0.005c6.129,0,11.725-2.144,15.985-6.073 c8.146-5.505,12.177-15,10.323-24.74C412.312,368.008,410.255,234.711,409.275,40.212z M49.737,54.12 c29.879,0.724,99.939,1.333,190.549,2.062c50.606,0.409,99.025,0.795,121.282,1.148c0.076,9.666,0.173,24.128,0.289,41.469 c0.899,134.201,1.742,228.112,2.92,263.78l-7.713-0.01c-168.45-0.173-270.928-0.422-305.689-0.736 C51.524,307.555,50.928,111.085,49.737,54.12z" fill="#415a6b"/>
+ </g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/triangle.svg b/triangle.svg
new file mode 100644
index 0000000..d86cf45
--- /dev/null
+++ b/triangle.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 415.155 415.154" style="enable-background:new 0 0 415.155 415.154;" xml:space="preserve">
+<g>
+ <g>
+ <path d="M414.505,357.34c-30.336-118.434-94.689-225.955-169.777-321.316c-4.22-5.36-9.369-6.889-14.208-6.025 c-2.575-0.37-5.149-0.599-7.76-0.604c-5.859-0.005-11.1,2.927-14.444,7.343c-0.785,0.576-1.572,1.145-2.326,1.886 C119.701,124.187,42.602,223.84,1.117,339.141c-1.346,3.747-1.384,7.089-0.602,10.019c0.109,6.87,0.632,13.66,1.902,20.47 c1.597,8.576,10.786,13.786,19.058,13.243c0.376,0.021,0.704,0.111,1.092,0.111c109.187,0,218.297,5.81,327.454,0.625 c7.322-0.351,20.245,1.493,32.661,1.447c16.696-0.062,32.474-3.524,32.474-20.271c0-0.482-0.111-0.944-0.147-1.411 C415.129,361.474,415.053,359.493,414.505,357.34z M37.044,346.666C75.563,241.055,146.995,149.501,225.706,70.452 c63.749,82.471,118.327,175.07,147.871,275.422C261.496,353.217,149.247,347.347,37.044,346.666z" fill="#415a6b"/>
+ </g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>