<style>
.quotes a, .quotes a:link, .quotes a:active, .quotes a:visited {
	color: #00a3ec;
}
.quotes a:hover {
	color: #00b8ff;
}
.testimonials {
	min-height:50px !important;
	width:100%;
	text-align: center;
	background:none;
	/*background:url(/static/images/Hero3.jpg) no-repeat center center fixed; */
	background-size: cover;
	/*background-size: 100% auto;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-color: #fff;
	color: #03b5ff;
	text-shadow: 1px 1px 1px rgba(255,255,255,.3);
	padding: 10px 0px 10px;
	font-family:Montserrat, 'Open Sans',Montserrat-Light, sans-serif;
	font-weight: 300;
	font-size: 18px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.fwc {
	width: 100%;
	height: auto;
	padding: 0;
}

/* ######################### */
/*          iPads            */
/* ######################### */

@media (max-width: 1024px) {
    .testimonials { /*background:url(/static/images/Hero3.jpg) no-repeat center center; background-size: cover;*/ } 
}

/* ######################### */
/* Landscape phones and down */
/* ######################### */

@media (max-width: 480px) {
    .testimonials { /*background:url(/static/images/Hero3.jpg) no-repeat center center; background-size: cover; */} 
}

</style>

    <div class="fwc testimonials" style=""> 
        <div class="container_12">
            <div class="grid_12">   
				<h3 style="font-family: Montserrat,'Open Sans',Raleway,Oswald,Helvetica,Verdana,sans-serif; 
					text-align:center; text-transform:uppercase; margin-bottom:0px; padding-bottom:0px; 
					font-size:11px; color:#000;">
					RECENT LISTINGS
				</h3>
				<ul style="list-style:none; margin-block-start: .2em;
    			margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px;
    			padding-inline-start: 0px;">
                <?php
					//echo "<pre>";
					//print_r($testimonials);
				
                	foreach ($recent as $tes) { 
                
                ?>
					<li class="quotes" style="width:auto; overflow:hidden; font-weight:500">       
						<a href="/project/<?= $tes['id'] ?>"><?= $tes['title'] ?>
							<i class="fa fa-angle-right" aria-hidden="true"></i></a>
                    </li>
                <?php
                }
                ?>          
                </ul>               
            </div>
            <div class="clear"></div>           
        </div>
        <div class="clear"></div>
    </div>
    <div class="clear"></div>
    
<script type="text/javascript">
$(document).ready(function() {
	
	// TESTIMONIALS & RECENT CONTENT ITEMS
	var quotes = $(".quotes");
	var quoteIndex = -1;

	function showNextQuote(){
		++quoteIndex;
		quotes.eq(quoteIndex % quotes.length)
		.fadeIn(2000)
		.delay(2000)
		.fadeOut(2000, showNextQuote);
	}

	showNextQuote();

});
</script>	    