/*
Theme Name: City Hypnosis
Theme URI: http://wordpress.org/
Description: Theme for cityhypnosis.com
Author: Leigh Share & Lawrie Malen @ Pixel Pudding
Author URI: http://www.pixelpudding.com/
*/

html, body {
	background-color: 		#30302D;
	font-family: 				Trebuchet MS;
	font-size: 					13px;
	color: 						#4A5457;
	margin:						0px;
	padding:						0px;
}

#container {
	width:						900px;
	margin-left:				auto;
	margin-right:				auto;
}

#headercontainer {
	width:						100%;
	height:						235px;
	margin:						0px;
	background-image:			url('./img/headerbg.png');
	background-repeat:		repeat-x;
	text-align:					center;
}

#htmlheader {
	position:					relative;
	width:						1024px;
	height:						220px;
	margin-left:				auto;
	margin-right:				auto;
}

#htmlheader .logo {
	position:					absolute;
	left:							75px;
	top:							160px;
}

#htmlheader ul {
	position:					absolute;
	left:							325px;
	top:							170px;
	list-style:					none;
	padding:						0px;
	clear:						both;
	margin:						0px;
}

#htmlheader ul li {
	float:						left;
	margin-right:				30px;
	font-size:					16px;
	color:						#FFFFFF;
}

#htmlheader ul li a, #htmlheader ul li a:visited {
	color:						#FFFFFF;
	text-decoration:			none;
}

#htmlheader ul li a:hover {
	color:						#034E7E;
}

/*
	CONTENT
*/

#content {
	float:						left;
	width:						625px;
	background-image:			url('./img/tablebg.png');
	background-repeat:		repeat-y;
	margin-bottom:				10px;
}

#postcontainer {
	float:						left;
	width:						625px;
}

.post {
	width:						625px;
	background-image:			url('./img/tablebg.png');
	background-repeat:		repeat-y;
	margin-bottom:				10px;
	margin-bottom:				10px;
}

#content .top, .post .top {
	width:						625px;
	height:						25px;
	background-image:			url('./img/tabletop.png');
	background-repeat:		no-repeat;
}

#content .bottom, .post .bottom {
	width:						625px;
	height:						25px;
	background-image:			url('./img/tablebottom.png');
	background-repeat:		no-repeat;
}

#content .entry, .post .entry {
	position:					relative;
	width:						585px;
	margin-left:				20px;
	clear:						both;
}

#content .entry h2, .post .entry h2 {
	color:						#373F40;
	font-size:					22px;
	margin:						0px;
}

/*
	3D-style titles
*/

.titlebox {
	float:						left;
	height:						85px;
	margin-left:				-13px;
	background-image:			url('./img/titleleft.png');
	background-repeat:		no-repeat;
	background-position:		top left;
}

.titlebox .strip {
	float:						left;
	height:						85px;
	margin-left:				17px;
	padding-right:				10px;
	background-image:			url('./img/titlestrip.png');
	background-repeat:		repeat-x;
}

.titlebox .strip h2 {
	margin:						0px;
	padding:						18px 0px 0px 10px;
}

.titlebox .strip h2.lightblue {
	color:						#81A6BE;
	margin:						0px;
	padding:						18px 0px 0px 10px;
}

.titlebox .strip h3 {
	font-size:					12px;
	margin:						0px;
	margin-top:					-5px;
	padding:						0px 0px 0px 10px;
}

.titlebox .strip h4 {
	font-size:					12px;
	margin:						0px;
	margin-top:					-5px;
	padding:						0px 0px 0px 15px;
}

.titlebox .end {
	float:						left;
	width:						17px;
	height:						85px;
	background-image:			url('./img/titleend.png');
	background-repeat:		no-repeat;
	background-position:		top left;
}

/*
	SIDEBAR
*/

#sidebarcontainer {
	float:						right;
	width:						260px;
}

#sidebar, #searchbox, #sidecontact, #twitter, .sidebox { /* A reusable class makes much more sense, you dummy */
	width:						260px;
	background-image:			url('./img/sidebg.png');
	background-repeat:		repeat-y;
	margin-bottom:				15px;
}

#sidecontact {
	position:					relative;
}

#sidebar .top {
	width:						260px;
	height:						25px;
	background-image:			url('./img/sidetop.png');
	background-repeat:		no-repeat;
}

#sidebarcontainer .bottom {
	width:						260px;
	height:						25px;
	background-image:			url('./img/sidebottom.png');
	background-repeat:		no-repeat;
	clear:						both;
}

#sidebarcontainer .content {
	width:						220px;
	margin:						10px 0px 0px 20px;
}

.sidesep {
	width:						220px;
	height:						10px;
	margin:						10px 0px 5px 0px;
	background-image:			url('./img/sidesep.png');
	background-repeat:		no-repeat;
	clear:						both;
}

/*
	TWITTER HEADER
*/

#twitter .top {
	width:						260px;
	height:						32px;
	background-image:			url('./img/twittertop.png');
	background-repeat:		no-repeat;
}

/*
	FACEBOOK LOGO
*/

#facebook {
	height:							30px;
	line-height:					30px;
	margin-top:						10px;
}

#facebook img {
	float:							left;
	margin-right:					10px;
}

/*
	SIDEBAR NEWS BOX
*/

#sidenews .top {
	width:						260px;
	height:						32px;
	background-image:			url('./img/newstop.png');
	background-repeat:		no-repeat;
}

/*
	SIDEBAR CONTACT FORM
*/

#sidecontact .top {
	width:						260px;
	height:						32px;
	background-image:			url('./img/contacttop.png');
	background-repeat:		no-repeat;
}

#sidecontact .submitbutton {
	position:					absolute;
	bottom:						4px;
	right:						3px;
	width:						65px;
	height:						29px;
}

#sidecontact form {
	width:						220px;
}

#sidecontact form .formField {
	display:						block;
	width:						220px;
	overflow:					none;
	margin-bottom:				5px;
}

#sidecontact form .formField label {
	float:						left;
	width:						auto;
}

#sidecontact form .formField input {
	float:						right;
	width:						130px;
	background-color:			#ECECEC;
	border:						1px dotted #5F6B70;
}

#sidecontact form .formField .radio {
	float:						left;
	margin-right:				30px;
}

#sidecontact form .formField .tinyinput {
	float:						none;
	width:						20px;
	background-color:			#FFFFFF;
	border:						none;
	color:						#FFFFFF;
}

#sidecontact form .formField select {
	float:						right;
	width:						130px;
	background-color:			#ECECEC;
}

#sidecontact form .formField textarea {
	float:						right;
	width:						220px;
	height:						100px;
	background-color:			#ECECEC;
	border:						1px dotted #5F6B70;
	margin-bottom:				10px;
}

/*
	SEARCH BOX
*/

#searchbox {
	position:					relative;
}

#searchbox .top {
	width:						260px;
	height:						32px;
	background-image:			url('./img/searchtop.png');
	background-repeat:		no-repeat;
}

#searchbox form {
	border:						0px;
	padding:						0px;
	margin:						10px 0px 0px 0px;
}

#searchbox .searchinput {
	width:						220px;
	height:						30px;
	background-color:			#ECECEC;
	border:						1px dotted #5F6B70;
	font-size:					16px;
	line-height:				30px;
	margin-bottom:				20px;
}

#searchbox .button {
	position:					absolute;
	bottom:						4px;
	right:						3px;
	width:						65px;
	height:						29px;
}

/*
	TREATMENTS & DOWNLOADS SIDEBAR
*/

#sidebar .top.treatments {
	width:						260px;
	height:						32px;
	background-image:			url('./img/treatmentstop.png');
	background-repeat:		no-repeat;
}

#sidebar .top.downloads {
	width:						260px;
	height:						32px;
	background-image:			url('./img/downloadstop.png');
	background-repeat:		no-repeat;
}

#pagedisplay {
	float:						left;
	width:						200px;
}

#sidebar ul, #pagedisplay {
	margin:						0px;
	padding-left:				20px;
	list-style:					disc url('./img/sidebullet.png');
}

#sidebar li, #pagedisplay li {
	margin:						0px;
	padding:						0px;
	font-size:					11px;
	color:						#4A5457;
}

#pagedisplay li {
	text-indent:				10px;
	padding-left:				10px;
}

#sidebar li a, #pagedisplay li a {
	color:						#4A5457;
	line-height:				10px;
	text-decoration:			none;
	border-bottom:				1px dotted #4A5457;
	display:						block;
	padding:						7px 0px 7px 0px;
}

#pagedisplay li a:hover {
	background-color:			#EEEEEE;
}

/*
	FOOTER
*/

#footer {
	height:						30px;
	margin:						10px 0px 10px 0px;
	border-top:					1px dashed #4A5457;
	color:						#606A6C;
	clear:						both;
}

#footer #nav {
	float:						left;
	margin-top:					5px;
}

#footer #pixel {
	float:						right;
	text-align:					right;
	margin-top:					5px;
}

#footer a, #footer a:hover {
	color:						#606A6C;
	text-decoration:			none;
}

/*
	GOOGLE MAPS
*/

#contactmap {
	width:						573px;
	height:						350px;
	border:						4px solid #EEEEEE;
}

/*
	VIDEO HOMEPAGE
*/

.videodisplay {
	width:						585px;
}

.videodisplay .thumb {
	position:					relative;
	float:						left;
	width:						240px;
	height:						160px;
	background-image:			url('./img/videothumb.jpg');
	background-repeat:		no-repeat;
}

.videodisplay .thumb img {
	position:					absolute;
	top:							15px;
	left:							15px;
}

.videodisplay .thumb .blocklink {
	position:					absolute;
	top:							15px;
	left:							15px;
	display:						block;
	width:						210px;
	height:						130px;
	border:						1px solid red;
}

.videodisplay .thumb .preview {
	position:					absolute;
	top:							125px;
	left:							15px;
	width:						210px;
	height:						20px;
	color:						#FFFFFF;
	text-align:					center;
}

.videodisplay .thumb .blackbar {
	-moz-opacity:				0.7;
	-khtml-opacity:			0.7;
	opacity:						0.7;
	filter:						alpha(opacity=70);
	background-color:			#000000;
}

.videodisplay .textcontent {
	float:						right;
	width:						305px;
	margin-right:				20px;
}

.videodisplay .textcontent .title {
	border-bottom:				1px dotted #999999;
}

.videodisplay .textcontent select {
	float:						right;
}

.videodisplay .textcontent form button {
	float:						right;
	width:						120px;
	height:						37px;
	margin:						10px -2px 0px 0px;
	padding:						0px;
	border:						0px;
	background-color:			transparent;
	background-image:			url('./img/addbutton.png');
	background-repeat:		no-repeat;
	background-position:		center top;
	text-indent:				-1000em;
	cursor:						pointer;
}

/*
	CHECKOUT FORM
*/

#checkoutform button {
	float:						right;
	width:						120px;
	height:						37px;
	margin:						10px -2px 0px 0px;
	padding:						0px;
	border:						0px;
	background-color:			transparent;
	background-image:			url('./img/checkoutbutton.png');
	background-repeat:		no-repeat;
	background-position:		center top;
	text-indent:				-1000em;
	cursor:						pointer;
}

#checkoutform button.greyedout {
	background-image:			url('./img/checkoutgrey.png');
}

/*
	LIGHTBOX
*/

#lightbox {
	display:						none;
	position:					fixed;
	top:							0%;
	left:							0%;
	width:						100%;
	height:						100%;
	background-color:			black;
	z-index:						1001;
	-moz-opacity:				0.8;
	opacity:						.80;
	filter:						alpha(opacity=80);
}

#lightboxcontent {
	display:						none;
	position:					fixed;
	top:							50%;
	left:							50%;
	margin-top:					-210px;
	margin-left:				-340px;
	width:						680px;
	height:						420px;
	background-color:			transparent;
	z-index:						1002;
	overflow:					auto;
}

/*
	CHECKOUT
*/

#loginBox {
	background-color:			#D2DFEE;
	border:						1px dotted #5F6B70;
	margin:						10px;
	padding:						5px 10px 5px 10px;
}

#loginBox .title {
	width:						250px;
}

#loginBox #logindiv {
	float:						left;
	width:						250px;
}

#loginBox #regBox {
	float:						right;
	width:						250px;
}

#loginBox form p, #loginBox #regBox form p {
	display:						block;
	padding:						10px 0px 10px 0px;
	clear:						both;
}

#loginBox form label, #loginBox #regBox form label {
	float:						left;
	width:						120px;
}

#loginBox form input, #loginBox #regBox form input {
	float:						right;
	width:						120px;
}

#loginBox form .login-remember label {
	width:						250px;
}

/*
	CHECKOUT CART DISPLAY
*/

.cartlist {
	width:						585px;
}

.cartlist .item {
	padding:						5px 0px 5px 20px;
	background-image:			url('./img/cartarrow.png');
	background-repeat:		no-repeat;
	background-position:		center left;
	border-bottom:				1px dotted #CCCCCC;
}

.cartlist .item.titlebar {
	background:					none;
	color:						#034E7E;
	font-weight:				bold;
}

.cartlist .item .num {
	float:						left;
	width:						30px;
	margin-right:				5px;
}

.cartlist .item .itemtitle {
	float:						left;
	width:						320px;
	margin-right:				5px;
}

.cartlist .item .license {
	float:						left;
	width:						80px;
	margin-right:				5px;
}

.cartlist .item .price {
	float:						left;
	width:						80px;
}

.cartlist .item .delete {
	display:						block;
	float:						right;
	width:						18px;
	height:						18px;
	background-image:			url('./img/delete.png');
	background-repeat:		no-repeat;
	background-position:		top left;
}

.cartlist .item .delete:hover {
	background-position:		bottom left;
}

.cartlist .item .delete span {
	display:						none;
}

/*
	RE-USABLES
*/

.alert {
	background-color:			#D2DFEE;
	border:						1px dotted #5F6B70;
	margin:						10px;
	padding:						5px 10px 5px 10px;
}

.searchleft {
	float:						left;
	width:						200px;
}

.searchright {
	float:						right;
	width:						200px;
	text-align:					right;
}

.sep, hr {
	width:						585px;
	height:						10px;
	background-color:			#FFFFFF;
	background-image:			url('./img/sep.png');
	background-repeat:		no-repeat;
	border:						0px;
	margin:						10px 0px 10px 0px;
	clear:						both;
}

.title {
	color:						#034E7E;
	font-size:					16px;
	font-weight:				bold;
}

.sep hr {
	display:						none;
}

.short {
	width:						325px;
}

.bigger {
	font-size:					16px;
}

.smaller {
	font-size:					10px;
}

.blue {
	color:						#034E7E;
}

.right {
	text-align:					right;
}

.left {
	text-align:					left;
}

.center {
	text-align:					center;
}

img.right {
	float:						right;
	margin:						0px 0px 10px 10px;
	clear:						both;
}

img.left {
	float:						left;
	margin:						0px 10px 10px 0px;
	clear:						both;
}

.bottomright {
	position:					absolute;
	right:						-16px;
	bottom:						-21px;
}

.display {
	border:						4px solid #EEEEEE;
}

.clear {
	clear:						both;
}

/*
	ELEMENTS
*/

img {
	border:						0px;
}

input, textarea, select {
	font-family: 				Trebuchet MS;
}

blockquote {
	background-color:			#ECECEC;
	border:						1px dotted #5F6B70;
	margin:						10px;
	padding:						5px 10px 5px 10px;
}

blockquote.blue, blockquote .blue {
	color: 						#373F40;
}

blockquote .smaller {
	text-align:					right;
}

a {
	color:						#034E7E;
}

a:visited {
	color:						#373F40;
}

p {
	margin-top:					0px;
}