@import url("reset.css");
@import url("thickbox.css");

body {
	font: 100% Arial, Helvetica, Geneva, sans-serif;
	background: #1b1a20 url(http://hookah-lounger.com/wp-content/themes/PurpleFever/i/bg.jpg) no-repeat center top;
	text-align: center;
	color: #fff;
	padding-bottom: 2em;
}

#wrap,
#header{
	text-align: left;
	width: 800px;
	margin: auto;
}

#header img{
	padding: 50px 0 0;
	width: 400px; 
}

div.phpGoogleStoreLocator_map {
	width: 800px;
	height: 400px;
}

/* This is for the white balloon that pops up on the map when you click on a location icon on the map.  */
.phpGoogleStoreLocator_map_balloon_body {
	font-size: 12px;
	color: #000;
}

/* This is for the white balloon that pops up on the map when you click on a location icon on the map. Font-size cannot be changed here, I dont know why, use the balloon_body class above */

div.markerDetail {
	background-color: white;
	margin: 0;
	padding: 2px 4px;
	border: 1px solid black;
	background: #ddd;
	opacity: none;
}

div.markerDetail *{
	color: #000;
}

/* Google tool tip marker, this is for the tooltip that shows when you hover over an icon on the map. */

div.markerToolTip {
	text-align: center;
	white-space: nowrap;
	margin: 0;
	padding: 2px 0.5ex;
	border: 1px solid #555;
	font-weight: bold;
	background: #fff;
	opacity: none;
	color: #000;
}

.clearboth {
	clear: both;
}

.result,
.comment,
.descrip{
	width: auto;
	padding: 1em;
	background-color: #151418;
	margin:1em 0;
}

.descrip{
	color: #27242c;
}

a{
	color: #c70b3f;
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

.result h1,
.result h2,
table h1{
	font-size: 1.5em;
	float: left;
	width: 400px;
	color: #c70b3f;
}

.result h2.count{
	width: 50px;
}

.result p,
.comment p{
	color: #999;
	clear: both;
	padding-left: 50px;
	font-size: .9em;
	clear:left;
}

.comment p{
	padding:1em;
}

.comment .name{
	padding: 0;
	font-size: x-small;
	text-align: right;
}

.comment h3{
	font-size: 1.2em;
	width: 625px;
	float: left;
	color: #c70b3f;
}

img.ratings{
	padding: .25em 0;
	float: left;
}

.comment img.ratings{
	float: right;
}
 
.storeimage{
	float: right;
	width: 175px;
}

.large{
	width: 350px;
}

div.buttons{
	padding-left:50px;
}
div.buttons a{
	display: block;
	width: auto;
	padding: .5em 1em;
	float: left;
	font-weight: bold;
	color: #b2b2b2;
	font-size: .7em;
	background-color: #27242c;
	margin: 1em 1em 0 0;
}
div.buttons a:hover{
	background-color: #605c66;
	color: #fff;
	text-decoration: none;
}



form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  margin: 0 auto;
  padding: 0;
  min-width: 400px;
  max-width: 600px;
  width: 560px; 
}

form fieldset {
  / * clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  padding: 1em;        /* padding in fieldset support spotty in IE */
  margin: 0 0 1em;
  text-align: left;
	border: 1px #c70b3f solid;
}

form fieldset legend {
	font-size:1.3em;
	color: #c70b3f;
	padding: 0 5px;
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 150px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}

form input, form select, form textarea {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{font-weight:bold;} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}

div.ratingsstars{
	margin-top: 10px;
	padding-left: 50px;
}

label.ratingsstars{
	margin-right: 10px;
}

input.button{
padding:5px;
border: 1px outset #e4597f;
line-height:24px;
color:#FFFFFF;
font-size:12px;
margin:1em;
display:inline-block;
text-decoration:none;
background-color: #c70b3f;
}

input.button:hover{
	background-color: #9f0832;
}

.footer{
	font-size: .7em;
	color: #d5d7d7;
}

#statebrowse td{
	padding: .5em 1em;
	font-size: .9em;
}