/*
  Theme Name: Insight Surfer's personalised theme based off the Wordpress Naked theme.Yes, naked, no styles alignement or graphics.
  
  Theme URI: http://code.google.com/p/wordpress-naked/
   
  Author: Ryann Al-lahiq
  Author URI: http://insightsurfer.net
  Tags: sticky, header, fixed footer. Jflow, Slider, portfolio,
  
  
  Description: customised from a bare 'naked' template, then themed and styled according to my design. as its a perspective portfolio
  i focused on a Sticky header and footer.  The awesome dynamic feature of this portfolio is the Jflow slider in the footer.

  CSS is based off a 960 width for content. 
  
  This theme IS NOT YET themed for IE, but works well in FF/safari and chrome and opera
  
  
*/



/* typography and default font controlers  */


 

	html { font:Helvetica, Arial, Sans-Serif;background-repeat: no-repeat!important; background:  #000 url(/images/bgpagewrap.jpg);background-position: center top; background-attachment:fixed; }
.clear {  clear: both;  height: 0;}
	
ul  				{list-style: none;}		
ol 				{list-style: decimal inside;}
a 				{outline: none; text-decoration:none; color:#fff}
a img 			{border: none; outline: none;}
img				{vertical-align: middle; outline: none; }
table				{border-collapse: collapse;}

/*
Utility
*/
	 
.floatLeft		{float: left;}
.floatRight  	{float: right;}
.clear			{clear: both;}

.button			{border: 1px solid #272727; background: red; padding:0px; }
.button:hover 	{background: #C138C4; color: blue; }

 .sumbit-button {background: url(/images/sendcontact.png) no-repeat; display:block;}
 .sumbit-button:hover {background: url(/images/sendcontacthover.png) no-repeat; display:block;}


/*
Utility
*/


* {margin:0; padding: 0;  }


* html body{
  overflow:hidden;
    margin:0 auto;
 } 

 body{
 
  margin:0 auto;
  padding:header-<length> 0 footer-<length> 0;
overflow: hidden; 
			
				
 }
 
 
 #totalpagewrap{width:1150px; margin:0 auto; position; relative;}   /* page wrap width */
 
 
 /*
header
*/
  
		div#header{
    position:absolute;
  top:0;
  left:0;
  width:100%;
	height: 165px;
  height:header-<length>;
  
    
 }

 #header-inner{
	width: 960px;
	height: 165px;
	margin: 0 auto
 }
 


 
  div#footer{
  position:absolute;
  	height:footer-<length>;
  bottom:0;
  left:0;
 margin: 0 auto;
background: url(/images/stickyfooter.png);
background-position:center; 
background-repeat: no-repeat!important;

 height: 220px;
 width:100%;
 padding: 0px;
 z-index:0;
    
 }
  #footer-inside	{
	 
	display:block;
	position: relative;
	 
	margin: 0 auto;
 }
 
div.blogsidebar-content{
  position:absolute;
  height: 220px;
 display:block;
  float:left;
 margin: -30px 0px 0px -270px;
 
    
 }
 
 
 
 
/* absolute sticky settings */

 
 @media screen{
  body>div#header{
   position:fixed;
   
     
  }
  body>div#footer{
   position:fixed;
 
  }
    
 
	
  body>div #column {
		position: fixed;
	overflow-y:scroll;
	overflow-x: hidden;
	z-index: 0;
 
	  }		

	  
  body>div #singlepagecolumn {
		position: fixed;
	overflow-y:scroll;
	overflow-x: hidden;
	z-index: 0;
	  }		 
  
  
  
 }
 
   
 

 
 .bloggraphic{  float: left;   margin: 0 auto; padding: 0px;    
	clear: both;
	  height: 88px;
 width:387px;
	display: block;
	position:relative;
 	background:url(/images/insightsurferfont.png) no-repeat;
	background-position:top;
	cursor: pointer;
    text-indent: -99999px;
 }

 .bloggraphic span.hover{ margin: 0 auto; padding: 0px; 
	position: absolute;
	display: block;
	height: 68px;
 width:387px; 
	background: url(/images/insightsurferfont.png) no-repeat;
	background-position: bottom;
  }  

 
 /* main menus  resize individual items  */

#mainmenuebuttons 		{ float: left; position: relative; margin-left:40px;}
 
 #homebutton 			{ margin: 38px 0px 0px -300px; padding: 0px; }
  
  .homepage  {
	clear: both;
	height:55px; width: 345px; 
	display: block;
	position:relative;
 	background:url(/images/homesprite.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 
 }

 .homepage span.hover { 
	position: absolute;
	display: block;
	height:55px; width: 345px; 
	background: url(/images/homesprite.png) no-repeat;
	background-position: bottom;
  }  
  #blogbutton { margin: -55px 0px 0px -100px; padding: 0px; }
 .blogpage  {
	clear: both;
	height:55px; width: 345px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/blogspritered.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 
 }

 .blogpage span.hover { 
	position: absolute;
	 
	display: block;
	height:55px; width: 345px; 
	background: url(/images/blogspritered.png) no-repeat;
	background-position: bottom;
 
 
 }
 
 
 #resumebutton {  margin: -55px 0px 0px 100px;padding: 0px; }
 
 .resumepage  {
  clear: both;
height:55px; width: 345px; 
display: block;
	position:relative;
 	
 
	background:url(/images/resumespritepurple.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 }

.resumepage span.hover { 
	position: absolute;
	 
display: block;
height:55px; width: 345px; 
	background: url(/images/resumespritepurple.png) no-repeat;
	background-position: bottom;

 }
 
 
 
 
/* social buttons wrapper */
 #socialbuttons{margin:0px auto; float:right;padding: 53px 0px 0px 0px ;}
/* social buttons wrapper */ 

 
#headmastimage		{background-repeat: no-repeat!important; background: url(/images/absoluteheader.jpg);background-position: center top;  background-attachment:fixed;  }  
#top-bar-bloginfo 			{ font-family: verdana,sans-serif; } 
#top-bar-bloginfo p			{font-family: verdana,sans-serif;color: #ffffff; font-size: 12px; margin:0 auto ; width:550px; float: right;  text-align: left;  }


 
 #page-wrapbgcontent		{   }  
 
 #page-wrap		{  margin: 8px auto;    min-width: 960px; max-width:960px; position: relative;    } /* Centers content*/
 



.menu ul{float:left;font-weight:bold; text-transform:uppercase;}
.menu ul li{display:inline; text-transform:uppercase;}
.menu ul li a{color:#fff;text-decoration:none;}
.menu ul li a:hover{color:#4BA5F2;text-decoration:none;}
.menu ul li a.selected{color:#158BB7;}
.current a:link,.current a:visited{color:#158BB7;}
 
 
/* -------------------------social icons-------------------- */

 #facebookicon	 { float: left;     margin: 35px 0px 0px -120px; padding: 0px; }
 .facebook {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/emailsprite.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 
 }

 .facebook span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/emailsprite.png) no-repeat;
	background-position: bottom;
 
 
 }
/* -------------------------twitter------------------- */
 #twittericon	 { float: left;     margin: 35px 0px 0px -50px; padding: 0px; }
 .twitterbadge {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/twitterDefault.png) no-repeat;
	background-position:bottom;
	cursor: pointer;
 
 }

 .twitterbadge span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/twitterDefault.png) no-repeat;
	background-position: 0 0;
 
 
 }

/* -------------------------linked in---------------------- */


 #linkedicon	 { float: left;     margin: 35px 0px 0px -85px; padding: 0px; }
 .linkedinbadge {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/linkedinsprite.png) no-repeat;
	background-position:bottom;
	cursor: pointer;
 
 }

 .linkedinbadge span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/linkedinsprite.png) no-repeat;
	background-position: 0 0;
 
 
 }


 
 /* -------------------------Steam community------------------- */
 
 #steamcommunity	 { float: left;     margin: 35px 0px 0px -955px; padding: 0px; }
 .steamicon {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/steamsprite.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 
 }

 .steamicon span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/steamsprite.png) no-repeat;
	background-position: bottom;
 
 
 }
/* -------------------------lastfm------------------- */
 #lastfmcommunity	 { float: left;     margin: 35px 0px 0px  -920px; padding: 0px; }
 .lastfmicon {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/lastfmsprite.png) no-repeat;
	background-position:0 0;
	cursor: pointer;
 
 }

 .lastfmicon span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/lastfmsprite.png) no-repeat;
	background-position: bottom;
 
 
 }

/* -------------------------quakelive community--------------------- */


 #quakelivecommunity	 { float: left;     margin: 35px 0px 0px -885px; padding: 0px; }
 .quakeliveicon {
	clear: both;
	height:32px; width: 32px; 
	display: block;
	position:relative;
 	
 
	background:url(/images/quakesprite2.png) no-repeat;
	background-position:bottom;
	cursor: pointer;
 
 }

 .quakeliveicon span.hover { 
	position: absolute;
	 
	display: block;
height:32px; width: 32px;  
	background: url(/images/quakesprite2.png) no-repeat;
	background-position: 0 0;
 
 
 }



#searchwidget				{ margin: -30px  0px 0px 10px;   height:16px; 
								float:left; position: relative; padding: 0px; } /* Tweak alignement or icon here*/

.searcharea	 {	} 	 .searchbutton{  height: 16px; width:16px;}
 
 
 
  


/*-----------blog post typography------------*/
.headings{	line-height: 1.2em; letter-spacing: 1px; position: relative; z-index:1;	 color: #4BA5F2; font: bold Helvetica, Arial, Sans-Serif;}
.headings:hover{line-height: 1.2em;	letter-spacing: 1px;position: relative;	z-index:1;  color: #fff;   text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;		-webkit-transition-duration: 0.12s,0.12s, 0.12s;}

.writtencontent{ font-size: 14px;text-align: justify; color: white; font: bold Helvetica, Arial, Sans-Serif;  text-shadow: #000 4px 4px 10px; 	z-index:1;}


.writtencontent:hover { font-size: 14px; text-align: justify; text-shadow: #000 4px 4px 10px;color:#ccc; text-shadow: #ddd 0px 0px 0px; 
				-webkit-transition-property: opacity, text-shadow, color; font: bold Helvetica, Arial, Sans-Serif;
				-webkit-transition-duration: 0.12s,0.12s, 0.12s;  	z-index:1;}
 		
 
		
		.writtencontent a:hover {  font-size: 14px;  font: bold Helvetica, Arial, Sans-Serif;  text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;
		-webkit-transition-duration: 0.12s,0.12s, 0.12s;}
 		
		
		
		
.alternateheadings{ font-weight:bold; color:#ccc; text-shadow: #000 4px 4px 10px;
-webkit-transition-property: opacity, text-shadow, color;
-webkit-transition-duration: 0.12s, 0.12s, 0.12s; }
 
   .alternateheadings a{ color: white; font: bold pt Helvetica, Arial, Sans-Serif;  }
 
 
  .alternateheadings a:hover{ color: white; font: bold pt Helvetica, Arial, Sans-Serif;     text-shadow: 2px 2px #fe4902, 3px 3px #fe4902, 4px 4px #fe4902;
           -webkit-transition-property: opacity, text-shadow, color;
	-webkit-transition-duration: 0.12s,0.12s, 0.12s; 
		   
 }

 #links, #links a{ color: #fff; }
 #links a:hover {   text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;
		-webkit-transition-duration: 0.12s,0.12s, 0.12s;  }

 /*-----------End blog post typography------------*/
 /*-----------singlepage  typography------------*/
 .posttitlectext{text-align: justify; line-height: 1.2em; letter-spacing: 1px; position: relative; z-index:1;	 color: #4BA5F2; font: bold Helvetica, Arial, Sans-Serif;}
 .posttitlectext:hover{line-height: 1.2em;	letter-spacing: 1px;position: relative;	z-index:1;  color: #fff;   text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;
		-webkit-transition-duration: 0.12s,0.12s, 0.12s; }
 
 
 
 .commenttext{text-align: justify; color: white; font: Helvetica, Arial, Sans-Serif; font-weight: normal;  line-height:20pt;}
 
 
 #commentform, .commenttext:hover{text-shadow: #000 4px 4px 10px; color:#ccc; text-shadow: #ddd 0px 0px 0px; 
				-webkit-transition-property: opacity, text-shadow, color;
				-webkit-transition-duration: 0.12s,0.12s, 0.12s; }
				
/*-----------singlepage  typography------------*/				
						
.catagoryheadings{  
font-weight:bold; color:#ccc; text-shadow: #000 4px 4px 10px;
-webkit-transition-property: opacity, text-shadow, color;
-webkit-transition-duration: 0.12s, 0.12s, 0.12s; 
	 
 }
 
   .catagoryheadings a{ color: white; font: bold pt Helvetica, Arial, Sans-Serif;   }
 
 
  .catagoryheadings a:hover{ color: white; font: bold pt Helvetica, Arial, Sans-Serif;     text-shadow: 2px 2px #fe4902, 3px 3px #fe4902, 4px 4px #fe4902;
           -webkit-transition-property: opacity, text-shadow, color;
	-webkit-transition-duration: 0.12s,0.12s, 0.12s; 
		   
 }
 /*-----------comments page typography------------*/
 
.postWrapper{ 
width:110%;
 text-align: justify;
padding: 20px;
border: 2px solid #fff; 
box-shadow: 10px 10px 5px #transparent;  
 }
 
.postWrapper:hover{ 
box-shadow: 10px 10px 5px #ccc;   
 
   border: 2px solid #FE4902; 

 } 
 
 #commentlist{
 width:110%;
 text-align: justify;
padding: 20px;
border: 2px solid transparent; 
 
 }
   #commentlist:hover{
text-align: justify;
 
border: 2px solid transparent; 


  border: 2px solid #6D58B8; 
 }
  
 
 
 
 

	
 
 




 

/* Blog Entries */

 
  #post {
	/* this is the wrapper for your page content,
	so it flows ontop of your background-image div */
	
	z-index:1;
	position: relative;
	overflow: hidden;
}





#background {
 
	position: absolute;
	 max-width: 540px!important;
	width: 100%;
	height: 90%;   /* scale blog post background auto resize*/
	
	top: 0;
	left: 0;
	z-index: -100;
	
	}

	


	 #column {
	
		margin: 150px auto;
		 padding-left: 200px;
		 padding-right:400px;
		 padding-bottom: 0px;
		height:350px;
		clear:both;
		 	z-index: -100;
	 width: 600px;
	  }		 

	 #singlepagecolumn {
	
		margin: 155px auto;	
		 padding-left: 140px;
		 padding-right:400px;
		 padding-bottom: 0px;
		height:400px;
	 width:600px;
	  }		 

	  
	  .singlepagethedateboxwrapper{
	  height: 50px;
	  float:right;padding:0px 0px 0px 100px;
	  margin:0px 0px;
	  }
	 
/********* CSS FOR WRITTEN BLOG CONTENT ***************/ 
/********* blog post alignement resizing controled by padding and margins ***************/  
 
.content {
  margin: 0 auto;
  margin-left: 20px;
  margin-right: 20px;
		color: white;
		padding-top: 15px;
			padding-left:20px;
 			padding-right:50px;
			position: relative;
		text-align: justify;
  	 color: white; font: 14px Helvetica, Arial, Sans-Serif;
 
}
.content:hover {
text-shadow: #000 4px 4px 10px;color:#ccc;
text-shadow: #ddd 0px 0px 0px; 
-webkit-transition-property: opacity, text-shadow, color;
-webkit-transition-duration: 0.12s,0.12s, 0.12s; 
	}
 

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


.thedatebox { border-style:solid;border-color:#ccc; border-width: 1px;   padding:5px; width: 40px; height:65px; float:left;  text-align: center;
   margin: -62px 0px 0px 540px;   color: #fff; font: bold Helvetica, Arial, Sans-Serif; 
   
   -moz-border-radius-topright: 10px; -webkit-border-top-right-radius:10px;

-moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius: 10px; } 
   
   
   .thedatebox:hover {  border-style:solid;border-color:#6D58B8; border-width: 1px; padding:5px; } 

.day   	{ font-size: 2.0em;  font- size  margin: 0 auto;}
.month   {font-size: 1.1em ;    margin: 0 auto; text-transform: uppercase;}
.year  	{font-size: 1.0em; margin: 0 auto }

.day:hover 		{font-size: 2.0em;  font: bold Helvetica, Arial, Sans-Serif;    margin: 0; color: white;   color: #fff;
				text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
				-webkit-transition-property: opacity, text-shadow, color;
				-webkit-transition-duration: 0.12s,0.12s, 0.12s; }
				
.month:hover  	{font-size: 1.1em ;font: arial; font-weight: bold; margin: 0; color: white; text-transform: uppercase;color: #fff;
				text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
				-webkit-transition-property: opacity, text-shadow, color;
				-webkit-transition-duration: 0.12s,0.12s, 0.12s; }
.year:hover 	{font-size: 1.0em; font: arial; font-weight: bold; margin: 0;color: white;  color: #fff;
			text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
			-webkit-transition-property: opacity, text-shadow, color;
			-webkit-transition-duration: 0.12s,0.12s, 0.12s; }

		
		  

     

.post {
	margin: 20px;
	position: relative;
		z-index:1;
		
		
}

.post a {
	color: #2c78b9;
		position: relative;
			z-index:1;
}

.post a:hover {
	color: #4ba5f2;
		position: relative;
			z-index:1;
}

.post-top {
	width: 540px; /********************same as maximum size of post image*******************************/
	height: 10px;
	 
	overflow: hidden;
		z-index:1;
}

.post-bottom {
	width: 540px; /********************same as maximum size of post image*******************************/
	height: 10px;
	 font-size:12pt;	
	overflow: hidden;
		z-index:1;
}

/********************blog post entry font setings*******************************/
.entry {
	
 text-indent:0px;
 
	margin: 0 auto;
	padding-bottom:10px;
	padding-right:30px;
 padding-left:auto;
			padding-top:15px;
		 
		 color: white; font: 14px Helvetica, Arial, Sans-Serif;
		  

}





#entrytitle{

		width:100%;
		padding-left: 30px;
		font-size: 18pt;
		letter-spacing: 1px;
		z-index:1;
		 color: #4BA5F2; font: bold Helvetica, Arial, Sans-Serif;	
			}
			
			
#entrytitle:hover{
font-size: 18pt;
 
 	letter-spacing: 1px;
	 
		z-index:1;
		 
		  color: #fff;
		   text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;
-webkit-transition-duration: 0.12s,0.12s, 0.12s; 
		
}


#entrycontent {
 text-align: justify; text-justify: newspaper ;	
 
 padding: 5px 0px 5px 30px;
 line-height: 20px;
 width: 90%;
font: bold Helvetica, Arial, Sans-Serif;
		z-index:0;
		text-sp
}
/********************blog post entry font setings*******************************/
	

/********* CSS For Post Info Below Header ***************/
.info {
	   width:100%;
	  color:#999999;
		font-size:12pt;
		padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 20px;
	padding-right:0px;
}

#tags{
 font-weight: italic;
 padding-left: 30px;
 padding-top: 20px;
padding-bottom: 20px;
}
#tags a{
font: italic;
color: #ccc;
 padding-top: 20px;
 padding-bottom: 20px;

}

#tags a:hover{
font-weight: italic;
color: white;
 padding-top: 20px;
padding-bottom: 20px;
}


 #cat {
 
 
	padding-left: 30px;
	padding-right:0px;
	
	font-size:10pt;
 
	 color:#999999;
	font: bold Helvetica, Arial, Sans-Serif;
    text-decoration: none;    
           
	
} 

#cat a {

	    color:#999999;
	   	font-size:10pt;	
	  font-weight:bold;
 
	text-shadow: #000 4px 4px 10px;
			text-shadow: #ddd 0px 0px 0px;  
}



  #cat a:hover {
	   color: #fff;
	   	font-size:10pt;	
	   font: bold Helvetica, Arial, Sans-Serif;
		   text-shadow: 1px 1px #FE4902,2px 2px #FE4902, 3px 3px #FE4902;
        -webkit-transition-property: opacity, text-shadow, color;
	-webkit-transition-duration: 0.12s,0.12s, 0.12s; 

}

.commentswrap{   /*--------link to coments page--------------*/
 
float: right;
 

 
margin: 10px 0px 8px 0px;
padding-bottom: 30px;
}

.info .comments {
	float: left;
	
 
}

.info .comments a {

	line-height: 26px;
	 color: white;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 20px;
}


hr {
  border: 0;
  width: 90%;
  color: white
}







/*           Commenting System CSS        */
 
 
 #commentform{
 
 
 
 }
 

#combox {
	border-top: 5px solid #bbb;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 15px;
	padding-right: 15px;
}

h3#respond {

	font-size: 14px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1em;
	padding-bottom: 5px;
	margin-bottom: 2px;
	border-bottom: 1px dotted #ddd;
}


h3#comments {
	font-size: 14px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1em;
	padding-bottom: 5px;
	margin-bottom: 2px;
	border-bottom: 1px dotted #ddd;
}


#commentlink{
color:#fff;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1em;
	padding-bottom: 5px;
}

#commentlink a{
color:#fff;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1em;
	padding-bottom: 5px;

}


#commentlink a:hover{
color:#000;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1em;
	padding-bottom: 5px;
}


ol.commentlist {
	list-style-type: none;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 5px solid #a4d5e5;
}

ol.commentlist li {
	background: #f8fcef;
	border: 1px solid #eee;
	padding: 20px;
	margin-top: 20px;
}

ol.commentlist li.alt {
	background: #FFF;
	border: 1px solid #eee;
	padding: 20px;
	margin-top: 20px;
}

.avatar {
	float: left;
	display: inline;
	width: 32px;
}

.commentbody {
	float: left;
	display: inline;
	margin-left: 20px;
	width: 410px;
}

.commentbody em {
	font-size: 11px;
}



  




 
 
 
 
/* side bars  & widgets */



 
/* concept */ 
#socialsidebar{ float: right!important;  width: 340px; height: 100%;  margin-top: 10px;}   

 
  .blogsidebar-content		{position:relative;      width:200px; height: 309px; display:block; 	z-index:1;}   
  
    
 
 
  .menu ul li, #sidebaralignemnt		{ display:list-item;  padding: 10px 10px; }  
   
 
   #sidebaralignemntbg		{ color:white; margin: 200px 0px 0px 280px;    background: url(/images/minisidebargraphic.jpg) no-repeat;  
   width:240px; height: 309px; display:block;   }  
   


ul.menu { float:left;font-size:1em; font-weight:bold;}
  
  .menu ul li a{float:left;color:#fff;text-decoration:none;text-transform:uppercase;}
  
  
 .menu ul li a:hover{color:#158BB7;text-decoration:none;text-transform:uppercase;}
 .menu ul li a.selected{color:#158BB7;}
   
   
   

/* dynamically customised for this theme in wordpress jflow jquery. */ 
#mySlides, #jFlowSlide{ margin: 0 auto;  width:100%; }



	#myController span{
	text-indent:-10000px;
	display: none;

}



#myController span.jFlowSelected {
 margin: 0 auto; 
position: relative;
}
 
.jFlowPrev{
	float: left;
	width: 30px;
	height: 30px;
	 position: fixed;
	 
	margin:-100px auto;
	text-indent:-10000px;
	cursor:pointer;
	background: transparent url(/images/topslideleft.png) top right no-repeat;
	z-index:1;
}

.jFlowNext{
	float:right;

	width: 30px;
	height: 30px;
	 
	margin: -100px auto;
 

	text-indent:-10000px;
	cursor:pointer;
	background: transparent url(/images/topslideright.png) top left no-repeat;
 

}

 #featuredcontent{
			height: 140px;
			width:600px;
			text-align: justify;  
			padding:10px;
			margin: 0 auto;
 overflow:hidden;
 font-size:14px;	
			float:right;
			
		 
 

}

 


 #featuredcontent a:{
 	   color: #4BA5F2; font: bold Helvetica, Arial, Sans-Serif;
		  
}


 #featuredcontent a:hover{
 	 color: #fff;
	 font: bold Helvetica, Arial, Sans-Serif;
		   text-shadow: 2px 2px #6D58B8,3px 3px #6D58B8, 4px 4px #6D58B8;
        -webkit-transition-property: opacity, text-shadow, color;
-webkit-transition-duration: 0.12s,0.12s, 0.12s; 
}


 
 
  #featuredheading, #featuredheading a{  font-size:20pt;	  }
 
 #featuredheading a:hover{ color: white; font: bold;  }
 
 #featuredthumbs{
 	 padding:5px;
 float:left;
margin-top: 10px;
 
width: 20%!important;
border: 2px solid transparent; 
 } 

#featuredthumbs:hover{
 		 padding:5px;
 
width: 20%!important;
 
   border: 2px solid #FE4902; }
   
   
   
   #browsers{
   color: #999999; font: bold Helvetica, Arial, Sans-Serif;
	height:16px;
   
   display:block;
 
   }