﻿/*------------------------------------------------------------------------------------------------------*/
/*
Styling
	Basic Elements
	Generic Classes
	Expandable Text Button
	Checkout Progress Indicator
	Netsigns Shared Page-Specific Styling
		Order Items Table View (Checkout2, Order Summary pages)
		Order Summary
		Trademark, Privacy, Terms pages
	Page-Specific Styling
		Template Categories
			Stickesr for My Band template cateogry feature
		Pricing
		Uploading
		Default	
			Header
				Car, Background
					Bumper Sticker (random design on each visit)
					Call to Action
				Icons w/ Bullet Points
			Sticker Niche Boxes & Ad Boxes
				3 Sticker Niche Boxes
				Ad Boxes (not in use)
			Call to Action - secondary
			Long Description - paragraph for SEO
			Social Links


Structure
	suppGraphic
	pageInst
	contentMain

Print Styles (may also override some structure styling, so it should come last)
	pageInst
*/
/*------------------------------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------------------------------*/
/* STYLING */
/*------------------------------------------------------------------------------------------------------*/


/* Basic Elements */
/*---------------------------------------------------*/
	h5 {margin:.8em 0em 0 0em;}
	p {margin:.2em 0em .8em 0em;}


/* Generic Classes */
/*---------------------------------------------------*/
	.affiliateColor {color:#990000;}
	.affiliateBGColor {background-color:#990000;}
	
	
/* EXPANDABLE TEXT BUTTON - using <a> & <span> tags */
/*---------------------------------------------------*/
	/* HTML: <div class="buttonwrapper"><a href="#" class="button" title=""><span>Button Text</span></a></div> */
	a.button
	{
		background:transparent url('images/btnLeft.jpg') no-repeat top left;
	}
	a.button span
	{
		background:transparent url('images/btnRight.jpg') no-repeat top right;
	}
	/* Hover state CSS */
	a.button:hover span 
	{
		color:#fff;
	}
	
	
/* Checkout Progress Indicator */
/*---------------------------------------------------*/
	#progressIndicator table.graphic td div.current {background-image:url(images/progressIndicator_dot.gif);}



/* Netsigns Shared Page-Specific Styling */
/*---------------------------------------------------*/		
	
	/* table heading cells (used for: Customize, Cart) */
	#Customize th, #estShipCost th, #estShipDate th
	{
		color:#fff;
		background-color:#990000;
	}
			

	/* Order Items Table View (Checkout2, Order Summary pages) */	
	/*---------------------------------------------------*/
		#item, #quantity, #OrderItemsTableView #price 
		{
		}


	/* Order Summary */	
	/*---------------------------------------------------*/		
		#OrderSummary #item, #OrderSummary #quantity, #OrderSummary #OrderItemsTableView #price 
		{
		}
		
				
	/* Trademark, Privacy, Terms pages */
	/*---------------------------------------------------*/
		div#trademark h5, div#privacy h5 {color:#990000;}
		


/* Page-Specific Styling */
/*---------------------------------------------------*/

	/* Template Categories */	
	/*---------------------------------------------------*/
		table th h3
		{
			color:#F47A20; 
			border-bottom:solid 1px #ccc;
			padding-bottom:0;
			margin-bottom:0;
		}

		/* Stickesr for My Band template cateogry feature */
			.BandStickers_category a.logo
			{
				display:block;
				height: 62px;
				margin:5px 0;
				background:url('images/SFMB_logoWithBG.jpg') no-repeat;
			}
			.BandStickers_category a.logo:hover
			{
				display:block;
				height: 62px;
				margin:5px 0;
				background:url('images/SFMB_logoWithBG_hover.jpg') no-repeat;
			}
			.BandStickers_category a
			{
				color:#333;
				/*font-weight:normal;*/
				text-decoration:none;	
			}
			.BandStickers_category a:hover
			{
				color:#990000;
				text-decoration:underline;	
			}
			
			
	/* Pricing */	
	/*---------------------------------------------------*/
		table.pricing
		{
			float:left; 
			margin:0 10px 10px 0;
			border-collapse:separate; 
			/*border:solid 1px #000; */
			background-color:#DBDBDB; 
			text-align:left;
		}
		table.pricing th
		{
			padding:.6em;
			color:#fff; 
			background-color:#000; 
			font-weight:normal;
		}
		table.pricing th h5 {margin:0em 0em .2em 0em;}
		table.pricing tr.subhead
		{
			color:#fff; 
			background-color:#808080;
		}
		table.pricing tr.subhead td.price {vertical-align:bottom;}
			
			
	/* Uploading */	
	/*---------------------------------------------------*/
		div#uploading h3 {border-bottom:solid 1px #000; margin-bottom:.4em;}
		div.uploadingMenu img {margin-right:10px;}
		div.uploadingMenu a:link img.border {border:solid 1px #ccc;}
		div.uploadingMenu a:hover img.border {border:solid 1px #999;}
		div.uploadingMenu p {margin-top:0;}
		div.uploadingOptions a:link img.border {border:solid 1px #999;}
		div.uploadingOptions a:hover img.border {border:solid 1px #0000ff;}
			
			
	/* Default */	
	/*---------------------------------------------------*/
		div#StickersDefault .hr
		{
			border-bottom:1px solid #ccc;
		}
		
		/* Header */	
		/*---------------------------------------------------*/
				
			/* Car, Background */	
			/*---------------------------------------------------*/
				div#StickersDefault .container div#header_top #car
				{
					background:transparent url("images/homeHeader_top.jpg") no-repeat;
					height:384px;
				}
		
				/* Bumper Sticker (random design on each visit) */
				/*---------------------------------------------------*/
					div#StickersDefault .container div#header_top #sticker
					{
						height:40px;
						left:82px;
						position:absolute;
						top:260px;
						width:125px;
					}
		
				/* Call to Action */	
				/*---------------------------------------------------*/
					div#StickersDefault .container div#header_top #callToAction
					{
						left:365px;
						position:absolute;
						top:155px;
						width:300px;
					}
						div#StickersDefault .container div#header_top #callToAction a.buttonCSS3
						{
							font-size:13px;
							margin-bottom:20px;
							padding:1em 2.5em 1.05em;
							text-transform:uppercase;
						}
						div#StickersDefault .container div#header_top #callToAction a.buttonCSS3 span
						{
							color:#e7f2ce;
							font-family:Arial, Helvetica, Sans-Serif;
							font-size:1.3em;
							font-weight:bold;
							text-transform:uppercase;
						}
						div#StickersDefault .container div#header_top #callToAction p
						{
							font-size:12px;
							margin-left:23px;
						}
						div#StickersDefault .container div#header_top #callToAction p a
						{
							color:#333399;
						}
						div#StickersDefault .container div#header_top #callToAction p a:hover
						{
							color:#4175c4;
						}
				
			/* Icons w/ Bullet Points */	
			/*---------------------------------------------------*/
				div#StickersDefault .container div#header_bottom
				{
					background:transparent url("images/homeHeader_bottom.jpg") no-repeat;
					color:#204b98;
					height:80px; 
				}
					div#StickersDefault .container div#header_bottom .grid_3
					{
						padding-top:20px;
						padding-bottom:20px;
						width:142px;
					}
					div#StickersDefault .container div#header_bottom .grid_1
					{
						padding-left:10px;
					}
					div#StickersDefault .container div#header_bottom a
					{
						color:#204b98;
						text-decoration:none;
					}
					div#StickersDefault .container div#header_bottom a:hover
					{
						color:#4175c4;
						text-decoration:underline;
					}
					div#StickersDefault .container div#header_bottom small
					{
						font-weight:normal;
					}
					div#StickersDefault .container div#header_bottom .grid_1 a
					{
						display:block;
						height:80px;
						width:70px
					}
		
		/* Call to Action - secondary */	
		/*---------------------------------------------------*/
			div#StickersDefault .container div#callToAction_horiz, 
			div#StickersDefault .container div#callToAction2_horiz
			{
				border: solid 1px #c0c7b3;
				color:#474747;
				margin-top:30px;
				background: #e9ede1;
				background: -webkit-gradient(linear, left top, left bottom, from(#f6faed), to(#e9ede1));
				background: -moz-linear-gradient(top,  #f6faed,  #e9ede1);
				filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6faed', endColorstr='#e9ede1');
				-webkit-border-radius: .5em;
				-moz-border-radius: .5em;
				border-radius: .5em;
			}
			div#StickersDefault .container div#callToAction2_horiz h5
			{
				margin-top:0;
				padding:15px;
			}
			div#StickersDefault .container div#callToAction_horiz div h2,
			div#StickersDefault .container div#callToAction_horiz div h4,		
			div#StickersDefault .container div#callToAction_horiz div a.buttonCSS3,	
			div#StickersDefault .container div#callToAction2_horiz div a.buttonCSS3
			{
				margin:10px;
			}
			div#StickersDefault .container div#callToAction_horiz div a.buttonCSS3,
			div#StickersDefault .container div#callToAction2_horiz div a.buttonCSS3
			{
				padding:1em 2em;
			}
			div#StickersDefault .container div#callToAction_horiz div.alpha h2
			{
				margin:.8em 0 .6em 10px;
			}
			
		/* Sticker Niche Boxes & Ad Boxes */	
		/*---------------------------------------------------*/
			div#StickersDefault div.box h1, 
			div#StickersDefault div.box h2, 
			div#StickersDefault div.box h3, 
			div#StickersDefault div.box h4, 
			div#StickersDefault div.box h5, 
			div#StickersDefault div.box p,
			div#StickersDefault div.box ul
			{
				padding-left:10px;
			}
			div#StickersDefault div.box h3
			{
				color:#999;
				/*font-family: Trebuchet, Arial, Helvetica, Sans-Serif;*/
				font-size:18px;
				font-weight:bold;
				margin-top:1em;
			}
			
			/* 3 Sticker Niche Boxes */	
			/*---------------------------------------------------*/
				div#StickersDefault div#SFMB, 
				div#StickersDefault div#politicalStickers,
				div#StickersDefault div#showPride
				{					
					background-color:#fff;
					border:solid 1px #ccc;
					color:#666;
					height:361px;
					margin-top:30px;
					/* rounded corners for different browsers */
					-webkit-border-radius: 6px;
					-moz-border-radius: 6px;
					border-radius: 6px;
					/* box drop shadow for different browsers */
					-webkit-box-shadow: 0 1px 5px rgba(0,0,0,.1);
					-moz-box-shadow: 0 1px 5px rgba(0,0,0,.1);
					box-shadow: 0 1px 5px rgba(0,0,0,.1);
				}
				div#StickersDefault div#SFMB h3,
				div#StickersDefault div#politicalStickers h3,
				div#StickersDefault div#showPride h3
				{
					color:#666;
					margin:0;
					margin:2px;
					margin-bottom:5px;
					padding:5px 0;
					text-align:center;					
					zoom: 1; /* ie7 hack for gradient */					
					/* background gradient for different browsers */
					background: #eeeeee;
					background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#ffffff));
					background: -moz-linear-gradient(top,  #eeeeee,  #ffffff);
					filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff');
					/* rounded corners for different browsers */
					-webkit-border-top-left-radius: 3px;
					-webkit-border-top-right-radius: 3px;
					-moz-border-radius-topleft: 3px;
					-moz-border-radius-topright: 3px;
					border-top-left-radius: 3px;
					border-top-right-radius: 3px;
				}
				div#StickersDefault div#SFMB img,
				div#StickersDefault div#politicalStickers img,
				div#StickersDefault div#showPride img
				{
					margin-bottom:10px;
				}
			
			/* Ad Boxes */	
			/*---------------------------------------------------*/
				/*div#StickersDefault div#marketing
				{
					border-top:1px solid #ccc;
				}
				div#StickersDefault div#marketing h4
				{
					margin-top:0;
					padding-top:1em;
				}
				div#StickersDefault div#marketing div.box
				{
					border-left:1px dotted #b3b3b3;
					height:220px;
				}
				div#StickersDefault div#marketing .alpha div.box
				{
					border-left:none;
				}
				div#StickersDefault div#marketing div.box h1, 
				div#StickersDefault div#marketing div.box h2, 
				div#StickersDefault div#marketing div.box h3, 
				div#StickersDefault div#marketing div.box h4, 
				div#StickersDefault div#marketing div.box h5, 
				div#StickersDefault div#marketing div.box p,
				div#StickersDefault div#marketing div.box ul
				{
					padding-left:15px;
				}
				div#StickersDefault div#marketing .alpha div.box h1, 
				div#StickersDefault div#marketing .alpha div.box h2, 
				div#StickersDefault div#marketing .alpha div.box h3, 
				div#StickersDefault div#marketing .alpha div.box h4, 
				div#StickersDefault div#marketing .alpha div.box h5, 
				div#StickersDefault div#marketing .alpha div.box p,
				div#StickersDefault div#marketing .alpha div.box ul
				{
					padding-left:10px;
				}
				div#StickersDefault div#marketing div#magnets img
				{
					display:block;
					margin-top:30px;
				}*/
			
		/* Long Description - paragraph for SEO */	
		/*---------------------------------------------------*/
			div#StickersDefault div#longDesc
			{
				margin-bottom:12px;
			}
			
		/* Social Links */	
		/*---------------------------------------------------*/
			div#StickersDefault div#social p
			{
				border-top:solid 1px #ccc; 
				border-bottom:solid 1px #ccc; 
				padding:1em 0;
			}
			div#StickersDefault div#social img
			{
				margin:2px; 
				vertical-align:middle;
			}




/*------------------------------------------------------------------------------------------------------*/
/* STRUCTURE */
/*------------------------------------------------------------------------------------------------------*/

	/* Structure for NS.Master */	
	/*---------------------------------------------------*/
		#suppGraphic {background-image:url(images/sidebarTop.gif);}
		#pageInstr {background-image:url(images/mainTop.gif);}
		div#contentMain ul, div#contentMain ol {margin-top:.2em; margin-bottom:.8em;}
			
			

/*------------------------------------------------------------------------------------------------------*/
/* PRINT STYLES */
/*------------------------------------------------------------------------------------------------------*/
	@media print 
	{	
		div#contentMain div#pageInstr {padding-top:36px!important;} /* TOP PADDING IS HEIGHT OF GRAPHICSLAND AFFILIATE LOGO PLUS 10 */
	}