@extends('master')

@section('content')

<section id="title_breadcrumbs_bar">
    <div class="container clearfix">
        <div class="floatleft">
            <h1>Laboratorium</h1>
        </div>
    </div>
</section>

<section>
    <div class="container ">
        <div class="row portfolio_4column portfolio_4column_gallery">
            <div class="portfolio_full_width span12 content ">
                <div class="row">
                                            <div class="span3">
                            <div class="portfolio_inner_content">
                                <div class="portfolio_item">
                                    <div class="overlayed">
                                        <img width="1200" height="715" src="{{ asset('assets/upload/portfolio7.jpg') }}" class="attachment-post-thumbnail wp-post-image" alt="portfolio7" />
                                        <a class="overlay" href="{{ url('/laboratory/contoh-laboratorium') }}">
                                            <p class="overlay_title">
                                                Laboratorum {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                lorem ipsum dolor amet
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="{{ url('/laboratory/contoh-laboratorium') }}">Laboratorium {{ $i }}</a></h6>
                                    <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Lorem Ipsum dolor amet</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                                            <div class="span3">
                            <div class="portfolio_inner_content">
                                <div class="portfolio_item">
                                    <div class="overlayed">
                                        <img width="1200" height="715" src="{{ asset('assets/upload/portfolio7.jpg') }}" class="attachment-post-thumbnail wp-post-image" alt="portfolio7" />
                                        <a class="overlay" href="{{ url('/laboratory/contoh-laboratorium') }}">
                                            <p class="overlay_title">
                                                Laboratorum {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                lorem ipsum dolor amet
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="{{ url('/laboratory/contoh-laboratorium') }}">Laboratorium {{ $i }}</a></h6>
                                    <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Lorem Ipsum dolor amet</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                                            <div class="span3">
                            <div class="portfolio_inner_content">
                                <div class="portfolio_item">
                                    <div class="overlayed">
                                        <img width="1200" height="715" src="{{ asset('assets/upload/portfolio7.jpg') }}" class="attachment-post-thumbnail wp-post-image" alt="portfolio7" />
                                        <a class="overlay" href="{{ url('/laboratory/contoh-laboratorium') }}">
                                            <p class="overlay_title">
                                                Laboratorum {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                lorem ipsum dolor amet
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="{{ url('/laboratory/contoh-laboratorium') }}">Laboratorium {{ $i }}</a></h6>
                                    <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Lorem Ipsum dolor amet</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                                            <div class="span3">
                            <div class="portfolio_inner_content">
                                <div class="portfolio_item">
                                    <div class="overlayed">
                                        <img width="1200" height="715" src="{{ asset('assets/upload/portfolio7.jpg') }}" class="attachment-post-thumbnail wp-post-image" alt="portfolio7" />
                                        <a class="overlay" href="{{ url('/laboratory/contoh-laboratorium') }}">
                                            <p class="overlay_title">
                                                Laboratorum {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                lorem ipsum dolor amet
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="{{ url('/laboratory/contoh-laboratorium') }}">Laboratorium {{ $i }}</a></h6>
                                    <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Lorem Ipsum dolor amet</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                                            <div class="span3">
                            <div class="portfolio_inner_content">
                                <div class="portfolio_item">
                                    <div class="overlayed">
                                        <img width="1200" height="715" src="{{ asset('assets/upload/portfolio7.jpg') }}" class="attachment-post-thumbnail wp-post-image" alt="portfolio7" />
                                        <a class="overlay" href="{{ url('/laboratory/contoh-laboratorium') }}">
                                            <p class="overlay_title">
                                                Laboratorum {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                lorem ipsum dolor amet
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="{{ url('/laboratory/contoh-laboratorium') }}">Laboratorium {{ $i }}</a></h6>
                                    <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Lorem Ipsum dolor amet</span>
                                    </p>
                                </div>
                            </div>
                        </div>
                                    </div>
                <div id="blog_pagination" class="pagination pagination-centered clearfix">
                    <span class='page-numbers current'>1</span>
                    <a class='page-numbers' href='#'>2</a>
                    <a class="next page-numbers" href="#"><i class="ci_icon-chevron-right"></i></a>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- End Featured Portfolio -->
@endsection

@push('after-script')
<script type="text/javascript">
    /******************************************
					-	PREPARE PLACEHOLDER FOR SLIDER	-
				******************************************/


    var setREVStartSize = function() {
        var tpopt = new Object();
        tpopt.startwidth = 1170;
        tpopt.startheight = 520;
        tpopt.container = jQuery('#rev_slider_1_1');
        tpopt.fullScreen = "off";
        tpopt.forceFullWidth = "off";

        tpopt.container.closest(".rev_slider_wrapper").css({
            height: tpopt.container.height()
        });
        tpopt.width = parseInt(tpopt.container.width(), 0);
        tpopt.height = parseInt(tpopt.container.height(), 0);
        tpopt.bw = tpopt.width / tpopt.startwidth;
        tpopt.bh = tpopt.height / tpopt.startheight;
        if (tpopt.bh > tpopt.bw) tpopt.bh = tpopt.bw;
        if (tpopt.bh < tpopt.bw) tpopt.bw = tpopt.bh;
        if (tpopt.bw < tpopt.bh) tpopt.bh = tpopt.bw;
        if (tpopt.bh > 1) {
            tpopt.bw = 1;
            tpopt.bh = 1
        }
        if (tpopt.bw > 1) {
            tpopt.bw = 1;
            tpopt.bh = 1
        }
        tpopt.height = Math.round(tpopt.startheight * (tpopt.width / tpopt.startwidth));
        if (tpopt.height > tpopt.startheight && tpopt.autoHeight != "on") tpopt.height = tpopt.startheight;
        if (tpopt.fullScreen == "on") {
            tpopt.height = tpopt.bw * tpopt.startheight;
            var cow = tpopt.container.parent().width();
            var coh = jQuery(window).height();
            if (tpopt.fullScreenOffsetContainer != undefined) {
                try {
                    var offcontainers = tpopt.fullScreenOffsetContainer.split(",");
                    jQuery.each(offcontainers, function(e, t) {
                        coh = coh - jQuery(t).outerHeight(true);
                        if (coh < tpopt.minFullScreenHeight) coh = tpopt.minFullScreenHeight
                    })
                } catch (e) {}
            }
            tpopt.container.parent().height(coh);
            tpopt.container.height(coh);
            tpopt.container.closest(".rev_slider_wrapper").height(coh);
            tpopt.container.closest(".forcefullwidth_wrapper_tp_banner").find(".tp-fullwidth-forcer").height(coh);
            tpopt.container.css({
                height: "100%"
            });
            tpopt.height = coh;
        } else {
            tpopt.container.height(tpopt.height);
            tpopt.container.closest(".rev_slider_wrapper").height(tpopt.height);
            tpopt.container.closest(".forcefullwidth_wrapper_tp_banner").find(".tp-fullwidth-forcer").height(tpopt.height);
        }
    };

    /* CALL PLACEHOLDER */
    setREVStartSize();


    var tpj = jQuery;
    tpj.noConflict();
    var revapi1;

    tpj(document).ready(function() {

        if (tpj('#rev_slider_1_1').revolution == undefined)
            revslider_showDoubleJqueryError('#rev_slider_1_1');
        else
            revapi1 = tpj('#rev_slider_1_1').show().revolution({
                dottedOverlay: "none",
                delay: 5000,
                startwidth: 1170,
                startheight: 520,
                hideThumbs: 200,

                thumbWidth: 100,
                thumbHeight: 50,
                thumbAmount: 3,


                simplifyAll: "off",

                navigationType: "bullet",
                navigationArrows: "none",
                navigationStyle: "round",

                touchenabled: "on",
                onHoverStop: "on",
                nextSlideOnWindowFocus: "off",

                swipe_threshold: 0.7,
                swipe_min_touches: 1,
                drag_block_vertical: false,

                parallax: "scroll",
                parallaxBgFreeze: "on",
                parallaxLevels: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50],
                parallaxDisableOnMobile: "on",


                keyboardNavigation: "off",

                navigationHAlign: "center",
                navigationVAlign: "bottom",
                navigationHOffset: 0,
                navigationVOffset: 40,

                soloArrowLeftHalign: "left",
                soloArrowLeftValign: "center",
                soloArrowLeftHOffset: 20,
                soloArrowLeftVOffset: 0,

                soloArrowRightHalign: "right",
                soloArrowRightValign: "center",
                soloArrowRightHOffset: 20,
                soloArrowRightVOffset: 0,

                shadow: 0,
                fullWidth: "on",
                fullScreen: "off",

                spinner: "spinner0",

                stopLoop: "off",
                stopAfterLoops: -1,
                stopAtSlide: -1,

                shuffle: "off",

                autoHeight: "off",
                forceFullWidth: "off",


                hideTimerBar: "on",
                hideThumbsOnMobile: "off",
                hideNavDelayOnMobile: 1500,
                hideBulletsOnMobile: "off",
                hideArrowsOnMobile: "off",
                hideThumbsUnderResolution: 0,

                hideSliderAtLimit: 0,
                hideCaptionAtLimit: 601,
                hideAllCaptionAtLilmit: 0,
                startWithSlide: 0
            });




    }); /*ready*/
</script>

<script type="text/javascript">
    /******************************************
					-	PREPARE PLACEHOLDER FOR SLIDER	-
				******************************************/
    var setREVStartSize = function() {
        var tpopt = new Object();
        tpopt.startwidth = 570;
        tpopt.startheight = 338;
        tpopt.container = jQuery('#rev_slider_2_1');
        tpopt.fullScreen = "off";
        tpopt.forceFullWidth = "off";
        tpopt.container.closest(".rev_slider_wrapper").css({
            height: tpopt.container.height()
        });
        tpopt.width = parseInt(tpopt.container.width(), 0);
        tpopt.height = parseInt(tpopt.container.height(), 0);
        tpopt.bw = tpopt.width / tpopt.startwidth;
        tpopt.bh = tpopt.height / tpopt.startheight;
        if (tpopt.bh > tpopt.bw) tpopt.bh = tpopt.bw;
        if (tpopt.bh < tpopt.bw) tpopt.bw = tpopt.bh;
        if (tpopt.bw < tpopt.bh) tpopt.bh = tpopt.bw;
        if (tpopt.bh > 1) {
            tpopt.bw = 1;
            tpopt.bh = 1
        }
        if (tpopt.bw > 1) {
            tpopt.bw = 1;
            tpopt.bh = 1
        }
        tpopt.height = Math.round(tpopt.startheight * (tpopt.width / tpopt.startwidth));
        if (tpopt.height > tpopt.startheight && tpopt.autoHeight != "on") tpopt.height = tpopt.startheight;
        if (tpopt.fullScreen == "on") {
            tpopt.height = tpopt.bw * tpopt.startheight;
            var cow = tpopt.container.parent().width();
            var coh = jQuery(window).height();
            if (tpopt.fullScreenOffsetContainer != undefined) {
                try {
                    var offcontainers = tpopt.fullScreenOffsetContainer.split(",");
                    jQuery.each(offcontainers, function(e, t) {
                        coh = coh - jQuery(t).outerHeight(true);
                        if (coh < tpopt.minFullScreenHeight) coh = tpopt.minFullScreenHeight
                    })
                } catch (e) {}
            }
            tpopt.container.parent().height(coh);
            tpopt.container.height(coh);
            tpopt.container.closest(".rev_slider_wrapper").height(coh);
            tpopt.container.closest(".forcefullwidth_wrapper_tp_banner").find(".tp-fullwidth-forcer").height(coh);
            tpopt.container.css({
                height: "100%"
            });
            tpopt.height = coh;
        } else {
            tpopt.container.height(tpopt.height);
            tpopt.container.closest(".rev_slider_wrapper").height(tpopt.height);
            tpopt.container.closest(".forcefullwidth_wrapper_tp_banner").find(".tp-fullwidth-forcer").height(tpopt.height);
        }
    };
    /* CALL PLACEHOLDER */
    setREVStartSize();
    var tpj = jQuery;
    tpj.noConflict();
    var revapi2;
    tpj(document).ready(function() {
        if (tpj('#rev_slider_2_1').revolution == undefined)
            revslider_showDoubleJqueryError('#rev_slider_2_1');
        else
            revapi2 = tpj('#rev_slider_2_1').show().revolution({
                dottedOverlay: "none",
                delay: 9000,
                startwidth: 570,
                startheight: 338,
                hideThumbs: 200,
                thumbWidth: 100,
                thumbHeight: 50,
                thumbAmount: 1,
                simplifyAll: "off",
                navigationType: "none",
                navigationArrows: "solo",
                navigationStyle: "round",
                touchenabled: "on",
                onHoverStop: "on",
                nextSlideOnWindowFocus: "off",
                swipe_threshold: 0.7,
                swipe_min_touches: 1,
                drag_block_vertical: false,
                keyboardNavigation: "off",
                navigationHAlign: "center",
                navigationVAlign: "bottom",
                navigationHOffset: 0,
                navigationVOffset: 20,
                soloArrowLeftHalign: "left",
                soloArrowLeftValign: "center",
                soloArrowLeftHOffset: 20,
                soloArrowLeftVOffset: 20,
                soloArrowRightHalign: "right",
                soloArrowRightValign: "center",
                soloArrowRightHOffset: 20,
                soloArrowRightVOffset: 20,
                shadow: 0,
                fullWidth: "on",
                fullScreen: "off",
                spinner: "spinner0",
                stopLoop: "off",
                stopAfterLoops: -1,
                stopAtSlide: -1,
                shuffle: "off",
                autoHeight: "off",
                forceFullWidth: "off",
                hideTimerBar: "on",
                hideThumbsOnMobile: "off",
                hideNavDelayOnMobile: 1500,
                hideBulletsOnMobile: "off",
                hideArrowsOnMobile: "off",
                hideThumbsUnderResolution: 0,
                hideSliderAtLimit: 0,
                hideCaptionAtLimit: 0,
                hideAllCaptionAtLilmit: 0,
                startWithSlide: 0
            });
    }); /*ready*/
</script>
@endpush