body {background-color: #fff;color: #888;font-family: 'Maven Pro';font-size: 14px;margin: 0;}
ul, ol {padding-left: 0px;margin: 0;list-style: none;}
h1 {color: #fff;font-size: 28px;font-weight: lighter;line-height: 40px;margin-top: 0;margin-bottom: 40px;text-align: center;}
h3 {color: #222;}
p {font-size: 16px;line-height: 24px;}
hr {border: none;border-bottom: 1px solid #ddd;margin: 40px 0;}
a {text-decoration: none;transition: color 0.2s;}
.clear {clear: both;}
.inner {width: 1000px;margin: 0 auto;max-width: 100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.inner.over {margin-top: -180px;}
#header {background-image: url(../images/background.jpg);background-repeat: no-repeat;background-position: center -60px;background-size: cover;padding: 60px 30px 100px 30px;box-shadow: 0 -40px 80px #fff inset;}
#header h1 {color: #444;margin-top: 40px;margin-bottom: 80px;}
#header nav {float: right;}
#main-menu li {display: inline-block;margin-left: 30px;}
#main-menu a {color: #bbb;font-size: 16px;text-decoration: none;}
#main-menu a:hover {color: #666;}
#logo {background-image: url(../images/logo.svg);background-repeat: no-repeat;background-position: center;display: block;width: 140px;height: 42px;}
.button {background-color: #f56b7e;border-radius: 3px;color: #fff !important;font-size: 16px;text-decoration: none;display: inline-block;padding: 12px 0 12px 16px;}
.button span {background-color: rgba(0, 0, 0, 0.08);border-radius: 0 3px 3px 0;font-weight: bold;margin-left: 24px;padding: 12px 16px 12px 8px;position: relative;transition: padding 0.2s;}
.button:hover span {padding: 12px 24px 12px 16px;}
.button span::before {width: 14px;height: 42px;content: '';background-image: url(../images/button-divider.png);background-repeat: no-repeat;position: absolute;left: -14px;top: 0;}
#map-section {width: 800px;max-width: 100%;}
.window-mockup {background-color: #f0f0f0; background-image: url(../images/window.png);background-repeat: no-repeat;background-position: 14px center;border-radius: 10px 10px 0 0;height: 42px;overflow: hidden;}
.window-mockup.brown {background-color: #2f2e2b;}
.window-bar {background-color: #f8f8f8; border-radius: 3px; margin: 10px 14px 10px 80px;height: 22px;}
.editor-window {display: none;margin: 0 auto;width: 460px;}
.editor-window .window-mockup {cursor: pointer;}
.editor-body {background: #272822;color: #cfcfc2;padding: 14px;font-size: 12px;}
.map-container {margin: 0 auto;margin-bottom: 60px;}
.map-container > #mapplic {background-color: #ffffff !important;}
#examples {font-size: 0;padding: 0;margin: 0 80px;display: block;text-align: center;}
#examples li {display: inline-block;margin-bottom: 6px;}
#examples a {border-radius: 3px;border: 2px solid #fff;color: #bbb;font-size: 16px;display: block;padding: 10px;margin: 0 10px;transition: border-color 0.2s, color 0.2s;}
#examples a:hover {color: #666;border: 2px solid #eee;}
#examples .active a {border: 2px solid #ddd;color: #666;}
#wordpress {color: #fff;display: block;font-size: 28px;text-align: center;}
#wordpress strong {margin-left: 20px;}
#wordpress img {vertical-align: middle;}
#contact {background-image: url(../images/mail.png);background-repeat: no-repeat;background-position: center;display: block;width: 48px;height: 48px;margin: 0 auto 30px auto;}
#footer {background-color: #2f2e2b;padding-bottom: 35px; padding-top: 47px;text-align: center;}
#footer span a {border-bottom: 1px solid transparent;color: #aaa;font-size: 13px;font-weight: bold;transition: color 0.2s, border-color 0.2s;}
#footer span a:hover {border-color: #666;color: #eee;}
.icon {background-repeat: no-repeat;background-position: center 10px;padding-top: 60px;}
.icon.landmark { background-image: url(../images/icon-landmark.png); }
.icon.layer { background-image: url(../images/icon-layer.png); }
.icon.link { background-image: url(../images/icon-link.png); }
.icon.browser { background-image: url(../images/icon-browser.png); }
.icon.responsive { background-image: url(../images/icon-responsive.png); }
.icon.mobile { background-image: url(../images/icon-mobile.png); }
.container {margin: 20px 0;}
.container:after {clear: both;content: '';display: block;height: 0;visibility: hidden;font-size: 0;}
.one-third {float: left;padding-left: 2%;padding-right: 2%;width: 29%;}
.features {text-align: center;}
section {padding: 60px 0;}
section .inner {padding-left: 20px;padding-right: 20px;}
section.purple {background-color: #b7a6bd;color: #fff;padding: 60px 0;}
section.blue {background-color: #7DD5C9;color: #fff;padding: 20px 0;}
@media all and (max-width: 667px) {#header {display: none;}
.inner.over {margin-top: 0;padding-top: 0;}
.window-mockup {display: none;}
}
