<style>

/*Responsive Embeds
 ===*/
.embed-container { 
    position: relative; 
    padding-bottom: 56.25% !important;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    } 
    .embed-container iframe,
    .embed-container object,
    .embed-container embed { 
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.embed-container-sq { 
    position: relative; 
    padding-bottom: 0;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
    } 
    .embed-container-sq iframe,
    .embed-container-sq object,
    .embed-container-sq embed { 
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/*Grid Container
===*/
.dfg-width {
    max-width: 768px;
    margin: 0 auto;
}

.dfg-container {
    white-space: nowrap;
        margin: 0 0.5% 0 0.5%;
        clear: both;
        padding: 0.5% 0 45px 0;
}

/*Grid Item Style
===*/
.dfg-item {  
    float: left;
    font-family: 'Open Sans', sans-serif;
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
        overflow: hidden;
}

/*Grid Item Icon Position and Sizing
===*/
.dfg-icon {
        padding-bottom: 20px;
        font-size: 3em;
    position: absolute; 
    top: 45%; 
    left: 50%; 
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
}

/*Grid Item Title Position
===*/
.dfg-title {
    position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
}

/*Grid Item Border Radius
===*/
.square {
    border-radius: 0px;
}

.rounded {
    border-radius: 15px;
}

/*Grid Item 2 Row Height Float Status
===*/
.left {
    float: left;
}

.right {
    float: right;
}

    /*Grid Item Sizes
    ===*/
    .dfg-1col-1row {
        width: 24%;
        margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 24%;
    }

    .dfg-2col-1row {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 24%;
    }

    .dfg-3col-1row {
        width: 74%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 24%;
    }

    .dfg-4col-1row {
        width: 99%;
        margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 24%;
    }

    .dfg-1col-2row.left {
        width: 24%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 48.6%;
    }
    .dfg-1col-2row.right {
        width: 24%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 49%;
    }
        .dfgv-2col-2row.left,
        .dfg-2col-2row.left {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 48.6%;
    }
    .dfgv-2col-2row.right,
        .dfg-2col-2row.right {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 49%;
    }
   
    .dfg-3col-2row.left {
        width: 74%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 48.6%;
    }
    .dfg-3col-2row.right {
        width: 74%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 49%;
    }
    
    .dfgv-video,
    .dfg-4col-2row {
        width: 99%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 49%;
    }

    .dfg-1col-3row.left {
        width: 24%;
                margin: 0.4%;
        position: relative;
                height: 0;
        padding-bottom: 73.3%;
    }
    .dfg-1col-3row.right {
        width: 24%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 74%;
    }

    .dfg-2col-3row.left {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 73.3%;
    }

    .dfg-2col-3row.right {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 74%;
    }

    .dfg-3col-3row.left {
        width: 74%;
        margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 73.3%;
    }

    .dfg-3col-3row.right {
        width: 74%;
        margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 74%;
    }

    .dfg-4col-3row {
        width: 99%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 74%;
    }

    .dfg-slider,
        .dfg-logo {
        width: 99%;
                margin: 0.5%;
        position: relative;
    }

.dfg-item img,
.dfg-logo img {
	max-width: 100%;
}
    
/*    .dfg-address {
                font-size: 16px !important;
                padding: 45px 0 0 0;
                text-align: center;
                clear: both;
        } 
        .dfg-address h5 {
             white-space: normal;
             padding: 0 3% 0 3%;
        }
        */

/*Desktop Tile Size Adjustments
===*/
@media (min-width:1281px) {
       .dfg-1col-2row.left {
        width: 24%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 48.9%;
    }


       .dfgv-2col-2row.left,
        .dfg-2col-2row.left {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 48.9%;
    }


   
    .dfg-3col-2row.left {
        width: 74%;
                margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 48.9%;
    }



    .dfg-1col-3row.left {
        width: 24%;
                margin: 0.4%;
        position: relative;
                height: 0;
        padding-bottom: 73.9%;
    }



    .dfg-2col-3row.left {
        width: 49%;
        margin: 0.5%;
        position: relative;
                height: 0;
                padding-bottom: 73.9%;
    }


    .dfg-3col-3row.left {
        width: 74%;
        margin: 0.5%;
        position: relative;
                height: 0;
        padding-bottom: 73.8%;
    }

}


/*Icon Sizing
===*/
.dfg-2col-2row .dfg-icon,
.dfg-3col-2row .dfg-icon,
.dfg-4col-2row .dfg-icon {
    font-size: 3.75em;
}

.dfg-2col-3row .dfg-icon,
.dfg-3col-3row .dfg-icon,
.dfg-4col-3row .dfg-icon {
    font-size: 4.5em;
}   

/*
i.fa.fa-mobile {
    font-size: 1.25em;
    line-height: 1.25em;
    padding-top: 0.25em;
}
*/

</style>

<?php

 //start app output 
 		    echo '<div class="dfg-width">';
		    echo '<div class="dfg-container">';
                foreach ($df_app_data as $df_app) {
                   //show only app with specific name
                    if ($df_app->df_app_name == $df_app_name) {

if ($df_app->app_btn_bkg_color4 == '') {   
    //single row and four column buttons
	if ($df_app->app_btn_size == '1col-1row' || $df_app->app_btn_size == '2col-1row' || $df_app->app_btn_size == '3col-1row' || $df_app->app_btn_size == '4col-1row' || $df_app->app_btn_size == '4col-2row' || $df_app->app_btn_size == '4col-3row') {
		//button with icon and no alignment
		 if ($df_app->app_btn_image_upload == '' && $df_app->app_btn_icon != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with image and no alignment
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with icon and image and no alignment
		 if ($df_app->app_btn_icon != '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="' . $dfg_shape . '" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with no icon and no image and no alignment
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload == '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'"></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
	}
    
    //all other buttons with positioning or alignment
    if (  $df_app->app_btn_size == '1col-2row' || $df_app->app_btn_size == '2col-2row' || $df_app->app_btn_size == '3col-2row' || $df_app->app_btn_size == '1col-3row' || $df_app->app_btn_size == '2col-3row' || $df_app->app_btn_size == '3col-3row') {
		//button with icon
		 if ($df_app->app_btn_image_upload == '' && $df_app->app_btn_icon != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with image
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with icon and image
		 if ($df_app->app_btn_icon != '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="' . $dfg_shape . '" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
        }
		//button with no icon and image
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload == '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color.';">
                    <div title="'.$df_app->app_btn_title.'"></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
	}
}
	
	
if ($df_app->app_btn_bkg_color4 != '') {	
    //single row and four column buttons
	if ($df_app->app_btn_size == '1col-1row' || $df_app->app_btn_size == '2col-1row' || $df_app->app_btn_size == '3col-1row' || $df_app->app_btn_size == '4col-1row' || $df_app->app_btn_size == '4col-2row' || $df_app->app_btn_size == '4col-3row') {
		//button with icon and no alignment
		 if ($df_app->app_btn_image_upload == '' && $df_app->app_btn_icon != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with image and no alignment
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with icon and image and no alignment
		 if ($df_app->app_btn_icon != '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="' . $dfg_shape . '" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with no icon and no image and no alignment
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload == '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'"></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
	}
    
    //all other buttons with positioning or alignment
    if (  $df_app->app_btn_size == '1col-2row' || $df_app->app_btn_size == '2col-2row' || $df_app->app_btn_size == '3col-2row' || $df_app->app_btn_size == '1col-3row' || $df_app->app_btn_size == '2col-3row' || $df_app->app_btn_size == '3col-3row') {
		//button with icon
		 if ($df_app->app_btn_image_upload == '' && $df_app->app_btn_icon != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with image
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
		//button with icon and image
		 if ($df_app->app_btn_icon != '' && $df_app->app_btn_image_upload != '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'" class="dfg-icon" style="color: '.$df_app->app_btn_icon_color.';"><i class="'.$df_app->app_btn_icon_weight.' '.$df_app->app_btn_icon.'"></i></div>
                    <img alt="'.$df_app->app_btn_image_alt_tag.'" class="' . $dfg_shape . '" src="'.$df_app->app_btn_image_upload.'" />
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
        }
		//button with no icon and image
		 if ($df_app->app_btn_icon == '' && $df_app->app_btn_image_upload == '') {
			echo '<a title="'.$df_app->app_btn_link_alt_tag.'" href="'.$df_app->app_btn_link.'" target="'.$df_app->app_btn_link_target.'">
                <div class="dfg-item '.$df_app->app_btn_shape.' dfg-'.$df_app->app_btn_size.' '.$df_app->app_btn_position.'" style="background: '.$df_app->app_btn_bkg_color4.';">
                    <div title="'.$df_app->app_btn_title.'"></div>
                    <div class="dfg-title" style="color: '.$df_app->app_btn_title_color.';">'.$df_app->app_btn_title.'</div>
                </div>
            </a>';
		 }
	}	
}	
	
	
	
	
	
	//display logo element
    if (  $df_app->app_btn_title == 'Logo') {
		//square logo element
		 if ($df_app->app_btn_size == 'dfg-logo') {
		     echo '<div class="dfg-item logo '.$df_app->app_btn_size.'"><img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" /></div>';
		 }
		//rectangle and tall logo element
		 if ($df_app->app_btn_size == 'dfg-2col-2row' || $df_app->app_btn_size == 'dfg-2col-3row' ) {
		     echo '<div class="dfg-item logo '.$df_app->app_btn_size.' '.$df_app->app_btn_position.'"><img alt="'.$df_app->app_btn_image_alt_tag.'" class="'.$df_app->app_btn_shape.'" src="'.$df_app->app_btn_image_upload.'" /></div>';
		 }
    }

	//display LayerSlider element
    if (  $df_app->app_btn_title == 'LayerSlider') {
        $df_ls_no = $df_app->app_btn_link;
        echo '<div class="dfg-item dfg-slider">';
        echo ''.layerslider( $df_ls_no ) .'';
        echo '</div>';
    }
    
	//display Vimeo Video element
    if ($df_app->app_btn_title == 'Vimeo Video') {
        $df_vimeo_video = $df_app->app_btn_link;
		    if ($df_app->app_btn_size == 'dfgv-video') {
		        echo '<div class="dfg-item embed-container dfgv-video">';
                echo '<iframe src="https://player.vimeo.com/video/'.$df_vimeo_video.'" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>';
                echo '</div>';
            }
		    if ($df_app->app_btn_size == 'dfgv-2col-2row') {
		        echo '<div style="background: #000000;" class="dfg-item embed-container-sq dfgv-2col-2row '.$df_app->app_btn_position.'">';
                echo '<iframe src="https://player.vimeo.com/video/'.$df_vimeo_video.'" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>';
                echo '</div>';
            }
    }
		  
                        }
                    }
		   //end app output
		    echo '</div>';
		    echo '</div>';


            ?>