/* Fonts */
@font-face {
	font-family: 'MuseoSlab500';
	src: url('fonts/museo_slab_500-webfont.eot');
	src: local('☺'), url('fonts/museo_slab_500-webfont.woff') format('woff'), url('fonts/museo_slab_500-webfont.ttf') format('truetype'), url('fonts/museo_slab_500-webfont.svg#webfontpr9WrytB') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {
    background-color: #333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* HTML5 fixes */
header, section, footer,
aside, nav, article, figure {
	display: block;
}

/* Basics */
a { color: #3462A4; }
p { font-size: 1em; line-height: 1.4em; margin: 0.4em 0; }
h1, h2, h3, h4 { font-family: 'MuseoSlab500', Georgia, sans-serif; color: #333; text-shadow: 1px 1px 1px #fff; }
h1 { font-size: 1.631em; text-shadow: 1px 1px 1px rgba(0,0,0,.15); margin-bottom: 20px; }
h2 { color: #333; font-size: 1.451em; }
h3 { font-size: 1.231em; }
h4 { font-size: 1.16em; margin: 5px 0; }
h6 { font-size: .85em; color: #fff; text-transform: uppercase; font-weight: bold; letter-spacing: 0.08em; text-shadow: -1px -1px -1px rgba(0,0,0,.25); }

.right { float: right; }
.left { float: left; }
.hidden { display: none; }
.clear { clear: both; }

hr { margin: 20px 0; border: 1px solid #ccc; border-bottom: 1px solid #fff; }

/* Grid */
.col_4 { width: 300px; float: left; margin-right: 20px; }
.col_5 { width: 350px; float: left; margin-right: 20px; }
.col_6 { width: 400px; float: left; margin-right: 20px; }
.col_7 { width: 500px; float: left; }
.col_8 { width: 600px; float: left; margin-right: 20px; }
.col_9 { width: 750px; float: left; margin-right: 20px; }
.last { margin-right: 0; }

/* Header */
.header_wrapper { padding: 8px 0 12px 0;
    background-color: #333;
    background: -moz-linear-gradient(100% 100% 90deg, #1a1a1a, #333);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333), to(#1a1a1a));
    border-bottom: 1px solid rgba(255,255,255,.5);
}

header { width: 950px; margin: 0 auto; }

h1.logo { float: left; width: 256px; height: 60px; background: url("../images/logo6.png") no-repeat; margin: 10px 0; }
header h6 { float: right; color: #666; margin-top: 58px; vertical-align: top; }

/* Content */
.content_wrapper { background-color: #eee; }
section.content { width: 910px; padding: 20px; margin: 0 auto; }

/* Main Navigation */
nav {
    width: 950px;
    margin: 0 auto;
    background-color: #87c80a;
    text-align: center;
    -webkit-border-bottom-left-radius: 10px 10px;
    -webkit-border-bottom-right-radius: 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
    -moz-box-shadow: 0px 1px 3px #aaa;
    -webkit-box-shadow: 0px 1px 3px #aaa;
    box-shadow: 0px 1px 3px #aaa;
}

nav ul { margin: 0; padding: 10px 0; }
nav li { display: inline-block; padding: 0 12px; border-right: 1px solid #eee; }

nav li.last { border-right: none; }

nav a {
    padding: 5px 20px;
    letter-spacing: 0.09em;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    font-size: .93em;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0,.25);
    cursor: pointer;
}

nav a.current, nav a:hover { background-color: rgba(0,0,0,.25); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; }

/* Index */
section.index { margin: 10px auto; width: 950px; }
.index h1 { margin-top: 100px; }
.screen { margin-top: 5px; }

.big_button {
    display: inline-block;
    width: auto;
    padding: 4px 20px 6px 20px;
    vertical-align: middle; 
    background-color: #009ada;
    background: -moz-linear-gradient(100% 100% 90deg, #00577b, #00b4ff);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00b4ff), to(#00577b));
    border: 1px solid #009ada;
    font-size: 1.8em;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
    -webkit-box-shadow: rgba(255, 255, 255, 0.148438) 0px 1px 0px, rgba(255, 255, 255, 0.148438) 0px 1px 0px inset;
    -moz-box-shadow: rgba(255, 255, 255, 0.148438) 0px 1px 0px, rgba(255, 255, 255, 0.148438) 0px 1px 0px inset;
    box-shadow: rgba(255, 255, 255, 0.148438) 0px 1px 0px, rgba(255, 255, 255, 0.148438) 0px 1px 0px inset;
    cursor: pointer;
}

.big_button:hover {
    background-color: #00b4ff;
    background: -moz-linear-gradient(100% 100% 90deg, #00b4ff, #00577b);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00577b), to(#00b4ff));
}

#quotes {
    margin: 0 auto;
    width: 650px;
    height: 100px;
    color: #333;
    text-align: center;
    font-size: 1.5em;
    font-family: 'MuseoSlab500', Georgia, sans-serif;
}

#quotes p { width: 650px; height: 100px; }

/* Product */
.mock_explaination {
    width: 640px;
    margin-top: 10px;
    padding: 6px 20px;
    background: rgb(255, 250, 157);
    border: 1px solid #ccc;
}

.mock {
    width: 680px;
    height: 267px;
    margin: 20px 0 30px 0;
    background: #fff url(../images/mock.png) no-repeat 0 5px;
    border: 1px solid #ccc;
    -moz-box-shadow: 0px 1px 3px #aaa;
    -webkit-box-shadow: 0px 1px 3px #aaa;
    box-shadow: 0px 1px 3px #aaa;
}

.mock_button {
    display: inline-block;
    background-image: url(../images/mock_button.png);
    width: 234px;
    height: 54px;
    margin: 170px 0 0 388px;
    cursor: pointer;
}

.product h2 { margin-bottom: 20px; }

.product li { clear: both; }

.product div {
    width: 240px;
    height: 130px;
    float: left;
    margin-right: 20px;
    border: 3px solid #ccc;
    margin-bottom: 30px;
}

.product div.scan {
    background: #ddd url(../images/product_img_1.png) no-repeat center 10px;
}

.product div.shop {
    background: #ddd url(../images/product_img_2.png) no-repeat center -10px;
}

.product div.compare {
    background: #ddd url(../images/product_img_3.png) no-repeat center 0px;
}

.product div.fit {
    background: #ddd url(../images/product_img_4.png) no-repeat center 2px;
}

.product h3 {
    color: #87c80a;
    margin: 10px 0 0 0;
}

.product p { padding-right: 150px; }

/* Problem */
.problem { margin: 20px 0; }
.problem li { display: inline-block; vertical-align: middle; }

.problem img {
    border: 3px solid #87c80a;
    -moz-box-shadow: 0px 1px 3px #87c80a;
    -webkit-box-shadow: 0px 1px 3px #87c80a;
    box-shadow: 0px 1px 3px #87c80a;
}

.problem .shoe p { display: block; text-align: center; font-size: .85em; color: #555; margin: 2px 0 0 0; line-height: 1.2em; }

.problem .shoe p.size {
    color: #333;
    font-size: 1.231em;
    font-family: "MuseoSlab500", Georgia, serif;
}

.problem .eq { margin: -45px 15px 0; font-size: 1.361em; color: #87c80a; }
.facts { margin: 30px 0 20px 0; width: 800px; }

.facts li { font-size: 1em; line-height: 1.4em; padding: 10px 0; border-top: 1px solid #fff; border-bottom: 1px solid #ccc; }

.facts img {
    float: left;
    margin-right: 10px;
}

.facts li.first {
    border-top: none;
}

.facts li.last {
    border-bottom: none;
}

/* About */
img.investor {
    border: 3px solid #ccc;
    margin-right: 10px;
    float: left;
}

.press li {
    clear: both;
    font-size: .93em;
    margin: 5px 0 10px 0;
}

.press a {
    display: block;
    font-size: 1.08em;
}

.press img {
    float: left;
    display: inline-block;
    width: 70px;
    margin: 0 5px 15px 0;
    border: 3px solid #ccc;
}

/* Contact */
form {
    margin: 20px 0;
}

form li {
    margin: 5px 0;
}

form label {
    text-align: right;
    margin-right: 10px;
    width: 70px;
    display: inline-block;
    vertical-align: top;
    padding: 6px 0;
    color: #555;
    font-size: 1.08em;
}

form input.text, form textarea {
    border: 1px solid #666;
    padding: 4px;
    font-size: 1.16em;
    width: 300px;
}

form textarea {
    height: 150px;
}

form input.button {
    padding: 6px 8px;
    text-transform: uppercase;
    background-color: #87c80a;
    color: #fff;
    border: none;
    font-size: .93em;
    text-shadow: 1px 1px 1px rgba(0,0,0,.25);
    letter-spacing: 0.09em;
    font-family: Helvetica, Arial, sans-serif;
    -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
    cursor: pointer;
}

.contact {
    border-right: 1px solid #ccc;
    padding-right: 20px;
}

.guys {
    margin-top: 40px;
}

/* Footer */
footer {
    width: 950px;
    margin: 0 auto;
    padding-top: 20px;
    text-shadow: -1px -1px -1px rgba(0,0,0,.25);
}

footer li {
    display: inline;
    margin-left: 5px;
}

footer a {
    color: #666;
    font-size: .85em;
}

footer a:hover {
    color: #eee;
}

.partners {
    margin: 10px 0;
}

.partners li 
{
	display: block; float: left;
	padding-top: 10px;
    margin: 0 10px 0 0;
}

footer .right {
    text-align: right;
}

footer .credit {
    color: #666;
    font-size: .85em;
}

footer .credit a:hover {
    color: #fff;
}

.info_header { text-align: center; background-color: #D8EE97; padding: 10px; border: solid 1px #BBB; }
.extra_large_text { font-size: 22px; line-height: 24px; }