API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jun 18th, 2019
288
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 56.24 KB | None | 0 0
raw download clone embed print report
  1. footer.mainFooter {
  2.     width: 1280px;
  3.     display: table;
  4.     background: #EBEBEB !important;
  5.     box-sizing: border-box;
  6.     padding: 20px 20px 40px 20px;
  7.     position: relative;
  8. }
  9.  
  10. footer.mainFooter hr.divisor {
  11.     border: 0;
  12.     border-bottom: 1px solid #dedede;
  13.     height: 1px;
  14.     height: 0;
  15.     margin: 0 auto 20px auto;
  16.     padding: 20px 0 0 0;
  17.     clear: both;
  18. }
  19.  
  20. footer.mainFooter ul.redes-sociais {
  21.     list-style: none;
  22.     margin: 0;
  23.     padding: 0;
  24.     float: left;
  25. }
  26.  
  27. footer.mainFooter ul.redes-sociais li {
  28.     float: left;
  29.     margin-right: 5px;
  30. }
  31.  
  32. footer.mainFooter ul.redes-sociais li a {
  33.     width: 26px;
  34.     height: 24px;
  35.     display: block;
  36.     background: url(../images/sprite-redes-sociais.png);
  37.     overflow: hidden;
  38.     text-indent: -1000px;
  39. }
  40.  
  41. footer.mainFooter ul.redes-sociais li a.linkedin {
  42.     background-position: -309px 0;
  43. }
  44.  
  45. footer.mainFooter ul.redes-sociais li a.twitter {
  46.     background-position: 0 0;
  47. }
  48.  
  49. footer.mainFooter ul.redes-sociais li a.facebook {
  50.     background-position: -38px 0;
  51. }
  52.  
  53. footer.mainFooter ul.redes-sociais li a.youtube {
  54.     background-position: -76px 0;
  55. }
  56.  
  57. footer.mainFooter ul.redes-sociais li a.instagram {
  58.     background-position: -115px 0;
  59. }
  60.  
  61. footer.mainFooter ul.redes-sociais li a.googleplus {
  62.     background-position: -154px 0;
  63. }
  64.  
  65. footer.mainFooter ul.redes-sociais li a.wikipedia {
  66.     background-position: -194px 0;
  67. }
  68.  
  69. footer.mainFooter ul.redes-sociais li a.rss {
  70.     background-position: -233px 0;
  71. }
  72.  
  73. footer.mainFooter ul.redes-sociais li a.smarttv {
  74.     background-position: -269px 0;
  75. }
  76.  
  77. footer.mainFooter ul.redes-sociais li a.snapchat {
  78.     background-position: -345px 0;
  79. }
  80.  
  81. footer.mainFooter ul.redes-sociais li a.radiobra {
  82.     background-position: none;
  83.     background: url(../images/radio_.png) no-repeat;
  84. }
  85.  
  86. footer.mainFooter ul.redes-sociais li.acompanhe {
  87.     font-family: "Arial", Trebuchet MS;
  88.     font-size: 17px;
  89.     font-weight: bold;
  90.     color: #000000;
  91.     line-height: 24px;
  92. }
  93.  
  94. footer.mainFooter div.chosen-container {
  95.     float: right;
  96.     width: 250px !important;
  97.     margin-left: 10px;
  98. }
  99.  
  100. footer.mainFooter select.chosen-select-b1 {
  101.     width: 250px;
  102.     float: right;
  103.     margin-left: 10px;
  104. }
  105.  
  106. footer.mainFooter select.chosen-select-b2 {
  107.     width: 250px;
  108.     float: right;
  109.     margin-left: 10px;
  110. }
  111.  
  112. footer.mainFooter h6.atendimento {
  113.     display: none;
  114. }
  115.  
  116. footer.mainFooter div.holderFooter {
  117.     margin: auto;
  118.     display: block;
  119. }
  120.  
  121. footer.mainFooter div.holderFooter ul {
  122.     padding: 0;
  123.     margin: 0;
  124.     position: relative;
  125. }
  126.  
  127. footer.mainFooter div.holderFooter ul li {
  128.     box-sizing: border-box;
  129.     display: inline;
  130.     float: left;
  131.     width: 25%;
  132. }
  133.  
  134. footer.mainFooter div.holderFooter ul li:nth-child(1) h3 {
  135.     font-size: 16px;
  136.     margin-bottom: 10px;
  137. }
  138.  
  139. footer.mainFooter div.holderFooter ul li:nth-child(1) h3 span {
  140.     font-size: 14px;
  141. }
  142.  
  143. footer.mainFooter div.holderFooter ul li:nth-child(1) p {
  144.     font-size: 14px;
  145.     margin-top: 5px;
  146. }
  147.  
  148. footer.mainFooter div.holderFooter ul li:nth-child(2) {
  149.     font-size: 13px;
  150.     padding-left: 6%;
  151. }
  152.  
  153. footer.mainFooter div.holderFooter ul li:nth-child(2) h6 {
  154.     font-size: 15px;
  155. }
  156.  
  157. footer.mainFooter div.holderFooter ul li:nth-child(2) h6 a {
  158.     color: #0067bc;
  159.     text-decoration: none;
  160. }
  161.  
  162. footer.mainFooter div.holderFooter ul li:nth-child(2) strong {
  163.     display: table;
  164.     clear: both;
  165.     margin-top: 10px;
  166. }
  167.  
  168. footer.mainFooter div.holderFooter ul li:nth-child(2) a {
  169.     color: #0067bc;
  170.     text-decoration: none;
  171. }
  172.  
  173. footer.mainFooter div.holderFooter ul li:nth-child(3) {
  174.     margin-bottom: 50px;
  175.     float: left;
  176.     padding-left: 6%;
  177. }
  178.  
  179. footer.mainFooter div.holderFooter ul li:nth-child(3) a {
  180.     color: #000;
  181.     text-decoration: none;
  182.     display: table;
  183.     height: 20px;
  184.     line-height: 20px;
  185.     white-space: nowrap;
  186.     font-size: 12px;
  187.     margin-bottom: 10px;
  188.     padding-left: 25px;
  189. }
  190.  
  191. footer.mainFooter div.holderFooter ul li:nth-child(3) a.sistema {
  192.     background: url(../images/icon-sistema.gif) no-repeat;
  193. }
  194.  
  195. footer.mainFooter div.holderFooter ul li:nth-child(3) a.codigo {
  196.     background: url(../images/icon-codigo.gif) no-repeat;
  197. }
  198.  
  199. footer.mainFooter div.holderFooter ul li:nth-child(3) a.credito {
  200.     background: url(../images/icon-credito.gif) no-repeat;
  201. }
  202.  
  203. footer.mainFooter div.holderFooter ul li:nth-child(3) a.taxajuros {
  204.     background: url(../images/icone_bacen.png) -4px -6px no-repeat;
  205. }
  206.  
  207. footer.mainFooter div.holderFooter ul li:nth-child(3) a.portal-consumidor {
  208.     background: url(../images/icon-portal-consumidor.png) 0px 0px no-repeat;
  209. }
  210.  
  211. footer.mainFooter div.holderFooter ul li:nth-child(3) a.consumidor {
  212.     background: url(../images/ico-consumidor.png) no-repeat;
  213. }
  214.  
  215. footer.mainFooter div.holderFooter ul li:nth-child(3) a.comparativo {
  216.     background: url(../images/icone_febraban.png) no-repeat;
  217. }
  218.  
  219. footer.mainFooter div.holderFooter ul li:nth-child(3) a.diretivas {
  220.     background: url(../images/icon_privacidade.png) 0 -6px no-repeat;
  221. }
  222.  
  223. footer.mainFooter div.holderFooter ul li:nth-child(3) a.tarifas {
  224.     background: url(../images/ico-cesta.png) no-repeat;
  225. }
  226.  
  227. footer.mainFooter div.holderFooter ul li:nth-child(4) {
  228.     float: left;
  229.     padding-left: 6%;
  230. }
  231.  
  232. footer.mainFooter div.holderFooter ul li:nth-child(4) a {
  233.     color: #000;
  234.     text-decoration: none;
  235.     display: table;
  236.     height: 20px;
  237.     line-height: 20px;
  238.     white-space: nowrap;
  239.     font-size: 12px;
  240.     margin-bottom: 10px;
  241.     padding-left: 25px;
  242. }
  243.  
  244. footer.mainFooter div.holderFooter ul li:nth-child(4) a.sistema {
  245.     background: url(../images/icon-sistema.gif) no-repeat;
  246. }
  247.  
  248. footer.mainFooter div.holderFooter ul li:nth-child(4) a.codigo {
  249.     background: url(../images/icon-codigo.gif) no-repeat;
  250. }
  251.  
  252. footer.mainFooter div.holderFooter ul li:nth-child(4) a.credito {
  253.     background: url(../images/icon-credito.gif) no-repeat;
  254. }
  255.  
  256. footer.mainFooter div.holderFooter ul li:nth-child(4) a.taxajuros {
  257.     background: url(../images/icone_bacen.png) -4px -6px no-repeat;
  258. }
  259.  
  260. footer.mainFooter div.holderFooter ul li:nth-child(4) a.portal-consumidor {
  261.     background: url(../images/icon-portal-consumidor.png) 0px 0px no-repeat;
  262. }
  263.  
  264. footer.mainFooter div.holderFooter ul li:nth-child(4) a.consumidor {
  265.     background: url(../images/ico-consumidor.png) no-repeat;
  266. }
  267.  
  268. footer.mainFooter div.holderFooter ul li:nth-child(4) a.comparativo {
  269.     background: url(../images/icone_febraban.png) no-repeat;
  270. }
  271.  
  272. footer.mainFooter div.holderFooter ul li:nth-child(4) a.diretivas {
  273.     background: url(../images/icon_privacidade.png) 0 -6px no-repeat;
  274. }
  275.  
  276. footer.mainFooter div.holderFooter ul li:nth-child(4) a.tarifas {
  277.     background: url(../images/ico-cesta.png) no-repeat;
  278. }
  279.  
  280. footer.mainFooter div.holderFooter ul li .qrcode-whatsapp-bia {
  281.     margin: 15px 0;
  282. }
  283.  
  284. footer.mainFooter div.holderFooter ul li .qrcode-whatsapp-bia .qrcode {
  285.     width: 80px;
  286.     height: 66px;
  287.     position: relative;
  288.     border: 3px solid #858585;
  289.     border-radius: 10px;
  290.     float: left;
  291.     margin-right: 15px;
  292.     background: url(../images/qr-code-whatsapp-bia.png) no-repeat 5px 5px;
  293.     background-size: 50px;
  294. }
  295.  
  296. footer.mainFooter div.holderFooter ul li .qrcode-whatsapp-bia .qrcode img {
  297.     position: absolute;
  298.     top: 50%;
  299.     right: -12px;
  300.     margin-top: -17px;
  301. }
  302.  
  303. footer.mainFooter div.holderFooter ul li .qrcode-whatsapp-bia p {
  304.     float: left;
  305.     margin-top: 20px !important;
  306. }
  307.  
  308. footer.mainFooter address {
  309.     font-style: normal;
  310.     font-size: 12px;
  311.     color: #000000;
  312.     font-family: "Arial", Trebuchet MS;
  313.     text-align: left;
  314.     padding: 0;
  315.     box-sizing: border-box;
  316. }
  317.  
  318. div.mapa-barra {
  319.     display: block;
  320.     width: 100%;
  321.     overflow-x: auto;
  322.     overflow-y: hidden;
  323.     height: 28px;
  324.     line-height: 27px;
  325.     position: relative;
  326.     background: #13385f;
  327.     background: -moz-linear-gradient(left, #13385f 0%, #2989d8 37%, #207cca 62%, #123458 100%);
  328.     background: -webkit-gradient(linear, left top, right top, color-stop(0%, #13385f), color-stop(37%, #2989d8), color-stop(62%, #207cca), color-stop(100%, #123458));
  329.     background: -webkit-linear-gradient(left, #13385f 0%, #2989d8 37%, #207cca 62%, #123458 100%);
  330.     background: -o-linear-gradient(left, #13385f 0%, #2989d8 37%, #207cca 62%, #123458 100%);
  331.     background: -ms-linear-gradient(left, #13385f 0%, #2989d8 37%, #207cca 62%, #123458 100%);
  332.     background: linear-gradient(to right, #13385f 0%, #2989d8 37%, #207cca 62%, #123458 100%);
  333. }
  334.  
  335. div.mapa-barra ul {
  336.     position: relative;
  337.     display: table;
  338.     margin: 0;
  339.     padding: 0;
  340.     white-space: nowrap;
  341.     width: 100%;
  342.     text-align: center;
  343. }
  344.  
  345. div.mapa-barra ul li {
  346.     display: inline-table;
  347.     padding: 0 35px;
  348.     position: relative;
  349. }
  350.  
  351. div.mapa-barra ul li:before {
  352.     border-left: 1px solid #ddd;
  353.     position: absolute;
  354.     left: 0;
  355.     top: 10px;
  356.     height: 10px;
  357.     content: '';
  358. }
  359.  
  360. div.mapa-barra ul li:first-child:before {
  361.     border-left: 0;
  362. }
  363.  
  364. div.mapa-barra ul li a {
  365.     font-family: "NewJuneRegular-Regular", arial, trebuchet ms;
  366.     color: #fff;
  367.     font-size: 11px;
  368.     text-decoration: none;
  369. }
  370.  
  371. div.mapa-barra ul li a img {
  372.     margin-top: -4px;
  373. }
  374.  
  375. div.mapa-barra ul li a:hover {
  376.     text-decoration: underline;
  377. }
  378.  
  379. body.tablet #wrapper {
  380.     padding-top: 120px;
  381. }
  382.  
  383. body.tablet div#topBar {
  384.     display: block;
  385. }
  386.  
  387. body.tablet div#topBar div.holder {
  388.     display: block;
  389. }
  390.  
  391. body.tablet div#topBar div.holderMobile {
  392.     display: none;
  393. }
  394.  
  395. body.tablet div.holderFixed {
  396.     top: 40px;
  397. }
  398.  
  399. body.tablet footer.mainFooter {
  400.     padding: 20px 20px 85px 20px;
  401. }
  402.  
  403. div.modal {
  404.     margin: 0 auto;
  405.     width: 90%;
  406.     max-width: 800px;
  407.     background: #fff;
  408.     border-radius: 10px;
  409.     position: relative;
  410. }
  411.  
  412. div.modal header {
  413.     border-radius: 10px 10px 0 0;
  414.     background: #ededed;
  415.     width: 100%;
  416.     height: 50px;
  417.     line-height: 50px;
  418.     border-bottom: 2px solid #cc092f;
  419.     position: relative;
  420.     padding: 0 120px 0 20px;
  421.     font-family: "Arial";
  422.     font-weight: bold;
  423.     font-size: 18px;
  424. }
  425.  
  426. div.modal header span.title {
  427.     display: inline-block;
  428.     vertical-align: middle;
  429. }
  430.  
  431. div.modal section {
  432.     width: 100%;
  433.     background: #fff;
  434.     padding: 20px;
  435.     border-radius: 0 0 10px 10px;
  436. }
  437.  
  438. div.modal section p {
  439.     margin-bottom: 12px;
  440.     font-family: arial;
  441.     font-size: 13px;
  442.     line-height: 18px;
  443. }
  444.  
  445. div.modal section h3 {
  446.     font-size: 18px;
  447.     margin-bottom: 15px;
  448. }
  449.  
  450. div.modal section fieldset {
  451.     border-radius: 5px;
  452. }
  453.  
  454. div.modal section fieldset h4 {
  455.     background: url(../images/ico_IB.jpg) no-repeat left;
  456.     height: 40px;
  457.     line-height: 40px;
  458.     padding-left: 50px;
  459.     font-size: 13px;
  460.     font-weight: normal;
  461. }
  462.  
  463. div.modal section fieldset p {
  464.     background: url(../images/ico_cpf.jpg) no-repeat left;
  465.     height: 40px;
  466.     line-height: 40px;
  467.     padding-left: 50px;
  468.     font-size: 13px;
  469.     font-weight: normal;
  470. }
  471.  
  472. div.modal section fieldset ul {
  473.     list-style: none;
  474.     margin: 0;
  475.     padding: 0;
  476. }
  477.  
  478. div.modal section fieldset ul li {
  479.     float: left;
  480.     font-size: 13px;
  481.     margin-left: 5px;
  482. }
  483.  
  484. div.modal section fieldset ul li input[type="text"] {
  485.     border: 1px solid #d6d6d6;
  486.     border-radius: 5px;
  487.     padding: 5px;
  488.     margin-right: 5px;
  489. }
  490.  
  491. div.modal section fieldset ul li input[type="text"]#AGN {
  492.     width: 80px;
  493. }
  494.  
  495. div.modal section fieldset ul li input[type="text"]#CTA {
  496.     width: 80px;
  497. }
  498.  
  499. div.modal section fieldset ul li input[type="text"]#DIGCTA {
  500.     width: 30px;
  501. }
  502.  
  503. div.modal section fieldset ul li.link {
  504.     margin-left: 10px;
  505. }
  506.  
  507. div.modal section fieldset ul li.link a {
  508.     display: table;
  509.     position: relative;
  510.     text-decoration: none;
  511.     color: #393939;
  512.     margin-top: 5px;
  513. }
  514.  
  515. div.modal section fieldset ul li.link a:before {
  516.     content: '\203A';
  517.     position: absolute;
  518.     top: -2px;
  519.     right: -12px;
  520.     font-size: 17px;
  521. }
  522.  
  523. div.modal section fieldset ul li.link a:hover {
  524.     color: #75a7ec;
  525. }
  526.  
  527. div.modal section ul.accordion div.description p {
  528.     margin: 0 0 20px 0 !important;
  529. }
  530.  
  531. div.modal section a {
  532.     color: #393939;
  533. }
  534.  
  535. div.modal section a:hover {
  536.     color: #75a7ec;
  537. }
  538.  
  539. div.modal section a.lnk-blue {
  540.     color: #00539f;
  541. }
  542.  
  543. div.modal section a.lnk-blue:hover {
  544.     color: #75a7ec;
  545. }
  546.  
  547. div.modal section a.lnk-red {
  548.     color: #cc0a2f;
  549. }
  550.  
  551. div.modal section a.lnk-red:hover {
  552.     color: #ea1b49;
  553. }
  554.  
  555. div.modal button.mfp-close {
  556.     position: absolute;
  557.     display: table;
  558.     right: 20px;
  559.     top: 11px;
  560.     width: 76px;
  561.     height: 24px;
  562.     padding: 0 0 0 12px;
  563.     line-height: 23px;
  564.     color: #000;
  565.     font-size: 12px;
  566.     font-weight: normal;
  567.     text-align: center;
  568.     background: #f6f6f6;
  569.     background: -moz-linear-gradient(top, #f6f6f6 0%, #ffffff 50%, #efefef 100%);
  570.     background: -webkit-gradient(left top, left bottom, color-stop(0%, #f6f6f6), color-stop(50%, #ffffff), color-stop(100%, #efefef));
  571.     background: -webkit-linear-gradient(top, #f6f6f6 0%, #ffffff 50%, #efefef 100%);
  572.     background: -o-linear-gradient(top, #f6f6f6 0%, #ffffff 50%, #efefef 100%);
  573.     background: -ms-linear-gradient(top, #f6f6f6 0%, #ffffff 50%, #efefef 100%);
  574.     background: linear-gradient(to bottom, #f6f6f6 0%, #ffffff 50%, #efefef 100%);
  575.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#efefef', GradientType=0);
  576.     border-radius: 5px;
  577.     border: 1px solid #dfdfdf;
  578.     opacity: 1;
  579.     text-decoration: none;
  580. }
  581.  
  582. div.modal button.mfp-close:hover {
  583.     color: #488ae6;
  584. }
  585.  
  586. div.modal button.mfp-close:before {
  587.     content: '\00d7';
  588.     position: absolute;
  589.     left: 8px;
  590.     top: 0;
  591.     color: #ff0000;
  592.     font-size: 18px;
  593. }
  594.  
  595. div.modal input[type="submit"].ok {
  596.     width: 44px;
  597.     height: 27px;
  598.     line-height: 13px;
  599.     font-size: 12px;
  600.     font-weight: normal;
  601.     text-align: center;
  602.     background: #b90925;
  603.     background: -moz-linear-gradient(top, #b90925 0%, #e31b32 50%, #b90a25 100%);
  604.     background: -webkit-gradient(left top, left bottom, color-stop(0%, #b90925), color-stop(50%, #e31b32), color-stop(100%, #b90a25));
  605.     background: -webkit-linear-gradient(top, #b90925 0%, #e31b32 50%, #b90a25 100%);
  606.     background: -o-linear-gradient(top, #b90925 0%, #e31b32 50%, #b90a25 100%);
  607.     background: -ms-linear-gradient(top, #b90925 0%, #e31b32 50%, #b90a25 100%);
  608.     background: linear-gradient(to bottom, #b90925 0%, #e31b32 50%, #b90a25 100%);
  609.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b90925', endColorstr='#b90a25', GradientType=0);
  610.     border-radius: 5px;
  611.     border: 1px solid #b90925;
  612.     color: #fff;
  613. }
  614.  
  615. .img-servicos {
  616.     height: 147px;
  617.     width: 111px;
  618. }
  619.  
  620. .transacao-no-mobile {
  621.     padding: 20px;
  622.     border: 1px solid #ddd;
  623.     border-radius: 5px;
  624.     text-align: center;
  625. }
  626.  
  627. .transacao-no-mobile p {
  628.     margin-bottom: 20px !important;
  629.     font-size: 16px !important;
  630. }
  631.  
  632. .transacao-no-mobile span {
  633.     font-size: 16px !important;
  634. }
  635.  
  636. .transacao-no-mobile a {
  637.     border: 1px solid #ce0026;
  638.     display: inline-table;
  639.     width: 90px;
  640.     height: 30px;
  641.     box-sizing: border-box;
  642.     line-height: 26px;
  643.     background: #c80025;
  644.     background: -moz-radial-gradient(center, ellipse cover, #c80025 0%, #a2001e 100%);
  645.     background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #c80025), color-stop(100%, #a2001e));
  646.     background: -webkit-radial-gradient(center, ellipse cover, #c80025 0%, #a2001e 100%);
  647.     background: -o-radial-gradient(center, ellipse cover, #c80025 0%, #a2001e 100%);
  648.     background: -ms-radial-gradient(center, ellipse cover, #c80025 0%, #a2001e 100%);
  649.     background: radial-gradient(ellipse at center, #c80025 0%, #a2001e 100%);
  650.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c80025', endColorstr='#a2001e', GradientType=1);
  651.     text-align: center;
  652.     color: #fff !important;
  653.     text-decoration: none;
  654.     font-family: "NewJuneRegular-Regular", arial, trebuchet ms;
  655.     font-size: 12px;
  656. }
  657.  
  658. #modalURLExterna section h3 {
  659.     font-size: 16px;
  660.     margin-bottom: 20px;
  661. }
  662.  
  663. #modalURLExterna section p {
  664.     font-size: 13px;
  665.     margin-bottom: 20px;
  666. }
  667.  
  668. #modalURLExterna section img {
  669.     width: 100%;
  670.     display: block;
  671. }
  672.  
  673. #modalURLExterna section .img-link-externo {
  674.     border-bottom: 1px solid #d2d2d2;
  675.     text-align: center;
  676. }
  677.  
  678. #modalURLExterna section .img-link-externo img {
  679.     max-width: 220px;
  680.     display: inline;
  681. }
  682.  
  683. @media only screen and (max-width: 1279px) {
  684.     div#topBar div.holder {
  685.         width: 1024px;
  686.     }
  687.     div#topBar div.holderMobile {
  688.         width: 1024px;
  689.     }
  690.     div.nao-correntista {
  691.         right: 0 !important;
  692.     }
  693.     div.nao-correntista:after {
  694.         display: none;
  695.     }
  696.     body.cartoesSec div#topBar div.top-bar-center {
  697.         display: none;
  698.     }
  699.     body.consorciosSec div#topBar div.top-bar-center {
  700.         display: none;
  701.     }
  702.     body.imoveisSec div#topBar div.top-bar-center {
  703.         display: none;
  704.     }
  705.     #wrapper {
  706.         width: 1024px;
  707.     }
  708.     header.mainHeader {
  709.         width: 1024px;
  710.     }
  711.     header.headerMobile {
  712.         width: 1024px;
  713.     }
  714.     div.breadcrumb {
  715.         width: 819px;
  716.     }
  717.     div.breadcrumb ul.links {
  718.         width: 75%;
  719.     }
  720.     section.mainContent {
  721.         width: 819px;
  722.     }
  723.     footer.mainFooter {
  724.         width: 1024px;
  725.     }
  726.     footer.mainFooter div.holderFooter ul li {
  727.         padding: 0 !important;
  728.     }
  729.     footer.mainFooter div.holderFooter ul li:nth-child(1) {
  730.         width: 300px;
  731.     }
  732.     footer.mainFooter div.holderFooter ul li:nth-child(1) h3 {
  733.         font-size: 14px;
  734.     }
  735.     footer.mainFooter div.holderFooter ul li:nth-child(1) h3 span {
  736.         font-size: 13px;
  737.     }
  738.     footer.mainFooter div.holderFooter ul li:nth-child(1) p {
  739.         font-size: 13px;
  740.         margin-top: 5px;
  741.     }
  742.     footer.mainFooter div.holderFooter ul li:nth-child(2) {
  743.         width: 158px;
  744.     }
  745.     footer.mainFooter div.holderFooter ul li:nth-child(2) h6 {
  746.         font-size: 15px;
  747.     }
  748.     footer.mainFooter div.holderFooter ul li:nth-child(3) {
  749.         width: 295px;
  750.     }
  751.     footer.mainFooter div.holderFooter ul li:nth-child(4) {
  752.         width: 230px;
  753.     }
  754.     div.mapa-barra ul li {
  755.         padding: 0 20px;
  756.     }
  757.     .destaque-area .description .left {
  758.         float: left;
  759.         width: 90%;
  760.     }
  761.     .destaque-area .description .right {
  762.         float: left;
  763.         width: 10%;
  764.     }
  765.     .destaque-area .description .right .saiba-mais {
  766.         margin-top: 0;
  767.     }
  768.     div.btn-parceiros {
  769.         right: 0;
  770.         right: 0;
  771.     }
  772.     div.btn-parceiros a:after {
  773.         display: none;
  774.         display: none;
  775.     }
  776.     div.canal-consorciado {
  777.         right: 0;
  778.         right: 0;
  779.     }
  780.     div.canal-consorciado a:after {
  781.         display: none;
  782.         display: none;
  783.     }
  784.     body.tablet div#topBar {
  785.         padding: 0 20px;
  786.         padding: 0 20px;
  787.     }
  788.     body.tablet div#topBar div.holder .top-bar-center {
  789.         right: 40px;
  790.     }
  791.     body.tablet div#topBar div.holder div.como-usar {
  792.         left: 426px;
  793.     }
  794.     body.tablet div#topBar form legend {
  795.         width: 14px;
  796.         background: url(../images/acesso-seguro-1024.png) no-repeat;
  797.     }
  798.     body.tablet div#topBar form fieldset>ul {
  799.         left: 25px;
  800.     }
  801.     body.tablet div.btn-parceiros {
  802.         right: 40px;
  803.         right: 40px;
  804.     }
  805.     body.tablet div.canal-consorciado {
  806.         right: 40px;
  807.         right: 40px;
  808.     }
  809.     body.tablet div.nao-correntista {
  810.         right: 40px !important;
  811.     }
  812.     body.tablet div.nao-correntista .tipCartoes {
  813.         margin-left: 8px;
  814.     }
  815.     body.tablet div.nao-correntista .tipCartoes:before {
  816.         left: 40px;
  817.     }
  818.     body.tablet footer.mainFooter div.holderFooter {
  819.         display: none;
  820.         height: auto;
  821.         margin-top: 35px;
  822.     }
  823.     body.tablet footer.mainFooter h6.atendimento {
  824.         cursor: pointer;
  825.         box-sizing: border-box;
  826.         padding: 0;
  827.         font-size: 15px;
  828.         margin: 0 auto;
  829.         position: relative;
  830.         display: block;
  831.     }
  832.     body.tablet footer.mainFooter h6.atendimento span {
  833.         position: absolute;
  834.         top: 5px;
  835.         right: 0;
  836.         width: 10px;
  837.         height: 7px;
  838.         display: block;
  839.         background: url(../images/seta-atendimento.gif) 0 0 no-repeat;
  840.     }
  841.     body.tablet footer.mainFooter h6.atendimento.active span {
  842.         background: url(../images/seta-atendimento.gif) 0 -7px no-repeat;
  843.     }
  844. }
  845.  
  846. @media only screen and (max-width: 1023px) {
  847.     nav.navSegMobile {
  848.         display: block;
  849.     }
  850.     div#topBar div.holder {
  851.         width: 768px;
  852.     }
  853.     div#topBar div.holder div.como-usar {
  854.         display: none;
  855.     }
  856.     div#topBar div.holder form legend {
  857.         width: 14px;
  858.         background: url(../images/acesso-seguro-1024.png) no-repeat;
  859.     }
  860.     div#topBar div.holder form fieldset>ul {
  861.         left: 25px;
  862.     }
  863.     div#topBar div.holder form fieldset>ul li.lembrar:before {
  864.         display: none;
  865.     }
  866.     div#topBar div.holderMobile {
  867.         width: 768px;
  868.     }
  869.     div#topBar div.btn-parceiros {
  870.         display: none !important;
  871.     }
  872.     div#topBar div.canal-consorciado {
  873.         display: none !important;
  874.     }
  875.     body.cartoesSec div#topBar div.top-bar-center {
  876.         display: none;
  877.     }
  878.     body.cartoesSec div.nao-correntista {
  879.         right: 20px;
  880.     }
  881.     body.cartoesSec div.nao-correntista:after {
  882.         display: none;
  883.     }
  884.     body.consorciosSec div#topBar div.top-bar-center {
  885.         display: block;
  886.     }
  887.     body.imoveisSec div#topBar div.top-bar-center {
  888.         display: block;
  889.     }
  890.     #wrapper {
  891.         width: 768px;
  892.         padding-top: 135px;
  893.     }
  894.     header.mainHeader {
  895.         display: none;
  896.     }
  897.     div.holderFixed {
  898.         display: block;
  899.     }
  900.     header.headerMobile {
  901.         width: 768px;
  902.         padding: 20px 0 20px 20px;
  903.         display: block;
  904.     }
  905.     header.headerMobile a.mobileMenu {
  906.         right: 20px;
  907.     }
  908.     header.headerMobile div.busca {
  909.         right: 72px;
  910.     }
  911.     header.headerMobile div.busca #textobusca {
  912.         max-width: 300px;
  913.     }
  914.     nav#mainMenu {
  915.         display: none;
  916.     }
  917.     div.breadcrumb {
  918.         display: none;
  919.     }
  920.     a.botaoAbraConta {
  921.         display: none;
  922.     }
  923.     section.mainContent {
  924.         width: 100%;
  925.     }
  926.     footer.mainFooter {
  927.         width: 768px;
  928.         padding: 20px 20px 85px 20px;
  929.         background: #EBEBEB;
  930.     }
  931.     footer.mainFooter div.chosen-select-b2 {
  932.         display: none;
  933.     }
  934.     footer.mainFooter select.chosen-select-b2 {
  935.         display: none;
  936.     }
  937.     footer.mainFooter div.holderFooter {
  938.         display: none;
  939.         height: auto;
  940.         margin-top: 25px;
  941.     }
  942.     footer.mainFooter div.holderFooter ul li {
  943.         padding: 0 !important;
  944.     }
  945.     footer.mainFooter div.holderFooter ul li:nth-child(1) {
  946.         width: 50%;
  947.         margin-bottom: 20px;
  948.         min-height: 120px;
  949.     }
  950.     footer.mainFooter div.holderFooter ul li:nth-child(2) {
  951.         width: 50%;
  952.         margin-bottom: 20px;
  953.         min-height: 120px;
  954.     }
  955.     footer.mainFooter div.holderFooter ul li:nth-child(2) div {
  956.         display: inline-table;
  957.         width: 49%;
  958.     }
  959.     footer.mainFooter div.holderFooter ul li:nth-child(3) {
  960.         width: 50%;
  961.         margin-bottom: 20px;
  962.         min-height: 120px;
  963.     }
  964.     footer.mainFooter div.holderFooter ul li:nth-child(4) {
  965.         width: 50%;
  966.         margin-bottom: 20px;
  967.         min-height: 120px;
  968.     }
  969.     footer.mainFooter address {
  970.         margin-top: 20px;
  971.     }
  972.     footer.mainFooter h6.atendimento {
  973.         width: 727px;
  974.         cursor: pointer;
  975.         box-sizing: border-box;
  976.         padding: 0;
  977.         font-size: 15px;
  978.         margin: 0 auto;
  979.         position: relative;
  980.         display: block;
  981.     }
  982.     footer.mainFooter h6.atendimento span {
  983.         position: absolute;
  984.         top: 5px;
  985.         right: 0;
  986.         width: 10px;
  987.         height: 7px;
  988.         display: block;
  989.         background: url(../images/seta-atendimento.gif) 0 0 no-repeat;
  990.     }
  991.     footer.mainFooter h6.atendimento.active span {
  992.         background: url(../images/seta-atendimento.gif) 0 -7px no-repeat;
  993.     }
  994.     div.mapa-barra ul li {
  995.         padding: 0 13px;
  996.     }
  997.     body.tablet body.cartoesSec div.nao-correntista {
  998.         right: 40px !important;
  999.     }
  1000. }
  1001.  
  1002. @media only screen and (max-width: 767px) {
  1003.     div.modal header {
  1004.         font-size: 15px;
  1005.     }
  1006.     div.modal header span.title {
  1007.         line-height: normal;
  1008.     }
  1009.     .mfp-title {
  1010.         font-size: 15px !important;
  1011.     }
  1012.     div#topBar div.holder {
  1013.         width: 640px;
  1014.     }
  1015.     div#topBar div.holder div.como-usar {
  1016.         display: none;
  1017.     }
  1018.     div#topBar div.holder div.top-bar-center {
  1019.         display: none;
  1020.     }
  1021.     div#topBar div.holder form fieldset {
  1022.         width: auto;
  1023.     }
  1024.     div#topBar div.holder form fieldset legend {
  1025.         left: 20px;
  1026.         width: 177px;
  1027.         background: url(../images/acesso-seguro.png) no-repeat;
  1028.     }
  1029.     div#topBar div.holder form fieldset>ul {
  1030.         left: auto;
  1031.         right: 15px;
  1032.     }
  1033.     div#topBar div.acessibilidade {
  1034.         display: none;
  1035.     }
  1036.     div#topBar div.holderMobile {
  1037.         width: 640px;
  1038.     }
  1039.     body.cartoesSec div.nao-correntista {
  1040.         display: none !important;
  1041.     }
  1042.     #wrapper {
  1043.         width: 640px;
  1044.     }
  1045.     header.mainHeader {
  1046.         display: none;
  1047.     }
  1048.     div.holderFixed {
  1049.         display: block;
  1050.     }
  1051.     header.headerMobile {
  1052.         width: 640px;
  1053.     }
  1054.     body.mobile nav.navSegMobile {
  1055.         display: none;
  1056.     }
  1057.     nav.navSegMobile {
  1058.         display: none;
  1059.     }
  1060.     div.comboSegmentos {
  1061.         display: block;
  1062.         background-color: #233F66;
  1063.     }
  1064.     section.mainContent {
  1065.         width: 100%;
  1066.     }
  1067.     footer.mainFooter {
  1068.         width: 100%;
  1069.         background: #EBEBEB;
  1070.     }
  1071.     footer.mainFooter ul.redes-sociais {
  1072.         margin: 0 auto;
  1073.         float: none;
  1074.         display: table;
  1075.     }
  1076.     footer.mainFooter div.chosen-select-b1 {
  1077.         float: none;
  1078.         margin: 20px auto 0 auto;
  1079.         display: table;
  1080.     }
  1081.     footer.mainFooter select.chosen-select-b1 {
  1082.         margin: 20px auto 0 auto;
  1083.         display: table;
  1084.         float: none;
  1085.     }
  1086.     footer.mainFooter h6.atendimento {
  1087.         width: 600px;
  1088.     }
  1089.     footer.mainFooter .qrcode-whatsapp-bia {
  1090.         margin-bottom: 0;
  1091.     }
  1092. }
  1093.  
  1094. @media only screen and (max-width: 639px) {
  1095.     .destaque-area .description .left {
  1096.         float: none;
  1097.         width: 100%;
  1098.     }
  1099.     .destaque-area .description .right {
  1100.         float: none;
  1101.         width: 100%;
  1102.     }
  1103.     .destaque-area .description .right .saiba-mais {
  1104.         margin-top: 15px;
  1105.     }
  1106.     div#topBar div.holder {
  1107.         width: 480px;
  1108.     }
  1109.     div#topBar div.holder div.ico-cadeado {
  1110.         display: none;
  1111.     }
  1112.     div#topBar div.holder a.abrirLogin {
  1113.         display: block;
  1114.     }
  1115.     div#topBar div.holder form fieldset legend {
  1116.         display: block;
  1117.         width: 15px;
  1118.     }
  1119.     div#topBar div.holderMobile {
  1120.         width: 480px;
  1121.     }
  1122.     div#topBar div.holderMobile p {
  1123.         padding: 6px 20px;
  1124.         font-size: 12px;
  1125.     }
  1126.     div#topBar div.holderMobile p span {
  1127.         display: block;
  1128.     }
  1129.     #wrapper {
  1130.         width: 480px;
  1131.     }
  1132.     header.headerMobile {
  1133.         width: 480px;
  1134.     }
  1135.     header.headerMobile a.buscaMobile {
  1136.         display: block;
  1137.     }
  1138.     header.headerMobile div.busca {
  1139.         display: none;
  1140.     }
  1141.     header.headerMobile div.busca.active {
  1142.         display: block;
  1143.         top: 79px;
  1144.         right: 0;
  1145.         height: 51px;
  1146.         background: #fff;
  1147.         width: 100% !important;
  1148.     }
  1149.     header.headerMobile div.busca.active input[type="text"] {
  1150.         min-width: 85% !important;
  1151.         max-width: 250px;
  1152.         height: 49px !important;
  1153.         line-height: 49px;
  1154.         box-sizing: border-box;
  1155.         padding-left: 20px;
  1156.         float: left;
  1157.     }
  1158.     header.headerMobile div.busca.active input.btn-buscar {
  1159.         width: 45px;
  1160.         height: 49px !important;
  1161.         background-position: center;
  1162.     }
  1163.     header.headerMobile div.busca.active div.search-autocomplete2 {
  1164.         top: 49px !important;
  1165.     }
  1166.     nav.navSegMobile ul.navSeg {
  1167.         display: none;
  1168.     }
  1169.     div.comboSegmentos {
  1170.         display: block;
  1171.         background-color: #233F66;
  1172.     }
  1173.     footer.mainFooter {
  1174.         width: 100%;
  1175.         padding: 20px 0 85px 0;
  1176.         background: #EBEBEB;
  1177.     }
  1178.     footer.mainFooter ul.redes-sociais {
  1179.         display: table;
  1180.         margin: 0 auto;
  1181.         float: none;
  1182.     }
  1183.     footer.mainFooter ul.redes-sociais li.acompanhe {
  1184.         clear: both;
  1185.         float: none;
  1186.         text-align: center;
  1187.         margin-bottom: 10px;
  1188.     }
  1189.     footer.mainFooter div.holderFooter ul {
  1190.         max-width: 300px;
  1191.         margin: 0 auto;
  1192.     }
  1193.     footer.mainFooter div.holderFooter ul li:nth-child(1) {
  1194.         width: 100%;
  1195.         margin-bottom: 0px;
  1196.         min-height: auto;
  1197.     }
  1198.     footer.mainFooter div.holderFooter ul li:nth-child(2) {
  1199.         width: 100%;
  1200.         margin-bottom: 30px;
  1201.         min-height: auto;
  1202.     }
  1203.     footer.mainFooter div.holderFooter ul li:nth-child(3) {
  1204.         width: 100%;
  1205.         margin-bottom: 30px;
  1206.         min-height: auto;
  1207.         margin-bottom: 0;
  1208.     }
  1209.     footer.mainFooter div.holderFooter ul li:nth-child(4) {
  1210.         width: 100%;
  1211.         margin-bottom: 30px;
  1212.         min-height: auto;
  1213.         margin-bottom: 20px;
  1214.     }
  1215.     footer.mainFooter address {
  1216.         max-width: 300px;
  1217.         margin: 0 auto;
  1218.     }
  1219.     footer.mainFooter h6.atendimento {
  1220.         width: 300px;
  1221.     }
  1222. }
  1223.  
  1224. @media only screen and (max-width: 479px) {
  1225.     div.modal header {
  1226.         font-size: 13px;
  1227.     }
  1228.     div.modal section fieldset h4 {
  1229.         line-height: 17px;
  1230.         margin-bottom: 10px;
  1231.     }
  1232.     div.modal section fieldset ul li {
  1233.         margin-bottom: 10px;
  1234.     }
  1235.     div.modal section fieldset ul li:first-child {
  1236.         float: none;
  1237.     }
  1238.     div.modal section fieldset ul li label.conta span {
  1239.         display: inline-table;
  1240.         padding-left: 12px;
  1241.     }
  1242.     .mfp-title {
  1243.         font-size: 13px !important;
  1244.         padding: 18px 90px 17px 20px;
  1245.         line-height: initial !important;
  1246.     }
  1247.     div#topBar div.holder {
  1248.         width: 100%;
  1249.         min-width: 320px;
  1250.     }
  1251.     div#topBar div.holder form fieldset>ul li.lembrar {
  1252.         display: none;
  1253.     }
  1254.     div#topBar div.holderMobile {
  1255.         width: 100%;
  1256.         min-width: 320px;
  1257.     }
  1258.     header.headerMobile {
  1259.         width: 100%;
  1260.         min-width: 320px;
  1261.     }
  1262.     #wrapper {
  1263.         width: 100%;
  1264.         min-width: 320px;
  1265.     }
  1266.     #modalURLExterna section .col-lg-4 {
  1267.         width: 100%;
  1268.     }
  1269.     #modalURLExterna section .col-lg-8 {
  1270.         width: 100%;
  1271.     }
  1272.     #modalURLExterna section h3 {
  1273.         font-size: 14px;
  1274.         margin-bottom: 15px;
  1275.     }
  1276.     #modalURLExterna section p {
  1277.         font-size: 12px;
  1278.         margin-bottom: 15px;
  1279.     }
  1280.     #modalURLExterna section .thumb {
  1281.         display: none;
  1282.     }
  1283.     #modalURLExterna section .img-link-externo {
  1284.         margin-bottom: 30px;
  1285.     }
  1286.     #modalURLExterna section .img-link-externo img {
  1287.         max-width: 160px;
  1288.         display: inline;
  1289.     }
  1290.     footer.mainFooter ul.redes-sociais li {
  1291.         margin-right: 8px;
  1292.         margin-bottom: 10px;
  1293.     }
  1294. }
  1295.  
  1296. @media only screen and (max-width: 375px) {
  1297.     .mfp-title {
  1298.         padding: 10px 90px 10px 20px;
  1299.     }
  1300.     footer.mainFooter ul.redes-sociais li {
  1301.         margin-right: 4px;
  1302.     }
  1303. }
  1304.  
  1305. @media all and (-ms-high-contrast: none) {
  1306.     html.mm-opened .mm-page #menumobheader {
  1307.         position: relative;
  1308.     }
  1309.     html.mm-opened .mm-page #prewrapper {
  1310.         margin-top: -50px;
  1311.     }
  1312. }
  1313.  
  1314. @media (-ms-high-contrast: active) {
  1315.     html.mm-opened .mm-page #menumobheader {
  1316.         position: relative;
  1317.     }
  1318.     html.mm-opened .mm-page #prewrapper {
  1319.         margin-top: -50px;
  1320.     }
  1321. }
  1322.  
  1323. @media only screen and (max-width: 320px) {
  1324.     div.modal header {
  1325.         font-size: 12px;
  1326.     }
  1327.     div#topBar div.holder form fieldset legend {
  1328.         display: none;
  1329.     }
  1330.     footer.mainFooter div.holderFooter ul {
  1331.         max-width: 270px;
  1332.     }
  1333.     footer.mainFooter address {
  1334.         max-width: 270px;
  1335.     }
  1336.     footer.mainFooter ul.redes-sociais li {
  1337.         margin-right: 2px;
  1338.     }
  1339.     h6.atendimento {
  1340.         max-width: 270px;
  1341.         margin: 0 auto;
  1342.     }
  1343. }
  1344.  
  1345. footer.mainFooter h3 {
  1346.     font-weight: bold;
  1347. }
  1348.  
  1349. /*ajustes rodape*/
  1350. footer{clear:both}
  1351. footer.mainFooter{
  1352.     width: auto;
  1353.     padding-left: calc((100% - 1280px)/2 + 20px);
  1354.     padding-right: calc((100% - 1280px)/2 + 20px);
  1355.     background:none;
  1356.     padding-top:30px
  1357. }
  1358. div.mapa-barra{display:none !important}
  1359.  
  1360. .bxFooter{clear:both;padding-top:35px}
  1361. .bxFooter li{display:inline-block;vertical-align:top;padding-right:20px}
  1362. .bxFooter li:nth-child(1){width:30%}
  1363. .bxFooter li:nth-child(2){width:36%}
  1364. .bxFooter li:nth-child(3){width:33%;padding-right:0}
  1365. .bxFooter li h3{font-size:16px}
  1366. .bxFooter li h3 span{font-size:15px}
  1367. .bxFooter li h3,
  1368. .bxFooter li p{padding:0 0 5px;margin:0;}
  1369. .bxFooter li address{margin-top:0;font-size:13px}
  1370.  
  1371. .bx-fale-conosco{padding-bottom:15px;font-size:15px}
  1372. .bx-fale-conosco h6{margin:0 0 10px}
  1373. .bx-fale-conosco h6 a{font-size:18px;font-weight:700}
  1374. .bx-fale-conosco a{color:#0067bc;text-decoration:none}
  1375. .bx-sac,
  1376. .bx-ouvidoria{display:inline-block;;padding-right:35px;padding-bottom:20px}
  1377.  
  1378. #txtBia{display: block; font-size: 32px;font-family: 'Gilroy';font-weight: 700;letter-spacing: 0.12em;padding-top: 40px;}
  1379.  
  1380. @media only screen and (max-width: 831px){
  1381.     #txtBia{font-size: 20px;padding-top:0a;padding-bottom:10px}
  1382. }
  1383. @media only screen and (max-width: 420px){
  1384.     #txtBia{font-size:16px}
  1385. }
  1386. @media only screen and (max-width: 339px){
  1387.     #txtBia{font-size:14px}
  1388. }
  1389.  
  1390. @media only screen and (max-width: 1270px){
  1391.     footer.mainFooter{padding-left:20px}
  1392. }
  1393.  
  1394. @media only screen and (max-width: 1023px){
  1395.     footer.mainFooter{padding-bottom:0}
  1396. }
  1397.  
  1398. @media only screen and (max-width: 767px){
  1399.     footer.mainFooter ul.redes-sociais li.acompanhe{display:block;float:none;text-align:center;}
  1400.     .bxFooter{padding-top:20px}
  1401.     .bxFooter li{display:block;width:auto !important;padding-bottom:20px;font-size:11px}
  1402.     .bxFooter li:nth-child(2){padding-bottom:30px}
  1403.     .bxFooter li h3{font-size:14px}
  1404.     .bxFooter li h3 span{font-size:13px}
  1405.     .bx-fale-conosco h6 a{font-size:15px}
  1406.     .bx-sac,
  1407.     .bx-ouvidoria{display:block;font-size:12px}
  1408.     .bxFooter li address{font-size:11px}
  1409. }
  1410. @media only screen and (max-width: 767px){
  1411.     footer.mainFooter address{margin:0}
  1412. }
  1413.  
  1414. .gradient-b {
  1415.     /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c32154+0,972e67+100 */
  1416.     background: #c32154; /* Old browsers */
  1417.     /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  1418.     background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2MzMjE1NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NzJlNjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  1419.     background: -moz-linear-gradient(left, #c32154 0%, #972e67 100%); /* FF3.6-15 */
  1420.     background: -webkit-linear-gradient(left, #c32154 0%,#972e67 100%); /* Chrome10-25,Safari5.1-6 */
  1421.     background: linear-gradient(to right, #c32154 0%,#972e67 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  1422. }
  1423.  
  1424. .gradient-c {
  1425. /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c32154+0,972e67+100 */
  1426. background: #c32154; /* Old browsers */
  1427. /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  1428. background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2MzMjE1NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NzJlNjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  1429. background: -moz-linear-gradient(top, #c32154 0%, #972e67 100%); /* FF3.6-15 */
  1430. background: -webkit-linear-gradient(top, #c32154 0%,#972e67 100%); /* Chrome10-25,Safari5.1-6 */
  1431. background: linear-gradient(to bottom, #c32154 0%,#972e67 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  1432. }
  1433.  
  1434. .gradient-h {
  1435.     /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c71d68+0,e21450+100 */
  1436.     background: #c71d68; /* Old browsers */
  1437.     /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  1438.     background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M3MWQ2OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMjE0NTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  1439.     background: -moz-linear-gradient(top, #c71d68 0%, #e21450 100%); /* FF3.6-15 */
  1440.     background: -webkit-linear-gradient(top, #c71d68 0%,#e21450 100%); /* Chrome10-25,Safari5.1-6 */
  1441.     background: linear-gradient(to bottom, #c71d68 0%,#e21450 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  1442. }
  1443.  
  1444.  
  1445. @media only screen and (max-width: 767px) {
  1446.     body{padding-bottom:55px}
  1447. }
  1448.  
  1449.  
  1450. .bia-container {max-width: 1016px; margin: 0 auto; padding: 0 20px;}
  1451. @media only screen and (max-width: 767px) {
  1452.     .bia-container {padding: 0 30px;}
  1453. }
  1454. .bia-header {position: absolute; top: 0; left: 0; right: 0; width: 100% !important; padding: 0 !important;}
  1455. .bia-header__container {display: table; height: 30px; width: 100%; max-width: 1016px; margin: 0 auto; padding: 25px 20px; border-bottom: 1px solid rgba(255,255,255,.5);}
  1456. .bia-header__logo {display: table-cell; vertical-align: middle; width: 140px;}
  1457. .bia-header__nav {display: table-cell; vertical-align: bottom;}
  1458. .bia-header__menu {display: none}
  1459. .bia-header__menu svg {width: 24px; height: 24px;}
  1460. .bia-header__list {list-style: none; text-align: right;}
  1461. .bia-header__list li {display: inline-block; color: #fff}
  1462. .bia-header__list li + li {margin-left: 25px;}
  1463. .bia-header__list li a {display: inline-block; color: inherit; font-family: 'GilroyBold', sans-serif; font-size: 18px;}
  1464. .bia-header__list li a:hover {color: inherit !important;}
  1465. .bia-header__list li.active {color: #d51239;}
  1466. .bia-header__list li a span {
  1467.     display: inline-block; vertical-align: middle;
  1468.     font-size: inherit;
  1469.     margin: 0;
  1470.     color: inherit;
  1471. }
  1472. .bia-header__list li a:hover span {text-decoration: underline;}
  1473. .bia-header__list li a svg {display: inline-block; vertical-align: middle; width: 12px; height: 12px; margin-left: 5px;}
  1474. .bia-header__list li a use {fill: #fff}
  1475.  
  1476. @media only screen and (max-width: 767px) {
  1477.     .bia-header__container {padding: 15px;}
  1478.     .bia-header__nav {text-align: right;}
  1479.     .bia-header__menu {display: inline-block;}
  1480.     .bia-header__list {position: absolute; right: 0; padding: 20px; display: none; background: #030633; z-index: 1;}
  1481.     .bia-header__list.-opened {display: block;}
  1482.     .bia-header__list li,
  1483.     .bia-header__list li a {display: block;}
  1484.     .bia-header__list li + li {margin-left: 0;}
  1485.     .bia-header__list li a span {font-size: 12px;}
  1486.     .bia-header__list li a svg {transform: rotate(90deg);}
  1487. }
  1488.  
  1489. .bia-head {min-height: 402px; padding-top: 110px;}
  1490.  
  1491. .bia-head--home {min-height: 720px; background: url(../media/images/bg-home.jpg) 50% 0% no-repeat; margin-bottom: -30px;}
  1492. .bia-head--para-voce {background: url(../media/images/bg-para-voce.png) 50% 0% no-repeat;background-size:cover}
  1493. .bia-head--para-sua-empresa {background: url(../media/images/bg-para-voce.png) 50% 0% no-repeat;background-size:cover}
  1494. .bia-head--apps {min-height: 616px; background: url(../media/images/bg-apps.jpg) 50% 100% #000 no-repeat;background-size:cover}
  1495. .pg-apps-whatsapp .bia-head--apps{background-image: url(../media/images/bg-apps-wa.jpg)}
  1496.  
  1497. .bia-head--home .bia-container {padding: 0}
  1498.  
  1499. @media only screen and (max-width: 1279px) {
  1500.     .bia-head--home .bia-container {padding: 0 20px;}
  1501.     .bia-head--para-voce,
  1502.     .bia-head--para-sua-empresa {background-size:auto}
  1503. }
  1504. @media only screen and (max-width: 1024px) {
  1505.  
  1506. }
  1507. @media only screen and (max-width: 767px) {
  1508.     .bia-head {
  1509.         min-height: 414px;
  1510.         padding-top: 60px;
  1511.     }
  1512.  
  1513.     .bia-head--home {min-height: 590px; background: url(../media/images/bg-home--mobile.jpg) 50% 50% no-repeat; background-size: cover; margin-bottom: 0;}
  1514.     .bia-head--para-voce {background: url(../media/images/bg-para-voce--mobile.png) 50% 0% no-repeat; background-size: cover;}
  1515.     .bia-head--para-sua-empresa {background: url(../media/images/bg-para-voce--mobile.png) 50% 0% no-repeat; background-size: cover;}
  1516.     .bia-head--apps {background: url(../media/images/bg-apps--mobile.jpg) 50% 50% #000 no-repeat; padding-bottom: 36px; background-size: cover;}
  1517.     .pg-apps-whatsapp .bia-head--apps{background-image: url(../media/images/bg-apps--mobile-wa.jpg)}
  1518.  
  1519. }
  1520.  
  1521. @media only screen and (min-width: 1281px) {
  1522.     .bia-head--para-voce,
  1523.     .bia-head--para-sua-empresa{background-position: 50% -10%;min-height: 502px}
  1524. }
  1525.  
  1526. @media only screen and (max-width: 767px) and (min-width: 490px){
  1527.     .bia-head--para-voce,
  1528.     .bia-head--para-sua-empresa{background: url(../media/images/bg-para-voce--medio.png) 50% 0% no-repeat;}
  1529. }
  1530.  
  1531.  
  1532. @media only screen and (min-width: 1660px) {
  1533.     .bia-head--para-voce,
  1534.     .bia-head--para-sua-empresa{min-height: 600px}
  1535. }
  1536.  
  1537. .bia-foot {
  1538.     padding: 26px 20px;
  1539. }
  1540.  
  1541. .bia-foot figure {text-align: center;}
  1542. .bia-foot figure img {display: block; max-width: 100%; margin: 0 auto;}
  1543.  
  1544. .bia-toolbar {display: table; width: 100%; min-height: 55px;}
  1545. .bia-toolbar__back {display: table-cell; vertical-align: middle; color: #d51239;}
  1546. .bia-toolbar__back a {display: inline-block;  text-decoration: none; font-size: 16px; font-family: 'GilroyBold', sans-serif; line-height: 16px;}
  1547. .bia-toolbar__back a:hover {color: #d51239 !important;}
  1548. .bia-toolbar__back a:hover span {text-decoration: underline;}
  1549. .bia-toolbar__back a span {display: inline-block; vertical-align: middle;}
  1550. .bia-toolbar__back a svg {display: inline-block; vertical-align: middle; width: 18px; height: 18px; margin-right: 5px;}
  1551. .bia-toolbar__back a use {fill: #d51239;}
  1552. .bia-toolbar__action {position: fixed; right: calc((100% - 1280px)/2); color: #fff; z-index: 2}
  1553. .pg-apps .bia-toolbar__action{top: auto !important}
  1554. .bia-toolbar__action a {display: inline-block; padding: 18px 28px; font-size: 16px; font-family: 'GilroyBlack', sans-serif; background: #db002a;  text-decoration: none; text-transform: uppercase; box-shadow: 0 8px 46px rgba(0,0,0,.6);}
  1555. .bia-toolbar__action a:hover {background: #fff; color: #db002a !important;}
  1556.  
  1557. @media only screen and (max-width: 1279px) {
  1558.     .bia-toolbar__action {
  1559.         right: calc((100% - 1024px)/2);
  1560.         margin-right:-20px;
  1561.     }
  1562. }
  1563. @media only screen and (max-width: 1065px) and (min-width: 768px) {
  1564.     .bia-toolbar__action {
  1565.         top: 260px;
  1566.         margin-right: 30px;
  1567.     }
  1568. }
  1569.  
  1570. @media only screen and (max-width: 968px) and (min-width: 768px){
  1571.     .bia-toolbar__action {
  1572.         top: 340px;
  1573.         right: calc((100% - 816px)/2);
  1574.     }
  1575.  
  1576. }
  1577.  
  1578.  
  1579. @media only screen and (max-width: 767px) {
  1580.     .bia-toolbar {margin-left: -10px; margin-right: -10px;}
  1581.     .bia-toolbar__action {left: calc((100% - 640px)/2);right: calc((100% - 640px)/2);bottom: 0;}
  1582.     .bia-toolbar__action a {display: block; text-align: center;}
  1583. }
  1584.  
  1585. .bia-heading {position: relative;}
  1586. .bia-heading__hero {max-width: 855px; margin: 0; padding: 10px 0 0; font-size: 36px; font-family: 'Gilroy', sans-serif; font-weight: normal;}
  1587. .bia-heading__hero span {display: inline-block;}
  1588. .bia-heading__hero strong {font-family: 'GilroyBlack', sans-serif; font-weight: normal;}
  1589. .bia-head--home .bia-heading__hero strong {font-family: 'GilroyBold', sans-serif;}
  1590. .bia-heading__hero em {font-family: 'GilroyBold', sans-serif; font-style: normal; color: #cd0047;}
  1591. .bia-heading__app {max-width: 280px; text-align: center; margin: 0 auto; padding-top: 140px;}
  1592. .bia-heading__app figure {position: absolute; top: 10px; left: 0; right: 0; text-align: center;}
  1593. .bia-heading__app figure img {display: block; width: 100%; max-width: 82px; margin: 0 auto}
  1594. .bia-heading__app figcaption {
  1595.     padding: 18px 0;
  1596.     font-size: 24px;
  1597.     font-family: 'GilroySemiBold', sans-serif;
  1598. }
  1599. .bia-heading__app p {
  1600.     font-size: 18px;
  1601.     text-align: left;
  1602. }
  1603. .bia-heading__app p strong {
  1604.     font-family: 'GilroyBold', sans-serif;
  1605. }
  1606. .bia-heading__app--whatsapp {max-width: 390px;}
  1607. .bia-heading__app--whatsapp p {font-size: 16px;}
  1608. .bia-heading__app--whatsapp p a {display: inline-block; color: #29d247; text-decoration: none;}
  1609. .bia-heading__app--whatsapp p a:hover {color: #29d247 !important; text-decoration: underline;}
  1610. .bia-heading__action {
  1611.     display: inline-table;
  1612.     font-size: 16px;
  1613.     line-height: 40px;
  1614.     text-decoration: none;
  1615.     padding: 0 28px;
  1616.     border-radius: 20px;
  1617.     margin-top: 20px;
  1618. }
  1619. .bia-heading__action:hover {
  1620.     background: #fff;
  1621.     color: #000 !important;
  1622. }
  1623. .bia-heading__arrow {display: block; max-width: 64px; margin: 0 auto; padding: 20px;}
  1624. .bia-heading__arrow svg {width: 24px; height: 24px; transform: rotate(90deg);}
  1625. .bia-heading__arrow use {fill: #fff;}
  1626.  
  1627. .bia-head--home .bia-heading__hero {margin-top: -15px}
  1628.  
  1629.  
  1630. #txtAlertWApp{text-align:left;max-width:420px;}
  1631. #txtAlertWApp::before{content:'';display:inline-block;width:26px;height:26px;background: url(../media/images/ico-alert-wapp.png) 0 0 no-repeat;vertical-align: middle;margin: 0 5px 0 0;}
  1632.  
  1633. @media only screen and (max-width: 767px) {
  1634.     .bia-heading__hero {font-size: 40px; text-align: center;}
  1635.     .bia-head--home .bia-heading__hero {font-size: 30px; padding-top: 0;}
  1636.     .bia-heading__app {padding-top: 50px;}
  1637.     .bia-heading__app figure {position: static; margin-bottom: 30px;}
  1638.     .bia-heading__app p {text-align: center;}
  1639.     .bia-heading__arrow {margin-top: 20px;}
  1640.     #txtAlertWApp{white-space: nowrap;padding:0 35px 0 10px}
  1641.     #txtAlertWApp::before{vertical-align: top}
  1642.     #txtAlertWApp span{display:inline-block;white-space: normal;}
  1643. }
  1644. @media only screen and (max-width: 389px) {
  1645.     .bia-head--home .bia-heading__hero {font-size: 25px;}
  1646. }
  1647.  
  1648. .bia-apps {position: relative;}
  1649. .bia-apps__content {width: 100%; max-width: 810px; margin: 0 auto;}
  1650. .bia-apps__content h3 {max-width: 680px; font-size: 32px; font-family: 'GilroyBlack', sans-serif; font-weight: normal; color: #cd0047;}
  1651. .bia-apps__content h3 span {display: inline-block;}
  1652. .bia-apps__content p { font-size: 18px; font-family: 'GilroyMedium', sans-serif;}
  1653. .bia-apps__figure {position: absolute; top: 0; left: 63px; width: 586px; height: 459px;}
  1654. .bia-apps__figure span {position: absolute; top: 0; left: 0; right: 0;}
  1655.  
  1656. @media only screen and (max-width: 1023px) {
  1657.     .bia-apps {overflow: hidden;}
  1658.     .bia-apps__content {float: none; margin: 0 auto; padding: 30px 0;}
  1659.     .bia-apps__content h3 {font-size: 28px;}
  1660.     .bia-apps__content p {max-width: 360px; font-size: 17px;}
  1661.     .bia-apps__figure {position: relative; left: 50%; transform: translate3d(-48.5%,0,0) !important; overflow: visible;}
  1662.     .bia-apps__figure span.bia-apps__line {left: 50%; transform: translateX(-48.5%);}
  1663. }
  1664.  
  1665. .nowrap{white-space:nowrap}
  1666. .bia-segments {padding: 10px 0 20px; text-align: center; background: url(../media/images/bg-segments.png) 50% 50% no-repeat;}
  1667. .bia-segments__card {position: relative; display: inline-block; margin: 0 10px; width: 100%; max-width: 394px;vertical-align:top; }
  1668. .bia-segments__card:before {content:''; display: block; width: 100%; padding-top: 75%;}
  1669. .bia-segments__card--para-voce:before {background: url(../media/images/card-para-voce.png) 50% 0% no-repeat; background-size: cover;}
  1670. .bia-segments__card--para-sua-empresa:before {background: url(../media/images/card-para-sua-empresa.png) 50% 0% no-repeat; background-size: cover;}
  1671. .bia-segments__card img {display: block; width: 100%;}
  1672. .bia-segments__card figcaption {position:relative; text-align: left; margin: 0 auto; padding: 20px 10px; margin-top: -80px;}
  1673. .bia-segments__card figcaption h3 {font-size: 32px; font-family: 'GilroyBlack', sans-serif; font-weight: normal; color: #cd0047;}
  1674. .bia-segments__card figcaption p {font-size: 16px; max-width: 320px;margin:16px 0}
  1675. .bia-segments__card figcaption a {
  1676.     display: inline-table;
  1677.     font-size: 16px;
  1678.     line-height: 40px;
  1679.     text-decoration: none;
  1680.     padding: 0 28px;
  1681.     border-radius: 20px;
  1682. }
  1683.  
  1684. .bia-segments__card figcaption a:hover {
  1685.     background: #fff;
  1686.     color: #030633 !important;
  1687. }
  1688.  
  1689. @media only screen and (max-width: 767px) {
  1690.     .bia-segments {padding: 0; background: none;}
  1691.     .bia-segments__card {display: block; max-width: none; margin: 0 auto;}
  1692.     .bia-segments__card--para-voce:before {padding-top: 52%;}
  1693.     .bia-segments__card--para-voce:before {background: url(../media/images/card-para-voce--mobile.png) 50% 0% no-repeat; background-size: cover;}
  1694.     .bia-segments__card--para-sua-empresa:before {background: url(../media/images/card-para-sua-empresa--mobile.png) 50% 0% no-repeat; background-size: cover;}
  1695.     .bia-segments__card figcaption {padding: 20px 30px 40px;}
  1696. }
  1697.  
  1698. .bia-person {overflow: hidden;}
  1699. .bia-person__heading {padding: 70px 20px 0; text-align: center;}
  1700. .bia-person__heading h2 {font-size: 40px; font-family: 'GilroyBlack', sans-serif; font-weight: normal;}
  1701. .bia-person__heading p {font-size: 18px;  font-family: 'Gilroy', sans-serif; max-width: 410px; margin: 20px auto 0;}
  1702. .bia-person__heading a {display: block; max-width: 64px; margin: 35px auto 0; padding: 20px;}
  1703. .bia-person__heading a svg {width: 24px; height: 24px; transform: rotate(90deg);}
  1704. .bia-person__heading a use {fill: #fff;}
  1705.  
  1706. .bia-person__swiper {padding: 0 30px 110px;}
  1707. .bia-person__swiper h3 {margin: 0; font-size: 32px; font-family: 'GilroyBlack', sans-serif; font-weight: normal; text-align: center; padding: 40px 0 90px; color: #cd0047}
  1708. .bia-person__swiper h3 span {display: inline-block;}
  1709. .bia-person__swiper .swiper-container {max-width: 645px; margin: 0 auto; overflow: visible;}
  1710. .bia-person__swiper .swiper-slide {width: 195px; border-radius: 3px; padding: 64px 30px 56px; margin-right: 30px;}
  1711. .bia-person__swiper .swiper-slide:last-child {margin-right: 0;}
  1712. .bia-person__swiper .swiper-pagination {position: static; display: none;}
  1713. .bia-person__swiper .swiper-slide figure {text-align: center;}
  1714. .bia-person__swiper .swiper-slide figcaption {
  1715.     min-height: 110px;
  1716.     padding: 26px 0;
  1717.     font-size: 24px;
  1718.     font-family: 'GilroySemiBold', sans-serif;
  1719. }
  1720. .bia-person__swiper .swiper-slide a {
  1721.     display: block;
  1722.     border-radius: 20px;
  1723.     font-size: 16px;
  1724.     line-height: 40px;
  1725.     font-family: 'GilroySemiBold', sans-serif;
  1726.     text-decoration: none;
  1727.     text-align: center;
  1728.     border: 1px solid #fff;
  1729. }
  1730.  
  1731. .bia-person__swiper .swiper-slide a:hover {
  1732.     background: #fff;
  1733.     color: #a12c63 !important;
  1734. }
  1735.  
  1736. @media only screen and (max-width: 767px) {
  1737.     .bia-person__heading {padding: 45px 30px 0;}
  1738.     .bia-person__heading p {font-size: 16px;}
  1739. }
  1740.  
  1741. .bia-net {}
  1742. .bia-net__head {padding-top: 75px; padding-bottom: 35px; text-align: center;}
  1743. .bia-net__head figure img {display: block; width: 100%; max-width: 82px; margin: 0 auto}
  1744. .bia-net__head figcaption {padding: 18px 0; font-size: 24px; font-family: 'GilroySemiBold', sans-serif}
  1745. .bia-net__head p {max-width: 595px; margin: 12px auto 0; font-size: 18px;}
  1746. .bia-net__head .bia-net__action {display: none; margin: 12px auto;}
  1747. .bia-net__article {position: relative; max-width: 850px; padding: 0 332px 55px 25px; margin: 0 auto; text-align: center;}
  1748. .bia-net__article ul {padding-bottom: 35px;}
  1749. .bia-net__article li {position: relative; display: table; min-height: 82px; padding-left: 130px; text-align: left;}
  1750. .bia-net__article li svg {width: 82px; height: 82px; position: absolute; left: 0; top: 0;}
  1751. .bia-net__article li p {display: table-cell; vertical-align: middle; font-size: 18px;}
  1752. .bia-net__action {
  1753.     display: inline-table;
  1754.     font-size: 16px;
  1755.     line-height: 40px;
  1756.     text-decoration: none;
  1757.     padding: 0 28px;
  1758.     border-radius: 20px;
  1759.     background: #fff;
  1760.     color: #c22154 !important;
  1761.     text-transform: uppercase;
  1762.     font-family: 'GilroyBold', sans-serif
  1763. }
  1764. .bia-net__article figure {position: absolute; right: 0; bottom: 0; text-align: center;}
  1765.  
  1766. @media only screen and (max-width: 767px) {
  1767.     .bia-net__head p {font-size: 16px;}
  1768.     .bia-net__head .bia-net__action {display: inline-table; margin-top: ;}
  1769.     .bia-net__article {padding: 0 20px;}
  1770.     .bia-net__article li {padding: 15px 0 15px 100px;}
  1771.     .bia-net__article li p {font-size: 16px;}
  1772.     .bia-net__article figure {position: static;}
  1773.     .bia-net__article .bia-net__action {display: none;}
  1774.  
  1775. }
  1776.  
  1777. .bia-how {margin-bottom: 44px; padding: 5px 0;}
  1778. .bia-how .bia-container {display: table; width: 100%;}
  1779. .bia-how__heading {display: table-cell; width: 60%; vertical-align: middle; text-align: center;}
  1780. .bia-how__heading h2 {font-size: 32px; font-family: 'GilroyBlack', sans-serif; font-weight: normal;}
  1781. .bia-how__heading h2 span {display: block;}
  1782. .bia-how__heading p {font-size: 18px; max-width: 310px; margin: 30px auto 0;}
  1783. .bia-how__figure {display: table-cell; width: 40%; vertical-align: middle;}
  1784. .bia-how__figure img {position: relative;}
  1785. .bia-how__figure .phone-frame {position: relative; width: 216px; height: 426px; padding: 5% 3.5% 2.5%;}
  1786. .bia-how__figure .phone-frame:before {content:''; position: absolute; top: 2.5%; bottom: 2.5%; left: 3%; right: 3%; background: #f7f7f7; border-radius: 20px;}
  1787. .bia-how__figure .phone-frame:after {content:''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: url(../media/images/smartphone-frame.png) 0 0 no-repeat; background-size: cover;}
  1788. .bia-how__figure .phone-frame img {width: 100%;}
  1789. .bia-how__figure .phone-frame--googleassistente:before {background: #fff;}
  1790. .bia-how .swiper-pagination {display: none;}
  1791. .bia-how .swiper-pagination-bullet {background: rgba(255,255,255,.2); border: 1px solid #db002a; opacity: 1;}
  1792. .bia-how .swiper-pagination-bullet-active {background: #db002a;}
  1793. .bia-how .swiper-button-prev, .swiper-button-next {
  1794.     width: 38px;
  1795.     height: 38px;
  1796.     background-size: contain;
  1797. }
  1798.  
  1799. .bia-how .swiper-button-next,
  1800. .bia-how .swiper-container-rtl .swiper-button-prev {
  1801.   background-image: url(../media/images/arrow-left-white.png);
  1802.   left: calc((100% - 1016px)/2 + 20px);
  1803.   right: auto;
  1804. }
  1805. .bia-how .swiper-button-prev,
  1806. .bia-how .swiper-container-rtl .swiper-button-next {
  1807.   background-image: url(../media/images/arrow-right-white.png);
  1808.   right: calc((100% - 1016px)/2 + 20px);
  1809.   left: auto;
  1810. }
  1811.  
  1812. .modal-bia,
  1813. .modal-app {
  1814.     position: fixed;
  1815.     width: 100%;
  1816.     height: 100%;
  1817.     background-color: rgba(0, 0, 0, 0.7);
  1818.     top: 0;
  1819.     left: 0;
  1820.     z-index: 9999;
  1821.     display: none;
  1822. /*    opacity: 0;
  1823.     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1824.     filter: alpha(opacity=0);*/
  1825. }
  1826.  
  1827. .container-modal {
  1828.     height: 261px;
  1829.     width: 63.0307467057101%;
  1830.     position: absolute;
  1831.     top: 50%;
  1832.     left: 50%;
  1833.     -webkit-transform: translate(-50%, -50%);
  1834.     -moz-transform: translate(-50%, -50%);
  1835.     -o-transform: translate(-50%, -50%);
  1836.     -ms-transform: translate(-50%, -50%);
  1837.     transform: translate(-50%, -50%);
  1838.     display: block;
  1839.     max-width: 861px;
  1840. }
  1841.  
  1842. .container-modal .table {
  1843.     display: table;
  1844.     width: 100%;
  1845. }
  1846.  
  1847. .container-modal .close {
  1848.     width: 100%;
  1849.     height: 35px;
  1850.     display: table-caption;
  1851.     cursor: pointer;
  1852. }
  1853.  
  1854. .container-modal .close .icon {
  1855.     width: 25px;
  1856.     height: 25px;
  1857.     float: right
  1858. }
  1859.  
  1860. .container-modal .text {
  1861.     width: 100%;
  1862.     height: 219px;
  1863.     background-color: #fff;
  1864.     text-align: center;
  1865.     text-transform: uppercase;
  1866.     font-size: 24px;
  1867.     display: table-cell;
  1868.     color: #545454;
  1869.     vertical-align: middle;
  1870. }
  1871.  
  1872. .container-modal .text p {
  1873.     -webkit-margin-after: 0;
  1874.     -webkit-margin-before: 0
  1875. }
  1876.  
  1877. .container-modal .text p span {
  1878.     display: inline-block;
  1879. }
  1880.  
  1881. .container-modal .text .line-two {
  1882.     margin-top: 42px;
  1883.     line-height: 1.4;
  1884. }
  1885.  
  1886. .container-modal .text .line-two span.highlight {
  1887.     color: #da3637
  1888. }
  1889.  
  1890. .modal-app .container-modal .text a {
  1891.     display: inline-block;
  1892.     width: 100%;
  1893.     max-width: 320px;
  1894.     padding: 10px 20px;
  1895. }
  1896.  
  1897. .modal-app .container-modal .text a img {
  1898.     display: block;
  1899.     max-width: 100%;
  1900. }
  1901.  
  1902. @media only screen and (max-width: 639px) {
  1903.     .container-modal .text{height:auto;font-size: 18px; padding: 20px 10px;}
  1904. }
  1905.  
  1906. @media only screen and (max-width: 1023px) {
  1907.     .bia-how .swiper-button-next,
  1908.     .bia-how .swiper-container-rtl .swiper-button-prev {
  1909.       left: calc((100% - 768px)/2 + 20px);
  1910.     }
  1911.     .bia-how .swiper-button-prev,
  1912.     .bia-how .swiper-container-rtl .swiper-button-next {
  1913.       right: calc((100% - 768px)/2 + 20px);
  1914.     }
  1915. }
  1916.  
  1917. @media only screen and (max-width: 767px) {
  1918.     .bia-how {position: relative; padding: 0;}
  1919.     .bia-how .bia-container {min-height: 560px; padding-top: 35px; padding-bottom: 366px;}
  1920.     .bia-how__heading {width: auto;}
  1921.     .bia-how__heading p {font-size: 16px; line-height: 24px;}
  1922.     .bia-how__figure {position: absolute; left: 0; right: 0; bottom: 0; height: 340px; display: block; width: auto; text-align: center; overflow: hidden;}
  1923.     .bia-how__figure .phone-frame {width: 271px; margin: 0 auto;}
  1924.     .bia-how__figure img {margin: 0 auto;}
  1925.     .bia-how .swiper-pagination {display: block;}
  1926.  
  1927.     .bia-how .bia-container--logado {padding-bottom: 299px;}
  1928.     .bia-how .bia-container--naologado .bia-how__figure,
  1929.     .bia-how .bia-container--logado .bia-how__figure {height: auto}
  1930.  
  1931.     .bia-how .swiper-button-next,
  1932.     .bia-how .swiper-container-rtl .swiper-button-prev {
  1933.       left: 10px;
  1934.     }
  1935.     .bia-how .swiper-button-prev,
  1936.     .bia-how .swiper-container-rtl .swiper-button-next {
  1937.       right: 10px;
  1938.     }
  1939. }
  1940.  
  1941. /**
  1942.  * For modern browsers
  1943.  * 1. The space content is one way to avoid an Opera bug when the
  1944.  *    contenteditable attribute is included anywhere else in the document.
  1945.  *    Otherwise it causes space to appear at the top and bottom of elements
  1946.  *    that are clearfixed.
  1947.  * 2. The use of `table` rather than `block` is only necessary if using
  1948.  *    `:before` to contain the top-margins of child elements.
  1949.  */
  1950.  .cf:before,
  1951.  .cf:after {
  1952.      content: " "; /* 1 */
  1953.      display: table; /* 2 */
  1954.  }
  1955.  
  1956.  .cf:after {
  1957.      clear: both;
  1958.  }
  1959.  
  1960.  /**
  1961.   * For IE 6/7 only
  1962.   * Include this rule to trigger hasLayout and contain floats.
  1963.   */
  1964.  .cf {
  1965.      *zoom: 1;
  1966.  }
  1967.  
  1968. @media only screen and (min-width: 768px) {
  1969.     .mobile-only {display: none;}
  1970. }
  1971.  
  1972. @media only screen and (max-width: 767px) {
  1973.     .desktop-only {display: none;}
  1974. }
  1975. .vhidden{visibility:hidden}
  1976.  
  1977. @media only screen and (max-width: 1023px) {
  1978.     footer.mainFooter {
  1979.         padding-bottom: 60px !important;
  1980.     }
  1981. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!