<script type="text/javascript" src="https://stc.pagseguro.uol.com.br/pagseguro/api/v2/checkout/pagseguro.directpayment.js"></script>

<script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.min.js" charset="utf-8"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>


<script> //Máscaras dos inputs


///////////////////
// jQuery Mask Plugin v1.14.16
// github.com/igorescobar/jQuery-Mask-Plugin
var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.findInternal=function(a,n,f){a instanceof String&&(a=String(a));for(var p=a.length,k=0;k<p;k++){var b=a[k];if(n.call(f,b,k,a))return{i:k,v:b}}return{i:-1,v:void 0}};$jscomp.ASSUME_ES5=!1;$jscomp.ASSUME_NO_NATIVE_MAP=!1;$jscomp.ASSUME_NO_NATIVE_SET=!1;$jscomp.SIMPLE_FROUND_POLYFILL=!1;
$jscomp.defineProperty=$jscomp.ASSUME_ES5||"function"==typeof Object.defineProperties?Object.defineProperty:function(a,n,f){a!=Array.prototype&&a!=Object.prototype&&(a[n]=f.value)};$jscomp.getGlobal=function(a){return"undefined"!=typeof window&&window===a?a:"undefined"!=typeof global&&null!=global?global:a};$jscomp.global=$jscomp.getGlobal(this);
$jscomp.polyfill=function(a,n,f,p){if(n){f=$jscomp.global;a=a.split(".");for(p=0;p<a.length-1;p++){var k=a[p];k in f||(f[k]={});f=f[k]}a=a[a.length-1];p=f[a];n=n(p);n!=p&&null!=n&&$jscomp.defineProperty(f,a,{configurable:!0,writable:!0,value:n})}};$jscomp.polyfill("Array.prototype.find",function(a){return a?a:function(a,f){return $jscomp.findInternal(this,a,f).v}},"es6","es3");
(function(a,n,f){"function"===typeof define&&define.amd?define(["jquery"],a):"object"===typeof exports&&"undefined"===typeof Meteor?module.exports=a(require("jquery")):a(n||f)})(function(a){var n=function(b,d,e){var c={invalid:[],getCaret:function(){try{var a=0,r=b.get(0),h=document.selection,d=r.selectionStart;if(h&&-1===navigator.appVersion.indexOf("MSIE 10")){var e=h.createRange();e.moveStart("character",-c.val().length);a=e.text.length}else if(d||"0"===d)a=d;return a}catch(C){}},setCaret:function(a){try{if(b.is(":focus")){var c=
b.get(0);if(c.setSelectionRange)c.setSelectionRange(a,a);else{var g=c.createTextRange();g.collapse(!0);g.moveEnd("character",a);g.moveStart("character",a);g.select()}}}catch(B){}},events:function(){b.on("keydown.mask",function(a){b.data("mask-keycode",a.keyCode||a.which);b.data("mask-previus-value",b.val());b.data("mask-previus-caret-pos",c.getCaret());c.maskDigitPosMapOld=c.maskDigitPosMap}).on(a.jMaskGlobals.useInput?"input.mask":"keyup.mask",c.behaviour).on("paste.mask drop.mask",function(){setTimeout(function(){b.keydown().keyup()},
100)}).on("change.mask",function(){b.data("changed",!0)}).on("blur.mask",function(){f===c.val()||b.data("changed")||b.trigger("change");b.data("changed",!1)}).on("blur.mask",function(){f=c.val()}).on("focus.mask",function(b){!0===e.selectOnFocus&&a(b.target).select()}).on("focusout.mask",function(){e.clearIfNotMatch&&!k.test(c.val())&&c.val("")})},getRegexMask:function(){for(var a=[],b,c,e,t,f=0;f<d.length;f++)(b=l.translation[d.charAt(f)])?(c=b.pattern.toString().replace(/.{1}$|^.{1}/g,""),e=b.optional,
(b=b.recursive)?(a.push(d.charAt(f)),t={digit:d.charAt(f),pattern:c}):a.push(e||b?c+"?":c)):a.push(d.charAt(f).replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&"));a=a.join("");t&&(a=a.replace(new RegExp("("+t.digit+"(.*"+t.digit+")?)"),"($1)?").replace(new RegExp(t.digit,"g"),t.pattern));return new RegExp(a)},destroyEvents:function(){b.off("input keydown keyup paste drop blur focusout ".split(" ").join(".mask "))},val:function(a){var c=b.is("input")?"val":"text";if(0<arguments.length){if(b[c]()!==a)b[c](a);
c=b}else c=b[c]();return c},calculateCaretPosition:function(a){var d=c.getMasked(),h=c.getCaret();if(a!==d){var e=b.data("mask-previus-caret-pos")||0;d=d.length;var g=a.length,f=a=0,l=0,k=0,m;for(m=h;m<d&&c.maskDigitPosMap[m];m++)f++;for(m=h-1;0<=m&&c.maskDigitPosMap[m];m--)a++;for(m=h-1;0<=m;m--)c.maskDigitPosMap[m]&&l++;for(m=e-1;0<=m;m--)c.maskDigitPosMapOld[m]&&k++;h>g?h=10*d:e>=h&&e!==g?c.maskDigitPosMapOld[h]||(e=h,h=h-(k-l)-a,c.maskDigitPosMap[h]&&(h=e)):h>e&&(h=h+(l-k)+f)}return h},behaviour:function(d){d=
d||window.event;c.invalid=[];var e=b.data("mask-keycode");if(-1===a.inArray(e,l.byPassKeys)){e=c.getMasked();var h=c.getCaret(),g=b.data("mask-previus-value")||"";setTimeout(function(){c.setCaret(c.calculateCaretPosition(g))},a.jMaskGlobals.keyStrokeCompensation);c.val(e);c.setCaret(h);return c.callbacks(d)}},getMasked:function(a,b){var h=[],f=void 0===b?c.val():b+"",g=0,k=d.length,n=0,p=f.length,m=1,r="push",u=-1,w=0;b=[];if(e.reverse){r="unshift";m=-1;var x=0;g=k-1;n=p-1;var A=function(){return-1<
g&&-1<n}}else x=k-1,A=function(){return g<k&&n<p};for(var z;A();){var y=d.charAt(g),v=f.charAt(n),q=l.translation[y];if(q)v.match(q.pattern)?(h[r](v),q.recursive&&(-1===u?u=g:g===x&&g!==u&&(g=u-m),x===u&&(g-=m)),g+=m):v===z?(w--,z=void 0):q.optional?(g+=m,n-=m):q.fallback?(h[r](q.fallback),g+=m,n-=m):c.invalid.push({p:n,v:v,e:q.pattern}),n+=m;else{if(!a)h[r](y);v===y?(b.push(n),n+=m):(z=y,b.push(n+w),w++);g+=m}}a=d.charAt(x);k!==p+1||l.translation[a]||h.push(a);h=h.join("");c.mapMaskdigitPositions(h,
b,p);return h},mapMaskdigitPositions:function(a,b,d){a=e.reverse?a.length-d:0;c.maskDigitPosMap={};for(d=0;d<b.length;d++)c.maskDigitPosMap[b[d]+a]=1},callbacks:function(a){var g=c.val(),h=g!==f,k=[g,a,b,e],l=function(a,b,c){"function"===typeof e[a]&&b&&e[a].apply(this,c)};l("onChange",!0===h,k);l("onKeyPress",!0===h,k);l("onComplete",g.length===d.length,k);l("onInvalid",0<c.invalid.length,[g,a,b,c.invalid,e])}};b=a(b);var l=this,f=c.val(),k;d="function"===typeof d?d(c.val(),void 0,b,e):d;l.mask=
d;l.options=e;l.remove=function(){var a=c.getCaret();l.options.placeholder&&b.removeAttr("placeholder");b.data("mask-maxlength")&&b.removeAttr("maxlength");c.destroyEvents();c.val(l.getCleanVal());c.setCaret(a);return b};l.getCleanVal=function(){return c.getMasked(!0)};l.getMaskedVal=function(a){return c.getMasked(!1,a)};l.init=function(g){g=g||!1;e=e||{};l.clearIfNotMatch=a.jMaskGlobals.clearIfNotMatch;l.byPassKeys=a.jMaskGlobals.byPassKeys;l.translation=a.extend({},a.jMaskGlobals.translation,e.translation);
l=a.extend(!0,{},l,e);k=c.getRegexMask();if(g)c.events(),c.val(c.getMasked());else{e.placeholder&&b.attr("placeholder",e.placeholder);b.data("mask")&&b.attr("autocomplete","off");g=0;for(var f=!0;g<d.length;g++){var h=l.translation[d.charAt(g)];if(h&&h.recursive){f=!1;break}}f&&b.attr("maxlength",d.length).data("mask-maxlength",!0);c.destroyEvents();c.events();g=c.getCaret();c.val(c.getMasked());c.setCaret(g)}};l.init(!b.is("input"))};a.maskWatchers={};var f=function(){var b=a(this),d={},e=b.attr("data-mask");
b.attr("data-mask-reverse")&&(d.reverse=!0);b.attr("data-mask-clearifnotmatch")&&(d.clearIfNotMatch=!0);"true"===b.attr("data-mask-selectonfocus")&&(d.selectOnFocus=!0);if(p(b,e,d))return b.data("mask",new n(this,e,d))},p=function(b,d,e){e=e||{};var c=a(b).data("mask"),f=JSON.stringify;b=a(b).val()||a(b).text();try{return"function"===typeof d&&(d=d(b)),"object"!==typeof c||f(c.options)!==f(e)||c.mask!==d}catch(w){}},k=function(a){var b=document.createElement("div");a="on"+a;var e=a in b;e||(b.setAttribute(a,
"return;"),e="function"===typeof b[a]);return e};a.fn.mask=function(b,d){d=d||{};var e=this.selector,c=a.jMaskGlobals,f=c.watchInterval;c=d.watchInputs||c.watchInputs;var k=function(){if(p(this,b,d))return a(this).data("mask",new n(this,b,d))};a(this).each(k);e&&""!==e&&c&&(clearInterval(a.maskWatchers[e]),a.maskWatchers[e]=setInterval(function(){a(document).find(e).each(k)},f));return this};a.fn.masked=function(a){return this.data("mask").getMaskedVal(a)};a.fn.unmask=function(){clearInterval(a.maskWatchers[this.selector]);
delete a.maskWatchers[this.selector];return this.each(function(){var b=a(this).data("mask");b&&b.remove().removeData("mask")})};a.fn.cleanVal=function(){return this.data("mask").getCleanVal()};a.applyDataMask=function(b){b=b||a.jMaskGlobals.maskElements;(b instanceof a?b:a(b)).filter(a.jMaskGlobals.dataMaskAttr).each(f)};k={maskElements:"input,td,span,div",dataMaskAttr:"*[data-mask]",dataMask:!0,watchInterval:300,watchInputs:!0,keyStrokeCompensation:10,useInput:!/Chrome\/[2-4][0-9]|SamsungBrowser/.test(window.navigator.userAgent)&&
k("input"),watchDataMask:!1,byPassKeys:[9,16,17,18,36,37,38,39,40,91],translation:{0:{pattern:/\d/},9:{pattern:/\d/,optional:!0},"#":{pattern:/\d/,recursive:!0},A:{pattern:/[a-zA-Z0-9]/},S:{pattern:/[a-zA-Z]/}}};a.jMaskGlobals=a.jMaskGlobals||{};k=a.jMaskGlobals=a.extend(!0,{},k,a.jMaskGlobals);k.dataMask&&a.applyDataMask();setInterval(function(){a.jMaskGlobals.watchDataMask&&a.applyDataMask()},k.watchInterval)},window.jQuery,window.Zepto);


/////////////////





 $(document).ready( function() {
   /* Executa a requisição quando o campo CEP perder o foco */
   $('#billingAddressPostalCode').blur(function(){
           /* Configura a requisição AJAX */
           $.ajax({
                url : 'consultar_cep.php', /* URL que será chamada */
                type : 'POST', /* Tipo da requisição */
                data: 'cep=' + $('#billingAddressPostalCode').val(), /* dado que será enviado via POST */
                dataType: 'json', /* Tipo de transmissão */
                success: function(data){
                    if(data.sucesso == 1){
                        $('#billingAddressStreet').val(data.rua);
                        $('#billingAddressDistrict').val(data.bairro);
                        $('#billingAddressCity').val(data.cidade);
                        $('#billingAddressState').val(data.estado);
                        $('#billingAddressNumber').focus();
                        $('#billingAddressCountry').val('Brasil');
                    }
                },

                error: function(data) {
                console.log(data);
                }
           });
   return false;
   })
});
$(document).ready( function() {
   /* Executa a requisição quando o campo CEP perder o foco */
   $('#shippingAddressPostalCode').blur(function(){
           /* Configura a requisição AJAX */
           $.ajax({
                url : 'consultar_cep.php', /* URL que será chamada */
                type : 'POST', /* Tipo da requisição */
                data: 'cep=' + $('#shippingAddressPostalCode').val(), /* dado que será enviado via POST */
                dataType: 'json', /* Tipo de transmissão */
                success: function(data){
                    if(data.sucesso == 1){
                        $('#shippingAddressStreet').val(data.rua);
                        $('#shippingAddressDistrict').val(data.bairro);
                        $('#shippingAddressCity').val(data.cidade);
                        $('#shippingAddressState').val(data.estado);
                        $('#shippingAddressNumber').focus();
                    }
                },

                error: function(data) {
                console.log(data);
                }
           });
   return false;
   })
});




    jQuery(function($){
    $("#creditCardHolderBirthDate").mask("99/99/9999");
    $("#senderCPF").mask("999.999.999-99");
    $("#creditCardHolderCPF").mask("999.999.999-99");
    $("#shippingAddressPostalCode").mask("99999-999");
    $("#billingAddressPostalCode").mask("99999-999");
    });

    PagSeguroDirectPayment.setSessionId('');



    function mudaValorParcelas(total,parcelas)
    {
        frete = document.getElementById('frete').value;
        document.getElementById('installmentValue').value = ((parseFloat(total)+parseFloat(frete))/parcelas).toFixed(2);
        //alert(document.getElementById('installmentValue').value);




    }


    function parcelasDisponiveis() {
        PagSeguroDirectPayment.getInstallments({


            amount: parseFloat($("#frete").val()) + parseFloat($("#total").val()),
            brand: $("#creditCardBrand").val(),

            maxInstallmentNoInterest: 2,

            success: function(response) {
                //console.log(response.installments);
                $("#installmentsWrapper").css('display', "block");


                var installments = response.installments[$("#creditCardBrand").val()];

                var options = '';
                var contador = 0;

                for (var i in installments) {

                    contador++;

                    //if(contador>2) break;


                    var optionItem     = installments[i];
                    var optionQuantity = optionItem.quantity;
                    var optionAmount   = optionItem.installmentAmount;
                    var separador = ' - ';
                    var valorTotalCalculado =
                    (optionAmount * optionQuantity).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,').replace(".", ',');

                    var optionLabel    = (optionQuantity + " x R$ " +
                    (optionAmount.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,').replace(".", ','))
                    + " Total R$ "+ valorTotalCalculado );

                    options += ('<option value="' + optionItem.quantity + separador + optionAmount + '">'
                    + optionLabel +'</option>');




                };

                $("#installmentQuantity").html(options);
                //alert(options);

            },

            error: function(response) {
                //console.log(response);
            },

            complete: function(response) {
            }
        });
    }

    $("#installmentQuantity").change(function() {
        var option = $(this).find("option:selected");
        if (option.length) {
            $("#installmentValue").val( option.attr("valorparcela") );
        }
    });


    function brandCard() {

        PagSeguroDirectPayment.getBrand({
            cardBin: $("#cardNumber").val(),
            success: function(response) {
                $("#creditCardBrand").val(response.brand.name);
                $("#cardNumber").css('border', '1px solid #999');

                if (response.brand.expirable) {
                    $("#expiraCartao").css('display', 'block');
                } else {
                    $("#expiraCartao").css('display', 'none');
                }
                if (response.brand.cvvSize > 0) {
                    $("#cvvCartao").css('display', 'block');
                } else {
                    $("#cvvCartao").css('display', 'none');
                }

                $("#bandeiraCartao").attr('src', 'https://stc.pagseguro.uol.com.br/public/img/payment-methods-flags/68x30/' + response.brand.name + '.png');


                parcelasDisponiveis();

            },

            error: function(response) {
                $("#cardNumber").css('border', '2px solid red');
                $("#cardNumber").focus();
            },

            complete: function(response) {

            }

        });


    }

    function cardToken(){
        document.getElementById('senderHash').value = PagSeguroDirectPayment.getSenderHash();
        PagSeguroDirectPayment.createCardToken({

                cardNumber: $("#cardNumber").val(),
                brand: $("#creditCardBrand").val(),
                cvv: $("#cardCvv").val(),
                expirationMonth: $("#cardExpirationMonth").val(),
                expirationYear: $("#cardExpirationYear").val(),

                success: function (response) {
                    $("#creditCardToken").val(response.card.token);
                },
                error: function (response) {
                    if (response.error) {

                        $("#erroPagSeguro").html("<font color='red'>Erro</font>");


                        $.each(response.errors, function (index, value) {
                            console.log(value);

                            //tratarError(value);
                        });
                    }
                },
                complete: function (response) {

                }

            });


    }



    function tratarError(id) {
    if (id.charAt(0) == '2') id = id.substr(1);

    if (id == "53020" || id == '53021') {
        $("#erroPagSeguro").append("<p>Verifique telefone inserido</p>");
        $("#senderPhone").css('border', '2px solid red');

    } else if (id == "53010" || id == '53011' || id == '53012') {
        $("#erroPagSeguro").append("<p>Verifique o e-mail inserido</p>");
        $("#senderEmail").css('border', '2px solid red');

    } else if (id == "53017") {
        $("#erroPagSeguro").append("<p>Verifique o CPF inserido</p>");
        $("#senderCPF").css('border', '2px solid red');

    } else if (id == "53018" || id == "53019") {
        $("#erroPagSeguro").append("<p>Verifique o DDD inserido</p>");
        $("#senderAreaCode").css('border', '2px solid red');

    } else if (id == "53013" || id == '53014' || id == '53015') {
        $("#erroPagSeguro").append("<p>Verifique o nome inserido</p>");
        $("#senderName").css('border', '2px solid red');

    } else if (id == "53029" || id == '53030') {
        $("#erroPagSeguro").append("<p>Verifique o bairro inserido</p>");
        $("#shippingAddressDistrict").css('border', '2px solid red');

    } else if (id == "53022" || id == '53023') {
        $("#erroPagSeguro").append("<p>Verifique o CEP inserido</p>");
        $("#shippingAddressPostalCode").css('border', '2px solid red');

    } else if (id == "53024" || id == '53025') {
        $("#erroPagSeguro").append("<p>Verifique a rua inserido</p>");
        $("#shippingAddressStreet").css('border', '2px solid red');

    } else if (id == "53026" || id == '53027') {
        $("#erroPagSeguro").append("<p>Verifique o número inserido</p>");
        $("#shippingAddressNumber").css('border', '2px solid red');

    } else if (id == "53033" || id == '53034') {
        $("#erroPagSeguro").append("<p>Verifique o estado inserido</p>");
        $("#shippingAddressState").css('border', '2px solid red');

    } else if (id == "53031" || id == '53032') {
        $("#erroPagSeguro").append("<p>Verifique a cidade informada</p>");
        $("#shippingAddressCity").css('border', '2px solid red');

    } else if (id == '10001') {
        $("#erroPagSeguro").append("<p>Verifique o número do cartão inserido</p>");
        $("#cardNumber").css('border', '2px solid red');

    } else if (id == '10002' || id == '30405') {
        $("#erroPagSeguro").append("<p>Verifique a data de validade do cartão inserido</p>");
        $("#cardExpirationMonth").css('border', '2px solid red');
        $("#cardExpirationYear").css('border', '2px solid red');

    } else if (id == '10004') {
        $("#erroPagSeguro").append("<p>É obrigatorio informar o código de segurança, que se encontra no verso, do cartão</p>");
        $("#cardCvv").css('border', '2px solid red');

    } else if (id == '10006' || id == '10003' || id == '53037') {
        $("#erroPagSeguro").append("<p>Verifique o código de segurança do cartão informado</p>");
        $("#cardCvv").css('border', '2px solid red');

    } else if (id == '30404') {
        $("#erroPagSeguro").append("<p>Ocorreu um erro. Atualize a página e tente novamente!</p>");

    } else if (id == '53047') {
        $("#erroPagSeguro").append("<p>Verifique a data de nascimento do titular do cartão informada</p>");
        $("#creditCardHolderBirthDate").css('border', '2px solid red');

    } else if (id == '53053' || id == '53054') {
        $("#erroPagSeguro").append("<p>Verifique o CEP inserido</p>");
        $("#billingAddressPostalCode").css('border', '2px solid red');

    } else if (id == '53055' || id == '53056') {
        $("#erroPagSeguro").append("<p>Verifique a rua inserido</p>");
        $("#billingAddressStreet").css('border', '2px solid red');

    } else if (id == '53042' || id == '53043' || id == '53044') {
        $("#erroPagSeguro").append("<p>Verifique o nome inserido</p>");
        $("#creditCardHolderName").css('border', '2px solid red');

    } else if (id == '53057' || id == '53058') {
        $("#erroPagSeguro").append("<p>Verifique o número inserido</p>");
        $("#billingAddressNumber").css('border', '2px solid red');

    } else if (id == '53062' || id == '53063') {
        $("#erroPagSeguro").append("<p>Verifique a cidade informada</p>");
        $("#billingAddressCity").css('border', '2px solid red');

    } else if (id == '53045' || id == '53046') {
        $("#erroPagSeguro").append("<p>Verifique o CPF inserido</p>");
        $("#creditCardHolderCPF").css('border', '2px solid red');

    } else if (id == '53060' || id == '53061') {
        $("#erroPagSeguro").append("<p>Verifique o bairro inserido</p>");
        $("#billingAddressDistrict").css('border', '2px solid red');

    } else if (id == '53064' || id == '53065') {
        $("#erroPagSeguro").append("<p>Verifique o estado inserido</p>");
        $("#billingAddressState").css('border', '2px solid red');

    } else if (id == '53051' || id == '53052') {
        $("#erroPagSeguro").append("<p>Verifique telefone inserido</p>");
        $("#billingAddressState").css('border', '2px solid red');

    } else if (id == '53049' || id == '53050') {
        $("#erroPagSeguro").append("<p>Verifique o código de área informado</p>");
        $("#creditCardHolderAreaCode").css('border', '2px solid red');

    } else if (id == '53122') {
        $("#erroPagSeguro").append("<p>Enquanto na sandbox do PagSeguro, o e-mail deve ter o domínio'@sandbox.pagseguro.com.br' (ex.: comprador@sandbox.pagseguro.com.br)</p>");

    }

}

</script>


<!DOCTYPE html>
<html>
<title>Vitrine de Soluções 4sis</title>
<meta charset="ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="shortcut icon" href="https://www.4sis.com.br/novoLogo.ico" type="image/x-icon" />
<link rel="icon" href="https://www.4sis.com.br/novoLogo.ico" type="image/x-icon" />

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-colors-2017.css">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-colors-2019.css">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-colors-vivid.css">
<link rel="stylesheet" href="https://www.w3schools.com/lib/w3-colors-camo.css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<meta name="description" content="Vitrine de Soluções 4sis"/>
<meta name="keywords" content="desenvolvimento de sistemas, desenvolvimento de software, desenvolvimento de aplicativos,
gestão de negócios, erp, sistema, programa, software, programa aluguel de trajes, programa locação roupas, erp locação, sistema,
programa, software, loja de aluguel de trajes, loja de locação de roupas, planilha locação traje, planilha aluguel, planilha atendimento,
agenda de atendimento, crm, leads, controle de leads, follow-up de leads, cosultório odontológico,
Programa para controle de ativos"/>
<style>

body,h1,h2,h3,h4,h5,h6 {font-family: "Poppins", sans-serif}
.mySlides {display:none}
.w3-tag, .fa {cursor:pointer}
.w3-tag {height:15px;width:15px;padding:0;margin-top:6px}



</style>

    <meta property="og:url"           content="https://www.estoque.club/loja" />
    <meta property="og:type"          content="website" />
    <meta property="og:title"         content="Vitrine de Soluções 4sis" />
    <meta property="og:description"   content="desenvolvimento de sistemas, desenvolvimento de software, desenvolvimento de aplicativos,
gestão de negócios, erp, sistema, programa, software, programa aluguel de trajes, programa locação roupas, erp locação, sistema,
programa, software, loja de aluguel de trajes, loja de locação de roupas, planilha locação traje, planilha aluguel, planilha atendimento,
agenda de atendimento, crm, leads, controle de leads, follow-up de leads, cosultório odontológico,
Programa para controle de ativos" />
    <meta property="og:image"         content=http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/1-ts-1584650589-ts-.png" /><div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = 'https://connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v3.1&appId=219180878642349&autoLogAppEvents=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-56471112-2"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-56471112-2');
</script>

<body style="max-width:1500px;">


<!-- Navbar (sit on top) -->

    <!-- Navbar Tela Grande-->
    <div class="w3-top w3-center w3-text-white" style="background-color: #00b0c8;">

    <div class="w3-row w3-sand w3-hide-small">
            <div class="w3-third w3-center">
                <br><br>
                <a href="index_comoFunciona.php" class="w3-button w3-hover-white w3-medium">
                COMO FUNCIONA <i class="fa fa-question"></i></a>

            </div>
            <div class="w3-third">
                <div class="w3-center w3-padding" style="width:100%;left:0;top:40;">
                <a href="index.php"><img src="http://app.4sis.com.br/4Control/app.files/logos/bd_4control_vitrina_live/logopequeno-ts-1579542727-ts-.png" class="w3-image" style="border: 0;" alt=""></a>
                </div>
            </div>
            <div class="w3-third w3-center">
                <br>
                <a href="index.php#Empresa" class="w3-padding-small w3-button w3-hover-sand w3-hide-small w3-medium">
                <img src="logo4sisBola.png" class="w3-image" style="width:10%; border: 0;" alt=""> VITRINE 4SIS</a>
                <br><a href="index.php#Contato" class="w3-padding-small w3-button w3-hover-sand w3-hide-small w3-medium">
                &nbsp;&nbsp;<i class="fa fa-envelope"></i> CONTATO</a>

            </div>
        </div>

        <div class="w3-hide-medium w3-hide-large w3-white w3-center">
                <a href="tel:+55(12)2012-5003"
                class="w3-button w3-hover-white w3-hide-medium w3-hide-large w3-medium"><i class="fa fa-phone" style="font-size:25px;"></i></a>
                &nbsp;&nbsp;
                <a href="index.php"><img src="http://app.4sis.com.br/4Control/app.files/logos/bd_4control_vitrina_live/logopequeno-ts-1579542727-ts-.png" class="w3-image" style="width:50%;border: 0;"></a>
                &nbsp;&nbsp;
                <a class="w3-button w3-hover-white w3-hide-medium w3-hide-large w3-medium"  target="_blank"
                href="https://api.whatsapp.com/send?phone=551220125003&text=Olá acessei o site Vitrine de Soluções 4sis!"><i class="fa fa-whatsapp" style="font-size:25px;"></i></a>
        </div>

    <a href="javascript:void(0);" onclick="showNav('demo')"
    class="w3-padding-small w3-hide-medium w3-hide-large w3-bar-item w3-btn"><i class="fa fa-bars"></i></a>
    <!--
    <a href="#mostraCadastrar" onclick="jsBusca1('gravaCarrinho.php?mostraCadastrar=1','mostraCadastrar');"
    class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn">
    <i class="fa fa-user-circle-o" style="color:LightBlue;"></i>&nbsp;MINHA CONTA</a>
    !-->
    <a href="index.php#Novidades" class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn"><i class="fa fa-star" style="color:yellow;"></i>&nbsp; NOVIDADES</a>
    <a href="index.php#Queridinhos" class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn"><i class="fa fa-heart" style="color:red;"></i>&nbsp; QUERIDINHOS</a>

        <a href="#Filtros" onclick="document.getElementById('mostraFiltro').style.display='inline'" class="w3-button w3-padding-small w3-hide-large w3-hide-medium w3-medium w3-bar-item w3-btn"><i class="fa fa-filter"></i></a>
    
    <div class="w3-dropdown-hover">
    <button class="w3-button">ENCONTRE SOLUÇÕES</button>
    <div class="w3-dropdown-content w3-bar-block w3-card-4 w3-light-grey">
                        <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=1#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Consultoria</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=3#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Desenvolvimento de Software</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=8#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Loja Virtual</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=9#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Módulos e Adicionais</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=4#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Produtos Exclusivos</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=2#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Sistema de Gestão</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=6#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Site</a>
                                <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_ocasiao=7#Produtos1"
                     class="w3-bar-item w3-button w3-small"
                     onclick="document.getElementById('mostraFiltro').style.display='none'"
                     >&nbsp;&nbsp;Treinamento</a>
                </div>
    </div>


    <!--
    <a title="Meu Carrinho" onclick="document.getElementById('mostrarMeuCarrinho').style.display='block';
    jsBusca1('gravaCarrinho.php?visualizar=1','meuCarrinho');"
    href="#Carrinho"
    class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn w3-tooltip">
    <i class="fa fa-shopping-cart w3-text-white"></i></a>
    !-->
    <a href="index.php#Endereco" title="Onde Estamos" class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn">
        <i class="fa fa-map-marker w3-text-white"></i></a>
    <!--
    <a href="https://www.instagram.com/4sis.club/" target="_blank"
    class="w3-button w3-padding-small w3-hide-small w3-medium w3-bar-item w3-btn">
        <i class="fa fa-instagram"></i>&nbsp;INSTAGRAM</a>
    !-->


  </div>

  <!-- Navbar Tela Pequena-->
  <form action="index.php#Produtos" method="post" name="busca2" id="busca2">
  <div class="w3-top w3-bar w3-xxlarge w3-text-white w3-hide w3-hide-large w3-hide-medium" id="demo"
  style="background-color: #00b0c8;">
    <a href="javascript:void(0);" onclick="showNav('demo')"
    class="w3-left w3-padding-small w3-hide-medium w3-hide-large w3-bar-item w3-btn w3-mobile"><i class="fa fa-close" style="font-size:12px;"></i></a>
    <a href="index.php#Empresa" onclick="showNav('demo')" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">VITRINE 4SIS</a>
    <a href="index_comoFunciona.php" onclick="showNav('demo')" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">COMO FUNCIONA</a>
    <!-- <a href="#mostraCadastrar" onclick="showNav('demo');jsBusca2('gravaCarrinho.php?mostraCadastrar=1','mostraCadastrar');"
    class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">
    <i class="fa fa-user-circle-o" style="color:LightBlue;"></i>&nbsp;MINHA CONTA</a>!-->
    <a href="index.php#Produtos1" onclick="showNav('demo')" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">COMPRE</a>
    <a href="index.php#Contato" onclick="showNav('demo')" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">CONTATO</a>
    <a href="index.php#Endereco" onclick="showNav('demo')" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">
    <i class="fa fa-map-marker"></i>&nbsp;ONDE ESTAMOS</a>
    <!--
    <a href="#Carrinho"
     onclick="showNav('demo');document.getElementById('mostrarMeuCarrinho').style.display='block';
     jsBusca1('gravaCarrinho.php?visualizar=1','meuCarrinho');" class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">
         <i class="fa fa-shopping-cart w3-text-white"></i></a>
    <a href="https://www.instagram.com/4sis.club/" onclick="showNav('demo')" target="_blank"
    class="w3-button w3-medium w3-bar-item w3-btn w3-mobile">
        <i class="fa fa-instagram"></i>&nbsp;INSTAGRAM</a>
    !-->


</div>

  </form>





<div style="max-width:1500px; margin-left:200px; margin-right:0px; top:50;"><br><br><br><br>
<header>
  <!-- Slideshow -->
  <!-- <div class="w3-hide-small">-->
  <div>

          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/1-ts-1584650589-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/1-ts-1584650589-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/2-ts-1584650425-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/2-ts-1584650425-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/3-ts-1584650650-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/3-ts-1584650650-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/4-ts-1584651139-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/4-ts-1584651139-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/5-ts-1584651199-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/5-ts-1584651199-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/6-ts-1584651244-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/6-ts-1584651244-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/7-ts-1584651293-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/7-ts-1584651293-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/8-ts-1584651320-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/8-ts-1584651320-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/9-ts-1584651352-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/9-ts-1584651352-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/10-ts-1584651397-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/10-ts-1584651397-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/11-ts-1584651426-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/11-ts-1584651426-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
          <div class="w3-display-container w3-center mySlides">
        <a href="">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/12-ts-1584652157-ts-.png" style="width:95%" class="w3-hide-small">
        <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/12-ts-1584652157-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
        </a>
      </div>
  

  <!-- Slideshow next/previous buttons -->

  <div class="w3-container w3-padding-8 w3-medium w3-white">
    <div class="w3-center">
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(1)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(2)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(3)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(4)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(5)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(6)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(7)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(8)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(9)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(10)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(11)"></span>
     <span class="w3-tag demodots w3-border w3-transparent w3-hover-white" onclick="currentDiv(12)"></span>
     </div>
  </div>

  </div>




<div class="w3-container w3-center">
<img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/solucao-ts-1584828191-ts-.png" style="width:95%" class="w3-hide-small">
<img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/solucao-ts-1584828191-ts-.png" style="width:95%" class="w3-hide-large w3-hide-medium">
</div>

</header>


<style>



#myBtn {
  display: inline;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: green;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}
#myBtn:hover {
  background-color: #555;
}

#myBtnCarrinho {
  display: inline;
  position: fixed;
  bottom: 80px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: LightBlue;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}
#myBtnCarrinho:hover {
  background-color: #555;
}


</style>

<a id="myBtn" class="w3-medium w3-btn w3-hide-small"  target="_blank"
href="https://api.whatsapp.com/send?phone=551220125003&text=Olá acessei o site Vitrine de Soluções 4sis!">
whatsapp <i class="fa fa-whatsapp"></i></a>

<a id="myBtnCarrinho" class="w3-medium w3-btn w3-hide-large w3-hide-medium"
href="#Carrinho" onclick="document.getElementById('mostrarMeuCarrinho').style.display='block';
jsBusca1('gravaCarrinho.php?visualizar=1','meuCarrinho');">
<i class="fa fa-shopping-cart"></i></a>

<a id="myBtn" class="w3-medium w3-btn w3-hide-large w3-hide-medium"  target="_blank"
href="https://api.whatsapp.com/send?phone=551220125003&text=Olá acessei o site Vitrine de Soluções 4sis!">
<i class="fa fa-whatsapp"></i></a>
<!-- tela grande !-->
<div class="w3-hide-small w3-white w3-sidebar w3-bar-block w3-small" style="width:13%;left:0;top:145;">

        <form action="index.php#Produtos1" method="post" name="busca1" id="busca1">
            <div class="w3-padding w3-center">
            <input class="w3-bar-item w3-input w3-border w3-round" name="txt_busca" id="txt_busca" type="text"
            placeholder="o que procura?"
            value = ><p class="w3-tinny"></p>
            <a href="#"  class="w3-button w3-black w3-round" onClick="document.getElementById('busca1').submit();">
            <i class="fa fa-search"></i>buscar</a>
            </div>
        </form>

        <!--

        <p class="w3-center w3-medium">FILTROS <i class="fa fa-sliders"></i></p>



        <div class="w3-dropdown-hover">
        <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_cor=&txt_tamanho=&txt_preco=#Produtos1"
        class=" w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn"></a>

        <div class="w3-dropdown-content w3-bar-block w3-card-4">

                </div>
        </div>

        
        <div class="w3-dropdown-hover">
        <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_tamanho=&txt_cor=&txt_preco=#Produtos1"
        class="w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn">TAMANHOS</a>
        <div class="w3-dropdown-content w3-bar-block w3-card-4 w3-padding">
        
        </div>
        </div>

        


        <div class="w3-dropdown-hover">
        <button href="#Produtos1"
        class="w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn">PREÇO</button>
        <div class="w3-dropdown-content w3-bar-block w3-card-4">
                        <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=1&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 150 ~ R$ 350</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=2&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 350 ~ R$ 550</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=3&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 550 ~ R$ 750</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=4&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 750 ~ R$ 950</a>
             <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=5&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 950 ~ R$ 1150</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=6&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1150 ~ R$ 1350</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=7&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1350 ~ R$ 1500</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=8&txt_cor=&txt_tamanho=#Produtos1"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1500 ~ R$ 2000</a>
                    </div>
        </div>

                                
        
        
        
        
        !-->

              <br><br>
       <a href="index_comoFunciona.php">
       <img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/estoqueclubpng-ts-1584997831-ts-." class="w3-margin w3-image w3-round w3-hover-opacity w3-hide-small">
       </a>
       






    <div id="listaCarrinho">
    </div>

    <div id="erroPagseguro">
    </div>





</div>


<!-- Busca as Famílias do Sistema -->


<!-- CONSULTORIAS E SOFTWARE SOBRE MEDIDA Container -->
<!-- <br><br><br><br><br><br> !-->
<a name='Filtros'></a>
        <div id="mostraFiltro" style="display:inline;" class="w3-hide-large w3-hide-medium">
            <div class="w3-white">
            <!-- tela pequena !-->
        <form action="index.php#Produtos1" method="post" name="buscaTelaPequena" id="buscaTelaPequena">
            <div class="w3-padding w3-center">
            <input class="w3-bar-item w3-input w3-border w3-round" name="txt_buscaTelaPequena" id="txt_buscaTelaPequena" type="text"
            placeholder="o que procura?"
            value = ><p class="w3-tinny"></p>
            <a href="#"  class="w3-button w3-black w3-round" onClick="document.getElementById('buscaTelaPequena').submit();">
            <i class="fa fa-search"></i>buscar</a>
            </div>
        </form>

        <!-- 
        <p class="w3-center w3-medium">FILTROS <i class="fa fa-sliders"></i></p>



        <div class="w3-dropdown-hover">
        <a
        class=" w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn">CORES</a>


        <div class="w3-dropdown-content w3-bar-block w3-card-4">

                </div>
        </div>

        
        <hr>

        <div class="w3-dropdown-hover">
        <a
        class="w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn">TAMANHOS</a>
        <div class="w3-dropdown-content w3-bar-block w3-card-4 w3-padding">
        
        </div>
        </div>

        


        <hr>

        <div class="w3-dropdown-hover">
        <button href="#Produtos2"
        class="w3-padding-small w3-border-bottom w3-button w3-medium w3-bar-item w3-btn">PREÇO</button>
        <div class="w3-dropdown-content w3-bar-block w3-card-4">
                        <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=1&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 150 ~ R$ 350</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=2&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 350 ~ R$ 550</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=3&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 550 ~ R$ 750</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=4&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 750 ~ R$ 950</a>
             <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=5&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 950 ~ R$ 1150</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=6&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1150 ~ R$ 1350</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=7&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1350 ~ R$ 1500</a>
            <a href="index.php?produtoId=subFamilia&familiaId=subFamilia&subFamiliaId=$familiaId&txt_preco=8&txt_cor=&txt_tamanho=#Filtros"
            class="w3-bar-item w3-button w3-border-bottom">R$ 1500 ~ R$ 2000</a>
                    </div>
        </div>

                                
        
        
        
        
       
       !-->            </div>
        </div>
<a name='Produtos1'></a>
<div class="w3-container w3-center w3-padding-64">
    <br><br><br>
    </div>


<!-- CONSULTORIAS E SOFTWARE SOBRE MEDIDA Container -->
<!-- <br><br><br><br><br><br> !-->
<a name='Novidades'></a>
<div class="w3-container w3-center w3-padding-64">
    <br><br><br><br>
    <span id="txt_contato" class="w3-center w3-xxlarge w3-bottombar w3-border-dark-grey">NOVIDADES</span>
    <br><br><br>
     <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL003</b> - --!>Hora de Consultoria</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=3&detalhe=Hora de Consultoria&txt_cor=&txt_tamanho=&txt_preco=#3"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/consultoria-ts-1584655144-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Hora de Consultoria" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/consultoria-ts-1584655144-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Hora de Consultoria" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/consultoria-ts-1584655144-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Hora de Consultoria" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=3&detalhe=Hora de Consultoria&txt_cor=&txt_tamanho=&txt_preco=#3"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 95,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL005</b> - --!>Sistema de Gestão</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=5&detalhe=Sistema de Gestão&txt_cor=&txt_tamanho=&txt_preco=#5"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemamaquinadevendas-ts-1584716368-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemamaquinadevendas-ts-1584716368-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemamaquinadevendas-ts-1584716368-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=5&detalhe=Sistema de Gestão&txt_cor=&txt_tamanho=&txt_preco=#5"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 1.668,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL007</b> - --!>Sistema de Gestão</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=8&detalhe=Sistema de Gestão&txt_cor=&txt_tamanho=&txt_preco=#8"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584722749-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584722749-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584722749-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Sistema de Gestão" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=8&detalhe=Sistema de Gestão&txt_cor=&txt_tamanho=&txt_preco=#8"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 1.668,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL004</b> - --!>Sistema Vitrina</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=4&detalhe=Sistema Vitrina&txt_cor=&txt_tamanho=&txt_preco=#4"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584661695-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Sistema Vitrina" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584661695-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Sistema Vitrina" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sistemagestao-ts-1584661695-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Sistema Vitrina" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=4&detalhe=Sistema Vitrina&txt_cor=&txt_tamanho=&txt_preco=#4"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 2.400,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL002</b> - --!>Hora de Treinamento</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=2&detalhe=Hora de Treinamento&txt_cor=&txt_tamanho=&txt_preco=#2"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamento-ts-1584655065-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Hora de Treinamento" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamento-ts-1584655065-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Hora de Treinamento" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamento-ts-1584655065-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Hora de Treinamento" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=2&detalhe=Hora de Treinamento&txt_cor=&txt_tamanho=&txt_preco=#2"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 85,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>IMP001</b> - --!>Importação de Dados</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=29&detalhe=Importação de Dados&txt_cor=&txt_tamanho=&txt_preco=#29"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/202004200134220001-ts-1587357851-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Importação de Dados" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/202004200134220001-ts-1587357851-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Importação de Dados" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/202004200134220001-ts-1587357851-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Importação de Dados" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=29&detalhe=Importação de Dados&txt_cor=&txt_tamanho=&txt_preco=#29"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 60,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>PE001</b> - --!>3 Banners Capa + 1 Lateral</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=26&detalhe=3 Banners Capa + 1 Lateral&txt_cor=&txt_tamanho=&txt_preco=#26"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/banners-ts-1585683280-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="3 Banners Capa + 1 Lateral" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/banners-ts-1585683280-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="3 Banners Capa + 1 Lateral" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/banners-ts-1585683280-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="3 Banners Capa + 1 Lateral" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=26&detalhe=3 Banners Capa + 1 Lateral&txt_cor=&txt_tamanho=&txt_preco=#26"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 150,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL001</b> - --!>Hora de Desenvolvimento</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=1&detalhe=Hora de Desenvolvimento&txt_cor=&txt_tamanho=&txt_preco=#1"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/horasw-ts-1584654111-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Hora de Desenvolvimento" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/horasw-ts-1584654111-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Hora de Desenvolvimento" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/horasw-ts-1584654111-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Hora de Desenvolvimento" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=1&detalhe=Hora de Desenvolvimento&txt_cor=&txt_tamanho=&txt_preco=#1"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 97,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VL0041</b> - --!>Treinamento OnLine Sistema Vitrina</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=30&detalhe=Treinamento OnLine Sistema Vitrina&txt_cor=&txt_tamanho=&txt_preco=#30"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamentovitrina-ts-1587511708-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Treinamento OnLine Sistema Vitrina" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamentovitrina-ts-1587511708-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Treinamento OnLine Sistema Vitrina" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/treinamentovitrina-ts-1587511708-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Treinamento OnLine Sistema Vitrina" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=30&detalhe=Treinamento OnLine Sistema Vitrina&txt_cor=&txt_tamanho=&txt_preco=#30"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 990,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                            
</div>

<!-- CONSULTORIAS E SOFTWARE SOBRE MEDIDA Container -->
<!-- <br><br><br><br><br><br> !-->
<a name='Queridinhos'></a>
<div class="w3-container w3-center w3-padding-64">
    <br><br><br><br><span id="txt_contato" class="w3-center w3-xxlarge w3-bottombar w3-border-dark-grey">OS MAIS QUERIDINHOS</span>
    <br><br><br>

     <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VLS05</b> - --!>Site Loja Vitrina.Live</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=23&detalhe=Site Loja Vitrina.Live#23"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitevitrina-1-ts-1584900050-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Site Loja Vitrina.Live" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitevitrina-1-ts-1584900050-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Site Loja Vitrina.Live" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitevitrina-1-ts-1584900050-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Site Loja Vitrina.Live" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=23&detalhe=Site Loja Vitrina.Live&txt_cor=&txt_tamanho=&txt_preco=#23"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 1.188,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VLS04</b> - --!>Site Catálogo Virtual</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=22&detalhe=Site Catálogo Virtual&txt_cor=&txt_tamanho=&txt_preco=#22"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitecatalogovirtual-ts-1584741827-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Site Catálogo Virtual" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitecatalogovirtual-ts-1584741827-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Site Catálogo Virtual" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitecatalogovirtual-ts-1584741827-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Site Catálogo Virtual" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=22&detalhe=Site Catálogo Virtual&txt_cor=&txt_tamanho=&txt_preco=#22"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 1.000,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                             <div class=" w3-mobile
                                         w3-card-4 w3-center w3-hover-border-black
                                         w3-border w3-round-small
                                    w3-quarter w3-white"
                                    >
                                    <h4 style="height:40px;"><!-- <b>VLS03</b> - --!>Site para Lead</h4>
                                    <p style="height:300px;">  
                        <a
                        href="detalheProduto.php?produto=21&detalhe=Site para Lead&txt_cor=&txt_tamanho=&txt_preco=#21"
                        class="w3-white w3-round w3-medium">

                        <!-- <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitelead-ts-1584803580-ts-.png"
                        style="width:50%"
                        class="w3-hide-medium w3-hide-large w3-round w3-image w3-hover-opacity"
                        title="Site para Lead" >


                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitelead-ts-1584803580-ts-.png"
                        class="w3-hide-small w3-round w3-image w3-hover-opacity"
                        title="Site para Lead" >
                        !-->

                        <img src="http://app.4sis.com.br/4Control/app.files/fotosProdutos/bd_4control_vitrina_live/sitelead-ts-1584803580-ts-.png"
                        class="w3-round w3-image w3-hover-opacity"
                        title="Site para Lead" >

                        </a>  </p>
                                    <p><a
            href="detalheProduto.php?produto=21&detalhe=Site para Lead&txt_cor=&txt_tamanho=&txt_preco=#21"
            class="w3-button w3-white w3-black w3-round w3-medium"><i class="fa fa-external-link"></i> mais detalhes</a>
            </p>
                                    <br><b>R$ 1.200,00</b>
                                    <!-- <br><b></b> !-->
                            </div>


                            
</div>















<!-- <br><br><br><br><br><br> !-->
<a name='Empresa'></a>
<div class="w3-container w3-padding-64 w3-center">
    <br><br><br>
    <span id="txt_contato" class="w3-center w3-xxlarge w3-bottombar w3-border-dark-grey">VITRINE 4SIS</span>
        <div class="w3-content" >
            <div class="w3-row-padding">
               <div class="w3-half">
                    <div class="w3-justify w3-large" id="EmpresaHistoria">
                                        <p>A <strong>Vitrine 4sis</strong> nasce após 15 anos desenvolvendo e implantando sistemas, sites, realizando treinamentos&nbsp;e pacotes personalizados em empresas que mudaram suas histórias depois de conhecer nossos produtos e serviços.</p>

<p>Se sua empresa precisa de um <strong>Sistema de Gestão</strong>,&nbsp;<strong>Site Personalizado</strong>, ou de um <strong>Site para Agendamento</strong>, de uma <strong>Loja Virtual seja para alugar ou vender</strong>, se sua Empresa precisa de <strong>Desenvolvimento de Software</strong>, de <strong>Consultoria em TI</strong>, de <strong>Treinamento Customizado</strong> para suas necessidades, você encontrou o lugar certo para encomendar agora mesmo seu pacote de soluções para realizar seu sonho.</p>

<p>Não perca mais tempo, entre em contato conosco e&nbsp;<strong>BONS NEGÓCIOS</strong>!</p>                    </div>
                </div>
                <div class="w3-half" id="EmpresaMissao">
                        <br><img src="http://app.4sis.com.br/4Control/app.files/fotosNoticia/bd_4control_vitrina_live/sonhos-ts-1584652859-ts-.png" title="entre em contato"
                        class="w3-image w3-round" style="width:90%">
                </div>

                 <div class='embedsocial-instagram' data-ref="85bdab836ec7e321ee398774f09b2e803a016a1b"></div>
        <script>(function(d, s, id){var js; if (d.getElementById(id)) {return;} js = d.createElement(s);
        js.id = id; js.src = "https://embedsocial.com/embedscript/in.js"; d.getElementsByTagName("head")[0].appendChild(js);}
        (document, "script", "EmbedSocialInstagramScript"));</script>
            </div>
        </div>
</div><br><br><br>
<a name='Contato'></a>
<div class="w3-container w3-padding-64 w3-center">
    <br><br><br><br>
    <span id="txt_contato" class="w3-center w3-xxlarge w3-bottombar w3-border-dark-grey">CONTATO</span>
    <br><br>
      <div class="w3-row-padding">
      <div class="w3-half">
          <img src="contato.png" title="entre em contato"
          class="w3-image w3-round" style="width:80%">
      </div>
      <div class="w3-half">
           <form action="#Contato" method="post">
          <p><input class="w3-input w3-border w3-xlarge" type="text" placeholder="Nome" name="txt_nome" id="txt_nome" type="text" value="" required></p>
          <p><input class="w3-input w3-border w3-xlarge" placeholder="Empresa (não obrigatório)" name="txt_empresa" id="txt_empresa" type="text" value="" ></p>
          <p><input class="w3-input w3-border w3-xlarge" placeholder="@instagram (não obrigatório)" name="txt_instagram" id="txt_instagram" type="text" value="" ></p>
          <p><input class="w3-input w3-border w3-xlarge" placeholder="E-mail" name="txt_email" id="txt_email" type="text" value="" required></p>
          <p><input class="w3-input w3-border w3-xlarge" placeholder="Telefone/Whatsapp" name="txt_fone" id="txt_fone" type="tel"  value="" required></p>
          <p><textarea class="w3-input w3-border w3-xlarge" rows="2" type="text" placeholder="Mensagem" name="txt_msg" id="txt_msg"
          required required>Gostaria%20de%20mais%20detalhes%20sobre%20o%20item:%20Hora%20de%20Treinamento%20-%20c%EF%BF%BD%EF%BF%BDdigo:%20VL002%20-%20R$%20R$%2085,00          </textarea></p>

         <button type="submit" class="w3-large w3-btn w3-text-white w3-round-large"
          style="background-color: #00b0c8;" value="enviar" name="enviar">Enviar</button>


      </form>
      </div>

   </div>
  </div><br><br>
<a name='Endereco'></a>
  <div class="w3-container w3-content w3-padding-64 w3-center w3-mobile">
    <br><br><br><br>
    <span id="txt_contato" class="w3-center w3-xxlarge w3-bottombar w3-border-dark-grey">ENDEREÇO</span>


    <p class="w3-center">
    <b>
    Rua dos Piquiroes, 40, Sala 312, Parque Residencial Aquarius - São José dos Campos - SP - Cep.: 12246-020    </b>
    </p>
    <p class="w3-center w3-hide-small">
        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3666.77497170748!2d-45.9109546853461!3d-23.214870054772152!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x94cc4b898c13be03%3A0x343cdc9ced6c4a7a!2s4sis%20-%20Especialistas%20em%20Produtividade!5e0!3m2!1spt-BR!2sbr!4v1584646024609!5m2!1spt-BR!2sbr"
        width="600" height="450" frameborder="0" style="border:0;"
        allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
    </p>
   </div>
<!-- Contato  Container  -->

<div id='mostraCadastrar'></div>
<a name='Cadastrar'></a>
<div id='mostraDadosCadastro'>

</div>

<br><br><br><br>
<a name='Carrinho'></a>
<div class="w3-container w3-center" style="display: none;" id="mostrarMeuCarrinho">
    <span class="w3-center w3-xxlarge">MEU CARRINHO</span>

    <div id="meuCarrinho">

    </div>


    <div id="meuCarrinhoEnvia" style="visibility: hidden;">
    </div>
    <!--
    <button value="visualizar"
            onclick="jsBusca1('gravaCarrinho.php?visualizar=1','meuCarrinho');"
            class="w3-button w3-white"><i class="fa fa-shopping-cart"></i> mostrar carrinho</button>
    !-->

    <button value="limpar"
            onclick="jsBusca1('gravaCarrinho.php?limpar=1','meuCarrinho');"
            class="w3-button w3-white"><i class="fa fa-close"></i> limpar carrinho</button>


    <button value="enviar"
            onclick="
            jsBusca1('gravaCarrinho.php?mostraComprar=1','mostraComprar');"
            class="w3-button w3-white"><i class="fa fa-shopping-cart"></i> finalizar carrinho</button>






</div>



<a name='finalizaCompra'></a>
<div id='mostraComprar'></div>
<div id='mostraCadastrar'></div>
<div id="erroPagseguro">
</div>



<!-- Footer -->
<footer class="w3-container w3-padding-32 w3-black w3-center">
    <p><i class="fa fa-whatsapp"></i>(12)2012-5003 - (12)2012-5003  <i class="fa fa-at"></i> contato@4sis.com.br</p>
    <p>Rua dos Piquiroes, 40, Sala 312, Parque Residencial Aquarius - São José dos Campos - SP - Cep.: 12246-020</p>
    <div class="w3-row-padding w3-center">
    Powered by <a href="https://www.4sis.com.br">4sis.com.br</a>
    </div>
</footer>

</div>
</body>
</html>
<script>

var myIndex = 0;
carousel();

function carousel() {
  var i;
  var x = document.getElementsByClassName("mySlides");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  }
  myIndex++;
  if (myIndex > x.length) {myIndex = 1}
  x[myIndex-1].style.display = "block";
  setTimeout(carousel, 5000); // Change image every 2 seconds
}

function w3_open() {
  document.getElementById("mySidebar").style.display = "block";
}

function w3_close() {
  document.getElementById("mySidebar").style.display = "none";
}

// Slideshow script
var slideIndex = 1;
showDivs(slideIndex);

function plusDivs(n) {
  showDivs(slideIndex += n);
}

function currentDiv(n) {
  showDivs(slideIndex = n);
}

function showDivs(n) {
  var i;
  var x = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("demodots");
  if (n > x.length) {slideIndex = 1}
  if (n < 1) {slideIndex = x.length} ;
  for (i = 0; i < x.length; i++) {
     x[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
     dots[i].className = dots[i].className.replace(" w3-white", "");
  }
  x[slideIndex-1].style.display = "block";
  dots[slideIndex-1].className += " w3-white";
}



function showNav(id) {
    var x = document.getElementById(id);
    if (x.className.indexOf("w3-show") == -1) {
        x.className += " w3-show";
    } else {
        x.className = x.className.replace(" w3-show", "");
    }
}

function cpfMask(inputData, e)
{

		if(document.all) // Internet Explorer
		var tecla = event.keyCode;
		else //Outros Browsers
		var tecla = e.which;

		if(tecla >= 47 && tecla < 58)
	    { // numeros de 0 a 9 e "/"
			  var data = inputData.value;
			  if (data.length == 3)
			  {
	              data = data + '.';
	              inputData.value = data;
	  			  return true;
	          }
	          if (data.length == 7){
	              data = data + '.';
	              inputData.value = data;
	              return true;
	          }
	          if (data.length == 11){
	              data = data + '-';
	              inputData.value = data;
	              return true;
	          }

	    }
	    else if(tecla == 8 || tecla == 0) // Backspace, Delete e setas direcionais(para mover o cursor, apenas para FF)
			return true;
		else
			return false;


 }

function jsSetInnerHTML(campo,value)
{
    document.getElementById(campo).innerHTML = value ;
}
function setValue(field,value)
{
    if(document.getElementById(field))
    {
        document.getElementById(field).value=value;
    }
}

 function strip(html)
  {     html = html.replace(/<br>/g,'\n');
        html = html.replace(/<table>/g,'');
        html = html.replace(/<tr>/g,'');
        html = html.replace(/<td>/g,'');
        html = html.replace(/excluir do carrinho/g,'\n');
        return html.replace(/<(?:.|\n)*?>/gm , '');
  }

var req1;
var id1;
var value1;

function loadXMLDoc1(url)
{
    req1 = null;
    // Procura por um objeto nativo (Mozilla/Safari)
    if (window.XMLHttpRequest) {
        req1 = new XMLHttpRequest();
        req1.onreadystatechange = processReqChange1;
        req1.open("GET", url, true);
        req1.send(null);
    // Procura por uma versao ActiveX (IE)
    } else if (window.ActiveXObject) {

        req1 = new ActiveXObject("Microsoft.XMLHTTP");
        if (req1) {

            req1.onreadystatechange = processReqChange1;
            req1.open("GET", url, true);
            req1.send();
        }
    }
}

function processReqChange1()
{
    // apenas quando o estado for "completado"
    if (req1.readyState == 4) {
        // apenas se o servidor retornar "OK"
        if (req1.status == 200) {
            // procura pela div id e insere o conteudo
            // retornado nela, como texto HTML

 	        	if(value1=='')
            	{
            		document.getElementById(id1).innerHTML = req1.responseText;
            	}
            	else
            	{
            		document.getElementById(id1).value = req1.responseText;
            	}



        } else {
            //alert("Houve um problema ao obter os dados:\n" + req1.statusText);
        }
    }
    else if (req1.readyState < 4)
    {
    	document.getElementById(id1).innerHTML ='<img src="app.images/processando.gif" border="0">';
    }
}

function jsBusca1(url,divid,valueid)
{
    document.getElementById(divid).style.display='block';
    if(valueid != null)
    {
        value1=valueid
    }
    else
    {
        value1='';
    }
    id1=divid;
    loadXMLDoc1(url);
}



var req2;
var id2;
var value2;

function loadXMLDoc2(url)
{
    req2 = null;
    // Procura por um objeto nativo (Mozilla/Safari)
    if (window.XMLHttpRequest) {
        req2 = new XMLHttpRequest();
        req2.onreadystatechange = processReqChange2;
        req2.open("GET", url, true);
        req2.send(null);
    // Procura por uma versao ActiveX (IE)
    } else if (window.ActiveXObject) {

        req2 = new ActiveXObject("Microsoft.XMLHTTP");
        if (req2) {

            req2.onreadystatechange = processReqChange2;
            req2.open("GET", url, true);
            req2.send();
        }
    }
}

function processReqChange2()
{
    // apenas quando o estado for "completado"
    if (req2.readyState == 4) {
        // apenas se o servidor retornar "OK"
        if (req2.status == 200) {
            // procura pela div id e insere o conteudo
            // retornado nela, como texto HTML

 	        	if(value2=='')
            	{
            		document.getElementById(id2).innerHTML = req2.responseText;
            	}
            	else
            	{
            		document.getElementById(id2).value = req2.responseText;
            	}



        } else {
            //alert("Houve um problema ao obter os dados:\n" + req2.statusText);
        }
    }
    else if (req2.readyState < 4)
    {
    	//document.getElementById(id2).innerHTML ='<img src="app.images/processando.gif" border="0">';
    }
}

function jsBusca2(url,divid,valueid)
{   document.getElementById(divid).style.display='block';
    if(valueid != null)
    {
        value2=valueid
    }
    else
    {
        value2='';
    }
    id2=divid;
    loadXMLDoc2(url);
}








</script>