/* Gripski Master CSS file */

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, 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-weight: inherit; 
	font-style: inherit; font-family: inherit; 
	vertical-align: baseline;} :focus { outline: 0; } 
	body { line-height: 1; color: black; background: white; } 
	ol, ul { list-style: none; } 
	table { border-collapse: separate; border-spacing: 0; } 
	caption, th, td { text-align: left; font-weight: normal; } 
	blockquote:before, blockquote:after, 
	q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; }

/*	BASIC ELEMENTS
--------------------------------------- */
body {
	font-family: arial, helvetica, sans-serif;	
	background: url(../images/bg_body.jpg) top center repeat-x #272727;
}

a:hover { color:#FFF;}

h2 {
	text-transform: uppercase;
	color: #f00;
	font-size: 20px;
	padding-bottom: 18px;
}
	h2 a {
		color: #999;
		text-decoration: none;
	}
		h2 a:hover {
			color:#FFF;
		}

form input {
	border: none;
	background: none;
}

/*	SPECIAL CLASSES
---------------------------------------- */

.leftimg {
	float:left;
	margin:0px 15px 10px 0px;
	border:5px solid #666;
}

.rightimg {
	float:right;
	margin:0px 0px 10px 15px;
	border:5px solid #666;
}

/*	SITE STRUCTURE AND LAYOUT
---------------------------------------- */
div#outer_wrap {
	background: url(../images/main_bg.jpg) no-repeat center top;
}
	div#wrap {
		width: 960px;
		margin: 0 auto;
	}
		div#top_nav {
			float: right;
			margin-top: 23px;
		}
			#top_nav ul li {
				display: inline;
				margin-left: 8px;
			}
				#top_nav ul li a {
					font-size: 18px;
					letter-spacing:1px;
					color: #fff;
					text-transform: uppercase;
					text-decoration: none;
				}
					#top_nav ul li a:hover {
						color:#F00;
					}
				#top_nav ul li.
				{
					margin-left: 1px;
				}
				#top_nav ul li.order_link form,
				#bottom_nav ul li.order_link form {
					display: inline;
				}
				#top_nav ul li.order_link input,
				#bottom_nav ul li.order_link input {
					color: #f00;
					font-size: 18px;
					letter-spacing:1px;
					cursor: pointer;
					text-transform:uppercase;
				}
		div#header {
			clear: both;
			padding-top: 30px;
			padding-bottom: 100px;
		}
			#header h1 a {
				background: url(../images/logo.gif) no-repeat top left;
				text-indent: -9999px;
				display: block;
				height: 62px;
			}
		div.product_list {
			float: right;
			width: 340px;
			position: relative;
		}
		div.product_callout {
			float: right;
			top: 0px;
		}
			.product_callout img {
				display: block;
				left: 8px;
				top: 40px;
				position: relative;
			}
			.product_callout div.patent_info {
				position: absolute;
				top: 260px;
				left: 170px;
				color: #fcfcfc;
				font-size: 11px;				
			}
			.product_callout div.buy {
				position: absolute;
				top: -115px;
				left: 93px;				
			}
			.product_callout div.price {
				position: absolute;
				padding: 5px;
				color: #f00;
				top: -65px;
				right: 45px;
/*				background: url(../images/checkered_bg.gif);*/
				background: #242424;
			}
				.product_callout .price h2 {					
					padding: 0 0 5px 0;
				}
				.product_callout .price h1 {
					float: left;
				}
				.product_callout .price h1 input {
					font-size: 30px;
					color: #fff;
					font-family: arial;
				}
				.product_callout .price h2 input {
					font-size: 18px;
					font-weight:normal;
					color: #f00;
					padding: 0;
					cursor:pointer;
					background: none;
					border: none;
				}
					.product_callout .price h2 input:hover {
						color:#FFF;
					}
				.product_callout .price h3 {
					float: left;
					line-height: 5px;
					margin-top: 2px;
				}
				.product_callout .price h3 input {
						color: #f00;
						font-size: 11px;
						padding: 0;
						background: none;
				}
	
		div.product2_callout{
			top: 590px;
		}
			.product2_callout img {
				display: block;
				left: 65px;
				top: 630px;
				position: absolute;
			}		
			.product2_callout div.patent_info {
				position: absolute;
				top: 935px;
				left: 165px;
				color: #fcfcfc;
				font-size: 11px;				
			}
			.product2_callout div.buy {
				position: absolute;
				top: 480px;
				left: 93px;				
			}
			.product2_callout div.price {
				position: absolute;
				padding: 5px;
				color: #f00;
				top: 530px;
				right: 45px;
/*				background: url(../images/checkered_bg.gif);*/
				background: #242424;
			}
				.product2_callout .price h2 {					
					padding: 0 0 5px 0;
				}
				.product2_callout .price h1 {
					float: left;
				}
				.product2_callout .price h1 input {
					font-size: 30px;
					color: #fff;
					font-family: arial;
				}
				.product2_callout .price h2 input {
					font-size: 18px;
					font-weight:normal;
					color: #f00;
					padding: 0;
					cursor:pointer;
					background: none;
					border: none;
				}
					.product2_callout .price h2 input:hover {
						color:#FFF;
					}
				.product2_callout .price h3 {
					float: left;
					line-height: 5px;
					margin-top: 2px;
				}
				.product2_callout .price h3 input {
						color: #f00;
						font-size: 11px;
						padding: 0;
						background: none;
				}
	
		div#twitter {
			float: right;
			margin-top: 100px;
			background: #242424;
		}
			#twitter h4 {
				color: #999999;
				font-size: 11px;
				padding: 10px;
				font-weight: bold;
			}
			#twtr-profile-widget div.twtr-hd {
				display: none;
			}
			#twtr-profile-widget .twtr-timeline {								
				background-color: #ccc !important;
			}
			.twtr-widget .twtr-tweet {
				border: 0 !important;
			}
		
		div.tweet {
			
		}
				
		div.product_content {
			margin-top: 100px;
			width: 620px;
			color: #fff;			
		}
		div.product_content_home {
			width: 380px !important;
		}
			div#product_intro_copy {
				background: url(../images/home_text.gif) no-repeat;
				text-indent: -9999px;
				height: 85px;
				margin-bottom: 40px;
			}
			.product_content p {
				font-size: 15px;
				line-height: 24px;
				margin-bottom: 24px;
				
			}
			.product_content a,
			a.more {
				color: #00adef;
				text-decoration: none;
			}
				.product_content a:hover {
					color:#FFF;
				}
			.product_content em {
				color: #f00;
			}
			#home .product_content p.disclaimer {
				margin:10px 0px 0px 0px;
			}
			.product_content p.disclaimer {
				margin: 10px 0px 30px 0px;
				color: #666;
				font-size: 11px;
				line-height: 16px;
			}
			
		div#pre_footer {
			margin-top: 0px;
			clear: both;
		}
			div#videos {
				float: left;
				width: 380px;
			}
				#videos h2, #photos h2 {
					font-size: 16px;
				}
				#videos a, #photos a {
					color:#666;
				}
					#videos a:hover, #photos a:hover {
						color:#fff;
					}
				#videos h3.vimeo {
					background: url(../images/vimeo_logo.gif) no-repeat left top;
					text-indent: -9999em;
					height: 60px;
					width: 100px;
					margin: 0 10px 0 0;
					float: left;
				}
		div#pre_footer2 {
			margin-top: 210px;
			clear: both;
		}
			div#photos {
				float: left;
				width: 480px;
			}
				#photos h3.flickr {
					background: url(../images/flickr_logo.gif) no-repeat left top;
					text-indent: -9999em;
					height: 50px;
					width: 100px;
					margin: 0 10px 0 10px;
					float: left;
				}
				div.media_desc {
					margin-top: 10px;
				}
					.media_desc p {
						color: #ccc;
						font-size: 11px;
						line-height: 16px;
					}
						.media_desc a {
							color: #999 !important;
						}
							.media_desc a:hover {
								color:#FFF !important;
							}
				#photos h2 {
					margin-left: 10px;
				}			
				div#flickr_badge_uber_wrapper {
					height: 230px;
				}
				div.flickr_badge_image {
					width: 100px;
					height: 100px;
					overflow: hidden;
					float: left;
					border: #00adef 4px solid;
					margin: 0 0 10px 10px;
				}
					.flickr_badge_img a {
						display: block;
						width: 100px;
					}
					.flickr_badge_image img {
						display: block;
						margin-left: -40px;
						margin-top: -30px	;
					}
			
		div#footer {
			clear: both;
			margin-top: 30px;
			padding: 20px 0px;
			border-top: #333 1px solid;
		}
			div#social_links {
				border-bottom: #333 1px solid;
				padding-bottom: 20px;
				margin-bottom: 45px;
			}
				div#social_links ul li {
					display: inline;
					margin-right: 10px;
				}
			div#bottom_nav {
				height: 42px;
			}
			#bottom_nav ul li {
				display: inline;
				margin-right: 10px;
			}
			#bottom_nav ul li.order_link {
				margin-right: 0;
			}
				#bottom_nav ul li a,
				#bottom_nav ul li input {
					color: #999;
					text-decoration: none;
					font-size: 12px !important;
				}
					#bottom_nav ul li a:hover {
						color:#FFF;
					}
		#footer div.links,
		#footer address {			
			width: 140px;
			border-right: #333 1px solid;			
		}			
		#footer div.links,
		#footer address,
		#footer div.disclaimer {
			float: left;
			color: #666;
			font-size: 11px;
			line-height: 18px;
		}
		#footer div.disclaimer {
			padding-left: 10px;
			width: 470px;
		}
		#footer address {
			padding-left: 10px;
		}
		#footer h2.mbm_link a {
			background: url(../images/mbm_logo.gif) no-repeat right top;
			text-indent: -9999px;
			display: block;
			height: 50px;
		}
			#footer .links a {
				display: block;
				color: #666;
				text-decoration: none;
			}
				#footer .links a:hover {
					color:#FFF;
				}