<link rel="stylesheet" href="/static/css/modules/tabsinnerright.css" type="text/css" />

<ul class="tabsInnerRight">
    <li><a href="#about">About</a></li>
    <li><a href="#scripts">Scripts</a></li>
    <li><a href="#connections">Connections</a></li>
    <li><a href="#productions">Productions</a></li>
    <li><a href="#gallery">Gallery</a></li>
    <li><a href="#resources">Resources</a></li>
</ul>    

<div id="about" class="tab_content">
    <h3>Name of Individual</h3>
    <p>Director, Light Designer, Actor</p>
    
    <div>
        bio bio bio bio bio bio bio bio bio <br />
        bio bio bio bio bio bio bio bio bio
    </div>
    
    <br />
    
    <div>Based in: (City)</div>
    <div>Languages I work in: Hindi, Malayalam</div>
    <div>DOB: </div>
    <div>Gender: </div>
    
    <a href="" class="toggleLink">Contact</a>
    <div class="toggleDiv">Some text</div>
    <div class="borderYellow"><br /></div>
    <br />
    
    <div class="borderYellow">
        <h5 class="orangeInnerRight">Training</h5>
        <div>Area of Training, <a href="">Name of Conductor</a>, <a href="">Name of Theatre Group</a>, Location, Year</div>
        <div>Area of Training, <a href="">Name of Conductor</a>, <a href="">Name of Theatre Group</a>, Location, Year</div>
        <div>Area of Training, <a href="">Name of Conductor</a>, <a href="">Name of Theatre Group</a>, Location, Year</div>
        <div>Area of Training, <a href="">Name of Conductor</a>, <a href="">Name of Theatre Group</a>, Location, Year</div>
        <br />
    </div>
    <br />

    <div class="borderYellow">
        <h5 class="orangeInnerRight">Awards</h5>
        <div>Name of award, year, link</div>
        <div>Name of award, year, link</div>
        <div>Name of award, year, link</div>
        <br />
    </div>    
    <br />
    <div>
        <h5 class="orangeInnerRight">More</h5>
        <a href="">Link to article 1</a>
        <div>One line description</div>
    
        <a href="">Link to article 2</a>
        <div>One line description</div>

        <a href="">Link to article 1</a>
        <div>One line description</div>

    </div>    

</div> <!-- end about -->

<div id="scripts" class="tab_content">
    <div>Help text - to send them to script archive</div>
    <br />    
    <a href="toggleLink">Title</a>
    <div>One line description. <span class="toggleDiv">Extra information goes here</span></div>
    <br />

    <a href="toggleLink">Title</a>
    <div>One line description. <span class="toggleDiv">Extra information goes here</span></div>
    <br />

    <a href="toggleLink">Title</a>
    <div>One line description. <span class="toggleDiv">Extra information goes here</span></div>
    <br />

</div> <!-- end scripts -->

<div id="connections" class="tab_content">
<!--    <p><a href="" class="toggleLink">A V Gopalakrishnan</a> Theatre Enthusiast, Mumbai</p>-->

        <h5 class="orangeInnerRight">Member of</h5>
        <br />

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Group</a>
	    <div>Location</div>
	    <div>Relationship to Group</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Group</a>
	    <div>Location</div>
	    <div>Relationship to Group</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Group</a>
	    <div>Location</div>
	    <div>Relationship to Group</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->

    <a href="" class="toggleLink rightFloat">More>></a>

    <div class="clear"></div>

        <h5 class="orangeInnerRight">Worked with</h5>
        <br />

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Person</a>
	    <div>Occupation/one-line desc</div>
	    <div>Location</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Person</a>
	    <div>Occupation/one-line desc</div>
	    <div>Location</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->

        <div class="productionEach">
        	<div class="productionEachImg">
        	    <img src="" alt="/static/images/150x150.jpg" />
        	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Person</a>
	    <div>Occupation/one-line desc</div>
	    <div>Location</div>
	</div>
        <div class="clear"></div> 
  
    </div> <!-- end production each -->
       
    <a href="" class="toggleLink rightFloat">More>></a>    
    
    <div class="clear"></div>
    
    <br />
    
    
</div> <!-- end connections -->

<div id="productions" class="tab_content">

    <h3 class="orange">Productions</h3>
 
    <div class="productionEach">
	<div class="productionEachImg">
	    <img src="" alt="/static/images/150x150.jpg" />
	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Production (2010)</a>
	    <div>Group: Group Name</div>
	    <div><em>Years</em></div>
	</div>
    <div class="clear"></div> 
 
    </div> <!-- end production each -->

    <div class="productionEach">
	<div class="productionEachImg">
	    <img src="" alt="/static/images/150x150.jpg" />
	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Production (2010)</a>
	    <div>Group: Group Name</div>
	    <div><em>Years</em></div>
	</div>
    <div class="clear"></div> 
 
    </div> <!-- end production each -->

    <div class="productionEach">
	<div class="productionEachImg">
	    <img src="" alt="/static/images/150x150.jpg" />
	</div>
	
	<div class="productionEachTextA">
	    <a href="">Name of Production (2010)</a>
	    <div>Group: Group Name</div>
	    <div><em>Years</em></div>
	</div>
    <div class="clear"></div> 
 
    </div> <!-- end production each -->
    

</div> <!-- end productions -->

<div id="gallery" class="tab_content">
    <h3 class="orange">Kindly refer to Gallery tab in Script Archive</h3>
</div>

<div id="resources" class="tab_content">
    <h3 class="orange">Kindly refer to Resources tab in Script Archive</h3>
</div>


<script type="text/javascript" src="/static/js/innertabs.js"></script>
