@extends('master')

@section('content')

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

<section class="dnd_section_dd " style="background-color:#f5f6f8;">

    <div class="dnd_section_content">
        <div class="dnd_container">

            <div class="dnd_column_dd_span7">
                <div class="dnd-animo " data-animation="fadeInLeft" data-duration="1000" data-delay="0">
                    <img src="{{ asset('assets/upload/laboratory/1.jpg') }}" alt="">
                </div>
                <span class="clear spacer_responsive_hide_tablet" style="height:20px;display:block;"></span>
            </div>

            <div class="dnd_column_dd_span5 ">
                <h4><span>febri sembiring</span></h4>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec nisi metus. Ut tristique urna metus, venenatis condimentum ipsum imperdiet in. Sed leo mauris, vestibulum ut risus non, semper viverra lorem. Ut mattis felis justo, in lobortis enim aliquet ut. Fusce euismod elit vel dui dapibus finibus. Curabitur id interdum felis, placerat finibus ex. Pellentesque et orci odio. Sed et dolor id eros feugiat gravida. Sed sit amet eleifend diam. Nunc mollis sagittis lacus vitae sollicitudin. Aliquam erat volutpat.
                </p>
                <p>
                    Pellentesque tempor neque non tortor aliquam facilisis. Aliquam interdum tellus turpis, in fermentum erat tempor quis. Aenean at pellentesque nisi. Morbi elit felis, dictum ut ipsum vitae, convallis sollicitudin ante. Vestibulum fringilla fringilla sem, at sodales purus placerat pulvinar. Duis in condimentum magna. Curabitur ultricies enim metus, at finibus leo elementum quis. Phasellus ac ante faucibus, sagittis justo vitae, consectetur mauris. Donec iaculis metus sed viverra cursus. Mauris vitae consectetur dolor. Aliquam in leo sit amet lectus molestie commodo.
                </p>
                <span class="clear spacer_responsive_hide_mobile " style="height:23px;display:block;"></span>
            </div>
        </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">
                    <h5>
                        <span>Alat-alat yang tersedia</span>
                    </h5>
                    <br>
                                            <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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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('/instrument-single') }}">
                                            <p class="overlay_title">
                                                Alat {{ $i }}
                                            </p>
                                            <!-- <p class="portfolio_item_tags">
                                                Branding, Identity, UI/UX
                                            </p> -->
                                        </a>
                                    </div>
                                </div>
                                <div class="portfolio_item_meta">
                                    <h6 class="column_title_center"><a href="#">Alat {{ $i }}</a></h6>
                                    <!-- <p class="portfolio_4column_info">
                                        <span class="portfolio_item_meta_data">Branding, Identity, UI/UX</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