.grid-pag       {display: grid; gap: 2%; grid-template-columns: 73% 25%}
@media (max-width: 991px) { .grid-pag { grid-template-columns: 1fr; } .grid-min { display: none; } }
.grid-left      {display: grid; gap: 2%; grid-template-columns: 25% 73%}
.grid-right     {display: grid; gap: 2%; grid-template-columns: 73% 25%}
@media (max-width: 991px) {.grid-left,.grid-right {grid-template-columns: 100%} }
.grid2-row      {display: flex; gap: 20px; justify-content: space-between;}
.grid2          {flex: 1; display: flex; flex-direction: column;}
.grid2-border   {display: flex; flex-direction: column; flex-grow: 1;}
@media (max-width: 779px) {.grid2-row {flex-direction: column;}.grid2 {flex: unset;}}
.grid-auto-150  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.grid-auto-200  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.grid-auto-250  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.grid-auto-300  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.grid-auto-350  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); }
.grid-auto-400  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }
.grid-auto-420  { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }
.grid-single-column { display: grid; gap: 20px; grid-template-columns: 1fr; }
.col-2 {display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr); align-items: stretch}
@media (max-width: 767px) {.col-2 {grid-template-columns: 1fr} }
.col-3 {display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); align-items: stretch}
@media (max-width: 991px) {.col-3 {grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 575px) {.col-3 {grid-template-columns: 1fr} }
.col-4 {display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); align-items: stretch}
@media (max-width: 1199px){.col-4 {grid-template-columns: repeat(3, 1fr)} }
@media (max-width: 767px) {.col-4 {grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 575px) {.col-4 {grid-template-columns: 1fr} }
.col-5 {display: grid; gap: 20px; grid-template-columns: repeat(5, 1fr); align-items: stretch}
@media (max-width: 1199px){.col-5 {grid-template-columns: repeat(4, 1fr)} }
@media (max-width: 991px) {.col-5 {grid-template-columns: repeat(3, 1fr)} }
@media (max-width: 767px) {.col-5 {grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 575px) {.col-5 {grid-template-columns: 1fr} }
.col-6 {display: grid; gap: 20px; grid-template-columns: repeat(6, 1fr); align-items: stretch}
@media (max-width: 1399px){.col-6 {grid-template-columns: repeat(5, 1fr)} }
@media (max-width: 1199px){.col-6 {grid-template-columns: repeat(4, 1fr)} }
@media (max-width: 991px) {.col-6 {grid-template-columns: repeat(3, 1fr)} }
@media (max-width: 767px) {.col-6 {grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 575px) {.col-6 {grid-template-columns: 1fr} }

/*.col-2-4-1-emin   {width:23.5%; float:left; margin-right:2%; margin-bottom:2%}
.col-2-4-3-dmax   {width:74.5%; float:right;}
.col-2-4-3-dmax:last-child {margin-right: 0;}
@media screen and (max-width:991px){.col-2-4-1-emin{width:100%;}.col-2-4-3-dmax{width:100%;}}

.col-2-4-3-emax   {width: 73%; float: left; margin-right: 2%; margin-bottom: 5px;}
.col-2-4-1-dmin   {width: 25%; float: right;}
.col-2-4-1-dmin:last-child {margin-right: 0;}
@media screen and (max-width:1300px) {.col-2-4-3-emax {width: 70%;}.col-2-4-1-dmin {width:28%;}}
@media screen and (max-width:1200px) {.col-2-4-3-emax {width: 65%;}.col-2-4-1-dmin {width:33%;}}
@media screen and (max-width: 979px) {.col-2-4-3-emax {width:100%;}.col-2-4-1-dmin {width:100%}}*/

.flex-y         { display: flex; align-items: center; } /* Alinha verticalmente */
.flex-x         { display: flex; justify-content: center; } /* Alinha horizontalmente */
.flex-xy        { display: flex; align-items: center; justify-content: center; } /* Centraliza total */
.flex-start     { display: flex; justify-content: flex-start; } /* Alinha à esquerda */
.justify-end    { display: flex; justify-content: flex-end; } /* Alinha à direita */
.items-start    { display: flex; align-items: flex-start; } /* Alinha em cima */
.items-end      { display: flex; align-items: flex-end; } /* Alinha embaixo */
.flex-between   { display: flex; justify-content: space-between; } /* Espaço uniforme */
.flex-col       { display: flex; flex-direction: column; } /* Coluna */
.flex-col-center{ display: flex; flex-direction: column; align-items: center; justify-content: center; } /* Coluna centralizada */
.flex-inline    { display: inline-flex; } /* Flex inline */

.align          {display: flex; align-items: center; justify-content: center}
.aligny         {display: flex; align-items: center}
.alignx         {display: flex; justify-content: center}
.alignBox       {width:100%; height:60px; display: flex; align-items: center; justify-content: center}
.alignBox div   {width: 100px; height: 100px}
input[type="text"] {background-color:var(--typetexbkg); color:var(--typetexfont); border: 1px solid var(--typetexbor); font: 400 16px/18px "Lato"; padding: 7px; border-radius: 5px; outline: none;}

.box            {background:var(--boxbkg); border:1px solid var(--boxbor); width:100%; margin:0 auto; padding:20px; border-radius:20px; text-align: left; overflow:hidden}
@media screen and (max-width: 600px) {.box {border:0px; padding:0px; border-radius: 0}}
.border         {background:var(--borderbkg); border:1px dotted var(--border); padding:20px; border-radius: 15px; overflow: hidden}
@media screen and (max-width: 600px) {.border {border:0px; padding:0px; border-radius:0px;}}
.box-pag        {background:var(--boxbkg); border:1px solid var(--boxbor); width:100%; margin:0 auto; padding:25px; border-radius:30px; text-align: left; overflow:hidden; box-shadow:-1px -1px 20px 11px rgba(0,0,0, 0.0)}
@media screen and (max-width: 600px) {.box {border:0px; padding:0px; border-radius: 0; box-shadow: 0}}

.line           {background: linear-gradient(to right, transparent 10%, var(--line) 50%, transparent 90%); height:2px}
.linepad        {background: linear-gradient(to right, transparent 10%, var(--linepad) 50%, transparent 90%); height:3px; margin:20px auto}

hr              {margin:10px 0; border: 1px dotted var(--hrd)!important}
.hr             {margin:10px 0; border: 1px dotted var(--hrc)}
.display-table  {display:table}
.display-cell   {display:table-cell; vertical-align:middle;}
.transition     {transition: background-color 0.5s ease}
.upper          {text-transform: uppercase;}
.fright         {float:right;}
.fleft          {float:left;}
.left           {text-align:left;} 
.right          {text-align:right;}
.center         {text-align:center;} 
.bloco-center   {display: block; margin-left: auto; margin-right: auto;}
.label          {display: inline; background-color: #0aa4ae; margin-left:5px; padding:5px 10px 5px; font-size:65%; font-weight:600; line-height: 1; color: #fff; letter-spacing:0.03em; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em;}
.crd            {cursor:default!important}
.crp            {cursor: pointer}
.btf            {width:100%}

.fadeInLeft     {animation-name: fadeInLeft}
.fadeInRight    {animation-name: fadeInRight}
.fadeInDow      {animation-name: fadeInDow}
.fadeInUp       {animation-name: fadeInUp}
.animated       {animation-duration: 1s; animation-fill-mode: both}

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear:both;}
.clearfix       {*zoom:1;}
.clear          {clear:both;}

.copyLinkButton {display: flex; align-items: center; gap: 5px; padding: 6px 12px; border: none; background: linear-gradient(45deg, #F56040, #E4405F); color: white; border-radius: 5px; cursor: pointer; transition: transform 0.3s ease;}
.copyLinkButton:hover {transform: translateY(-5px);}
.copyLinkButton img {width:20px; height:20px}
.copyMessage    {display:none; margin-left:10px; color:green}

/* borda para  aside */
.asidebox       {background:var(--asidebox); padding:10px; border-radius:15px; border: solid 1px var(--asiboxborder); box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15); transition: 0.5s}
.aside .bkg     {background:var(--blobkg); padding: 15px; border-radius: 5px} 
.block-center   {display: block; margin-left: auto; margin-right: auto;}

/* gap de 2 a 20px */
.gap-2{gap:2px}.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-14{gap:14px}.gap-16{gap:16px}.gap-18{gap:18px}.gap-20{gap:20px}

/* min-height de 10/10 até 500 */
.mh10   { min-height: 10px; } 
.mh20   { min-height: 20px; } 
.mh30   { min-height: 30px; } 
.mh40   { min-height: 40px; } 
.mh50   { min-height: 50px; } 
.mh60   { min-height: 60px; } 
.mh70   { min-height: 70px; } 
.mh80   { min-height: 80px; } 
.mh90   { min-height: 90px; } 
.mh100  { min-height: 100px; } 
.mh110  { min-height: 110px; } 
.mh120  { min-height: 120px; } 
.mh130  { min-height: 130px; } 
.mh140  { min-height: 140px; } 
.mh150  { min-height: 150px; } 
.mh160  { min-height: 160px; } 
.mh170  { min-height: 170px; } 
.mh180  { min-height: 180px; } 
.mh190  { min-height: 190px; } 
.mh200  { min-height: 200px; } 
.mh210  { min-height: 210px; } 
.mh220  { min-height: 220px; } 
.mh230  { min-height: 230px; } 
.mh240  { min-height: 240px; } 
.mh250  { min-height: 250px; } 
.mh260  { min-height: 260px; } 
.mh270  { min-height: 270px; } 
.mh280  { min-height: 280px; } 
.mh290  { min-height: 290px; } 
.mh300  { min-height: 300px; } 
.mh310  { min-height: 310px; } 
.mh320  { min-height: 320px; } 
.mh330  { min-height: 330px; } 
.mh340  { min-height: 340px; } 
.mh350  { min-height: 350px; } 
.mh360  { min-height: 360px; } 
.mh370  { min-height: 370px; } 
.mh380  { min-height: 380px; } 
.mh390  { min-height: 390px; } 
.mh400  { min-height: 400px; } 
.mh410  { min-height: 410px; } 
.mh420  { min-height: 420px; } 
.mh430  { min-height: 430px; } 
.mh440  { min-height: 440px; } 
.mh450  { min-height: 450px; } 
.mh460  { min-height: 460px; } 
.mh470  { min-height: 470px; } 
.mh480  { min-height: 480px; } 
.mh490  { min-height: 490px; } 
.mh500  { min-height: 500px; }
@media screen and (max-width: 769px) {.mh50,.mh60,.mh70,.mh80,.mh90,.mh110,.mh120,.mh130,.mh140,.mh150,.mh160,.mh170,.mh180,.mh190,.mh200,.mh200,.mh210,.mh220,.mh230,.mh240,.mh250,.mh260,.mh270,.mh280,.mh290,.mh300,.mh310,.mh320,.mh330,.mh340,.mh350,.mh360,.mh370,.mh380,.mh390,.mh400,.mh410,.mh420,.mh430,.mh440,.mh450,.mh460,.mh470,.mh480,.mh490,.mh500 {min-height:10px}}

/* MARGIN HEIIGHT */
.mgh1   { height: 1px; }
.mgh2   { height: 2px; }
.mgh3   { height: 3px; }
.mgh4   { height: 4px; }
.mgh5   { height: 5px; }
.mgh10  { height: 10px; }
.mgh20  { height: 20px; }
.mgh30  { height: 30px; }
.mgh40  { height: 40px; }
.mgh50  { height: 50px; }
.mgh60  { height: 60px; }
.mgh70  { height: 70px; }
.mgh80  { height: 80px; }
.mgh90  { height: 90px; }
.mgh100 { height: 100px; }
.mgh150 { height: 150px; }
.mgh200 { height: 200px; }
.mgh250 { height: 250px; }
.mgh300 { height: 300px; }

/* MARGIN E PADDING */
.mt1    { margin-top: 1px; }
.mt2    { margin-top: 2px; }
.mt3    { margin-top: 3px; }
.mt4    { margin-top: 4px; }
.mt5    { margin-top: 5px; }
.mt10   { margin-top: 10px; }
.mt15   { margin-top: 15px; }
.mt20   { margin-top: 20px; }
.mt25   { margin-top: 25px; }
.mt30   { margin-top: 30px; }
.mt35   { margin-top: 35px; }
.mt40   { margin-top: 40px; }
.mt45   { margin-top: 45px; }
.mt50   { margin-top: 50px; }
.mt60   { margin-top: 60px; }
.mt70   { margin-top: 70px; }
.mt80   { margin-top: 80px; }
.mt90   { margin-top: 90px; }
.mt100  { margin-top: 100px; }
.mt150  { margin-top: 150px; }
.mt200  { margin-top: 200px; }

/* Margem Bottom */
.mb1    { margin-bottom: 1px; }
.mb2    { margin-bottom: 2px; }
.mb3    { margin-bottom: 3px; }
.mb4    { margin-bottom: 4px; }
.mb5    { margin-bottom: 5px; }
.mb10   { margin-bottom: 10px; }
.mb20   { margin-bottom: 20px; }
.mb30   { margin-bottom: 30px; }
.mb40   { margin-bottom: 40px; }
.mb50   { margin-bottom: 50px; }
.mb60   { margin-bottom: 60px; }
.mb70   { margin-bottom: 70px; }
.mb80   { margin-bottom: 80px; }
.mb90   { margin-bottom: 90px; }
.mb100  { margin-bottom: 100px; }
.mb150  { margin-bottom: 150px; }
.mb200  { margin-bottom: 200px; }

/* Margem Left */
.ml1    { margin-left: 1px; }
.ml2    { margin-left: 2px; }
.ml3    { margin-left: 3px; }
.ml4    { margin-left: 4px; }
.ml5    { margin-left: 5px; }
.ml10   { margin-left: 10px; }
.ml15   { margin-left: 15px; }
.ml20   { margin-left: 20px; }
.ml25   { margin-left: 25px; }
.ml30   { margin-left: 30px; }
.ml35   { margin-left: 35px; }
.ml40   { margin-left: 40px; }
.ml45   { margin-left: 45px; }
.ml50   { margin-left: 50px; }
.ml100  { margin-left: 100px; }
.ml150  { margin-left: 150px; }
.ml200  { margin-left: 200px; }

/* Margem Right */
.mr1    { margin-right: 1px; }
.mr2    { margin-right: 2px; }
.mr3    { margin-right: 3px; }
.mr4    { margin-right: 4px; }
.mr5    { margin-right: 5px; }
.mr10   { margin-right: 10px; }
.mr15   { margin-right: 15px; }
.mr20   { margin-right: 20px; }
.mr25   { margin-right: 25px; }
.mr30   { margin-right: 30px; }
.mr35   { margin-right: 35px; }
.mr40   { margin-right: 40px; }
.mr45   { margin-right: 45px; }
.mr50   { margin-right: 50px; }
.mr100  { margin-right: 100px; }
.mr150  { margin-right: 150px; }
.mr200  { margin-right: 2000px; }

/* Margem Geral */
.mg1    { margin: 1px; }
.mg2    { margin: 2px; }
.mg3    { margin: 3px; }
.mg4    { margin: 4px; }
.mg5    { margin: 5px; }
.mg10   { margin: 10px; }
.mg15   { margin: 15px; }
.mg20   { margin: 20px; }
.mg25   { margin: 25px; }
.mg30   { margin: 30px; }
.mg35   { margin: 35px; }
.mg40   { margin: 40px; }
.mg45   { margin: 45px; }
.mg50   { margin: 50px; }
.mg100  { margin: 100px; }
.mg150  { margin: 150px; }
.mg200  { margin: 200px; }

/* Preenchimento Topo */
.pt1    { padding-top: 1px; }
.pt2    { padding-top: 2px; }
.pt3    { padding-top: 3px; }
.pt4    { padding-top: 4px; }
.pt5    { padding-top: 5px; }
.pt10   { padding-top: 10px; }
.pt15   { padding-top: 15px; }
.pt20   { padding-top: 20px; }
.pt25   { padding-top: 25px; }
.pt30   { padding-top: 30px; }
.pt35   { padding-top: 25px; }
.pt40   { padding-top: 40px; }
.pt45   { padding-top: 45px; }
.pt50   { padding-top: 50px; }
.pt100  { padding-top: 100px; }
.pt150  { padding-top: 150px; }
.pt200  { padding-top: 200px; }

/* Preenchimento Baixo */
.pb1    { padding-bottom: 1px; }
.pb2    { padding-bottom: 2px; }
.pb3    { padding-bottom: 3px; }
.pb4    { padding-bottom: 4px; }
.pb5    { padding-bottom: 5px; }
.pb10   { padding-bottom: 10px; }
.pb15   { padding-bottom: 15px; }
.pb20   { padding-bottom: 20px; }
.pb25   { padding-bottom: 25px; }
.pb30   { padding-bottom: 30px; }
.pb35   { padding-bottom: 35px; }
.pb40   { padding-bottom: 40px; }
.pb45   { padding-bottom: 45px; }
.pb50   { padding-bottom: 50px; }
.pb100  { padding-bottom: 100px; }
.pb150  { padding-bottom: 150px; }
.pb200  { padding-bottom: 200px; }

/* Preenchimento Esquerdo */
.pl1    { padding-left: 1px; }
.pl2    { padding-left: 2px; }
.pl3    { padding-left: 3px; }
.pl4    { padding-left: 4px; }
.pl5    { padding-left: 5px; }
.pl10   { padding-left: 10px; }
.pl15   { padding-left: 15px; }
.pl20   { padding-left: 20px; }
.pl25   { padding-left: 25px; }
.pl30   { padding-left: 30px; }
.pl35   { padding-left: 35px; }
.pl40   { padding-left: 40px; }
.pl45   { padding-left: 45px; }
.pl50   { padding-left: 50px; }
.pl100  { padding-left: 100px; }

/* Preenchimento Direito */
.pr1    { padding-right: 1px; }
.pr2    { padding-right: 2px; }
.pr3    { padding-right: 3px; }
.pr4    { padding-right: 4px; }
.pr5    { padding-right: 5px; }
.pr10   { padding-right: 10px; }
.pr15   { padding-right: 15px; }
.pr20   { padding-right: 20px; }
.pr25   { padding-right: 25px; }
.pr30   { padding-right: 30px; }
.pr35   { padding-right: 35px; }
.pr40   { padding-right: 40px; }
.pr45   { padding-right: 45px; }
.pr50   { padding-right: 50px; }
.pr100  { padding-right: 100px; }

/* Preenchimento Geral */
.pd1    { padding: 1px; }
.pd2    { padding: 2px; }
.pd3    { padding: 3px; }
.pd4    { padding: 4px; }
.pd5    { padding: 5px; }
.pd10   { padding: 10px; }
.pd15   { padding: 15px; }
.pd20   { padding: 20px; }
.pd25   { padding: 25px; }
.pd30   { padding: 30px; }
.pd35   { padding: 35px; }
.pd40   { padding: 40px; }
.pd45   { padding: 45px; }
.pd50   { padding: 50px; }
.pd100  { padding: 100px; }
.pd150  { padding: 1w50px; }
.pd200  { padding: 200px; }

.radius3        {border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius:3px;}
.radius6        {border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius:6px;}
.radius10       {border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
.radius15       {border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px;}
.radius20       {border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px;}
.radius30       {border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px;}