/*

TABLE OF CONTENTS

- Browser reset
- Button Controls

*/

@import url("reset.css"); 

/* For poorly rendered light-on-dark text on OSX with default text rendering settings */
.textfix{
	-webkit-text-stroke:1px transparent; /*fixes it for safari*/
	opacity: 0.9999; /*improves it a little bit for FF */
}
@media only screen and (max-device-width:480px) {.textfix{-webkit-text-stroke:0 black;}} 



/**************** Button Controls ****************/

a.button {
    background: transparent url('../images/background-button-a.png') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font-size: 12px;
    height: 33px;
    margin-right: 6px;
    padding-right: 10px;
    text-decoration: none;
}

a.button span {
    background: transparent url('../images/background-button-span.png') no-repeat;
    display: block;
    line-height: 24px;
    padding: 5px 5px 5px 18px;
}

a.button:active {
    background-position: bottom right;
    color: #000;
    outline: none;
}

a.button:active span {
    background-position: bottom left;
    padding: 5px 5px 4px 18px;
}

a.add-button {
    background: transparent url('../images/background-addbutton-a.png') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font-size: 14px;
    height: 41px;
    margin-right: 6px;
    padding-right: 10px;
    text-decoration: none;
}

a.add-button span {
    background: transparent url('../images/background-addbutton-span.png') no-repeat;
    display: block;
    line-height: 33px;
    padding: 5px 5px 5px 38px;
    height: 41px;
}

a.delete-button {
    background: transparent url('../images/background-delete-a.png') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font-size: 14px;
    height: 41px;
    margin-right: 6px;
    padding-right: 10px;
    text-decoration: none;
}

a.delete-button span {
    background: transparent url('../images/background-delete-span.png') no-repeat;
    display: block;
    line-height: 33px;
    padding: 5px 5px 5px 38px;
    height: 41px;
}


body {
	background: #E7E7E7 url(../images/background-header.png) repeat-x;
	font-size: 12px;
	font-family: "Helvetica", "Arial", sans-serif;
}

body a {
	color: #2677CF;
	text-decoration: none;
}

body a:hover {
	text-decoration: underline;
}


h1, h2, h3, h4, h5 {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.clear {
	clear: both;
}

#userribbon {
	width: 990px;
	height: 20px;
	margin: 0 auto;
	position: relative;
	display: block;
	top: 10px;
	right: 5px;
	color: white;
	text-align: right;
	}

#userribbon a {
	color: white;
	}

#userribbon a:visited {
	color: white;
	}

#header {
	width: 990px;
	height: 80px;
	margin: 0 auto;
	position: relative;
	display: block;
}

#body-index #header h1 a {
	cursor: default;
}

#body-index #header h1 a:hover {
	width: 145px;
}

#header h1 a {
	width: 209px;
	height: 36px;
	background: url(../images/background-ballpark-logo.png) no-repeat left top;
	position: absolute;
	text-indent: -9999px;
	top: 51px;
	left: 15px;
}

ul#navigation {
	position: absolute;
	top: 50px;
	right: 5px;	
}

ul#navigation li {
	float: left;
}

#main-content {
}

#main-content .wrap {
	width: 960px;
	margin: 0 auto;
	padding-top: 30px;
	padding-bottom: 5px;
}

#main-content #left-wrap {
	width: 635px;
	float: left;
	background-color: white;
	padding: 20px;
	border: #ccc 1px solid;
}

#main-content #sidebar {
	float: right;
	width: 350px;
	position: relative;
	right: -6px;
}

#ZoomCaption{
	-webkit-text-stroke:1px transparent;
}
@media only screen and (max-device-width:480px) {#ZoomCaption{-webkit-text-stroke:0 black;}}

#left-wrap h3, #quotes h3 {
	font-size: 15px;
	line-height: 32px;
	color: #0350a6;
	text-shadow: #fff 0 1px 0;
	font-weight: bold;
	margin-bottom: 0px;
	font-family: "Helvetica Neue (TT)", "HelveticaNeue", Helvetica, Arial, sans-serif;
}

#left-wrap h1 {
	font-size: 180%;
	text-shadow: #000 0 1px 0;
	background-image: url('../images/background-h1.png');
	padding: 10px;
	color: white;
	margin-bottom: 10px;
	}

#left-wrap p {
	font-size: 14px;
	color: #011934;
	line-height: 20px;
	margin-bottom: 15px;
	text-shadow: #fff 0 1px 0;
	font-family: "HelveticaNeue", Helvetica, Arial, sans-serif;
}

#left-wrap #main-blurb p {
	font-size: 13px;
	margin-top: 0;
	margin-bottom: 0px;
	text-shadow: #fff 0 1px 0;
}

#left-wrap #left-column {
	width: 285px;
	float: left;
	padding-right: 5px;
}

#left-wrap #right-column {
	width: 285px;
	float: right;
	padding-right: 5px;
}

#sidebar #quote {
	width: 294px;
	background: url(../images/background-quote.png) no-repeat left top;
	padding-right: 20px;
	padding-left: 31px;
	padding-top: 12px;
}

#sidebar #quote p {
	font-size: 15px;
	color: #011933;
	line-height: 20px;
	text-shadow: #fff 0 1px 0;
	margin-bottom: 5px;
}

#sidebar #quote span {
	display: block;
	font-size: 15px;
	text-align: right;
	color: #032c5a;
	text-shadow: #fff 0 1px 0;
}

#sidebar #quote span strong {
	font-weight: bold;
}

#sidebar #quote span em {
	font-style: italic;
	color: #034186;
}

#sidebar #quote-bottom {
	width: 345px;
	height: 16px;
	background: url(../images/background-quote-bottom.png) no-repeat left bottom;
	position: relative;
	top: -1px;
}

#sidebar #features-list {
	width: 333px;
	background: url(../images/background-feature-list-header.png) no-repeat left top;
	padding-top: 29px;
	margin-left: 12px;
	margin-top: 10px;
}

#sidebar #features-list li {
	padding: 10px;
	border-bottom: 1px solid #b1b2b2;
	background: url(../images/background-feature-line.png) repeat-x top;
	border-left: 1px solid #929292;
	border-right: 1px solid #929292;
}

#sidebar #features-list li img {
	float: left;
}


#sidebar #features-list strong {
	color: #1f1e1e;
	font-weight: bold;
	font-size: 12px; 
	font-family: "Helvetica Neue (TT)", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
	text-shadow: #fff 0 1px 0;
}

#sidebar #features-list li .right {
	float: left;
	width: 260px;
	margin-left: 10px;
}

#sidebar #features-list li p {
	color: #313131;
	font-size: 10px; 
	font-family: "Lucida Grande";
	margin-top: 1px;
}

ul#features-list #sidebar-take-tour {
	text-indent: -9999px;
	display: block;
	background: transparent;
	background-image: none;
	padding: 0;
	border: none;
}

#sidebar a#take-tour{
	width: 333px;
	height: 39px;
	background: url(../images/background-feature-list-header-bottom.png) no-repeat left top;
	display: block;
	text-indent: -9999px;
	margin-left:12px;
}

#sidebar  a#take-tour:hover{
	background: url(../images/background-feature-list-header-bottom.png) no-repeat left bottom;
}



#bottom-sign-up {
	display: block;
	width: 586px;
	height: 81px;
	background: url(../images/background-sign-up-bar-bottom.png) no-repeat left top;
	margin: 0;
	position: relative;
	margin-top: 27px;
}

a#button-sign-up-bottom {
	width: 221px;
	height: 49px;
	display: block;
	text-indent: -9999px;
	background: url(../images/button-bottom-sign-up.png) no-repeat left bottom;
	position: absolute;
	top: 15px;
	left: 15px;
}

a:active#button-sign-up-bottom {
	background: url(../images/button-bottom-sign-up.png) no-repeat left top;
}

a#button-take-a-tour-bottom {
	position: absolute;
	left: 270px;
	top: 30px;
	height: 50px;
	background: url(../images/icon-tour-go-bottom.png) no-repeat right 4px;
	padding-right: 15px;
	text-decoration: none;
	font-size: 17px;
	color: #1e650a;
	font-weight: bold;
	text-shadow: #f0ffee 0 1px 0;
}

a:hover#button-take-a-tour-bottom {
	background: url(../images/icon-tour-go-bottom-hover.png) no-repeat right 4px;
}

a:hover#button-take-a-tour-bottom strong {
	text-decoration: none;
}

a#button-take-a-tour-bottom strong {
	color: #114700;
	font-weight: bold;
	text-decoration: underline;
}

/** PLANS PAGE **/

ul#plans {
	margin-top:30px;
}

ul#plans li{
	float:left;
	width:223px;
	margin-right:29px;
	display:block;
	height:367px;
	position:relative;
}

ul#plans li.last {
	margin-right:0;
}

ul#plans li#freelancer-plan{
		background: url("../images/image-marketing-plan-freelancer.png") bottom left no-repeat;
}

ul#plans li#studio-plan{
		background: url("../images/image-marketing-plan-studio.png") bottom left no-repeat;
}

ul#plans li#agency-plan{
		background: url("../images/image-marketing-plan-agency.png") bottom left no-repeat;
}

ul#plans li#corporate-plan{
		background: url("../images/image-marketing-plan-corporate.png") bottom left no-repeat;
}

ul#plans li a {
	background: url("../images/button-choose-a-plan.png") bottom left no-repeat;
	display:block;
	width:197px;
	height:37px;
	position:absolute;
	bottom:5px;
	left:15px;
	text-indent:-99999px;
}

ul#plans li a:active {
	background: url("../images/button-choose-a-plan.png") top left no-repeat;
}


#sign-up-bar.plans-page .wrap {
	width:990px;
	text-align:center;
	padding-top:22px;
	padding-bottom:17px !important;
}

#sign-up-bar.plans-page a{
	float:none;
	text-decoration:none;
	color:#003269;
	font-family:"Helvetica Neue (TT)","Helvetica Neue","Helvetica","Arial",sans-serif;
	font-size:18px;
	font-weight:bold;
	text-shadow:0 1px 0 #D7E8FE;
	padding:6px;
	padding-right:30px;
	background: url("../images/icon-marketing-free-plan-arrow.png") center right no-repeat;
}
#sign-up-bar.plans-page a strong{
	color:#02244a;
	font-weight:bold;
}


#sign-up-bar.plans-page a:hover{
	background-color: #d4e8fe;
	border: 1px solid #7ca5d4;
}	
	

ul#plan-questions li{
	width:460px;
	float:left;
	margin-bottom:25px;
	margin-right:30px;
}

ul#plan-questions li.right{
	margin-right:0px;
}

ul#plan-questions h3{
	color:#0350A6;
	font-family:"Helvetica Neue (TT)","Helvetica Neue","Helvetica","Arial",sans-serif;
	font-size:18px;
	font-weight:bold;
	margin-bottom:4px;
	text-shadow:0 1px 0 #F2FEFE;
}

ul#plan-questions li p{
	font-size:13px;
	line-height:1.4;
	color: #011934;
	text-shadow:0 1px 0 #E7F1FD;
}	

#quote {
	border-top: 1px solid #c4d3e6;
	border-bottom: 1px solid #c4d3e6;
	margin-top: 10px;
	padding-bottom: 15px;
}

#quote p {
	color: #1f3248;
	font-size: 17px;
	font-family: Georgia, Times, serif;
	font-style: italic;
	line-height: 24px;
	margin-right: 10px;
	margin-left: 10px;
}

#quote span {
	display: block;
	color: #024186;
	font-family: "HelveticaNeue-Light", "HelveticaNeue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	margin-right: 10px;
	text-align: right;
}

#quote span strong {
	color: #032c5a;
	font-weight: bold;
}



/* ############################ SIGN UP PAGE ############################ */

#signup-form{
	text-shadow: #fff 0 1px 1px;
	}


#signup-form label{
	font-size:13px;
	font-weight:bold;
	color:#29384c;
	width:165px;
	text-align:right;
	display:block;
	float:left;
	line-height:32px;	
	margin-right:10px;
}

#signup-form input[type=text],#signup-form input[type=password]{
	width:420px;
	height:20px;
	border: 1px solid #8d9095;
	border-radius:1px;
	-moz-border-radius:1px;
	-webkit-border-radius:1px;	
	background: #fff url(../images/background-signup-inputs.png) repeat-x top left;
	font-size:13px;
	color:#29384c;
	padding:5px;
	padding-top:7px
}

#signup-form select{
	font-size:13px;
	color:#29384c;
	margin-bottom:5px;
	margin-top:5px;	
}

#signup-form input#company_url{
	width:290px;
}

#signup-form ul.section{
	width:626px;
	border: 1px solid #c1cad5;
	border-top:1px solid #8f9aa7;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	background-color:#f1f7fe;
	margin-bottom:20px;
	float:left;
	

}

#signup-form h3{
	font-family: "Helvetica Neue", helvetica, Arial, sans-serif;
	font-weight:bold;
	font-size:18px;
	color:#0350a6;
	margin-left:82px;
	margin-top:6px;
}

#signup-form h4{
	font-family: "Helvetica Neue", helvetica, Arial, sans-serif;
	font-size:11px;
	color:#011934;
	margin-left:82px;
}	
#signup-form ul.section li{
	background-color:#e3e9f2;
	border-top:1px solid #f3f6f9;
	border-bottom:1px solid #c1cad5;
	padding:8px;
	position:relative;
	zoom:1;
}

#signup-form ul.section li.header{
	border:0;
	border-bottom: 1px solid #c1cad5;
	height:52px;
	background-color:transparent;
	position:relative;
	padding:0;
	
}

#signup-form ul.section li.header span{
	position:absolute;
	display:block;
	width:59px;
	height:62px;
	top:-15px;
	left:15px;
}

#signup-form ul#company-info.section li.header span{
	background: url(../images/signup-icon-company.png) no-repeat top left;
}

#signup-form ul#user-info.section li.header span{
	background: url(../images/signup-icon-user.png) no-repeat top left;
}

#signup-form ul#payment-info.section li.header span{
	background: url(../images/signup-icon-payment.png) no-repeat top left;
}

#signup-form ul#confirm-details.section li.header span{
	background: url(../images/signup-icon-confirm.png) no-repeat top left;
}

#signup-form ul#payment-info.section li.header {
	padding-bottom:10px;
}


span.wrap{
	border:1px solid #f00;
	display:block;
}

#left-wrap .float-left {
	float: left;
}

#left-wrap .float-right {
	float: right;
}

#left-wrap p.float-left,
#left-wrap p.float-right {
	width: 425px;
	margin-top: 0;
}

#quotes {
	float: left;
	width: 247px;
	padding: 10px 10px 10px 0px;
	margin-bottom: 15px;
}

#quotes #container{
	padding-left: 25px;
}

#quotes p {
	padding-left: 25px;
	line-height: 1.3em;
}

#quotes h3 {
	margin-bottom: 5px;
	padding-left: 25px;
}

#quotes ul {
	padding-bottom: 15px;
}

#quotes li {
	width: 100%;
	margin-bottom: 5px;
	font-size: 12px;
	text-shadow: #e8f2fe 0 1px 0;
	clear: both;
}

#quotes li.current {
	background-image: url('../images/background-sidebar-page.png');
	color: #fff;
	text-decoration: none;
	text-shadow: none;
}

#quotes li.current a {
	color: #fff;
	text-decoration: none;
	text-shadow: none;
}

#quotes li a {
	display: block;
	padding-left: 25px;
	padding-top: 8px;
	padding-bottom: 8px;
}

#quotes li a:hover {
	background-color: #585858;
	color: #fff;
	text-shadow: none;
	text-decoration: none;
}

#quotes #quotes-bottom {
	width: 373px;
	height: 15px;
	position: absolute;
	left: 0px;
	padding-left: 25px;
}

input#text-field {
	width: 150px;
	height: 16px;
	position: relative;
	margin-right: 5px;
	float:left;
}


#mytable {
	width: 100%;
	padding: 0;
	margin: 0;
	border: 1px solid #ccc;
}

#toptrendstable {
	width: 100%;
	padding: 0;
	margin: 0;
	border: 1px solid #ccc;
}

th {
	font-weight: bold; 
	font-size: 11px;
	color: #1a1a1a;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	text-align: left;
	padding: 6px 6px 4px 12px;
	background-image: url('../images/background-input-button.png');
}

#toptrendstable td {
	font-size: 1.5em;
	line-height: 1.5em;
	background: #fff;
	padding: 6px 6px 6px 12px;
}

td {
	background: #fff;
	padding: 6px 6px 6px 12px;
}


#toptrendstable td.alt {
	background: #F5FAFA;
	line-height: 1.5em;
}

#toptrendstable td.alt1 {
	background: #F5FAFA;
	line-height: 1.5em;
}

td.alt {
	background: #F5FAFA;
}


td.header {
	font-size: 18px;
	font-weight: bold;
	background-image: url('../images/background-input-button.png');
	text-shadow: #fff 0 1px 0;
}

td.footer {
	font-weight: bold; 
	font-size: 14px;
	border-top: 1px solid #ccc;
	padding: 6px 6px 8px 12px;
	background-image: url('../images/background-input-button.png');
	border-top: #ccc;
}



#calendar {
	padding: 0;
	margin: 0;
	width: 100%;
	border: 1px solid #ccc;
	text-align: center;
}

#calendar.th {
	font-size: 12px;
	font-weight: bold;
	color: #1a1a1a;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	text-align: left;
	padding: 6px 6px 4px 12px;
}

#calendar.td {
	background: #fff;
	padding: 6px 6px 6px 12px;
	text-align: center;
}



div.pagination {
	padding: 3px;
	margin: 3px;
	text-align:center;
	font-family:Tahoma,Helvetica,sans-serif;
	font-size:.85em;
}
	
div.pagination a {
	border: 1px solid #ccdbe4;
	margin-right:3px;
	padding:2px 8px;
	background-position:bottom;
	text-decoration: none;
	color: #0061de;		
	}

div.pagination a:hover, div.pagination a:active {
	border: 1px solid #2b55af;
	background-image:none;
	background-color:#3666d4;
	color: #fff;
}

div.pagination span.current {
	margin-right:3px;
	padding:2px 6px;
	font-weight: bold;
	color: #000;
}

div.pagination span.ellipses {
	margin-right:3px;
	padding:2px 6px;
	color: #000;
}
	
div.pagination span.disabled {
	display:none;
}

div.pagination a.next{
	border:2px solid #ccdbe4;
	margin:0 0 0 10px;
}

div.pagination a.next:hover{
	border:2px solid #2b55af;
}
	
div.pagination a.prev{
	border:2px solid #ccdbe4;
	margin:0 10px 0 0;
}
	
div.pagination a.prev:hover{
	border:2px solid #2b55af;
}







.footer{
	width: 955px;
	margin: 0 auto;
	padding-bottom:20px;
	margin-top: 5px;
	color: #303030;
	font-size: 11px;
	font-family: "HelveticaNeau", Helvetica, Arial, sans-serif;
	position: relative;
}

.footer div {
	color: #154477;
	display: inline;
	font-weight: bold;
}

.footer div a {
	color: #2677CF;
	font-weight: bold;
}

.footer div span {
	font-family: Georgia, Times, serif;
	font-style: italic;
	font-weight: normal;
}

.footer a, .footer a:visited{
	color:#2677CF;
	text-decoration:none;
}

.footer a:hover{
	text-decoration:underline;
}

.legal{
	font-size:14px;
	line-height:22px;
	color:#011934;
font-family:"HelveticaNeue",Helvetica,Arial,sans-serif;
}

.legal h1{
	font-size:20px;
	font-weight:bold;
}

.legal h2{
	font-size:18px;
	font-weight:bold;
}

.legal h3{
	font-size:16px;
	font-weight:bold;
}
.legal p{
	margin-bottom:0.5em;
}
.legal ul li {
	margin:0.5em;
	margin-left:2em;
	list-style-type:disc;
	}
	
.legal ol li {
	margin:0.5em;
	margin-left:2em;
	list-style-type:decimal;
	}	


.info, .success, .warning, .error {
border: 1px solid;
margin: 10px 0px;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 13px center;
}

.info {
color: #00529B;
background-color: #BDE5F8;
background-image: url('../images/icons/information.png');
}

.success {
color: #4F8A10;
background-color: #DFF2BF;
background-image:url('../images/icons/accept.png');
}

.warning {
color: #9F6000;
background-color: #FEEFB3;
background-image: url('../images/icons/error.png');
}

.error {
color: #D8000C;
background-color: #FFBABA;
background-image: url('../images/icons/delete.png');
}

.user-signup {
	border: 1px solid #ccc;
	width: 100%;
}

.add-lead {
	width: 605px;
	border-bottom: 1px solid #ccc;
	padding: 15px;
}

label.left {
	width: 130px;
	display: block;
	float: left;
	font-weight: bold;
	font-size: 12px;
	text-align: right;
	padding-right: 15px;
}

label .small-grey {
	font-size: 10px;
	color: darkgray;
}

.user-signup .field-text {
	font-size: 18px;
	width: 400px;
	height: 30px;
}

#box {
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	width: 100%;
	margin: 0 auto;
}

#user-upload {
	width: 605px;
	border-bottom: 1px solid #ccc;
	padding: 15px;
	min-height: 20px;
	overflow: hidden;
}

#user-upload #left {
	width: 130px;
	font-weight: bold;
	font-size: 14px;
	margin-right:12px;
	float:left;
}

#user-upload #content {
	overflow: hidden;
}

#user-upload img {
	padding: 5px;
	margin: 3px;
	border: 1px solid #ccc;
}

#user-upload a img:hover {
	border: 1px solid #000;
}

#adspace {
float: left;
width: 345px;
}