<?php include("inc/header.php"); //get the header ?>

<?php include("inc/latest.php"); //get the header ?>

<?php include("inc/sharebox.php"); //get the sharebox ?>

<div class="main-content-left">

	<div class="page-content">
        
        <div class="content-panel">
            
            <h1>Sliders, Toggles, and Tabs</h1>                
                            
            <h6>jQuery Tabbed Content</h6>
            
            <div class="tabs-shortcode">
            
                <ul class="tabnav">
                
                <li><a href="#1">Tab 1</a></li>
                <li><a href="#2">Tab 2</a></li>
                <li><a href="#3">Tab 3</a></li>
                
                </ul>
                
                <div class="tabdiv-wrapper">
                
                    <div id="1" class="tabdiv">
                    
                        <h3>Tab 1</h3>
                        
                        <p>Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.</p>
                    
                    </div>
                    
                    <div id="2" class="tabdiv">
                    
                        <h3>Tab 2</h3>
                        
                        <p>Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.</p>
                    
                    </div>
                    
                    <div id="3" class="tabdiv">
                    
                        <h3>Tab 3</h3>
                        
                        <p>Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.</p>
                    
                    </div>
                
                </div>
            
            </div>            
            
            <div class="divider">&nbsp;</div>
            
            <h6>jQuery Slider</h6>
            
            <div id="shortcode-slider-wrapper">
            
            	<a href="#" class="shortcode-slider-prev">&nbsp;</a>
            
                <div id="shortcode-slider">
                
                    <ul>
                        
                        <li>
                        
                            <a href="#">
                                <img alt="Image Alt" src="http://demos.brianmcculloh.com/swagger/files/2011/11/ipod_nano_2010-300x102.png" />
                            </a>
                            
                            <br />
                            
                            Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo.
                        
                        </li>
                        
                        <li>
                        
                            <div class="box-wrapper success">
                            
                                <div class="box success">
                                
                                Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo.
                                
                                </div>
                            
                            </div>
                        
                        </li>
                        
                        <li>
                        
                            <p>Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.</p>
                            
                            <p>Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo.</p>
                        
                        </li>
                    
                    </ul>
                
                </div>
                
                <a href="#" class="shortcode-slider-next">&nbsp;</a>
            
            </div>
            
            <br class="clearer" />
            
            <div class="divider">&nbsp;</div>
            
            <h6>jQuery Simple Toggles</h6>
            
            <h3 class="toggle">Fusce semper dapibus risus</h3>
            
            <div class="toggle-content">
            
            	Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
            
            </div>
            
            <h3 class="toggle">Fusce semper dapibus risus</h3>
            
            <div class="toggle-content">
            
            	Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
            
            </div>
            
            <h3 class="toggle">Fusce semper dapibus risus</h3>
            
            <div class="toggle-content">
            
            	Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
                
            </div>
            
            <div class="divider">&nbsp;</div>
            
            <h6>jQuery Fancy Toggles</h6>
            
            <div class="toggle-box-wrapper">
            
                <div class="toggle-box">
                
                    <h3 class="toggle">Fusce semper dapibus risus</h3>
                    
                    <div class="toggle-content">
                    
                        Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
                    
                    </div>
                
                </div>
            
            </div>
            
            <div class="toggle-box-wrapper">
            
                <div class="toggle-box">
                
                    <h3 class="toggle">Fusce semper dapibus risus</h3>
                    
                    <div class="toggle-content">
                    
                        Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
                        
                    </div>
                
                </div>
            
            </div>
            
            <div class="toggle-box-wrapper">
            
                <div class="toggle-box">
                
                    <h3 class="toggle">Fusce semper dapibus risus</h3>
                    
                    <div class="toggle-content">
                    
                    Fusce semper dapibus risus, mollis eleifend turpis feugiat vitae. Sed eget lacus sit amet lacus convallis tempus. Donec tempus pretium aliquam. Aenean posuere, dui sed lacinia commodo, quam leo viverra odio, et congue sem nibh et ipsum. Suspendisse potenti. Integer adipiscing sodales eros a facilisis. Etiam eros lectus, fringilla ac porta non, tincidunt ultrices augue. Pellentesque tempus elementum leo, a pellentesque tellus sodales id. Ut auctor congue accumsan. Proin ultricies eros eu ipsum ultricies commodo. Vestibulum imperdiet, mi ac placerat hendrerit, orci leo facilisis dui, a imperdiet neque massa quis lorem.
                    
                    </div>
                
                </div>
            
            </div>            
			            
        </div>      
        
    </div>    
        
    <br class="clearer" />

	<?php include("inc/article-slider.php"); //get the article slider ?>
    
</div>

<?php include("inc/sidebar.php"); //get the sidebar ?>

<?php include("inc/footer.php"); //get the footer ?>