.card__api {
            position: fixed;
            bottom: 80px;
            width: 350px;
            transition: 0.9s;
            box-shadow: 0px 0px 21px black;
            z-index: 1000;
            border-radius: 10px;
            right: 0.1%;
          }
          
          .card__api .card__api--top {
            display: flex;
            background: #004800;
            padding: 3px 5px 10px;
            border-radius: 5px 5px 0 0;
            display: block;
          }
          
          .card__top--title {
            padding: 0 5px 0 15px;
          }
          
          .card__top--title h3 {
            margin: 10px 0 0;
            color: #e6e6e6;
            font-family: sans-serif;
            letter-spacing: 1px;
            font-size: 18px;
            text-align: initial;
          }
          
          .card__top--title p {
            margin: 0px;
            color: #e6e6e6;
            font-family: sans-serif;
            font-size: 15px;
          }
          
          #icon__x {
            cursor: pointer;
            position: fixed;
            bottom: 15px;
            width: 50px;
            z-index: 1000;
            right: 0.1%;;
          }
          
          #icon__x span {
            font-family: sans-serif;
            font-weight: 700;
          }
          
          .card--x {
            height: 25px;
            font-size: 20px;
            width: 25px;
            text-align: center;
            cursor: pointer;
            font-family: monospace;
            transition: 0.4s;
            margin: -60px 0 0 20px;
            right: 0;
            position: absolute;
            color: #e6e6e6;
          }
          
          .card--x:hover {
            transform: scale(1.5);
          }
          
          #icon__whats {
            border-radius: 50%;
            transform: scale(1);
            animation: pulse 2s infinite;
            position: fixed;
            bottom: 15px;
            z-index: 1000;
            display: none;
            width: 50px;
            right: 0.1%;
          }
          
          .card__api .card__api--body {
            padding: 20px 55px 20px 0px;
            display: grid;
            background-image: url(https://i.pinimg.com/564x/62/40/b6/6240b66d5c50c8661eee78b439a7d33c.jpg) !important;
            display: block;
          }
          
          .card__api .card__api--body--right {
            display: grid;
            margin-left: 15px;
            border-radius: 7px;
            background: #ffffff;
          }
          
          .card__api .card__api--body--right p {
            font-family: sans-serif;
            margin: 10px 0 -10px 15px;
            text-align: initial;
            color: #000000;
          }
          
          .card__api .card__api--body--right span {
            justify-self: right;
            padding: 5px 7px 3px;
            font-size: 12px;
            font-family: sans-serif;
            color: #000000;
          }
          
          .card__api .card__api--footer {
            border-radius: 0 0 5px 5px;
            display: grid;
            background: #e6e6e6;
          }
          
          .card__api .card__api--footer .btn {
            font-size: 15px;
            width: 60%;
            height: auto;
            padding: 10px;
            margin: 10px auto 10px;
            text-decoration-line: none;
            border-radius: 10px;
            text-align: center;
            color: #ffffff;
            background: #004800;
            font-family: sans-serif;
          }

          .card__api .card__api--footer .segundo {
            background: #004800;
          }
          
          .card__api .card__api--footer span {
            font-size: 10px;
            margin: 0px auto 5px;
            color: rgb(0, 0, 0);
          }
          
          .card__api .card__api--footer a {
            font-size: 10px;
            color: rgb(0, 0, 0);
            text-align: center;
            margin: 0 auto;
            text-decoration: none;
          }

          #icon__whats {
            background: white;
            border-radius: 50%;
            box-shadow: 0 0 0 0 rgba(1, 168, 132);
            transform: scale(1.5);
            animation: pulse 2s infinite;
          }
          
          @keyframes pulse {
            0% {
              transform: scale(0.95);
              box-shadow: 0 0 0 0 rgba(1, 168, 132, 0.7);
            }
          
            70% {
              transform: scale(1);
              box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
            }
          
            100% {
              transform: scale(0.95);
              box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            }
          }
          
          #icon__x {
            background: white;
            border-radius: 50%;
            box-shadow: 0 0 0 0 rgb(168, 1, 1);
            transform: scale(1.5);
            animation: pulseFechar 2s infinite;
          }
          
          @keyframes pulseFechar {
            0% {
              transform: scale(0.95);
              box-shadow: 0 0 0 0 rgba(168, 1, 1, 0.5);
            }
          
            70% {
              transform: scale(1);
              box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
            }
          
            100% {
              transform: scale(0.95);
              box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            }
          }
          
          @media(max-width: 480px) {
              .card__api {
                  width: 300px;
              }
              .card__top--title h3 {
                  font-size: 15px;
              }
              .card__top--title p {
                  font-size: 14px;
              }
              .card__api .card__api--body {
                  padding: 20px 40px 20px 0px;
              }
              .card__api .card__api--body--right {
                  padding: 0px;
              }
              .card--x {
                margin: -50px 0 0 20px;
              }
          }