/* If you make a mess of this stylesheet Mark will super glue your macbook lid and Daniel will watch! */

/* SWATCHES 
#333333 - [dark grey] body text
#3084ca - [blue] link colour
#78b9e7 - [ dark blue ] hover link
#d9d9d9 - [light grey] borders
#48860b - [green]
*/

/* =============== */
/* = Global CSS = */
/* =============== */

* {margin:0; padding:0; }

html, body {height: 100%;} /* sticky footer */

body{ background:#FFF; font-family: 'Lucida Grande', 'Lucida Sans Unicode',sans-serif; font-size:13px; color:#434343;margin:0;-webkit-text-size-adjust: none; }

h1, h2, h3, h4, h5, h6 {font-family:'Lucida Grande', 'Lucida Sans Unicode'; font-weight:normal;color:#000;}
h1  { text-shadow: 2px 2px 2px #3c7710;  font-weight: 800;font-size:52px; color:#FFF; letter-spacing:-1px; margin-top:3px; float:left; line-height:normal;}
h2 {font-size:32px; margin: 0 0 25px;  }
h2.small { font-size:22px; margin-bottom: 15px; }
h3 {font-size:16px; margin:0 0 10px; font-weight:bold;}
h4 {font-size:14px; margin:0 0 10px; font-weight:bold;}

input {margin:0 0 10px 0;}
p {line-height:18px; margin:0 0 15px 0; }
ul { margin:0px 0 25px 0px; padding:0 0 0 10px; }
ul li {  margin:0 15px 10px 0;background: url('../images/icons/greybullet.gif') no-repeat top left; padding:0 0 0 15px; list-style-type:none; }
a {color:#3084ca; text-decoration:none; font-weight:normal; }
a:hover { color: #78b9e7; }
img { border: none; }

form  { margin:15px 0 0 0; padding:5px 25px 15px 15px; background:#efefef; border:1px solid #d9d9d9;-moz-border-radius: 5px;-webkit-border-radius: 5px;}/*used for contact.html*/
form label {display:block; font-size:12px; margin:15px 0 5px 0;color:#000; font-weight:bold;}
form textarea {width:98%;font-family:helvetica, arial, sans-serif; padding:7px; font-size:14px;}
form select {font-size:13px; padding:1px;margin:4px 0 10px 0}
form input[type="text"], form input[type="password"] { width:100%; padding:3px; font-size:14px;}
form input[type="image"] {margin:10px 0 0 0; display:block; }

/* custom classes */
.screenshot {margin-bottom:18px;}
.screenshot img { border: 3px solid #ccc; }
.icon {margin:0 10px 10px 10px;} /* DEPRECATED - use icon-left or icon-right */
.icon-left { float:left; margin:0 10px 10px 0;}
.icon-right { float:right; margin:0 0 10px 10px;}

.quote { clear: left; margin: 10px 0 30px 30px; }
.quote blockquote { font-size: 16px; font-style: italic; font-family: Times, "Times New Roman", Serif; margin-bottom: 7px; color: #555; }
.quote img { float: left; margin-right: 25px; }
.quote p { text-align: right; color: #999; }
.box { background: #f2f2f2; padding: 15px; margin-bottom: 20px; border: 1px solid #ddd; }
.block { background:#efefef; border:1px solid #d9d9d9;-moz-border-radius: 5px;-webkit-border-radius: 5px; padding: 10px; margin-bottom: 30px; }

.highlight-box { border:1px solid #e0bb3e; background:#fffcd7; margin: 0 0 25px 0; } /* yellow box on sign up */
.highlight-box h2 { margin: 0 0 10px 0;}
.highlight-box p { margin:0 0 5px 0 ; font-size:16px;}
.highlight-box p.notes { font-size:11px; }
.highlight-box-wrapper { padding:15px; }

.date { color: #4aa40d; font-weight: bold; }
.arrow-link { padding-left: 18px; background: url('../images/icons/arrow13.gif') center left no-repeat; }

/* typography related */
.light, .note, .hint { color: #777; }
.lighter { color: #ccc; }
.center {text-align:center; margin-left:auto; margin-right:auto;}
.big { font-size: 150%; }

.code { margin-bottom: 20px; background: #333; padding: 7px; }
.code-example { background:#fffbdf; border:1px solid #ffdeb7;  font-family:"Monoco","Lucida Console", sans-serif; margin-bottom:18px;}
.code-example .highlight { color:#59a322; font-weight:bold; }
.code-example em { color:#747474; font-weight:normal; font-style:normal; }
.code-example-wrapper { padding:15px;}

.code-tag { color: #069cc1; }
.code-liquid { color: #a0dde6; }
.code-liquid2 { color: #fff; }
.code-quot { color: #bedc77; }

.interview p { margin-bottom: 32px; }

/* the grid */
.col-1, .col-2, .col-3, .col-4, .col-4-5, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {margin-right:35px; float:left;}
.col-12 { margin-right:0px;}

.col-12 {width:925px;}
.col-11 {width:845px;}
.col-10 {width:765px;}
.col-9 {width:685px;}
.col-8 { width:605px;}
.col-7 {width:525px;}
.col-6 {width:445px;}
.col-5 {width:365px;}
.col-4-5 {width:307px;}
.col-4 {width:285px;}
.col-3 {width:205px;}
.col-2 {width:125px;}
.col-1 {width:45px;}

.last {margin-right:0 !important;}

.margin-bottom {margin-bottom:10px; }


.l { text-align: left; }
.r { text-align: right; }
.left{float:left;}
.right{float:right;}
.clear {clear:both;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden; }

hr {color:#d9d9d9; background:#d9d9d9;border:0px; height:1px;margin-bottom:25px;clear:both;}
.screenshot {  margin-bottom:25px}

/* ========== */
/* = Layout = */
/* ========== */

/* all content areas that are outside of grid but need to be centered with correct width */
.content { width:925px; margin: 0 auto; display: block; padding:0 20px; }
.content:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}

#wrapper {min-height:100%; height:auto !important;height:100%;margin:0 auto -375px;/* neg val of footer height*/}

#header.twitter { background: #53a70f url('../images/background/bg-header-contest.gif') top left repeat-x; height: 260px; text-align: center; }

#container.frontpage { background: #fff url('../images/background/bg-grey-top-white-bottom.gif') top left repeat-x; border-top: 1px solid #fff; padding-top: 30px; }
#container #video { margin-bottom: 30px; }

#masthead { height:41px; padding-top:13px; background: #212121 url('../images/background/bg-masthead.gif') top left repeat-x; } /* this contains the main nav */
#masthead img.key-sentences-tool  { display:block; float:left; position: relative; bottom: 5px; }
#masthead ul#nav-primary { float:right; margin:0; }
#masthead ul#nav-primary li { float:left; list-style-type:none; margin:0 15px 0 0; height:27px; padding:8px 0 0 4px; background:none; }
#masthead ul#nav-primary li a { padding:7px 8px 0px 6px; color:#ddd; text-decoration:none; font-weight:normal; font-size: 13px; text-shadow: 1px 1px 1px #222; outline:none; }
#masthead ul#nav-primary li a:hover { color: #fff; text-decoration:none;}
#masthead ul#nav-primary li a:active, #masthead ul#nav-primary li a:focus { color:#FFF; } 
#masthead ul#nav-primary li.current { background: url('../images/buttons/btn-currentpage-left.png') center left no-repeat; padding:1px 0 0 4px; line-height:12px; margin-top:2px;}
#masthead ul#nav-primary li.current a { background:  url('../images/buttons/btn-currentpage-right.png') center right no-repeat;display:block; height:19px;}
#masthead ul#nav-primary li.login { background: url('../images/background/decal-masthead.gif') center left no-repeat; padding-left: 18px; }
#masthead ul#nav-primary li.login a { color: #999; }
#masthead ul#nav-primary li.login a:hover { color: #fff; }


#banner { height:75px; padding:30px 0 40px 0; background: url('../images/background/bg-subpagebanner.gif') repeat-x; } /* green banner used on all sub-pages */
/*#banner .subpage-header { text-shadow: 2px 2px 2px #3c7710;  font-weight: 800;font-size:50px; color:#FFF; letter-spacing:-1px; margin-top:-5px; float:left; line-height:normal; }*/

/* the contact info on the green banner */
#banner #contact-us {float:right; margin-top:5px;}
#banner #contact-us img { display:block; float:right;}
#banner #contact-us p { margin:0 0 5px 0;font-size:22px; color:#FFF;  text-shadow: 1px 1px 2px #3c7710; font-family: "Helvetica Neue", sans-serif; font-weight: 200; margin:0 0 7px 0; text-align:right;}
#banner #contact-us a.livechat { height:22px; width:82px; position:relative; left: 7px; background:url('../images/buttons/btn-livechat.gif') no-repeat; float:right; overflow:hidden; text-indent:-99999px;}
#banner #contact-us a.livechat:hover { background-position: 0px -31px;}
#banner #contact-us a.emailus { height:22px; width:68px; clear:both; background:url('../images/buttons/btn-emailus.gif') no-repeat; float:right; overflow:hidden; text-indent:-99999px;}
#banner #contact-us a.emailus:hover { background-position: 0px -31px;}

#banner #chat-off {  }


#content {padding:20px 0 0;}

#footer,#push { clear:both;/* .push must be the same height as .footer */ }
#push {height: 375px;}

#footer-wrapper { padding:20px 0 0 0; width:925px; margin:auto;}
#footer { background:#111 url('../images/background/bg-footer.gif') repeat-x; height: 375px; color: #666; border-top: 1px solid #444; font-size: 11.5px; }
#footer.frontpage { height: 640px; }
#footer h3 { color: #fff; border-bottom: 1px solid #444; margin-bottom: 10px; padding:0 0 5px 0; font-size: 13px; font-weight:normal;}
#footer a { color: #777 }
#footer a:hover { color: #cdcdcd;  }
#footer ul { list-style-type: none; margin: 0 0 20px 0; padding: 0; }
#footer ul li { margin-bottom:5px; font-size:11.5px; background:none; padding:0; }
#footer ul li a { color:#999;  }
#footer ul li a:hover { color:#3084ca; }

#footer .content { margin-top:20px; }
#footer .copyright { margin-top:20px; }

#footer .contact-us img { margin-right:4px;}
#footer .contact-us li { margin-bottom:7px }
#footer .contact-us, #footer .contact-us a  { color: #cdcdcd; }
#footer .contact-us * { vertical-align: middle; }
#footer .contact-us a:hover { }
/*#footer ul.post-list   { margin:0 0 20px 0; }
#footer ul.post-list  li { border-bottom: 1px solid #444; padding:0 0 7px 0; }*/

/*#footer #twitter_update_list ul li { background:none; padding:0; margin-bottom:15px; }*/
#footer  #copyright { text-align: center; font-size: 11px; color: #666; margin: 15px 0 10px 0; }

/* ================ */
/* =     INDEX    = */
/* ================ */


#header.frontpage { background: #4aa30d url('../images/background/bg-header-frontpage.gif') top left repeat-x;}
#header.frontpage h1 { margin:0; padding:0; float:none;}
#header.frontpage .banner { margin:auto; width:925px; }

/* banners */
#header.frontpage .createyourown-bottom { background: url('../images/banners/createyourown-bottom.jpg'); height:400px; }
#header.frontpage .createyourown-bottom h1 { position:relative; top:260px;}
#header.frontpage .createyourown-bottom a { position:relative; top:150px; left:695px; }
#header.frontpage .createyourown-bottom p { color:#fff; position:relative; top:260px; left:10px; font-size:17px; line-height:20px;} 

#header.frontpage .createyourown-top { background: url('../images/banners/createyourown-top.jpg') no-repeat; height:332px;}
#header.frontpage .createyourown-top h1 { position:relative; top:30px;}

#header.frontpage .header_copywritingsoftware {background: url('../images/banners/header_copywritingsoftware.jpg') no-repeat; height:330px;}
#header.frontpage .header_copywritingsoftware .signup { position:relative; top:230px; left:10px;  }
#header.frontpage .header_copywritingsoftware a {outline:none; }

#header.frontpage .checklist { background: url('../images/banners/checklist.jpg') no-repeat; height:332px; }
#header.frontpage .checklist h1 { position:relative; top: 20px;}
#header.frontpage .checklist #signup-btn { position: relative; top: 144px; }

#header.frontpage .threesteps { background:  url('../images/banners/3step.jpg') no-repeat; height:410px;  }
#header.frontpage .threesteps h1 { position:relative; top:25px;}
#header.frontpage .threesteps ul li { background:none; list-style-type:none; position:relative; color:#FFF; font-size:14px;}
#header.frontpage .threesteps ul li.step1 { top:43px; left: -299px; text-align:center;}
#header.frontpage .threesteps ul li.step2 { top:0px;  left: 30px; text-align:center;}
#header.frontpage .threesteps ul li.step3 { top:-43px;right: 30px; text-align:right;}

#subheader.subheader-3steps {  text-align:center; }
#subheader.subheader-3steps p, #subheader.subheader-3steps img  { display:inline; vertical-align:middle; font-size:14px;}
#subheader.subheader-3steps img { margin:0 10px;}
#subheader.subheader-3steps a { color:#FFF; text-decoration:underline;}
#subheader.subheader-3steps a:hover { color:gray; text-decoration:none;}

#subheader .customsubheader-contest p { text-align:center; margin-bottom:0px;  }
#subheader .customsubheader-contest p a { text-align:center; color:#0b92df; margin-top:10px; display:block; text-decoration:underline; outline:none; }
#subheader .customsubheader-contest p a:hover { color:#87d3ff; text-decoration:none;}

#subheader { background: #171717 url('../images/background/bg-header-signup.gif') top left repeat-x; height: 90px; text-align: right; padding: 18px 10px 3px 10px; text-shadow: 1px 1px 1px #222; }
#subheader h2 { font-size: 21px; color: #eee; margin-bottom: 12px; padding-top:4px;}
#subheader p { font-size: 16px; color: #ddd; }



#feature-bar { background: #d2d2d2 url('../images/background/bg-grey.gif') top left repeat-x; height: 145px; padding-top: 6px; font-size: 12px; }
#feature-bar .col-3, #features .col-3 { width: 220px; margin-right: 15px; }
#feature-bar .feature, #features .feature { margin-top: 10px; margin-bottom: 10px; cursor: pointer; padding: 5px 0px 5px 5px; }
#feature-bar .feature:hover, #features .feature:hover { background: url('../images/background/bg-frontfeature-hover.gif') top left no-repeat; }
#feature-bar .feature:hover p.light, #features .feature:hover p.light { color: #555; }
#feature-bar .feature:hover h3, #features .feature:hover h3 { color: #111; }


#feature-bar h3, #features h3 { font-weight: lighter; padding: 10px 0 6px 40px; color: #444; font-size: 16px; }
#feature-bar h3.title-database, #features h3.title-database { background: url('../images/icons/database.jpg') center left no-repeat; }
#feature-bar h3.title-algorithm, #features h3.title-algorithm { background: url('../images/icons/algorithm.jpg') center left no-repeat;}
#feature-bar h3.title-increase-score, #features h3.title-increase-score { background: url('../images/icons/increase-score.jpg') center left no-repeat; }
#feature-bar h3.title-score, #features h3.title-score { background: url('../images/icons/score.jpg') center left no-repeat; }


#feature-bar.dark .feature:hover { background: none; }
#feature-bar.dark .feature:hover p.light { color: #aaa; }
#feature-bar.dark .feature:hover h3 { color: #111; }
#feature-bar.dark h3.title-storefront { background-image: url('../images/icons/storefront32-dark.gif'); }
#feature-bar.dark h3.title-shoppingcart { background-image: url('../images/icons/shoppingcart32-dark.gif');}
#feature-bar.dark h3.title-customizable { background-image: url('../images/icons/colorwheel32-dark.gif'); }
#feature-bar.dark h3.title-secure { background-image: url('../images/icons/safe32-dark.gif'); }

#features .feature { margin: 20px 0 0 0; }
#features .feature:hover { background: none; }
#features.dark .feature:hover p.light { color: #000; }

#signup-big { float: right; margin: 0 0 0 20px; text-align: center; }
#signup-big p { font-size: 12px; color: #999; }
#signup-big a { color: #ddd; }
#signup-big a:hover { color: #fff; }

#clients, #contest-bottom { background: #fff url('../images/background/bg-grey2.gif') top left repeat-x; padding-top: 50px; border-top: 1px solid #d5d5d5; }
#title-appstore { padding:2px 0 0 20px; background: url('../images/icons/box16.gif') center left no-repeat; font-size:16px; }
#title-partner { padding-left: 20px; background: url('../images/icons/people16.gif') center left no-repeat; font-size:16px;}
#client-logos { margin: 0px 0 40px 0;}
#client-logos img { margin: 10px -5px 0 0;}
.client { clear: both; margin-bottom: 20px; font-size: 13px;}
.client p { color: #555; margin-bottom: 7px; }
.client img { float: left; margin-right: 10px; }
.client a { float: right; font-size: 11px; }
.client span { color: #999; font-size: 11px; }

#bottom-signup { background: #373737 url('../images/background/bg-grey3.gif') top left repeat-x; padding: 15px 0 14px 0; margin-top: 30px; border-bottom: 1px solid #222; text-align: center; font-size: 16px; color: #999; }
#bottom-signup * { vertical-align: middle; }
#bottom-signup a { color: #eee; }
#bottom-signup a:hover { color: #fff; }
#bottom-signup span { margin: 0 5px; }

#footer-news h3, #footer-twitter h3, #footer-contact h3 { padding: 5px 0 0 25px; height: 22px; }
#footer-news h3 { background: url('../images/icons/feed20.gif') center left no-repeat; }
#footer-twitter h3 { background: url('../images/icons/twitter21.gif') center left no-repeat; }
#footer-twitter .datetime { font-weight: bold; color: #fff; margin-bottom: 5px; font-size: 11px; }
#footer-twitter .tweet_avatar { float: left; margin-left: 5px; }

#footer-news a, #footer-twitter a { color: #78b9e7 !important; }
#footer-news a:hover, #footer-twitter a:hover { color: #3084ca !important; }

#footer-contact { font-size: 13.5px; }
#footer-contact h3 { background: url('../images/icons/mail16.gif') center left no-repeat; }
#footer-contact p { padding: 2px 0 0 25px; height: 22px; color: #fff; margin-bottom: 10px; }

#footer-contact #footer-phone { background: url('../images/icons/phone16.gif') center left no-repeat; color: #fff;}
#footer-contact #chat-on { background: url('../images/icons/chat16.gif') center left no-repeat; }
#footer-contact #footer-email { background: url('../images/icons/email16.gif') center left no-repeat; }

#footer-news li { border-bottom: 1px solid #111; border-top: 1px solid #333; margin: 0 !important; padding: 10px 0 !important; }
#footer-news li p { margin-bottom: 0; }
#footer-news ul li:first-child { border-top: none;}

/* ================ */
/* = Feature Tour = */
/* ================ */

#sidebar-features { background: url('../images/background/bg-sidebar-feature.jpg') 15px 0px no-repeat; height:700px;padding:25px 0 0 0; margin-top:-0px;}
#sidebar-features ul { padding:15px 0 0 0; margin:0;}
#sidebar-features ul li {list-style:none;  font-family:'lucida grande','Lucida Sans Unicode', sans-serif; margin-bottom:20px; padding:0 0 10px 20px; background:none;  }
#sidebar-features ul li a {color:#5b5b5b; display:block;padding:5px 0 5px 30px; background:transparent; outline:none;}
#sidebar-features ul li a:active, #sidebar-features ul li a:focus {color:#000; }

#sidebar-features ul li.current {background: url('../images/buttons/btn-nav-currentfeature.png') right no-repeat; line-height:55px; margin:-20px 0 0 0;border-width:0px;  padding:0 0 11px 20px; }
#sidebar-features ul li.current a { color:#000; font-weight:normal;}
#wrapper #sidebar-features .current * { background-position: 0 -89px;}

#sidebar-features ul a.overview {background: url('../images/icons/feature-nav-icons/overview.gif') 0 5px no-repeat ; }
#sidebar-features ul a.overview:hover {background-position: 0 -109px }

#sidebar-features ul a.marketing {background: url('../images/icons/feature-nav-icons/marketing.gif') 0 5px no-repeat ; }
#sidebar-features ul a.marketing:hover {background-position: 0 -109px }

#sidebar-features ul a.design {background: url('../images/icons/feature-nav-icons/design.gif') 0 5px no-repeat ;}
#sidebar-features ul a.design:hover {background-position: 0 -109px }

#sidebar-features ul a.order {background: url('../images/icons/feature-nav-icons/order.gif') 0 5px no-repeat ;}
#sidebar-features ul a.order:hover {background-position: 0 -109px }

#sidebar-features ul a.security {background: url('../images/icons/feature-nav-icons/security.gif') 0 5px no-repeat ;}
#sidebar-features ul a.security:hover {background-position: 0 -109px }

#sidebar-features ul a.appstore {background: url('../images/icons/feature-nav-icons/appstore.gif') 0 5px no-repeat ; }
#sidebar-features ul a.appstore:hover {background-position: 0 -109px }

#sidebar-features ul a.faq {background: url('../images/icons/feature-nav-icons/faq.gif') 0 5px no-repeat ;}
#sidebar-features ul a.faq:hover {background-position: 0 -109px }

#sidebar-features ul a.tool {background: url('../images/icons/feature-nav-icons/tool.gif') 0 5px no-repeat ;}
#sidebar-features ul a.tool:hover {background-position: 0 -109px }

#sidebar-features ul.list-secondary-features  { margin: -12px 0 0 24px; border-top:1px solid #d9d9d9; padding: 8px 0px 0px;}
#sidebar-features ul.list-secondary-features li { font-size: 11.5px; margin: 0 0 5px 0; border-width: 0px; padding: 0; }
#sidebar-features ul.list-secondary-features li a { font-weight: bold; padding: 0 0 0 15px; margin: 5px 0 10px 0; }
#sidebar-features ul.list-secondary-features li a:hover { color: #78b9e7; }
#sidebar-features ul.list-secondary-features li a.current { color: #000; }
#sidebar-features a.designers { background: url('../images/icons/monitor10.gif') center left no-repeat; }
#sidebar-features a.full-list { background: url('../images/icons/checkmark10.gif') center left no-repeat; }

.feature-subheading { color:#777;font-size:17px; text-align:center; margin: -18px 0 30px 0;}

ul.screenshot-featurelist { margin: 20px 0 25px 0; padding: 0; }
ul.screenshot-featurelist li { list-style-type:none; margin:0 0 15px 0; line-height:18px; padding:0; background:none; clear:both; }
ul.screenshot-featurelist li strong { font-size:13px; }
ul.screenshot-featurelist li:after{content:".";display:block;height:0;clear:both;visibility:hidden; }

.feature { margin-bottom:18px ;} /* applied to any feature box that doesn't have a top,middle and bottom */
.feature-box-top { background: url('../images/background/featurebox-top.gif') no-repeat; height:19px; clear:both; margin-top:15px;}
.feature-box-middle { background: url('../images/background/featurebox-middle.gif') repeat-y; padding:0 20px;font-size:12.5; line-height:15px; }
.feature-box-middle p { margin:0; padding:0 0 18px 0;;}
.feature-box-bottom { background: url('../images/background/featurebox-bottom.gif') no-repeat; height:19px; margin:0 0 25px 0 ;}

/* App Store */
ul.app-examples { margin:20px 0 5px 0; padding:0; }
ul.app-examples li { clear:both; list-style:none; margin:0 0 20px 0; padding:0; background:none;}
ul.app-examples li img { float:left; margin:-2px 15px 0 0;}
ul.app-examples li strong { font-weight:bold; }



/* Customization */
ul.designer-list { padding:0 0 1px 0; margin:17px 0 15px 0;  height:inherit;}
ul.designer-list li {  width: 310px; float:left; margin:0 20px 25px 0 ; padding:0 0 0 0;}
ul.designer-list img {float:left; padding: 0 10px 0 0;}
ul.designer-list a {  }
ul.designer-list strong { display:block; color:#000;}
ul.designer-list em { font-size: 11px; color:#4e4e4e; font-style:normal;display:block; margin-top:4px; }

/* All Features */
.feature-list h3 img { margin:1px 4px 0 0; position:relative; top:1px; }
.feature-list {margin-bottom:24px; border-bottom:1px solid #d9d9d9; padding:0 0 13px 0;}
.feature-list h3 { margin: 0 0 10px 0;}
.feature-list ul { margin:0px 0 0 0px; padding:0 0 0px 10px; border-bottom:1px solid #; float:left; }
.feature-list ul:after { content:".";display:block;height:0;clear:both;visibility:hidden;}
.feature-list ul li { float:left; width:307px; margin:0 15px 10px 0;background: url('../images/icons/greybullet.gif') no-repeat top left; padding:0 0 0 15px; list-style-type:none;}


/* ================ */
/* =   Examples   = */
/* ================ */

#examples-box { background: url('../images/other/examples-box.jpg') no-repeat; height: 374px; padding: 15px 0 15px 20px; margin: 40px 0; }
#examples-box h2 { width: 550px; font-size: 22px;}
#examples-box p { width: 550px; margin-bottom: 20px; }
#examples-box .theme-name { margin: 5px 0 0 70px; color: #555; }

#masthead.examples { background: url('../images/background/bg-examples-header.gif') top left repeat-x; height: 56px; }
#masthead.examples img { margin: -3px 50px 0 0; }
#masthead.examples .content  { width: auto; padding: 0 20px; }
#examples-signup { display: block; text-indent: -32000px; width: 156px; height: 28px; background: url('../images/buttons/btn-examples-signup.gif') top left no-repeat; float: right; position: relative; bottom: 3px; overflow: hidden;}
#nav-examples li { float: left; margin: 0; padding: 0; background: none; }
#nav-examples a { color: #fff; text-decoration: underline; }
#nav-examples a:hover { color: #78b9e7; }
#nav-examples a, #nav-examples #themes { margin: 0 20px 0 0; }
#nav-examples { margin: 0px; padding: 0; }
#next-example { background: url('../images/buttons/btn-examples-next.gif') top left no-repeat; height: 23px; width: 65px; margin: 0 20px 0 0 !important;}
#prev-example { background: url('../images/buttons/btn-examples-prev.gif') top left no-repeat; height: 23px; width: 67px; margin: 0 !important;}
#next-example, #prev-example { text-indent: -32000px; display: block; float: left; overflow: hidden; }
#next-example:hover, #prev-example:hover { background-position: 0 -23px; }

.shop { float: left; margin: 0 20px 15px 0; color: #555; text-align: center; }
.shop-thumb img { margin-bottom: 5px; width: 200px; border: 3px solid #ddd; }


/* =========== */
/* = Support = */
/* =========== */
ul#support-icons li { list-style-type:none; margin:0; padding:0; float:left;}
ul#support-icons li a { width:185px; height:190px; float:left; padding:0 16px 15px 17px;margin-right:14px; background:url('../images/buttons/btn-sprt-bg.gif') no-repeat; text-align:center; }
ul#support-icons li a img { display:block; margin: 10px auto 0 auto;}
ul#support-icons li a strong { display:block; font-weight:normal; font-size:12px; margin-top:5px; color:#585858;}

/* =========== */
/* = Sign up = */
/* =========== */
table#price-chart { padding:0; margin:0 0 25px 0; border-collapse:collapse; }
table#price-chart th img { margin-top:160px;} /* sign up button */

table#price-chart th.heading { width: 135px ;}
table#price-chart th.basic { background:url('../images/headers/signup/basic.jpg') no-repeat; width:154px; height:208px; }
table#price-chart th.professional { background:url('../images/headers/signup/professional.jpg') no-repeat; width:154px; height:208px; }
table#price-chart th.business { background:url('../images/headers/signup/business.jpg') no-repeat; width:170px; height:208px; }
table#price-chart th.enterprise { background:url('../images/headers/signup/enterprise.jpg') no-repeat; width:154px; height:208px; }
table#price-chart th.premier { background:url('../images/headers/signup/premier.jpg') no-repeat; width:154px; height:208px; }

table#price-chart th,table#price-chart td  { border-right: 1px solid #FFF; text-align:center;  }
table#price-chart td{ padding:10px;}

table#price-chart .even td { background: #e6e6e6;}

table#price-chart .odd .table-col-0 { background: #e4f0d5;}
table#price-chart .odd .table-col-1 { background: #d8ebd3 url('../images/background/pricelist/col2-odd.gif') repeat-y top right;  }
table#price-chart .odd .table-col-2 { background: #d3e7de; }
table#price-chart .odd .table-col-3 { background: #d4e7df url('../images/background/pricelist/col4-odd.gif') repeat-y top left;  }
table#price-chart .odd .table-col-4 { background: #daeefb;}

table#price-chart .even .table-col-0 { background: #cbe1ab; }
table#price-chart .even .table-col-1 { background: #b1d7a7 url('../images/background/pricelist/col2-even.gif') repeat-y top right; }
table#price-chart .even .table-col-2 { background: #a7cfbd; }
table#price-chart .even .table-col-3 { background: #a9cdd9 url('../images/background/pricelist/col4-even.gif') repeat-y top left;  }
table#price-chart .even .table-col-4 { background: #b5ddf7; }

#errorExplanation { padding: 5px 10px 5px 60px; background: #FCF7DC url('../images/icons/warning32.png') 2% 50% no-repeat; margin-bottom: 25px; }
#errorExplanation h3 { margin-top: 5px !important; }
#errorExplanation p { margin-bottom: 5px !important; }


/* ================ */
/* = Sign up form = */
/* ================ */

#signup form { background: none; border: none; }
#signup form input[type="text"], #signup form input[type="password"] { width: auto; margin-bottom: 3px; }
#signup h3 { margin: 32px 0 8px; }
#signup label { display: inline; }
#signup td { padding: 5px 15px 5px 0; }
#signup #preview-availability { display: inline; }
#signup #available { display: inline; margin-left: 10px; }
#signup #available .positive { padding-left: 20px; background: url('../images/icons/checkmark16.png') center left no-repeat; color: #3f8916;}
#signup #available .negative { padding-left: 20px; background: #fcf7dc url('../images/icons/warning16.png') center left no-repeat; color: #222;}
#signup .inactive { -moz-opacity: 0.25; opacity:.25; filter: alpha(opacity=25); }
#signup img.credit-card { margin-left: 3px; vertical-align: top; }
#signup #themes { margin: 0px 0; }
#signup #themes .theme { padding: 15px; font-size: 9pt; border: 4px solid #fff; background: #f8f8f8; border: 1px solid #eee; }

.jcarousel-control { padding: 0; }
.jcarousel-control li { background: #f2f2f2; border-top: 1px solid #fff; border-bottom: 1px solid #e5e5e5; padding: 0; margin: 0; }
#signup #themes a { display: block; padding: 8px; }
#signup #themes .active { background: #78B9E7; border-top: 1px solid #6aa3cc; border-bottom: 1px solid #78B9E7; }
#signup #themes .active a { font-weight: bold; color: #fff; }

#theme-carousel { list-style-type: none; margin: 0; padding: 0; }
#theme-carousel li { background: none; margin: 0; padding: 0; }
.jcarousel-container { position: relative; width: 380px; height: 380px; }
.jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; width: 380px; height: 380px; }
.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; }
.jcarousel-list li, .jcarousel-item { float: left; list-style: none; margin-bottom: 10px;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 380px;
    height: 380px;
}
.jcarousel-next, .jcarousel-prev { z-index: 3; display: none; }

#signup #spinner { position: absolute; }
#signup #spinner img { position: relative; right: 25px; top: 7px; }
#shop_submit { font-size: 13px; }

/* =========== */
/* = Thank You */
/* =========== */

#contest-desc { background: url('../images/icons/contest.gif') top left no-repeat; color: #49687A;height: 64px; line-height:26px; padding-left:68px; padding-top:6px; }

/* =========== */
/* = Contact = */
/* =========== */

form#standard-form { width:555px; margin-bottom:25px; }
form#standard-form input[type="text"] { width:350px;}
form#standard-form textarea { width: 340px; }
form#standard-form input[type="image"] {  }

ul#social-media-icons {}
ul#social-media-icons li { float:left; list-style-type:none; background:url('../images/icons/socialmedia-sd.png'); width:113px; padding:0 0px 0 24px;height:15px; margin:8px 0 0px 0;  padding-top:1px; padding-bottom:4px;}
ul#social-media-icons li.facebook {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -27px}
ul#social-media-icons li.facebook:hover {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px 0px;}
ul#social-media-icons li.flickr {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -74px }
ul#social-media-icons li.flickr:hover {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -51px;}
ul#social-media-icons li.email {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -214px;}
ul#social-media-icons li.email:hover {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -191px}
ul#social-media-icons li.twitter {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -168px;}
ul#social-media-icons li.twitter:hover {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -145px}
ul#social-media-icons li.vimeo {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -122px;}
ul#social-media-icons li.vimeo:hover {background:url('../images/icons/socialmedia-sd.png') no-repeat 0px -98px}

.sidebar-form {background:#efefef; border:1px solid #d9d9d9; padding:10px 10px 12px 10px; margin:10px 0 25px;-moz-border-radius: 5px; -webkit-border-radius: 5px;}/*support redirect on contact.html*/
.sidebar-form p { margin-bottom:5px;}
.sidebar-form label {font-size:12px; margin-left:4px; display:inline; line-height:23px;}
.sidebar-form input[type="image"] {display:block; margin: 3px 3px 0px 0px; clear:both; float:left; }
.sidebar-form input[type="text"] {width:120px; padding:1px;float:left; margin: 0 5px 10px 0px;} 

.contactsales {  padding:0px 0 0 0; }

/* ================= */
/* = Landing Pages = */
/* ================= */
.highlight-background { background:#f0f0aa; }

/* old form on boagworld */
/*.miniform { background:green url('../images/background/bg-miniform.jpg'); -moz-box-shadow: 0px 0px 11px #000; 
-webkit-box-shadow: 0px 0px 11px #000; margin:0 0 25px 0;  }
.miniform h3 { color:#FFF; font-size:30px; text-align:center;  margin:15px 0 0 0;}
.miniform p { color: #FFF; }
.miniform p.subheading { margin:0 0 15px 0; text-align:center;}
.miniform .example { color: #ababab; font-size:11.5px;}
.miniform p.note  { margin:-7px 0 5px 0; padding:0;}
.miniform p.note a { text-transform: uppercase; font-size: 11px; }*/

.icon-list  { padding:0;margin:10px 0 18px 0;vertical-align:bottom;}
.icon-list li  {background:none; padding:0; margin:0 0 25px 0; }
.icon-list img {padding:0 13px 0px 0; float:left;}
.icon-list strong { color:#000; }
.icon-list .lastlink { margin: -10px 0 25px; padding:5px 0 0 0; border-top: 1px solid #d9d9d9; display:inline;}

form#miniform  {background:transparent ; border:0px; margin:40px 0 0 0;}
form#miniform label { color:#cacaca; font-weight:normal; font-size:13px; margin:0 0 7px 0;}
form#miniform input[type="text"] { width:100%; padding:2px 1px; margin:0 0 17px 0; }
form#miniform input[type="image"] { margin-top:10px;}

/* ========== */
/* = FAQ = */
/* ========== */
.paymentprocessors ul li  { width:245px; margin-right:20px; float:left; }


/* ======= */
/* = 404 = */
/* ======= */
.missingpage {  width:535px; margin:auto; margin-top:50px; }
.missingpage ul { width: 125px; float:left; margin-right:25px; padding:0; }
.missingpage ul li { background:0; padding:0;}
.missingpage .last { width:85px; }
.missingpage .super { vertical-align:super; font-size:14px; color:#aaa; margin-left: 5px; }
.missingpage .note { font-size:12px; color:#787878; margin-top:-10px; }

/* ======= */
/* = Unsupported Browser = */
/* ======= */
ul.alternative-browsers { margin: 0 0 15px 0; padding:0; }
ul.alternative-browsers li { margin:0 0 7px 0; padding:0 0 7px 0;border-bottom:1px solid #ececec; background:none; list-style-type:none; vertical-align:middle; }
ul.alternative-browsers li a img { vertical-align:middle; margin-right:10px;}

/* ============ */
/* = Congrats = */
/* ============ */
.storeinfo { padding:0px 25px 20px 25px; text-align:left; }
.storeinfo h3 { font-size: 18px; margin:25px 0 12px 0; padding:0; font-weight:normal; }
.storeinfo span.subheader { font-size: 13px; color: #a88c2f; }
.storeinfo a { font-size: 19px;  margin:0; padding:0;}
.storeinfo .bookmark { background:url('../images/icons/bookmark11-yellow.png') no-repeat left ; padding-left:14px; text-decoration:underline; font-size:11.5px;}

ul.nextsteps { margin:20px 0 0 0; padding:0; }
ul.nextsteps li { margin:0; padding:0; background:none; vertical-align:middle; margin-bottom:15px; }
ul.nextsteps li img { vertical-align:middle; margin:-4px 6px 0 0 ; }


/* ============== */
/* = Interviews = */
/* ============== */
#interview h3 { color:#1E5171; margin:35px 0 8px; }
#interview .shopify h3 { color:#6F8726; }
#interview p { color:#607178; }
#interview .shopify p { color:#91AD3C; }


/* ============ */
/* = About Us = */
/* ============ */
.portrait { background: #d2d2d2 url(../images/background/bg-grey.gif) repeat-x scroll left top; border:1px solid #CCCCCC; float:left; margin-right:20px; width:147px; }
.portrait img { border:1px solid #FFFFFF; height:188px; padding:10px; width:125px; }
.person-desc { width: 420px; margin-right: 20px; }
.person-desc .title { color: #999; font-weight: normal; }
#team li { list-style-type: none; margin: 30px 0; background: none; float: left; }

/* ========= */
/* = login = */
/* ========= */
.loginarea { width:765px; margin:auto;}
.loginarea .secondcol { border-left :1px solid #d9d9d9; width: 320px; padding:0px 0 0 35px; margin:40px 0 0 0;}

.loginarea form { margin: 40px 0 20px 0; }
.loginarea label { clear:both; }


.loginarea input[type="text"] {display:inline; vertical-align:middle; margin:0;}
.loginarea span.formnote { color:#434343; margin-left:9px; padding:0; display:inline; }
.loginarea input[type="text"].formnote, .loginarea input[type="password"].formnote { width:55%;   }
.loginarea input[type="image"] { display:block; clear:both;}

/* ========== */
/* = Contest = */
/* ========== */

#contest-top { background: url('../images/other/contest-laptop.jpg') top right no-repeat; }
#contest-rules { position: relative; top: 100px; left: 85px; width: 400px }
#contest-rules h3 { color: #113a5a; }
#contest-rules h3 a { color: #02181d; font-weight: bold; }
#contest-rules p { margin: 0 0 20px; font-size: 14px; line-height: 20px; color: #fff; }

#rankings { width: 100%; }
#rankings * { vertical-align: middle; }
#rankings td { padding: 7px 3px 7px 5px; cursor: pointer; }
#rankings td.position { font-size: 28px; color: #a8a8a8; font-weight: bold; font-family: Times, 'Times New Roman', Serif } 
#rankings tr:hover td { background: #f2f2f2; }
#nominate { background: url('../images/background/bg-nominate-form.png') top left no-repeat; height: 283px; width: 310px; padding: 20px; position: relative; top: 50px }
#nominate h3 { color: #178eb9; font-size: 18px; }
#nominate dt { font-size: 12px; font-weight: bold; }
#nominate form { background: none; border: none; margin: 0; }
#nominate form label { font-size: 11px; }

#vote-link { width: 197px; height: 34px; background: url('../images/buttons/btn-vote.gif') top left no-repeat; display: block; text-indent: -32000px; position: relative; bottom: 5px; }
#vote-link:hover { background-position: 0 -34px; }

#contest-link { width: 181px; height: 34px; background: url('../images/buttons/btn-contest.gif') top left no-repeat; display: block; text-indent: -32000px; position: relative; bottom: 5px; margin-left: 20px;}
#contest-link:hover { background-position: 0 -34px; }

#contest-links { position: relative; bottom: 5px; }

/* ============ */
/* = Lightbox = */
/* ============ */
/* Using the awesome lightbox by colorpowered.com */

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%; background:#000!important;opacity:0.5!important;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

#cboxOverlay{background:#fff;}

#colorBox{}
#cboxTopLeft{width:25px; height:25px; background:url(../images/lightbox/border1.png) 0 0 no-repeat;}
#cboxTopCenter{height:25px; background:url(../images/lightbox/border1.png) 0 -50px repeat-x;}
#cboxTopRight{width:25px; height:25px; background:url(../images/lightbox/border1.png) -25px 0 no-repeat;}
#cboxBottomLeft{width:25px; height:25px; background:url(../images/lightbox/border1.png) 0 -25px no-repeat;}
#cboxBottomCenter{height:25px; background:url(../images/lightbox/border1.png) 0 -75px repeat-x;}
#cboxBottomRight{width:25px; height:25px; background:url(../images/lightbox/border1.png) -25px -25px no-repeat;}
#cboxMiddleLeft{width:25px; background:url(../images/lightbox/border2.png) 0 0 repeat-y;}
#cboxMiddleRight{width:25px; background:url(../images/lightbox/border2.png) -25px 0 repeat-y;}
#cboxContent{background:#fff;}
#cboxLoadedContent{margin-bottom:0px;}
#cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
#cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
#cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
#cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
#cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
#cboxLoadingOverlay{background:url(../images/lightbox/loading.gif) center center no-repeat #fff;}
#cboxClose{position:absolute; top:-28px; right:-32px; display:block; color:#444; text-indent:-999999px; background:url(../images/lightbox/close.png) no-repeat; height:47px; width:44px; cursor:pointer;}
.single {} /* empty class for lightbox */


            


