@charset "utf-8";
/* Xtraordinary Life CSS written by David McDonagh @ www.illustration-nation.co.uk on behalf of Xtraordinary-Life*/






/*Global structure 
--------------------------------------------------------------------*/

html, body {
	margin:30px 0px 30px 0px;
	height:100%;
	padding: 0;
	background: #fff;
	color: #000000;
	font: 11px Century Gothic,Century Gothic,Century Gothic;
	line-height: 20px;
	}
#container {
	width:1000px;
	height:1440px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}

#containerAbout {
	width:1000px;
	height:600px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}

#containerAreas {
	width:1000px;
	height:2240px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}

#containerCoaching {
	width:1000px;
	height:1360px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}

#containerScribbles {
	width:1000px;
	height:970px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}
	
	#containerScribbles2 {
	width:1000px;
	height:1200px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}
	
#containerTestimonials {
	width:1000px;
	height:1560px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}
	
#moreTestimonials {
	width:1000px;
	height:1150px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}
	
#containerWorkshops {
	width:1000px;
	height:1400px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}

#containerThings {
	width:1000px;
	height:680px;
	margin:0 auto 0 auto;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}


/*Global structure 
--------------------------------------------------------------------*/

div#Nav {
	width:1000px;
	height:46px;
	background-color:#EEEEEE;}
	
div#Nav ul li {
	list-style:none;
	width:120px;
	float:left;
	font-size:14px;
	font-weight:bold;
	border-right:1px dotted #fff;
	text-align:center;}

div#Nav a { outline:0; }

div#Nav a:link, a:visited { 
	color:#000;
	text-decoration:none;}
	
div#Nav a:hover { 
	color:#f842a3;
	text-decoration:none;}

hr.marginal {
    border-top: 1px dotted #00bfff;
	border-left: 1px dotted #fff;
	border-right: 1px dotted #fff;
	border-bottom: 1px dotted #fff;
	height:0;
    margin: 30px 0;}

.vr {
    border-right: 1px dotted #D6D6D6;
    float: left;
    height:145px;
	margin-left:5px;
	margin-right:5px;
    width: 0;}
	
.vr-01 {
    border-right: 1px dotted #D6D6D6;
    float: left;
	margin-left:10px;
	margin-right:10px;
    height:415px;
    width: 0;}
	
.vr-02 {
    border-right: 1px dotted #D6D6D6;
    float: left;
    height:230px;
	margin-left:5px;
	margin-right:5px;
    width: 0;}
	
.vr-03 {
    border-right: 1px dotted #D6D6D6;
    float: left;
    height:145px;
	margin-left:5px;
	margin-right:5px;
    width: 0;}

.vr-04 {
    border-right: 1px dotted #D6D6D6;
    float: left;
	margin-left:5px;
	margin-right:5px;
    height:555px;
    width: 0;}
	
.vr-05 {
    border-right: 1px dotted #D6D6D6;
    float: left;
    height:40px;
	margin-left:5px;
	margin-right:5px;
    width: 0;}


/*Landing Page Elements**********************************************
--------------------------------------------------------------------*/


/*Billboard Landing Page First Tier
--------------------------------------------------------------------*/

div#BillBoard {
	width:900px;
	height:459px;
	margin:20px 0px 20px 49px;}
	
/*introBox & quoteBox Second Tier
--------------------------------------------------------------------*/

div#introBox {
	width:418px;
	height:121px;
	margin:0 10px 0 49px;
	padding:10px;
	float:left;
    background-color: #fff;
	border:1px solid #EEEEEE;}

div#introBox  a { outline:0; }

div#introBox  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#introBox a:hover { 
	color:#f842a3;
	text-decoration:none;}

div#who{
	width:405px;
	height:124px;
	margin-left:10px;
	padding:10px;
	float:left;
	background-color:#ffffff;
	border:1px solid #EEEEEE;}
	
div#who  a { outline:0; }

div#who  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#who a:hover { 
	color:#f842a3;
	text-decoration:none;}
	
/*Landing Page Third Tier
--------------------------------------------------------------------*/

div#clients {
	width:650px;
	height:210px;
	margin:0px 10px 0 49px;
	padding:10px;
	background-color:#FFF;
	border:1px solid #EEEEEE;
	float:left;}
	
img{border:none;}

			
.graphic, #prevBtn, #nextBtn{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-5000px;}

div#clientContainer{	
		margin:0 auto;
		position:relative;
		text-align:left;
		width:550px;
		background:#fff;		
		margin-bottom:2em;}	
				
div#content{position:relative;
		margin-top:20px;}			

#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;}
		
#slider li, { 
		width:550px;
		height:150px;
		overflow:hidden;}
		
#prevBtn, #nextBtn{ 
		display:block;
		width:35px;
		height:77px;
		position:absolute;
		left:-30px;
		top:30px;
		z-index:1000;}
		
#nextBtn { left:550px;}	

#prevBtn a, #nextBtn a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/left-button.png) no-repeat 0 0;}	

#nextBtn a { 
		background:url(../images/right-button.png) no-repeat 0 0;}
		
#testimonial{	
	width:175px;
	height:210px;
	padding:10px;
	float:left;
	margin:0px 0px 0px 10px;
	background-color:#ffffff;
	border:1px solid #EEEEEE;}
	
div#testimonial a { outline:0; }

div#testimonial  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#testimonial a:hover { 
	color:#f842a3;
	text-decoration:none;}


/*say class must be applied to every tesimonial
--------------------------------------------------------------------*/	
.say{ 
	width:880px;
	margin:0px 10px 0px 49px;
	background-color:#ffffff;
        padding:10px;
	border:1px solid #EEEEEE;}


/*Landing Page Fourth Tier
--------------------------------------------------------------------*/

div#contact {
	width:250px;
	height:124px;
	margin:0 10px 0 49px;
	padding:10px;
	float:left;
        background-color:#ffffff;
	border:1px solid #EEEEEE;}

div#contact  a { outline:0; }

div#contact  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#contact  a:hover { 
	color:#f842a3;}

div#forYou {
        float: right;
        height: 124px;
        width: 250px;
	padding:10px;
        margin-left: 10px;
	margin-right:50px;
        background-color:#ffffff;
	border:1px solid #EEEEEE;}
		
div#forYou  a { outline:0; }

div#forYou  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#forYou  a:hover { 
	color:#f842a3;
	text-decoration:none;}

div#promo {
    float: left;
    height: 124px;
    width: 270px;
	padding:10px;
	margin:0px 10px 0px 10px;
    background-color:#ffffff;
	border:1px solid #EEEEEE;}
		
div#promo  a { outline:0; }

div#promo  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#promo  a:hover { 
	color:#f842a3;
	text-decoration:none;}
	
/*Landing Page Fifth Tier
--------------------------------------------------------------------*/

div#follow {
	width:878px;
	height:40px;
	padding:10px;
	margin:20px 0px 20px 49px;
	background-color: #fff;
	border:1px solid #eeeeee;}
	
div#follow  a { outline:0; }

div#follow a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#follow  a:hover { 
	color:#f842a3;
	text-decoration:none;}
	
div#like {
	width:200px;
	height:auto;
	float:left;
	margin-left:20px;}
	
div#tweet {
	width:150px;
	height:auto;
	float:left;
	margin-left:100px;
	margin-top:10px;}

/*About Elements*****************************************************
--------------------------------------------------------------------*/
/*About BJ Haria
--------------------------------------------------------------------*/
	
div#hariaAbout {
	width:450px;
	padding:10px;
    background-color:#FFF;
	margin:0px 0px 0px 49px;
	float:left;
	border:1px solid #eeeeee;}
	
div#haria {
	width:380px;
	padding:10px;
	float:right;
	margin:20px 48px 0px 0px;}


/*Coaching Page Elements**********************************************
--------------------------------------------------------------------*/
/*Coaching - Discover Your Passion
--------------------------------------------------------------------*/

div#coachingIntro{
	width:878px;
	height:auto;
	padding:10px;
	margin:20px 0px 20px 49px;
	background-color: #ffffff;
	border:1px solid #eeeeee;}

div#coachingDev{
	width:398px;
	height:auto;
	padding:10px;
	margin:0px 10px 0px 50px;
	float:left;
	background-color:#FFF;
	border:1px solid #eeeeee;}

div#coachingDev  a { outline:0; }

div#coachingDev  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

div#coachingDev  a:hover { 
	color:#f842a3;
	text-decoration:none;}
	
div#offers{
	width:438px;
	height:auto;
	margin:0px 50px 0px 0px;
	float:right;}
	
div#offer{
	width:415px;
	height:auto;
	padding:10px;
	background-color:#FFF;
	border:1px solid #eeeeee;}
	
div#test{
	width:415px;
	height:auto;
	padding:10px;
	margin:0px 50px 0px 0px;
	background-color:#FFF;
	border:1px solid #eeeeee;}

div#expertise{
	width:878px;
	height:auto;
	padding:10px;
	margin:20px 0px 20px 49px;
	background-color: #ffffff;
	border:1px solid #eeeeee;}


/*Things You May Like Page Elements**********************************
--------------------------------------------------------------------*/
/*Things
--------------------------------------------------------------------*/




/*Scribbles Page Elements********************************************
--------------------------------------------------------------------*/
/*Scribbles
--------------------------------------------------------------------*/

div#scribbles {
	width:880px;
	height:840px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;}

div#scribbles1 {
	width:880px;
	height:570px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;}
	
div#scribbles2 {
	width:880px;
	height:1050px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;}
	
	div#scribbles3 {
	width:880px;
	height:400px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;}
	
div#lowerpage{
	width:100%;
	height:400px;
	background-image:url(../images/xol-fancy-bg.png);
	background-repeat:repeat;}


/*Workshops Page Elements********************************************
--------------------------------------------------------------------*/
/*Current Workshops
--------------------------------------------------------------------*/

div#currentworkshop{
	width:470px;
	height:555px;
	padding:10px;
	margin:0px 20px 30px 50px;
	background-color:#FFF;
	border:1px solid #eeeeee;
	float:left;}
	
div#workshopoffered{
	width:470px;
	height:500px;
	padding:10px;
	margin:0px 20px 30px 50px;
	background-color:#FFF;
	border:1px solid #eeeeee;
	float:left;}
	
div#workshopoffered  a:link, a:visited { 
	color:#000000;
	font-weight:bold;
	text-decoration:none;}

		
div#venue{
	width:330px;
	height:auto;
	padding:10px;
	margin:0px 53px 0px 0px;
	background-color:#FFF;
	border:1px solid #eeeeee;
	float:right;}

div#WSquotes{
	width:330px;
	height:auto;
	padding:10px;
	margin:30px 53px 0px 0px;
	background-color:#FFF;
	border:1px solid #eeeeee;
	float:right;}


div#experience {
	width:880px;
	height:300px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;
    border:1px solid #eeeeee;}
	
	div#workshopimage {
	width:880px;
	height:150px;
	margin:20px 20px 30px 50px;
	padding:10px;
    background-color:#ffffff;
    border:1px solid #eeeeee;}
	


	
/*Design Credits Footer
--------------------------------------------------------------------*/
div#Credits {
	text-decoration:none;
	width:100%;
	text-align:center;
	margin:20px 0px 20px 0px;}