@extends('layouts.base_portal')
@section('inner_content')
<div class="row m-t-30">
    <div class="col-9 p-t-20 p-b-20">
        <div class="row animated fadeInUpBig faster">
            <div class="col">
                <div class="row m-b-20">
                    <div class="col">
                        <div class="row fs-12 text-center">
                            <div class="col padding-25 bg-master-lighter b-r hint-text" style=" border-color: #d2d2d2; ">
                                <div class="row justify-content-center m-b-10">
                                    <div class="col-auto">
                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                                             width="35" height="35"
                                             viewBox="0 0 172 172"
                                             style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M150.5,45.6875l-64.5,-22.84375l-64.5,22.84375v80.625l64.5,22.84375l64.5,-22.84375z" ></path><path d="M150.5,45.6875l-64.5,-22.84375l-64.5,22.84375v80.625l64.5,22.84375l64.5,-22.84375zM150.5,45.6875l-64.5,-22.84375" ></path><path d="M86,153.1875c-0.40313,0 -0.94062,-0.13438 -1.34375,-0.26875l-64.5,-22.84375c-1.6125,-0.5375 -2.6875,-2.15 -2.6875,-3.7625v-80.625c0,-1.74687 1.075,-3.225 2.6875,-3.7625l64.5,-22.84375c2.15,-0.80625 4.43438,0.40312 5.10625,2.41875c0.80625,2.15 -0.40313,4.43437 -2.41875,5.10625l-61.8125,21.90313v74.98125l61.8125,21.90313c2.15,0.80625 3.225,3.09062 2.41875,5.10625c-0.5375,1.6125 -2.15,2.6875 -3.7625,2.6875z" fill="#444b54"></path><path d="M150.5,45.6875l-64.5,-22.84375M150.5,45.6875l-64.5,-22.84375" ></path><path d="M45.6875,71.08437v-14.5125c0,-1.74687 1.075,-3.225 2.6875,-3.7625l61.8125,-21.90313l16.125,5.375l-63.15625,21.90312c-1.6125,0.5375 -2.6875,2.15 -2.6875,3.7625v13.4375c0,1.88125 -1.88125,3.225 -3.62813,2.55312l-8.46562,-3.09062c-1.6125,-0.5375 -2.6875,-2.01562 -2.6875,-3.7625z" fill="#71c2ff"></path><path d="M154.53125,45.41875c0,-0.13437 0,-0.26875 0,-0.5375c0,0 0,0 0,-0.13438c0,-0.13437 -0.13438,-0.40312 -0.13438,-0.5375c-0.40312,-1.075 -1.34375,-2.01562 -2.28437,-2.41875c0,0 -0.13438,0 -0.13438,-0.13438l-64.5,-22.84375c0,0 0,0 -0.13437,0c-0.80625,-0.26875 -1.74687,-0.26875 -2.55312,0l-64.5,22.84375c-1.6125,0.5375 -2.6875,2.15 -2.6875,3.7625v80.625c0,1.74687 1.075,3.225 2.6875,3.7625l64.5,22.84375v0c0.40313,0.13437 0.94063,0.26875 1.34375,0.26875c0.40312,0 0.94062,-0.13437 1.34375,-0.26875l64.5,-22.84375c1.6125,-0.5375 2.6875,-2.15 2.6875,-3.7625v-80.35625c-0.13438,-0.13437 -0.13438,-0.13437 -0.13438,-0.26875zM25.53125,48.50938l60.46875,-21.36562l52.40625,18.54375l-53.75,19.08125c0,0 0,0 -0.13438,0c-1.47812,0.5375 -2.55312,2.01563 -2.55312,3.7625v74.98125l-56.4375,-20.02187zM90.03125,143.5125v-72.15937l56.4375,-20.02188v72.025z" fill="#444b54"></path></g></g></svg>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col">
                                        <p class="all-caps m-t-5 m-b-0 lh-15">Orders</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col pointer">
                        <div class="row fs-12 text-center">
                            <div class="col padding-25 bg-master-lighter b-r hint-text" style=" border-color: #d2d2d2; ">
                                <div class="row justify-content-center m-b-10">
                                    <div class="col-auto">
                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                                             width="35" height="35"
                                             viewBox="0 0 172 172"
                                             style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><path d="M13.4375,5.375h102.125v161.25h-102.125z" ></path><path d="M99.4375,143.78125h-26.875c-2.28437,0 -4.03125,-1.74687 -4.03125,-4.03125v-40.3125c0,-2.28437 1.74688,-4.03125 4.03125,-4.03125h26.875c2.28437,0 4.03125,1.74688 4.03125,4.03125v40.3125c0,2.28438 -1.74688,4.03125 -4.03125,4.03125zM76.59375,135.71875h18.8125v-32.25h-18.8125zM17.46875,9.40625h94.0625v8.0625h-94.0625zM9.40625,40.3125c0,2.28437 1.74688,4.03125 4.03125,4.03125c2.28437,0 4.03125,-1.74688 4.03125,-4.03125v-22.84375h-8.0625z" fill="#454b54"></path><path d="M150.5,162.59375h-4.03125v-145.125h-34.9375v145.125h-51.0625v-63.15625c0,-2.28437 -1.74687,-4.03125 -4.03125,-4.03125h-26.875c-2.28438,0 -4.03125,1.74688 -4.03125,4.03125v63.15625h-8.0625v-63.15625c0,-2.28437 -1.74688,-4.03125 -4.03125,-4.03125c-2.28437,0 -4.03125,1.74688 -4.03125,4.03125v63.15625h-4.03125c-2.28438,0 -4.03125,1.74687 -4.03125,4.03125c0,2.28438 1.74687,4.03125 4.03125,4.03125h145.125c2.28438,0 4.03125,-1.74687 4.03125,-4.03125c0,-2.28438 -1.74687,-4.03125 -4.03125,-4.03125zM33.59375,162.59375v-59.125h18.8125v59.125z" fill="#454b54"></path><path d="M5.375,5.375h145.25938v16.125h-145.25937z" ></path><path d="M150.63438,1.34375h-145.25937c-2.28438,0 -4.03125,1.74687 -4.03125,4.03125v16.125c0,2.28438 1.74687,4.03125 4.03125,4.03125h145.25938c2.28437,0 4.03125,-1.74687 4.03125,-4.03125v-16.125c0,-2.28438 -1.88125,-4.03125 -4.03125,-4.03125zM9.40625,9.40625h108.97813v8.0625h-108.97812zM146.60313,17.46875h-20.15625v-8.0625h20.15625z" fill="#454b54"></path><path d="M127.79063,53.61563c-0.67187,-0.80625 -1.74687,-1.20938 -2.82187,-1.20938h-120.9375c-2.28437,0 -4.03125,1.74687 -4.03125,4.03125v24.1875c0,1.075 0.40312,2.15 1.20938,2.82188c2.55312,2.55312 5.9125,4.03125 9.54063,4.03125c3.62812,0 6.9875,-1.34375 9.54062,-4.03125c1.075,-1.075 2.41875,-1.6125 3.89688,-1.6125c1.47813,0 2.82188,0.5375 3.89687,1.6125c2.55312,2.55312 5.9125,4.03125 9.54063,4.03125c3.62813,0 6.9875,-1.34375 9.54062,-4.03125l0.13438,-0.13438c2.01563,-2.01562 5.375,-2.01562 7.39063,0l0.26875,0.26875c2.55312,2.55312 5.9125,3.89687 9.40625,3.89687c3.49375,0 6.85313,-1.34375 9.40625,-3.89687l0.26875,-0.26875c2.01563,-2.01562 5.375,-2.01562 7.39063,0l0.26875,0.26875c2.55312,2.55312 5.9125,3.89687 9.40625,3.89687c3.49375,0 6.85312,-1.34375 9.40625,-3.89687l0.26875,-0.26875c2.01563,-2.01562 5.375,-2.01562 7.39063,0c2.55313,2.55313 6.04688,4.03125 9.675,3.89688c3.62812,-0.13437 7.12187,-1.6125 9.54062,-4.3c0.67188,-0.67187 1.075,-1.74687 1.075,-2.6875l0.5375,-23.78437c0,-1.075 -0.40312,-2.01562 -1.20938,-2.82187z" fill="#71c2ff"></path><path d="M166.625,162.59375c-2.2264,0 -4.03125,1.80485 -4.03125,4.03125c0,2.2264 1.80485,4.03125 4.03125,4.03125c2.2264,0 4.03125,-1.80485 4.03125,-4.03125c0,-2.2264 -1.80485,-4.03125 -4.03125,-4.03125z" fill="#454b54"></path></g></g></svg>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col">
                                        <p class="all-caps m-t-5 m-b-0 lh-15">Customers</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col pointer">
                        <div class="row fs-12 text-center">
                            <div class="col padding-25 bg-master-lighter b-r hint-text" style=" border-color: #d2d2d2; ">
                                <div class="row justify-content-center m-b-10">
                                    <div class="col-auto">
                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                                             width="35" height="35"
                                             viewBox="0 0 172 172"
                                             style=" fill:#000000;">
                                            <g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#34495e"><path d="M86,12.78242l-70.95,24.38066v17.35957l2.78828,-0.87344l1.51172,-0.47031v99.47109h19.35v-64.5h94.6v62.35h19.35v-97.32109l4.3,1.34375v-17.35957zM86,17.31758l66.65,22.91934v7.31504h-3.59453l-63.05547,-19.70274l-66.65,20.82813v-8.44043zM86,32.35078l62.35,19.48438v94.36484h-10.75v-59.83887c0.04199,-0.23516 0.04199,-0.47031 0,-0.69707v-23.31406h-4.3c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15v17.2h-94.6v-17.2c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15h-4.3v23.28887c-0.04199,0.23516 -0.04199,0.47031 0,0.69707v62.01406h-10.75v-96.51484zM47.3,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM55.9,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM64.5,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM73.1,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM81.7,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM90.3,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM98.9,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM107.5,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM116.1,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM124.7,62.35c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM77.4,75.25c-0.77266,-0.0084 -1.49492,0.39473 -1.88965,1.0666c-0.38633,0.67188 -0.38633,1.49492 0,2.1668c0.39473,0.67188 1.11699,1.075 1.88965,1.0666h17.2c0.77266,0.0084 1.49492,-0.39473 1.88965,-1.0666c0.38633,-0.67187 0.38633,-1.49492 0,-2.1668c-0.39472,-0.67187 -1.11699,-1.075 -1.88965,-1.0666z"></path></g><g fill="#71c2ff"><g><path d="M77.9375,122.28125h-6.71875c-0.80625,0 -1.34375,0.5375 -1.34375,1.34375v5.375c0,2.28438 -8.0625,2.28438 -8.0625,0v-5.375c0,-0.80625 -0.5375,-1.34375 -1.34375,-1.34375h-6.71875c-2.28438,0 -4.03125,1.74688 -4.03125,4.03125v24.1875c0,2.28438 1.74687,4.03125 4.03125,4.03125h24.1875c2.28437,0 4.03125,-1.74687 4.03125,-4.03125v-24.1875c0,-2.28437 -1.74688,-4.03125 -4.03125,-4.03125z"></path></g></g><g fill="#71c2ff"><g><path d="M118.25,122.28125h-6.71875c-0.80625,0 -1.34375,0.5375 -1.34375,1.34375v5.375c0,2.28438 -8.0625,2.28438 -8.0625,0v-5.375c0,-0.80625 -0.5375,-1.34375 -1.34375,-1.34375h-6.71875c-2.28437,0 -4.03125,1.74688 -4.03125,4.03125v24.1875c0,2.28438 1.74688,4.03125 4.03125,4.03125h24.1875c2.28437,0 4.03125,-1.74687 4.03125,-4.03125v-24.1875c0,-2.28437 -1.74688,-4.03125 -4.03125,-4.03125z"></path></g></g></g></svg>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col">
                                        <p class="all-caps m-t-5 m-b-0 lh-15">Warehouses</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col pointer">
                        <div class="row fs-12 text-center">
                            <div class="col padding-25 bg-master-lighter hint-text" >
                                <div class="row justify-content-center m-b-10">
                                    <div class="col-auto">
                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                                             width="35" height="35"
                                             viewBox="0 0 172 172"
                                             style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><g><g fill="none"><path d="M110.1875,67.1875c0,-7.39062 -6.04687,-13.4375 -13.4375,-13.4375h-21.5h-1.6125c-6.71875,0 -12.49688,5.10625 -13.30313,11.825l-5.24063,41.925h14.78125v59.125h32.25v-59.125v0c4.43438,0 8.0625,-3.62812 8.0625,-8.0625z"></path></g><g fill="none"><path d="M49.71875,61.8125h-21.5c-7.39062,0 -13.4375,6.04688 -13.4375,13.4375v29.5625c0,4.97187 3.49375,9.1375 8.0625,10.34687v43.40313c0,4.43437 3.62813,8.0625 8.0625,8.0625c4.43438,0 11.69062,0 16.125,0c4.43437,0 8.0625,-3.62813 8.0625,-8.0625v-43h8.0625v-40.3125c0,-7.39062 -6.04687,-13.4375 -13.4375,-13.4375z"></path></g><g fill="none"><circle cx="29" cy="26" transform="scale(1.34375,1.34375)" r="10"></circle></g><g fill="none"><path d="M143.78125,61.8125h-21.5c-7.39062,0 -13.4375,6.04688 -13.4375,13.4375v29.5625c0,4.97187 3.49375,9.1375 8.0625,10.34687v43c0,4.43437 3.35938,8.33125 7.79375,8.33125c4.56875,0.13438 12.09375,0.13438 16.6625,0c4.43437,-0.13437 7.79375,-4.03125 7.79375,-8.33125v-42.59688v0c4.43437,0 8.0625,-3.62812 8.0625,-8.0625v-32.25c0,-7.39062 -6.04687,-13.4375 -13.4375,-13.4375z"></path></g><g fill="none"><circle cx="99" cy="26" transform="scale(1.34375,1.34375)" r="10"></circle></g><g fill="#71c2ff"><path d="M22.84375,170.65625c-2.28438,0 -4.03125,-1.74687 -4.03125,-4.03125v-48.64375c-4.8375,-2.41875 -8.0625,-7.525 -8.0625,-13.16875v-29.5625c0,-9.675 7.79375,-17.46875 17.46875,-17.46875h21.5c2.28438,0 4.03125,1.74687 4.03125,4.03125c0,2.28437 -1.74687,4.03125 -4.03125,4.03125h-21.5c-5.24062,0 -9.40625,4.16563 -9.40625,9.40625v29.5625c0,3.09063 2.01563,5.77813 4.97188,6.45c1.74687,0.40312 3.09062,2.01563 3.09062,3.89687v51.46563c0,2.28438 -1.74687,4.03125 -4.03125,4.03125z"></path></g><g fill="#71c2ff"><path d="M38.96875,52.40625c-9.675,0 -17.46875,-7.79375 -17.46875,-17.46875c0,-9.675 7.79375,-17.46875 17.46875,-17.46875c9.675,0 17.46875,7.79375 17.46875,17.46875c0,9.675 -7.79375,17.46875 -17.46875,17.46875zM38.96875,25.53125c-5.24063,0 -9.40625,4.16563 -9.40625,9.40625c0,5.24063 4.16562,9.40625 9.40625,9.40625c5.24063,0 9.40625,-4.16562 9.40625,-9.40625c0,-5.24062 -4.16562,-9.40625 -9.40625,-9.40625z"></path></g><g fill="#71c2ff"><path d="M116.90625,170.65625c-2.28437,0 -4.03125,-1.74687 -4.03125,-4.03125v-38.02812c0,-2.28438 1.74688,-4.03125 4.03125,-4.03125c2.28437,0 4.03125,1.74688 4.03125,4.03125v38.02812c0,2.28438 -1.74688,4.03125 -4.03125,4.03125z"></path></g><g fill="#71c2ff"><path d="M149.15625,170.25313c-2.28438,0 -4.03125,-1.74688 -4.03125,-4.03125v-50.65938c0,-2.28437 1.74687,-4.03125 4.03125,-4.03125c2.28438,0 4.03125,-1.74688 4.03125,-4.03125v-32.25c0,-5.24062 -4.16563,-9.40625 -9.40625,-9.40625h-21.5c-2.28437,0 -4.03125,-1.74688 -4.03125,-4.03125c0,-2.28438 1.74688,-4.03125 4.03125,-4.03125h21.5c9.675,0 17.46875,7.79375 17.46875,17.46875v32.25c0,5.24063 -3.35937,9.675 -8.0625,11.42188v47.43437c0,2.15 -1.74687,3.89688 -4.03125,3.89688z"></path></g><g fill="#71c2ff"><path d="M133.03125,52.40625c-9.675,0 -17.46875,-7.79375 -17.46875,-17.46875c0,-9.675 7.79375,-17.46875 17.46875,-17.46875c9.675,0 17.46875,7.79375 17.46875,17.46875c0,9.675 -7.79375,17.46875 -17.46875,17.46875zM133.03125,25.53125c-5.24063,0 -9.40625,4.16563 -9.40625,9.40625c0,5.24063 4.16562,9.40625 9.40625,9.40625c5.24062,0 9.40625,-4.16562 9.40625,-9.40625c0,-5.24062 -4.16563,-9.40625 -9.40625,-9.40625z"></path></g><g fill="#444b54"><path d="M55.09375,143.78125c-2.28438,0 -4.03125,-1.74687 -4.03125,-4.03125v-18.8125c0,-2.28437 1.74687,-4.03125 4.03125,-4.03125c2.28438,0 4.03125,1.74688 4.03125,4.03125v18.8125c0,2.28438 -1.74687,4.03125 -4.03125,4.03125z"></path></g><g fill="none"><circle cx="64" cy="20" transform="scale(1.34375,1.34375)" r="10"></circle></g><g fill="#444b54"><path d="M86,44.34375c-9.675,0 -17.46875,-7.79375 -17.46875,-17.46875c0,-9.675 7.79375,-17.46875 17.46875,-17.46875c9.675,0 17.46875,7.79375 17.46875,17.46875c0,9.675 -7.79375,17.46875 -17.46875,17.46875zM86,17.46875c-5.24062,0 -9.40625,4.16563 -9.40625,9.40625c0,5.24063 4.16563,9.40625 9.40625,9.40625c5.24063,0 9.40625,-4.16562 9.40625,-9.40625c0,-5.24062 -4.16562,-9.40625 -9.40625,-9.40625z"></path></g><path d="M127.65625,162.59375h-21.5v-45.95625v-1.075v-4.70312c4.70313,-1.6125 8.0625,-6.18125 8.0625,-11.42187v-24.1875c0,-6.04687 -1.20938,-25.53125 -17.46875,-25.53125h-23.1125c-8.73437,0 -16.25938,6.58438 -17.33438,15.31875l-5.24063,41.925c-0.26875,2.15 1.34375,4.16562 3.49375,4.43438c2.15,0.26875 4.16563,-1.34375 4.43438,-3.49375l5.24063,-41.925c0.5375,-4.70312 4.56875,-8.19687 9.27187,-8.19687h23.24688c8.19687,0 9.40625,10.88437 9.40625,17.46875v24.1875c0,2.28437 -1.74688,4.03125 -4.03125,4.03125c-2.28437,0 -4.03125,1.74688 -4.03125,4.03125v8.0625v1.075v45.95625h-8.0625v-47.03125c0,-2.28437 -1.74688,-4.03125 -4.03125,-4.03125c-2.28437,0 -4.03125,1.74688 -4.03125,4.03125v47.03125h-8.0625v-55.09375c0,-2.28437 -1.74688,-4.03125 -4.03125,-4.03125c-2.28437,0 -4.03125,1.74688 -4.03125,4.03125v55.09375h-21.5c-2.28437,0 -4.03125,1.74687 -4.03125,4.03125c0,2.28438 1.74688,4.03125 4.03125,4.03125h83.3125c2.28438,0 4.03125,-1.74687 4.03125,-4.03125c0,-2.28438 -1.74687,-4.03125 -4.03125,-4.03125z" fill="#444b54"></path></g></g></g></svg>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col">
                                        <p class="all-caps m-t-5 m-b-0 lh-15">Employees</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col">
                        <div class="row">

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-7">
                <list-component key="2" section="importerSection" endpoint="{{ route('api.company.list') }}" :options='{"Importer":"true"}'>
                    <template slot="list" slot-scope="{data}">
                        <company-component :data="data"></company-component>
                    </template>
                </list-component>
            </div>
        </div>
        <div class="row d-none">
            <div class="col">
                <div class="row">
                    <div class="col bg-white">
                        <div class="row">
                            <div class="bg-master-lighter" :class="[{'col-3': !$store.getters.isShowing('admin.users.menu.minimize')}, {'col-auto': $store.getters.isShowing('admin.users.menu.minimize')}]">
                                <div class="row fs-12 bg-info-darker text-white">
                                    <div class="col p-t-10 p-b-10 b-b" style="border-bottom-color: #d4d4d4;">
                                        <div class="row align-items-center">
                                            <div class="col p-r-0" v-if="!$store.getters.isShowing('admin.users.menu.minimize')">
                                                <small class="all-caps m-t-5 m-b-0 lh-15">Navigation</small>
                                            </div>
                                            <div class="col-auto pointer" @click="$store.dispatch('toggleSection', {name: 'admin.users.menu.minimize', status: !$store.getters.isShowing('admin.users.menu.minimize')})">
                                                <i class="fa fs-14 fa-fw" :class="[{'fa-compress': !$store.getters.isShowing('admin.users.menu.minimize')}, {'fa-expand': $store.getters.isShowing('admin.users.menu.minimize')}]"  style=" margin-top: 6px; "></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row fs-12">
                                    <div class="col p-t-15 p-b-15"
                                         :class="[{'text-primary': !$store.getters.isShowing('admin.users.blocked') && !$store.getters.isShowing('admin.users.invites') && !$store.getters.isShowing('admin.users.reports')},
                                                        {'bg-white': !$store.getters.isShowing('admin.users.blocked') && !$store.getters.isShowing('admin.users.invites') && !$store.getters.isShowing('admin.users.reports')},
                                                        {'pointer': $store.getters.isShowing('admin.users.blocked') || $store.getters.isShowing('admin.users.invites') || $store.getters.isShowing('admin.users.reports')},
                                                        {'hint-text': $store.getters.isShowing('admin.users.blocked') || $store.getters.isShowing('admin.users.invites') || $store.getters.isShowing('admin.users.reports')}]"
                                         @click="$store.dispatch('toggleSection', {name: 'admin.users.active', status: true});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.blocked', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.invites', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.reports', status: false})"
                                         :style="[ !$store.getters.isShowing('admin.users.blocked') && !$store.getters.isShowing('admin.users.invites') && !$store.getters.isShowing('admin.users.reports') ? {'border-bottom': 'solid 3px'} : {},
                                                        $store.getters.isShowing('admin.users.blocked') || $store.getters.isShowing('admin.users.invites') || $store.getters.isShowing('admin.users.reports') ? {'border-bottom': 'solid 1px #d4d4d4'} : {}]">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <i class="fa fa-check-circle-o fs-16 fa-fw" style=" margin-top: 6px; "></i>
                                            </div>
                                            <div class="col p-l-0" v-if="!$store.getters.isShowing('admin.users.menu.minimize')">
                                                <p class="all-caps m-t-5 m-b-0 lh-15 fs-12">Active Users</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row fs-12">
                                    <div class="col p-t-15 p-b-15"
                                         :class="[{'text-primary': $store.getters.isShowing('admin.users.blocked')},
                                                        {'bg-white': $store.getters.isShowing('admin.users.blocked')},
                                                        {'pointer': !$store.getters.isShowing('admin.users.blocked')},
                                                        {'hint-text': !$store.getters.isShowing('admin.users.blocked')}]"
                                         @click="$store.dispatch('toggleSection', {name: 'admin.users.blocked', status: true});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.active', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.invites', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.reports', status: false})"
                                         :style="[$store.getters.isShowing('admin.users.blocked') ? {'border-bottom': 'solid 3px'} : {},
                                                        !$store.getters.isShowing('admin.users.blocked') ? {'border-bottom': 'solid 1px #d4d4d4'} : {}]">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <i class="fa fa-ban fs-16 fa-fw" style=" margin-top: 6px; "></i>
                                            </div>
                                            <div class="col p-l-0" v-if="!$store.getters.isShowing('admin.users.menu.minimize')">
                                                <p class="all-caps m-t-5 m-b-0 lh-15 fs-12">Blocked Users</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row fs-12">
                                    <div class="col p-t-15 p-b-15"
                                         :class="[{'text-primary': $store.getters.isShowing('admin.users.invites')},
                                                        {'bg-white': $store.getters.isShowing('admin.users.invites')},
                                                        {'pointer': !$store.getters.isShowing('admin.users.invites')},
                                                        {'hint-text': !$store.getters.isShowing('admin.users.invites')}]"
                                         @click="$store.dispatch('toggleSection', {name: 'admin.users.invites', status: true});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.active', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.blocked', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.reports', status: false})"
                                         :style="[$store.getters.isShowing('admin.users.invites') ? {'border-bottom': 'solid 3px'} : {},
                                                        !$store.getters.isShowing('admin.users.invites') ? {'border-bottom': 'solid 1px #d4d4d4'} : {}]">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <i class="fa fa-envelope-o fs-15 fa-fw" style=" margin-top: 6px; "></i>
                                            </div>
                                            <div class="col p-l-0" v-if="!$store.getters.isShowing('admin.users.menu.minimize')">
                                                <p class="all-caps m-t-5 m-b-0 lh-15 fs-12">User Invites</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row fs-12">
                                    <div class="col p-t-15 p-b-15"
                                         :class="[{'text-primary': $store.getters.isShowing('admin.users.reports')},
                                                        {'bg-white': $store.getters.isShowing('admin.users.reports')},
                                                        {'pointer': !$store.getters.isShowing('admin.users.reports')},
                                                        {'hint-text': !$store.getters.isShowing('admin.users.reports')}]"
                                         @click="$store.dispatch('toggleSection', {name: 'admin.users.reports', status: true});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.active', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.blocked', status: false});
                                                        $store.dispatch('toggleSection', {name: 'admin.users.invites', status: false})"
                                         :style="[$store.getters.isShowing('admin.users.reports') ? {'border-bottom': 'solid 3px'} : {},
                                                        !$store.getters.isShowing('admin.users.reports') ? {'border-bottom': 'solid 1px #d4d4d4'} : {}]">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <i class="fa fa-pie-chart fs-15 fa-fw" style=" margin-top: 6px; "></i>
                                            </div>
                                            <div class="col p-l-0" v-if="!$store.getters.isShowing('admin.users.menu.minimize')">
                                                <p class="all-caps m-t-5 m-b-0 lh-15 fs-12">Reports</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col p-t-15 p-b-0">
                                <div class="row overflow-hidden p-b-50">
                                    <div class="col-7">
                                        <list-component key="2" section="userSection" endpoint="{{ route('api.account.user.list') }}">
                                            <template slot="list" slot-scope="{data}">
                                                <user-component :data="data"></user-component>
                                            </template>
                                        </list-component>
                                    </div>
                                    <div class="col">
                                        <div class="row">
                                            <div class="col">
                                                <div class="all-caps font-lato m-b-0 text-info bold fs-12">Active users</div>
                                                <p class="fs-9 all-caps light font-lato muted m-b-0">List of the system currently active users</p>
                                            </div>
                                        </div>
                                        <search-component section="userSection"></search-component>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection