html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    -webkit-font-smoothing: subpixel-antialiased !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}
body {
    background: #fff;
    color: #5e5e63;
    overflow-x: hidden;
}
ol,
ul {
    list-style: none;
}
blockquote,
q {
    quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
b {
    font-weight: 700;
}
input,
textarea,
select {
    font-family: "Open Sans", sans-serif;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    border: none;
    position: relative;
}
html {
    width: 100vw;
}
select {
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    text-indent: 0.01px;
    text-overflow: "";
}
select::-ms-expand {
    display: none;
}
::selection {
    background: #ff6666;
    color: #fff;
}
::-moz-selection {
    background: #ff6666;
    color: #fff;
}
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
* html .clearfix {
    zoom: 1;
}
*:first-child + html .clearfix {
    zoom: 1;
}
input:focus,
textarea:focus,
select:focus {
    outline: none;
}
html,
body {
    width: 100%;
    height: 100%;
}
html {
    font-family: "Open Sans", sans-serif;
    font-size: 62.5%;
    line-height: 2.5em;
    text-align: justify;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
* {
    list-style: none;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
p {
    font-size: 1.6rem;
    max-width: 480px;
    text-align: justify;
    margin: auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    color: #333;
    text-align: center;
    line-height: 1.4em;
    margin: auto;
}
h1 {
    font-size: 4.8rem;
}
h2 {
    font-size: 3.6rem;
}
h3 {
    font-size: 2.4rem;
}
h4 {
    font-size: 1.85rem;
}
h5 {
    font-size: 1.6rem;
}
h6 {
    font-size: 1.35rem;
}
i {
    background-image: -webkit-linear-gradient(left top, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    background-image: linear-gradient(to left top, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#linkSoliciteLigacao > i {
    color: #ffffff;
    vertical-align: bottom;
}
a {
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    padding: 16px 20px;
    font-size: 1.4em;
    line-height: 3em;
    border-radius: 4px;
    border-color: transparent;
}
a:hover {
    text-decoration: none;
}
a:active {
    text-decoration: none;
}
button {
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 1.4em;
    padding: 16px 20px;
    border-radius: 4px;
    border: 0px solid transparent;
    margin: auto;
}
button:focus {
    outline: none;
}
header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}
#headerPrincipal > div > div {
    -ms-flex-wrap: unset;
    flex-wrap: unset;
}


/***** ALINHA O TEXTO *****/
.text-center {text-align: center;}
.text-right {text-align: right;}
.text-left {text-align: left;}

/****** BOTÕES ******/
#ZipTicketBtnStart {
    background: rgba(217, 8, 8, 1) !important;
    color: #fff;
    -webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    margin: auto;
    transition: all 0.5s ease;
    text-transform: uppercase;
    font-weight: 600;
    transition: all 0.5s ease;
    border-radius: 8px !important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    z-index: 100;
}

#ZipTicketBtnStart:hover {
    background-color: rgba(246, 115, 13, 1) !important;
    -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    color: #fff;
    transition: all 0.5s ease;
}

#ZipTicketBtnStart:active {
    background-color: rgba(246, 115, 13, 1) !important;
    -webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
    color: #fff;
}

.colorButton {
    background: #e32329;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #8b74cc, #e32329);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #8b74cc, #e32329);
    color: #fff;
    -webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    margin: auto;
    -webkit-transition: 0.5s ease;
    -moz-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}

.back-recursos p{
    width: 75%;
}
.colorButton:hover {
    background-color: #e22e33;
    background: -webkit-linear-gradient(to left, #e03d42, #f35e5e);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #e03d42, #f35e5e);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(4,4,4,0.5); -moz-box-shadow: 0px 0px 15px 0px rgba(4,4,4,0.5); box-shadow: 0px 0px 15px 0px rgba(4,4,4,0.5);
    color: #fff;
    -webkit-transition: 0.5s linear ease;
    -moz-transition: 0.5s linear ease;
    -o-transition: 0.5s linear ease;
    transition: 0.5s linear ease;
}

.colorButton:active {
    background-color: #e22e33;
    background: -webkit-linear-gradient(to left, #e03d42, #f35e5e);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #e03d42, #f35e5e);
    -webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    color: #fff;
    -webkit-transition: 0.5s linear ease;
    -moz-transition: 0.5s linear ease;
    -o-transition: 0.5s linear ease;
    transition: 0.5s linear ease;
}

.redButton {
	background: rgba(217, 8, 8, 1);
	color: #fff;
	-webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    margin: auto;
    transition: all 0.5s ease;
}

.redButton:hover {
	background-color: rgba(246, 115, 13, 1);
    -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    color: #fff;
    transition: all 0.5s ease;
}

.redButton:active {
	background-color: rgba(246, 115, 13, 1);
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
	color: #fff;

}

.whiteButton {
	background-color: #fff;
    color: #e32329;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: 0px 0px 5px 0px rgba(4,4,4,0.5);
    margin: auto;
    transition: all 0.5s ease;
}

.whiteButton:hover {
    color: rgba(246, 115, 13, 1);
    -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);}

.whiteButton:active {
    background: #ffffff;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
}

.flatButton {
	color: #e32329;
	background-color: transparent;
    margin: auto;
}

.flatButton:hover {
	background-color: #e323291f;
	color: #e32329;
}

.flatButton:active {
	background-color: #e323291f;
	color: #e32329;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
}

.flatWhiteButton {
	color: #fff;
	background-color: transparent;
    margin: auto 11px;
    padding: 0;
    padding-bottom: 8px;
}

.flatWhiteButton:hover {
    border-bottom: 2px solid #fff;
	color: #fff;
    border-radius: 0em;
    transition: border-color 0.5s linear;
}

.fixa-menu .menu .flatWhiteButton {
    color: #e32329;
    transition: border-bottom 0.2s linear;
    padding: 0;
    padding-bottom: 8px;
}

.fixa-menu .menu .flatWhiteButton:hover {
    border-bottom: 2px solid #e32329;
}

.fixa-menu #menu-mobile i{
    color: #e32329;
    transition: border-bottom 0.2s linear;
    padding: 0;
}

#btn-acesse {
    border: 2px solid #fff;
    border-radius: 4px;
    padding: 16px 20px;
}

#btn-acesse:hover {
    background-color: #fff;
    transition: background-color 0.5s linear;
}

#btn-acesse:active {
    -webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
}

.btn-loginParceiro{
    background: #44AF69;
    color: white;
    margin-top: 10px;
}

.fixa-menu #btn-acesse {
    border: 2px solid #e32329;
    border-radius: 4px;
    padding: 10px 20px;
    transition: all 0.5s ease;
}

.fixa-menu #btn-acesse span{
    color: #e32329;
    transition: all 0.5s ease;
}

#btn-acesse:hover span {
    color: #fff;
}
#btn-acesse:hover {
    background-color: #e32329;
    border-color:  transparent;
}

.strokedButton {
	border: 2px solid;
	border-radius: 4px;
	padding: 14px 18px;
    margin-left: 10px;
}

.strokedButton:hover {
    padding:14px 18px;
}
#testeGratis {
	margin-top: 30px;
    margin-left: -15px;
    width: 300px;
    font-size: 20px;
    cursor: pointer;
}

#experimente {
    font-size: 18px;
}

.container-depo{
    margin: auto;
}

.setasDepo{
    position: -webkit-sticky;
    position: sticky;
    z-index: 60;
    top: 45%;
}

.setasDepoEsq{
    float: left;
}

.setasDepoDir{
    float: right;
}

.videoDepo{
    margin-top:40px;
    position: relative;
}

.back-depoimentos i{
    top: -2px;
    -webkit-text-fill-color:#e43f3c;
    font-size:24px;
    margin-right: 4px;
}

.videoDepoIn {
    margin-top: 15px;
    position: absolute;
    bottom:  -95px;
    z-index: 20;
}

.back-depoimentos .videoDepoIn i{
    font-size: 24px;
}

.fecharVideoDepo{
    margin: unset;
    position: absolute;
    right: 4px;
    background: transparent;
    top: -4px;
}

.modal-dialog{
    max-width:583px
}

.depoVideo iframe{
    width:100%;
}

.videoDepoIn a{
    font-size: 1em;
}

#videoDepoInYt{
    display: none;
}

.footer .box .container{
    padding-bottom: 20px;
}

.solicitarLigacao{
    height: 60px;
    width: 100%;
    background: rgba(51, 51, 51, 0.9);
    z-index: 60;
    position: fixed;
    overflow: hidden;
    transition: all 1s ease;
}

.solicitarLigacao .center{
    margin: auto;
    height: 60px;
    width: 556px;
}

.contentTable{
    height: 60px;
    display: table;
    float: left;
}

.tableCell{
    display: table-cell;
    vertical-align: middle;
}

.solicitarLigacao .texto{
    color: white;
    display: table-cell;
    vertical-align: middle;
    padding-right: 15px;
    font-weight: bold;
}

.solicitarLigacao .texto i{
    color: white;
    font-size: 1.5em;
    bottom: -3px;
    -webkit-text-fill-color:white;
    margin-right: 5px;
}

#formLigacao{
    float: left;
}

#formLigacao input{
    margin: 0px;
    height: 42px;
    top: -1px;
}

#formLigacao input #telefone{
    width: 180px;

}

.firstStep{
    margin-top: 10px;
    margin-bottom: 20px;
    transition: all .6s ease;

}

.secondStep{
    transition: all .6s ease;
    display: none;
}

.move{
    transform: translateY(-62px);
}

.show{
    display: block;
}

#back{
    cursor: pointer;
}

#submit, #continuar{
    position: absolute;
    height: 42px;
    width: 110px;
    left: 98%;
    top: -1px;
    background: #e32329;
    background: -webkit-linear-gradient(right top, #c54a47 20%, #bd5756 140%);
    background: linear-gradient(to right top, #c54a47 20%, #bd5756 140%);
    color: white;
    font-weight: bold;
    border-radius: 0px 4px 4px 0px;
    cursor: pointer;
    padding: 0px 10px;
    text-transform: none;
}

#continuar{
    text-align: center;
    font-size: 1.4em;
}

.solicitarLigacao i{
    -webkit-text-fill-color:white;
}

#close{
    position: absolute;
    right: 20px;
    top: 5px;
    font-size: 1.4em;
    cursor: pointer;
}

.hidden{
    display: none;
}

.solicitarLigacao #back{
    position: absolute;
    top: 10px;
    font-size: 22px;
    right: -146px;
    transform: rotate(180deg);
}


@media (max-width: 560px){
    #videoDepoInYt{
        display: initial;
    }
    .videoDepoIn{
        display: none;
    }
    .footer .box .container{
        padding-bottom: 0px;
    }
    p{
        font-size: 16px;
    }
    .bg-gray, #slogan, .back-vantagens, .back-recursos, .back-conteudo, .back-chess, .back-depoimentos, .back-dablio{ font-size: 16px; line-height: 2;}

    button, .whiteButton{font-size:14px;}
}

/****** DABLIOerp RESPONSIVE LOGO ******/
@media (max-width: 600px){#DABLIOerp-tipo {display: none;}}

/******** CABEÇALHO ********/
.header-principal{
    width: 100%;
    transition: all 1s ease;
    z-index: 100;
}

.img-table {
    display: table;
    height: 100px;    
}

.marca{
    display: table-cell;
    vertical-align: middle;
}

.logo {
    line-height: normal;
    padding: 0px;
    z-index: 99;
}

.logo > img {
    vertical-align: middle;
}

.marca a img{
    width: auto;
    height: 35px;
}

.menu{
    float: right;
}

.menu ul li{
    float: left;
}

.cabecalho2 {
    transition: all .3s linear;
}

#menu {
    display: table;
}

.menu-table {
    height: 100px;
    display: table-cell;
    vertical-align: middle;
}

.menu-tableMob {
    display: table-cell;
    vertical-align: middle;
}

.menu-tableMob button {
    margin: auto;
    padding: 16px 20px;
}

.menu-tableMob button i {
    padding: 0px;
    vertical-align: middle;
}

.clica-menu-mobile{
    width:80px;
    height: 40px;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -20px;
    z-index: 3;
    overflow: hidden;
}

.img-menu{
    position: absolute;
    top: 10px;
    right: 0px;
    width: 25px;
    height: 19px;
    overflow: hidden;
}

.img-menu div{
    width:25px;
    border-top: solid 3px #e32329;
    margin-top: 5px;
    -ms-transform: rotate(0deg); /* IE 9 */
   -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
   transform: rotate(0deg);
}

.img-menu div:first-child{
    margin-top: 0;
}

.clica-menu-mobile p{
    color:#eb3237;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: left;
}

.abre-menu-mobile .img-menu div{
   -ms-transform: translateX(-30px); /* IE 9 */
   -webkit-transform: translateX(-30px); /* Chrome, Safari, Opera */
   transform: translateX(-30px);
}

.abre-menu-mobile .img-menu div:first-child{
    -ms-transform: rotate(42deg) translate(6px,6px); /* IE 9 */
    -webkit-transform: rotate(42deg) translate(6px,6px); /* Chrome, Safari, Opera */
    transform: rotate(42deg) translate(6px,6px);
}

.abre-menu-mobile .img-menu div:last-child{
    -ms-transform: rotate(-42deg) translate(6px,-5px); /* IE 9 */
    -webkit-transform: rotate(-42deg) translate(6px,-5px); /* Chrome, Safari, Opera */
    transform: rotate(-42deg) translate(6px,-5px);
}

#icon-menu {
  font-size: 18pt;
  cursor: pointer;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

.fixa-menu #icon-menu {
    -webkit-text-fill-color: rgba(217, 8, 8, 1);
}

#menu .menu-mobile a {
  text-decoration: none;
  color: #616161;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  list-style-type: none;
  padding: 0px 15px 10px 10px;
  z-index: 10;
}

#teste-mobile span{
    color: #e32329;
    transition: border-bottom 0.2s linear;
}

#menu .menu-mobile a span:hover {
    color: #e32329;
    transition: border-bottom 0.2s linear;
    padding: 0;
    padding-bottom: 8px;
    border-bottom: 2px solid #e32329;
}

#menu .dropdown {
  position: relative;
  display: inline-block;
}

#menu .dropdown-content {
  display: none;
  position: absolute;
  background-color: white;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  right: 0;
}

#menu .dropdown:hover .dropdown-content {
  display: block;
}

#menu .dropdown-content a{
  display: block;
  width: 100%;
  min-height: 100%;
}

.dropdown-menu-left {
  right: auto;
  left: 0;
}

.bg-footer {
    background: url(../img/site/bg-bn-DABLIOerp.png) repeat center center fixed;
}

.footer {
    background: rgba(49, 49, 49, 0.8);
}

.marca-rodape {
    width: 100px;
    padding-top: 70px;
}

.menu-rodape {
    padding-top: 30px;
}

.menu-rodape li {
    float: left;
}

.menu-rodape a {
    font-size: 13px;
}

.center-footer {
    display: flex;
    justify-content: center;
}

.texto-rodape {
    margin-top:  20px;
}

body > footer > section > div > div > div > div.row > div.col-sm-12.col-md-8 > div > p {
    color:  #fff;
    margin-left: 0;
    font-size: 13px;
    text-align: center;
    max-width: 100%;
}

body > footer > section > div> div > div > div.row > div.col-sm-12.col-md-8 > div > p > a {
    color:  #fff;
    font-size: 13px;
    margin: 0;
    padding: 0;
    text-transform: none;
    text-decoration: underline;
    line-height: 1em;
}

.sociais-rodape {
    text-align: center;
    margin: auto;
    display: inline-block;
    padding-top: 45px;
}

.lista-sociais {
    display: flex;
    justify-content: center;
}

.lista-sociais li {
    float: left;
}

.sociais-rodape a {
    padding: 10px;
}

.sociais-rodape i{
    color: #fff;
    font-size: 20px;
    -webkit-text-fill-color: #fff;
}

.dablio-footer {
    display: flex;
    justify-content: center;
    width: 100%;
}

.marca-dablio-rodape {
    max-width: 150px;
}

.copyright {
    font-size: 13px;
    margin: 30px auto;
    margin-bottom: 0;
    text-align: center;
}

.box {
    width: 100%;
    padding: 30px 20px;
    vertical-align: middle;
}

.telas-Sistema{
    position: absolute;
    bottom: 4vh;
    width: 100vw;
    height: 53vh;
    left: 0px;
}

.curve {
    border-radius: 50%;
    bottom: 0;
    -webkit-box-shadow: #F7F6F6 0 400px 0;
    -moz-box-shadow: #F7F6F6 0 400px 0;
    box-shadow: #F7F6F6 0 400px 0;
    height: 104vh;
    max-height: 1080px;
    margin-left: -40%;
    position: absolute;
    top: 0;
    width: 180%;
    z-index: 60;
}

.box-principal {
    height: 100px;
}

.shadow {
    filter: drop-shadow(0 7px 12px rgba(0, 0, 0, 0.5));
}

.box-1 {
    width: 100%;
    height: 110vh;
    max-height: 1188px;
    min-height: 660px;
}


body > section.banner-principal > div > div {
    display: table;
    height: 100%;
}


.box-banner {
    padding-left: 0;
    margin: auto;
    padding-bottom: 150px;
    top: 25vh;
    z-index: 65;
    margin-bottom: 50px;
}

#form-preCadastro > fieldset > div > div > span {
    margin-left: -2px;
}

#form-cadastro b{
    font-weight: 700;
    font-size: 12px;
    color: #00a900;
}


.box-down {
    margin-top: 15px;
}

.emailCadastro {
    padding: 0;
    max-width: 480px;
    text-align:  center;
    margin: auto;
    margin-top: 15px;
}


#form-preCadastro input {
    background-color: rgba(255, 255, 255, 0.8);
    border: 2px solid #fff;
    font-size: 17px;
    color: rgba(23, 23, 23, 0.8);
}


#form-preCadastro input:focus {
    box-shadow: none;
}

#form-preCadastro input::placeholder {
    color: rgb(60, 60, 60);
    font-size: 15px;
}

#form-preCadastro input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: rgb(60, 60, 60);
}

#form-preCadastro input::-ms-input-placeholder { /* Microsoft Edge */
    color: rgb(60, 60, 60);
}

.bg-gray {
    background-color: #F7F6F6;
    padding-bottom: 10px;
    overflow: hidden;   
}

.box-2 {
    margin: 0 auto;
    padding: 50px 0;
}

.slogan {
    width: 100vw;
    height: 265px;
    margin: 0;
    margin-bottom: -3%;
    background-color: #F7F6F6;
    top: -60px;
    overflow: hidden;
}

.sloganSize {
    min-height: 315px;
    height: auto;
}

.sloganSizeFlux{
    min-height: 365px;
}

.widthFlux{
    max-width:865px; 
}

.slogan-x{
    transition: all .5s linear;
}

.slogan-y{
    transition: all .5s linear;
}

.slogan:hover .slogan-x{
    transform: translateY(-265px);
}

.slogan:hover .slogan-y{
    transform: translateY(-265px);
}
.slogan:hover .slogan-y p{
    max-width: 520px;
}

.planilha{
    border: 1px solid #e32329;
    margin: auto;
}

#p-slogan {
    margin: auto;
    padding-top: 10px;
    margin-bottom: 20px;
}

#p-slogan2 {
    margin: auto;
    padding-top: 10px;
    margin-bottom: 20px;
}

.back-vantagens{
    width: 100vw;
}

.box-3 {
    background-size: cover;
}

.box-3a {
padding: 30px 0;

}

.titulo-vantagem i {
    margin-right: 5px;
}

.texto-vantagens {
    padding: 20px 0;
}

.cada-vantagem {
    padding: 30px 15px;
}

.back-recursos {
    background-color: #f6f6f6;
}

.box-4 {
    padding: 80px 0;
}

.recursos {
    padding: 30px 0;
}

.titulo-recursos {
    padding: 30px 0;
}

.img-recursos {
    height: 60px;
    text-align: center;
    margin: auto;
}

.recursos i {
    font-size: 36px;
    background: -webkit-linear-gradient(right bottom, rgba(253, 57, 57, 0.82), rgba(0, 0, 0, 0.6));
    background: linear-gradient(to right bottom, rgba(253, 57, 57, 0.82), rgba(0, 0, 0, 0.6));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.a-p {
    font-size: 10px;
    margin: auto;
    text-transform: none;
    color: #5e5e63;
    font-weight: normal;
    padding: 0;
    -webkit-box-shadow: none; -moz-box-shadow: none;  box-shadow: none;
}

.a-p:hover {
    color: #5e5e63;
}

.box-5 {
    -webkit-clip-path: polygon(0 1%, 100% 31%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 40%, 100% 100%, 0 100%);
    padding: 80px 0;
}

.back-conteudo {
    overflow-x: hidden;
    margin-bottom: -3%;
    z-index: 9;
}

.cada-conteudo {
    margin: 80px auto;
}

.texto-conteudo {
    margin: 30px auto;
    vertical-align: middle;
}

.texto-conteudo h2 {
    max-width: 480px;
    margin-bottom: 30px;
}

h3 span {
    font-size: 52px;
    margin-right: 10px;
}

.img-conteudo {
    margin: 30px auto;
    text-align: center;
    vertical-align: middle;
}

.img-conteudo svg{
    max-width: 90%;
    border-radius: 4px;
    -webkit-box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4); 
    box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4);
}

.img-conteudo img {
    max-width: 90%;
    border-radius: 4px;
    -webkit-box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4);
    box-shadow: 5px 5px 17px 0px rgba(0,0,0,0.4);
}

.back-chess h2 {
    max-width: 700px;
}

.box-6 {
    padding: 80px 0;
}

.content-corpo-chess p {
    max-width: 700px;
    margin: 30px auto;
}

body > section.back-dablio > div > div > div > div.col-sm-12.col-md-8 > p {
    margin-left: 0; 
}

.back-dablio {
    width: 100%;
    z-index: 12;
    position: relative;
}

.box-dablio {
    padding: 55px 0px;
}

.box-dablio h3 {
    color:  #0187a8;
}

.box-dablio p {
    margin: 30px 0;
    margin-bottom: 0;
}

.box-7 {
    padding: 10px 0;
}

.titleDepoimentos {
    margin-bottom: 20px;
}

.back-depoimentos{
    padding: 80px 0;
    background: #f6f6f6;
}

.balao-depoimento {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 61% 75%, 45% 85%, 45% 75%, 0% 75%);
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 61% 75%, 45% 85%, 45% 75%, 0% 75%);
    width: 100%;
    padding-top: 20px;
    padding-bottom: 125px;
    background-color: #fff;
    margin: auto;
}

.lista-depoimentos{
    width: 100%;
}

.cada-depoimento{
    display: none;
}

.cada-depoimento:first-child{
    display: block
}

.quote {
    padding: 30px;
    padding-top: 0;
}

.quote h2 {
    font-family: 'Palanquin', sans-serif;
    font-weight: 900;
    font-size: 8em;
    line-height: 1;
    background-image: -webkit-linear-gradient(right bottom, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    background-image: linear-gradient(to right bottom, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.quote h4{
    font-style: italic;
    font-weight: 300;
    text-align: center;
    margin: auto;
    vertical-align: middle;
}

.cada-depoimento p{
    text-align: center;
}


.back-depoimentos i {
    font-size: 45px;
    vertical-align: middle;
}

.img-depoimento {
    text-align: center;
    margin: auto;
    width: 80px;
    height: 80px;
    border: 1px solid transparent;
    border-radius: 50%;
    background: url('http://www.best80.com.br/wp-content/uploads/patolino-678x381.jpg') no-repeat center;
    background-size: cover;
    margin-bottom: 20px;
}

.desativa-seta{
    cursor: auto;
    opacity: 0.15;
    ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
    filter: alpha(opacity=15);
    -moz-opacity: 0.15;
    -khtml-opacity: 0.15;
    background-color: #bcbcbc !important
}

.carousel-banner-home{
    width: 100%;
    padding: 0 61px;
}

.box-top {
    padding: 120px 0;
}

/***** AFILIADOS *****/
.cadastro-afiliados-header {
    width: 100%;
    background: url(../img/site/parceiros.jpg) no-repeat center bottom fixed;
    background-size: cover;
}

.benAfil {
    padding: 0;
}

.beneficios-parceiros {
    margin: 10px auto;
}

.beneficios-parceiros i {
    font-size: 36px;
    margin-top: 10px;
    margin-right: 5px;
}

.beneficios-parceiros p {
    margin-left: 5px;
}

.cadastroAfiliados {
    font-size: 1em;
    color: #e32329;
    text-align: justify;
    margin: 0;
    padding: 0;
    padding-bottom: 8px;
    text-transform: none;
    line-height: unset;
}

.cadastroAfiliados:hover {
    border-bottom: 2px solid #e32329;
    color: #e32329;
    border-radius: 0;
    transition: border-color 0.5s linear;
}

#btnCadAfil {
    font-weight: 700;
    padding: 16px;
    font-size: 1.6rem;
    margin-bottom: 15px;
}


.input-contato {
    margin: 15px auto;
}

.formAfil {
    background-color: #f6f6f6;
    padding: 30px 40px;
}

.EMPRESAS-branco {
    width: 50%;
    margin-bottom: -5.5%;
}

label {
    font-size: 1.5em;
    font-weight: 700;
    margin: 5px auto;
    display: block;
}

label span {
    font-weight: 300;
}

input {
    width: 100%;
    margin-bottom: 10px;
    line-height: 1em;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 1.4em;
}

.input-left {
    float: left;
}

.input-right {
    float: right;
}

#form-afiliado > div > center input {
    width: 100%;
    border-radius: 4px;
    font-size: 1.4em;
    padding: 16px;
    font-weight: 600;
    margin: 15px auto;
}

.tituloLogin {
    margin: 15px auto;
}

#afiliados-cliqueaqui {
    display: inline;
    border-radius: 4px;
    font-size: 1.2em;
    padding: 10px 16px;
    margin-left: 0px;
    transition: all 0.5s ease;
}

#afiliados-cliqueaqui:hover {
    background: white;
    color: #44AF69;
}

.p-menor {
    font-size: 1.2em;
}

.cadastrado {
    margin-top: 15px;
}

.text-contatoAfil {
    margin-top: 15px;
}

/****** SEGMENTOS ******/
.segmentos-descricao {
    padding: 50px 0;
}

.segmentos-header {
    background: url(../img/site/capaSeg.jpg) no-repeat center center;
    background-size: cover;
}

.segTitle {
    max-width: 750px;
}

.coluna-texto h1 {
    text-align: left;
}

.segDesc{
    margin-top: 30px;
}

.colBanner {
    vertical-align: middle;
    padding: 30px 0px;
    margin:  auto;
}

.bg-col h3, .bg-col p {
    margin-bottom: 20px;
}

.galeria-empresas {
    padding: 80px 0;
    background: #F7F6F6;
    background-image: -webkit-linear-gradient(to top, #F7F6F6, #fff); 
    background-image: linear-gradient(to top, #F7F6F6, #fff);
}

.BoxSeg {
    vertical-align: middle;
}

.textSeg {
    font-size: 1.4em;
    font-weight: 600;
    width: auto;
    margin: auto;
    margin-top: 20px;
    transition: border-bottom 0.2s linear;
    padding: -1px;
    padding-bottom: 8px;
    text-transform: none;
}

.borderImg {
    background: rgba(217, 8, 8, 1);
    background-image: linear-gradient(-35deg, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    background-image: -webkit-linear-gradient(-35deg, rgba(253, 57, 57, 0.8), rgba(0, 0, 0, 0.6));
    border-radius: 50%;
    font-size: 20px;
    padding: 0px;
    height: 200px;
    width: 200px;
    margin: auto;

}

.imgSeg {
    border-radius: 50%;
    width: 100%;
    height: 100%;
    filter: grayscale(1) blur(1px);
    margin: 0;
    padding: 4px;
    transition: padding 0.2s linear, opacity 0.2s linear;
}

.BoxSeg:hover .imgSeg {
    padding: 8px;
    filter: grayscale(0) blur(0px);
}

.esp-seg {
    width: 100%;
    min-height: 110vh;
    max-height: 1188px;
}

.esp-seg h1 {
    max-width: 700px;
}


.banner-esportivo {
    background: url('../img/site/artigos-esportivos.jpg') no-repeat bottom center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-barbearia {
    background: url('../img/site/barbearia.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-celulares {
    background: url('../img/site/acessorios-celular.jpg') no-repeat bottom center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-grafica {
    background: url('../img/site/grafica.jpg') no-repeat bottom center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-moveis {
    background: url('../img/site/moveis.jpg') no-repeat bottom center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-informatica {
    background: url('../img/segmentos/informatica.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;  
}

.banner-calcados {
    background: url('../img/site/calcados.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-colchoes {
    background: url('../img/site/colchoes.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-roupas {
    background: url('../img/site/roupas.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-microcervejaria {
    background: url('../img/site/microcervejaria.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-otica {
    background: url('../img/site/otica.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-petshop {
    background: url('../img/site/petshop.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-recarga {
    background: url('../img/site/recarga.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-varejo {
    background: url('../img/site/varejo.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-restaurante {
    background: url('../img/site/restaurante.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-distribuidora {
    background: url('../img/site/distribuidora.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-tabacaria {
    background: url('../img/site/tabacaria.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-sexShop {
    background: url('../img/site/sexShop.jpeg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-santaMaria {
    background: url('../img/site/locomotiva.jpg') no-repeat center center;
    background-size: cover;
    transition: all 0.5s ease;
}

.banner-santaMaria h1 {
    max-width: 650px;
}

/******* FLUXO DE CAIXA *******/

.box-2 h2 a {
    text-transform: none;
    font-size: 1em;
    padding: 0;
    margin: 0;
    font-weight: 700;
    color: #333;
}

/******* BOLETOS ********/
.back-conteudo h3 {
    margin-bottom: 60px;
}


/******* CONTATO ********/
.banner-contato {
    background: #F7F6F6;
    overflow-x: hidden;
}

.box-formContato {
    padding: 80px 0px;
}

.box-formContato h1 {
    margin-bottom: 30px;
}

.back-formContato form {
    font-size: 17px;
}

.back-formContato label {
    margin-top: 10px;
    font-size: 1em !important;
}

.back-formContato input {
    margin-bottom: 10px;
    font-size: 17px;
}

.back-formContato button {
    font-size: 15px;
    width: 100%;
    margin: 30px auto;
    font-weight: 700;
}

#form-contato > div.input-termos > label > p {
    font-size: 14px;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

textarea {
    resize: none;
    height: auto;
    min-height: 100px;
    font-size: 1em !important;
}

.mensagem-erro{
  display: none;
  padding: 30px 0;
}

.back-telefones h3 {
    margin: 30px auto;
}

.back-telefones p {
    max-width: unset;
}

.box-telefones {
    padding-bottom: 20px;
    border-top: 10px solid transparent;
    border-image-source: -webkit-linear-gradient(135deg, rgba(126, 0, 255, 1) -60%,rgba(246, 115, 13, 1), rgba(217, 8, 8, 1) 120%);
    border-image-source: linear-gradient(135deg, rgba(126, 0, 255, 1) -60%,rgba(246, 115, 13, 1), rgba(217, 8, 8, 1) 120%);
    border-image-slice: 1;
    -webkit-box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
    box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
}

.box-telefones p {
    max-width: unset;
    margin: 30px auto;
}

.box-telefones > ul > li:nth-child(1) {
    text-align: center;
    font-size: 17px;
    font-weight: 600;
    padding: 20px;
}

.box-telefones > ul > li:nth-child(2) {
    text-align: center;
    font-size: 17px;
    font-weight: 600;
    margin: auto;
    margin-bottom: 20px;
    padding: 20px;
    width: 100%;
    background-image: -webkit-linear-gradient(135deg, rgba(126, 0, 255, 0.2) -50%,rgba(246, 115, 13, 0.2), rgba(217, 8, 8, 0.2));
    background-image: linear-gradient(135deg, rgba(126, 0, 255, 0.2) -50%,rgba(246, 115, 13, 0.2), rgba(217, 8, 8, 0.2));
}

.box-telefones > ul > li:nth-child(3) {
    display: none;
}

.box-telefones > ul > li:nth-child(4) {
    display: none;
}

.box-telefones > ul > li:nth-child(5) {
    display: none;
}

.box-telefones > ul > li:nth-child(6) {
    display: none;
}

.box-telefones > ul > li:nth-child(7) {
    display: none;
}

.box-telefones > ul > li:nth-child(8) {
    display: none;
}

.box-telefones > ul > li:nth-child(9) {
    display: none;
}

.box-telefones > ul > li:nth-child(10) {
    display: none;
}

.box-telefones > ul > li:nth-child(11) {
    display: none;
}

.box-telefones > ul > li:nth-child(12) {
    display: none;
}

.box-telefones > ul > li:nth-child(13) {
    display: none;
}

.box-telefones > ul > li:nth-child(14) {
    display: none;
}

.box-telefones > ul > li:nth-child(15) {
    display: none;
}

.box-telefones > ul > li:nth-child(16) {
    display: none;
}

.box-telefones > ul > li:nth-child(17) {
    display: none;
}

.box-telefones > ul > li:nth-child(18) {
    display: none;
}

.box-telefones > ul > li:nth-child(19) {
    display: none;
}

.box-telefones > ul > li:nth-child(20) {
    display: none;
}

.box-telefones > ul > li:nth-child(21) {
    display: none;
}

.box-telefones {
    background: #fff;
    border-radius: 8px;
    margin: 30px auto;
}

.tel-contato {
    margin: 0 auto;
}

.tel-contato p {
    font-size: 13px;
    margin: 10px auto;
    padding: 0px 10px;
    text-align: left;
}

.email-contato {
    margin-top: 30px;
    padding: 0px 30px;
}

.email-contato p {
    font-size: 1.4em;
    text-align: center;
    margin: 20px auto;
}

.mailAtend {
    font-size: 1em;
    color: #5e5e63;
    text-align: justify;
    margin: 0;
    padding: 0;
    padding-bottom: 3px;
    text-transform: none;
    line-height: unset;
    margin: auto;
    transition: all 0.5s ease;
}

.mailAtend:hover {
    border-bottom: 2px solid #e32329;
    color: #e32329;
    border-radius: 0;
    transition: border-color 0.5s linear;
}

.bn-contato {
    background: url('../img/site/bn-contato.jpg') top center no-repeat;
    background-size: cover;
    margin-right: -65%;
    height: 100%;
}

.bn-container {
    height: 100vh;
    max-height: 1080px;
    width: 100%;
    padding-right: 25%;
}

.bn-contato .gradient-DABLIOerp {
    width: 100%;
    min-height: 100%;
}

.box-bnContato {
    padding-top: 140px;
}

.box-bnContato h2 {
    max-width: 700px;
    margin: auto;
    margin-bottom: 50px;
}

.box-bnContato a {
    margin: auto;
}

.plane-contato {
  margin-top: 10px;
  width: 80%;

}

#Plane {
  animation: pulse 2s infinite alternate;
}

#Rastro {
  animation: dashn 5s linear;
  animation-iteration-count: infinite;
}

.back-formContato .mensagem-erro {
    font-size: 0.5em;
    line-height: 2.5em;
}

/****** CADASTRO *******/
.bn-cadastro {
    background: url('../img/site/cadastro.jpg') no-repeat center center;
    background-size: cover;
    height: auto;
    min-height: 70vh;
    max-height: 1080px;
}

#cadastro-passo2 {
    display: none;
}

.box-cadastro {
    padding-top: 80px;
}

.table-cad {
    display: table;
    height: 100vh;
    padding-left: 20px;
    padding-right: 20px;
}

.box-titleCad {
    padding: 60px 20px;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}

.cad-box {
    display: table-cell;
    vertical-align: middle;
}

.box-titleCad h1 {
    margin-bottom: 5%;
    font-size: 42px;
    line-height: 1.2em;
}

.box-titleCad p {
    margin-left: 0px;
}

.box-titleCad img {
    max-width: 100%;
    margin-top: 5%;
}

.cad-box h3 {
    margin-bottom: 30px;
}

.box-formCad {
    background-color: rgba(255, 255, 255, 0.8);
    padding: 30px 60px;
    -webkit-box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
    box-shadow: 0px 7px 15px 1px rgba(0,0,0,0.1);
    border-radius: 8px;
    margin: 30px 0px;
}

.botao-login {
    width: 100%;
    border-radius: 4px;
    font-size: 1.6rem;
    padding: 16px;
    font-weight: 700;
    margin: 15px auto;
    margin-bottom: 0px;
    display: inline-block
}

.cadastrar-social a {
    color: #fff;
    padding: 0px;
    font-weight: normal;
    -webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    margin: 5px auto;
    text-align: center;
    transition: all 0.5s ease;
}

.cadastrar-social a:hover {
    background-color: rgba(246, 115, 13, 1);
    -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    color: #fff;
    transition: all 0.5s ease;
}

.cadastrar-social a:active {
    background-color: rgba(246, 115, 13, 1);
    -webkit-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); -moz-box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5); box-shadow: inset 0px 0px 5px 0px rgba(4,4,4,0.5);
    color: #fff;
}

.cadastrar-social i {
    -webkit-text-fill-color: #fff;
    margin-right: 5px;
}

.cadastrar-social p {
    margin: 20px auto;
}

.cadastrar-facebook {  
    background-color: #4267B2;
}

.cadastrar-google {  
    background-color: #4285F4;
}

.cadastrar-linkedin {  
    background-color: #007bb5;
}

.clearfix::after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.aceitoTermos p{
    margin-left: 25px !important;
    font-weight: 500;
}

.aceitoTermos p a {
    font-size: 1em;
    color: #e32329;
    text-align: justify;
    margin: 0;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding: 0;
    padding-bottom: 8px;
    text-transform: none;
    line-height: unset;
    font-weight: 500;
}


/***** CADASTRO OK *****/
.msg-cadOK {
    margin-top: 25vh;
}

/***** RECUPERAR CONTA *****/
.recupConta {
    background: url('../img/site/bn-trocarsenha.jpg') no-repeat center bottom;
    background-size: cover;
    height: auto;
}

.recupConta .container {
    padding-top: 150px;
}

.engloba-botao-teste {
    margin: 30px auto;
}

.dadosRecuperarConta, .explicacaoRecuperarConta {
    padding: 30px;
}

.explicacaoRecuperarConta p {
    font-size:  16px;
    font-weight: 300;
    max-width: unset;
    line-height: 1.4em
}

#titulo-login {
    margin-bottom: 30px;
}

#btnReativar {
    width: 100%;
    font-weight: 700;
    font-size: 16px;
}

.dadosRecuperarConta p {
    margin: 10px auto;
}

.engloba-botao-teste {
    padding: 30px 0px;
    margin: 30px;
    border-top: 1px solid #fff;
}

.engloba-botao-teste h3 {
    margin: 30px auto;
}

.engloba-botao-teste p {
    margin: 30px auto;
    margin-top: 0;
}

#quadroRecepcao {
    margin-top: 30px;
    font-size: 20px;
    text-align: center;
}

#quadroRecepcao p {
    font-size: 17px;
}

/***** ACESSE *******/
.back-login {
    background: url('../img/site/bn-city.jpg') no-repeat center center;
    background-size: cover;
}

.box-login {
    margin-top: 100px;
    padding: 30px 60px;
    padding-bottom: 5px;
    border-radius: 4px;
    background-color: rgba(255, 255, 255, 0.9);
}

.bn-logoLogin {
    margin: auto -60px;
    margin-top: -30px;
    margin-bottom: 30px;
    padding: 10px 60px;
    background: #3b3b3b;
}

.logoLogin {
    height: 30px;
    width: auto;
    margin-bottom: 0;
    vertical-align: middle;
}

.titulo-login {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    display: inline;
    margin-left: 10px;
    vertical-align: middle;
}

.boxInput {
    background-color: transparent;
    border: 1px solid gray;
    border-radius: 4px;
}

#subdominio, #subdominioSenha, #subdominioSenha2 {
    width: calc(100% - 130px);
    float: left;
    display: inline-block;
}

.especial-email-texto {
    float: right;
    display: inline-block;
}

.input-termos p {
    font-size: 1em;
    line-height: 1.6rem;
    margin-left: 15px;
}

.clica-check-termos {
    position: absolute;
    z-index: 3;
    cursor: pointer;
    height: 100%;
    left: 0;
    width: 15px;
}

.esqueceu-senha {
    margin: 15px auto;
    margin-top: 5px;
}

.linksLogin {
    display: inline;
    padding: 0;
    color: #e32329;
    border-radius: 0;
    text-transform: none;
}

.linksLogin:hover {
    color: #e32329;
    border-bottom: 1px solid #e32329;
}

.linksLogin i {
    -webkit-text-fill-color: #e32329;
    font-size: 14px;
    vertical-align: middle;
    margin-right: 5px;
}

.conectar-facebook {
    background-color: #4267B2;
    display: block;
    padding: 0;
    text-align: center;
    margin: 10px auto;
}

.conectar-google {
    background-color: #4285F4;
    display: block;
    padding: 0;
    text-align: center;
    margin: 10px auto;
}

.conectar-linkedin {
    background-color: #007bb5;
    display: block;
    padding: 0;
    text-align: center;
    margin: 10px auto;
    margin-bottom: 35px;
}

.conSocial {
    -webkit-text-fill-color: #fff;
    margin-right: 10px;
    font-size: 21px !important;
    vertical-align: baseline;
}

.captchaDescr {
    width: 100%;
    font-weight: normal;
}

#captchaBox {
    display: none;
}

.captchaQuadro {
    width: 100%;
    text-align: center;
    margin: 20px 0;
}

#trocaCaptcha {
    color: gray;
    float: right;
}

#trocaCaptcha {
    color: gray;
    float: right;
}

#form-senha,#form-senha2{
    display: none;
}

.form-login .erro input {
    border: 2px solid #eb3237;
}

#form-contato .erro input {
    border: 2px solid #eb3237;
}

.erro input {
    border: 2px solid #eb3237;
}

.erro textarea {
    border: 2px solid #eb3237 !important;
}

.bn-testeAcesse {
    margin: 30px auto;
}

.bn-testeAcesse h4 {
    margin: 20px auto;
}


/****** BRAND ******/

.brand {
    padding: 0;
    padding-bottom: 30px;
}

.kit-logos {
    text-align: center;
}

.kit-logos .container {
    margin-bottom: 30px;
}

.verticalAlign {
    display: table;
    min-height: 300px;
}

.middleAlign {
    display: table-cell;
    vertical-align: middle;
    transform: translateY(15px);

}

#downloadLogo {
    color: #e32329;
    display: inline-block;
    line-height: 1.5em;
    margin-top: 20px;
}

#downloadLogo i {
    margin-right: 10px;
}

.bn-brand {
    height: auto;
    min-height: 300px;
    width: 100%;
    background: url('../img/site/brand/bn-brand.jpg') no-repeat center;
    background-size: cover;

}

.bn-brand .gradient10 {
    min-height: 300px;
}

.brandTitle {
    margin: 30px auto 20px auto; 
}

.brand-box {
    -webkit-box-sizing: border-box;
    border: 2px solid #f1f1f1;
    border-radius: 5px;
    box-sizing: border-box;
    margin: 10px auto;
    position: relative;
    padding: 20px;
    display: table;
}
.horizBox {
    margin-bottom: 30px;
}

.box-pattern {
    background-position: 0 0,30px 30px;
    background-size: 20px 20px;
}

.noColor-box {
    background-color: transparent;
    background-image: linear-gradient(45deg,#f1f1f1 25%,transparent 0,transparent 75%,#f1f1f1 0,#f1f1f1),linear-gradient(45deg,#f1f1f1 25%,transparent 0,transparent 75%,#f1f1f1 0,#f1f1f1);
}

.color-box {
    background-color: #333;
}

.vertLogo {
    margin: auto;
}

.horizLogo {
    margin: auto;
}

.imgBrand {
    max-width: 90%;
    display: table-cell;
    vertical-align: middle;
}

.link-wrapper {
    bottom: -5px;
    position: absolute;
    right: -5px;
}

.link-wrapper a i {
    -webkit-text-fill-color: #e32329;
}

.whiteIcon a i {
    -webkit-text-fill-color: #fff;
}

.white{
    text-shadow: none;
}

/****** GRADIENTS ******/

.gradient10{
    background: #F3904F;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right top, #3B4371, #F3904F);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right top, #3B4371, #F3904F); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.gradient12 {
    background: -webkit-linear-gradient(bottom, rgb(246, 246, 246), rgba(255, 255, 255, 0)150%);
    background: linear-gradient(to bottom, rgb(246, 246, 246), rgba(255, 255, 255, 0)150%);
}

.gradient-DABLIOerp {
    background-image: -webkit-linear-gradient(left top, rgba(253, 157, 57, 0.6), rgba(0, 0, 0, 0.6));
    background-image: linear-gradient(to left top, rgba(253, 157, 57, 0.6), rgba(0, 0, 0, 0.6));
    min-height: 110vh;
    max-height: 1188px;
}

/****** CORES ******/
.light-gray {color:#cccccc;}
.gray {color:#5e5e63;}
.dark-gray {color:#333;}
.light-red {color:#ff6666;}
.red {color:#e32329;}
.dark-red {color:#990000;}
.white {color:#fff;}


/****** MEDIAS QUERIES ******/
/* Definições por altura */

@media (max-height: 600px) {
    .telas-Sistema, .tela-produtos, .tela-vendas, .tela-financeiro {
        display: none;
    }

    .banner-principal {
        border-radius: 0px;
    }

    .gradient10 {
        border-radius: 0px;
    }

    .curve {
        display: none;
    }
}

/* iPhone SE/5 */

@media(max-width: 320px){
    .bg-gray{
        padding-bottom: 50px;
    }
    .slogan{
        top: 0px;
    }
}


/* Telefones em paisagem e abaixo */
@media (max-width: 480px) { 
    .menu {
       display: none;
    }

    #menu {
       position: absolute;
    }

 }


 
/* Telefones em paisagem a tablet em retrato */
@media (max-width: 767px) {
    .tela-produtos, .tela-vendas, .tela-financeiro, .curve{
       display: none;
    }
    .menu {
       display: none;
    }

    #menu {
       position: absolute;
    }


     .box-banner{
        top: 20vh;
     }

     .especial-email-texto, .logoLogin{
        display: none;
     }

     .titulo-login{
        margin-left: 0px;
     }

    .whiteButton {
        background: #ffffff;
        -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
        -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
        box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    }

     .banner-principal {
        height: 100vh;
        max-height: 1080px;
        -webkit-clip-path: none;
        clip-path: none;
     }

     .box-1 {
        height: 100vh;
        max-height: 1080px;
     }
     .box-2{
        padding:0px;
        padding-top:30px;
     }
     .slogan-y{
        padding-top: 16%;
    }

     #form-preCadastro button {
        margin-top: 30px;
     }

     .slogan {
        padding-top: 0px;
        min-height: 300px;
     }
     .slogan:hover .slogan-x{
         transform: translateY(-300px);
     }

     .slogan:hover .slogan-y{
         transform: translateY(-300px);
     }

     .box-banner{
        padding-bottom: 10px;
        margin-bottom: 0px;
     }

     .sloganRecursos{
        height: auto;
     }
     .vetorMontanhaSucesso {
        width: 80%;
     }

    .banner-principal {
        border-radius: 0px;
    }

    .gradient10 {

        border-radius: 0px;
    }

     #DABLIOerp-logo {
        display: none;
     }

    h1 {
        font-size: 30px;
    }

    h2, h3, h4, h5, h6 {
        font-size: 22px;
    }

    .quote h4 {
        font-size: initial;
    }

     #form-preCadastro > fieldset > div > div > input {
        display: none;
     }

    #form-preCadastro > fieldset > div > div > span {
        margin: auto;
    }

    .bn-contato {
        margin: auto 0;
    }
    .testeContato{
        padding: 0px;
        margin: 0px;
    }

    .bn-container {
        padding-right: 0;
        height: auto;
    }

    .box-bnContato {
        padding: 60px 0;
    }

    .plane-contato {
        display: none
    }

    .box-formContato {
        padding: 80px 20px;
    }

    .box-bnContato h2 {
        max-width: 60%;
    }
    .coluna-texto h1 {
        text-align: center;
    }

    .imgSeg {
        border-radius: 50%;
        width: 100%;
        height: 100%;
        padding: 8px;
        filter: grayscale(0) blur(0px);
        margin: 0;
    }

    .beneficios-parceiros i {
        display: none;
    }



    .warningMsggin {
        margin: auto -60px;
        margin-top: 70px;
    }

    #subdominio, #subdominioSenha, #subdominioSenha2 {
        width: 100%;
    }

    .col-notebook {
        display: none;
    }

    body > section.back-depoimentos > div > div > div.row > div.col-sm-10.col-md-8.container-depo > ul > li:nth-child(5) > div.balao-depoimento > div > h4{
        padding-bottom:70px;
    }
    .back-depoimentos{
        padding: 50px 0px;
    }

    .titleDepoimentos{
        margin-bottom: 50px;
    }

    .esq-banner-depo, .dir-banner-depo{
        margin:0px;
    }

    .setasDepo{
        padding: 0px;
    }

    .setasDepoEsq{
        left: -15px;
    }
    .setasDepoDir{
        right: -15px;
    }
    .solicitarLigacao{
        display: none;
    }

    .botao-login {
        font-size: 1.3em;
    }

    .box-login {
        margin: 62px -40px;
    }

    .box-formCad {
        margin: auto -40px;
    }
}

@media (min-width: 575px) and (max-width: 767px) {

    #menu {
       position: relative;
    }

}


@media (min-height: 1400px) {

    .box-banner{
        top: 200px;
    }
    .tela-produtos, .tela-vendas, .tela-financeiro, .curve{
       display: none;
    }

}
 
/* Tablet em retrato a paisagem e desktop */
@media (min-width: 768px) and (max-width: 1199px) {
    .menu {
        display: none;
     }
     .tela-produtos, .tela-vendas, .tela-financeiro, .curve{
        display: none;
     }

    .whiteButton {
        background: #ffffff;
        -webkit-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
        -moz-box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
        box-shadow: 0px 0px 15px 0px rgb(246, 246, 246);
    }

    #DABLIOerp-e {
        display: none;
     }

    .bn-contato {
        margin: auto -30%;
    }

    .bn-container {
        padding-right: 0;
        height: auto;
    }

    .box-bnContato {
        padding: 60px 0;
    }

    .plane-contato {
        display: none
    }

    .box-bnContato h2 {
        max-width: 60%;
    }

    .imgSeg {
        border-radius: 50%;
        width: 100%;
        height: 100%;
        padding: 8px;
        filter: grayscale(0) blur(0px);
        margin: 0;
    }
}
 
/* Desktop grande */
@media (min-width: 1200px) {

    .menu-mobile {
        display: none;
    }

    #DABLIOerp-e {
        display: none;
    }

    .tela-financeiro, .tela-vendas, .tela-produtos {
        -webkit-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
        -moz-box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
        box-shadow: 4px 4px 22px -3px rgba(0,0,0,0.4);
    }

    .tela-financeiro {
        position: absolute;
        width: 32vw;
        height: 35vh;
        bottom: 1vh;
        left: 50vw;
        margin-left: -16.5vw;
        z-index: 50;
        filter: none;
        background: url('../img/site/tela-financeiro.png') no-repeat;
        background-size: 100%;

    }

    .tela-vendas {
        position: absolute;
        width: 30vw;
        height: 29vh;
        right: 15vw;
        bottom: 0vh;
        z-index: 49;
        background: url('../img/site/tela-vendas.png') no-repeat;
        background-size: 100%;

    }

    .tela-produtos{
        position: absolute;
        width: 30vw;
        height: 29vh;
        left: 15vw;
        bottom: 0vh;
        z-index: 49;
        background: url('../img/site/tela-produtos.png') no-repeat;
        background-size: 100%;

    }

    .banner-principal {
        width: 100%;
        height: 110%;
        min-height: 660px;
        background: url('../img/site/1.jpg') no-repeat bottom center;
        background-size: cover;
        position: relative;
    }

    .back-chess {
        background: url('../img/site/cadastro.jpg') no-repeat center;
        background-size: cover;
    }

    .back-dablio {
        background: #d8d8d8 url('../img/site/img-dablio-peb.jpg') no-repeat center right;
        background-size: cover;
    }
    .gradient10 {
        background-image: -webkit-linear-gradient(to left top, rgba(253, 157, 57, 0.6), rgba(0, 0, 0, 0.6));
        background-image: linear-gradient(to left top, rgba(253, 157, 57, 0.6), rgba(0, 0, 0, 0.6));
    }
    .white{
        text-shadow: #3c3c3c 0em 0em 0.5em;
    }
}

@media (min-width: 1800px) {
    .container {
        max-width: 80%;
    }
}
