@charset "utf-8";
/* CSS Document */

/*
Site:           thecoolmeter.com           
File:           default.css
Created:		Nov 14 2008
Last Modified:  Dec 10,2008
---------------------------------
thecoolmeter.com | Copyright 2008
=================================
*/

/*Global Styles =================*/

	html,body{
		background-image:url(images/bg_pattern.jpg);
		background-repeat:repeat;
		margin: 0;
		padding: 0;
		height: 100%;
	}

	h1,h2,h3,h4,h5{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1.25em;
		color: #FFF;
	}
	
	img,a,p,li,img a{
		border: none;
		outline: none;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.8em;
		color: #FFF;
	}
	
	#wrapper{
		margin: 0 auto;
		width: 950px;
		background-color: #747474;
	}
		
	.clearfix:after {
    	content: ".";
    	display: block;
    	clear: both;
    	visibility: hidden;
    	line-height: 0;
    	height: 0;
	}

	.clearfix {
    	display: inline-block;
	}

	html[xmlns] .clearfix {
    	display: block;
	}

	* html .clearfix {
    	height: 1%;
	}

	.clear{
		clear: both;
	}
	
/*End Global Styles =============*/

/*Header Styles =================*/

	#header{
		width: 950px;
		height: 187px;
		margin: 0 auto;
		background-image: url(images/header.jpg);
	}
	
	#logo{
		margin: 0 0 0 10px;
		padding: 15px 0 0 0;
	}
	
	#top-nav-wrap{
	}
	
	#login-nav{
		width: 107px;
		margin: 21px 0 0 18px;
	}
	
	#logout-nav{
		width: 164px;
		margin: 21px 0 0 18px;
		float: left;
	}
	
	#welcome{
		width: 200px;
		float: right;
		margin: -37px 0 0 -10px;
	}
	
	#welcome p a{
		font-size: 0.9em;
		text-decoration: none;
	}
	
	.blue{
		color: #00CCFF;
	}
	
	.pink{
		color: #CC0066;
	}
	
	#search{
		width: 336px;
		margin: -28px 0 0 311px;
	}
	
	#search_field{
		width: 240px;
	}
	
	#nav{
		width: 300px;
		margin: 20px 0 0 -20px;
	}
	
	#nav ul{
		list-style-type: none;
	}
	
	#nav ul li{
		display: inline;
		padding: 0 10px 0 0;
	}
	
	#nav ul li a{
		text-decoration: none;
		color: #fff;
		font-size: 1.2em;
	}
	
	#nav ul li a:hover{
		color: #ED007E;
	}
	
	#top-header{
		width: 698px;
		height: 50px;
		background-image: url(images/cool.jpg);
		border-left: 1px solid #A2A2A2;
	}
	
	#top-header h2{
		margin: 0;
		padding: 10px 0 0 15px;
	}
	
	#product-desc h2{
		margin: 0;
	}
	
	#product-desc p{
		margin: 0;
	}
	
	#product-desc p a{
		font-size: 0.9em;
		text-decoration: none;
	}
	
	#bottom-header{
		width: 698px;
		height: 40px;
		background-image: url(images/next.jpg);
	}
	
	#bottom-header h3{
		margin: 0;
		padding: 10px 0 0 12px;
		font-size: 1.0em;
	}
	
	#hot-item-info h5{
		margin: 0;	
	}
	
	#hot-item-info h5 a{
		color: #333;
		text-decoration: none;
	}
	
	#hot-item-info p{
		margin: 0;
	}
	
	#right-top-header{
		width: 250px;
		height: 40px;
		background-image: url(images/next.jpg);
	}
	
	#right-top-header h3{
		margin: 0;
		padding:10px 0 0 12px;
		font-size: 1.0em;
	}
	
	#right-bottom-header{
		width: 250px;
		height: 40px;
		background-image: url(images/trend.jpg);
	}
	
	#right-bottom-header h4{
		margin: 0;
		padding:10px 0 0 12px;
		font-size: 1.0em;
	}
	
	#overall-rating h2{
		margin: 0;
		width: 300px;
	}
	
	#overall-rating h2 a{
		text-decoration: none;
	}
	
	#overall-rating h3{
		margin:0;
		font-size: 2.1em;
		margin: -5px 0 0 15px;
	}
	
	#trendsetters-wrap p{
		color: #333;
		margin: 0;
	}
	
	#trendsetters-wrap p a{
		color: #333;
		font-size: 0.9em;
		text-decoration: none;
	}
	
	#trend-info-right{
		color: #333;
	}
	
	#hot-item h4{
		margin: 0;
		color: #333;
		text-align: center;
	}
	
	#submit-header{
		background-image:url(images/cool.jpg);
		width: 400px;
		height: 51px;
	}
	
	#submit-header h2{
		margin: 0;
		padding:10px 0 0 15px;
	}
	
	#submit-left-column{
		width: 380px;
		height: 541px;
		padding: 10px;
		background-color: #494949;
		float: left;
	}
	
	#how-to-wrap{
		width: 364px;
		padding: 5px;
		background-color:#FFFFFF;
		border: 3px solid #333333;
	}
	
	#how-to-wrap ul{
		list-style-type: none;
		margin:-8px 0 0 -45px;
		width: 364px;
	}
	
	#how-to-wrap ul li{
		color: #333333;
		font-size: 1.3em;
		padding: 10px;
	}
	
	#preview-header{
		background-image:url(images/next.jpg);
		height:40px;
		width: 400px;
		margin: 10px 0 0 -10px;
	}
	
	#preview-header h3{
		font-size:1em;
		margin:0;
		padding:10px 0 0 12px;
	}
	
	#preview{
		width: 364px;
		padding: 5px;
		margin: 5px 0 0 0;
		background-color:#FFFFFF;
		border: 3px solid #333333;	
	}
	
	#title{
		color: #FFFFFF;
	}
	
	#title a{
		color: #333333;
		text-decoration: none;
	}
	
	#preview p{
		color:#333333;
	}
	
	#submit-right-column{
		background-color: #333333;
		padding: 10px 10px 43px 10px;
		margin: -51px 0 0 0;
		width: 529px;
		height: 559px;
		float: right;
		border-left: 1px solid #999;
	}
	
	#submit-right-column h2{
		margin: 0;
		padding:3px 0 0 0;
	}
	
	#submit-right-column label{
		display: block;
		text-align: left;
	}
	
	#login-header{
		width: 767px;
		height: 92px;
		margin: 0 auto;
		background-image: url(images/login_header.jpg);
	}
	
	#login-logo{
		margin: 0 0 0 16px;
		padding: 5px 0 0 0;
	}
	
	#login-topbar h2{
		margin: 10px 0 0 21px;
	}
	
	#login-desc{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.9em;
		color: #FFF;
		margin: 10px 0 0 10px;
	}
		
/*End Header Styles =============*/

/*Navagation Styles =============*/
	

/*Navagation Styles End =========*/

/*Container Styles ==============*/

	#content{
		width: 950px;
		margin: 0;
	}
	
	#left-column{
		width: 698px;
		float: left;
		border-left: 1px solid #A2A2A2;
	}
	
	#top-wrap{
		width: 678px;
		padding: 10px;
		float: left;
		background-color: #494949;
	}
	
	#product-wrap{
		width: 281px;
		height: 300px;
		float: left;
		padding: 10px;
		border: 3px solid #333;
		background-color: #fff;
	}
	
	#product-desc{
		width: 343px;
		height: 163px;
		padding: 2px 10px 2px 10px;
	}
	
	#bottom-wrap{
		width: 678px;
		padding: 10px;
		float: left;
		background-color: #747474;
		border-right: 1px solid #999;
	}
	
	#hot-item{
		background-color:#FFFFFF;
		border:3px solid #999;
		float:left;
		height:250px;
		margin:0 3px;
		padding:10px;
		width:194px;
	}
	
	#hot-item-pic{
		width: 90px;
		height: 90px;
		margin: 10px 0 6px 0;
	}
	
	#hot-item-info{
		width: 199px;
		height: 112px;
		overflow: hidden;
	}
	
	#hot-item-info p{
		color: #333;
	} 
	
	#hot-item-bottom{
		width: 199px;
	}
	
	#hot-item-bottom p {
		margin: 0;
	}
	
	#hot-item-bottom p a{
		color: #ED007E;
		font-size: 0.9em;
		float: right;
		margin: 0;
		text-decoration: none;
	}
	
	#right-column{
		width: 250px;
		float: right;
		margin: -50px 0 0 0;
		border-left: 1px solid #A2A2A2;
	}
	
	#overall-rating{
		width: 240px;
		padding: 5px;
		background-color: #333;
	}
	
	#overall-info{
		width: 108px;
		float: left;
	}
	
	#overall-product{
		height:184px;
		width:132px;
		float: left;
		margin: 5px 0 0 -19px;
	}
	
	#next-item-wrap{
		width: 246px;
		padding: 18px 2px 18px 2px;
		background-color: #565656;
	}
	
	#next-item{
		width: 246px;
		padding: 31px 0 31px 0;
		background-color: #FFF;
	}
	
	#item{
		height: 71px;
		width: 71px;
		float: left;
		margin: 0 3px 0 5px;
	}
	
	#trendsetters-wrap{
		width: 246px;
		padding: 5px 2px 9px 2px;
		background-color: #333;
	}
	
	#trendsetter{
		width: 240px;
		padding: 3px;
		margin: 3px 0 0 0;
		background-color: #FFF;
	}
	
	#trend-info-left{
		padding: 2px;
		width: 65px;
		float: left;
	}
	
	#trend-info-right{
		width: 170px;
		float: right;
	}
	
	#trend-pic{
		width: 50px;
		height: 50px;
	}
	
	#bottom-info{
		width: 240px;
	}
	
	#profile-pic-wrap{
		width: 130px;
		padding: 2px;
		float: left;
		background-color: #333333;
	}
	
	#profile-pic{
		height: 130px;
		width: 130px;
		background-color: #666666;
	}
	
	#pic-info{
		width: 129px;
	}
	
	#pic-info ul{
		width: 109px;
		list-style-type: none;
		margin: 3px 0 0 -25px;
	}
	
	#pic-info ul li{
		padding: 4px;
	}
	
	#profile-info{
		width: 535px;
		float: right;
	}
	
	#profile-info h2,h3,h4,h5{
		margin: 0 0 0 5px;
	}
	
	#profile-info h3,h4,h5{
		font-size: 0.9em;
	}
	
	#profile-info p a{
		text-decoration: none;
		font-size: 0.9em;
	}
	
	#posts{
		width: 671px;
		padding: 3px;
		background-color: #FFF;
		margin: 6px 0 11px 0;
	}
	
	#post-pic{
		width: 120px;
		height: 120px;
		float: left;
	}
	
	#post-info{
		width: 547px;
		float: right;
	}
	
	#post-info h2 {
		margin: 0 0 2px 0;
		color: #333333;
	}
	
	#post-info p{
		margin: 0 0 5px 0;
		color: #333333;
	}
	
	#login-wrap{
		margin: 0 auto;
		width: 767px;
		background-color: #333333;
	}
	
	#freinds-wrap{
		width: 244px;
		padding: 3px;
		background-color: #333;
	}
	
	#freinds-wrap h2{
		font-size: 1.0em;
		margin: 0;
	}
	
	#friends{
		width: 244px;
		height: 116px;
		padding: 0 0 20px 2px;
	}
	
	#freinds-pic{
		float: left;
		margin: 2px;
	}
	
	#login-column{
		width: 500px;
		padding: 10px;
		background-color: #494949;
		float: left;
		border-right:1px solid #A2A2A2;
	}
	
	#recent-rated-wrap{
		background-color: #5c5c5c;
		padding: 8px 3px 3px 3px;
	}
	
	#recent-rated{
		width: 240px;
		background-color: #FFF;
		padding: 2px;
		margin: 0 0 5px 0;
	}
	
	#recent-pic{
		width: 75px;
		height: 75px;
		float: left;
	}
	
	#recent-info{
		width: 115px;
		float: left;
	}
	
	#recent-info h2 a{
		color: #333333;
		font-size: 0.6em;
		text-decoration: none;
	}
	
	#recent-info h2{
		margin: 0;
	}
	
	#recent-info p{
		margin: 0;
		color: #333333;
	}
	
	#recnet-number{
		width: 50px;
		float: right;
	}
	
	#recnet-number h3{
		color: #CC0066;
		font-size: 2.3em;
	}
	
	#recent-comments-wrap{
		background-color: #5c5c5c;
		padding: 3px 3px 8px 3px;
	}
	
	#buttons{}
	
	#up{
		width: 15px;
		float: left;
	}
	
	#down{
		width: 15px;
		float: left;
	}
	
	#recent-comments{
		width: 240px;
		background-color: #FFFFFF;
		padding: 2px;
		margin: 5px 0 0 0;
	}
	
	#comment-pic{
		width: 75px;
		height: 75px;
		float: left;
	}
	
	#comment-info{
		width: 165px;
		float: left;
	}
	
	#comment-info h2{
		margin: 0;
	}
	
	#comment-info h2 a{
		color: #333333;
		font-size: 0.6em;
		text-decoration: none;
	}
	
	#comment-info p{
		margin: 0;
		color: #333333;
	}
	
	#edit-comment{
		color: #333333;
	}
	
	#mid-header{
		height:40px;
		width:698px;
		background-image:url(images/trend.jpg);
	}
	
	#reply{
		width: 638px;
		padding:3px;
		background-color: #e7e7e7;
	}
	
	#reply-pic{
		width: 90px;
		float: left;
	}
	
	#reply-info{
		width: 533px;
		float: right;
	}
	
	#reply-info h2{
		color: #333333;
		margin: 0;
	}
	
	#reply-info p{
		color: #333333;
		margin: 0;
	}
	
	.reply-form{
		padding: 5px;
	}
	
	#reply-box{
		width: 200px;
	}
	
	.bottom-btns{
		width: 558px;
	}
	
	.reply-btn{
		float: left;
		margin: 20px 0 0 0;
	}
	
	.swizzle-btn{
		float: right;
	}
	
	#product-pic{
		width: 185px;
		float: left;
	}
	
	#product-info{
		width: 353px;
		margin: 192px 0 0 2px;
	}
	
	#product-info h2{
		margin: 0;
	}
	
	#product-info p{
		margin: 0;
	}
	
	#mid-header h2{
		font-size:1em;
		margin:0;
		padding:10px 0 0 12px;
	}
	
	#graph-wrap{
		width: 315px;
		float: right;
		margin: 8px 0 0;
	}
	
	#graph-wrap ul{
		list-style-type: none;
		border-left: 1px solid #A2A2A2;
		padding: 0 0 0 18px;
	}
	
	#graph-wrap ul li a{
		text-decoration: none;
		font-size: 0.9em;
	}
	
	#mid-wrap{
		width:678px;
		float:left;
		padding:10px;
		background-color: #333333;
	}
	
	#comment{
		width: 677px;
		background-color: #FFF;
		margin: 0 0 5px 0;
		padding: 3px;
	}
	
	#comments-pic{
		height: 90px;
		width: 90px;
	}
	
	#comments-info{
		float: right;
		width: 572px;
		margin: -91px 0 0 5px;
	}
	
	#comments-info h2{
		font-size: 1.0em;
		color: #333;
		margin: 0;
	}
	
	#comments-info p{
		color: #333333;
		margin: 0;
	}
	
	#similar-item-wrap{
		padding: 8px 3px 3px 3px;
	}
	
	#similar-item{
		width: 240px;
		background-color: #FFF;
		padding: 2px;
		margin: 0 0 5px 0;
	}
	
	#similar-pic{
		width: 60px;
		height: 60px;
		float: left
	}
	
	#similar-info{
		float: left;
		width: 176px;
		height: 97px;
		overflow: hidden;
		margin: -18px 0 0 3px;
	}
	
	#similar-item p{
		color: #333333;
		margin: 0;
		
	}
	
	#edit-wrap{
		width: 678px;
		padding: 10px;
		background-color: #747474;
	}
	
	#edit-wrap label{
		display: block;
	}
	
	.option{
		float: left;
		margin:13px 0 23px;
		width:50px;
	}
	
	#tips{
		background-color: #333333;
		width: 230px;
		height: 749px;
		padding: 10px;
	}
	
	#tips p{
		margin: 0;
	}
	
	#tips ul{
		width: 200px;
		padding: 0;
		margin: -10px 0 0 16px;
	}
	#tips ul li {
		padding: 10px;
	}
	
	#profile-btn{
		padding: 0 0 20px 0;
	}
	
	#login-topbar{
		width: 519px;
		height: 50px;
		background-image: url(images/cool.jpg);
		float: left;
		border-left: 1px solid #A2A2A2;
		border-right: 1px solid #A2A2A2;
	}
	
	#login-form{
		width: 472px;
		margin: 10px 0 0 20px;
		padding: 10px;
	}
	
	#register-column{
		width: 228px;
		padding: 9px;
		margin: -50px 0 0 0;
		background-color: #333;
		float: left;
	}
	
	#register-info h3{
		margin: 0;
	}
	
	#register-info{
		width: 200px;
		height: 252px;
		margin: 2px 0 0 19px;
	}
	
	#register-header{
		background-image:url(images/login_header.jpg);
		height:92px;
		margin:0 auto;
		width:767px;
	}
	
	#register-header h1{
		margin: 0;
		margin:0 0 0 16px;
		padding:5px 0 0;
	}
	
	#register-wrap{
		margin: auto;
		width: 767px;
		background-color: #333333;
	}
	
	#register-title{
		background-image:url(images/cool.jpg);
		height:50px;
		width:520px;
		border-right:1px solid #A2A2A2;
	}
	
	#register-title h2{
		padding: 9px 0 0 16px;
		margin:0;
	}
	
	#reg-left{
		background-color:#494949;
		border-right:1px solid #A2A2A2;
		float:left;
		padding:10px;
		width:500px;
	}
	
	#reg-form{
		margin: -8px 0 0 20px;
		padding:10px;
		width:472px;
	}
	
	#reg-left label{
		display:block;
		float:left;
		margin:10px 0 0;
		width:129px;
	}
	
	#reg-right{
		background-color:#333333;
		float:left;
		margin:-50px 0 0;
		padding:9px;
		width:228px;
	}
	
	#reg-right label{
		display: block;
	}
	
	#reg-right h2{
		margin: 0;
	}
	
	#country{
		width: 226px;
	}
	
	.gender{
		float: left;
		width: 50px;
		margin: 5px 0 0 0;
	}
	
	#reg-btn{
		margin: 0 0 0 128px;
	}
	
	#search-wrap{
		padding: 10px;
	}
	
	#search-wrap p{
		float: left;
	}
	
	#adv-search{
		float: left;
		margin: 26px 0 0 10px;
	}
	
	#search-wrap label{
		display: block;
	}
	
	#search-item{
		width:671px;
		background-color: #FFFFFF;
		padding: 3px;
		margin: 5px 0 0 0;
	}
	
	#item-pic{
		width: 95px;
		float: left;
	}
	
	#item-desc{
		width: 570px;
		float: left;
	}
	
	#item-desc h2{
		margin: 0;
	}
	
	#item-desc h2 a{
		color: #333333;
		text-decoration: none;
	}
	
	#item-desc p{
		margin: 0;
		color: #333333;	
	}
	
	#recent-user{
		width: 200px;
		height: 300px;
	}
	
	#edit-product-wrap{
		padding: 10px;
	}
	
	#edit-product-form{
		width: 432px;
		margin: 0 0 0 125px;
	}
	
	#edit-product-form label{
		display: block;
	}
	
	#footer{
		width: 948px;
		height: 70px;
		background-image: url(images/midfoot.jpg);
		position: absolute;
		border-left: 1px solid #000;
		border-right: 1px solid #000;
	}

/*End Container Styles ==========*/

/*Meter Styles===================*/

	#meter-wrap{
		width: 363px;
		float: right;
		margin: -9px 0 0 0;
	}
	
	#meter-bg{
		width: 363px;
		height: 200px;
		background-image: url(images/meter_bg.jpg)
	}

	#rate-header{
		color: #fff;
		position: relative;
		font-size: 20px;
		top: 34px;
		left: 15px;
		margin: 0;
	}

	#sex-show{
		color:#ED007E;
		font-size:11px;
		left:232px;
		position:relative;
		top:-13px;
	}

	#sexes {
		left: 187px;
		position: relative;
		top: -29px;
		width: 308px;
	}
	
	#sexes ul li {
		float: left;
		list-style-type: none;
	}

	#sexes li a {
		width: 200px;
		height: 0px;
		padding-top: 32px;
		overflow: hidden;
		display: block;
		margin: 0px 1px 0px 0px;
	}

	#sexes #nav_women a  { 
		background: url(images/women_btn.jpg) 0px -32px; 
		background-repeat:no-repeat;
		outline: none;
	}

	#sexes #nav_women a:hover{
		background: url(images/women_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;	
	}

	#sexes #nav_men a { 
		background: url(images/men_btn.jpg) 0px -32px; 
		background-repeat:no-repeat;
		margin: 0 0 0 -140px;
		outline: none;
	}

	#sexes #nav_men a:hover{
		background: url(images/men_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}

	#meter {
		left: -290px;
		margin: 0 0 0 188px;
		position: relative;
		top: 4px;
		width: 600px;
	}

	#meter ul li {
		float: left;
		list-style-type: none;
	}

	#meter li a {
		width: 200px;
		height: 0px;
		padding-top: 116px;
		overflow: hidden;
		display: block;
		margin: 0px 1px 0px 0px;
	}

	#meter #nav_one a  { 
		background: url(images/one_btn.jpg) 0px -116px; 
		background-repeat:no-repeat;
		outline: none;
	}
	
	#meter #nav_one a:hover{
		background: url(images/one_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}

	#meter #nav_two a { 
		background: url(images/two_btn.jpg) 0px -116px; 
		background-repeat:no-repeat;
		margin: 0 0 0 -140px;
		outline: none;
	}

	#meter #nav_two a:hover{
		background: url(images/two_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}

	#meter #nav_three a{ 
		background: url(images/three_btn.jpg) 0px -116px; 
		background-repeat:no-repeat;
		margin: 0 0 0 -130px;
		outline: none;
	}

	#meter #nav_three a:hover{
		background: url(images/three_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}

	#meter #nav_four a{ 
		background: url(images/four_btn.jpg) 0px -116px; 
		background-repeat:no-repeat;
		margin: 0 0 0 -128px;
		outline: none;
	}

	#meter #nav_four a:hover{
		background: url(images/four_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}

	#meter #nav_five a{ 
		background: url(images/five_btn.jpg) 0px -116px; 
		background-repeat:no-repeat;
		margin: 0 0 0 -133px;
		outline: none;
	}

	#meter #nav_five a:hover{
		background: url(images/five_btn.jpg) 0px 0px; 
		background-repeat:no-repeat;
	}
	
/*===============================*/

/*Form Styles ===================*/

	#login-column label{
		display: block;
		float: left;
		width: 104px;
		margin: 10px 0 0 0;
	}
	
	#login-form p{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.9em;
		color: #FFF;
		font-size: 1.0em;
	}
	
	#username{
		font-size: 1.0em;
		padding: 7px;
		width: 57%;
	}
	
	#password{
		font-size: 1.0em;
		padding: 7px;
		width: 57%;
	}
	
	#login_btn{
		margin: 0 0 0 104px;
	}
	
	#regsiter_btn{
		margin: 20px 0 0 45px;
	}
	
	#comment-form{
		width: 475px;
		margin: -13px 0 0 112px; 
	}
/*===============================*/






