@import url('https://fonts.googleapis.com/css?family=Lato:400,700'); body {
    font-family: 'Lato';
    font-family: 14px;
    overflow-x: hidden;
    overflow-y: scroll;
    max-width: 100vw;
}

.navigation {
    background: #eee;
    padding: 10px;
    border-bottom: 1px solid #e4e4e4;
    height: 55px;
    white-space: nowrap;
}

.navigation a {
    color: #3b3b3b;
    font-weight: 700;
    padding: 5px 15px;
}

a.btn.btn-round.btn-info {
    border-radius: 25px;
    color: #fff;
    box-shadow: 0px 0px 5px -5px rgba(0,0,0,0.1);
}

.container.hero {
    padding: 25px 0px 120px 0px;
   /* padding: calc(50vh - 100px) 10vw 20vh 10vw;*/
    text-align: center;
}

.text.middle {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.8;
    padding: 25px 0px 25px 0px;
}

/*text_button
 {
    color: #fff;
}*/


.hero {
    background: #000 url(bg-png.png) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin: 0px;
    width: 100vw;
    color: #fff;
    text-align: center;
   /* padding-top: calc(50vh - 200px);
    height: calc(100vh - 50px);*/
}

a.btn.btn-info.btn-action {
    padding: 15px 35px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: bold;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    border: none;
    background: linear-gradient(135deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3, #2b1de8, #1ddde8, #1de840, #e3e81d, #e8b71d, #e81d1d, #ff2400);
    background-size: 1200% 1200%;
    animation: rainbow 6s ease infinite forwards;
}

a.btn.btn-info.btn-action:hover {
    text-shadow: 2px 0px 15px rgba(0, 0, 0, 0.5);
    animation-duration: 30s;
}

@keyframes rainbow {
    0% {
        background-position: 0% 0%;
    }

    100% {
        background-position: 100% 100%;
    }
}

.extra-text {
    padding: 50px 20px;
    line-height: 1.5;
    font-size: 23px;
    color: #ffffff;
    /*    color: #576063;*/
}

.terms {
    padding: 50px 20px;
    line-height: 1;
    font-size: 15px;
    color: #ffffff;
}

.extra-text a.btn {
    border-radius: 100px;
    margin: 30px 0px;
    padding: 12px 35px 14px 35px;
}

.bellow {
    background: #000;
    padding: 80px 0px 120px 0px;
}

img.promo {
    width: 75%;
}

img.logomagiclinks {
    width: 85%;
}

.logo {
    font-weight:  900;
    padding: 0px 0px;
    font-size: 11px;
    color: white;
}
/*.profile-page = page inteira*/
.profile-page {
    padding: 5px 10px 10px 10px;
    background: linear-gradient(to bottom, #4c68d7, #8a3ab9, #cd486b, #fbad50, #fccc63);
    min-height: 100%;
    /*coloquei min width abaixo como tentativa de fazer pagina geral(inteira) nao ficar menor q botoes*/
/*    min-width: 320px;*/
    text-align: center;
    color:  #fff;
/*    max-width: 320px;*/
    min-width: 100%;
}
/*  background: linear-gradient(to bottom, #8a3ab9, #fbad50);*/
/*  background: linear-gradient(to bottom, #a978ff, #ff89b1);*/

/*border-radius: = contorno do logo MAGICLINKS APP*/
.profile-page img {
    margin: 3px;
    border-radius: 30%;
    width: 100px;
}
.mlogo img {
    margin: 0px !important;
    border-radius: 50px !important;
    width: 150px !important;
    height: 50px !important;
}


/*added profile photo css below*/ 
.profile-photo img{
    margin: 5px;
    border-radius: 100%;
    width: 120px;
    height: 120px;
    text-align: center;

}

/*    white-space: nowrap;
FAZ O TEXTO NAO QUEBRAR 
https://css-tricks.com/almanac/properties/w/whitespace/
*/

/*  padding: = DISTANCIA ENTRE BOTOES */
.link-builder > div {
    white-space: normal;
    padding: 15px 0px 15px 0px;
/*  margin: 0px -10px 0px -20px;*/
    margin: 0px 0px 0px 0px;
}


/*.link-builder > div:hover {
    background: rgba(0,0,0,0.05);
}*/

.link-builder > div i {
    display: inline-block;
    width: 20px;
    color: #842000;
    font-size:  16px;
    vertical-align: 38px;
    cursor: pointer;
}


.link-builder > div i.fa-check.uncheck {
    color: rgba(243, 243, 243, 0.2);
}
.link-builder > div i.fa-check.uncheck:hover {
    color: rgba(243, 243, 243, 0.35);
}

.link-builder > div i.fa-check {
    position: relative;
    font-size: 12px;
    padding:  3px 0px;
    color: #fff;
    vertical-align: 40px;
}

.link-builder > div i.fa-check:after {
    content: "";
    left: 1px;
    top: 0px;
    position: absolute;
    width: 18px;
    height: 18px;
    border:  1px solid rgba(255, 255, 255, 0.5);
    font-size: 14px;
}



.link-builder > div i.fa-check.uncheck + div {
    opacity: 0.25;
    user-select: none;
    pointer-events: none;
}

.link-builder > div > div {
    display: inline-block;
   /* width: calc(100% - 75px);*/
   width: calc(90% - 75px);
}


.link-builder > div > div input {
    display: block;
/*    width: 90%;   = muda o maximo q mostra o botao NO LINK BUILDER*/
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px dotted;
    outline: none;
    margin: 5px 0px;
}

.link-builder > div > div input::placeholder {
    color: #fff;
}


.link-builder > div > div .border-button {
    text-align: center;
    outline: none;
    border: 2px solid #fff;
    padding: 10px;
    display: block;
    width: 100%;
    background: transparent;
}


.profile {
    width: 100%;
/*    max-width = maximo q o botao estica na tela.*/
/*    max-width: 500px;*/
    max-width: 500px;
    min-width: 320px;
    display:  inline-block;
}

a.btn.btn-link.btn-danger {
    color: #fff;
    text-decoration:  underline;
    margin: 6px;
    font-size: 15px;
}
h1.at {
    color: #000;
    margin: 0px 0px 1px 0px;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
    font-size: 23px;
}

h4.bio {
    font-size:  14px;
    opacity: 0.8;
    margin: 25px 10px 25px 10px;
    line-height: 1.6;
}

button.border-button:hover {
    border-color: rgba(255, 255, 255, 0.75);
}

button.border-button[contenteditable] {
    cursor:  text;
}
.plus-button button {
    border:  transparent;
    background: none;
    font-size: 22px;
    margin: 5px 10px 25px 0px;
    outline:  none;
    display:  block;
    text-align:  center;
    width: 100%;
}

.logout .logo {
    color: rgba(0, 0, 0, 0.15);
    font-size: 15px;
}

.logout {
    margin: 50px 0px;
}

div.template {
    display: none;
}
.plus-button button i {
    vertical-align:  -2px;
    font-size:  22px;
    padding: 5px;
}

.steps {
    text-align: left;
}

span {
    background: rgba(0, 0, 0, 0.25);
    padding: 3px 20px;
    margin-left: 2px;
    font-size: 13px;
    display:  inline-block;
    border-radius: 7px 7px 0px 0px;
    font-weight: 800;
    color: #ede2ef;
}

input#profile_url {
    width: 100%;
    padding:  5px;
    background: rgba(255,255,255,0.3);
    border: none;
    outline: none;
    text-align: center;
}

.msg {
    text-align: center;
}

.divide {
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.pull-wrapper {
    line-height:  2;
    padding: 15px 0px 30px 0px;
    font-size: 16px;
}

.button-wrapper {
    text-align:  center;
    padding: 30px 30px 30px 30px;
}

button.btn.btn-info {
    border-radius: 0px;
}
.link-preview {
    text-align:  center;
    margin: 0px 0px 0px 0px;
    color: #564c53;
}
button.btn.btn-info.copy {
    width: 100%;
}
/*ADJUST BUTTON DISTANCE (BETWEEN THEM BELLOW) = margin: 40px 7px 10px 7px;*/
/*OLD = padding: 12px;*/
.link-builder.baked a {
    display:  block;
    border:  2px solid #fff;
    margin: 13px 7px 8px 9px;
    color:  #fff;
    text-decoration:  none;
    padding: 6px;
}
.link-builder.baked a:hover {
    /* background: rgba(255, 255, 255, 0.15); */
}
@media (max-width:1000px) {
    .navigation {
        padding: 10px 0px;
    }
    .navigation a:not(.btn) {
        font-size: 12px;
        padding: 5px;
    }

    .navigation a:not(.btn) i {
        font-size: 12px;
    }

    .bellow {
        text-align: center;
        padding: 0px 0px 100px 0px;
    }

    .text.middle {
        margin-top: 30px;
        font-size: 22px;
    }
}

.stats {
    width: calc(100%) !important;
    text-align:  center;
    display: block !important;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background: #313030;
}

::-webkit-scrollbar-thumb {
    background: #726a80;
    border-radius: 10px;
}
.video {
    position: relative;
    padding-bottom: 56.25%;
    background: black;
    align-items: center;
}
.video iframe {
    position: absolute;
    width: 100%;
    height: 100%;
}
h1 {
  text-align: center;
  color: blue;
}
h3 {
  text-align: left;
  color: blue;
}
#container {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}
#header {
    color: blue;   
}
#faq {
    padding: 20px;
}
#footer {
    text-align: center;
    padding: 10px
    background-color: black;
    color: white;
    padding: 20px;
}
#footer .selected {
    font-weight: bold;
    list-style-type: none;
}

/*PRICING PAGE CSS BEGIN HERE*/

section.pricing {
  background: #9CECFB;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #0052D4, #65C7F7, #9CECFB);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #0052D4, #65C7F7, #9CECFB);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.pricing .card {
  border: none;
  border-radius: 1rem;
  transition: all 0.2s;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
}

.pricing hr {
  margin: 1.5rem 0;
}

.pricing .card-title {
  margin: 0.5rem 0;
  font-size: 0.9rem;
  letter-spacing: .1rem;
  font-weight: bold;
}

.pricing .card-price {
  font-size: 3rem;
  margin: 0;
}

.pricing .card-price .period {
  font-size: 0.8rem;
}

.pricing ul li {
  margin-bottom: 1rem;
}

.pricing .text-muted {
  opacity: 0.7;
}

.pricing .btn {
  font-size: 80%;
  border-radius: 5rem;
  letter-spacing: .1rem;
  font-weight: bold;
  padding: 1rem;
  opacity: 0.7;
  transition: all 0.2s;
}
/*PRICING PAGE CSS END HERE*/




/*body {
    text-decoration: none;
    color: black;*/

    .table_color{
        width: 100%;
        /*height: 400px;*/
        height: 133px;
        border: 1px solid black;
    }

    .table_color2{
        width: 100%;
        /*height: 400px;*/
        height: 400px;
        border: 1px solid black;
    }

    .table_icon{
        width: 100%;
        height: 400px;
        border: 0px solid black;
    }

    .step_tittle{
        color: #FFF !important;
    }

    .color_cell{
        width: 16.6%;
        height: 16.6%;
        cursor: pointer;
    }

    .background_cell{
        width: 16.6%;
        height: 16.6%;
        cursor: pointer;
    }
/*BUTTON COLORS*/
    .color_1{
        background: linear-gradient(to bottom, #000000, #000000);
    }
    .color_2{
         background: linear-gradient(to bottom, #ffffff, #ffffff);
    }
    .color_3{
        background: linear-gradient(to bottom, #ff0000 0%, #ff0000 100%);
    }
    .color_4{
        background: linear-gradient(to bottom, #ff4000 0%, #ff4000 100%);
    }
    .color_5{
        background: linear-gradient(to bottom, #ff8000 0%, #ff8000 100%);
    }
    .color_6{
        background: linear-gradient(to bottom, #ffbf00 0%, #ffbf00 100%);
    }
    .color_7{
        background: linear-gradient(to bottom, #ffff00 0%, #ffff00 100%);
    }
    .color_8{
        background: linear-gradient(to bottom, #bfff00 0%, #bfff00 100%);
    }
    .color_9{
        background: linear-gradient(to bottom, #80ff00 0%, #80ff00 100%);
    }
    .color_10{
        background: linear-gradient(to bottom, #40ff00 0%, #40ff00 100%);
    }
    .color_11{
        background: linear-gradient(to bottom, #00ff00 0%, #00ff00 100%);
    }
    .color_12{
        background: linear-gradient(to bottom, #00ff40 0%, #00ff40 100%);
    }
    /*.background_17{
        background: linear-gradient(to bottom, #00ff80 0%, #00ff80 100%);
    }
    .background_18{
        background: linear-gradient(to bottom, #00ffbf 0%, #00ffbf 100%);
    }
    .background_19{
        background: linear-gradient(to bottom, #00ffff 0%, #00ffff 100%);
    }
    .background_20{
        background: linear-gradient(to bottom, #00bfff 0%, #00bfff 100%);
    }
    .background_21{
        background: linear-gradient(to bottom, #0080ff 0%, #0080ff 100%);
    }
    .background_22{
        background: linear-gradient(to bottom, #0040ff 0%, #0040ff 100%);
    }
    .background_23{
        background: linear-gradient(to bottom, #0000ff 0%, #0000ff 100%);
    }
    .background_24{
        background: linear-gradient(to bottom, #4000ff 0%, #4000ff 100%);
    }
    .background_25{
        background: linear-gradient(to bottom, #8000ff 0%, #8000ff 100%);
    }
    .background_26{
        background: linear-gradient(to bottom, #bf00ff 0%, #bf00ff 100%);
    }
    .background_27{
        background: linear-gradient(to bottom, #ff00ff 0%, #ff00ff 100%);
    }
    .background_28{
        background: linear-gradient(to bottom, #ff00bf 0%, #ff00bf 100%);
    }
    .background_29{
        background: linear-gradient(to bottom, #ff0080 0%, #ff0080 100%);
    }
    .background_30{
        background: linear-gradient(to bottom, #ff0040 0%, #ff0040 100%);
    }*/
/*    .background_31{
        background: linear-gradient(to bottom, #ff0000 0%, #ffff00 100%);
    }*/
/*    .background_32{
        background: linear-gradient(to bottom, #ff0000 0%, #ffff00 100%);
    }
    .background_33{
        background: linear-gradient(to bottom, #ff0000 0%, #ff0000 100%);
    }
    .background_34{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);
    }
    .background_35{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);;
    }
    .background_36{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);
    }

    /*
        #6b5b95 #feb236 #d64161 #ff7b25 #d5e1df #e3eaa7 
        #b5e7a0 #86af49 #3e4444 #82b74b #405d27 #c1946a
        #deeaee #b1cbbb #eea29a #c94c4c #ffef96 #50394c
        #b2b2b2 #f4e1d2 #b2b2b2 #f4e1d2 #f18973 #bc5a45
        #4040a1 #36486b #618685 #fefbd8 #80ced6 #d5f4e6
        background: llinear-gradient(to bottom, #33ccff 0%, #ff99cc 100%);
        background: linear-gradient(to bottom, #ff0000 0%, #ffff00 100%);
        background: linear-gradient(to bottom, #cc00cc 0%, #0000cc 100%);
        background: linear-gradient(to bottom, #669999 0%, #003300 100%);
        background: linear-gradient(to bottom, #660066 0%, #993333 100%);
        background: linear-gradient(to bottom, #ccccff 0%, #0066cc 100%);
    */

/*BACKGROUND COLORS*/
    .background_1{
        background: linear-gradient(to bottom, #000000, #000000);
    }
    .background_2{
         background: linear-gradient(to bottom, #ffffff, #ffffff);
    }
    .background_3{
         background: linear-gradient(to bottom, #33ccff 0%, #ff99cc 100%);
    }
    .background_4{
         background: linear-gradient(to bottom, #669999 0%, #003300 100%);
    }
    .background_5{
        background: linear-gradient(to bottom, #660066 0%, #993333 100%);
    }
    .background_6{
        background: linear-gradient(to bottom, #4c68d7, #8a3ab9, #cd486b, #fbad50, #fccc63);
    }
    .background_7{
        background: linear-gradient(to bottom, #ff0000 0%, #ff0000 100%);
    }
    .background_8{
        background: linear-gradient(to bottom, #ff4000 0%, #ff4000 100%);
    }
    .background_9{
        background: linear-gradient(to bottom, #ff8000 0%, #ff8000 100%);
    }
    .background_10{
        background: linear-gradient(to bottom, #ffbf00 0%, #ffbf00 100%);
    }
    .background_11{
        background: linear-gradient(to bottom, #ffff00 0%, #ffff00 100%);
    }
    .background_12{
        background: linear-gradient(to bottom, #bfff00 0%, #bfff00 100%);
    }
    .background_13{
        background: linear-gradient(to bottom, #80ff00 0%, #80ff00 100%);
    }
    .background_14{
        background: linear-gradient(to bottom, #40ff00 0%, #40ff00 100%);
    }
    .background_15{
        background: linear-gradient(to bottom, #00ff00 0%, #00ff00 100%);
    }
    .background_16{
        background: linear-gradient(to bottom, #00ff40 0%, #00ff40 100%);
    }
    .background_17{
        background: linear-gradient(to bottom, #00ff80 0%, #00ff80 100%);
    }
    .background_18{
        background: linear-gradient(to bottom, #00ffbf 0%, #00ffbf 100%);
    }
    .background_19{
        background: linear-gradient(to bottom, #00ffff 0%, #00ffff 100%);
    }
    .background_20{
        background: linear-gradient(to bottom, #00bfff 0%, #00bfff 100%);
    }
    .background_21{
        background: linear-gradient(to bottom, #0080ff 0%, #0080ff 100%);
    }
    .background_22{
        background: linear-gradient(to bottom, #0040ff 0%, #0040ff 100%);
    }
    .background_23{
        background: linear-gradient(to bottom, #0000ff 0%, #0000ff 100%);
    }
    .background_24{
        background: linear-gradient(to bottom, #4000ff 0%, #4000ff 100%);
    }
    .background_25{
        background: linear-gradient(to bottom, #8000ff 0%, #8000ff 100%);
    }
    .background_26{
        background: linear-gradient(to bottom, #bf00ff 0%, #bf00ff 100%);
    }
    .background_27{
        background: linear-gradient(to bottom, #ff00ff 0%, #ff00ff 100%);
    }
    .background_28{
        background: linear-gradient(to bottom, #ff00bf 0%, #ff00bf 100%);
    }
    .background_29{
        background: linear-gradient(to bottom, #ff0080 0%, #ff0080 100%);
    }
    .background_30{
        background: linear-gradient(to bottom, #ff0040 0%, #ff0040 100%);
    }
/*    .background_31{
        background: linear-gradient(to bottom, #ff0000 0%, #ffff00 100%);
    }*/
/*    .background_32{
        background: linear-gradient(to bottom, #ff0000 0%, #ffff00 100%);
    }
    .background_33{
        background: linear-gradient(to bottom, #ff0000 0%, #ff0000 100%);
    }
    .background_34{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);
    }
    .background_35{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);;
    }
    .background_36{
        background: linear-gradient(to bottom,  #ff0000 0%, #ff0000 100%);
    }
*/
    .switch {
      position: relative;
      display: inline-block;
      width: 60px;
      height: 34px;
    }

    .switch input { 
      opacity: 0;
      width: 0;
      height: 0;
    }

    .slider {
      position: absolute;
      cursor: pointer;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #ccc;
      -webkit-transition: .4s;
      transition: .4s;
    }

    .slider:before {
      position: absolute;
      content: "";
      height: 26px;
      width: 26px;
      left: 4px;
      bottom: 4px;
      background-color: white;
      -webkit-transition: .4s;
      transition: .4s;
    }

    input:checked + .slider {
      background-color: #2196F3;
    }

    input:focus + .slider {
      box-shadow: 0 0 1px #2196F3;
    }

    input:checked + .slider:before {
      -webkit-transform: translateX(26px);
      -ms-transform: translateX(26px);
      transform: translateX(26px);
    }

    /* Rounded sliders */
    .slider.round {
      border-radius: 34px;
    }

    .slider.round:before {
      border-radius: 50%;
    }

    .icon_img{
        border-radius: 0% !important;
    }

    .button_fill{
        border:  0px solid #fff !important; 
        padding: 0px 0px 0px 0px !important
    }

/*LOGO BUTTONS SIZE SET:*/

/*THIS(DOWN) DEFINES SIZE OF LOGO BUTTON:*/
/*      width: 100% !important;*/


/*LOGO BUTTONS*/
/*TO DEFINE DISTANCE BETWEEN ADDED(DOWN): margin-bottom: 62px !important;*/
    .icon_button{
        border-radius: 40px !important;
        padding: 0px; 
/*width: 90% !important; = LARGURA DO BOTAO*/
        width: 90% !important;
        height: auto !important;
/*max-height: ORIGINAL = 92px = ALTURA MAXIMA BOTAO*/
        max-height: 96px;
        margin: auto !important;
    }

/*WRITTEN BUTTONS*/
/*min-height: 62px !important;*/
    .written_button{
        border-radius: 40px !important;
        padding: 0px; 
        /*width: 86% !important;*/
        width: 90% !important;
        height: auto !important;
        min-height: 92px !important;  
        margin-right: auto !important;
        margin-left: auto !important;
        margin-bottom: 0px !important;
        text-align: center !important;
        vertical-align: middle !important;
    }


.stats2 {
    width: calc(100%) !important;
    text-align:  center;
    display: block !important;
}

.dotted-input {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px dotted !important;
    outline: none !important;
    margin: 5px 0px !important;
}

.plus {
    color: green !important;
}

.minus {
    color: red !important;
}

.link-builder > div i.fa-plus-circle.uncheck {
    color: rgba(243, 243, 243, 0.2);
}
.link-builder > div i.fa-plus-circle.uncheck:hover {
    color: rgba(243, 243, 243, 0.35);
}

.link-builder > div i.fa-plus-circle {
/*    font-size: 12px;*/
/*    padding:  3px 0px;*/
/*  font-size: = tamanho do mais era 25 */
    font-size:40px;
}

.link-builder > div i.fa-plus-circle:after {
    content: "";
    left: 1px;
    top: 0px;
    position: absolute;
    width: 18px;
    height: 18px;
    font-size:30px;
}

.link-builder > div > div i.fa-plus-circle.uncheck + div {
    opacity: 0.25;
    user-select: none;
    pointer-events: none;
}

.link-builder > div i.fa-minus-circle.uncheck {
    color: rgba(243, 243, 243, 0.2);
}
.link-builder > div i.fa-minus-circle.uncheck:hover {
    color: rgba(243, 243, 243, 0.35);
}

.link-builder > div i.fa-minus-circle {
/*    font-size: 12px;*/
/*    padding:  3px 0px;*/
/*  font-size: = tamanho do menos */
    font-size:40px;
}

.link-builder > div i.fa-minus-circle:after {
    content: "";
    left: 1px;
    top: 0px;
    position: absolute;
    width: 18px;
    height: 18px;
/*    font-size:25px;*/
    font-size:30px;
}

.uncheckbutton{
    opacity: 0.25;
    user-select: none;
    pointer-events: none;
}