@charset "utf-8";
/* CSS Document */

/* LAST EDITED by Gavin on 21-01-10 13.15*/

/*************************

Layout Colours:

dark grey:		#969088 (background)
light grey:		#e5e4e4
brown paw:		#c18563
orange:			#ff6000

*************************/

body {
	margin: 					0px;
	padding: 					0px;
	height:						100%;
	font-size:					100%;
	line-height:				1.125em;
	background:					#969088;
}
a {
	color:						#f9942a;
	text-decoration:			underline;
}
a:hover {
	color:						#bcbf58;
	text-decoration:			none;
}

h1 {
	font: 						normal 1.1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	color:						#fff;
	margin:						3px 0 3px 0;
}
h2 {
	font: 						normal 1.1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	color:						#000;
	margin:						0 0 0 0;
	padding:					5px 0 10px 0;
	border-bottom:				1px solid #000;
}
h3 {
	font: 						normal 1.1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	color:						#fff;
	margin:						3px 0 3px 0;
}
img {
	border:						0;
}
#quickForm {
	margin:						0;
	padding:					0;
}
A.small_link:Hover {
	font-family: Tahoma, Verdana, sans-serif, Arial, Helvetica; 
	font-size: 10px; 
	line-height: 10px;
	color: #F6921E;
	text-decoration: none;
	}
A.small_link:Link {
	font-family: Tahoma, Verdana, sans-serif, Arial, Helvetica; 
	font-size: 10px; 
	line-height: 10px;
	color: #F6921E;
	text-decoration: underline;
}
A.small_link:Visited {
	font-family: Tahoma, Verdana, sans-serif, Arial, Helvetica; 
	font-size: 10px; 
	line-height: 10px;
	color: #F6921E;
	text-decoration: none;
}
/*KEYWORDS HEADER****************/
div.keyHeader {
	width: 						960px; /*The width of our layout*/
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	position:					relative;
	font: 						normal 0.8em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	/*Margin left and right set to auto center's our layout*/
}
/********************************/

/* HEADER PROPERTIES **************/
div.header {
	width: 						980px; /*The width of our layout*/
	height:						125px;
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	position:					relative;
	background:					#fff url(/images/layout/puppy-pals-head-bg.gif) top left no-repeat;
	/*Margin left and right set to auto center's our layout*/
}
	div.header div.logo {
		margin:					0;
		top:					20px;
		left:					20px;
		position:				absolute;
	}
/*************************************/

/* BODY CONTAINER PROPERTIES **************/
div.bodyContainer {
	width: 						980px; /*The width of our layout*/
	height:						500px;
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	padding:					0 0 0 0;
	position:					relative;
	background:					#e5e4e4 url(/images/layout/body-bg.gif) top left repeat-y;
	/*Margin left and right set to auto center's our layout*/
}
/*************************************/

/*QUICK SEARCH DIV********************/
div.quickSearch {
	width:					945px;
	height:					40px;
	margin:					0px 5px 0 7px;
	background:				#ff6000;
	position:				relative;
	border:					10px solid #fff;
}
	div.quickSearch .searchForQuick {
		font: 				bold 1.1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	}
	div.quickSearch fieldset {
		border:				0;
	}
/*************************************/

/*TOP NAV*****************************/
div.topNav {
	width:					945px;
	padding:				10px;
	background:				#fff;
	margin:					0 7px 0 7px;
	font: 					normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
}
/*************************************/

/*INDEX Content Container*************/
div.contentContainer {
	width: 						980px; /*The width of our layout*/
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	position:					relative;
	background:					#e5e4e4 url(/images/layout/body-bg.gif) top left repeat-y;
}
	div.contentContainer div.contentContainerGrey {
	width: 						960px; /*The width of our layout*/
	margin: 					0px 10px 10px 10px;
	position:					relative;
	background:					#e5e4e4;
}
/*************************************/

/* MAIN FULL WIDTH CONTENT ***********/
div.fullCol {
	width:					945px;
	float:					left;
	background:				#e5e4e4;
}
	div.fullCol div.contentTitleFullCol {
		width:				935px;
		background:			#e5e4e4 url(/images/layout/title-bg.gif) left repeat-x;
		border:				1px solid #999;
		margin-left:		5px;
		padding:			5px 5px 5px 5px;
		position:			relative;
	}
	div.fullCol div.contentFullCol {
		width:				925px;
		background:			#ffffff;
		border-top:			none;
		border-left:		1px solid #999;
		border-right:		1px solid #999;
		border-bottom:		1px solid #999;
		margin-left:		5px;
		padding:			5px 5px 5px 15px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	}


/*************************************/

/*INDEX Content Left Column*************/
div.leftCol {
	width:					560px;
	float:					left;
	background:				#e5e4e4;
}
	div.leftCol div.contentTitleLeftCol {
		width:				540px;
		background:			#e5e4e4 url(/images/layout/title-bg.gif) left repeat-x;
		border:				1px solid #999;
		margin-left:		5px;
		padding:			5px 5px 5px 5px;
		position:			relative;
	}
	div.leftCol div.contentLeftCol {
		width:				530px;
		background:			#ffffff;
		border-top:			none;
		border-left:		1px solid #999;
		border-right:		1px solid #999;
		border-bottom:		1px solid #999;
		margin-left:		5px;
		padding:			5px 5px 5px 15px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	}
	div.contentLeftCol div.memAds {
		float:				left;
		margin:				5px 5px 5px 0;
		padding:5px;
		border:				1px solid #CCCCCC;
		position:			relative;
	}
	div.memAds div.adImage {
		float:				left;
		margin-right:		5px;
		width:				80px;
	}
	div.adImage img {
		width:				50px;
	}
	div.memAds div.adTitle {
		float:				left;
		margin-bottom:		5px;
		width:				380px;
	}
	div.memAds div.adOptions {
		float:				left;
		margin-bottom:		5px;
		width:				380px;
	}
	div.contentTitleLeftCol div.remove_mem_view {
		position:			absolute;
		top:				10px;
		right:				10px;
		height:				10px;
		padding: 			0 0 0 15px;
		background:			url(/images/icons/remove.gif) left no-repeat;
	}
	div.remove_mem_view a {
		font: 				normal 0.6em Tahoma, Verdana, sans-serif, Arial, Helvetica;
		color:				#000;
	}
	div.add_mem_view {
		position:			relative;
		height:				20px;
		padding: 			0 0 0 15px;
		background:			url(/images/icons/add.gif) left no-repeat;
		margin-left:		5px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	}
	div.add_mem_view a {
		color:				#000;
	}
/*************************************/

/*INDEX Content Right Column*************/
div.rightCol {
	width:					390px;
	float:					left;
	background:				#e5e4e4;
}
	div.rightCol div.contentTitleRightCol {
		width:				365px;
		height:				30px;
		background:			#fff;
		margin-left:		10px;
		padding:			5px 0 5px 15px;
		color:				#000;
	}
	div.rightCol div.contentTitleRightCol h1 {
		color:				#000;
	}
	div.rightCol div.contentRightCol {
		width:				365px;
		background:			#fff;
		border-top:			1px solid #999;
		margin-left:		10px;
		padding:			5px 0 5px 15px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;

	}
	
/*************************************/

/*BODY FOOTER*************************/
div.footer {
	width: 						980px; /*The width of our layout*/
	height:						15px;
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	position:					relative;
	background:					url(/images/layout/body-footer.gif) top center no-repeat;
	text-align:					center;
	/*Margin left and right set to auto center's our layout*/
}
div.footerLinks {
	width: 						980px; /*The width of our layout*/
	height:						25px;
	margin-left: 				auto;
	margin-right: 				auto;
	margin-top: 				0;
	margin-bottom: 				0;
	position:					relative;
	text-align:					center;
	font: 						normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	/*Margin left and right set to auto center's our layout*/
}

/*************************************/

/* ######### CSS for Shade Tabs. Remove if not using ######### */

.shadetabs {
padding: 3px 0 0 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 12px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs li {
display: inline;
margin: 0;
}

.shadetabs li a {
text-decoration: none;
position: relative;
top: -11px;
z-index: 1;
padding: 5px 15px 7px 15px;
margin: 0 2px 10px 0;
border: 1px solid #778;
color: #2d2b2b;
background: white url(shade.gif) top left repeat-x;
}

.shadetabs li a:visited{
color: #2d2b2b;
}

.shadetabs li a:hover{
text-decoration: underline;
color: #2d2b2b;
}

.shadetabs li a.selected{ /*selected main tab style */
position: relative;
top: -11px;
padding: 5px 15px 11px 15px;
}

.shadetabs li a.selected { /*selected main tab style */
background-image: url(/images/layout/shadeactive.gif);
border-bottom-color: white;
}
.shadetabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;
}

/************************************/

/*MAIN SEARCH FROM*******************/

div.mainSearchForm {
	border:				1px solid gray;
	width:				920px;
	margin-bottom: 		1em;
	padding: 	  		10px;
	background-color:	#fff;
	font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;

}
div.mainSearchForm fieldset {
	border:				0;
}
div.mainSearchForm .inlineli {
	display:			inline;
}
div.mainSearchForm label {
	width:				110px;
	margin:				0 10px 0 10px;
}
div.mainSearchForm .inputMargin {
	margin:				0 0 0 10px;
}
div.mainSearchForm input {
	margin:				0 0 0 10px;
	font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
}
div.mainSearchForm select {
	margin:				0 0 0 10px;
	font: 				normal 1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
}
/************************************/

/*QUICK SEARCH DIV********************/
div.searchFormDiv {
	width:					945px;
	margin:					20px 15px 20px 17px;
	position:				relative;
}
/**************************************/


/*CREATE ACC FORM**********************/
div.createAccForm {
	width:				520px;
}
div.createAccForm fieldset {
	border:				0;
}
div.createAccForm .inlineli {
	display:			inline;
	margin:				0;
	padding:			0;
	list-style:			none;
}
div.createAccForm label {
	float: left;  
	width: 8em;  
	margin-right: 1em;  
	text-align: left;
}
div.createAccForm .inputMargin {
	margin:				0 0 0 10px;
}
div.createAccForm input, text, select, textarea {
	margin:				0 0 0 5px;
}
div.createAccForm ul {
	margin:				0 0 20px 0;
}
div.createAccForm div.formErrors {
	background:			url(/images/icons/exclamation.gif) left no-repeat;
	padding-left: 		25px;
	height:				20px;
	color:				#fff;
}
div.createAccForm legend {
	font: 						normal 1.6em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	color:						#000;
	margin:						0 0 0 0;
	padding:					5px 0 20px 0;
}
div.createAccForm div.form_legend {
	width:						480px;
	background:					#ccc;
	padding:					10px;
	margin-bottom:				20px;
	background:					url(/images/layout/legend-bg.gif) left repeat-x;
}

/***************************************/


/*ADD OPTIONS***************************/
div.add_advert {
	background:			url(/images/icons/plus.gif) left no-repeat;
	padding: 			5px 0 0 25px;
	height:				40px;
	float:				left;
}
/****************************************/



/**RESULTS PAGE**************************/

div.resultsContainer {
	width:					560px;
	float:					left;
	background:				#e5e4e4;
	margin-top:				15px;
}
	div.resultsContainer div.resultsTitle {
		width:				540px;
		background:			#e5e4e4 url(/images/layout/results-title-bg.gif) left repeat-x;
		border:				1px solid #d90707;
		margin-left:		5px;
		padding:			0 5px 0 5px;
		position:			relative;
	}
	div.resultsTitle div.resultsPrice {
		position:			absolute;
		font: 				normal 1em Tahoma, Verdana, sans-serif, Arial, Helvetica;
		color:				#FFFF00;
		top:				5px;
		right:				10px;
	}
	div.resultsContainer div.resultsContent {
		float:				left;
		width:				540px;
		background:			#fff;
		border:				1px solid #d90707;
		margin-left:		5px;
		padding:			5px 5px 5px 5px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
	}
	div.resultsContainer div.adSaved {
		float:				left;
		width:				500px;
		height:				30px;
		border:				1px solid #d90707;
		margin-left:		5px;
		padding:			15px 0 0 50px;
		font: 				normal 0.75em Tahoma, Verdana, sans-serif, Arial, Helvetica;
		background:			#fff url(/images/icons/tick.gif) left no-repeat;
	}
	div.resultsContent div.resultsImg {
		float:				left;
		width:				130px;
		background:			#fff;
		padding:			5px 5px 5px 5px;
	}
	div.resultsContent div.resultsInfo {
		width:				380px;
		float:				left;
		background:			#fff;
		padding:			5px 5px 5px 5px;
	}
	div.resultsInfo div.descs {
		float:				left;
		background:			#fff;
		width:				380px;
		padding-bottom:     5px;
	}
	div.resultsInfo div.widthDescs {
		float:				left;
		background:			#fff;
		padding-bottom:     5px;
	}
	div.resultsInfo div.widthImages {
		width:				500px;
		float:				left;
		background:			#fff;
		padding-bottom:     5px;
		position:			relative;
	}
	div.widthDescs div.contactInfo {
		float:				left;
		background:			#fff;
		border-right:		1px solid #dd1414;
		padding-bottom:     5px;
		width:				200px;
	}
	div.widthDescs div.contactingInfo {
		width:				300px;
		float:				left;
		background:			#fff;
		padding-bottom:     5px;
		margin-left:		10px;
	}
/****************************************/

/*********MISC***************************/
div.success {
		width:				90%;
		min-height:			30px;
		margin-left:		5px;
		padding:			15px 0 0 50px;
		background:			#fff url(/images/icons/tick.gif) left no-repeat;
		border:				1px solid #00CC00;
}

/*****************************************/

.submit_error {
	background:			url(/images/icons/error.gif) left no-repeat;
	padding-left:20px;
	color:red;
}
.submit_ok {
	background:			url(/images/icons/tick.gif) top left no-repeat;
	padding-left:20px;
	color:green;
}
.submit_inform {
	background:			url(/images/icons/error.gif) top left no-repeat;
	padding-left:20px;
	color: #FF6600;
}
.submit_info {
	background:			url(/images/icons/information.gif) top left no-repeat;
	padding-left: 20px;
	color: #00F;
}
/*************/
div.upload_complete {
	width:	351px;
	height:	28px;
	padding: 12px;
	background:	url(/images/layout/file_upload_complete.gif) top left no-repeat;
	position:	relative;
	margin-bottom:	5px;
}
div.upload_complete div.upload_name {
	width:	296px;
	font: normal 0.9em Verdana, Geneva, sans-serif;
	float:left;
	position:relative;
}
div.upload_complete div.tick_anim {
	width:50px;
	float:left;
	position:relative;
	background:url('/images/icons/tick_anim.gif') right no-repeat;
	z-index:1;
}