@import url(reset.css);

body {
	font-family: Helvetica, Arial, sans-serif;
	margin: 0;
}

.wrap {
	width: 880px;
	margin: 20px auto 0 auto;
	position: relative;
}


.header {
	position: relative;
	height: 80px;
	background: url(../images/bg_top.gif) bottom repeat-x;
}

.header .page_message {
	position: absolute;
	left: 250px;
	top: 15px;
	width: 300px;
	color: green;
	font-size: 75%;
	font-weight: bold;
}

.header .page_error {
	position: absolute;
	left: 250px;
	top: 15px;
	width: 300px;
	color: red;
	font-size: 75%;
	font-weight: bold;
}

.header h1 {
	position: absolute;
	left: 0;
	top: 5px;
	background: url(../images/main/logo.gif) top left no-repeat;
	width: 220px;
	height: 40px;
	text-indent: -9999px;
	cursor: hand; cursor: pointer;
}

.header h2 {
	position: absolute;
	left: 2px;
	top: 45px;
	width: 220px;
	font-size: 75%;
	color: #aaa;
}
 

.header form {
	position: absolute;
	right: 0;
	top: 35px;
}

.header form .search_text{
	padding: 2px 4px;
	background: #fff;
	border: 1px solid #aaa;
	font-size: 75%;
}

.header form .search_button{
	font-size: 75%;
	font-weight: bold;
	text-transform: lowercase;
	border: 1px solid #aaa;
	background: #eee;
	color: #aaa;
	padding: 1px 7px;
}

.header .nav {
	position: absolute;
	right: 0;
	top: 10px;
	font-size: 75%;
}

.header .nav a ,  .header .nav .link{
	color: #000;
	border-bottom: 1px dotted #000;
}	





.catalog .options {
	background: #e8e8e8 url(../images/main/bg_filter.gif) top repeat-x;
	padding: 12px 0 0 0;
	border: 1px solid #cecece;
	border-bottom: 0;
}

.catalog .options a {
	color: #000;
}

.catalog ul {
	list-style-type: none;
	padding: 0 0 0 15px;
}

.catalog li {
	float: left; 
	width: 157px;
	padding: 0 15px 15px 0;
	font-size: 75%;
	line-height: 1.6;
}

 
.catalog li img:hover{
	background: #FFE6BF;
}


.catalog li h3 {
	font-size: 100%;
	font-weight: ;
	color: #777;
	margin: 0 0 2px 0;
	font-weight: bold;
	text-transform: uppercase;
}

.catalog .sort {
	background: #fff;
	padding: 8px 0 5px 15px;
	border: 1px solid #cecece;
	position: relative;
	height: 24px;
}

.catalog .sort .label {
	font-size: 75%;
	font-weight: bold;
	color: #000;
	text-transform: uppercase;
}

.catalog .sort form select { 
	font-size: 75%;
	color: #555;
}

.catalog .keyword {
	position: absolute;
	right: 290px;
	top: 8px;
}

.catalog .keyword .q {
	font-size: 75%;
	font-weight: bold;
	color: #000;
}

.catalog .keyword .label_keyword {
	font-size: 75%;
	color: #000;
}

.catalog .keyword .clear_keyword {
	font-size: 75%;
	color: #000;
	cursor: hand; cursor: pointer;
	text-decoration: underline;
}		

.catalog .update_button {
	position: absolute;
	right: 15px;
	top: 6px;
	width: 150px;
	font-size: 75%;
	font-weight: bold;
	text-transform: lowercase;
	border: 1px solid #2d6a42;
	background: #94c4a4;
	color: #185a2e;
	padding: 3px 0;
}


.catalog .hide_button {
	position: absolute;
	right: 175px;
	top: 6px;
	width: 90px;
	font-size: 75%;
	font-weight: bold;
	text-transform: lowercase;
	border: 1px solid #aaa;
	background: #eee;
	color: #aaa;
	padding: 3px 0;
}

.catalog .paging {
	margin-top: 15px;
}

.card_container {
	margin: 20px 0 0 0;
	border-bottom:1px solid #ccc;
	padding: 0 0 25px 0;
	position: relative;
}

.card_container .card_image {
	position: absolute;
	top: 59px;
	left: 0;
}

.card_container .rating_image {
	border: 0;
	position: relative;
	top: 1px;
}

.card_container .title_action {
	float: right;
	font-size: 70%;
	padding: 0 0 0 0;
	color: #000;
}

.card_container .save {
	cursor: hand; cursor: pointer;
	padding: 3px 0 0 0;
	color: #3076D5;
}

.card_container .saved {
	padding: 3px 0 0 0;
	color: #aaa;
}

.card_container .compare {
	cursor: hand; cursor: pointer;
	color: #3076D5;
}

.card_container .compared {
	color: #aaa;
}

.card_container h1 {
	font-size: 150%;
}


.card_container h1 a {
	color: #000;
	text-decoration: none;
}	

.card_container h1 a:hover {
	color: #000;
	text-decoration: none;
}	


.card_container .rating {
	margin: 4px 0 8px 0;
	font-size: 75%;
}

.card_container .info {
	margin-left: 110px;
	margin-left: 110px;
	line-height: 1.5;
	width: 770px;
}


.card_container .info .label {
	width: 120px;
	font-size: 65%;
	text-transform: uppercase;
	border-right: 1px solid #ccc;
	padding: 1px 0px 0 5px;
}	

.card_container .info .value {
	font-size: 75%;
	padding: 0px 0 0px 10px;
}	

.card_container_empty {
	font-size: 75%;
	padding: 15px 0 200px 0;
}












.compare {
	
}

.compare h1.title {
	font-size: 190%;
	border-top: 1px solid #ccc;
	padding: 8px 0 10px 0;
	text-transform: lowercase;
}

.compare ul.legend {
	float:left;
	width: 140px;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	font-size: 65%;
	text-transform: uppercase;
	line-height: 1.5;
}

.compare ul.legend li {
	padding: 7px 5px 0 ;
	height: 23px;
	text-align: right;
	border-bottom: 1px solid #ccc;
}

.compare ul.legend li.name {
	border-top: 1px solid #ccc;
}

.compare ul.card {
	float:left;
	width: 123px;
	border-right: 1px solid #ccc;
	font-size: 75%;
	line-height: 1.7;
}

.compare ul.card li {
	padding: 5px 5px 0 5px;
	height: 25px;
	overflow: hidden;
	border-bottom: 1px solid #ccc
}

.compare ul.card li.name {
	border-top: 1px solid #ccc;
}



 

.compare ul.card li .rating_image {
	padding: 0;
}



/*creditcard_links*/
.creditcard_links {
	
}


.creditcard_links dd {
	margin: 0 0 10px 0;
}

.creditcard_links .textbox {
	background: #eee;
	padding: 15px;
	border: 1px solid #ccc;
	font-size: 75%;

}







.view_card {
	
}


.view_card h1.title {
	font-size: 190%;
	border-top: 1px solid #ccc;
	padding: 8px 0 10px 0;
}

.view_card .title_action {
 	float:right;
	font-size: 75%;
	padding: 15px 0 0 0;
}

.view_card .save {
	cursor: hand; cursor: pointer;
	color: #3076D5;
}

.view_card .saved {
	color: #aaa;
}

.view_card .compare {
	cursor: hand; cursor: pointer;
	color: #3076D5;
}

.view_card .compared {
	color: #aaa;
}

.view_card .under_title_wrap {
	margin: 0 0 15px 0;
	height: 105px;
}

.view_card .under_title {
	position: relative;
	font-size: 85%;
	line-height: 1.5;
	width: 600px;
}

.view_card .under_title .rating {
	position:absolute;
	top: 0;
	left: 175px;
	width: 500px;
}


.view_card #rating_form {
	font-size: 75%;
	margin: 0 0 15px 0;
}
.view_card #rating_form fieldset{
	padding: 5px 15px 5px 15px;
	border: 1px solid #ccc;
}

.view_card #rating_form .label{
	margin: 10px 0  5px 0;
	display: block;
}

 
.view_card #rating_form .button {
	background:#eee ;
	border:1px solid #aaa;
	color:#aaa;
	font-weight:bold;
	padding:1px 7px;
	text-transform:lowercase;
}


.view_card .apply_box {
	position: absolute;
	top: 175px;
	right: 0;
}

.view_card .apply_box input{
	border: 1px solid #185A2E;
	background: url(../images/main/button_apply.gif) no-repeat;
	width: 223px;
	height: 60px;
	cursor:hand; cursor: pointer;
}

.view_card .under_title .rating td {
}

.view_card .under_title .rating .label {
	text-align: right;
	border-right: 1px solid #ccc;
	padding: 0 5px 0 0;
}

.view_card .under_title .rating .value {
	padding: 0  0 0 5px;
}


.view_card .info_box {
	border: 1px solid #ccc;
	padding: 10px;	
}

.view_card .info {
	width: 858px;
}

.view_card .info .label {
	width: 155px;
	font-size: 70%;
	text-transform: uppercase;
	border-right: 1px solid #ccc;
	padding: 5px 10px 5px 0;
	text-align: right;
}	

.view_card .info .value {
	font-size: 75%;
	padding: 5px 0 5px 10px;
}	

.view_card .summary {
	font-size: 75%;
	padding: 10px 15px;
	margin: 0px  0 15px 0px ;
	background: #eee;
	border: 1px solid #ccc;
}

.view_card .section {
	margin: 15px 0 0 0;
}

.view_card .none_found {
	font-size: 75%;
	color:#777;
}


.view_card .comment_add select {
	
}

.view_card .comment_add {
	float: right;
	font-size: 75%;
}

.view_card .comment_add a {
}

.view_card #add_comment_form {
	font-size: 75%;
	margin: 0 0 15px 0;
}
.view_card #add_comment_form fieldset{
	padding: 15px 15px 5px 15px;
	border: 1px solid #ccc;
}

.view_card #add_comment_form legend{
	padding: 0 2px ;
	color: #3076D5;
}
.view_card #add_comment_form label{
	margin: 0 0 10px 0;
	display: block;
}

.view_card #add_comment_form .text {
	width: 500px;
}

.view_card #add_comment_form .textarea {
	width: 500px;
	height: 100px;
}

.view_card #add_comment_form .button {
	background:#eee ;
	border:1px solid #aaa;
	color:#aaa;
	font-weight:bold;
	padding:1px 7px;
	text-transform:lowercase;
}



 
.view_card .section h2 {
	font-size: 120%;
	text-transform: lowercase;
	margin: 0 0 5px 0;
}

.view_card .section li {
	position: relative;
	padding: 0 0 10px 50px;
	font-size: 75%;
} 

.view_card .section li img {
	position: absolute;
	left: 0;
	top: 0;
} 

.view_card .section li a {
	color: #000;
	text-decoration:none;
	border-bottom: 1px dotted #000;
}

.view_card .section li .details {
	color: #777;
	text-transform: lowercase;
	padding: 4px 0 0 0;
} 



.comment  {
	margin:  0 0 10px 0;
	border-bottom: 1px solid #ccc;
	padding: 0 0 15px 0;
}

.comment .comment_action {
	font-weight: normal;
	color: #000;
}


.comment .courier {
	font-family: "courier new";
}



.comment .username {
	font-size: 75%;
	font-weight: bold;
}

.comment .date {
	color: #aaa;
}

.comment .vote {
	color: green;
}

.comment .title {
	font-size: 85%;
	padding: 3px 0;
}

.comment .body {
	font-size: 75%;
	color: #777;
}

.view_card .paging {
	margin-bottom: 10px;
}






/* new_card */
.new_card .textbox {
	background: #f5f5f5;
	padding: 20px 0 20px 20px;
	border: 1px solid #ddd;
	font-size: 75%;
}

.new_card .textbox .label {
	padding: 10px 10px 0 0  ;
	text-align: right;
	border-right: 1px solid #ccc;
	text-transform: lowercase;
}

.new_card .textbox .value {
	padding: 10px 20px 10px 10px ;
}

.new_card .textbox .note {
	padding: 10px 10px 10px 0 ;
	color: #999;
}

.new_card .textbox .note a {
	color: #999;
	border-bottom: 1px dotted #999;
}

.new_card .textbox .text {
	width: 300px;
}

.new_card .textbox .select {
	width: 300px;
}

.new_card .textbox .textarea {
	width: 300px;
	height: 100px;
}



/*user_profile*/

.user_profile .textbox {
	padding: 15px;
	border: 1px solid #ccc;
}

.user_profile h1.title {
	font-size: 190%;
	border-top: 1px solid #ccc;
	padding: 8px 0 10px 0;
}

.user_profile .title_action {
	float: right;
	font-size: 70%;
	padding: 15px 0 0 0;
}

.user_profile .info {
	line-height: 1.5;
	width: 850px;
}

.user_profile .info .label {
	width: 95px;
	font-size: 70%;
	text-transform: uppercase;
	border-right: 1px solid #ccc;
	padding: 5px 10px 5px 0;
	text-align: right;
}	

.user_profile .info .value {
	font-size: 75%;
	padding: 5px 0 5px 10px;
}	

.user_profile #change_username_form {
	font-size: 75%;
	margin: 0 0 15px 0;
}
.user_profile #change_username_form fieldset{
	padding: 5px 15px 15px 15px;
	border: 1px solid #ccc;
}

.user_profile #change_username_form .label{
	margin: 10px 0 2px  0;
	display: block;
}

.user_profile #change_username_form .text {
	width: 200px;
}


.user_profile #change_username_form .button {
	background:#eee ;
	border:1px solid #aaa;
	color:#aaa;
	font-weight:bold;
	padding:1px 7px;
	text-transform:lowercase;
}








/* page_view*/
.page_view .textbox {
	background: #eee;
	padding: 15px;
	border: 1px solid #ccc;
	font-size: 75%;
}
.page_view h1.title {
	font-size: 190%;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 8px 0 10px 0;
}

body.terms p {
	margin: 0 0 10px 0;
}

body.terms ul {
	margin: 0 0  10px 20px;
}

body.terms li {
	list-style: disc;
}

body.about p {
	margin: 5px 20px;
	font-size: 26px;
	line-height:2;
	color: #777;
}




 
/* contact */
.contact .textbox {
	background: #eee;
	padding: 20px 0 20px 20px;
	border: 1px solid #ccc;
}

.contact .textbox form {
	position: relative;
}

.contact .textbox .error {
	color: #d75e64;
	float: right;
	width: 540px;
	font-size: 80%;
	padding: 21px 0 0 0;
}

.contact .textbox .thanks {
	color: #339b66;
	margin: 0 0 10px 0 ;
	font-size: 75%;
}

.contact .textbox form h5 {
	margin: 0 0 1px 0 ;
	font-size: 80%;
	color: #000;
}

.contact .textbox form input, .contact .textbox form textarea {
	margin: 0 0 10px 0 ;
	width: 300px;
}


.contact .textbox form .button {
	font-size: 75%;
	font-weight: bold;
	text-transform: lowercase;
	border: 1px solid #2d6a42;
	background: #94c4a4;
	color: #185a2e;
	padding: 3px 0;
}
.contact .textbox a {
	color: #567bae;
	text-decoration: none;
}

.contact .textbox a:hover {
	color: #567bae;
	text-decoration: underline ;
}


 




/* footer */

.footer {
	padding: 20px 0 ;
	color: #777;
	font-size: 80%;
}

.footer a {
	color: #777;
	border-bottom: 1px dotted #777;
}












/* login related */
#dropsheet {
	background-color: #000; 
	opacity: 0.80; 
	filter: alpha(opacity=80); 
	position:absolute; 
	left:0; 
	top:0; 
	z-index:10; 
	width:100%;	
}

#login_popup {
	position: absolute;
	top: 60px;
	right: 60px;
	width: 750px;
	height: 380px;
	padding: 10px;
	background: #6499e0;
	color: #fff;
	border-top: 5px solid #0e68e1; 
	z-index: 20;
}

#login_popup_content {
	position: absolute;
	top: 90px;
	left: 230px;
}

#login_popup .close {
	font-size: 75%;
}

#login_popup .button {
	background: #0e68e1;
	border: 3px solid #0b58c1;
	color: #fff;
	padding: 1px 4px;
	font-size: 20px;
	margin: 5px 0 0 0;
}


#login_popup_message {
	margin: 0 0 10px 0;
	font-size: 75%;
}

#login_popup_lost_password input {
	font-size: 75%;
}

#login_popup_lost_password_message {
	margin: 0 0 10px 0;
	font-size: 75%;
}

#login_popup .button_grey {
	background: #0e68e1;
	border: 1px solid #0b58c1;
	color: #fff;
	padding: 1px 4px;
	font-size: 10px;
}


#login_popup h3 {
	padding: 0 0 10px 0;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
}	

#login_popup label {
	display: block;
	position: relative;
	margin: 0px 0 15px 0;
	font-size: 75%;
	text-transform: lowercase;
}

#login_popup label input.text {
	position: absolute;
	top: 0;
	left: 70px;
	width: 200px;
}





#register_popup {
	position: absolute;
	top: 60px;
	right: 60px;
	width: 750px;
	height: 380px;
	padding: 10px;
	background: #6499e0;
	color: #fff;
	border-top: 5px solid #0e68e1; 
	z-index: 20;
}



#register_popup_content {
	position: absolute;
	top: 90px;
	left: 230px;
}

#register_popup_content a  {
	color: #fff;
	border-bottom: 1px dotted #fff;
}

#register_popup .close {
	font-size: 75%;
}

#register_popup .button {
	background: #0e68e1;
	border: 3px solid #0b58c1;
	color: #fff;
	padding: 1px 4px;
	font-size: 20px;
	margin: 5px 0 0 0;
}


#register_popup_message {
	margin: 0 0 10px 0;
	font-size: 75%;
}

#register_popup h3 {
	padding: 0 0 10px 0;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
}	

#register_popup label {
	display: block;
	position: relative;
	margin: 0px 0 15px 0;
	font-size: 75%;
	text-transform: lowercase;
}

#register_popup label input.text {
	position: absolute;
	top: 0;
	left: 90px;
	width: 200px;
}







/* general */
a {
	color: #3076D5;
	text-decoration: none;
}

.clear {
	clear:both;
}

.orange {
	color: #eb6325;
}

.hand {
	cursor: hand; cursor: pointer;
}
