/*------------------------------------------------------------------

project:	Abakat Celebrities
date created:	13 August 2009
author:	Paul Crawford

-------------------------------------------------------------------*/

@import url("baseforms.css");
@import url("thickbox.css");
@import url("sifr.css");


/*-------------------------------*/
/* Reset
/*-------------------------------*/
*, html, body, ul, ol, li, p,
h1, h2, h3, h4, h5, h6,
form, fieldset, a {
	margin: 0;
	padding: 0;
	border: 0;
}

* {	line-height: 1.6em; }

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/*-------------------------------------------    
    Basic Selectors
-------------------------------------------*/
body {
	font-size: 62.5%;
	font-family: Arial, Helvetica, sans-serif;
	background: #f2f2f2 url('../images/core/bg.gif') top center repeat-x;
	color: #323232;
}

a { color: #c77699; text-decoration: none; }
a:hover, a:focus { color: #ac3059; text-decoration: underline; }
span.mailto { color: #ffc9db; }  
a.mailto { color: #c77699; text-decoration: none;  }  
a.mailto:hover { color: #ac3059; text-decoration: underline; }  

h1 { font-size: 2.2em; color: #323232; }
h2 { font-size: 1.6em; color: #4e4e4e; }
h3 { font-size: 1.4em; color: #d76d91; }
h4 { font-size: 1.2em; color: #eb9bb6; }
h5 { font-size: 1.1em; color: #ffc9db; }
h1, h2, h3, h4, h5 { margin-bottom: 0.5em; }
p, ul, ol { margin-bottom: 1.35em; }
p, ul, ol { font-size: 1.2em; }

ul { list-style-type: square; margin-left: 30px; }
ol { margin-left: 30px; }

hr {
	border: 0;
	border-bottom: 1px solid #d9d9d9;
	height: 1%;
	margin: 15px 0;
	^margin: 0 0 10px 0; /* IE 7 */
}

a img.left {
	float: left;
	margin: 0 15px 15px 0;
	border: 3px solid #fbdae5;
	clear: left;
}

a img.right {
	float: right;
	margin: 0 0 15px 15px;
	border: 3px solid #fbdae5;
	clear: right;
}

a:hover img.left,
a:hover img.right {
	border: 3px solid #c44972;
}




/*-------------------------------*/
/* Container
/*-------------------------------*/
#container {
	width: 922px;
	margin: 0 auto;
}


/*-------------------------------*/
/* Header
/*-------------------------------*/
#header {
	height: 418px;
	position: relative;
}

#header h1 {
	width: 395px; height: 171px;
	background: url('../images/core/logo_abakat.gif') no-repeat;
	text-indent: -9999px;
	display: block;
	position: absolute;
	top: 25px; left: 6px;
}



/*-------------------------------*/
/* Nav
/*-------------------------------*/
#nav {
	width: 408px; height: 30px;
	position: absolute;
	top: 40px; right: 18px;
}

#nav ul { 	
	list-style-type: none;
	margin: 0;
}

#nav ul li {
	display: block;
	float: left;
}

#nav ul li a {
	float: left;
	overflow: hidden;
	text-indent: -9999px;
	height: 30px;
	margin-right: 10px;
}

#nav ul li a.home {
	width: 70px;
	background: url('../images/nav/nav_home.gif') 0 0 no-repeat;
}

#nav ul li a.fees {
	width: 59px;
	background: url('../images/nav/nav_fees.gif') 0 0 no-repeat;
}

#nav ul li a.services {
	width: 71px;
	background: url('../images/nav/nav_services.gif') 0 0 no-repeat;
}

#nav ul li a.contact {
	width: 85px;
	background: url('../images/nav/nav_contact.gif') 0 0 no-repeat;
}


/* -- Rollover -- */
#nav ul li a:hover.home,
#nav ul li a:hover.fees,
#nav ul li a:hover.services,
#nav ul li a:hover.contact {
	background-position: 0 -30px !important;
}

/* -- Active -- */
#nav li a:hover.home, 
body#home #nav li a.home,
body#profile #nav li a.fees,
body#services #nav li a.services,
body#contact #nav li a.contact {
	background-position: 0 -30px !important;
}


/*-------------------------------*/
/* Banner
/*-------------------------------*/
#banner {
	width: 714px; height: 326px;
	display: block;
	position: absolute;
	top: 92px; right: 0;
}

#banner img {
	width: 714px; height: 326px;
}


/*-------------------------------*/
/* Content
/*-------------------------------*/
#content-container {}

#content {
	width: 627px;
	float: left;
	padding: 20px 50px 20px 25px;
}

#content h1 {
	width: 600px; height: 22px;
	text-indent: -9999px;
}

body#home #content h1 { background: url('../images/titles/welcome.gif') no-repeat; }
body#fees #content h1 { background: url('../images/titles/services.gif') no-repeat -121px 0; }
body#services #content h1 { background: url('../images/titles/services.gif') no-repeat; width: 95px; }
body#contact #content h1 { background: url('../images/titles/contact.gif') no-repeat; }


/* --- left side --- */
#left-side {
	width: 220px;
	float: left;
}

/* --- services button --- */
#services-button {
	margin: 4px 0 0 1px;
}

#services-button a {
	width: 202px; height: 78px;
	background: url('../images/core/services_button.jpg') no-repeat;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}

#services-button a:hover {
	background-position: 0 -78px !important;
}

/* --- contact details --- */
#contact-details {
	padding: 33px 0 0 15px;
}

#contact-details h2 {
	width: 60px; height: 13px;
	background: url('../images/titles/h2contact.gif') no-repeat;
	text-indent: -9999px;
}

#contact-details ul {
	list-style-type: none;
	margin: 0;
}

#contact-details ul li {
	padding: 0 0 0 20px;
}

#contact-details ul li.phone { background: url('../images/core/icon_phone.gif') 0 3px no-repeat; }
#contact-details ul li.mobile { background: url('../images/core/icon_mobile.gif') 0 3px no-repeat; }
#contact-details ul li.email { background: url('../images/core/icon_email.gif') 0 3px no-repeat; }


/*-------------------------------*/
/* Footer
/*-------------------------------*/
#footer-container {
	background: url('../images/core/bg_footer.gif') top center repeat-x;
	height: 53px;
}

#footer {
	width: 683px;
	margin: 0 auto;
	padding: 12px 0 0 240px;
	color: #ffffff;
	font-size: 1.1em;
}

#footer a { color: #ffffff; text-decoration: none; padding: 0 3px; }
#footer a:hover { color: #fbdae3; text-decoration: underline; }

.wflogo {
	width: 70px; height: 23px;
	float: right;
}


/* --- CSS Sticky Footer --- */

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, #container { height: 100%; }

body > #container { height: auto; min-height: 100%; }

#content-container { padding-bottom: 53px; }  /* must be same height as the footer */

#footer {
	position: relative;
	/*margin-top: -53px;  negative value of footer height*/ 
	clear: both;
}


/*-------------------------------*/
/* Other Pages
/*-------------------------------*/

/* --- contact --- */
#contact-box { 
	height: 390px;
	border-bottom: 1px solid #ccc;
}

.map {
	width: 350px;
	float: right;
}

#contact-box ul {
	list-style-type: none;
	margin: 0;
}

#contact-box ul li {
	padding: 0 0 0 20px;
}

#contact-box ul li.phone { background: url('../images/core/icon_phone.gif') 0 3px no-repeat; }
#contact-box ul li.mobile { background: url('../images/core/icon_mobile.gif') 0 3px no-repeat; }
#contact-box ul li.email { background: url('../images/core/icon_email.gif') 0 3px no-repeat; }

#enquiry {
	padding-top: 2em;
}

#enquiry ol { margin: 0; }

