/*Stylesheet developed for Tharani Associates Ltd by Ndogoworks, March 2013*/
/*For more information about these stylesheet, contact info[at]ndogoworks.com*/

@font-face {
    font-family: 'AsapRegular';
    src: url('fonts/Asap-Regular-webfont.eot');
    src: url('fonts/Asap-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Asap-Regular-webfont.woff') format('woff'),
         url('fonts/Asap-Regular-webfont.ttf') format('truetype'),
         url('fonts/Asap-Regular-webfont.svg#AsapRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
 width: 1000px;
 margin-right: auto;
 margin-left: auto;
 text-align: right;
 margin-top: 20px;
 font-family: sans-serif;
}

#header {
 width: 250px;
 float: left;
 text-align: left;
 padding-top: 9px;
 color: #104E8B;
 font-size: 1.2em;
 height: 36px;	
 font-weight: bold;
}

#navbar {
 width: 749px;
 float: right;
 height: 45px;
 font-size: 1.1em;
}

#navbar ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	}
	
#navbar li {
  width: 16.66%;
  text-align: center;
  padding-top: 9px;
  padding-bottom: 12px;
		float: left;	
	}
	
#navbar a {
  display: block;
  color: #104E8B;
  text-decoration: none;
  margin-left: auto;
  margin-right: auto;
	}
	
#navbar a:hover {
	 color: #000;	
}

#sidebar {
 width: 247px;
 margin-top: 1px;
 padding-top: 8px;
 padding-bottom: 8px;
 float: left; 	
 font-size: 0.9em;
 text-align: left;
 padding-left: 3px;
}

#sidebar ul {
 list-style-type: none;
 margin: 0;
 padding: 0;	
}

#sidebar li {
	display: block;`
	width: 225px;	
	margin-bottom: 12px;
}

#sidebar a {
 color: #104E8B;
 text-decoration: none;	
}

#sidebar a:hover {
 color: #000;	
}

#sidebar h1 {
 font-size: 1em;
 padding: 0px;
 margin: 0px;
 padding-bottom: 12px; 
}

#sublinks a {
  color: #606060;
}

#main {
  width: 724px;
  margin-top: 1px;
  padding-top: 8px;
  padding-bottom: 8px;
  float: right;
  font-size: 1.1em;
  padding-left: 25px;  
  text-align: left;
}

#footer {
	width: 1000px;
 /*bottom: 0;*/
 float: right;
 text-align: left;
 margin-top: 40px;
 margin-bottom: 20px;
 color: #808080;
 font-size: 0.8em;
}

#footer a {
  color: #808080;
  text-decoration: none;	
}
	
#footer a:hover {
  color: #000;	
}
	
/* gallery styles start ---------------------------------------------------- */


.pikachoose {
 width: 700px; 
 /*margin: 0 auto;*/
}

/* Style the thumbnails */

.pika-thumbs{ 
 padding: 0 16px; 
 height: 75px; 
}

.pika-thumbs li{ 
 width: /*144*/ 113px; 
 height:74px; 
 /*margin: 10px 0 0 17px;*/ 
 overflow: hidden;
 float: left; 
 list-style-type: none;
 padding: 3px; 
 /*margin: 0 5px;*/ 
 /*background: #fafafa;*/ 
 /*border: 1px solid #e5e5e5;*/ 
 cursor: pointer;
}

.pika-thumbs li .clip {
 position:relative;
 height:100%;
 text-align: center; 
 vertical-align: middle; 
 overflow: hidden;
}
	
/* The stage is the wrapper. The image fills 100% the height of the stage */

.pika-stage, .pika-textnav {
 width: 700px;
}

.pika-stage {
 position: relative; 
 /*background: #fafafa;*/ 
 /*border: 1px solid #e5e5e5;*/ 
 /*padding: 10px 10px 40px 10px;*/
 text-align:center; 
 height:460px;
}

.pika-stage img{
 height:100%;
}

.pika-stage .caption {
 position: absolute; 
 background: #000; 
 background: rgba(0,0,0,0.75);  
 border: 1px solid #141414; 
 font-size: 11px; 
 color: #fafafa; 
 padding: 10px; 
 text-align: right; 
 bottom: 10px; 
 right: 10px;
}

.pika-stage .caption p {
 padding: 0; 
 margin: 0; 
 line-height: 14px;
}

/* Ths play, pause, prev and next buttons */

.pika-imgnav a {
 position: absolute; 
 text-indent: -5000px; 
 display: block;
 z-index:3;
}

.pika-imgnav a.previous {
 background: url(lib/prev.png) no-repeat left 45%; 
 height: 100%; 
 width: 50px; 
 top: /*10*/ 305px; 
 left: 1px;
 cursor:pointer;
}

.pika-imgnav a.next {
 background: url(lib/next.png) no-repeat right 45%; 
 height: 100%; 
 width: 50px; 
 top: /*10*/ 305px; 
 right: 1px;
 cursor:pointer;
}

.pika-imgnav a.play {
 background: url(lib/play.png) no-repeat 0% 50%; 
 height: 100px; 
 width: 44px;
 top:0;
 left:50%;
 display: none;
 cursor:pointer;
}

.pika-imgnav a.pause {
 background: url(lib/pause.png) no-repeat 0% 50%; 
 height: 100px; 
 width: 44px;
 top:0;
 left:50%;
 display:none;
 cursor:pointer;
}

/* The previous and next textual buttons */

.pika-textnav {
 overflow: hidden; 
 margin: 10px 0 0 0;
 bottom:10px; 
 position:absolute;
 display: none;
}

.pika-textnav a {
 font-size: 12px; 
 text-decoration: none; 
 color: #333; 
 padding: 4px;
}

.pika-textnav a.previous {
 float: left; 
 width: auto; 
 display: block;
}

.pika-textnav a.next {
 float: right; 
 width: auto; 
 display: block;
}

/*for the tool tips*/

.pika-tooltip{
 font-size:12px;
 position:absolute;
 color:white; 
 padding:3px; 
 background-color: rgba(0,0,0,0.7);
 border:3px solid black;
}

.pika-counter{
 position: absolute;
 bottom: 45px;
 left:15px;
 color:white;
 background:rgba(0,0,0,0.7);
 font-size:11px;
 padding:3px;
 -moz-border-radius: 5px;
 border-radius:5px;
 display: none;
}

/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */		

.pika-loader{ 
 background:url(loading.gif) 3px 3px no-repeat #000; 
 background-color:rgba(0,0,0,0.9); 
 color:white; 
 width:60px; 
 font-size:11px; 
 padding:5px 3px; 
 text-align:right; 
 position:absolute; 
 top:15px; 
 right:15px; 
}

.jcarousel-skin-pika .jcarousel-container-horizontal { 
 padding: 15px 20px; 
 overflow:hidden;
 margin-left: 25px;
 margin-right: 25px;
 /*width: 600px;*/	
}

.jcarousel-skin-pika .jcarousel-clip-horizontal {
 height: 90px; 
 width: 485px;
}

.jcarousel-skin-pika .jcarousel-item-horizontal { 
 margin-right: 14px;
}