Trying to add title and caption to photo posts on Tumblr. What's wrong with my code??

/What am I doing wrong? I am using post-title and caption tags. Right now, the post-title gets duplicated and posted as the caption.

Here is my HTML:

{block:Photo} <div class="col">

{block:caption} <div class="post-title">{caption}</div> {/block:caption} {/block:Photo} {block:IndexPage} {block:IfShowDateInPosts} {block:Date} <div class="col">{12Hourwithzero}&#58;</div> <div> {/block:Date} {/block:IfShowDateInPosts} {/block:IndexPage} {LinkOpenTag} <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/> {LinkCloseTag} </div> <div> {block:caption} <div class="caption">{Caption}</div> {/block:caption} </div> <div id="post"> <ul class="like_and_reblog_buttons"> <li>{ReblogButton}</li> <li>{LikeButton}</li> </ul> {/block:Photo} 

Here is my CSS:

.photo .post-title * { display: none; }

.photo .post-title :first-child { display: block !important; }

.photo .caption { display: block; } .photo .caption > :first-child { display: none !important; }

Epic visual tool

Epson 5030UB 2D/3D 1080p 3LCD Projector Submitted November 03, 2015 at 07:20AM by NutEllaMonster123 http://ift.tt/20pMtRF