doesn't work

dabblet.css

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200);

body {
background-color:#000;
}
@media (min-width: 1925px) {
#masonry {
        -moz-column-count: 4;
        -webkit-column-count: 4;
        column-count: 4;
        }
}
@media (max-width: 1920px) {
#masonry {
	line-height: 0; /* Prevent vertical gaps */
    -webkit-column-count: 3;
    -webkit-column-gap: 0px;
    -moz-column-count: 3;
    -moz-column-gap: 0px;
    column-count: 3;
    column-gap: 0px;
    }
}
@media (max-width: 800px) {
#masonry {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2;
        }
}
@media (max-width: 400px) {
#masonry {
        -moz-column-count: 1;
        -webkit-column-count: 1;
        column-count: 1;
        }
}

img {
    /* Just in case there are inline attributes */
    width: 100% !important;
    height: auto !important;
}

#posts {
    list-style-type:none !important;
    margin: 0;
    padding: 0;
}


li:first-child {
/* doesn't work */
 opacity:50; 
 filter: alpha(opacity = 50);
}

.postwrapper{
/* overflow:hidden; */
position:relative;
}

.caption{
text-align:center;
		color:#fff;
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 2.5vw;
		line-height:3.5vw;
}

/* Photo post */
li.photopost{
}


.imgcaption{
background-color:#000;
color:#fff;
opacity:0;
filter: alpha(opacity = 0);
width:33%;
position:absolute;
bottom:20%;
right:0;
text-align: left;
padding-right:1vw;
padding-left:.4vw;
padding-top: .3vh;
padding-bottom: .3vh;
}

.postwrapper:hover .imgcaption{
opacity:0.75;
filter: alpha(opacity = 75);
transition:opacity 0.25s;
-moz-transition:opacity 0.25s;
-webkit-transition:opacity 0.25s;
}


/* Text post */
li.textpost {
display:inline-block;
width: 100%;
height: 100%;
background-color:#666;
}

div.centeringcontainer{
display: table;
width: 100%;
height: 35vh;
	text-align: center;
		 background: rgba(6, 6, 6, 0.5);
		 background-image: url({PhotoURL-HighRes});
		 background-size:cover;
}

	div.text{
        display: table-cell;
        vertical-align: middle;
        	padding:2em 2em 2em 2em;
        	font-size: vmax;
}

dabblet.html

<section id="content">
    <section id="masonry">
        <ol id="posts">
            <li class="photopost">
            <div class="postwrapper">
                <a href="#"><img src="http://www.oassf.com/en/media/images/drawings-taylor-swift.jpg" /><a />
                <div class="imgcaption caption">This is a caption</div>
                 </div>
            </li>
            <li class="photopost">
            <div class="postwrapper">
                <a href="#"><img src="http://cathriley.com/innards/tGallery/imageFeed.php?pictureFolder=forSale&picture=drawing-no-10.jpg" /><a />
                                <div class="imgcaption caption">This is a caption</div>
                 </div>
            </li>
           <li class="textpost">
                       <div class="postwrapper">
            <div class="centeringcontainer">
            <div class="text">
                <p class="caption">Some text and things and it's a bit longer and stuff so we have to wrap wtf it doesn't wrap.</p>
                </div>
                </div>
                </div>
            </li>
            <li class="photopost">
                        <div class="postwrapper">
                <a href="#"><img src="http://1.bp.blogspot.com/-Az5LPYfWta0/TjYrL6qLiRI/AAAAAAAAAsM/EOz1Kqrpi-I/s1600/Celebrity+Drawing11.jpg" /><a />
                                <div class="imgcaption caption">This is a caption</div>
                 </div>
            </li>
            <li class="photopost">
                                    <div class="postwrapper">
                <a href="#"><img src="http://idrawgirls.com/images/2011Q4/drawing-lips.jpg" /><a />
                                                <div class="imgcaption caption">This is a caption</div>
                 </div>
            </li>
    </section>
</section>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"90","seethrough":"","prefixfree":"1","page":"all"}