/***

   :: Theme Development: Scribble Tone
   :: Last modified 01/19/09

	Font Palette
	***************************************
	

	Color Palette
	***************************************
	

***/

/* CSS reset courtesy of meyerweb.com */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	border-style: none;
	line-height: 0.00;
	background-image: url(../images/shadow.png);
	background-repeat: repeat-y;
	background-position:center;
	background-color: rgb(211, 230, 237);
	color: #666666;
	
}
ul {
	list-style: none;
}


ol{
	list-style-position: inside;
	list-style-type: decimal;
}

#how-it-works ol li div { font-family: Georgia, serif; font-size: 10px; line-height: 14px; margin-bottom: 10px;margin-bottom: 20px;}


blockquote, q {
	quotes: none;
}


/* Typography ----------------------------------------------------------------- */
body {font-size: 62.5%; line-height: 1.4em;}
h1{font-family: Georgia, serif; font-size: 3.8em; line-height: 1.2em; color: #b3b3b3; font-style: normal; font-weight: normal; margin-bottom: 40px;}
h2{font-family: Georgia, serif; font-size: 1.6em; line-height: 1.4em; font-weight: bold; margin-bottom: 5px;}
h3{font-family:Georgia, serif; font-size: 2.6em; line-height: 1.2em; font-weight: normal; margin-bottom: 10px;color: #666666;}
h4{line-height: 1.4em; font-family: Georgia, serif; font-size: 1.5em; font-weight: normal;}
h5{font-family: Georgia, serif; font-size: 1.6em; line-height: 1.5em; font-weight: normal; margin-bottom: 10px;}




p{font-family: Verdana, Arial, sans-serif; margin-bottom: 10px; font-size: 1.3em; line-height: 1.6em;}


#nav a, #join a{ text-decoration: none; padding-bottom: 1px; color: #666666; }
#nav a:hover,#nav a:hover.signup, a:hover, #join a:hover{ border-style: none; color: #303030; padding-bottom: 1px; border-bottom-width: 1px; }
a{ text-decoration: none; padding-bottom: 1px; color: #f25d40;; }

 .onecol p, .onecol-left p{ font-family: Verdana, Arial, sans-serif; font-size: 1.2em; line-height: 1.4em;}
#footer p{ font-size: 1.2em;}
#footer a{ font-style: normal; font-weight: normal; color: #0080ff; text-decoration: underline;}
#footer a:hover{text-decoration: none;}





}


#homepage-buttons 
{  
background-image:url(../images/button.png);  
width: 162px;
height: 36.667px;

}  

#homepage-buttons li
{  
float: left;
} 

#homepage-buttons li a {
position: relative;
display: block;
height: 38px;
background: url(../images/button.png) no-repeat;
text-indent: 36px;
line-height: 2.7em;
font-family: Verdana, Arial, sans-serif;
font-size: 13.5px;
color: #ffffff;
}


li a#preview
{  
position: relative;
width: 162px;
background-position: 0 0;
} 

li a:hover#preview
{  
background-position: 0 -40px;
} 










#try-now{margin: 32px 0px;}








/* unique homepage typography----------------------------------------------------------------- */

.homepage-buttons{position: relative; float: left; margin: 20px 7px 0px 0px;}
#banner h4{ font-family: Verdana, Arial, sans-serif; font-size: 1.3em; line-height: 1.4em; color: #666666; margin-bottom: 15px; }



#newsletter .gray-box{ padding-left: 10px; padding-bottom: 5px; padding-right: 0px; padding-top: 10px; background-color: #E6E6E6; margin-left: -10px;
border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;

  }
#newsletter .cleardefault, select
{
  font-family: Verdana, Arial, sans-serif;
  width: 165px;
  margin-left: 0px;
  border: 1px solid #ffffff;
  padding: 3px;
  background: white;
    font-size: 12px;
    color: #999999;
    border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	margin-bottom: 5px;
}







#nav a.signup{font-weight: bold; color: #f25d40;}

#linkedin{background: url("../images/linkedin-big.png") no-repeat scroll 0 0 transparent}
#linkedin {width: 185px; left:-20px; position: relative;
		margin: 0px 0px 0px 0px; padding-left: 40px;}


.idea{width: 40px;position: relative; left: -48px;top: -65px; margin-bottom: -50px}
#join {margin-top: 10px;position: relative;text-indent: -10px;}
#join img{position: relative; top:2px;width: 14px;margin-right: 5px;}



	
		


/* nav----------------------------------------------------------------- */

#nav ul,
ol {margin-bottom: 18px;}
#nav li {margin-left: 20px;float: left; position: relative;}
#nav { font-style: normal; border-width: 0px; border-style: none; font-family: Verdana, Arial, sans-serif; font-weight: normal; margin-right: 5px; position: relative; bottom: -23px; font-size: 12px; text-align: right; float: right; }
#nav a{ color: #66666; text-decoration: none; }

#nav a:hover{ color: #ccccc; border-left-style: none; border-bottom-style: none; border-right-style: none; border-top-style: none; }
#buy-now{color: #303030; font-weight: bold;}




/* Website page ----------------------------------------------------------------- */


.website-links{ font-family: Verdana, Arial, sans-serif; clear: both; font-weight: bold;}
.websiteimg{width: 420px; }

.wrapper-website{ padding-top: 32px;padding-bottom: 32px; border-top-width: 1px; border-top-color: #cccccc; border-left-style: none; border-bottom-style: none; border-right-style: none; border-top-style: solid; }

.wrapper-website-last{ padding-bottom: 0px; }





/* Layout ----------------------------------------------------------------- */

.wrapper{ padding-left: 36px; padding-bottom: 0px; padding-right: 36px; padding-top: 20px; height: 100%; background-color: white; margin: auto; width: 888px;}

#firstcol{margin: 0px 20px 0px 0px;}

.onecol{float: left;
		width: 185px;
		margin: 0px 20px 20px 20px;}
		
.onecol-left{float: left;
		width: 185px;
		margin: 0px 0px 0px 20px;}		
		
		
.twocol{float: left;
		width: 420px;
		margin: 0px 20px 0px 0px;}

.twocol-left{float: left;
		width: 420px;
		margin: 0px 0px 0px 20px;}




.fourcol{ float: left; width: 100%; }

.noleftmargin{margin-left: 0;}

.beigebox{ z-index: 1; position: relative; background-color: #eeeeee; border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: solid; border-width: 1px; border-color: #D3D3D3; padding: 32px 28px 32px 28px;}
/* Homepage Layout ----------------------------------------------------------------- */


#banner{padding-left: 0px; padding-bottom: 20px; padding-right: 0px; padding-top: 20px;  height: 297px; position: relative; margin-bottom: 30px; }

#beigebox-homepage{border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px; width: 736px; }
#banner .topcontainertext{ color: gray; width: 302px; }
#computer {z-index: 999; position:absolute; top: -5px; right: 0px; background: transparent;}
#header { margin-bottom: 50px; }






/* Pricing-faqs Layout ----------------------------------------------------------------- */

#pricing-faqs p{margin-bottom: 30px;}


#boxes{margin-bottom: 20px;}
#help-box{margin-left: 0px; margin-bottom: 42px; margin-right: 0px; margin-top: 22px; text-align: center;}

#usd{font-size: 15px;letter-spacing: .1em;}


.bigtext{float: left; width: 660px;}
.clearit{clear: both;}
.line{background-repeat: repeat-y; height: 100px; float: left; background-color: #ccceee;
	width: 1px;	}
#footer{ padding-bottom: 10px; }


#logoimg{ position: relative; float: left; margin: 10px 0px;}
#bground { background-repeat: repeat-y; background-color: rgb(211, 230, 237);}
#prices{ border-style: solid; border-color: #cccccc; border-left-width: 0px; border-bottom-width: 1px; border-right-width: 0px; border-top-width: 1px; padding: 10px 0px;}

#prices img, #prices-bottom img{vertical-align: middle; margin: 0px 10px 0px 0px;padding: 0; position: relative; top: -1px; width: auto;}

#prices-bottom{ border-style: solid; border-color: #cccccc; border-left-width: 0px; border-bottom-width: 1px; border-right-width: 0px; border-top-width: 0px; padding: 0px 0px 10px 0px;}

#promo{margin-bottom: 10px; padding-right: 20px; padding-left: 20px; padding-bottom: 10px; padding-top: 0px; text-align: center; font-family: Arial, sans-serif; width: 207px; background-color: #c4d8d9;vertical-align:middle; }


#feedback{margin-bottom: 20px; padding-right: 20px; padding-left: 20px; padding-bottom: 15px; padding-top: 20px; text-align: center; font-family: Arial, sans-serif; width: 207px; background-color: #c4d8d9;vertical-align:middle; }

#feedback h1, #promo h1{ font-family: Georgia, "Times New Roman", Times, serif; margin-bottom: 10px; line-height: 1.2em; font-size: 20px; color: #31464D;text-align: left;}

#feedback p, #promo p{ line-height: 1.4em; font-size: 1.3em; font-family: Arial, sans-serif; color: #31464D;text-align: left;}

#promo img{ width: 165px; bottom: 17px; right: 56px; position: relative; }

#feedback img{ width: 22px; bottom:-2px; position: relative; margin-left: 3px;}


#prices-padding{margin-bottom: 20px;}
img.features{width: 20px; position: relative; top:2px; margin-right: 7px;}


h2#membership{background: url("../images/icon-membership.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#cms{background: url("../images/icon-cms.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#support{background: url("../images/icon-help.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#tips{background: url("../images/icon-lightbulb.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#hosting{background: url("../images/icon-cms.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#analytics{background: url("../images/icon-graph.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}
h2#hosting{background: url("../images/icon-hosting.gif") no-repeat scroll 0 0 transparent; padding-left: 30px;}






/* how-it-works Layout ----------------------------------------------------------------- */

img.numbers{ margin: 0px 5px 0px 0px;}
p.tiny-steps{ font-weight: bold; letter-spacing: 0.05em; text-transform: uppercase; font-family: Verdana, sans-serif; font-size: 11px;color: #F25D40;margin-bottom: 10px;}


/* Forms ----------------------------------------------------------------- */

.form-margin {margin-top:2px;}
input.cleardefault {color: #999999; float:left; margin:0px 5px 0px 0px; padding:7px 9px; width:160px; font-size:1.2em; line-height:1.3em; border:solid 1px #CCCCCC; }
/* Website Color Boxes ----------------------------------------------------------------- */


#color-box-a{ margin-right: 10px; float: left; width: 15px; padding: 5px; background-color: #585858; }
#color-box-b{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #f94d4d; }
#color-box-c{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #B4CDCD; }
#color-box-d{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #E0EEEE; }

#color-box-e{ border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: solid; border-color: #b3b3b3; border-width: 1px; margin-right: 10px; float: left; width: 15px; padding: 5px; background-color: #F6F5F1; }
#color-box-f{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #E3652D; }
#color-box-g{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #807873; }
#color-box-h{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #373431; }

#color-box-i{ margin-right: 10px; float: left; width: 15px; padding: 5px; background-color: #4c4c4c; }
#color-box-j{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #E0E0E0; }
#color-box-k{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #8e8e8e; }
#color-box-l{ float: left; width: 15px; padding: 5px; margin-right: 10px; background-color: #414345; }

.color-box{margin-bottom: 45px;}