/**********************************************/
/* © Copyright  2009 - Xclamation! Web Design */
/***** Main CSS Stylesheet - Version 1.0 ******/
/****** Web: http://www.xclamation.co.uk ******/
/******* Email: admin@xclamation.co.uk ********/
/**********************************************/

* {
margin: 0;
padding: 0;
}

body		{margin: 0;
		padding: 0;
		font-family: Helvetica, Tahoma, Verdana, Arial;
		font-size: 75%;
		background: url('/images/carbontrans.png') center top repeat-y #000;
		/*background: url('/images/xmasbg.jpg') center top no-repeat #000;*/
		
		/*background-color: #000;*/
		width: 100%;
		text-align: center;
}

/***********************************/
/* Rounded Corners and Drop Shadow */
/***********************************/

/****** Container ******/
#mainContainer	{padding: 5px;
				width: 760px;
				margin: 10px auto;
				background: url('/images/blacktrans.png');
				z-index: 1;}
#mainContainer .sb-inner	{background: url('/images/blacktrans.png');}
#mainContainer .sb-border	{background: url('/images/blacktrans.png');}

/****** Main Content ******/
#shadowed-border2 	{padding: 10px;
					margin-left: 135px; 
					margin-right: 135px;
					z-index: 2;}
#shadowed-border2 .sb-inner	{background: #fff;/*background: url('/images/transwhite.png');*/}
#shadowed-border2 .sb-border	{background: #fff;/*background: url('/images/transwhite.png');*/}

/****** Footer ******/
#shadowed-border3 	{padding: .5em;
					margin: 15px 135px 5px 135px;}
#shadowed-border3 .sb-inner {background: #fff;}
#shadowed-border3 .sb-border	{background: url('/images/trans.png');}

/**************************/
/* End of rounded corners */
/**************************/


/******************/
/* Site Structure */
/******************/
#header 	{padding: .5em;
		height: 40px;
}
#logo	{float: left;
	display: block;
	margin: 0px 0px 0px 0px;
	padding: 0;
	overflow: hidden;
	top: -4px;
	left: -5px;
	z-index: 1;
}
#logo img	{border: 0;
			width: 220px;
}

#leftnav	{float: left;
			width: 120px;
			margin: 0px 0px 0px 0px;
			padding: 0;
			clear:both;
}
#rightnav	{float: right;
			width: 135px;
			margin-top: -20px;
			margin-left: 0px;
			padding: 0;			
}
#rightnav h2	{color: #aaa;}

#content	{/*margin-left: 5px;*/
			/*border-left: 1px dotted gray;*/
			/*margin-right: 5px;*/
			/*border-right: 1px dotted gray;*/
			margin: 0;
			padding: 0.1em;
			background: #fff;
			min-height: 640px;
			background-image: url('/images/contentbg.jpg');
			/*max-width: 36em;*/
			
			z-index: 2;
}
/* Footer*/
#footer	{clear: both;
		margin: 0.2em;
		padding: 0;
		
		background-color: #fff;
		font-size: 1.3em;
		font-weight: 600;
		background-image: url('/images/contentbg.jpg');
		/*border-top: 1px solid gray;*/
}
/*#footer a	{font-size: 1em;
			text-decoration: none;
			color: #880;
}
#footer a:hover	{font-size: 1em;
			text-decoration: none;
			color: #880;
			background-color: #aaa;
}*/

/* Copyright */
#copyright	{clear: both;
			margin: 0;
			padding: .5em;
			color: #fff;
			font-weight: bold;
			/*border-top: 1px solid gray;*/
}

.cwlink	{color: #ddd;
		font-weight: bold;
}

#social	{
		position: relative;
		width: 135px;
		display: block;
		float: left;
		margin-top: 40px;
		padding: 0;
		/*border: 1px solid white;*/
		}
#social img	{border: 0;
			text-align: center;
			width: 22px;
			}
#social p	{text-align: center;}
/*********************/
/*********************/





/************************/
/* HTML Tag Definitions */
/************************/


#header h1, p	{color: #fff;
				padding: 0;
				margin: 0;
}

#testimonials hr {
  border: 0;
  width: 80%;
  color: #f00;
  background-color: #f00;
  height: 5px;
}

#shadowed-border #leftnav p, #rightnav p	{margin: 0 0 1em 0;
										color: #ffffff;
}

#shadowed-border #rightnav h2	{font-size: 1.2em;
								margin: 0 0 1em 0;
								color: #aaa;
								text-align: center;
}
#content h1	{font-size: 2em;
			margin: 0 0 .5em 0;
			text-align: left;
			color: #283c80;
}
#content h2	{font-size: 1.4em;
			margin: 0 0 .5em 0;
			text-align: left;
			/*color: #999900;*/
			/*color: #83c0e3;*/
			color: #2f4899;
			
}
#content h3	{font-size: 1.2em;
			margin: 0 0 .5em 0;
			color: #546499;
			padding: 0;
}

#content p	{font-size: 1.1em;
			margin: 0;
			text-align: left;
			color: #000;
			padding: 0;
			margin-bottom: 1em;
}

#content a	{color: #000;
			text-decoration: underline;
}
#content a:hover 	{text-decoration: underline;
					background: url('/images/yellowtrans10.png');
}
#content ul	{margin-bottom: 1em;
			padding-left: 2.5em;}
#content li {text-align: justify;
}
img	{border: 0;
margin: 0;
padding: 0;
}

abbr	{cursor: help;
border-bottom: 1px dotted #aaa;
}
abbr:hover	{border-bottom: 2px dotted #aaa;

}



			
/***** Forms ********/


#contactForm {clear: both;
			display: block;
			padding: 0;
			margin: 0;
}


form	{padding: 0;
	margin: 0;
	display: inline;
	clear:both; 
	
}
fieldset	{position: relative;
		border: 1px dashed #666;
		padding: 0;
		margin: 0;
		display: block;
		background: url('/images/white75.png');
}

legend	{/*width: 5em;*/
		position: absolute;
		font-size: 1.4em;
		font-weight: bold;
		width: 8.5em;
		text-decoration: none;
		text-align: left;
		margin: 1em 0 1em 0;
		padding: 0 .25em 0 .25em;
		display: block;
		background: url('/images/white50.png');
		color: #283c80;
		
}
label	{width: 9.5em;
	float: left;
	margin-right: 0.5em;
	margin-top: 0;
	text-align: right;
	display: inline;
	padding: 0;
}
.smallLabel	{display: inline;
			font-size: .8em;
			
			text-align: left;
			}
input {margin-left: 0em;
	margin-right: auto;
	margin-top: 0;
	background: #fff;
	font-family: Tahoma, Arial, Verdana;
	color: #000;
	border: 1px dotted #000;
	padding: 0;
}
textarea	{margin-left: 0em;
		margin-right: auto;
		margin-top: 0;
		background: #fff;
		font-family: Tahoma, Arial, Verdana;
		font-size: 1em;
		color: #000;
		display: inline;
		border: 1px dotted #000;
		padding: 0;
}
input:hover, textarea:hover, select:hover, option:hover	{background: #ffd;}

.submit input	{margin-left: 9.4em;
			margin-top: 0.2em;
			font-family: Tahoma, Arial, Verdana;
			color: #000;
			background: #aaa;
			border: 1px dotted #000;
			display: inline;
			padding: .2em;
} 
.submit input:hover	{background: #546499;
					color: #fff;}

.radio	{margin-left: 0em;
			margin-top: 0em;
			font-family: Tahoma, Arial, Verdana;
			color: #000;
			background: #eee;
			border: 0px solid #ccc;
			display: inline;
			padding: 0;
}

.checkbox	{margin-left: 0em;
			margin-top: 0em;
			font-family: Tahoma, Arial, Verdana;
			color: #000;
			background: #eee;
			border: 1px solid #ccc;
			display: inline;
			padding: 0;
}
#formail .center	{text-align: center;}
select	{margin-left: 0em;
		margin-right: auto;
		margin-top: 0.2em;
		background: #fff;
		font-family: Tahoma, Arial, Verdana;
		color: #000;
		
		border: 1px dotted #000;
}
option	{/*margin-left: 0em;
		margin-right: auto;*/
		margin: 0;
		background: #fff;
		color: #000;
		
		border: 1px dotted #000;
}
option:hover	{/*margin-left: 0em;
	margin-right: auto;*/
	margin: 0;
	background: #eee;
	color: #000;
	display: block;
	border: 1px solid #000;
}
/***********************/
/***********************/



/**************************/
/* Header Navigation Menu */
/**************************/
#menuHeader ul	{list-style: none;
				padding: 0;
				margin: 0;
				float: right;
				
}
#menuHeader li	{float: left;
			margin: 1px 0.25em;
			/*text-transform: uppercase;*/
			/*width: 100px;*/
			
}
#menuHeader li a:link	{
					height: 2em;
					line-height: 2em;
					float: left;
					/*width: 100px;*/
					display: inline;
					border-bottom: 1px solid #aa0;
					color: #fff;
					font-size: 1.2em;
					font-weight: 600;
					text-decoration: none;
					text-align: center;
}
#menuHeader li a:visited	{height: 2em;
						line-height: 2em;
						float: left;
						/*width: 100px;*/
						display: inline;
						border-bottom: 1px solid #aa0;
						color: #fff;
						font-size: 1.2em;
						font-weight: 600;
						text-decoration: none;
						text-align: center;
}
#menuHeader li a:active	{background-image: url('/images/yellowtrans10.png');
					height: 2em;
					line-height: 2em;
					float: left;
					/*width: 100px;*/
					display: inline;
					border-bottom: 1px solid #ff0;
					color: #ddd;
					font-weight: 600;
					text-decoration: none;
					text-align: center;
}
#menuHeader li a:hover	{background-image: url('/images/yellowtrans10.png');
					height: 2em;
					line-height: 2em;
					float: left;
					/*width: 100px;*/
					display: inline;
					border-bottom: 1px solid #ff0;
					color: #fff;
					font-weight: 600;
					text-decoration: none;
					text-align: center;
}
#menuHeader li a:focus	{color: #ff0;
}
#menuHeader ul li a.selected	{color: #fff;
						border-bottom: 1px solid #ff0;
						background-image: url('/images/yellowtrans10.png');
}
/* Hide from IE5-Mac \*/
#menuHeader li a	{float: none;
				/*padding-left: .25em;*/
				padding-right: .25em;
				/*width: 100px;*/
}
/* End hide */

#menuHeader	{margin: auto;
			float: right;
			width: auto;
} 
/*************************/
/*************************/

/************************/
/* Left Navigation Menu */
/************************/
#nav-menu ul	{list-style: none;
			padding: 0;
			margin: 10px 0px 0px 12px;
}
#nav-menu li	{float: left;
			margin:  0.15em;
			padding: 0.25em 0 0.25em 0;
			width: 110px;
			/*text-transform: uppercase;*/
}
#nav-menu li a		{	height: 2em;
					line-height: 2em;
					float: left;
					width: 110px;
					display: block;
					border-right: 1px solid #aa0;
					color: #fff;
					font-size: 1.2em;
					text-decoration: none;
					text-align: left;
					font-weight: 600;
					/*padding-left: 5px;*/
}
#nav-menu li a:link	{height: 2em;
					line-height: 2em;
					float: left;
					width: 110px;
					display: block;
					border-right: 1px solid #aa0;
					color: #fff;
					text-decoration: none;
					text-align: left;
					font-weight: 600;
}
#nav-menu li a:visited	{height: 2em;
					line-height: 2em;
					float: left;
					width: 110px;
					display: block;
					border-right: 1px solid #aa0;
					color: #fff;
					font-size: 1.2em;
					text-decoration: none;
					text-align: left;
					font-weight: 600;
}
#nav-menu li a:hover	{background-image: url('/images/yellowtrans10.png');
					height: 2em;
					line-height: 2em;
					float: left;
					width: 110px;
					display: block;
					border-right: 1px solid #ff0;
					color: #fff;
					text-decoration: none;
					text-align: left;
}
#nav-menu li a:focus	{color: #ff0;
}
#nav-menu ul li a.selected	{background-image: url('/images/yellowtrans10.png');
						border-right: 1px solid #ff0;
}
/* Hide from IE5-Mac \*/
#nav-menu li a	{float: none;
			width: 110px;
}
/* End hide */

#nav-menu	{width: 110px;
			margin-top: -15px;
			

} 
/*************************/
/*************************/



/*************/
/* Tool Tips */
/*************/
#content .tip	{z-index:10;
		text-decoration:none;
		border-bottom:1px dotted #000;
		color: #000;			
}
#content a.tip:hover	{position:relative;
			z-index:100;
			cursor: help;
			text-decoration: none;
			border-bottom:1px dotted #000;
}			
#content a.tip span	{display:none;
}
#content a.tip:hover span	{display: block;
				position: absolute;
				float: left;
				cursor: help;
				/*white-space: wrap;*/
				font-size: 0.9em;
				font-weight: normal;
				top: 1.2em;
				left: -2em;
				width: 200px;
				/*background-image: url('/images/navback.png');
				background-repeat: repeat;*/
				border:1px solid #ee0;
				color: #000;
				background-color: #fff;
				padding:1px 5px;
				z-index:101;			
}
/********************/
/********************/



/****************/
/* Block Quotes */
/****************/
#testimonials	{margin-top: 1em;

}
q	{color: #aaa;
	font-style: italic;
	display: block;
}
q:hover	{color: #ccc;
}
.blockQuoteBox	{display: block;
			margin-bottom: 0px ;
			font-size: 1em;
			width: 130px;
			color: #aaa;
			background: url('/images/grungebg.png') no-repeat;
			font-weight: 600;
			text-align: left;
			/*border: 1px dotted #666;*/
			padding: 0;
			margin-top: .7em;
}

.blockQuoteBox a	{text-decoration: none;
				text-align: center;
				color: #cc0;
				font-weight: 100;
				padding: 0;
				font-size: 0.8em;}
.blockQuoteBox a:hover  	{color: #ff0;}
.blockQuoteBox a:visited  	{color: #cc0;}
.blockQuoteBox a:active  	{color: #cc0;}
.blockQuoteBox a:focus  	{color: #cc0;
						border: 0px;}


.blockQuoteBox img.blocklt	{vertical-align: bottom;
						text-align: left;
						margin-top: 0px;
						margin-right: 2px;
						display: inline;
						float: left;
}
.blockQuoteBox img.blockrt	{vertical-align: bottom;
						text-align: right;
						margin-top: 0px;
						display: inline;
						float: right;
}

#testimonials  h2	{text-align: center;
			font-size: 1.4em;
			color: #eee;
			margin-bottom: 1em;
			margin-top: 1em;
			
			
}
.blockQuoteBox p	{
				padding: 0;
}


/*****************/
/*****************/

/******************/
/* Special Offers */
/******************/
#offers	{position: relative;
		width: auto;
		display: block;
		float: left;
		margin-top: 0px;
		padding: 0;
}
.offer	{position: relative;
		display: block;
		float: left;
		font-size: 1em;
		/*font-style: italic;*/
		color: #aaa;
		background: url('/images/grungebg2.png') no-repeat;
		text-align: center;
		/*border: 1px dotted #000;*/
		padding: 2px;
		z-index: 1;
		margin: 20px 5px 0px 1px;
		width: 130px;
}


.offer a	{text-decoration: none;
				text-align: center;
				color: #cc0;
				font-size: 1em;
				font-weight: bold;
}
.offer a:hover	{color: #ff0;}

.offer a:active  	{color: #cc0;}
.offer a:focus  	{color: #cc0;
				border: 0px;}

.offer h2	{text-align: center;
			font-size: 1.2em;
			color: #ccc;
			margin-top: -2px;	
}
/*****************/
/*****************/




/***********/
/* Classes */
/***********/

.clearboth	{clear: both
}

.logo	{/*width: 200px;*/
}

#content .question	{background: url('/images/q.png') no-repeat;
			padding-left: 25px;
			height: 25px;
			font-weight: bold;
			padding-top: 0px;
			padding-bottom: 0px;
}

#content .answer	{background: url('/images/a.png') no-repeat;
			padding-left: 25px;
			padding-top: 0px;
			padding-bottom: 1em;
			margin-top: 0;
}

.required	{color: red;}

.alert	{position: relative;
		display: inline;
		color: red;
		margin-left: 14em;/*text-align: right;*/
		vertical-align: top;
		border: 0px solid #000;
		}
.enquiry	{
			display: none;
			}

#content .status	{text-align: center; font-size: .8em; color: #666;}
			
/***************************/
/*** Domain Name Checker ***/
/***************************/			
#domainChecker	{position: relative;
				display: block;
				float: right;
				width: 200px;
				padding: 5px;
}
#domainChecker input	{float: left;
					display: inline;
					margin-left: 5px;
}
.domainOption	{float: left;
				display: inline;
				margin-left: 5px;
				
}
/** END of Domain Name Checker **/





/****************************************/
/******** SOCIAL NETWORK CONTACT ********/
/****************************************/
#contactSocial	{display: block; border: 0px solid #000; height:40px;}
#contactSocial p	{font-size: .9em; text-align: left; margin:0; padding: 0; display:inline;}
#contactSocial a	{font-size: .9em; color: #000; text-decoration: none; font-weight: 100; display: block;}
#contactSocial a:link	{font-size: .9em; text-decoration: none;}
#contactSocial a:hover	{background-image: url('/images/yellowtrans10.png'); text-decoration: none; }
#contactSocial a:visited	{text-decoration: none; }

.twitterContact	{width: 8em; float: left; margin: 0; display: block; text-align: left; font-size: .9em;}
.twitterContact img	{float: right; display:inline}

.facebookContact	{width: 8em; float: right; margin: 0; display: block; text-align: right; font-size: .9em;}
.facebookContact img	{float: left; display:inline; margin: 0 .1em 0 0;}


/***************************************/

/*************************/
/****** PACKAGES *********/
/*************************/
#packages	{display: block;
			margin: 0 ;
			padding: 0;
			width: 100%;
			text-align: left;
			
			
}
#packages h3, p, ul	{
			margin: 0 ;
			padding: 0;
}
#packages ul	{list-style: circle;

}
#packages h2	{color: #546499;}
#packages h3	{font-size: 1.4em;}

#packages p	{font-size: 1em;}
#packages li	{font-size: 1em;}

.package{display: block;
		padding: 0.1em;
		margin-bottom: 1.3em;
		width: 18.5em; 
		border-top: 1px solid #f0f0f0;
		border-left: 1px solid #aaa;
		border-right: 1px solid #aaa;
		border-bottom: 2px solid #aaa;
		background: url('/images/white50.png');
		
		
		/*-moz-border-radius: 7px;
		-webkit-border-radius: 7px; 
		box-shadow: 3px 3px 7px #777; */
}
/***************************/


	

.fl	{float: left;}
.fr	{float: right;}
.cb	{clear: both;}
.cl	{clear: left;}

.cr	{clear: right;}
.center	{text-align: center;}
#content .right	{text-align: right;}

#flare	{position: absolute;
		top: -225px;
		left: 10px;
		height: 495px;
		width: 495px;
		z-index: 100;
}
.e-commerce	{background: url('/images/shopping.png') right top no-repeat;
			}

.contactForm p	{padding: 0;
				margin: 0;
				}

#content .smallcenter	{font-size: .8em;
						text-align: center;
}


.alignLeft	{text-align: left;}

/* Footer Stuff */
.contactNo	{display: inline;
			font-size: 1.4em;
			text-align: center;
			color: #000;
			}
.phoneNo	{display: inline;
			font-size: 1.4em;
			text-align: center;
			color: #283c80;
			}
.statement	{display: block;
			width: 100%;
			height: 1.6em;
			font-size: 1.5em;
			margin-top: 1em;
		}
/*****************/

/* Contact Form ERROR MESSAGE */
#response	{display: none;
			background: url('/images/red.png');
			color: #fff;
			margin: 1em;
			padding: .25em;
			border: 1px dotted #fff;
			text-align: right;}
/* End of Contact Form ERROR MESSAGE */
/* Contact Form ERROR MESSAGE */
#error	{display: block;
			background: url('/images/red.png');
			color: #fff;
			margin: 1em;
			padding: .25em;
			border: 1px dotted #fff;
			text-align: right;}
/* End of Contact Form ERROR MESSAGE */

/* Quotation Form Sections */
/*#webDesignSection	{display: none;}
#reDesignSection	{display: none;}
#eCommerceSection	{display: none;}
#seoSection			{display: none;}
#logoDesignSection	{display: none;}*/
/* End of Quotation Form Sections */			
			
.contactDetails	{font-weight: 600;
				color: #000;
				font-size: 1.2em;}
				
.sitemap li	{margin-bottom: .5em;}

/* Contact Form ERROR MESSAGE */
#noscript	{display: block;
			
			background: url('/images/trans.png');
			color: #fff;
			margin: 1em;
			padding: .25em;
			border: 1px dotted #000;
			text-align: right;}
/* End of Contact Form ERROR MESSAGE */

.noscriptbg	{background: #000;}
#content .error	{display: block;
			background: url('/images/red.png');
			color: #fff;
			margin: 1em;
			padding: .25em;
			border: 1px dotted #fff;
			text-align: center;}
			
#einternet	{position: relative;
			display: block;
			border: 1px solid;
			background: url('/images/yellowtrans10.png');
			
			
			}
#einternet	p {position: relative;
			font-size: .8em;
			}

#footer .smallcenter	{	margin-top: -5px;
						font-size: .6em;
						text-align: center;
						color: #283c80;
}