@trumpetstech/bootwind/dist/utility.css

Utility and component-centric design system based on Bootstrap for fast, responsive UI development.

/*!
 * Bootwind CSS v1.0.0 (https://bootwind.trumpetstech.com/)
 * Copyright 2023 Bootwind
 * Licensed under MIT (https://github.com/trumpetstech/bootwind/blob/main/LICENSE)
 */.fade{transition:opacity .2s linear}@media(prefers-reduced-motion: reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .2s ease}@media(prefers-reduced-motion: reduce){.collapsing{transition:none}}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s ease}@media(prefers-reduced-motion: reduce){.collapsing.collapse-horizontal{transition:none}}.bg-soft-primary{background-color:#efcccc !important}.bg-soft-secondary{background-color:#f5f7f9 !important}.bg-soft-tertiary{background-color:#ffddeb !important}.bg-soft-success{background-color:#ccf5e7 !important}.bg-soft-info{background-color:#ccf6ff !important}.bg-soft-warning{background-color:#ffe8cc !important}.bg-soft-danger{background-color:#ffd6e0 !important}.bg-soft-white{background-color:#fff !important}.bg-soft-light{background-color:#fff !important}.bg-soft-dark{background-color:#d0d1d5 !important}.bg-none{background-image:none !important}.bg-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}@media(min-width: 576px){.bg-sm-none{background-image:none !important}.bg-sm-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}}@media(min-width: 768px){.bg-md-none{background-image:none !important}.bg-md-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}}@media(min-width: 992px){.bg-lg-none{background-image:none !important}.bg-lg-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}}@media(min-width: 1200px){.bg-xl-none{background-image:none !important}.bg-xl-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}}@media(min-width: 1400px){.bg-xxl-none{background-image:none !important}.bg-xxl-between{background-repeat:no-repeat;background-position:left center,right center;background-size:auto 90%}}.gradient-top{background-image:linear-gradient(to top, var(--x-gradient)) !important}.gradient-top-right{background-image:linear-gradient(to top right, var(--x-gradient)) !important}.gradient-right{background-image:linear-gradient(to right, var(--x-gradient)) !important}.gradient-bottom-right{background-image:linear-gradient(to bottom right, var(--x-gradient)) !important}.gradient-bottom{background-image:linear-gradient(to bottom, var(--x-gradient)) !important}.gradient-bottom-left{background-image:linear-gradient(to bottom left, var(--x-gradient)) !important}.gradient-left{background-image:linear-gradient(to left, var(--x-gradient)) !important}.gradient-top-left{background-image:linear-gradient(to top left, var(--x-gradient)) !important}.start-white,.start-white-hover:hover{--x-start-color: var(--x-white);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-black,.start-black-hover:hover{--x-start-color: var(--x-black);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-50,.start-gray-50-hover:hover{--x-start-color: var(--x-gray-50);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-100,.start-gray-100-hover:hover{--x-start-color: var(--x-gray-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-200,.start-gray-200-hover:hover{--x-start-color: var(--x-gray-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-300,.start-gray-300-hover:hover{--x-start-color: var(--x-gray-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-400,.start-gray-400-hover:hover{--x-start-color: var(--x-gray-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-500,.start-gray-500-hover:hover{--x-start-color: var(--x-gray-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-600,.start-gray-600-hover:hover{--x-start-color: var(--x-gray-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-700,.start-gray-700-hover:hover{--x-start-color: var(--x-gray-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-800,.start-gray-800-hover:hover{--x-start-color: var(--x-gray-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-gray-900,.start-gray-900-hover:hover{--x-start-color: var(--x-gray-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-100,.start-blue-100-hover:hover{--x-start-color: var(--x-blue-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-200,.start-blue-200-hover:hover{--x-start-color: var(--x-blue-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-300,.start-blue-300-hover:hover{--x-start-color: var(--x-blue-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-400,.start-blue-400-hover:hover{--x-start-color: var(--x-blue-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-500,.start-blue-500-hover:hover{--x-start-color: var(--x-blue-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-600,.start-blue-600-hover:hover{--x-start-color: var(--x-blue-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-700,.start-blue-700-hover:hover{--x-start-color: var(--x-blue-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-800,.start-blue-800-hover:hover{--x-start-color: var(--x-blue-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-blue-900,.start-blue-900-hover:hover{--x-start-color: var(--x-blue-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-100,.start-indigo-100-hover:hover{--x-start-color: var(--x-indigo-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-200,.start-indigo-200-hover:hover{--x-start-color: var(--x-indigo-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-300,.start-indigo-300-hover:hover{--x-start-color: var(--x-indigo-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-400,.start-indigo-400-hover:hover{--x-start-color: var(--x-indigo-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-500,.start-indigo-500-hover:hover{--x-start-color: var(--x-indigo-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-600,.start-indigo-600-hover:hover{--x-start-color: var(--x-indigo-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-700,.start-indigo-700-hover:hover{--x-start-color: var(--x-indigo-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-800,.start-indigo-800-hover:hover{--x-start-color: var(--x-indigo-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-indigo-900,.start-indigo-900-hover:hover{--x-start-color: var(--x-indigo-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-100,.start-purple-100-hover:hover{--x-start-color: var(--x-purple-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-200,.start-purple-200-hover:hover{--x-start-color: var(--x-purple-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-300,.start-purple-300-hover:hover{--x-start-color: var(--x-purple-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-400,.start-purple-400-hover:hover{--x-start-color: var(--x-purple-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-500,.start-purple-500-hover:hover{--x-start-color: var(--x-purple-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-600,.start-purple-600-hover:hover{--x-start-color: var(--x-purple-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-700,.start-purple-700-hover:hover{--x-start-color: var(--x-purple-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-800,.start-purple-800-hover:hover{--x-start-color: var(--x-purple-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-purple-900,.start-purple-900-hover:hover{--x-start-color: var(--x-purple-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-100,.start-pink-100-hover:hover{--x-start-color: var(--x-pink-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-200,.start-pink-200-hover:hover{--x-start-color: var(--x-pink-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-300,.start-pink-300-hover:hover{--x-start-color: var(--x-pink-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-400,.start-pink-400-hover:hover{--x-start-color: var(--x-pink-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-500,.start-pink-500-hover:hover{--x-start-color: var(--x-pink-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-600,.start-pink-600-hover:hover{--x-start-color: var(--x-pink-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-700,.start-pink-700-hover:hover{--x-start-color: var(--x-pink-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-800,.start-pink-800-hover:hover{--x-start-color: var(--x-pink-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-pink-900,.start-pink-900-hover:hover{--x-start-color: var(--x-pink-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-100,.start-magenta-100-hover:hover{--x-start-color: var(--x-magenta-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-200,.start-magenta-200-hover:hover{--x-start-color: var(--x-magenta-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-300,.start-magenta-300-hover:hover{--x-start-color: var(--x-magenta-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-400,.start-magenta-400-hover:hover{--x-start-color: var(--x-magenta-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-500,.start-magenta-500-hover:hover{--x-start-color: var(--x-magenta-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-600,.start-magenta-600-hover:hover{--x-start-color: var(--x-magenta-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-700,.start-magenta-700-hover:hover{--x-start-color: var(--x-magenta-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-800,.start-magenta-800-hover:hover{--x-start-color: var(--x-magenta-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-magenta-900,.start-magenta-900-hover:hover{--x-start-color: var(--x-magenta-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-100,.start-red-100-hover:hover{--x-start-color: var(--x-red-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-200,.start-red-200-hover:hover{--x-start-color: var(--x-red-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-300,.start-red-300-hover:hover{--x-start-color: var(--x-red-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-400,.start-red-400-hover:hover{--x-start-color: var(--x-red-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-500,.start-red-500-hover:hover{--x-start-color: var(--x-red-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-600,.start-red-600-hover:hover{--x-start-color: var(--x-red-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-700,.start-red-700-hover:hover{--x-start-color: var(--x-red-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-800,.start-red-800-hover:hover{--x-start-color: var(--x-red-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-red-900,.start-red-900-hover:hover{--x-start-color: var(--x-red-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-100,.start-orange-100-hover:hover{--x-start-color: var(--x-orange-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-200,.start-orange-200-hover:hover{--x-start-color: var(--x-orange-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-300,.start-orange-300-hover:hover{--x-start-color: var(--x-orange-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-400,.start-orange-400-hover:hover{--x-start-color: var(--x-orange-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-500,.start-orange-500-hover:hover{--x-start-color: var(--x-orange-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-600,.start-orange-600-hover:hover{--x-start-color: var(--x-orange-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-700,.start-orange-700-hover:hover{--x-start-color: var(--x-orange-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-800,.start-orange-800-hover:hover{--x-start-color: var(--x-orange-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-orange-900,.start-orange-900-hover:hover{--x-start-color: var(--x-orange-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-100,.start-yellow-100-hover:hover{--x-start-color: var(--x-yellow-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-200,.start-yellow-200-hover:hover{--x-start-color: var(--x-yellow-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-300,.start-yellow-300-hover:hover{--x-start-color: var(--x-yellow-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-400,.start-yellow-400-hover:hover{--x-start-color: var(--x-yellow-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-500,.start-yellow-500-hover:hover{--x-start-color: var(--x-yellow-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-600,.start-yellow-600-hover:hover{--x-start-color: var(--x-yellow-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-700,.start-yellow-700-hover:hover{--x-start-color: var(--x-yellow-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-800,.start-yellow-800-hover:hover{--x-start-color: var(--x-yellow-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-yellow-900,.start-yellow-900-hover:hover{--x-start-color: var(--x-yellow-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-100,.start-green-100-hover:hover{--x-start-color: var(--x-green-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-200,.start-green-200-hover:hover{--x-start-color: var(--x-green-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-300,.start-green-300-hover:hover{--x-start-color: var(--x-green-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-400,.start-green-400-hover:hover{--x-start-color: var(--x-green-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-500,.start-green-500-hover:hover{--x-start-color: var(--x-green-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-600,.start-green-600-hover:hover{--x-start-color: var(--x-green-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-700,.start-green-700-hover:hover{--x-start-color: var(--x-green-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-800,.start-green-800-hover:hover{--x-start-color: var(--x-green-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-green-900,.start-green-900-hover:hover{--x-start-color: var(--x-green-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-100,.start-teal-100-hover:hover{--x-start-color: var(--x-teal-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-200,.start-teal-200-hover:hover{--x-start-color: var(--x-teal-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-300,.start-teal-300-hover:hover{--x-start-color: var(--x-teal-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-400,.start-teal-400-hover:hover{--x-start-color: var(--x-teal-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-500,.start-teal-500-hover:hover{--x-start-color: var(--x-teal-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-600,.start-teal-600-hover:hover{--x-start-color: var(--x-teal-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-700,.start-teal-700-hover:hover{--x-start-color: var(--x-teal-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-800,.start-teal-800-hover:hover{--x-start-color: var(--x-teal-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-teal-900,.start-teal-900-hover:hover{--x-start-color: var(--x-teal-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-100,.start-cyan-100-hover:hover{--x-start-color: var(--x-cyan-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-200,.start-cyan-200-hover:hover{--x-start-color: var(--x-cyan-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-300,.start-cyan-300-hover:hover{--x-start-color: var(--x-cyan-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-400,.start-cyan-400-hover:hover{--x-start-color: var(--x-cyan-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-500,.start-cyan-500-hover:hover{--x-start-color: var(--x-cyan-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-600,.start-cyan-600-hover:hover{--x-start-color: var(--x-cyan-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-700,.start-cyan-700-hover:hover{--x-start-color: var(--x-cyan-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-800,.start-cyan-800-hover:hover{--x-start-color: var(--x-cyan-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-cyan-900,.start-cyan-900-hover:hover{--x-start-color: var(--x-cyan-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-100,.start-slate-100-hover:hover{--x-start-color: var(--x-slate-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-200,.start-slate-200-hover:hover{--x-start-color: var(--x-slate-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-300,.start-slate-300-hover:hover{--x-start-color: var(--x-slate-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-400,.start-slate-400-hover:hover{--x-start-color: var(--x-slate-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-500,.start-slate-500-hover:hover{--x-start-color: var(--x-slate-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-600,.start-slate-600-hover:hover{--x-start-color: var(--x-slate-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-700,.start-slate-700-hover:hover{--x-start-color: var(--x-slate-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-800,.start-slate-800-hover:hover{--x-start-color: var(--x-slate-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-slate-900,.start-slate-900-hover:hover{--x-start-color: var(--x-slate-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-100,.start-zinc-100-hover:hover{--x-start-color: var(--x-zinc-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-200,.start-zinc-200-hover:hover{--x-start-color: var(--x-zinc-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-300,.start-zinc-300-hover:hover{--x-start-color: var(--x-zinc-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-400,.start-zinc-400-hover:hover{--x-start-color: var(--x-zinc-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-500,.start-zinc-500-hover:hover{--x-start-color: var(--x-zinc-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-600,.start-zinc-600-hover:hover{--x-start-color: var(--x-zinc-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-700,.start-zinc-700-hover:hover{--x-start-color: var(--x-zinc-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-800,.start-zinc-800-hover:hover{--x-start-color: var(--x-zinc-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-zinc-900,.start-zinc-900-hover:hover{--x-start-color: var(--x-zinc-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-100,.start-neutral-100-hover:hover{--x-start-color: var(--x-neutral-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-200,.start-neutral-200-hover:hover{--x-start-color: var(--x-neutral-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-300,.start-neutral-300-hover:hover{--x-start-color: var(--x-neutral-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-400,.start-neutral-400-hover:hover{--x-start-color: var(--x-neutral-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-500,.start-neutral-500-hover:hover{--x-start-color: var(--x-neutral-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-600,.start-neutral-600-hover:hover{--x-start-color: var(--x-neutral-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-700,.start-neutral-700-hover:hover{--x-start-color: var(--x-neutral-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-800,.start-neutral-800-hover:hover{--x-start-color: var(--x-neutral-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-neutral-900,.start-neutral-900-hover:hover{--x-start-color: var(--x-neutral-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-100,.start-stone-100-hover:hover{--x-start-color: var(--x-stone-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-200,.start-stone-200-hover:hover{--x-start-color: var(--x-stone-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-300,.start-stone-300-hover:hover{--x-start-color: var(--x-stone-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-400,.start-stone-400-hover:hover{--x-start-color: var(--x-stone-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-500,.start-stone-500-hover:hover{--x-start-color: var(--x-stone-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-600,.start-stone-600-hover:hover{--x-start-color: var(--x-stone-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-700,.start-stone-700-hover:hover{--x-start-color: var(--x-stone-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-800,.start-stone-800-hover:hover{--x-start-color: var(--x-stone-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-stone-900,.start-stone-900-hover:hover{--x-start-color: var(--x-stone-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-100,.start-amber-100-hover:hover{--x-start-color: var(--x-amber-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-200,.start-amber-200-hover:hover{--x-start-color: var(--x-amber-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-300,.start-amber-300-hover:hover{--x-start-color: var(--x-amber-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-400,.start-amber-400-hover:hover{--x-start-color: var(--x-amber-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-500,.start-amber-500-hover:hover{--x-start-color: var(--x-amber-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-600,.start-amber-600-hover:hover{--x-start-color: var(--x-amber-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-700,.start-amber-700-hover:hover{--x-start-color: var(--x-amber-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-800,.start-amber-800-hover:hover{--x-start-color: var(--x-amber-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-amber-900,.start-amber-900-hover:hover{--x-start-color: var(--x-amber-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-100,.start-lime-100-hover:hover{--x-start-color: var(--x-lime-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-200,.start-lime-200-hover:hover{--x-start-color: var(--x-lime-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-300,.start-lime-300-hover:hover{--x-start-color: var(--x-lime-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-400,.start-lime-400-hover:hover{--x-start-color: var(--x-lime-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-500,.start-lime-500-hover:hover{--x-start-color: var(--x-lime-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-600,.start-lime-600-hover:hover{--x-start-color: var(--x-lime-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-700,.start-lime-700-hover:hover{--x-start-color: var(--x-lime-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-800,.start-lime-800-hover:hover{--x-start-color: var(--x-lime-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-lime-900,.start-lime-900-hover:hover{--x-start-color: var(--x-lime-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-100,.start-emerald-100-hover:hover{--x-start-color: var(--x-emerald-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-200,.start-emerald-200-hover:hover{--x-start-color: var(--x-emerald-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-300,.start-emerald-300-hover:hover{--x-start-color: var(--x-emerald-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-400,.start-emerald-400-hover:hover{--x-start-color: var(--x-emerald-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-500,.start-emerald-500-hover:hover{--x-start-color: var(--x-emerald-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-600,.start-emerald-600-hover:hover{--x-start-color: var(--x-emerald-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-700,.start-emerald-700-hover:hover{--x-start-color: var(--x-emerald-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-800,.start-emerald-800-hover:hover{--x-start-color: var(--x-emerald-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-emerald-900,.start-emerald-900-hover:hover{--x-start-color: var(--x-emerald-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-100,.start-sky-100-hover:hover{--x-start-color: var(--x-sky-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-200,.start-sky-200-hover:hover{--x-start-color: var(--x-sky-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-300,.start-sky-300-hover:hover{--x-start-color: var(--x-sky-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-400,.start-sky-400-hover:hover{--x-start-color: var(--x-sky-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-500,.start-sky-500-hover:hover{--x-start-color: var(--x-sky-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-600,.start-sky-600-hover:hover{--x-start-color: var(--x-sky-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-700,.start-sky-700-hover:hover{--x-start-color: var(--x-sky-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-800,.start-sky-800-hover:hover{--x-start-color: var(--x-sky-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-sky-900,.start-sky-900-hover:hover{--x-start-color: var(--x-sky-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-100,.start-violet-100-hover:hover{--x-start-color: var(--x-violet-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-200,.start-violet-200-hover:hover{--x-start-color: var(--x-violet-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-300,.start-violet-300-hover:hover{--x-start-color: var(--x-violet-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-400,.start-violet-400-hover:hover{--x-start-color: var(--x-violet-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-500,.start-violet-500-hover:hover{--x-start-color: var(--x-violet-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-600,.start-violet-600-hover:hover{--x-start-color: var(--x-violet-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-700,.start-violet-700-hover:hover{--x-start-color: var(--x-violet-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-800,.start-violet-800-hover:hover{--x-start-color: var(--x-violet-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-violet-900,.start-violet-900-hover:hover{--x-start-color: var(--x-violet-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-100,.start-fuchsia-100-hover:hover{--x-start-color: var(--x-fuchsia-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-200,.start-fuchsia-200-hover:hover{--x-start-color: var(--x-fuchsia-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-300,.start-fuchsia-300-hover:hover{--x-start-color: var(--x-fuchsia-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-400,.start-fuchsia-400-hover:hover{--x-start-color: var(--x-fuchsia-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-500,.start-fuchsia-500-hover:hover{--x-start-color: var(--x-fuchsia-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-600,.start-fuchsia-600-hover:hover{--x-start-color: var(--x-fuchsia-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-700,.start-fuchsia-700-hover:hover{--x-start-color: var(--x-fuchsia-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-800,.start-fuchsia-800-hover:hover{--x-start-color: var(--x-fuchsia-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-fuchsia-900,.start-fuchsia-900-hover:hover{--x-start-color: var(--x-fuchsia-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-100,.start-rose-100-hover:hover{--x-start-color: var(--x-rose-100);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-200,.start-rose-200-hover:hover{--x-start-color: var(--x-rose-200);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-300,.start-rose-300-hover:hover{--x-start-color: var(--x-rose-300);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-400,.start-rose-400-hover:hover{--x-start-color: var(--x-rose-400);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-500,.start-rose-500-hover:hover{--x-start-color: var(--x-rose-500);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-600,.start-rose-600-hover:hover{--x-start-color: var(--x-rose-600);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-700,.start-rose-700-hover:hover{--x-start-color: var(--x-rose-700);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-800,.start-rose-800-hover:hover{--x-start-color: var(--x-rose-800);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.start-rose-900,.start-rose-900-hover:hover{--x-start-color: var(--x-rose-900);--x-gradient: var(--x-start-color), var(--x-end-color, rgba(0, 0, 0, 0))}.middle-white,.middle-white-hover:hover{--x-middle-color: var(--x-white);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 255, 255, 0))}.middle-black,.middle-black-hover:hover{--x-middle-color: var(--x-black);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 0, 0, 0))}.middle-gray-50,.middle-gray-50-hover:hover{--x-middle-color: var(--x-gray-50);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(250, 250, 250, 0))}.middle-gray-100,.middle-gray-100-hover:hover{--x-middle-color: var(--x-gray-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(245, 249, 252, 0))}.middle-gray-200,.middle-gray-200-hover:hover{--x-middle-color: var(--x-gray-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(231, 234, 240, 0))}.middle-gray-300,.middle-gray-300-hover:hover{--x-middle-color: var(--x-gray-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(207, 214, 223, 0))}.middle-gray-400,.middle-gray-400-hover:hover{--x-middle-color: var(--x-gray-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(171, 182, 197, 0))}.middle-gray-500,.middle-gray-500-hover:hover{--x-middle-color: var(--x-gray-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(136, 152, 169, 0))}.middle-gray-600,.middle-gray-600-hover:hover{--x-middle-color: var(--x-gray-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(107, 123, 147, 0))}.middle-gray-700,.middle-gray-700-hover:hover{--x-middle-color: var(--x-gray-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(82, 95, 127, 0))}.middle-gray-800,.middle-gray-800-hover:hover{--x-middle-color: var(--x-gray-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(45, 55, 72, 0))}.middle-gray-900,.middle-gray-900-hover:hover{--x-middle-color: var(--x-gray-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(22, 25, 44, 0))}.middle-blue-100,.middle-blue-100-hover:hover{--x-middle-color: var(--x-blue-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(204, 235, 255, 0))}.middle-blue-200,.middle-blue-200-hover:hover{--x-middle-color: var(--x-blue-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(153, 214, 255, 0))}.middle-blue-300,.middle-blue-300-hover:hover{--x-middle-color: var(--x-blue-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(102, 194, 255, 0))}.middle-blue-400,.middle-blue-400-hover:hover{--x-middle-color: var(--x-blue-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(51, 173, 255, 0))}.middle-blue-500,.middle-blue-500-hover:hover{--x-middle-color: var(--x-blue-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 153, 255, 0))}.middle-blue-600,.middle-blue-600-hover:hover{--x-middle-color: var(--x-blue-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 122, 204, 0))}.middle-blue-700,.middle-blue-700-hover:hover{--x-middle-color: var(--x-blue-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 92, 153, 0))}.middle-blue-800,.middle-blue-800-hover:hover{--x-middle-color: var(--x-blue-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 61, 102, 0))}.middle-blue-900,.middle-blue-900-hover:hover{--x-middle-color: var(--x-blue-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(0, 31, 51, 0))}.middle-indigo-100,.middle-indigo-100-hover:hover{--x-middle-color: var(--x-indigo-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(239, 204, 204, 0))}.middle-indigo-200,.middle-indigo-200-hover:hover{--x-middle-color: var(--x-indigo-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(223, 153, 153, 0))}.middle-indigo-300,.middle-indigo-300-hover:hover{--x-middle-color: var(--x-indigo-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(206, 102, 102, 0))}.middle-indigo-400,.middle-indigo-400-hover:hover{--x-middle-color: var(--x-indigo-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(190, 51, 51, 0))}.middle-indigo-500,.middle-indigo-500-hover:hover{--x-middle-color: var(--x-indigo-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(174, 0, 0, 0))}.middle-indigo-600,.middle-indigo-600-hover:hover{--x-middle-color: var(--x-indigo-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(139, 0, 0, 0))}.middle-indigo-700,.middle-indigo-700-hover:hover{--x-middle-color: var(--x-indigo-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(104, 0, 0, 0))}.middle-indigo-800,.middle-indigo-800-hover:hover{--x-middle-color: var(--x-indigo-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(70, 0, 0, 0))}.middle-indigo-900,.middle-indigo-900-hover:hover{--x-middle-color: var(--x-indigo-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(35, 0, 0, 0))}.middle-purple-100,.middle-purple-100-hover:hover{--x-middle-color: var(--x-purple-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(231, 221, 255, 0))}.middle-purple-200,.middle-purple-200-hover:hover{--x-middle-color: var(--x-purple-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(208, 188, 255, 0))}.middle-purple-300,.middle-purple-300-hover:hover{--x-middle-color: var(--x-purple-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(184, 154, 255, 0))}.middle-purple-400,.middle-purple-400-hover:hover{--x-middle-color: var(--x-purple-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(161, 121, 255, 0))}.middle-purple-500,.middle-purple-500-hover:hover{--x-middle-color: var(--x-purple-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(137, 87, 255, 0))}.middle-purple-600,.middle-purple-600-hover:hover{--x-middle-color: var(--x-purple-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(110, 70, 204, 0))}.middle-purple-700,.middle-purple-700-hover:hover{--x-middle-color: var(--x-purple-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(82, 52, 153, 0))}.middle-purple-800,.middle-purple-800-hover:hover{--x-middle-color: var(--x-purple-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(55, 35, 102, 0))}.middle-purple-900,.middle-purple-900-hover:hover{--x-middle-color: var(--x-purple-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(27, 17, 51, 0))}.middle-pink-100,.middle-pink-100-hover:hover{--x-middle-color: var(--x-pink-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 221, 235, 0))}.middle-pink-200,.middle-pink-200-hover:hover{--x-middle-color: var(--x-pink-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 188, 215, 0))}.middle-pink-300,.middle-pink-300-hover:hover{--x-middle-color: var(--x-pink-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 154, 194, 0))}.middle-pink-400,.middle-pink-400-hover:hover{--x-middle-color: var(--x-pink-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 121, 174, 0))}.middle-pink-500,.middle-pink-500-hover:hover{--x-middle-color: var(--x-pink-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 87, 154, 0))}.middle-pink-600,.middle-pink-600-hover:hover{--x-middle-color: var(--x-pink-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(204, 70, 123, 0))}.middle-pink-700,.middle-pink-700-hover:hover{--x-middle-color: var(--x-pink-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(153, 52, 92, 0))}.middle-pink-800,.middle-pink-800-hover:hover{--x-middle-color: var(--x-pink-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(102, 35, 62, 0))}.middle-pink-900,.middle-pink-900-hover:hover{--x-middle-color: var(--x-pink-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(51, 17, 31, 0))}.middle-magenta-100,.middle-magenta-100-hover:hover{--x-middle-color: var(--x-magenta-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(252, 214, 255, 0))}.middle-magenta-200,.middle-magenta-200-hover:hover{--x-middle-color: var(--x-magenta-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(248, 173, 255, 0))}.middle-magenta-300,.middle-magenta-300-hover:hover{--x-middle-color: var(--x-magenta-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(245, 133, 255, 0))}.middle-magenta-400,.middle-magenta-400-hover:hover{--x-middle-color: var(--x-magenta-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(241, 92, 255, 0))}.middle-magenta-500,.middle-magenta-500-hover:hover{--x-middle-color: var(--x-magenta-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(238, 51, 255, 0))}.middle-magenta-600,.middle-magenta-600-hover:hover{--x-middle-color: var(--x-magenta-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(190, 41, 204, 0))}.middle-magenta-700,.middle-magenta-700-hover:hover{--x-middle-color: var(--x-magenta-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(143, 31, 153, 0))}.middle-magenta-800,.middle-magenta-800-hover:hover{--x-middle-color: var(--x-magenta-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(95, 20, 102, 0))}.middle-magenta-900,.middle-magenta-900-hover:hover{--x-middle-color: var(--x-magenta-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(48, 10, 51, 0))}.middle-red-100,.middle-red-100-hover:hover{--x-middle-color: var(--x-red-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 214, 224, 0))}.middle-red-200,.middle-red-200-hover:hover{--x-middle-color: var(--x-red-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 173, 194, 0))}.middle-red-300,.middle-red-300-hover:hover{--x-middle-color: var(--x-red-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 133, 163, 0))}.middle-red-400,.middle-red-400-hover:hover{--x-middle-color: var(--x-red-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 92, 133, 0))}.middle-red-500,.middle-red-500-hover:hover{--x-middle-color: var(--x-red-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 51, 102, 0))}.middle-red-600,.middle-red-600-hover:hover{--x-middle-color: var(--x-red-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(204, 41, 82, 0))}.middle-red-700,.middle-red-700-hover:hover{--x-middle-color: var(--x-red-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(153, 31, 61, 0))}.middle-red-800,.middle-red-800-hover:hover{--x-middle-color: var(--x-red-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(102, 20, 41, 0))}.middle-red-900,.middle-red-900-hover:hover{--x-middle-color: var(--x-red-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(51, 10, 20, 0))}.middle-orange-100,.middle-orange-100-hover:hover{--x-middle-color: var(--x-orange-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 232, 204, 0))}.middle-orange-200,.middle-orange-200-hover:hover{--x-middle-color: var(--x-orange-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 209, 153, 0))}.middle-orange-300,.middle-orange-300-hover:hover{--x-middle-color: var(--x-orange-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 186, 102, 0))}.middle-orange-400,.middle-orange-400-hover:hover{--x-middle-color: var(--x-orange-400);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 163, 51, 0))}.middle-orange-500,.middle-orange-500-hover:hover{--x-middle-color: var(--x-orange-500);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 140, 0, 0))}.middle-orange-600,.middle-orange-600-hover:hover{--x-middle-color: var(--x-orange-600);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(204, 112, 0, 0))}.middle-orange-700,.middle-orange-700-hover:hover{--x-middle-color: var(--x-orange-700);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(153, 84, 0, 0))}.middle-orange-800,.middle-orange-800-hover:hover{--x-middle-color: var(--x-orange-800);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(102, 56, 0, 0))}.middle-orange-900,.middle-orange-900-hover:hover{--x-middle-color: var(--x-orange-900);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(51, 28, 0, 0))}.middle-yellow-100,.middle-yellow-100-hover:hover{--x-middle-color: var(--x-yellow-100);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 241, 204, 0))}.middle-yellow-200,.middle-yellow-200-hover:hover{--x-middle-color: var(--x-yellow-200);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 228, 153, 0))}.middle-yellow-300,.middle-yellow-300-hover:hover{--x-middle-color: var(--x-yellow-300);--x-gradient: var(--x-start-color), var(--x-middle-color), var(--x-end-color, rgba(255, 214, 102, 0))}.middle-yellow-400,