/**
*   Main Style Sheet Document
*   All rights reserved by Zeek L.L.C.
*   http://zeek.ai
**/

/* clearing floating bug errors */
.wrap:after,.promos:after,#packages:after,#testimonials ul:after,#testimonials ol:after,.team:after,#contactForm li:after,#demoForm li:after {content: '';clear: both;display: block;float: none;height: 0;width: 0;}

.box {
	background: #e8f0f4;
	margin: 160px auto;
	max-width: 960px;
	padding: 40px;
}

/* THEME STRUCTURE */
#nav {background: #30383b;height: 80px;}

#nav .wrap {
	margin: 0 auto;
	max-width: 1480px;
	padding: 0 40px;
	position: relative;
}

#logo {
	color: #e9eef1;
	display: block;
	float: left;
	height: 26px;
	margin-top: 28px;
	width: 64px;
}

#logo svg {fill: rgba(255,255,255,1);}

#menu {
	font-size: 14px;
	float: right;
	list-style: none;
	margin-top: 20px;
    width: auto;
	text-transform: uppercase;
}

#menu li {
	display: inline-block;
	margin-left: 20px;
	text-align: center;
}

#menu a {
	border: rgba(255,255,255,.15) 2px solid;
	border-radius: 20px;
	color: rgba(255,255,255,.35);
	display: block;
	height: 40px;
	line-height: 36px;
    padding: 0 20px;
	transition: all .25s ease;
	width: auto;
}

#menu a:focus,#menu a:hover {border-color: rgba(255,255,255,.5);color: rgba(255,255,255,1);}

#menu a:active {border-color: rgba(255,255,255,.15);color: rgba(255,255,255,.35);}

#menu-button {
	display: none;
	height: 24px;
	margin: 0;
	position: absolute;
	right: 40px;
	width: 32px;
	top: 29px;
}

#menu-button span {
	border: rgba(255,255,255,.25) 2px solid;
	border-radius: 4px;
	display: block;
	height: 6px;
	margin-bottom: 2px;
}

#header {
	background-color: #83cef5;
	background-image: linear-gradient(rgba(160,131,245,.85), #83cef5);
	padding: 120px 40px 80px;
	position: relative;
	text-align: center;
}

#header:before {
	background: transparent url(../images/banner-graph.png) center bottom no-repeat;
	content: '';
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 0;
}

#header .wrap {
	margin: 0 auto;
	max-width: 1080px;
	position: relative;
	z-index: 1;
}

#header h1 {
	color: #ffffff;
	font-family: Mandali;
	font-size: 64px;
	font-weight: normal;
	line-height: 80px;
	margin-top: 0;
	position: relative;
}

#header h1:after {
	background: rgba(255,255,255,.5);
	bottom: -16px;
	content: '';
	display: block;
	height: 1px;
	left: 50%;
	margin-left: -80px;
	position: absolute;
	width: 160px;
	z-index: 9;
}

#header h2 {
	color: #ffffff;
	font-weight: 300;
	font-size: 40px;
	line-height: 48px;
	margin-bottom: 100px;
}

.btn-cta {
	background: #f26d44;
	border-radius: 32px;
	box-shadow: 0px 0px 0px 2px rgba(255,255,255,.35);
	color: #ffffff;
	display: block;
	font-size: 20px;
	height: 64px;
	line-height: 64px;
	margin: 0 auto;
	width: 360px;
	text-transform: uppercase;
}

.btn-discover {
	color: #ffffff;
	display: inline-block;
	margin-top: 36px;
	position: relative;
	text-transform: uppercase;
}

.btn-discover:after {
	background: rgba(255,255,255,.5);
	bottom: 1px;
	content: '';
	display: block;
	height: 1px;
	left: 50%;
	margin-left: -66px;
	position: absolute;
	width: 132px;
}

/* Promos */
.promo-title {
	margin: 120px auto 80px;
	max-width: 1480px;
	overflow: hidden;
	padding: 0 40px 0 168px;
}

.promo-title img {
	display: block;
	float: left;
	margin-left: -128px;
}

.promo-title h2 {
	color: #b0b7ba;
	font-family: Mandali;
	font-size: 28px;
	font-weight: normal;
	line-height: 36px;
	margin: 4px 0 8px;
}

.promo-title h4 {
	color: #9996f5;
	font-size: 24px;
	font-weight: 300;
	line-height: 32px;
	margin: 0;
}

.promos {
    list-style: none;
    margin: 80px auto 160px;
	padding: 0 20px;
    text-align: center;
	max-width: 1440px;
}

.promos li {
	display: block;
    float: left;
    padding: 0 20px;
	position: relative;
	text-align: center;
    width: 25%;
}

.promos svg {fill: #83cef5;width: 48px;}

.promos h4 {
	font-weight: normal;
	font-size: 24px;
	line-height: 32px;
	margin: 16px 0;
}

.promos p {line-height: 24px;margin: 0;}

/* TESTIMONIALS */
#testimonials {
    background: rgba(232,240,244,.5);
    margin: 160px auto;
    padding: 80px 40px;
    position: relative;
    max-width: 1160px;
}

#testimonials ul {
	list-style: none;
    margin: 0 auto;
    overflow: hidden;
	position: relative;
    max-width: 960px;
}

/*
#testimonials:before,#testimonials:after {
	content: '';
	display: block;
	background: #e8f0f4;
	height: 1px;
	left: 50%;
	margin-left: -60px;
	position: absolute;
	width: 120px;
	z-index: 9;
}

#testimonials:before {top: -64px;}
#testimonials:after {bottom: -64px;}
*/

#testimonials ul li {
	display: block;
    min-height: 120px;
	padding-left: 160px;
	position: relative;
    width: 100%;
}

#testimonials img {
    border-radius: 50%;
	display: block;
	height: 120px;
	left: 0;
	position: absolute;
	top: 0;
	width: 120px;
}

#testimonials blockquote {margin: 0;font-weight: 300;}
#testimonials cite {display: block;margin-top: 16px;}

#testimonials a {color: #b0b7ba;}
#testimonials a:hover {color: #30383b;}

#testimonials cite strong {color: #83cef5;font-weight: normal;}

#testimonials ol {
    list-style: none;
    margin: 40px auto 0;
    width: 72px;
}

#testimonials ol li {
    background: transparent;
    border: #9996f5 2px solid;
    border-radius: 8px;
    display: block;
    float: left;
    height: 16px;
    margin-right: 12px;
    width: 16px;
}
#testimonials ol li:last-child {margin-right: 0;}

#testimonials ol li:hover,#testimonials ol li.active {background: #9996f5;}

/* Discover More */
.discover-more {
	margin: 160px auto;
	max-width: 1480px;
	padding: 0 40px;
}

.discover-more .row {margin-top: 80px;overflow: hidden;}

.discover-more h1 {
	color: #b0b7ba;
	font-family: Mandali;
	font-size: 40px;
	font-weight: normal;
	line-height: 48px;
	margin: 0 0 8px 0;
}

.discover-more h4 {
	color: #9996f5;
	font-size: 24px;
	font-weight: 300;
	line-height: 32px;
	margin: 0;
}

.newsletter {
	background: #e8f0f4;
	float: left;
	padding: 40px;
	width: 33.333%;
}

.newsletter h3 {
	color: #f26d44;
	font-family: Mandali;
	font-size: 28px;
	font-weight: 300;
	line-height: 40px;
	margin-top: 0;
	position: relative;
}

.newsletter h3:after {
	background: rgba(176,183,186,.5);
	content: '';
	display: block;
	height: 1px;
	position: absolute; left: 0; bottom: -20px;
	width: 40px;
}

.newsletter p {line-height: 28px;margin-bottom: 32px;}

.newsletter form {overflow: hidden;}

.newsletter input[type="email"] {
	background-color: #ffffff;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MiA0OCI+PHBhdGggZmlsbD0iI0UyRUJFRiIgZD0iTTIxLjgsMjIuOWw5LjctOS40YzAuMywwLjMsMC40LDAuNiwwLjQsMS4xdjE5YzAsMC40LTAuMiwwLjgtMC40LDFMMjEuOCwyMi45eiBNMC41LDEzLjRjMC4zLTAuMiwwLjYtMC40LDEtMC40aDI5YzAuNCwwLDAuNywwLjIsMSwwLjRMMTYsMjUuNUwwLjUsMTMuNHogTTAuNCwzNC41Yy0wLjItMC4zLTAuNC0wLjYtMC40LTF2LTE5YzAtMC40LDAuMi0wLjgsMC40LTEuMWw5LjcsOS40TDAuNCwzNC41eiBNMTYsMjguNWw0LjEtMy45bDExLjUsMTBjLTAuMywwLjMtMC42LDAuNC0xLDAuNGgtMjljLTAuNCwwLTAuOC0wLjItMS0wLjRsMTEuNS0xMEwxNiwyOC41eiIvPjwvc3ZnPg==");
	background-position: right center;
	background-repeat: no-repeat;
	font-size: 16px;
	height: 48px;
	position: relative;
	width: 100%;
}

.newsletter input[type="submit"] {
	height: 48px;
	font-size: 16px;
	margin-top: 24px;
	line-height: 48px;
	float: right;
	width: 160px;
}

.featured-blog {
	float: left;
	padding: 0 0 0 80px;
	width: 66.666%;
}

.featured-blog h6 {
	background: #e8f0f4;
	color: #b0b7ba;
	display: inline-block;
	margin: 0;
	padding: 0 10px;
}

.featured-blog h2 {
	font-size: 32px;
	font-weight: normal;
	line-height: 40px;
	margin: 16px 0;
}

.meta {list-style: none;margin: 16px 0;}
.meta li {display: inline;}
.meta strong {font-weight: normal;}

.featured-blog p {margin: 24px 0;}

/* ABOUT */
#about {
	background: #30383b;
	border-bottom: rgba(255,255,255,.1) 1px solid;
	padding: 80px 0;
}

#about h2 {
	font-family: Mandali;
	color: #9996f5;
	font-size: 28px;
	font-weight: 300;
	line-height: 40px;
	margin: 40px auto 16px;
	max-width: 1160px;
	text-align: center;
}

#about h3 {
	color: rgba(255,255,255,.35);
	font-size: 20px;
	font-weight: 300;
	line-height: 32px;
	margin: 0 auto 40px;
	max-width: 1160px;
	text-align: center;
}

.team {
	max-width: 1480px;
	margin: 120px auto 40px;
    padding: 0 20px;
	text-align: center;
}

.team img {
	border-radius: 50%;
	display: block;
	height: 160px;
	margin: 0 auto;
	width: 160px;
}

.team div {
	float: left;
	padding: 0 20px;
	width: 33.333%;
}

.team h4 {
	color: rgba(255,255,255,.75);
	font-weight: 300;
	margin: 32px 0 0;
}

.team h5 {
    font-family: "Helvetica Neue", Helvetica, Gotham, Arial, sans-serif;
    margin: 8px 0 0;
    color: rgba(242,109,68,.75);
}

.team p {
	color: rgba(255,255,255,.25);
	line-height: 28px;
	margin: 24px 0 0 0;
	text-align: left;
}

/* Try Demo */
.tryDemo {
    background: #83cef5;
    margin-top: 120px;
    padding: 40px;
}

.tryDemo .wrap {margin: 0 auto;max-width: 960px;}

.tryDemo h2 {
    color: #fff;
    float: left;
    font-size: 28px;
    font-family: Mandali;
    font-weight: normal;
    line-height: 32px;
    margin: 0;
    max-width: 640px;
}

.tryDemo a {
	background: #f26d44;
	border-radius: 32px;
    box-shadow: 0px 0px 0px 2px rgba(255,255,255,.35);
	color: #ffffff;
	display: block;
    float: right;
	font-size: 18px;
	height: 56px;
	line-height: 56px;
	width: 280px;
    text-align: center;
	text-transform: uppercase;
}

.tryDemo a:focus,.tryDemo a:hover {color: #30383b;}

/* FOOTER */
#footer {background: #30383b;height: 160px;}

#footer .wrap {
	margin: 0 auto;
	max-width: 1480px;
	padding: 0 40px;
}

.links {float: right;margin-top: 68px;}

.links ul,.links ol {
	display: inline;
	font-size: 14px;
	list-style: none;
	text-transform: uppercase;
}

.links ol {margin-left: 20px;}

.links li {
	color: rgba(255,255,255,.35);
	display: inline;
	margin-left: 20px;
}
.links li:first-child {margin-left: 0;}

.links ul li {
	display: inline-block;
	height: 20px;
	vertical-align: middle;
}

.links li.highlight a {
	border: rgba(255,255,255,.15) 2px solid;
	border-radius: 16px;
	display: inline-block;
	height: 32px;
	line-height: 28px;
	text-align: center;
	width: 80px;
}

.links a {color: rgba(255,255,255,.35);}
.links a:focus,.links a:hover {color: rgba(242,109,68,.75);}
.links li.highlight a:focus,.links li.highlight a:hover {border-color: rgba(242,109,68,.75);}

.copy {
	color: rgba(255,255,255,.25);
	float: left;
	margin: 68px 0 0 0;
}

.blank-page {
	margin: 80px auto 120px;
	max-width: 1040px;
	padding: 0 40px;
}

/* Contact Form */
.contact h2,.demo h2 {
	color: #f26d44;
	font-family: Mandali;
	font-size: 40px;
	font-weight: normal;
    line-height: 1;
    margin-top: 24px;
	position: relative;
	text-align: center;
}

.contact h2:after,.demo h2:after,.faqs h1:after,.privacy h1:after {
	background: #ccd3d7;
	content: '';
	display: block;
	height: 1px;
	margin-left: -40px;
	position: absolute; left: 50%; bottom: -16px;
	width: 80px;
}

.contact h4,.demo h4 {
	color: #9aa0a3;
	font-weight: 300;
	text-align: center;
}

#contactForm,#demoForm {max-width: 560px;margin: 64px auto;}
#contactForm ul,#demoForm ul {list-style: none;}
#contactForm li,#demoForm li {display: block;margin-bottom: 32px;}
#contactForm textarea,#demoForm textarea {height: 160px;}
#contactForm input[type="submit"],#demoForm input[type="submit"] {
    float: right;
    margin-top: 8px;
    width: 240px;
}

.faqs h1,.privacy h1 {
	font-family: Mandali;
	font-size: 40px;
	font-weight: normal;
	position: relative;
	text-align: center;
}

.faqs h4 {
	color: #9aa0a3;
	font-size: 20px;
	font-weight: 300;
	text-align: center;
}

.faqs dl {margin: 80px auto;}

.faqs dt {
	color: #9996f5;
	font-size: 20px;
	font-family: "Exo 2", "Helvetica Neue", Helvetica, Gotham, Arial, sans-serif;
	line-height: 32px;
	margin-bottom: 24px;
}

.faqs dd {margin-bottom: 48px;}
.faqs dd p {margin-top: 0;}

.privacy-list {margin: 80px auto;}
.privacy-list h2 {font-size: 32px;font-weight: normal;}
.privacy-list h3 {
	color: #9996f5;
	font-size: 24px;
	line-height: 32px;
	font-weight: normal;
	margin: 56px 0 24px;
}

.privacy-list p {margin-top: 24px;}

/* Resonsive Tester */
body:after{
	color: #fff;content: '1600PX +';display: none;font-size: 12px;
	width: auto;line-height: 24px;background: rgba(0,0,0,.85);z-index: 999999;
	text-align: center;position: fixed;top: 100px;right: 0;padding: 4px 10px;
}
@media only screen and (max-width: 1366px) {body:after{content: '1366PX';}}
@media only screen and (max-width: 1280px) {body:after{content: '1280PX';}}
@media only screen and (max-width: 1024px) {body:after{content: '1024PX';}}
@media only screen and (max-width: 940px) {body:after{content: '940PX';}}
@media only screen and (max-width: 720px) {body:after{content: '720PX';}}
@media only screen and (max-width: 640px) {body:after{content: '640PX';}}
@media only screen and (max-width: 480px) {body:after{content: '480PX';}}
@media only screen and (max-width: 380px) {body:after{content: '380px';}}
@media only screen and (max-width: 320px) {body:after{content: 'SMALLEST';}}

@media only screen and (max-width: 1366px) {
    /* vertical rhythm */
    #header {padding: 80px 40px 60px;}
    #header h1 {margin-bottom: 32px;}
    #header h1:after {bottom: -12px;}
    #header h2 {margin: 32px auto 64px;}
    .btn-discover {margin-top: 32px;}

    .promo-title {margin: 80px auto 56px;}
    .promos {margin: 56px auto;}

    #testimonials {margin: 132px 40px;}
    #testimonials:before {top: -40px;}
    #testimonials:after {bottom: -40px;}

    .discover-more {margin: 96px auto 120px;}
    .discover-more .row {margin-top: 56px;}

    #about {padding: 56px 0;}
    #about h2 {margin: 24px auto;}
    #about h2:after {bottom: -40px;}
    .team {margin: 80px auto 24px;}
    .team div {padding: 0 20px;}
    .team h4 {margin: 16px 0 0;}
    .team p {line-height: 24px;margin-top: 16px;}

    #footer {height: 120px;}

    .links,.copy {margin-top: 48px;}

    .box,.blank-page {margin: 96px auto;}

    .faqs dl {margin: 64px auto;}

    .privacy-list {margin: 64px auto;}
    .privacy-list h3 {margin: 48px 0 24px;}
    .privacy-list p {margin-top: 24px;}
}

@media only screen and (max-width: 1280px) {
    .promos,.promos li {padding: 0 16px;}
    .featured-blog {padding: 0 0 0 40px;}
    .team img {height: 120px;width: 120px;}
}

@media only screen and (max-width: 1024px) {
    /* vertical rhythm */
    #nav {height: 64px;}
    #logo {margin-top: 20px;}
    #menu {margin-top: 16px;}
    #menu a {height: 32px;line-height: 28px;}

    #header {padding: 64px 40px 56px;}
    #header h1 {
        font-size: 56px;
        line-height: 64px;
        margin-bottom: 32px;
    }
    #header h1:after {bottom: -12px;}
    #header h2 {
        font-size: 32px;
        line-height: 40px;
        margin: 32px auto 48px;
    }

    .btn-cta {
        font-size: 18px;
        height: 52px;
        line-height: 52px;
        width: 280px;
    }

    .promos {margin: 80px auto 120px;}
    .promos li {
        display: inline-block;
        float: none;
        margin-bottom: 32px;
        padding: 0 20px;
        vertical-align: top;
        width: 48%;
    }

    #testimonials {margin: 104px 24px;}
    #testimonials:before,#testimonials:after {margin-left: -48px;width: 96px;}
    #testimonials:before {top: -24px;}
    #testimonials:after {bottom: -24px;}
    #testimonials ul li {padding-left: 136px;}
    #testimonials img {height: 96px;width: 96px;}
    #testimonials blockquote {font-size: 18px;line-height: 28px;}

    .discover-more {margin: 80px auto 96px;}
    .discover-more .row {margin-top: 48px;}
    .discover-more h1 {font-size: 32px;line-height: 40px;}
    .discover-more h4 {font-size: 20px;line-height: 28px;}

    .newsletter {padding: 20px;}

    .tryDemo h2 {max-width: 560px;}
    .tryDemo a {width: 240px;}

    #about {padding: 56px 20px;}
    #about h2 {
        font-size: 24px;
        line-height: 32px;
        margin: 0 auto 16px;
    }
    #about h3:after {
        bottom: -24px;
        margin-left: - 48px;
        width: 96px;
    }
    #about h3 {
        font-size: 18px;
        line-height: 28px;
        margin: 0 auto;
    }
    .team {margin: 64px auto 0;}
    .team img {height: 96px;width: 96px;}
    .team h4 {font-size: 20px;line-height: 24px;}
    .team h5 {
        font-size: 14px;
        font-weight: normal;
        line-height: 16px;
    }

    #footer {height: 96px;}
    .links,.copy {margin-top: 36px;}
    .box {max-width: 840px;}
}

@media only screen and (max-width: 940px) {    
    .discover-more h1,.discover-more h4 {text-align: center;}

    .box {
        margin: 80px auto;
        padding: 24px 40px;
        max-width: 680px;
    }

    .newsletter {
        float: none;
        padding: 40px;
        margin: 0 auto 48px;
        width: 100%;
        max-width: 440px;
    }

    .featured-blog {
        float: none;
        padding: 0;
        width: 100%;
    }

    .tryDemo h2 {max-width: 480px;}
    .tryDemo a {width: 220px;}

    #about {padding: 80px;}
    .team {padding: 0;}
    .team div {
        float: none;
        margin-bottom: 40px;
        padding: 0;
        width: 100%;
    }
    .team div:last-child {margin-bottom: 0;}
    .team img {height: 160px;width: 160px;}
    #about h2,#about h3 {text-align: left;}

    #footer {height: auto;padding: 40px 0;}
    .links {
        float: none;
        margin-top: 16px;
        text-align: center;
    }
    .links ol{margin-left: 40px;}
    .links li {margin-left: 40px;}

    .copy {
        float: none;
        margin-top: 40px;
        text-align: center;
    }

    .contact-form h2 {font-size: 32px;margin: 24px 16px;}
    .contact-form h2:after,
    .faqs h1:after,
    .privacy h1:after {
        bottom: -8px;
        margin-left: -40px;
        width: 80px;
    }

    .contact-form h4 {font-size: 20px;margin: 24px 16px;}

    .blank-page {margin: 80px auto;}

    .faqs h1,.privacy h1 {
        font-size: 32px;
        line-height: 40px;
        margin: 24px 0;
    }

    .faqs h4 {margin: 24px 0;line-height: 28px;}
    .faqs dl {margin: 40px auto;}
    .faqs dt {margin-bottom: 16px;line-height: 28px;}
    .faqs dd {margin-bottom: 40px;}

    .privacy-list {margin: 40px auto;}
    .privacy-list h3 {margin: 40px 0 16px;line-height: 32px;}
    .privacy-list p {margin-top: 16px;}
}

@media only screen and (max-width: 720px) {
    #nav .wrap {padding: 0 20px;}
    #menu-button {right: 24px;}
    #header {padding: 64px 20px 56px;}

    .box {max-width: 600px;padding: 20px;}

    #testimonials {margin: 80px 20px;padding: 48px 40px;}
    #testimonials ul li {padding-left: 120px;}
    #testimonials ol {margin-top: 16px;}

    .featured-blog h2 {font-size: 28px;line-height: 36px;}

    .tryDemo h2 {
        float: none;
        max-width: 100%;
        text-align: center;
    }
    .tryDemo a {
        float: none;
        margin: 40px auto 0;
        width: 280px;
    }

    #about {padding: 64px;}
    
    #footer .wrap {padding: 0 20px;}
    #footer ul {display: block;margin-bottom: 40px;}
    #footer ol {display: block;margin: 40px 0;}

    .blank-page {padding: 0 20px;}
}

@media only screen and (max-width: 640px) {
    .promo-title {padding: 0 20px 0 128px;}
    .promo-title img {margin-left: -108px;}

    .promos {padding: 0 40px;}
    .promos li {
        margin-bottom: 40px;
        padding: 0 0 0 88px;
        text-align: left;
        width: 100%;
    }
    .promos li:last-child {margin-bottom: 0;}
    .promos svg {position: absolute;left: 2px;top: 24px;}
    .promos h4 {margin: 0 0 16px;}

    #testimonials:before {top: -40px;}
    #testimonials:after {bottom: -40px;}
    #testimonials ul li {
        padding-left: 0;
        position: relative;
        text-align: center;
    }

    #testimonials blockquote {margin: 16px 0;}
    #testimonials img {position: static;margin: 0 auto;}

    .discover-more {padding: 0 20px;}

    .featured-blog h6 {line-height: 20px;}

    #about {padding: 64px 40px;}
    #about h2,#about h3 {padding: 0;}

    .links li {margin-left: 20px;}

    .blank-page {margin: 64px auto;}
}

@media only screen and (max-width: 480px) {
    #menu li {margin-left: 8px;}
    #menu a {padding: 0 12px;}

    #header {padding: 40px 20px;}
    #header h1 {
        font-size: 40px;
        line-height: 52px;
        margin-bottom: 24px;
    }
    #header h1:after {bottom: -6px;}
    #header h2 {
        font-size: 24px;
        line-height: 32px;
        margin: 24px 0 32px;
    }

    .promo-title {padding: 0 20px;text-align: center;}
    .promo-title img {display: inline;float: none;margin: 0;}

    .promos {padding: 0 20px;}
    .promos ul + ul {margin-top: 32px;}
    .promos li {margin-bottom: 32px;padding: 0 0 0 68px;}

    #testimonials {padding: 40px 20px;margin: 80px 16px;}

    .tryDemo {padding: 40px 20px;}

    #about {padding: 48px 20px;}
    .team img {height: 120px;width: 120px;}
    
    .links ol:after,.links ul:after {
        content: '';
        clear: both;
        display: block;
        float: none;
        height: 0;
        width: 0;
    }
    #footer ul {margin: 0;}
    #footer ol {margin: 0 0 -40px 0;}

    .links ul li,
    .links ol li {
        display: block;
        float: left;
        height: 32px;
        line-height: 32px;
        margin: 0 0 40px 0;
        width: 50%;
    }
}

@media only screen and (max-width: 380px) {
    #nav .wrap {padding: 0 16px;}
    #menu {font-size: 13px;}
    #menu a {padding: 0 10px;}

    .promos {padding: 0 20px;}
    .promos li {padding: 0;text-align: center;}
    .promos svg {position: static;}

    #testimonials {margin: 48px 0;padding: 48px 20px;}

    .discover-more {padding: 0;}
    .discover-more h1,.discover-more h4 {padding: 0 20px;}

    .newsletter {padding: 20px 20px;}
    .featured-blog {padding: 0 20px;}

    .tryDemo a {width: 240px;}
}

@media only screen and (max-width: 320px) {
    .btn-cta {width: auto;}

    #testimonials {padding: 40px 16px;}
    .testimonials cite strong {display: block;}
    
    #about {padding: 48px 16px;}
    .team img {height: 104px;width: 104px;}
    
    .links ol li,.links ul li {float: none;width: auto;}
    #footer ol {margin: 0;}
}