BugApp

<div class="title">    
        <h2>{title}</h2>
    </div>

<div class="description">
        
        <p>{description}</p>
         
        <tpl if="currentInsect.type=='Pest'">
            
        <h3>Plants Affected</h3>
        <p>{plantsAffected}</p>
        <h3>Damage</h3>
        <p>{damage}</p>
        <h3>Management</h3>
        <p>{management}</p>
        
        </tpl>
         
        <tpl if="currentInsect.type=='Beneficial'">
        
        <h3>Pests They Control</h3>
        <p>{pestControl}</p>
        <h3>How to Attract</h3>
        <p>{howToAttract}</p>
        
        </tpl>
     
    </div>

<div class="quickInfo">
                 
        <tpl if="currentInsect.actualSize"> 
        
        <div class="imgAndActualSizeContainer">
            
            <div class="adultContainer"> 
            
                <h3>Adult</h3>

</div>

<tpl if="currentInsect.alt">  
            
            <div class="adultContainer"> 
            
                <h3>Adult</h3>

<div class="actualSize {actualSize}">  
                <h3>Actual Length</h3>  
                <div class="actualSizeImg" style="background-position:{actualColPx}px {actualRowPx}px;background-image:url('IMG/BugSprite{spriteFile}.jpg')"></div> 
                <div class="lineContainer {upto}">
                    <div class="line"></div>    
                    <div class="actualSizeNum">- {actualSizeNum}</div>  
                </div>  
                
                <tpl if="currentInsect.alt">  
            
                <div class="actualSizeImg" style="background-position:{altColPx}px {actualRowPx}px;background-image:url('IMG/BugSprite{spriteFile}.jpg')"></div>

</tpl>
                
                <div style="clear:both"></div>

</div>

</div>
            
        </tpl>

<div class="adultContainer"> 
                
                <h3>Larva</h3>

</div>

<div class="actualSize {larvaSize}">
                
                <h3>Actual Length</h3>
                
                <div class="actualSizeImg" style="background-position:{larvaColPx}px {larvaRowPx}px;background-image:url('IMG/BugSprite{spriteFile}.jpg')"></div> 
                
                <div class="lineContainer">
                    <div class="line"></div>
                    <div class="actualSizeNum">- {larvaSizeNum}</div>
                </div>
                  
            </div>
        
        </div>

</tpl>
            
    </div>