/**
*
*/
html, body, body div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ""; content: none; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 2em 0; padding: 0; }
html.oldie hr { margin: 1em 0; }
/**
* Font normalization inspired by YUI Library's fonts.css: developer.yahoo.com/yui/
*/
body { font:13px/1.231 sans-serif; *font-size:small; } /* Hack retained to preserve specificity */
/* Normalize monospace sizing:
en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, sans-serif; }
/**
* Minimal base styles.
*/
/* 1) Always force a scrollbar in non-IE
2) Remove iOS text size adjust without disabling user zoom: www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
html { overflow-y: scroll; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
/* j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #FF5E99; }
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }
/* Remove margins for navigation lists */
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
small { font-size: 85%; }
b, strong, th { font-weight: bold; }
td { vertical-align: top; }
/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
pre {
/* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
white-space: pre; white-space: pre-wrap; word-wrap: break-word;
padding: 15px;
}
.ie6 legend, .ie7 legend { margin-left: -7px; }
/* 1) Make inputs and buttons play nice in IE: www.viget.com/inspire/styling-the-button-element-in-internet-explorer/
2) WebKit browsers add a 2px margin outside the chrome of form elements.
Firefox adds a 1px margin above and below textareas
3) Set font-size to match 's, and font-family to sans-serif
4) Align to baseline */
button, input, select, textarea { width: auto; overflow: visible; margin: 0; font-size: 100%; font-family: sans-serif; vertical-align: baseline; }
/* 1) Remove default scrollbar in IE: www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/
2) Align to text-top */
textarea { overflow: auto; vertical-align:text-top; }
/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
/* Remove extra padding and inner border in Firefox */
input::-moz-focus-inner,
button::-moz-focus-inner { border: 0; padding: 0; }
/* Colors for form validity */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
/* Bicubic resizing for non-native sized IMG:
code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }
/*-----------------------*
* Primary Styles *
* Author: Gabe Hayes *
*-----------------------*/
/*-----------------------*
* Z-Indexing:
* 100: Base containers
* 200: Container items
*-----------------------*/
header, #main, footer {
z-index: 101;
}
#info-wrap #devices {
z-index: 201; /* Devices on Homepage */
}
#info-wrap #devices .pager {
z-index: 202; /* Devices pager */
}
#features nav li.active,
#features nav li.selected {
z-index: 203; /* Selected nav items */
}
#login {
z-index: 204;
margin-right: 25px;
margin-top: 25px;
}
/*---------------*
* Global
*---------------*/
body, select, input, textarea, header, footer {
color: #222;
line-height: 20px;
background-color: #525252;
font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif;
}
a, a:hover, a:active, a:visited {
color: #0097ff;
text-decoration: underline;
}
h1 {
line-height: 48px;
}
hr {
border-color: #ececec;
}
h1, h2, h3, h4 {
font-weight: bold;
margin-bottom: 15px;
}
h1 {
font-size: 48px;
}
h1.smaller {
margin-bottom: 5px;
font-size: 36px !important;
line-height: 40px !important;
}
h1.larger {
margin-bottom: 5px;
font-size: 78px !important;
line-height: 82px !important;
}
h2
{
margin-top : 8px;
margin-left: 60px;
font-size: 30px;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 18px;
}
h5 {
margin-left: 60px;
margin-bottom: 20px;
}
::-moz-selection {
background: #fe57a1;
color:#fff;
text-shadow: none;
}
::selection {
background:#fe57a1;
color:#fff;
text-shadow: none;
}
dt {
font-weight: bold;
font-size: 16px;
margin: 0 0 5px;
}
dd {
font-size: 14px;
margin: 0 0 20px;
}
.center {
text-align: center;
}
.large {
font-size: 24px;
}
.small {
font-size: 11px;
}
/*---------------*
* Colors
*---------------*/
.primary {
color: #feac06;
}
.primary.background {
color: #fcfacf;
background-color: #feac06;
}
.textshadow h1.primary {
text-shadow: #a6670e -1px 1px 1px;
}
.secondary {
color: #231f20;
}
.secondary.background {
color: #ffffff;
background-color: #231f20;
}
.blue {
color: #1A98f0;
}
.blue.background {
color: #ffffff;
background-color: #1A98f0;
}
.gray {
background-color: #f3f3f3;
}
.light.gray {
background-color: #fdfdfd;
}
/*---------------*
* Layouts
*---------------*/
.container {
width: 960px;
margin: 0 auto;
padding: 0 20px;
}
html, body {
width: 100%;
height: 100%;
}
.padded.container {
padding-top: 20px;
padding-bottom: 20px;
}
/* !Titlebar */
.titlebar {
font-size: 14px;
background: #fe9d05 url(bg-orange-noise.png) repeat-x 0 100%;
}
.container .top image
{
float: left;
}
body {
background-color: #ffffff;
}
.testimonial li
{
font-size: 16px;
}
#mobile_apps
{
margin-left: 100px;
font-size: 16px;
}
#logo
{
float: left;
margin-right: 30px;
}
#logo h2
{
color: #ffffff;
margin: 0 auto;
float: right;
}
#ordering
{
width: 500px;
margin-top: 30px;
}
#Personal
{
float:right;
margin-top: 20px;
}
#Corporate
{
margin-top: 20px;
}
#content_description li
{
list-style:disc;
}
#content_description li p
{
font-size: 14px;
margin-left: 20px;
margin-top: 10px;
color: #606060;
}
.titlebar .container
{
height: 100px;
margin-left: 350px;
}
.barcode_input {
margin: 10px 10px 10px 10px;
}
.barcode_input_box {
width: 200px;
font-size: 16px;
border: 1px solid #02325d;
color: #ffffff;
background: #12729d;
margin: 10px 10px 0px 10px;
}
.barcode_input_button {
width: 80px;
height: 30px;
border: 0px;
color: #ffffff;
font-size: 16px;
background: url(blue_button.png);
}
li{
list-style-type: none;
padding-top:3px;
padding-bottom:3px;
}
.testimonial label {
width:240px;
float:left;
}
.input_box {
width: 300px;
font-size: 16px;
color: #ffffff;
border: 1px solid #02325d;
background: #12729d;
}
.input_button {
width: 80px;
height: 30px;
border: 0px;
color: #ffffff;
font-size: 16px;
margin-left: 200px;
margin-top: 20px;
background: url(blue_button.png);
}
.titlebar * {
color: #fff9c2;
}
.textshadow .titlebar * {
text-shadow: -1px 1px 3px #333333;
}
.textshadow .titlebar .pager * {
text-shadow: none;
}
.titlebar h1 {
color: #fff174;
}
.titlebar .container {
padding-top: 20px;
padding-bottom: 20px;
}
.titlebar .box.container {
padding-top: inherit;
padding-bottom: inherit;
}
.titlebar .box.split.right .last,
.titlebar .box.split.left .first {
background: url(bg-orange-noise-highlight.png) no-repeat 0 100%;
}
.textshadow .titlebar h1 {
text-shadow: #a6670e -1px 1px 1px;
}
/* !Testimonial */
.testimonial {
background: #fdfdfd;
margin: 30px 200px 30px 200px;
padding-bottom: 30px;
}
.mmimage {
position:relative;
}
.mmimage .text {
position:absolute;
top:10px;
left:100px;
}
.leftsite
{
background: #edfded;
width: 380px;
margin: 30px 2px 30px 200px;
padding: 5px;
float:left;
}
.rightsite
{
background: #edfded;
width: 380px;
margin: 30px 20px 30px 2px;
padding: 5px;
float:left;
}
.sitedesc {
font-size: 18px;
margin-bottom: 30px;
margin-left:6px;
}
.sample {
margin-left:20px;
margin-top:10px;
}
.middle_page {
background: #fdfdfd;
margin: 30px 200px 30px 200px;
height: 300px;
}
.middle_title {
margin: 0px 200px 0px 200px;
padding-top: 20px;
padding-bottom: 20px;
}
.middle_page #saved_project{
margin-top: 40px;
}
.testimonial blockquote {
font-size: 18px;
font-style: italic;
font-family: "Georgia";
}
.testimonial .quote,
.testimonial .logo {
float: left;
display: block;
}
.testimonial .container {
position: relative;
}
.testimonial .logo {
left: 575px;
width: 100%;
height: 100%;
position: absolute;
padding-left: 30px;
background: #efefef url(bg-arrow-split.png) no-repeat 0 50%;
}
.testimonial .logo img {
vertical-align: middle;
}
.testimonial .quote {
width: 530px;
padding: 25px;
padding-left: 0;
}
.testimonial .quote .author-wrap {
float: right;
margin-top: 10px;
}
.testimonial .quote .author {
font-size: 18px;
font-weight: bold;
}
.testimonial .quote .restaurant {
color: #666666;
font-size: 12px;
margin-left: 12px;
}
/* !Content */
.content h1,
.content h2 {
margin-bottom: 5px;
}
.content h1 {
font-size: 28px;
line-height: 30px;
text-transform: capitalize;
font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif;
}
.content h2 {
color: #999999;
font-size: 20px;
line-height: 26px;
font-weight: normal;
}
/* !LeftNav */
.left-nav {
margin: 25px 0;
border: 1px solid #d5d5d5;
background-color: #f7f7f7;
}
.boxshadow .left-nav {
-moz-box-shadow: 0px 0px 5px #d5d5d5;
box-shadow: 0px 0px 5px #d5d5d5;
}
.borderradius .left-nav {
-moz-border-radius: 10px;
border-radius: 10px;
}
.left-nav nav {
float: left;
width: 170px;
height: 100%;
display: block;
margin: 25px 0;
}
.left-nav nav li {
padding: 10px;
color: #666666;
font-weight: bold;
padding-left: 20px;
border-top: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
.left-nav nav li a {
color: #666666;
}
.left-nav nav li.first,
.left-nav nav li:first-child {
border-top: none;
}
.left-nav nav li.last,
.left-nav nav li:last-child {
border-bottom: none;
}
.left-nav nav li.hover a {
color: #000000;
}
.left-nav nav li.active {
width: 170px;
color: #ffffff;
padding-bottom: 0;
margin-left: -12px;
position: relative;
border-top: none;
border-bottom: none;
background: url(bg-left-nav-active.png) no-repeat 0 0;
}
.left-nav nav li.active a {
height: 40px;
display: block;
color: #ffffff;
}
.left-nav nav li.active+li {
padding-top: 6px;
border-top: none;
}
.left-nav nav li.active.first a,
.left-nav nav li.active:first-child a {
height: 38px;
}
.left-nav .content {
float: left;
width: 728px;
padding: 25px 30px;
background-color: #ffffff;
}
html.oldie .left-nav .content {
padding-bottom: 5px;
}
.borderradius .left-nav .content {
-moz-border-radius: 0 10px 10px 0;
border-radius: 0 10px 10px 0;
}
/* !ContentColumn */
.left-nav .content .column:before,
.left-nav .content .column:after { content: ""; display: table; }
.left-nav .content .column:after { clear: both; }
.left-nav .content .column {
zoom: 1;
text-align: center;
}
.left-nav .content .column strong {
display: block;
font-size: 18px;
margin-bottom: 5px;
text-align: left;
}
.left-nav .content .column p {
line-height: 20px;
text-align: left;
margin-bottom: 10px;
}
.left-nav .content .one.column .column {
padding: 0 5px;
}
.left-nav .content .center.column strong,
.left-nav .content .center.column p {
text-align: center;
}
.left-nav .content .two.column .column {
float: left;
width: 344px;
padding: 0 10px;
display: block;
}
.left-nav .content .three.column .column {
float: left;
width: 235px;
display: block;
margin-left: 10px;
}
.left-nav .content .three.column .first.column {
margin-left: 0;
}
.left-nav .content .three.column .column p,
.left-nav .content .three.column .column strong {
padding: 0 5px;
}
/* !Callout */
.callout {
font-size: 18px;
margin-bottom: 30px;
background: #ffffff;
}
.borderradius .callout {
-moz-border-radius: 10px;
border-radius: 10px;
}
.boxshadow .callout {
-moz-box-shadow: 0 0 5px #e8e8e8;
box-shadow: 0 0 5px #e8e8e8;
}
/*---------------*
* Buttons
*---------------*/
button, a.button {
font-family: "TradeGothicLTStdBold";
text-transform: uppercase;
text-align: center;
text-decoration: none;
}
a.button:hover {
text-decoration: none;
}
.textshadow button, .textshadow a.button {
text-shadow: #333 0px -1px 1px;
}
a.button.blue {
width: 214px;
height: 53px;
display: block;
color: #ffffff;
padding: 0 24px;
font-size: 26px;
line-height: 53px;
background: url(btn-blue.png);
}
a.button.blue:hover {
text-decoration: none;
background-position: 0 -54px;
}
a.button.small.blue {
width: 172px;
height: 44px;
padding: 0 15px;
font-size: 20px;
line-height: 44px;
background-position: 0 -108px;
margin-bottom:10px;
}
a.button.small.blue:hover {
background-position: 0 -154px;
}
/*---------------*
* Boxes
*---------------*/
.box:before, .box:after {
content: "";
display: table;
}
.box:after {
clear: both;
}
.box {
zoom: 1;
}
.content.box {
padding: 20px;
margin: 20px 0;
background: #ffffff;
border: 1px solid #D5D5D5;
font-size: 16px;
}
.boxshadow .content.box {
-moz-box-shadow: 0 0 5px #D5D5D5;
box-shadow: 0 0 5px #D5D5D5;
}
.borderradius .content.box {
-moz-border-radius: 10px;
border-radius: 10px;
}
.content.box p,
.content.box ul {
margin-bottom: 20px;
}
.content.box p:last-child,
.content.box ul:last-child {
margin-bottom: 0;
}
.box.split .first,
.box.split .last {
float: left;
display: block;
}
.box.split .last,
.box.split .first {
width: 480px;
}
.box.split.right .last,
.box.split.left .first {
width: 585px;
}
.content.box.split.right .last,
.content.box.split.left .first {
width: 554px;
padding: 0 5px;
}
.box.split.left .last,
.box.split.right .first {
width: 375px;
}
.content.box.split.left .last,
.content.box.split.right .first {
width: 344px;
padding: 0 5px;
}
/*---------------*
* Lists
*---------------*/
ul.list {
margin: 0;
}
ul.list li {
padding: 5px 0;
list-style-type: none;
}
ul.alternating li.even {
background-color: #f4f4f4;
}
ul.check li {
margin-left: 25px;
list-style-image: url(btn-checkmark.png);
}
ul.box li {
padding: 0;
display: block;
}
ul.stack li {
float: none;
}
/*---------------*
* Header
*---------------*/
header {
height: 110px;
width: 100%;
min-width:1200px;
background: url(header-bg.png) repeat-x 0 100%;
}
header #logo {
float: left;
width: 80px;
height: 60px;
margin: 15px 20px;
display: block;
}
header #logo.active {
height: 80px;
background: url(bg-orange-noise-pointer.png) no-repeat 50% 100%;
}
/*---------------*
* Nav
*---------------*/
nav {
float: left;
width: 665px;
}
nav a,
nav a:hover {
text-decoration: none !important;
}
nav li {
float: left;
display: block;
}
nav .top {
float: right;
padding-right: 20px;
background: url(header-nav-top-bg.png) no-repeat right -64px;
}
nav .top li {
height: 31px;
padding: 0 20px;
line-height: 31px;
background: url(header-nav-top-bg.png) no-repeat 0 -32px;
}
nav .top li.first {
padding-left: 25px;
background-position: 0 0;
}
nav .top li.last {
padding-right: 5px;
}
nav .top li,
nav .top li a {
color: #fcfacf;
}
nav .bottom {
clear: both;
float: right;
font-size: 20px;
margin-top: 5px;
}
.oldie nav .bottom ul {
width: 500px;
}
nav .bottom li {
padding: 0 25px;
line-height: 30px;
background: url(header-nav-item-separator.png) no-repeat 0 0;
}
nav .bottom li.hover a {
color: #FCFACF;
}
nav .bottom li.active a {
display: block;
height: 59px;
background: url(bg-orange-noise-dark-pointer.png) no-repeat 50% 100%;
}
nav .bottom li.first {
padding-left: 0;
background: none;
}
nav .bottom li.last {
padding-right: 0;
}
nav .bottom a {
color: #ffffff;
}
.textshadow nav .bottom a {
text-shadow: #000000 0 -2px 0;
}
/*---------------*
* Login
*---------------*/
nav .login {
position: relative;
}
.login_area
{
float: right;
margin-top: -30px;
}
.login_area li
{
float: right;
margin-right: 20px;
}
#logo_icon
{
float: left;
}
.head h2
{
margin-top: 30px;
}
.head li
{
margin-left: 250px;
}
.head
{
color: #ffffff;
margin-left: 60px;
}
#login {
top: 20px;
right: -20px;
width: 282px;
padding: 10px 15px;
position: absolute;
margin-right: 220px;
border: 1px solid #313131;
background-color: #000000;
}
.borderradius #login {
-moz-border-radius: 0 0 10px 10px;
border-radius: 0 0 10px 10px;
}
#login input {
background: #ffffff;
border: 1px solid #313131;
}
#tag_detail
{
margin-left: 240px;
}
.testimonial .question
{
color: #333333;
font-weight: bold;
}
.testimonial .answer
{
color: #111155;
}
/*-----------------------------------------------------------------------------------------------------------------------
Dropbox
------------------------------------------------------------------------------------------------------------------------*/
#dropbox{
background:url('./resource/background_tile_3.jpg');
border-radius:3px;
position: relative;
margin:80px auto 90px;
min-height: 290px;
overflow: hidden;
padding-bottom: 40px;
width: 990px;
box-shadow:0 0 4px rgba(0,0,0,0.3) inset,0 -3px 2px rgba(0,0,0,0.1);
}
#dropbox .message{
font-size: 11px;
text-align: center;
padding-top:160px;
display: block;
}
#dropbox .message i{
color:#ccc;
font-size:10px;
}
#dropbox:before{
border-radius:3px 3px 0 0;
}
/*-------------------------
Image Previews
--------------------------*/
#dropbox .preview{
width:245px;
height: 215px;
float:left;
margin: 55px 0 0 60px;
position: relative;
text-align: center;
}
#dropbox .preview img{
max-width: 240px;
max-height:180px;
border:3px solid #fff;
display: block;
box-shadow:0 0 2px #000;
}
#dropbox .imageHolder{
display: inline-block;
position:relative;
}
#dropbox .uploaded{
position: absolute;
top:0;
left:0;
height:100%;
width:100%;
background: url('./resource/done.png') no-repeat center center rgba(255,255,255,0.5);
display: none;
}
#dropbox .preview.done .uploaded{
display: block;
}
/*-------------------------
Progress Bars
--------------------------*/
#dropbox .progressHolder{
position: absolute;
background-color:#252f38;
height:12px;
width:100%;
left:0;
bottom: 0;
box-shadow:0 0 2px #000;
}
#dropbox .progress{
background-color:#2586d0;
position: absolute;
height:100%;
left:0;
width:0;
box-shadow: 0 0 1px rgba(255, 255, 255, 0.4) inset;
-moz-transition:0.25s;
-webkit-transition:0.25s;
-o-transition:0.25s;
transition:0.25s;
}
#dropbox .preview.done .progress{
width:100% !important;
}
#login input[type=text],
#login input[type=password] {
width: 125px;
padding: 5px;
}
#login input[type=submit],
#login input[type=button] {
color: #cccccc;
background-color: #313131;
border: 1px outset #999999;
margin: 10px 5px 0 0;
}
#login .right {
text-align: right;
}
#error_info
{
color: #ff0000;
padding-left: 160px;
display: none;
}
/*---------------*
* Main
*---------------*/
#main {
background-color: #ffffff;
width:100%;
float:left;
}
html.oldie {
overflow-x: hidden;
}
html.oldie #main,
html.no-js #main {
display: block;
}
/*---------------*
* Homepage
*---------------*/
#info-wrap {
height: 425px;
}
#simple-sub-header {
height: 130px;
}
#simple-sub-header h3{
margin-top: 35px;
}
#info-wrap .check.list {
font-size: 18px;
}
#info-wrap .first {
height: 80px;
padding: 30px 0 0;
}
#info-wrap .button {
margin: 25px 0 0;
}
#info-wrap #devices {
width: 284px;
height: 80px;
margin: 20px 50px;
border: 1px solid #313131;
position: absolute;
}
#info-wrap #devices ul {
top: -25px;
width: 100%;
margin: 0 auto;
text-align: center;
}
#info-wrap #devices li {
height: 420px;
}
.oldie #info-wrap #devices li {
background: none !important;
}
html.no-js #info-wrap #devices li {
display: none;
}
html.no-js #info-wrap #devices li:first-child {
display: block;
}
#info-wrap #devices p {
left: 0;
bottom: 15px;
width: 385px;
color: #333333;
font-size: 14px;
font-weight: bold;
text-align: center;
position: absolute;
}
.textshadow #info-wrap #devices p {
text-shadow: #cccccc 0 1px 1px;
}
#info-wrap #devices .pager {
bottom: 0;
width: 385px;
height: 30px;
display: block;
position: absolute;
text-align: center;
}
#info-wrap #devices .pager a {
color: transparent;
width: 15px;
height: 15px;
margin: 0 5px;
display: inline-block;
background: url(btn-pager.png) no-repeat 0 -15px;
}
#info-wrap #devices .pager a.activeSlide {
background-position: 0 0;
}
#video-overview {
padding: 35px 0;
}
#video-overview h2 {
color: #e68617;
font-size: 20px;
}
#video {
width: 560px;
height: 315px;
}
.boxshadow #video {
-moz-box-shadow: 0px 0px 10px #666666;
box-shadow: 0px 0px 10px #666666;
}
html.no-js #video-link {
width: 580px;
height: 335px;
display: block;
text-decoration: none;
}
#video-overview .list {
margin: 0 0 0 20px;
}
#video-overview .list li {
font-size: 14px;
padding: 0 0 15px 70px;
}
#video-overview .list h3 {
font-size: 16px;
margin-bottom: 5px;
}
.actionIndex .testimonial .quote {
text-align: center;
}
.actionIndex .testimonial blockquote {
font-size: 28px;
line-height: 100px;
}
html.no-js .actionIndex .testimonial blockquote {
line-height: 100px;
}
.actionIndex .callout {
font-size: 20px;
line-height: 45px;
}
.actionIndex .callout .button {
display: inline-block;
}
/*---------------*
* How It Works
*---------------*/
.actionHowItWorks hr {
margin: 0;
}
.actionHowItWorks .titlebar .container .first,
.actionHowItWorks .titlebar .container .last {
padding: 20px 0;
}
.actionHowItWorks .titlebar .container .first p {
font-size: 18px;
}
.actionHowItWorks .titlebar .button {
margin: 6px auto;
}
#how-it-works {
padding: 25px 0;
}
.actionHowItWorks .callout .button {
display: inline-block;
}
#ordering-process h2 {
color: #E68617;
font-size: 32px;
line-height: 40px;
text-transform: uppercase;
border-bottom: 1px inset #DADADA;
}
.moduleStatic.actionHowItWorks dt {
line-height: 32px;
vertical-align: bottom;
}
.moduleStatic.actionHowItWorks dt,
.moduleStatic.actionHowItWorks dd {
padding-left: 45px;
}
.moduleStatic.actionHowItWorks dt.customers {
background: url(icon-how-it-works-customers.png) no-repeat 0 0;
}
.moduleStatic.actionHowItWorks dt.browse {
background: url(icon-how-it-works-browse.png) no-repeat 0 0;
}
.moduleStatic.actionHowItWorks dt.order {
background: url(icon-how-it-works-order.png) no-repeat 0 0;
}
.slider {
overflow: hidden;
background: #ffffff;
border: 1px solid #d5d5d5;
}
.borderradius .slider {
-moz-border-radius: 10px;
border-radius: 10px;
}
.boxshadow .slider {
-moz-box-shadow: 0 0 5px #D5D5D5;
box-shadow: 0 0 5px #D5D5D5;
}
.slider p {
margin-bottom: 10px;
}
.slides,
.slides .slide {
overflow: hidden;
}
.slides {
height: 340px;
}
.slide {
float: left;
width: 918px;
padding: 20px;
}
.slide .image {
float: left;
width: 300px;
height: 300px;
display: block;
text-align: center;
}
.slide .description {
float: left;
width: 598px;
display: block;
font-size: 16px;
margin-left: 20px;
}
.slide .description h1 {
font-size: 62px;
line-height: 64px;
}
.textshadow .slide .description h1 {
text-shadow: #666666 -1px 1px 1px;
}
.slide .description p {
margin-bottom: 10px;
}
.slide-controls {
background: #FFFFFF;
}
.borderradius .slide-controls {
-moz-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
}
.slide-controls a {
float: left;
width: 299px;
padding: 10px;
display: block;
color: #333333;
font-size: 16px;
line-height: 35px;
position: relative;
text-align: center;
text-decoration: none;
background-color: #EFEFEF;
border-bottom: 1px solid #E0E0E0;
}
.borderradius .slide-controls a.first {
-moz-border-radius: 10px 0 0 0;
border-radius: 10px 0 0 0;
}
.slide-controls a.last {
border-right: none;
}
.borderradius .slide-controls a.last {
-moz-border-radius: 0 10px 0 0;
border-radius: 0 10px 0 0;
}
.slide-controls a.active {
background: #ffffff;
border-bottom: none;
border-left: 1px solid #e0e0e0;
border-right: 1px solid #e0e0e0;
}
.slide-controls a.first.active {
border-left: none;
}
.slide-controls a.last.active {
border-right: none;
}
.slide-controls a.even.active {
width: 298px;
}
.slide-controls .title {
font-size: 18px;
font-weight: bold;
display: block;
}
.slide-controls img {
margin: 15px 0 0 0;
}
/*---------------*
* Feature Tour
*---------------*/
.actionFeatureTour .titlebar .container .first,
.actionFeatureTour .titlebar .container .last,
.moduleFeatures .titlebar .container .first,
.moduleFeatures .titlebar .container .last {
padding: 20px 0;
}
.actionFeatureTour .titlebar .container .last,
.moduleFeatures .titlebar .container .last {
text-align: center;
}
.actionFeatureTour .titlebar .container .last .button,
.moduleFeatures .titlebar .container .last .button {
margin: 15px auto;
}
.actionFeatureTour #app-image,
.moduleFeatures #app-image {
float: left;
margin-right: 10px;
}
.moduleFeatures .two.column.extra .column {
padding: 0 20px;
width: 324px;
}
.moduleFeatures.actionIphone .two.column img,
.moduleFeatures.actionIpad .two.column img,
.moduleFeatures.actionAndroid .two.column img,
.moduleFeatures.actionOrders .two.column img {
width: 350px;
}
.pager a,
.pager a:hover
.pager a:visited {
text-decoration: none;
}
.pager a:hover {
font-weight: bold;
}
.pager .prev {
float: left;
}
.pager .next {
float: right;
}
/*---------------*
* Pricing
*---------------*/
.actionPricing .titlebar .container {
padding: 20px 0;
}
.actionPricing .titlebar h1 {
margin-bottom: 5px;
}
.actionPricing .content {
padding: 30px 0;
}
.actionPricing #price h1 {
margin: 0;
letter-spacing: -8px;
}
.actionPricing #price strong {
color: #666666;
}
.actionPricing .box {
text-align: center;
}
.actionPricing .box .first {
width: 640px !important;
}
.actionPricing .box .last {
width: 300px !important;
margin-left: 20px !important;
}
.actionPricing .box .button {
margin: 27px auto;
}
.actionPricing .box .list {
padding: 2px;
border: 1px solid #e4e4e4;
background-color: #ffffff;
}
.borderradius .actionPricing .box .list {
-moz-border-radius: 10px;
border-radius: 10px;
}
.actionPricing .box .list li {
padding: 5px;
text-align: left;
}
.actionPricing .box .list label {
float: left;
width: 158px;
display: block;
font-weight: bold;
cursor: default;
}
.actionPricing .box .list span {
float: left;
width: 100px;
display: block;
}
.actionPricing #app-bundle {
height: 472px;
margin-top: 15px;
background: url(bg-app-bundle.png) no-repeat 0 0;
}
/*---------------*
* Privacy Policy & Terms of Service
*---------------*/
.actionTerms .content.box,
.actionPrivacy .content.box,
.actionReturnPolicy .content.box {
font-size: 12px;
}
.actionPrivacy .list li li,
.actionTerms .list li li,
.actionReturnPolicy .list li li {
list-style-type: disc;
}
.actionPrivacy .list li li li,
.actionTerms .list li li li,
.actionReturnPolicy .list li li li {
list-style-type: circle;
}
/*---------------*
* FAQ
*---------------*/
.actionFaq .content.box {
font-size: 14px;
}
.actionFaq #questions ul {
margin: 0 0 10px 10px;
}
.actionFaq #answers a {
display: block;
font-size: 11px;
}
.actionFaq #answers .question {
font-size: 16px;
font-weight: bold;
margin-bottom: 5px;
}
.actionFaq #answers .answer {
}
/*---------------*
* Get Started
*---------------*/
.actionSignup h2 {
font-size: 26px;
line-height: 36px;
margin-bottom: 10px;
}
/*---------------*
* Footer
*---------------*/
footer {
font-size: 11px;
padding-top: 15px;
background: #525252 url(footer-bg.png) repeat-x 0 0;
}
footer,
footer a,
footer a:hover,
footer a:active,
footer a:visited {
color: #cccccc;
text-decoration: none;
}
footer ul {
width: 150px;
vertical-align: top;
display: inline-block;
margin: 0 40px 0 0;
}
html.oldie footer ul {
float: left;
display: block;
}
footer li {
margin: 2px 0;
text-align: left;
list-style-type: none;
}
footer li,
footer li a {
font-weight: bold;
}
footer li.title {
color: #ffffff;
font-size: 12px;
position: relative;
margin-bottom: 6px;
border-bottom: 1px solid #666666;
}
.textshadow footer li.title {
text-shadow: -1px 1px 1px #000000;
}
footer li.title:after {
content: '';
display: block;
position: relative;
border-bottom: 1px solid #333333;
}
footer p {
padding: 15px 0;
font-size: 90%;
}
html.oldie footer p {
clear: both;
}
footer .social li.facebook,
footer .social li.twitter,
footer .social li.blog {
height: 22px;
line-height: 20px;
padding-left: 22px;
background-repeat: no-repeat;
background-position: 0 50%;
}
footer .social .facebook {
background: url(icon-facebook.png);
}
footer .social .twitter {
background: url(icon-twitter.png);
}
footer .social .blog {
background: url(icon-blog.png);
}
/**
* Non-semantic helper classes: please define your styles before this section.
*/
/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
/* Hide for both screenreaders and browsers:
css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: by Jon Neal.
www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements in most situations.
nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
/**
* Print styles.
*
* Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
*/
@media print {
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
-ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
a, a:visited { color: #444 !important; text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}