\n\n\n\n \n \n\n\n\n\n" " Quotation Marks - \"\n& & Ampersand - &\n< < Less than sign - <\n> > Greater than sign - >\n Non-breaking space \n© © Copyright Symbol - ©\n@ Ü @ symbol - @\n• ö Small bullet - .\n™ û Trademark Symbol - ™\n"
},
{
"path": "frontend/react.js",
"content": "/* *******************************************************************************************\n * REACT.JS CHEATSHEET\n * DOCUMENTATION: https://reactjs.org/docs/\n * FILE STRUCTURE: https://reactjs.org/docs/faq-structure.html\n * ******************************************************************************************* */\n\n\n```\nnpm install --save react // declarative and flexible JavaScript library for building UI\nnpm install --save react-dom // serves as the entry point of the DOM-related rendering paths\nnpm install --save prop-types // runtime type checking for React props and similar objects\n```\n\n// notes: don't forget the command lines\n\n\n/* *******************************************************************************************\n * REACT\n * https://reactjs.org/docs/react-api.html\n * ******************************************************************************************* */\n\n\n// Create and return a new React element of the given type.\n// Code written with JSX will be converted to use React.createElement().\n// You will not typically invoke React.createElement() directly if you are using JSX.\nReact.createElement(\n type,\n [props],\n [...children]\n)\n\n// Clone and return a new React element using element as the starting point.\n// The resulting element will have the original element’s props with the new props merged in shallowly.\nReact.cloneElement(\n element,\n [props],\n [...children]\n)\n\n// Verifies the object is a React element. Returns true or false.\nReact.isValidElement(object)\n\nReact.Children // provides utilities for dealing with the this.props.children opaque data structure.\n\n// Invokes a function on every immediate child contained within children with this set to thisArg.\nReact.Children.map(children, function[(thisArg)])\n\n// Like React.Children.map() but does not return an array.\nReact.Children.forEach(children, function[(thisArg)])\n\n// Returns the total number of components in children,\n// equal to the number of times that a callback passed to map or forEach would be invoked.\nReact.Children.count(children)\n\n// Verifies that children has only one child (a React element) and returns it.\n// Otherwise this method throws an error.\nReact.Children.only(children)\n\n// Returns the children opaque data structure as a flat array with keys assigned to each child.\n// Useful if you want to manipulate collections of children in your render methods,\n// especially if you want to reorder or slice this.props.children before passing it down.\nReact.Children.toArray(children)\n\n// The React.Fragment component lets you return multiple elements in a render() method without creating an additional DOM element\n// You can also use it with the shorthand <> syntax.\nReact.Fragment\n\n\n/* *******************************************************************************************\n * REACT.COMPONENT\n * React.Component is an abstract base class, so it rarely makes sense to refer to React.Component\n * directly. Instead, you will typically subclass it, and define at least a render() method.\n * https://reactjs.org/docs/react-component.html\n * ******************************************************************************************* */\n\n\nclass Component extends React.Component {\n // Will be called before it is mounted\n constructor(props) {\n // Call this method before any other statement\n // or this.props will be undefined in the constructor\n super(props);\n\n // The constructor is also often used to bind event handlers to the class instance.\n // Binding makes sure the method has access to component attributes like this.props and this.state\n this.method = this.method.bind(this);\n\n // The constructor is the right place to initialize state. \n this.state = {\n active: true,\n\n // In rare cases, it’s okay to initialize state based on props.\n // This effectively “forks” the props and sets the state with the initial props.\n // If you “fork” props by using them for state, you might also want to implement componentWillReceiveProps(nextProps)\n // to keep the state up-to-date with them. But lifting state up is often easier and less bug-prone.\n color: props.initialColor\n };\n }\n\n // Enqueues changes to the component state and\n // tells React that this component and its children need to be re-rendered with the updated state.\n // setState() does not always immediately update the component. It may batch or defer the update until later.\n // This makes reading this.state right after calling setState() a potential pitfall.\n // Instead, use componentDidUpdate or a setState callback.\n // You may optionally pass an object as the first argument to setState() instead of a function.\n setState(updater[, callback]) { }\n\n // Invoked just before mounting occurs (before render())\n // This is the only lifecycle hook called on server rendering.\n componentWillMount() { }\n\n // Invoked immediately after a component is mounted.\n // Initialization that requires DOM nodes should go here.\n // If you need to load data from a remote endpoint, this is a good place to instantiate the network request.\n // This method is a good place to set up any subscriptions. If you do that, don’t forget to unsubscribe in componentWillUnmount().\n componentDidMount() { }\n\n // Invoked before a mounted component receives new props.\n // If you need to update the state in response to prop changes (for example, to reset it),\n // you may compare this.props and nextProps and perform state transitions using this.setState() in this method.\n componentWillReceiveProps(nextProps) { }\n\n // Let React know if a component’s output is not affected by the current change in state or props.\n // The default behavior is to re-render on every state change, and in the vast majority of cases you should rely on the default behavior.\n // shouldComponentUpdate() is invoked before rendering when new props or state are being received. Defaults to true.\n // This method is not called for the initial render or when forceUpdate() is used.\n // Returning false does not prevent child components from re-rendering when their state changes.\n shouldComponentUpdate(nextProps, nextState) { }\n\n // Invoked just before rendering when new props or state are being received.\n // Use this as an opportunity to perform preparation before an update occurs. This method is not called for the initial render.\n // Note that you cannot call this.setState() here; nor should you do anything else\n // (e.g. dispatch a Redux action) that would trigger an update to a React component before componentWillUpdate() returns.\n // If you need to update state in response to props changes, use componentWillReceiveProps() instead.\n componentWillUpdate(nextProps, nextState) { }\n\n // Invoked immediately after updating occurs. This method is not called for the initial render.\n // Use this as an opportunity to operate on the DOM when the component has been updated.\n // This is also a good place to do network requests as long as you compare the current props to previous props (e.g. a network request may not be necessary if the props have not changed).\n componentDidUpdate(prevProps, prevState) { }\n\n // Invoked immediately before a component is unmounted and destroyed.\n // Perform any necessary cleanup in this method, such as invalidating timers, canceling network requests,\n // or cleaning up any subscriptions that were created in componentDidMount().\n componentWillUnmount() { }\n\n // Error boundaries are React components that catch JavaScript errors anywhere in their child component tree,\n // log those errors, and display a fallback UI instead of the component tree that crashed.\n // Error boundaries catch errors during rendering, in lifecycle methods, and in constructors of the whole tree below them.\n componentDidCatch() { }\n\n // This method is required.\n // It should be pure, meaning that it does not modify component state,\n // it returns the same result each time it’s invoked, and\n // it does not directly interact with the browser (use lifecycle methods for this)\n // It must return one of the following types: react elements, string and numbers, portals, null or booleans.\n render() {\n // Contains the props that were defined by the caller of this component.\n console.log(this.props);\n\n // Contains data specific to this component that may change over time.\n // The state is user-defined, and it should be a plain JavaScript object.\n // If you don’t use it in render(), it shouldn’t be in the state.\n // For example, you can put timer IDs directly on the instance.\n // Never mutate this.state directly, as calling setState() afterwards may replace the mutation you made.\n // Treat this.state as if it were immutable.\n console.log(this.state);\n\n return (\n \n {/* Comment goes here */}\n Hello, {this.props.name}!\n
\n );\n }\n}\n\n// Can be defined as a property on the component class itself, to set the default props for the class.\n// This is used for undefined props, but not for null props.\nComponent.defaultProps = {\n color: 'blue'\n};\n\ncomponent = new Component();\n\n// By default, when your component’s state or props change, your component will re-render.\n// If your render() method depends on some other data, you can tell React that the component needs re-rendering by calling forceUpdate().\n// Normally you should try to avoid all uses of forceUpdate() and only read from this.props and this.state in render().\ncomponent.forceUpdate(callback)\n\n\n/* *******************************************************************************************\n * REACT.DOM\n * The react-dom package provides DOM-specific methods that can be used at the top level of\n * your app and as an escape hatch to get outside of the React model if you need to.\n * Most of your components should not need to use this module.\n * https://reactjs.org/docs/react-dom.html\n * ******************************************************************************************* */\n\n\n// Render a React element into the DOM in the supplied container and return a reference\n// to the component (or returns null for stateless components).\nReactDOM.render(element, container[, callback])\n\n// Same as render(), but is used to hydrate a container whose HTML contents were rendered\n// by ReactDOMServer. React will attempt to attach event listeners to the existing markup.\nReactDOM.hydrate(element, container[, callback])\n\n// Remove a mounted React component from the DOM and clean up its event handlers and state.\n// If no component was mounted in the container, calling this function does nothing.\n// Returns true if a component was unmounted and false if there was no component to unmount.\nReactDOM.unmountComponentAtNode(container)\n\n// If this component has been mounted into the DOM, this returns the corresponding native browser\n// DOM element. This method is useful for reading values out of the DOM, such as form field values\n// and performing DOM measurements. In most cases, you can attach a ref to the DOM node and avoid\n// using findDOMNode at all.\nReactDOM.findDOMNode(component)\n\n// Creates a portal. Portals provide a way to render children into a DOM node that exists outside\n// the hierarchy of the DOM component.\nReactDOM.createPortal(child, container)\n\n\n/* *******************************************************************************************\n * REACTDOMSERVER\n * The ReactDOMServer object enables you to render components to static markup.\n * https://reactjs.org/docs/react-dom.html\n * ******************************************************************************************* */\n\n\n// Render a React element to its initial HTML. React will return an HTML string.\n// You can use this method to generate HTML on the server and send the markup down on the initial\n// request for faster page loads and to allow search engines to crawl your pages for SEO purposes.\nReactDOMServer.renderToString(element)\n\n// Similar to renderToString, except this doesn’t create extra DOM attributes that React uses\n// internally, such as data-reactroot. This is useful if you want to use React as a simple static\n// page generator, as stripping away the extra attributes can save some bytes.\nReactDOMServer.renderToStaticMarkup(element)\n\n// Render a React element to its initial HTML. Returns a Readable stream that outputs an HTML string.\n// The HTML output by this stream is exactly equal to what ReactDOMServer.renderToString would return.\n// You can use this method to generate HTML on the server and send the markup down on the initial\n// request for faster page loads and to allow search engines to crawl your pages for SEO purposes.\nReactDOMServer.renderToNodeStream(element)\n\n// Similar to renderToNodeStream, except this doesn’t create extra DOM attributes that React uses\n// internally, such as data-reactroot. This is useful if you want to use React as a simple static\n// page generator, as stripping away the extra attributes can save some bytes.\nReactDOMServer.renderToStaticNodeStream(element)\n\n\n/* *******************************************************************************************\n * TYPECHECKING WITH PROPTYPES\n * https://reactjs.org/docs/typechecking-with-proptypes.html\n * ******************************************************************************************* */\n\n\nimport PropTypes from 'prop-types';\n\nMyComponent.propTypes = {\n // You can declare that a prop is a specific JS type. By default, these\n // are all optional.\n optionalArray: PropTypes.array,\n optionalBool: PropTypes.bool,\n optionalFunc: PropTypes.func,\n optionalNumber: PropTypes.number,\n optionalObject: PropTypes.object,\n optionalString: PropTypes.string,\n optionalSymbol: PropTypes.symbol,\n\n // Anything that can be rendered: numbers, strings, elements or an array\n // (or fragment) containing these types.\n optionalNode: PropTypes.node,\n\n // A React element.\n optionalElement: PropTypes.element,\n\n // You can also declare that a prop is an instance of a class. This uses\n // JS's instanceof operator.\n optionalMessage: PropTypes.instanceOf(Message),\n\n // You can ensure that your prop is limited to specific values by treating\n // it as an enum.\n optionalEnum: PropTypes.oneOf(['News', 'Photos']),\n\n // An object that could be one of many types\n optionalUnion: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.number,\n PropTypes.instanceOf(Message)\n ]),\n\n // An array of a certain type\n optionalArrayOf: PropTypes.arrayOf(PropTypes.number),\n\n // An object with property values of a certain type\n optionalObjectOf: PropTypes.objectOf(PropTypes.number),\n\n // An object taking on a particular shape\n optionalObjectWithShape: PropTypes.shape({\n color: PropTypes.string,\n fontSize: PropTypes.number\n }),\n\n // You can chain any of the above with `isRequired` to make sure a warning\n // is shown if the prop isn't provided.\n requiredFunc: PropTypes.func.isRequired,\n\n // A value of any data type\n requiredAny: PropTypes.any.isRequired,\n\n // You can also specify a custom validator. It should return an Error\n // object if the validation fails. Don't `console.warn` or throw, as this\n // won't work inside `oneOfType`.\n customProp: function(props, propName, componentName) {\n if (!/matchme/.test(props[propName])) {\n return new Error(\n 'Invalid prop `' + propName + '` supplied to' +\n ' `' + componentName + '`. Validation failed.'\n );\n }\n },\n\n // You can also supply a custom validator to `arrayOf` and `objectOf`.\n // It should return an Error object if the validation fails. The validator\n // will be called for each key in the array or object. The first two\n // arguments of the validator are the array or object itself, and the\n // current item's key.\n customArrayProp: PropTypes.arrayOf(function(propValue, key, componentName, location, propFullName) {\n if (!/matchme/.test(propValue[key])) {\n return new Error(\n 'Invalid prop `' + propFullName + '` supplied to' +\n ' `' + componentName + '`. Validation failed.'\n );\n }\n })\n};\n"
},
{
"path": "frontend/tailwind.css",
"content": "/* *******************************************************************************************\n * TAILWIND.CSS\n * DOCUMENTATION: https://tailwindcss.com/\n * ******************************************************************************************* */\n\n/*\n * Available breakpoints\n * --------------------\n * sm: min-width: 640px;\n * md: min-width: 768px;\n * lg: min-width: 1024px;\n * xl: min-width: 1280px;\n */\n\n/* *******************************************************************************************\n* LAYOUT\n* ******************************************************************************************* */\n\n/*\n * Container\n * --------------------\n * A component for fixing an element's width to the current breakpoint.\n */\n\n .container\n\n/*\n * Box-sizing\n * --------------------\n * Utilities for controlling how the browser should calculate an element's total size.\n * By default, only responsive variants are generated for box-sizing utilities.\n */\n \n .box-border /* box-sizing: border-box; */\n .box-content /* box-sizing: content-box; */\n \n/*\n * Display\n * --------------------\n * Utilities for controlling the display box type of an element.\n * By default, only responsive variants are generated for display utilities.\n */\n \n .hidden /* display: none; */\n .block /* display: block; */\n .inline-block /* display: inline-block; */\n .inline /* display: inline; */\n .flex /* display: flex; */\n .inline-flex /* display: inline-flex; */\n .grid /* display: grid; */\n .table /* display: table; */\n .table-caption /* display: table-caption; */\n .table-cell /* display: table-cell; */\n .table-column /* display: table-column; */\n .table-column-group /* display: table-column-group; */\n .table-footer-group /* display: table-footer-group; */\n .table-header-group /* display: table-header-group; */\n .table-row-group /* display: table-row-group; */\n .table-row /* display: table-row; */\n \n/*\n * Floats\n * --------------------\n * Utilities for controlling the wrapping of content around an element.\n * By default, only responsive variants are generated for float utilities.\n */\n \n .float-right /* float: right; */\n .float-left /* float: left; */\n .float-none /* float: none; */\n .clearfix /* &::after { content: \"\"; display: table; clear: both; } */\n \n/*\n * Clear\n * --------------------\n * Utilities for controlling the wrapping of content around an element.\n * By default, only responsive variants are generated for clear utilities.\n */\n \n .clear-left /* clear: left; */\n .clear-right /* clear: right; */\n .clear-both /* clear: both; */\n \n/*\n * Object Fit\n * --------------------\n * Utilities for controlling how a replaced element's content should be resized.\n * By default, only responsive variants are generated for object-fit utilities.\n */\n \n .object-contain /* object-fit: contain; */\n .object-cover /* object-fit: cover; */\n .object-fill /* object-fit: fill; */\n .object-none /* object-fit: none; */\n .object-scale-down /* object-fit: scale-down; */\n \n/*\n * Object Position\n * --------------------\n * Utilities for controlling how a replaced element's content should be positioned within its container.\n * By default, only responsive variants are generated for object position utilities.\n */\n \n.object-bottom /* object-position: bottom; */\n.object-center /* object-position: center; */\n.object-left /* object-position: left; */\n.object-left-bottom /* object-position: left bottom; */\n.object-left-top /* object-position: left top; */\n.object-right /* object-position: right; */\n.object-right-bottom /* object-position: right bottom; */\n.object-right-top /* object-position: right top; */\n.object-top /* object-position: top; */\n \n/*\n * Overflow\n * --------------------\n * Utilities for controlling how an element handles content that is too large for the container.\n * By default, only responsive variants are generated for overflow utilities.\n */\n \n.overflow-auto /* overflow: auto; */\n.overflow-hidden /* overflow: hidden; */\n.overflow-visible /* overflow: visible; */\n.overflow-scroll /* overflow: scroll; */\n.overflow-x-auto /* overflow-x: auto; */\n.overflow-y-auto /* overflow-y: auto; */\n.overflow-x-hidden /* overflow-x: hidden; */\n.overflow-y-hidden /* overflow-y: hidden; */\n.overflow-x-visible /* overflow-x: visible; */\n.overflow-y-visible /* overflow-y: visible; */\n.overflow-x-scroll /* overflow-x: scroll; */\n.overflow-y-scroll /* overflow-y: scroll; */\n.scrolling-touch /* -webkit-overflow-scrolling: touch; */\n.scrolling-auto /* -webkit-overflow-scrolling: auto; */\n \n/*\n * Position\n * --------------------\n * Utilities for controlling how an element is positioned in the DOM.\n * By default, only responsive variants are generated for position utilities.\n */\n\n.static /* position: static; */\n.fixed /* position: fixed; */\n.absolute /* position: absolute; */\n.relative /* position: relative; */\n.sticky /* position: sticky; */\n\n/*\n * Top / Right / Bottom / Left\n * --------------------\n * Utilities for controlling the placement of positioned elements.\n * By default, only responsive variants are generated for top, right, bottom, left, and inset utilities.\n */\n\n.inset-0 /* top: 0; right: 0; bottom: 0; left: 0; */\n.inset-y-0 /* top: 0; bottom: 0; */\n.inset-x-0 /* right: 0; left: 0; */\n.top-0 /* top: 0; */\n.right-0 /* right: 0; */\n.bottom-0 /* bottom: 0; */\n.left-0 /* left: 0; */\n.inset-auto /* top: auto; right: auto; bottom: auto; left: auto; */\n.inset-y-auto /* top: auto; bottom: auto; */\n.inset-x-auto /* left: auto; right: auto; */\n.top-auto /* top: auto; */\n.bottom-auto /* bottom: auto; */\n.left-auto /* left: auto; */\n.right-auto /* right: auto; */\n\n/*\n * Visibility\n * --------------------\n * Utilities for controlling the visibility of an element.\n * By default, only responsive variants are generated for visibility utilities.\n */\n\n.visible /* visibility: visible; */\n.invisible /* visibility: hidden; */\n\n/*\n * Z-Index\n * --------------------\n * Utilities for controlling the stack order of an element.\n * By default, only responsive variants are generated for z-index utilities.\n */\n\n.z-0 /* z-index: 0; */\n.z-10 /* z-index: 10; */\n.z-20 /* z-index: 20; */\n.z-30 /* z-index: 30; */\n.z-40 /* z-index: 40; */\n.z-50 /* z-index: 50; */\n.z-auto /* z-index: auto; */\n\n/* *******************************************************************************************\n * FLEXBOX\n * ******************************************************************************************* */\n\n.flex /* display: flex; */\n.inline-flex /* display: inline-flex; */\n\n/*\n * Flex Direction\n * --------------------\n * Utilities for controlling the direction of flex items.\n * By default, only responsive variants are generated for flex-direction utilities.\n */\n\n.flex-row /* flex-direction: row; */\n.flex-row-reverse /* flex-direction: row-reverse; */\n.flex-col /* flex-direction: column; */\n.flex-col-reverse /* flex-direction: column-reverse; */\n\n/*\n * Flex Wrap\n * --------------------\n * Utilities for controlling how flex items wrap.\n * By default, only responsive variants are generated for flex-wrap utilities.\n */\n\n.flex-no-wrap /* flex-wrap: nowrap; */\n.flex-wrap /* flex-wrap: wrap; */\n.flex-wrap-reverse /* flex-wrap: wrap-reverse; */\n\n/*\n * Align Items\n * --------------------\n * Utilities for controlling how flex items are positioned along a container's cross axis.\n * By default, only responsive variants are generated for align-items utilities.\n */\n\n.items-stretch /* align-items: stretch; */\n.items-start /* align-items: flex-start; */\n.items-center /* align-items: center; */\n.items-end /* align-items: flex-end; */\n.items-baseline /* align-items: baseline; */\n\n/*\n * Align Content\n * --------------------\n * Utilities for controlling how lines are positioned in multi-line flex containers.\n * By default, only responsive variants are generated for align-content utilities.\n */\n\n.content-start /* align-content: flex-start; */\n.content-center /* align-content: center; */\n.content-end /* align-content: flex-end; */\n.content-between /* align-content: space-between; */\n.content-around /* align-content: space-around; */\n\n/*\n * Align Self\n * --------------------\n * Utilities for controlling how an individual flex item is positioned along its container's cross axis.\n * By default, only responsive variants are generated for align-self utilities.\n */\n\n.self-auto /* align-self: auto; */\n.self-start /* align-self: flex-start; */\n.self-center /* align-self: center; */\n.self-end /* align-self: flex-end; */\n.self-stretch /* align-self: stretch; */\n\n/*\n * Justify Content\n * --------------------\n * Utilities for controlling how flex items are positioned along a container's main axis.\n * By default, only responsive variants are generated for justify-content utilities.\n */\n\n.justify-start /* justify-content: flex-start; */\n.justify-center /* justify-content: center; */\n.justify-end /* justify-content: flex-end; */\n.justify-between /* justify-content: space-between; */\n.justify-around /* justify-content: space-around; */\n\n/*\n * Flex\n * --------------------\n * Utilities for controlling how flex items both grow and shrink.\n * By default, only responsive variants are generated for flex utilities.\n */\n\n.flex-initial /* flex: 0 1 auto; */\n.flex-1 /* flex: 1 1 0%; */\n.flex-auto /* flex: 1 1 auto; */\n.flex-none /* flex: none; */\n\n/*\n * Flex Grow\n * --------------------\n * Utilities for controlling how flex items grow.\n * By default, only responsive variants are generated for flex grow utilities.\n */\n\n.flex-grow /* flex-grow: 1; */\n.flex-grow-0 /* flex-grow: 0; */\n\n/*\n * Flex Shrink\n * --------------------\n * Utilities for controlling how flex items shrink.\n * By default, only responsive variants are generated for flex shrink utilities.\n */\n\n.flex-shrink /* flex-shrink: 1; */\n.flex-shrink-0 /* flex-shrink: 0; */\n\n/*\n * Order\n * --------------------\n * Utilities for controlling the order of flex items.\n * By default, only responsive variants are generated for order utilities.\n */\n\n.order-first /* order: -9999; */\n.order-last /* order: 9999; */\n.order-none /* order: 0; */\n.order-1 /* order: 1; */\n.order-2 /* order: 2; */\n.order-3 /* order: 3; */\n.order-4 /* order: 4; */\n.order-5 /* order: 5; */\n.order-6 /* order: 6; */\n.order-7 /* order: 7; */\n.order-8 /* order: 8; */\n.order-9 /* order: 9; */\n.order-10 /* order: 10; */\n.order-11 /* order: 11; */\n.order-12 /* order: 12; */\n\n/* *******************************************************************************************\n * GRID\n * ******************************************************************************************* */\n\n.grid /* display: grid; */\n\n/*\n * Grid Template Columns\n * --------------------\n * Utilities for specifying the columns in a grid layout.\n * By default, only responsive variants are generated for grid-template-columns utilities.\n */\n\n.grid-cols-1 /* grid-template-columns: repeat(1, minmax(0, 1fr)); */\n.grid-cols-2 /* grid-template-columns: repeat(2, minmax(0, 1fr)); */\n.grid-cols-3 /* grid-template-columns: repeat(3, minmax(0, 1fr)); */\n.grid-cols-4 /* grid-template-columns: repeat(4, minmax(0, 1fr)); */\n.grid-cols-5 /* grid-template-columns: repeat(5, minmax(0, 1fr)); */\n.grid-cols-6 /* grid-template-columns: repeat(6, minmax(0, 1fr)); */\n.grid-cols-7 /* grid-template-columns: repeat(7, minmax(0, 1fr)); */\n.grid-cols-8 /* grid-template-columns: repeat(8, minmax(0, 1fr)); */\n.grid-cols-9 /* grid-template-columns: repeat(9, minmax(0, 1fr)); */\n.grid-cols-10 /* grid-template-columns: repeat(10, minmax(0, 1fr)); */\n.grid-cols-11 /* grid-template-columns: repeat(11, minmax(0, 1fr)); */\n.grid-cols-12 /* grid-template-columns: repeat(12, minmax(0, 1fr)); */\n.grid-cols-none /* grid-template-columns: none; */\n\n/*\n * Grid Column Start / End\n * --------------------\n * Utilities for controlling how elements are sized and placed across grid columns.\n * By default, only responsive variants are generated for grid-column utilities.\n */\n\n.col-auto /* grid-column: auto; */\n.col-span-1 /* grid-column: span 1 / span 1; */\n.col-span-2 /* grid-column: span 2 / span 2; */\n.col-span-3 /* grid-column: span 3 / span 3; */\n.col-span-4 /* grid-column: span 4 / span 4; */\n.col-span-5 /* grid-column: span 5 / span 5; */\n.col-span-6 /* grid-column: span 6 / span 6; */\n.col-span-7 /* grid-column: span 7 / span 7; */\n.col-span-8 /* grid-column: span 8 / span 8; */\n.col-span-9 /* grid-column: span 9 / span 9; */\n.col-span-10 /* grid-column: span 10 / span 10; */\n.col-span-11 /* grid-column: span 11 / span 11; */\n.col-span-12 /* grid-column: span 12 / span 12; */\n.col-start-1 /* grid-column-start: 1; */\n.col-start-2 /* grid-column-start: 2; */\n.col-start-3 /* grid-column-start: 3; */\n.col-start-4 /* grid-column-start: 4; */\n.col-start-5 /* grid-column-start: 5; */\n.col-start-6 /* grid-column-start: 6; */\n.col-start-7 /* grid-column-start: 7; */\n.col-start-8 /* grid-column-start: 8; */\n.col-start-9 /* grid-column-start: 9; */\n.col-start-10 /* grid-column-start: 10; */\n.col-start-11 /* grid-column-start: 11; */\n.col-start-12 /* grid-column-start: 12; */\n.col-start-13 /* grid-column-start: 13; */\n.col-start-auto /* grid-column-start: auto; */\n.col-end-1 /* grid-column-end: 1; */\n.col-end-2 /* grid-column-end: 2; */\n.col-end-3 /* grid-column-end: 3; */\n.col-end-4 /* grid-column-end: 4; */\n.col-end-5 /* grid-column-end: 5; */\n.col-end-6 /* grid-column-end: 6; */\n.col-end-7 /* grid-column-end: 7; */\n.col-end-8 /* grid-column-end: 8; */\n.col-end-9 /* grid-column-end: 9; */\n.col-end-10 /* grid-column-end: 10; */\n.col-end-11 /* grid-column-end: 11; */\n.col-end-12 /* grid-column-end: 12; */\n.col-end-13 /* grid-column-end: 13; */\n.col-end-auto /* grid-column-end: auto; */\n\n/*\n * Grid Template Rows\n * --------------------\n * Utilities for specifying the rows in a grid layout.\n * By default, only responsive variants are generated for grid-template-rows utilities.\n */\n\n.grid-rows-1 /* grid-template-rows: repeat(1, minmax(0, 1fr)); */\n.grid-rows-2 /* grid-template-rows: repeat(2, minmax(0, 1fr)); */\n.grid-rows-3 /* grid-template-rows: repeat(3, minmax(0, 1fr)); */\n.grid-rows-4 /* grid-template-rows: repeat(4, minmax(0, 1fr)); */\n.grid-rows-5 /* grid-template-rows: repeat(5, minmax(0, 1fr)); */\n.grid-rows-6 /* grid-template-rows: repeat(6, minmax(0, 1fr)); */\n.grid-rows-none /* grid-template-rows: none; */\n\n/*\n * Grid Row Start / End\n * --------------------\n * Utilities for controlling how elements are sized and placed across grid rows.\n * By default, only responsive variants are generated for grid-row utilities.\n */\n\n.row-auto /* grid-row: auto; */\n.row-span-1 /* grid-row: span 1 / span 1; */\n.row-span-2 /* grid-row: span 2 / span 2; */\n.row-span-3 /* grid-row: span 3 / span 3; */\n.row-span-4 /* grid-row: span 4 / span 4; */\n.row-span-5 /* grid-row: span 5 / span 5; */\n.row-span-6 /* grid-row: span 6 / span 6; */\n.row-start-1 /* grid-row-start: 1; */\n.row-start-2 /* grid-row-start: 2; */\n.row-start-3 /* grid-row-start: 3; */\n.row-start-4 /* grid-row-start: 4; */\n.row-start-5 /* grid-row-start: 5; */\n.row-start-6 /* grid-row-start: 6; */\n.row-start-7 /* grid-row-start: 7; */\n.row-start-auto /* grid-row-start: auto; */\n.row-end-1 /* grid-row-end: 1; */\n.row-end-2 /* grid-row-end: 2; */\n.row-end-3 /* grid-row-end: 3; */\n.row-end-4 /* grid-row-end: 4; */\n.row-end-5 /* grid-row-end: 5; */\n.row-end-6 /* grid-row-end: 6; */\n.row-end-7 /* grid-row-end: 7; */\n.row-end-auto /* grid-row-end: auto; */\n\n/*\n * Gap\n * --------------------\n * Utilities for controlling gutters between grid rows and columns.\n * By default, no responsive, hover, focus, active, or group-hover variants are generated for gap utilities.\n */\n\n.gap-0 /* gap: 0; */\n.gap-1 /* gap: 0.25rem; */\n.gap-2 /* gap: 0.5rem; */\n.gap-3 /* gap: 0.75rem; */\n.gap-4 /* gap: 1rem; */\n.gap-5 /* gap: 1.25rem; */\n.gap-6 /* gap: 1.5rem; */\n.gap-8 /* gap: 2rem; */\n.gap-10 /* gap: 2.5rem; */\n.gap-12 /* gap: 3rem; */\n.gap-16 /* gap: 4rem; */\n.gap-20 /* gap: 5rem; */\n.gap-24 /* gap: 6rem; */\n.gap-32 /* gap: 8rem; */\n.gap-40 /* gap: 10rem; */\n.gap-48 /* gap: 12rem; */\n.gap-56 /* gap: 14rem; */\n.gap-64 /* gap: 16rem; */\n.gap-px /* gap: 1px; */\n.row-gap-0 /* row-gap: 0; */\n.row-gap-1 /* row-gap: 0.25rem; */\n.row-gap-2 /* row-gap: 0.5rem; */\n.row-gap-3 /* row-gap: 0.75rem; */\n.row-gap-4 /* row-gap: 1rem; */\n.row-gap-5 /* row-gap: 1.25rem; */\n.row-gap-6 /* row-gap: 1.5rem; */\n.row-gap-8 /* row-gap: 2rem; */\n.row-gap-10 /* row-gap: 2.5rem; */\n.row-gap-12 /* row-gap: 3rem; */\n.row-gap-16 /* row-gap: 4rem; */\n.row-gap-20 /* row-gap: 5rem; */\n.row-gap-24 /* row-gap: 6rem; */\n.row-gap-32 /* row-gap: 8rem; */\n.row-gap-40 /* row-gap: 10rem; */\n.row-gap-48 /* row-gap: 12rem; */\n.row-gap-56 /* row-gap: 14rem; */\n.row-gap-64 /* row-gap: 16rem; */\n.row-gap-px /* row-gap: 1px; */\n.col-gap-0 /* column-gap: 0; */\n.col-gap-1 /* column-gap: 0.25rem; */\n.col-gap-2 /* column-gap: 0.5rem; */\n.col-gap-3 /* column-gap: 0.75rem; */\n.col-gap-4 /* column-gap: 1rem; */\n.col-gap-5 /* column-gap: 1.25rem; */\n.col-gap-6 /* column-gap: 1.5rem; */\n.col-gap-8 /* column-gap: 2rem; */\n.col-gap-10 /* column-gap: 2.5rem; */\n.col-gap-12 /* column-gap: 3rem; */\n.col-gap-16 /* column-gap: 4rem; */\n.col-gap-20 /* column-gap: 5rem; */\n.col-gap-24 /* column-gap: 6rem; */\n.col-gap-32 /* column-gap: 8rem; */\n.col-gap-40 /* column-gap: 10rem; */\n.col-gap-48 /* column-gap: 12rem; */\n.col-gap-56 /* column-gap: 14rem; */\n.col-gap-64 /* column-gap: 16rem; */\n.col-gap-px /* column-gap: 1px; */\n\n/*\n * Grid Auto Flow\n * --------------------\n * Utilities for controlling how elements in a grid are auto-placed.\n * By default, only responsive variants are generated for grid-auto-flow utilities.\n */\n\n.grid-flow-row /* grid-auto-flow: row; */\n.grid-flow-col /* grid-auto-flow: column; */\n.grid-flow-row-dense /* grid-auto-flow: row dense; */\n.grid-flow-col-dense /* grid-auto-flow: column dense; */\n\n/* *******************************************************************************************\n * SPACING\n * ******************************************************************************************* */\n \n/*\n * Padding\n * --------------------\n * Utilities for controlling an element's padding.\n * By default, only responsive variants are generated for padding utilities.\n */\n\n.p-0 /* padding: 0; */\n.p-1 /* padding: 0.25rem; */\n.p-2 /* padding: 0.5rem; */\n.p-3 /* padding: 0.75rem; */\n.p-4 /* padding: 1rem; */\n.p-5 /* padding: 1.25rem; */\n.p-6 /* padding: 1.5rem; */\n.p-8 /* padding: 2rem; */\n.p-10 /* padding: 2.5rem; */\n.p-12 /* padding: 3rem; */\n.p-16 /* padding: 4rem; */\n.p-20 /* padding: 5rem; */\n.p-24 /* padding: 6rem; */\n.p-32 /* padding: 8rem; */\n.p-40 /* padding: 10rem; */\n.p-48 /* padding: 12rem; */\n.p-56 /* padding: 14rem; */\n.p-64 /* padding: 16rem; */\n.p-px /* padding: 1px; */\n.py-0 /* padding-top: 0; padding-bottom: 0; */\n.py-1 /* padding-top: 0.25rem; padding-bottom: 0.25rem; */\n.py-2 /* padding-top: 0.5rem; padding-bottom: 0.5rem; */\n.py-3 /* padding-top: 0.75rem; padding-bottom: 0.75rem; */\n.py-4 /* padding-top: 1rem; padding-bottom: 1rem; */\n.py-5 /* padding-top: 1.25rem; padding-bottom: 1.25rem; */\n.py-6 /* padding-top: 1.5rem; padding-bottom: 1.5rem; */\n.py-8 /* padding-top: 2rem; padding-bottom: 2rem; */\n.py-10 /* padding-top: 2.5rem; padding-bottom: 2.5rem; */\n.py-12 /* padding-top: 3rem; padding-bottom: 3rem; */\n.py-16 /* padding-top: 4rem; padding-bottom: 4rem; */\n.py-20 /* padding-top: 5rem; padding-bottom: 5rem; */\n.py-24 /* padding-top: 6rem; padding-bottom: 6rem; */\n.py-32 /* padding-top: 8rem; padding-bottom: 8rem; */\n.py-40 /* padding-top: 10rem; padding-bottom: 10rem; */\n.py-48 /* padding-top: 12rem; padding-bottom: 12rem; */\n.py-56 /* padding-top: 14rem; padding-bottom: 14rem; */\n.py-64 /* padding-top: 16rem; padding-bottom: 16rem; */\n.py-px /* padding-top: 1px; padding-bottom: 1px; */\n.px-0 /* padding-right: 0; padding-left: 0; */\n.px-1 /* padding-right: 0.25rem; padding-left: 0.25rem; */\n.px-2 /* padding-right: 0.5rem; padding-left: 0.5rem; */\n.px-3 /* padding-right: 0.75rem; padding-left: 0.75rem; */\n.px-4 /* padding-right: 1rem; padding-left: 1rem; */\n.px-5 /* padding-right: 1.25rem; padding-left: 1.25rem; */\n.px-6 /* padding-right: 1.5rem; padding-left: 1.5rem; */\n.px-8 /* padding-right: 2rem; padding-left: 2rem; */\n.px-10 /* padding-right: 2.5rem; padding-left: 2.5rem; */\n.px-12 /* padding-right: 3rem; padding-left: 3rem; */\n.px-16 /* padding-right: 4rem; padding-left: 4rem; */\n.px-20 /* padding-right: 5rem; padding-left: 5rem; */\n.px-24 /* padding-right: 6rem; padding-left: 6rem; */\n.px-32 /* padding-right: 8rem; padding-left: 8rem; */\n.px-40 /* padding-right: 10rem; padding-left: 10rem; */\n.px-48 /* padding-right: 12rem; padding-left: 12rem; */\n.px-56 /* padding-right: 14rem; padding-left: 14rem; */\n.px-64 /* padding-right: 16rem; padding-left: 16rem; */\n.px-px /* padding-right: 1px; padding-left: 1px; */\n.pt-0 /* padding-top: 0; */\n.pt-1 /* padding-top: 0.25rem; */\n.pt-2 /* padding-top: 0.5rem; */\n.pt-3 /* padding-top: 0.75rem; */\n.pt-4 /* padding-top: 1rem; */\n.pt-5 /* padding-top: 1.25rem; */\n.pt-6 /* padding-top: 1.5rem; */\n.pt-8 /* padding-top: 2rem; */\n.pt-10 /* padding-top: 2.5rem; */\n.pt-12 /* padding-top: 3rem; */\n.pt-16 /* padding-top: 4rem; */\n.pt-20 /* padding-top: 5rem; */\n.pt-24 /* padding-top: 6rem; */\n.pt-32 /* padding-top: 8rem; */\n.pt-40 /* padding-top: 10rem; */\n.pt-48 /* padding-top: 12rem; */\n.pt-56 /* padding-top: 14rem; */\n.pt-64 /* padding-top: 16rem; */\n.pt-px /* padding-top: 1px; */\n.pr-0 /* padding-right: 0; */\n.pr-1 /* padding-right: 0.25rem; */\n.pr-2 /* padding-right: 0.5rem; */\n.pr-3 /* padding-right: 0.75rem; */\n.pr-4 /* padding-right: 1rem; */\n.pr-5 /* padding-right: 1.25rem; */\n.pr-6 /* padding-right: 1.5rem; */\n.pr-8 /* padding-right: 2rem; */\n.pr-10 /* padding-right: 2.5rem; */\n.pr-12 /* padding-right: 3rem; */\n.pr-16 /* padding-right: 4rem; */\n.pr-20 /* padding-right: 5rem; */\n.pr-24 /* padding-right: 6rem; */\n.pr-32 /* padding-right: 8rem; */\n.pr-40 /* padding-right: 10rem; */\n.pr-48 /* padding-right: 12rem; */\n.pr-56 /* padding-right: 14rem; */\n.pr-64 /* padding-right: 16rem; */\n.pr-px /* padding-right: 1px; */\n.pb-0 /* padding-bottom: 0; */\n.pb-1 /* padding-bottom: 0.25rem; */\n.pb-2 /* padding-bottom: 0.5rem; */\n.pb-3 /* padding-bottom: 0.75rem; */\n.pb-4 /* padding-bottom: 1rem; */\n.pb-5 /* padding-bottom: 1.25rem; */\n.pb-6 /* padding-bottom: 1.5rem; */\n.pb-8 /* padding-bottom: 2rem; */\n.pb-10 /* padding-bottom: 2.5rem; */\n.pb-12 /* padding-bottom: 3rem; */\n.pb-16 /* padding-bottom: 4rem; */\n.pb-20 /* padding-bottom: 5rem; */\n.pb-24 /* padding-bottom: 6rem; */\n.pb-32 /* padding-bottom: 8rem; */\n.pb-40 /* padding-bottom: 10rem; */\n.pb-48 /* padding-bottom: 12rem; */\n.pb-56 /* padding-bottom: 14rem; */\n.pb-64 /* padding-bottom: 16rem; */\n.pb-px /* padding-bottom: 1px; */\n.pl-0 /* padding-left: 0; */\n.pl-1 /* padding-left: 0.25rem; */\n.pl-2 /* padding-left: 0.5rem; */\n.pl-3 /* padding-left: 0.75rem; */\n.pl-4 /* padding-left: 1rem; */\n.pl-5 /* padding-left: 1.25rem; */\n.pl-6 /* padding-left: 1.5rem; */\n.pl-8 /* padding-left: 2rem; */\n.pl-10 /* padding-left: 2.5rem; */\n.pl-12 /* padding-left: 3rem; */\n.pl-16 /* padding-left: 4rem; */\n.pl-20 /* padding-left: 5rem; */\n.pl-24 /* padding-left: 6rem; */\n.pl-32 /* padding-left: 8rem; */\n.pl-40 /* padding-left: 10rem; */\n.pl-48 /* padding-left: 12rem; */\n.pl-56 /* padding-left: 14rem; */\n.pl-64 /* padding-left: 16rem; */\n.pl-px /* padding-left: 1px; */\n\n/*\n * Margin\n * --------------------\n * Utilities for controlling an element's margin.\n * By default, only responsive variants are generated for margin utilities.\n */\n\n.m-0 /* margin: 0; */\n.m-1 /* margin: 0.25rem; */\n.m-2 /* margin: 0.5rem; */\n.m-3 /* margin: 0.75rem; */\n.m-4 /* margin: 1rem; */\n.m-5 /* margin: 1.25rem; */\n.m-6 /* margin: 1.5rem; */\n.m-8 /* margin: 2rem; */\n.m-10 /* margin: 2.5rem; */\n.m-12 /* margin: 3rem; */\n.m-16 /* margin: 4rem; */\n.m-20 /* margin: 5rem; */\n.m-24 /* margin: 6rem; */\n.m-32 /* margin: 8rem; */\n.m-40 /* margin: 10rem; */\n.m-48 /* margin: 12rem; */\n.m-56 /* margin: 14rem; */\n.m-64 /* margin: 16rem; */\n.m-auto /* margin: auto; */\n.m-px /* margin: 1px; */\n.-m-1 /* margin: -0.25rem; */\n.-m-2 /* margin: -0.5rem; */\n.-m-3 /* margin: -0.75rem; */\n.-m-4 /* margin: -1rem; */\n.-m-5 /* margin: -1.25rem; */\n.-m-6 /* margin: -1.5rem; */\n.-m-8 /* margin: -2rem; */\n.-m-10 /* margin: -2.5rem; */\n.-m-12 /* margin: -3rem; */\n.-m-16 /* margin: -4rem; */\n.-m-20 /* margin: -5rem; */\n.-m-24 /* margin: -6rem; */\n.-m-32 /* margin: -8rem; */\n.-m-40 /* margin: -10rem; */\n.-m-48 /* margin: -12rem; */\n.-m-56 /* margin: -14rem; */\n.-m-64 /* margin: -16rem; */\n.-m-px /* margin: -1px; */\n.my-0 /* margin-top: 0; margin-bottom: 0; */\n.my-1 /* margin-top: 0.25rem; margin-bottom: 0.25rem; */\n.my-2 /* margin-top: 0.5rem; margin-bottom: 0.5rem; */\n.my-3 /* margin-top: 0.75rem; margin-bottom: 0.75rem; */\n.my-4 /* margin-top: 1rem; margin-bottom: 1rem; */\n.my-5 /* margin-top: 1.25rem; margin-bottom: 1.25rem; */\n.my-6 /* margin-top: 1.5rem; margin-bottom: 1.5rem; */\n.my-8 /* margin-top: 2rem; margin-bottom: 2rem; */\n.my-10 /* margin-top: 2.5rem; margin-bottom: 2.5rem; */\n.my-12 /* margin-top: 3rem; margin-bottom: 3rem; */\n.my-16 /* margin-top: 4rem; margin-bottom: 4rem; */\n.my-20 /* margin-top: 5rem; margin-bottom: 5rem; */\n.my-24 /* margin-top: 6rem; margin-bottom: 6rem; */\n.my-32 /* margin-top: 8rem; margin-bottom: 8rem; */\n.my-40 /* margin-top: 10rem; margin-bottom: 10rem; */\n.my-48 /* margin-top: 12rem; margin-bottom: 12rem; */\n.my-56 /* margin-top: 14rem; margin-bottom: 14rem; */\n.my-64 /* margin-top: 16rem; margin-bottom: 16rem; */\n.my-auto /* margin-top: auto; margin-bottom: auto; */\n.my-px /* margin-top: 1px; margin-bottom: 1px; */\n.-my-1 /* margin-top: -0.25rem; margin-bottom: -0.25rem; */\n.-my-2 /* margin-top: -0.5rem; margin-bottom: -0.5rem; */\n.-my-3 /* margin-top: -0.75rem; margin-bottom: -0.75rem; */\n.-my-4 /* margin-top: -1rem; margin-bottom: -1rem; */\n.-my-5 /* margin-top: -1.25rem; margin-bottom: -1.25rem; */\n.-my-6 /* margin-top: -1.5rem; margin-bottom: -1.5rem; */\n.-my-8 /* margin-top: -2rem; margin-bottom: -2rem; */\n.-my-10 /* margin-top: -2.5rem; margin-bottom: -2.5rem; */\n.-my-12 /* margin-top: -3rem; margin-bottom: -3rem; */\n.-my-16 /* margin-top: -4rem; margin-bottom: -4rem; */\n.-my-20 /* margin-top: -5rem; margin-bottom: -5rem; */\n.-my-24 /* margin-top: -6rem; margin-bottom: -6rem; */\n.-my-32 /* margin-top: -8rem; margin-bottom: -8rem; */\n.-my-40 /* margin-top: -10rem; margin-bottom: -10rem; */\n.-my-48 /* margin-top: -12rem; margin-bottom: -12rem; */\n.-my-56 /* margin-top: -14rem; margin-bottom: -14rem; */\n.-my-64 /* margin-top: -16rem; margin-bottom: -16rem; */\n.-my-px /* margin-top: -1px; margin-bottom: -1px; */\n.mx-0 /* margin-right: 0; margin-left: 0; */\n.mx-1 /* margin-right: 0.25rem; margin-left: 0.25rem; */\n.mx-2 /* margin-right: 0.5rem; margin-left: 0.5rem; */\n.mx-3 /* margin-right: 0.75rem; margin-left: 0.75rem; */\n.mx-4 /* margin-right: 1rem; margin-left: 1rem; */\n.mx-5 /* margin-right: 1.25rem; margin-left: 1.25rem; */\n.mx-6 /* margin-right: 1.5rem; margin-left: 1.5rem; */\n.mx-8 /* margin-right: 2rem; margin-left: 2rem; */\n.mx-10 /* margin-right: 2.5rem; margin-left: 2.5rem; */\n.mx-12 /* margin-right: 3rem; margin-left: 3rem; */\n.mx-16 /* margin-right: 4rem; margin-left: 4rem; */\n.mx-20 /* margin-right: 5rem; margin-left: 5rem; */\n.mx-24 /* margin-right: 6rem; margin-left: 6rem; */\n.mx-32 /* margin-right: 8rem; margin-left: 8rem; */\n.mx-40 /* margin-right: 10rem; margin-left: 10rem; */\n.mx-48 /* margin-right: 12rem; margin-left: 12rem; */\n.mx-56 /* margin-right: 14rem; margin-left: 14rem; */\n.mx-64 /* margin-right: 16rem; margin-left: 16rem; */\n.mx-auto /* margin-right: auto; margin-left: auto; */\n.mx-px /* margin-right: 1px; margin-left: 1px; */\n.-mx-1 /* margin-right: -0.25rem; margin-left: -0.25rem; */\n.-mx-2 /* margin-right: -0.5rem; margin-left: -0.5rem; */\n.-mx-3 /* margin-right: -0.75rem; margin-left: -0.75rem; */\n.-mx-4 /* margin-right: -1rem; margin-left: -1rem; */\n.-mx-5 /* margin-right: -1.25rem; margin-left: -1.25rem; */\n.-mx-6 /* margin-right: -1.5rem; margin-left: -1.5rem; */\n.-mx-8 /* margin-right: -2rem; margin-left: -2rem; */\n.-mx-10 /* margin-right: -2.5rem; margin-left: -2.5rem; */\n.-mx-12 /* margin-right: -3rem; margin-left: -3rem; */\n.-mx-16 /* margin-right: -4rem; margin-left: -4rem; */\n.-mx-20 /* margin-right: -5rem; margin-left: -5rem; */\n.-mx-24 /* margin-right: -6rem; margin-left: -6rem; */\n.-mx-32 /* margin-right: -8rem; margin-left: -8rem; */\n.-mx-40 /* margin-right: -10rem; margin-left: -10rem; */\n.-mx-48 /* margin-right: -12rem; margin-left: -12rem; */\n.-mx-56 /* margin-right: -14rem; margin-left: -14rem; */\n.-mx-64 /* margin-right: -16rem; margin-left: -16rem; */\n.-mx-px /* margin-right: -1px; margin-left: -1px; */\n.mt-0 /* margin-top: 0; */\n.mt-1 /* margin-top: 0.25rem; */\n.mt-2 /* margin-top: 0.5rem; */\n.mt-3 /* margin-top: 0.75rem; */\n.mt-4 /* margin-top: 1rem; */\n.mt-5 /* margin-top: 1.25rem; */\n.mt-6 /* margin-top: 1.5rem; */\n.mt-8 /* margin-top: 2rem; */\n.mt-10 /* margin-top: 2.5rem; */\n.mt-12 /* margin-top: 3rem; */\n.mt-16 /* margin-top: 4rem; */\n.mt-20 /* margin-top: 5rem; */\n.mt-24 /* margin-top: 6rem; */\n.mt-32 /* margin-top: 8rem; */\n.mt-40 /* margin-top: 10rem; */\n.mt-48 /* margin-top: 12rem; */\n.mt-56 /* margin-top: 14rem; */\n.mt-64 /* margin-top: 16rem; */\n.mt-auto /* margin-top: auto; */\n.mt-px /* margin-top: 1px; */\n.-mt-1 /* margin-top: -0.25rem; */\n.-mt-2 /* margin-top: -0.5rem; */\n.-mt-3 /* margin-top: -0.75rem; */\n.-mt-4 /* margin-top: -1rem; */\n.-mt-5 /* margin-top: -1.25rem; */\n.-mt-6 /* margin-top: -1.5rem; */\n.-mt-8 /* margin-top: -2rem; */\n.-mt-10 /* margin-top: -2.5rem; */\n.-mt-12 /* margin-top: -3rem; */\n.-mt-16 /* margin-top: -4rem; */\n.-mt-20 /* margin-top: -5rem; */\n.-mt-24 /* margin-top: -6rem; */\n.-mt-32 /* margin-top: -8rem; */\n.-mt-40 /* margin-top: -10rem; */\n.-mt-48 /* margin-top: -12rem; */\n.-mt-56 /* margin-top: -14rem; */\n.-mt-64 /* margin-top: -16rem; */\n.-mt-px /* margin-top: -1px; */\n.mr-0 /* margin-right: 0; */\n.mr-1 /* margin-right: 0.25rem; */\n.mr-2 /* margin-right: 0.5rem; */\n.mr-3 /* margin-right: 0.75rem; */\n.mr-4 /* margin-right: 1rem; */\n.mr-5 /* margin-right: 1.25rem; */\n.mr-6 /* margin-right: 1.5rem; */\n.mr-8 /* margin-right: 2rem; */\n.mr-10 /* margin-right: 2.5rem; */\n.mr-12 /* margin-right: 3rem; */\n.mr-16 /* margin-right: 4rem; */\n.mr-20 /* margin-right: 5rem; */\n.mr-24 /* margin-right: 6rem; */\n.mr-32 /* margin-right: 8rem; */\n.mr-40 /* margin-right: 10rem; */\n.mr-48 /* margin-right: 12rem; */\n.mr-56 /* margin-right: 14rem; */\n.mr-64 /* margin-right: 16rem; */\n.mr-auto /* margin-right: auto; */\n.mr-px /* margin-right: 1px; */\n.-mr-1 /* margin-right: -0.25rem; */\n.-mr-2 /* margin-right: -0.5rem; */\n.-mr-3 /* margin-right: -0.75rem; */\n.-mr-4 /* margin-right: -1rem; */\n.-mr-5 /* margin-right: -1.25rem; */\n.-mr-6 /* margin-right: -1.5rem; */\n.-mr-8 /* margin-right: -2rem; */\n.-mr-10 /* margin-right: -2.5rem; */\n.-mr-12 /* margin-right: -3rem; */\n.-mr-16 /* margin-right: -4rem; */\n.-mr-20 /* margin-right: -5rem; */\n.-mr-24 /* margin-right: -6rem; */\n.-mr-32 /* margin-right: -8rem; */\n.-mr-40 /* margin-right: -10rem; */\n.-mr-48 /* margin-right: -12rem; */\n.-mr-56 /* margin-right: -14rem; */\n.-mr-64 /* margin-right: -16rem; */\n.-mr-px /* margin-right: -1px; */\n.mb-0 /* margin-bottom: 0; */\n.mb-1 /* margin-bottom: 0.25rem; */\n.mb-2 /* margin-bottom: 0.5rem; */\n.mb-3 /* margin-bottom: 0.75rem; */\n.mb-4 /* margin-bottom: 1rem; */\n.mb-5 /* margin-bottom: 1.25rem; */\n.mb-6 /* margin-bottom: 1.5rem; */\n.mb-8 /* margin-bottom: 2rem; */\n.mb-10 /* margin-bottom: 2.5rem; */\n.mb-12 /* margin-bottom: 3rem; */\n.mb-16 /* margin-bottom: 4rem; */\n.mb-20 /* margin-bottom: 5rem; */\n.mb-24 /* margin-bottom: 6rem; */\n.mb-32 /* margin-bottom: 8rem; */\n.mb-40 /* margin-bottom: 10rem; */\n.mb-48 /* margin-bottom: 12rem; */\n.mb-56 /* margin-bottom: 14rem; */\n.mb-64 /* margin-bottom: 16rem; */\n.mb-auto /* margin-bottom: auto; */\n.mb-px /* margin-bottom: 1px; */\n.-mb-1 /* margin-bottom: -0.25rem; */\n.-mb-2 /* margin-bottom: -0.5rem; */\n.-mb-3 /* margin-bottom: -0.75rem; */\n.-mb-4 /* margin-bottom: -1rem; */\n.-mb-5 /* margin-bottom: -1.25rem; */\n.-mb-6 /* margin-bottom: -1.5rem; */\n.-mb-8 /* margin-bottom: -2rem; */\n.-mb-10 /* margin-bottom: -2.5rem; */\n.-mb-12 /* margin-bottom: -3rem; */\n.-mb-16 /* margin-bottom: -4rem; */\n.-mb-20 /* margin-bottom: -5rem; */\n.-mb-24 /* margin-bottom: -6rem; */\n.-mb-32 /* margin-bottom: -8rem; */\n.-mb-40 /* margin-bottom: -10rem; */\n.-mb-48 /* margin-bottom: -12rem; */\n.-mb-56 /* margin-bottom: -14rem; */\n.-mb-64 /* margin-bottom: -16rem; */\n.-mb-px /* margin-bottom: -1px; */\n.ml-0 /* margin-left: 0; */\n.ml-1 /* margin-left: 0.25rem; */\n.ml-2 /* margin-left: 0.5rem; */\n.ml-3 /* margin-left: 0.75rem; */\n.ml-4 /* margin-left: 1rem; */\n.ml-5 /* margin-left: 1.25rem; */\n.ml-6 /* margin-left: 1.5rem; */\n.ml-8 /* margin-left: 2rem; */\n.ml-10 /* margin-left: 2.5rem; */\n.ml-12 /* margin-left: 3rem; */\n.ml-16 /* margin-left: 4rem; */\n.ml-20 /* margin-left: 5rem; */\n.ml-24 /* margin-left: 6rem; */\n.ml-32 /* margin-left: 8rem; */\n.ml-40 /* margin-left: 10rem; */\n.ml-48 /* margin-left: 12rem; */\n.ml-56 /* margin-left: 14rem; */\n.ml-64 /* margin-left: 16rem; */\n.ml-auto /* margin-left: auto; */\n.ml-px /* margin-left: 1px; */\n.-ml-1 /* margin-left: -0.25rem; */\n.-ml-2 /* margin-left: -0.5rem; */\n.-ml-3 /* margin-left: -0.75rem; */\n.-ml-4 /* margin-left: -1rem; */\n.-ml-5 /* margin-left: -1.25rem; */\n.-ml-6 /* margin-left: -1.5rem; */\n.-ml-8 /* margin-left: -2rem; */\n.-ml-10 /* margin-left: -2.5rem; */\n.-ml-12 /* margin-left: -3rem; */\n.-ml-16 /* margin-left: -4rem; */\n.-ml-20 /* margin-left: -5rem; */\n.-ml-24 /* margin-left: -6rem; */\n.-ml-32 /* margin-left: -8rem; */\n.-ml-40 /* margin-left: -10rem; */\n.-ml-48 /* margin-left: -12rem; */\n.-ml-56 /* margin-left: -14rem; */\n.-ml-64 /* margin-left: -16rem; */\n.-ml-px /* margin-left: -1px; */\n\n/* *******************************************************************************************\n * SIZING\n * ******************************************************************************************* */\n \n/*\n * Width\n * --------------------\n * Utilities for setting the width of an element\n * By default, only responsive variants are generated for width utilities.\n */\n\n.w-0 /* width: 0; */\n.w-1 /* width: 0.25rem; */\n.w-2 /* width: 0.5rem; */\n.w-3 /* width: 0.75rem; */\n.w-4 /* width: 1rem; */\n.w-5 /* width: 1.25rem; */\n.w-6 /* width: 1.5rem; */\n.w-8 /* width: 2rem; */\n.w-10 /* width: 2.5rem; */\n.w-12 /* width: 3rem; */\n.w-16 /* width: 4rem; */\n.w-20 /* width: 5rem; */\n.w-24 /* width: 6rem; */\n.w-32 /* width: 8rem; */\n.w-40 /* width: 10rem; */\n.w-48 /* width: 12rem; */\n.w-56 /* width: 14rem; */\n.w-64 /* width: 16rem; */\n.w-auto /* width: auto; */\n.w-px /* width: 1px; */\n.w-1/2 /* width: 50%; */\n.w-1/3 /* width: 33.333333%; */\n.w-2/3 /* width: 66.666667%; */\n.w-1/4 /* width: 25%; */\n.w-2/4 /* width: 50%; */\n.w-3/4 /* width: 75%; */\n.w-1/5 /* width: 20%; */\n.w-2/5 /* width: 40%; */\n.w-3/5 /* width: 60%; */\n.w-4/5 /* width: 80%; */\n.w-1/6 /* width: 16.666667%; */\n.w-2/6 /* width: 33.333333%; */\n.w-3/6 /* width: 50%; */\n.w-4/6 /* width: 66.666667%; */\n.w-5/6 /* width: 83.333333%; */\n.w-1/12 /* width: 8.333333%; */\n.w-2/12 /* width: 16.666667%; */\n.w-3/12 /* width: 25%; */\n.w-4/12 /* width: 33.333333%; */\n.w-5/12 /* width: 41.666667%; */\n.w-6/12 /* width: 50%; */\n.w-7/12 /* width: 58.333333%; */\n.w-8/12 /* width: 66.666667%; */\n.w-9/12 /* width: 75%; */\n.w-10/12 /* width: 83.333333%; */\n.w-11/12 /* width: 91.666667%; */\n.w-full /* width: 100%; */\n.w-screen /* width: 100vw; */\n\n/*\n * Min-Width\n * --------------------\n * Utilities for setting the minimum width of an element\n * By default, only responsive variants are generated for min-width utilities.\n */\n\n.min-w-0 /* min-width: 0; */\n.min-w-full /* min-width: 100%; */\n\n/*\n * Max-Width\n * --------------------\n * Utilities for setting the maximum width of an element\n * By default, only responsive variants are generated for max-width utilities.\n */\n\n.max-w-xs /* max-width: 20rem; */\n.max-w-sm /* max-width: 24rem; */\n.max-w-md /* max-width: 28rem; */\n.max-w-lg /* max-width: 32rem; */\n.max-w-xl /* max-width: 36rem; */\n.max-w-2xl /* max-width: 42rem; */\n.max-w-3xl /* max-width: 48rem; */\n.max-w-4xl /* max-width: 56rem; */\n.max-w-5xl /* max-width: 64rem; */\n.max-w-6xl /* max-width: 72rem; */\n.max-w-full /* max-width: 100%; */\n.max-w-screen-sm /* max-width: 640px; */\n.max-w-screen-md /* max-width: 768px; */\n.max-w-screen-lg /* max-width: 1024px; */\n.max-w-screen-xl /* max-width: 1280px; */\n.max-w-none /* max-width: none; */\n\n/*\n * Height\n * --------------------\n * Utilities for setting the height of an element\n * By default, only responsive variants are generated for height utilities.\n */\n\n.h-0 /* height: 0; */\n.h-1 /* height: 0.25rem; */\n.h-2 /* height: 0.5rem; */\n.h-3 /* height: 0.75rem; */\n.h-4 /* height: 1rem; */\n.h-5 /* height: 1.25rem; */\n.h-6 /* height: 1.5rem; */\n.h-8 /* height: 2rem; */\n.h-10 /* height: 2.5rem; */\n.h-12 /* height: 3rem; */\n.h-16 /* height: 4rem; */\n.h-20 /* height: 5rem; */\n.h-24 /* height: 6rem; */\n.h-32 /* height: 8rem; */\n.h-40 /* height: 10rem; */\n.h-48 /* height: 12rem; */\n.h-56 /* height: 14rem; */\n.h-64 /* height: 16rem; */\n.h-auto /* height: auto; */\n.h-px /* height: 1px; */\n.h-full /* height: 100%; */\n.h-screen /* height: 100vh; */\n\n/*\n * Min-Height\n * --------------------\n * Utilities for setting the minimum height of an element\n * By default, only responsive variants are generated for min-height utilities.\n */\n\n.min-h-0 /* min-height: 0; */\n.min-h-full /* min-height: 100%; */\n.min-h-screen /* min-height: 100vh; */\n\n/*\n * Max-Height\n * --------------------\n * Utilities for setting the maximum height of an element\n * By default, only responsive variants are generated for max-height utilities.\n */\n\n.max-h-full /* max-height: 100%; */\n.max-h-screen /* max-height: 100vh; */\n\n/* *******************************************************************************************\n * TYPOGRAPHY\n * ******************************************************************************************* */\n \n/*\n * Font Family\n * --------------------\n * Utilities for controlling the font family of an element.\n * By default, only responsive variants are generated for font family utilities.\n */\n\n.font-sans /* font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; */\n.font-serif /* font-family: Georgia, Cambria, \"Times New Roman\", Times, serif; */\n.font-mono /* font-family: Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; */\n\n/*\n * Font Size\n * --------------------\n * Utilities for controlling the font size of an element.\n * By default, only responsive variants are generated for text sizing utilities.\n */\n\n.text-xs /* font-size: .75rem; */\n.text-sm /* font-size: .875rem; */\n.text-base /* font-size: 1rem; */\n.text-lg /* font-size: 1.125rem; */\n.text-xl /* font-size: 1.25rem; */\n.text-2xl /* font-size: 1.5rem; */\n.text-3xl /* font-size: 1.875rem; */\n.text-4xl /* font-size: 2.25rem; */\n.text-5xl /* font-size: 3rem; */\n.text-6xl /* font-size: 4rem; */\n\n/*\n * Font Smoothing\n * --------------------\n * Utilities for controlling the font smoothing of an element.\n * By default, only responsive variants are generated for font smoothing utilities.\n */\n\n.antialiased /* -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; */\n.subpixel-antialiased /* -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; */\n\n/*\n * Font Style\n * --------------------\n * Utilities for controlling the style of text.\n * By default, only responsive variants are generated for font style utilities.\n */\n\n.italic /* font-style: italic; */\n.not-italic /* font-style: normal; */\n\n/*\n * Font Weight\n * --------------------\n * Utilities for controlling the font weight of an element.\n * By default, only responsive, hover and focus variants are generated for font weight utilities.\n */\n\n.font-hairline /* font-weight: 100; */\n.font-thin /* font-weight: 200; */\n.font-light /* font-weight: 300; */\n.font-normal /* font-weight: 400; */\n.font-medium /* font-weight: 500; */\n.font-semibold /* font-weight: 600; */\n.font-bold /* font-weight: 700; */\n.font-extrabold /* font-weight: 800; */\n.font-black /* font-weight: 900; */\n\n/*\n * Letter Spacing\n * --------------------\n * Utilities for controlling the tracking (letter spacing) of an element.\n * By default, only responsive variants are generated for tracking utilities.\n */\n\n.tracking-tighter /* letter-spacing: -0.05em; */\n.tracking-tight /* letter-spacing: -0.025em; */\n.tracking-normal /* letter-spacing: 0; */\n.tracking-wide /* letter-spacing: 0.025em; */\n.tracking-wider /* letter-spacing: 0.05em; */\n.tracking-widest /* letter-spacing: 0.1em; */\n\n/*\n * Line Height\n * --------------------\n * Utilities for controlling the leading (line height) of an element.\n * By default, only responsive variants are generated for line height utilities.\n */\n\n.leading-none /* line-height: 1; */\n.leading-tight /* line-height: 1.25; */\n.leading-snug /* line-height: 1.375; */\n.leading-normal /* line-height: 1.5; */\n.leading-relaxed /* line-height: 1.625; */\n.leading-loose /* line-height: 2; */\n.leading-3 /* line-height: .75rem; */\n.leading-4 /* line-height: 1rem; */\n.leading-5 /* line-height: 1.25rem; */\n.leading-6 /* line-height: 1.5rem; */\n.leading-7 /* line-height: 1.75rem; */\n.leading-8 /* line-height: 2rem; */\n.leading-9 /* line-height: 2.25rem; */\n.leading-10 /* line-height: 2.5rem; */\n\n/*\n * List Style Type\n * --------------------\n * Utilities for controlling the bullet/number style of a list.\n * By default, only responsive variants are generated for list style type utilities.\n */\n\n.list-none /* list-style-type: none; */\n.list-disc /* list-style-type: disc; */\n.list-decimal /* list-style-type: decimal; */\n\n/*\n * List Style Position\n * --------------------\n * Utilities for controlling the position of bullets/numbers in lists.\n * By default, only responsive variants are generated for list style position utilities.\n */\n\n.list-inside /* list-style-position: inside; */\n.list-outside /* list-style-position: outside; */\n\n/*\n * Placeholder Color\n * --------------------\n * Utilities for controlling the color of placeholder text.\n * By default, only responsive and focus variants are generated for placeholder color utilities.\n */\n\n .placeholder-transparent /* ::placeholder { color: transparent; } */\n .placeholder-black /* ::placeholder { color: #000; } */\n .placeholder-white /* ::placeholder { color: #fff; } */\n .placeholder-gray-100 /* ::placeholder { color: #f7fafc; } */\n .placeholder-gray-200 /* ::placeholder { color: #edf2f7; } */\n .placeholder-gray-300 /* ::placeholder { color: #e2e8f0; } */\n .placeholder-gray-400 /* ::placeholder { color: #cbd5e0; } */\n .placeholder-gray-500 /* ::placeholder { color: #a0aec0; } */\n .placeholder-gray-600 /* ::placeholder { color: #718096; } */\n .placeholder-gray-700 /* ::placeholder { color: #4a5568; } */\n .placeholder-gray-800 /* ::placeholder { color: #2d3748; } */\n .placeholder-gray-900 /* ::placeholder { color: #1a202c; } */\n .placeholder-red-100 /* ::placeholder { color: #fff5f5; } */\n .placeholder-red-200 /* ::placeholder { color: #fed7d7; } */\n .placeholder-red-300 /* ::placeholder { color: #feb2b2; } */\n .placeholder-red-400 /* ::placeholder { color: #fc8181; } */\n .placeholder-red-500 /* ::placeholder { color: #f56565; } */\n .placeholder-red-600 /* ::placeholder { color: #e53e3e; } */\n .placeholder-red-700 /* ::placeholder { color: #c53030; } */\n .placeholder-red-800 /* ::placeholder { color: #9b2c2c; } */\n .placeholder-red-900 /* ::placeholder { color: #742a2a; } */\n .placeholder-orange-100 /* ::placeholder { color: #fffaf0; } */\n .placeholder-orange-200 /* ::placeholder { color: #feebc8; } */\n .placeholder-orange-300 /* ::placeholder { color: #fbd38d; } */\n .placeholder-orange-400 /* ::placeholder { color: #f6ad55; } */\n .placeholder-orange-500 /* ::placeholder { color: #ed8936; } */\n .placeholder-orange-600 /* ::placeholder { color: #dd6b20; } */\n .placeholder-orange-700 /* ::placeholder { color: #c05621; } */\n .placeholder-orange-800 /* ::placeholder { color: #9c4221; } */\n .placeholder-orange-900 /* ::placeholder { color: #7b341e; } */\n .placeholder-yellow-100 /* ::placeholder { color: #fffff0; } */\n .placeholder-yellow-200 /* ::placeholder { color: #fefcbf; } */\n .placeholder-yellow-300 /* ::placeholder { color: #faf089; } */\n .placeholder-yellow-400 /* ::placeholder { color: #f6e05e; } */\n .placeholder-yellow-500 /* ::placeholder { color: #ecc94b; } */\n .placeholder-yellow-600 /* ::placeholder { color: #d69e2e; } */\n .placeholder-yellow-700 /* ::placeholder { color: #b7791f; } */\n .placeholder-yellow-800 /* ::placeholder { color: #975a16; } */\n .placeholder-yellow-900 /* ::placeholder { color: #744210; } */\n .placeholder-green-100 /* ::placeholder { color: #f0fff4; } */\n .placeholder-green-200 /* ::placeholder { color: #c6f6d5; } */\n .placeholder-green-300 /* ::placeholder { color: #9ae6b4; } */\n .placeholder-green-400 /* ::placeholder { color: #68d391; } */\n .placeholder-green-500 /* ::placeholder { color: #48bb78; } */\n .placeholder-green-600 /* ::placeholder { color: #38a169; } */\n .placeholder-green-700 /* ::placeholder { color: #2f855a; } */\n .placeholder-green-800 /* ::placeholder { color: #276749; } */\n .placeholder-green-900 /* ::placeholder { color: #22543d; } */\n .placeholder-teal-100 /* ::placeholder { color: #e6fffa; } */\n .placeholder-teal-200 /* ::placeholder { color: #b2f5ea; } */\n .placeholder-teal-300 /* ::placeholder { color: #81e6d9; } */\n .placeholder-teal-400 /* ::placeholder { color: #4fd1c5; } */\n .placeholder-teal-500 /* ::placeholder { color: #38b2ac; } */\n .placeholder-teal-600 /* ::placeholder { color: #319795; } */\n .placeholder-teal-700 /* ::placeholder { color: #2c7a7b; } */\n .placeholder-teal-800 /* ::placeholder { color: #285e61; } */\n .placeholder-teal-900 /* ::placeholder { color: #234e52; } */\n .placeholder-blue-100 /* ::placeholder { color: #ebf8ff; } */\n .placeholder-blue-200 /* ::placeholder { color: #bee3f8; } */\n .placeholder-blue-300 /* ::placeholder { color: #90cdf4; } */\n .placeholder-blue-400 /* ::placeholder { color: #63b3ed; } */\n .placeholder-blue-500 /* ::placeholder { color: #4299e1; } */\n .placeholder-blue-600 /* ::placeholder { color: #3182ce; } */\n .placeholder-blue-700 /* ::placeholder { color: #2b6cb0; } */\n .placeholder-blue-800 /* ::placeholder { color: #2c5282; } */\n .placeholder-blue-900 /* ::placeholder { color: #2a4365; } */\n .placeholder-indigo-100 /* ::placeholder { color: #ebf4ff; } */\n .placeholder-indigo-200 /* ::placeholder { color: #c3dafe; } */\n .placeholder-indigo-300 /* ::placeholder { color: #a3bffa; } */\n .placeholder-indigo-400 /* ::placeholder { color: #7f9cf5; } */\n .placeholder-indigo-500 /* ::placeholder { color: #667eea; } */\n .placeholder-indigo-600 /* ::placeholder { color: #5a67d8; } */\n .placeholder-indigo-700 /* ::placeholder { color: #4c51bf; } */\n .placeholder-indigo-800 /* ::placeholder { color: #434190; } */\n .placeholder-indigo-900 /* ::placeholder { color: #3c366b; } */\n .placeholder-purple-100 /* ::placeholder { color: #faf5ff; } */\n .placeholder-purple-200 /* ::placeholder { color: #e9d8fd; } */\n .placeholder-purple-300 /* ::placeholder { color: #d6bcfa; } */\n .placeholder-purple-400 /* ::placeholder { color: #b794f4; } */\n .placeholder-purple-500 /* ::placeholder { color: #9f7aea; } */\n .placeholder-purple-600 /* ::placeholder { color: #805ad5; } */\n .placeholder-purple-700 /* ::placeholder { color: #6b46c1; } */\n .placeholder-purple-800 /* ::placeholder { color: #553c9a; } */\n .placeholder-purple-900 /* ::placeholder { color: #44337a; } */\n .placeholder-pink-100 /* ::placeholder { color: #fff5f7; } */\n .placeholder-pink-200 /* ::placeholder { color: #fed7e2; } */\n .placeholder-pink-300 /* ::placeholder { color: #fbb6ce; } */\n .placeholder-pink-400 /* ::placeholder { color: #f687b3; } */\n .placeholder-pink-500 /* ::placeholder { color: #ed64a6; } */\n .placeholder-pink-600 /* ::placeholder { color: #d53f8c; } */\n .placeholder-pink-700 /* ::placeholder { color: #b83280; } */\n .placeholder-pink-800 /* ::placeholder { color: #97266d; } */\n .placeholder-pink-900 /* ::placeholder { color: #702459; } */\n\n/*\n * Text Align\n * --------------------\n * Utilities for controlling the alignment of text.\n * By default, only responsive variants are generated for text alignment utilities.\n */\n\n.text-left /* text-align: left; */\n.text-center /* text-align: center; */\n.text-right /* text-align: right; */\n.text-justify /* text-align: justify; */\n\n/*\n * Text Color\n * --------------------\n * Utilities for controlling the text color of an element.\n * By default, only responsive, hover and focus variants are generated for text color utilities.\n */\n\n .text-transparent /* color: transparent; */\n .text-black /* color: #000; */\n .text-white /* color: #fff; */\n .text-gray-100 /* color: #f7fafc; */\n .text-gray-200 /* color: #edf2f7; */\n .text-gray-300 /* color: #e2e8f0; */\n .text-gray-400 /* color: #cbd5e0; */\n .text-gray-500 /* color: #a0aec0; */\n .text-gray-600 /* color: #718096; */\n .text-gray-700 /* color: #4a5568; */\n .text-gray-800 /* color: #2d3748; */\n .text-gray-900 /* color: #1a202c; */\n .text-red-100 /* color: #fff5f5; */\n .text-red-200 /* color: #fed7d7; */\n .text-red-300 /* color: #feb2b2; */\n .text-red-400 /* color: #fc8181; */\n .text-red-500 /* color: #f56565; */\n .text-red-600 /* color: #e53e3e; */\n .text-red-700 /* color: #c53030; */\n .text-red-800 /* color: #9b2c2c; */\n .text-red-900 /* color: #742a2a; */\n .text-orange-100 /* color: #fffaf0; */\n .text-orange-200 /* color: #feebc8; */\n .text-orange-300 /* color: #fbd38d; */\n .text-orange-400 /* color: #f6ad55; */\n .text-orange-500 /* color: #ed8936; */\n .text-orange-600 /* color: #dd6b20; */\n .text-orange-700 /* color: #c05621; */\n .text-orange-800 /* color: #9c4221; */\n .text-orange-900 /* color: #7b341e; */\n .text-yellow-100 /* color: #fffff0; */\n .text-yellow-200 /* color: #fefcbf; */\n .text-yellow-300 /* color: #faf089; */\n .text-yellow-400 /* color: #f6e05e; */\n .text-yellow-500 /* color: #ecc94b; */\n .text-yellow-600 /* color: #d69e2e; */\n .text-yellow-700 /* color: #b7791f; */\n .text-yellow-800 /* color: #975a16; */\n .text-yellow-900 /* color: #744210; */\n .text-green-100 /* color: #f0fff4; */\n .text-green-200 /* color: #c6f6d5; */\n .text-green-300 /* color: #9ae6b4; */\n .text-green-400 /* color: #68d391; */\n .text-green-500 /* color: #48bb78; */\n .text-green-600 /* color: #38a169; */\n .text-green-700 /* color: #2f855a; */\n .text-green-800 /* color: #276749; */\n .text-green-900 /* color: #22543d; */\n .text-teal-100 /* color: #e6fffa; */\n .text-teal-200 /* color: #b2f5ea; */\n .text-teal-300 /* color: #81e6d9; */\n .text-teal-400 /* color: #4fd1c5; */\n .text-teal-500 /* color: #38b2ac; */\n .text-teal-600 /* color: #319795; */\n .text-teal-700 /* color: #2c7a7b; */\n .text-teal-800 /* color: #285e61; */\n .text-teal-900 /* color: #234e52; */\n .text-blue-100 /* color: #ebf8ff; */\n .text-blue-200 /* color: #bee3f8; */\n .text-blue-300 /* color: #90cdf4; */\n .text-blue-400 /* color: #63b3ed; */\n .text-blue-500 /* color: #4299e1; */\n .text-blue-600 /* color: #3182ce; */\n .text-blue-700 /* color: #2b6cb0; */\n .text-blue-800 /* color: #2c5282; */\n .text-blue-900 /* color: #2a4365; */\n .text-indigo-100 /* color: #ebf4ff; */\n .text-indigo-200 /* color: #c3dafe; */\n .text-indigo-300 /* color: #a3bffa; */\n .text-indigo-400 /* color: #7f9cf5; */\n .text-indigo-500 /* color: #667eea; */\n .text-indigo-600 /* color: #5a67d8; */\n .text-indigo-700 /* color: #4c51bf; */\n .text-indigo-800 /* color: #434190; */\n .text-indigo-900 /* color: #3c366b; */\n .text-purple-100 /* color: #faf5ff; */\n .text-purple-200 /* color: #e9d8fd; */\n .text-purple-300 /* color: #d6bcfa; */\n .text-purple-400 /* color: #b794f4; */\n .text-purple-500 /* color: #9f7aea; */\n .text-purple-600 /* color: #805ad5; */\n .text-purple-700 /* color: #6b46c1; */\n .text-purple-800 /* color: #553c9a; */\n .text-purple-900 /* color: #44337a; */\n .text-pink-100 /* color: #fff5f7; */\n .text-pink-200 /* color: #fed7e2; */\n .text-pink-300 /* color: #fbb6ce; */\n .text-pink-400 /* color: #f687b3; */\n .text-pink-500 /* color: #ed64a6; */\n .text-pink-600 /* color: #d53f8c; */\n .text-pink-700 /* color: #b83280; */\n .text-pink-800 /* color: #97266d; */\n .text-pink-900 /* color: #702459; */\n\n/*\n * Text Decoration\n * --------------------\n * Utilities for controlling the decoration of text.\n * By default, only responsive, hover and focus variants are generated for text decoration utilities.\n */\n\n.underline /* text-decoration: underline; */\n.line-through /* text-decoration: line-through; */\n.no-underline /* text-decoration: none; */\n\n/*\n * Text Transform\n * --------------------\n * Utilities for controlling the transformation of text.\n * By default, only responsive variants are generated for text transformation utilities.\n */\n\n.uppercase /* text-transform: uppercase; */\n.lowercase /* text-transform: lowercase; */\n.capitalize /* text-transform: capitalize; */\n.normal-case /* text-transform: none; */\n\n/*\n * Vertical Align\n * --------------------\n * Utilities for controlling the vertical alignment of an inline or table-cell box.\n * By default, only responsive variants are generated for vertical alignment utilities.\n */\n\n.align-baseline /* vertical-align: baseline; */\n.align-top /* vertical-align: top; */\n.align-middle /* vertical-align: middle; */\n.align-bottom /* vertical-align: bottom; */\n.align-text-top /* vertical-align: text-top; */\n.align-text-bottom /* vertical-align: text-bottom; */\n\n/*\n * Whitespace\n * --------------------\n * Utilities for controlling an element's white-space property.\n * By default, only responsive variants are generated for whitespace utilities.\n */\n\n.whitespace-normal /* white-space: normal; */\n.whitespace-no-wrap /* white-space: nowrap; */\n.whitespace-pre /* white-space: pre; */\n.whitespace-pre-line /* white-space: pre-line; */\n.whitespace-pre-wrap /* white-space: pre-wrap; */\n\n/*\n * Word Break\n * --------------------\n * Utilities for controlling word breaks in an element.\n * By default, only responsive variants are generated for word break utilities.\n */\n\n.break-normal /* word-break: normal; overflow-wrap: normal */\n.break-words /* overflow-wrap: break-word; */\n.break-all /* word-break: break-all; */\n.truncate /* overflow: hidden; text-overflow: ellipsis; white-space: nowrap */\n\n/* *******************************************************************************************\n * BACKGROUNDS\n * ******************************************************************************************* */\n \n/*\n * BACKGROUND ATTACHMENT\n * --------------------\n * Utilities for controlling how a background image behaves when scrolling.\n * By default, only responsive variants are generated for background attachment utilities.\n */\n\n.bg-fixed /* background-attachment: fixed; */\n.bg-local /* background-attachment: local; */\n.bg-scroll /* background-attachment: scroll; */\n\n/*\n * BACKGROUND COLOR\n * --------------------\n * Utilities for controlling how a background image behaves when scrolling.\n * By default, only responsive, hover and focus variants are generated for background color utilities.\n */\n\n.bg-transparent /* background-color: transparent; */\n.bg-black /* background-color: #000; */\n.bg-white /* background-color: #fff; */\n.bg-gray-100 /* background-color: #f7fafc; */\n.bg-gray-200 /* background-color: #edf2f7; */\n.bg-gray-300 /* background-color: #e2e8f0; */\n.bg-gray-400 /* background-color: #cbd5e0; */\n.bg-gray-500 /* background-color: #a0aec0; */\n.bg-gray-600 /* background-color: #718096; */\n.bg-gray-700 /* background-color: #4a5568; */\n.bg-gray-800 /* background-color: #2d3748; */\n.bg-gray-900 /* background-color: #1a202c; */\n.bg-red-100 /* background-color: #fff5f5; */\n.bg-red-200 /* background-color: #fed7d7; */\n.bg-red-300 /* background-color: #feb2b2; */\n.bg-red-400 /* background-color: #fc8181; */\n.bg-red-500 /* background-color: #f56565; */\n.bg-red-600 /* background-color: #e53e3e; */\n.bg-red-700 /* background-color: #c53030; */\n.bg-red-800 /* background-color: #9b2c2c; */\n.bg-red-900 /* background-color: #742a2a; */\n.bg-orange-100 /* background-color: #fffaf0; */\n.bg-orange-200 /* background-color: #feebc8; */\n.bg-orange-300 /* background-color: #fbd38d; */\n.bg-orange-400 /* background-color: #f6ad55; */\n.bg-orange-500 /* background-color: #ed8936; */\n.bg-orange-600 /* background-color: #dd6b20; */\n.bg-orange-700 /* background-color: #c05621; */\n.bg-orange-800 /* background-color: #9c4221; */\n.bg-orange-900 /* background-color: #7b341e; */\n.bg-yellow-100 /* background-color: #fffff0; */\n.bg-yellow-200 /* background-color: #fefcbf; */\n.bg-yellow-300 /* background-color: #faf089; */\n.bg-yellow-400 /* background-color: #f6e05e; */\n.bg-yellow-500 /* background-color: #ecc94b; */\n.bg-yellow-600 /* background-color: #d69e2e; */\n.bg-yellow-700 /* background-color: #b7791f; */\n.bg-yellow-800 /* background-color: #975a16; */\n.bg-yellow-900 /* background-color: #744210; */\n.bg-green-100 /* background-color: #f0fff4; */\n.bg-green-200 /* background-color: #c6f6d5; */\n.bg-green-300 /* background-color: #9ae6b4; */\n.bg-green-400 /* background-color: #68d391; */\n.bg-green-500 /* background-color: #48bb78; */\n.bg-green-600 /* background-color: #38a169; */\n.bg-green-700 /* background-color: #2f855a; */\n.bg-green-800 /* background-color: #276749; */\n.bg-green-900 /* background-color: #22543d; */\n.bg-teal-100 /* background-color: #e6fffa; */\n.bg-teal-200 /* background-color: #b2f5ea; */\n.bg-teal-300 /* background-color: #81e6d9; */\n.bg-teal-400 /* background-color: #4fd1c5; */\n.bg-teal-500 /* background-color: #38b2ac; */\n.bg-teal-600 /* background-color: #319795; */\n.bg-teal-700 /* background-color: #2c7a7b; */\n.bg-teal-800 /* background-color: #285e61; */\n.bg-teal-900 /* background-color: #234e52; */\n.bg-blue-100 /* background-color: #ebf8ff; */\n.bg-blue-200 /* background-color: #bee3f8; */\n.bg-blue-300 /* background-color: #90cdf4; */\n.bg-blue-400 /* background-color: #63b3ed; */\n.bg-blue-500 /* background-color: #4299e1; */\n.bg-blue-600 /* background-color: #3182ce; */\n.bg-blue-700 /* background-color: #2b6cb0; */\n.bg-blue-800 /* background-color: #2c5282; */\n.bg-blue-900 /* background-color: #2a4365; */\n.bg-indigo-100 /* background-color: #ebf4ff; */\n.bg-indigo-200 /* background-color: #c3dafe; */\n.bg-indigo-300 /* background-color: #a3bffa; */\n.bg-indigo-400 /* background-color: #7f9cf5; */\n.bg-indigo-500 /* background-color: #667eea; */\n.bg-indigo-600 /* background-color: #5a67d8; */\n.bg-indigo-700 /* background-color: #4c51bf; */\n.bg-indigo-800 /* background-color: #434190; */\n.bg-indigo-900 /* background-color: #3c366b; */\n.bg-purple-100 /* background-color: #faf5ff; */\n.bg-purple-200 /* background-color: #e9d8fd; */\n.bg-purple-300 /* background-color: #d6bcfa; */\n.bg-purple-400 /* background-color: #b794f4; */\n.bg-purple-500 /* background-color: #9f7aea; */\n.bg-purple-600 /* background-color: #805ad5; */\n.bg-purple-700 /* background-color: #6b46c1; */\n.bg-purple-800 /* background-color: #553c9a; */\n.bg-purple-900 /* background-color: #44337a; */\n.bg-pink-100 /* background-color: #fff5f7; */\n.bg-pink-200 /* background-color: #fed7e2; */\n.bg-pink-300 /* background-color: #fbb6ce; */\n.bg-pink-400 /* background-color: #f687b3; */\n.bg-pink-500 /* background-color: #ed64a6; */\n.bg-pink-600 /* background-color: #d53f8c; */\n.bg-pink-700 /* background-color: #b83280; */\n.bg-pink-800 /* background-color: #97266d; */\n.bg-pink-900 /* background-color: #702459; */\n\n/*\n * BACKGROUND POSITION\n * --------------------\n * Utilities for controlling how a background image behaves when scrolling.\n * By default, only responsive variants are generated for background position utilities.\n */\n\n.bg-bottom /* background-position: bottom; */\n.bg-center /* background-position: center; */\n.bg-left /* background-position: left; */\n.bg-left-bottom /* background-position: left bottom; */\n.bg-left-top /* background-position: left top; */\n.bg-right /* background-position: right; */\n.bg-right-bottom /* background-position: right bottom; */\n.bg-right-top /* background-position: right top; */\n.bg-top /* background-position: top; */\n\n/*\n * BACKGROUND REPEAT\n * --------------------\n * Utilities for controlling the repetition of an element's background image.\n * By default, only responsive variants are generated for background repeat utilities.\n */\n\n.bg-repeat /* background-repeat: repeat; */\n.bg-no-repeat /* background-repeat: no-repeat; */\n.bg-repeat-x /* background-repeat: repeat-x; */\n.bg-repeat-y /* background-repeat: repeat-y; */\n.bg-repeat-round /* background-repeat: round; */\n.bg-repeat-space /* background-repeat: space; */\n\n/*\n * BACKGROUND SIZE\n * --------------------\n * Utilities for controlling the background size of an element's background image.\n * By default, only responsive variants are generated for background size utilities.\n */\n\n .bg-auto /* background-size: auto; */\n .bg-cover /* background-size: cover; */\n .bg-contain /* background-size: contain; */\n\n/* *******************************************************************************************\n * BORDERS\n * ******************************************************************************************* */\n \n/*\n * BORDER COLOR\n * --------------------\n * Utilities for controlling the color of an element's borders.\n * By default, only responsive, hover and focus variants are generated for border color utilities.\n */\n\n.border-transparent /* border-color: transparent; */\n.border-black /* border-color: #000; */\n.border-white /* border-color: #fff; */\n.border-gray-100 /* border-color: #f7fafc; */\n.border-gray-200 /* border-color: #edf2f7; */\n.border-gray-300 /* border-color: #e2e8f0; */\n.border-gray-400 /* border-color: #cbd5e0; */\n.border-gray-500 /* border-color: #a0aec0; */\n.border-gray-600 /* border-color: #718096; */\n.border-gray-700 /* border-color: #4a5568; */\n.border-gray-800 /* border-color: #2d3748; */\n.border-gray-900 /* border-color: #1a202c; */\n.border-red-100 /* border-color: #fff5f5; */\n.border-red-200 /* border-color: #fed7d7; */\n.border-red-300 /* border-color: #feb2b2; */\n.border-red-400 /* border-color: #fc8181; */\n.border-red-500 /* border-color: #f56565; */\n.border-red-600 /* border-color: #e53e3e; */\n.border-red-700 /* border-color: #c53030; */\n.border-red-800 /* border-color: #9b2c2c; */\n.border-red-900 /* border-color: #742a2a; */\n.border-orange-100 /* border-color: #fffaf0; */\n.border-orange-200 /* border-color: #feebc8; */\n.border-orange-300 /* border-color: #fbd38d; */\n.border-orange-400 /* border-color: #f6ad55; */\n.border-orange-500 /* border-color: #ed8936; */\n.border-orange-600 /* border-color: #dd6b20; */\n.border-orange-700 /* border-color: #c05621; */\n.border-orange-800 /* border-color: #9c4221; */\n.border-orange-900 /* border-color: #7b341e; */\n.border-yellow-100 /* border-color: #fffff0; */\n.border-yellow-200 /* border-color: #fefcbf; */\n.border-yellow-300 /* border-color: #faf089; */\n.border-yellow-400 /* border-color: #f6e05e; */\n.border-yellow-500 /* border-color: #ecc94b; */\n.border-yellow-600 /* border-color: #d69e2e; */\n.border-yellow-700 /* border-color: #b7791f; */\n.border-yellow-800 /* border-color: #975a16; */\n.border-yellow-900 /* border-color: #744210; */\n.border-green-100 /* border-color: #f0fff4; */\n.border-green-200 /* border-color: #c6f6d5; */\n.border-green-300 /* border-color: #9ae6b4; */\n.border-green-400 /* border-color: #68d391; */\n.border-green-500 /* border-color: #48bb78; */\n.border-green-600 /* border-color: #38a169; */\n.border-green-700 /* border-color: #2f855a; */\n.border-green-800 /* border-color: #276749; */\n.border-green-900 /* border-color: #22543d; */\n.border-teal-100 /* border-color: #e6fffa; */\n.border-teal-200 /* border-color: #b2f5ea; */\n.border-teal-300 /* border-color: #81e6d9; */\n.border-teal-400 /* border-color: #4fd1c5; */\n.border-teal-500 /* border-color: #38b2ac; */\n.border-teal-600 /* border-color: #319795; */\n.border-teal-700 /* border-color: #2c7a7b; */\n.border-teal-800 /* border-color: #285e61; */\n.border-teal-900 /* border-color: #234e52; */\n.border-blue-100 /* border-color: #ebf8ff; */\n.border-blue-200 /* border-color: #bee3f8; */\n.border-blue-300 /* border-color: #90cdf4; */\n.border-blue-400 /* border-color: #63b3ed; */\n.border-blue-500 /* border-color: #4299e1; */\n.border-blue-600 /* border-color: #3182ce; */\n.border-blue-700 /* border-color: #2b6cb0; */\n.border-blue-800 /* border-color: #2c5282; */\n.border-blue-900 /* border-color: #2a4365; */\n.border-indigo-100 /* border-color: #ebf4ff; */\n.border-indigo-200 /* border-color: #c3dafe; */\n.border-indigo-300 /* border-color: #a3bffa; */\n.border-indigo-400 /* border-color: #7f9cf5; */\n.border-indigo-500 /* border-color: #667eea; */\n.border-indigo-600 /* border-color: #5a67d8; */\n.border-indigo-700 /* border-color: #4c51bf; */\n.border-indigo-800 /* border-color: #434190; */\n.border-indigo-900 /* border-color: #3c366b; */\n.border-purple-100 /* border-color: #faf5ff; */\n.border-purple-200 /* border-color: #e9d8fd; */\n.border-purple-300 /* border-color: #d6bcfa; */\n.border-purple-400 /* border-color: #b794f4; */\n.border-purple-500 /* border-color: #9f7aea; */\n.border-purple-600 /* border-color: #805ad5; */\n.border-purple-700 /* border-color: #6b46c1; */\n.border-purple-800 /* border-color: #553c9a; */\n.border-purple-900 /* border-color: #44337a; */\n.border-pink-100 /* border-color: #fff5f7; */\n.border-pink-200 /* border-color: #fed7e2; */\n.border-pink-300 /* border-color: #fbb6ce; */\n.border-pink-400 /* border-color: #f687b3; */\n.border-pink-500 /* border-color: #ed64a6; */\n.border-pink-600 /* border-color: #d53f8c; */\n.border-pink-700 /* border-color: #b83280; */\n.border-pink-800 /* border-color: #97266d; */\n.border-pink-900 /* border-color: #702459; */\n\n/*\n * BORDER STYLE\n * --------------------\n * Utilities for controlling the style of an element's borders.\n * By default, only responsive variants are generated for border style utilities.\n */\n\n.border-solid /* border-style: solid; */\n.border-dashed /* border-style: dashed; */\n.border-dotted /* border-style: dotted; */\n.border-double /* border-style: double; */\n.border-none /* border-style: none; */\n\n/*\n * BORDER WIDTH\n * --------------------\n * Utilities for controlling the width of an element's borders.\n * By default, only responsive variants are generated for border width utilities.\n */\n\n.border /* border-width: 1px; */\n.border-0 /* border-width: 0; */\n.border-2 /* border-width: 2px; */\n.border-4 /* border-width: 4px; */\n.border-8 /* border-width: 8px; */\n.border-t /* border-top-width: 1px; */\n.border-r /* border-right-width: 1px; */\n.border-b /* border-bottom-width: 1px; */\n.border-l /* border-left-width: 1px; */\n.border-t-0 /* border-top-width: 0; */\n.border-r-0 /* border-right-width: 0; */\n.border-b-0 /* border-bottom-width: 0; */\n.border-l-0 /* border-left-width: 0; */\n.border-t-2 /* border-top-width: 2px; */\n.border-r-2 /* border-right-width: 2px; */\n.border-b-2 /* border-bottom-width: 2px; */\n.border-l-2 /* border-left-width: 2px; */\n.border-t-4 /* border-top-width: 4px; */\n.border-r-4 /* border-right-width: 4px; */\n.border-b-4 /* border-bottom-width: 4px; */\n.border-l-4 /* border-left-width: 4px; */\n.border-t-8 /* border-top-width: 8px; */\n.border-r-8 /* border-right-width: 8px; */\n.border-b-8 /* border-bottom-width: 8px; */\n.border-l-8 /* border-left-width: 8px; */\n\n/*\n * BORDER RADIUS\n * --------------------\n * Utilities for controlling the border radius of an element.\n * By default, only responsive variants are generated for border radius utilities.\n */\n\n.rounded-none /* border-radius: 0; */\n.rounded-sm /* border-radius: 0.125rem; */\n.rounded /* border-radius: 0.25rem; */\n.rounded-md /* border-radius: 0.375rem; */\n.rounded-lg /* border-radius: 0.5rem; */\n.rounded-full /* border-radius: 9999px; */\n.rounded-t-none /* border-top-left-radius: 0; border-top-right-radius: 0; */\n.rounded-r-none /* border-top-right-radius: 0; border-bottom-right-radius: 0; */\n.rounded-b-none /* border-bottom-right-radius: 0; border-bottom-left-radius: 0; */\n.rounded-l-none /* border-top-left-radius: 0; border-bottom-left-radius: 0; */\n.rounded-t-sm /* border-top-left-radius: 0.125rem; border-top-right-radius: 0.125rem; */\n.rounded-r-sm /* border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem; */\n.rounded-b-sm /* border-bottom-right-radius: 0.125rem; border-bottom-left-radius: 0.125rem; */\n.rounded-l-sm /* border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem; */\n.rounded-t /* border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; */\n.rounded-r /* border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; */\n.rounded-b /* border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; */\n.rounded-l /* border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; */\n.rounded-t-md /* border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem; */\n.rounded-r-md /* border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem; */\n.rounded-b-md /* border-bottom-right-radius: 0.375rem; border-bottom-left-radius: 0.375rem; */\n.rounded-l-md /* border-top-left-radius: 0.375rem; border-bottom-left-radius: 0.375rem; */\n.rounded-t-lg /* border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; */\n.rounded-r-lg /* border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; */\n.rounded-b-lg /* border-bottom-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem; */\n.rounded-l-lg /* border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; */\n.rounded-t-full /* border-top-left-radius: 9999px; border-top-right-radius: 9999px; */\n.rounded-r-full /* border-top-right-radius: 9999px; border-bottom-right-radius: 9999px; */\n.rounded-b-full /* border-bottom-right-radius: 9999px; border-bottom-left-radius: 9999px; */\n.rounded-l-full /* border-top-left-radius: 9999px; border-bottom-left-radius: 9999px; */\n.rounded-tl-none /* border-top-left-radius: 0; */\n.rounded-tr-none /* border-top-right-radius: 0; */\n.rounded-br-none /* border-bottom-right-radius: 0; */\n.rounded-bl-none /* border-bottom-left-radius: 0; */\n.rounded-tl-sm /* border-top-left-radius: 0.125rem; */\n.rounded-tr-sm /* border-top-right-radius: 0.125rem; */\n.rounded-br-sm /* border-bottom-right-radius: 0.125rem; */\n.rounded-bl-sm /* border-bottom-left-radius: 0.125rem; */\n.rounded-tl /* border-top-left-radius: 0.25rem; */\n.rounded-tr /* border-top-right-radius: 0.25rem; */\n.rounded-br /* border-bottom-right-radius: 0.25rem; */\n.rounded-bl /* border-bottom-left-radius: 0.25rem; */\n.rounded-tl-md /* border-top-left-radius: 0.375rem; */\n.rounded-tr-md /* border-top-right-radius: 0.375rem; */\n.rounded-br-md /* border-bottom-right-radius: 0.375rem; */\n.rounded-bl-md /* border-bottom-left-radius: 0.375rem; */\n.rounded-tl-lg /* border-top-left-radius: 0.5rem; */\n.rounded-tr-lg /* border-top-right-radius: 0.5rem; */\n.rounded-br-lg /* border-bottom-right-radius: 0.5rem; */\n.rounded-bl-lg /* border-bottom-left-radius: 0.5rem; */\n.rounded-tl-full /* border-top-left-radius: 9999px; */\n.rounded-tr-full /* border-top-right-radius: 9999px; */\n.rounded-br-full /* border-bottom-right-radius: 9999px; */\n.rounded-bl-full /* border-bottom-left-radius: 9999px; */\n\n/* *******************************************************************************************\n * TABLES\n * ******************************************************************************************* */\n\n/*\n * TABLE LAYOUT\n * --------------------\n * Utilities for controlling the table layout algorithm.\n * By default, only responsive variants are generated for table layout utilities.\n */\n\n.table-auto /* table-layout: auto; */\n.table-fixed /* table-layout: fixed; */\n\n/*\n * BORDER COLLAPSE\n * --------------------\n * Utilities for controlling whether table borders should collapse or be separated.\n * By default, only responsive variants are generated for border collapse utilities.\n */\n\n.border-collapse /* border-collapse: collapse; */\n.border-separate /* border-collapse: separate; */\n \n/* *******************************************************************************************\n * EFFECTS\n * ******************************************************************************************* */\n \n/*\n * BOX SHADOW\n * --------------------\n * Utilities for controlling the box shadow of an element.\n * By default, only responsive, hover and focus variants are generated for box shadow utilities.\n */\n\n.shadow-xs /* box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05); */\n.shadow-sm /* box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); */\n.shadow /* box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); */\n.shadow-md /* box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); */\n.shadow-lg /* box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); */\n.shadow-xl /* box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); */\n.shadow-2xl /* box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); */\n.shadow-inner /* box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06); */\n.shadow-outline /* box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5); */\n.shadow-none /* box-shadow: none; */\n\n/*\n * OPACITY\n * --------------------\n * Utilities for controlling the opacity of an element.\n * By default, only responsive, hover and focus variants are generated for opacity utilities.\n */\n\n.opacity-100 /* opacity: 1; */\n.opacity-75 /* opacity: .75; */\n.opacity-50 /* opacity: .5; */\n.opacity-25 /* opacity: .25; */\n.opacity-0 /* opacity: 0; */\n\n/* *******************************************************************************************\n * TRANSITIONS\n * ******************************************************************************************* */\n \n/*\n * TRANSITION PROPERTY\n * --------------------\n * Utilities for controlling which CSS properties transition.\n * By default, only responsive variants are generated for transition-property utilities.\n */\n\n.transition-none /* transition-property: none; */\n.transition-all /* transition-property: all; */\n.transition /* transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform; */\n.transition-colors /* transition-property: background-color, border-color, color, fill, stroke; */\n.transition-opacity /* transition-property: opacity; */\n.transition-shadow /* transition-property: box-shadow; */\n.transition-transform /* transition-property: transform; */\n\n/*\n * TRANSITION DURATION\n * --------------------\n * Utilities for controlling the duration of CSS transitions.\n * By default, only responsive variants are generated for transition-duration utilities.\n */\n\n.duration-75 /* transition-duration: 75ms; */\n.duration-100 /* transition-duration: 100ms; */\n.duration-150 /* transition-duration: 150ms; */\n.duration-200 /* transition-duration: 200ms; */\n.duration-300 /* transition-duration: 300ms; */\n.duration-500 /* transition-duration: 500ms; */\n.duration-700 /* transition-duration: 700ms; */\n.duration-1000 /* transition-duration: 1000ms; */\n\n/*\n * TRANSITION TIMING FUNCTION\n * --------------------\n * Utilities for controlling the easing of CSS transitions.\n * By default, only responsive variants are generated for transition-timing-function utilities.\n */\n\n.ease-linear /* transition-timing-function: linear; */\n.ease-in /* transition-timing-function: cubic-bezier(0.4, 0, 1, 1); */\n.ease-out /* transition-timing-function: cubic-bezier(0, 0, 0.2, 1); */\n.ease-in-out /* transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); */\n\n/* *******************************************************************************************\n * TRANSFORMS\n * ******************************************************************************************* */\n\n/*\n * SCALE\n * --------------------\n * Utilities for scaling elements with transform.\n * By default, only responsive, hover and focus variants are generated for scale utilities.\n */\n\n.scale-0 /* --transform-scale-x: 0; --transform-scale-y: 0; */\n.scale-50 /* --transform-scale-x: .5; --transform-scale-y: .5; */\n.scale-75 /* --transform-scale-x: .75; --transform-scale-y: .75; */\n.scale-90 /* --transform-scale-x: .9; --transform-scale-y: .9; */\n.scale-95 /* --transform-scale-x: .95; --transform-scale-y: .95; */\n.scale-100 /* --transform-scale-x: 1; --transform-scale-y: 1; */\n.scale-105 /* --transform-scale-x: 1.05; --transform-scale-y: 1.05; */\n.scale-110 /* --transform-scale-x: 1.1; --transform-scale-y: 1.1; */\n.scale-125 /* --transform-scale-x: 1.25; --transform-scale-y: 1.25; */\n.scale-150 /* --transform-scale-x: 1.5; --transform-scale-y: 1.5; */\n.scale-x-0 /* --transform-scale-x: 0; */\n.scale-x-50 /* --transform-scale-x: .5; */\n.scale-x-75 /* --transform-scale-x: .75; */\n.scale-x-90 /* --transform-scale-x: .9; */\n.scale-x-95 /* --transform-scale-x: .95; */\n.scale-x-100 /* --transform-scale-x: 1; */\n.scale-x-105 /* --transform-scale-x: 1.05; */\n.scale-x-110 /* --transform-scale-x: 1.1; */\n.scale-x-125 /* --transform-scale-x: 1.25; */\n.scale-x-150 /* --transform-scale-x: 1.5; */\n.scale-y-0 /* --transform-scale-y: 0; */\n.scale-y-50 /* --transform-scale-y: .5; */\n.scale-y-75 /* --transform-scale-y: .75; */\n.scale-y-90 /* --transform-scale-y: .9; */\n.scale-y-95 /* --transform-scale-y: .95; */\n.scale-y-100 /* --transform-scale-y: 1; */\n.scale-y-105 /* --transform-scale-y: 1.05; */\n.scale-y-110 /* --transform-scale-y: 1.1; */\n.scale-y-125 /* --transform-scale-y: 1.25; */\n.scale-y-150 /* --transform-scale-y: 1.5; */\n\n/*\n * ROTATE\n * --------------------\n * Utilities for rotating elements with transform.\n * By default, only responsive, hover and focus variants are generated for rotate utilities.\n */\n\n.rotate-0 /* --transform-rotate: 0; */\n.rotate-45 /* --transform-rotate: 45deg; */\n.rotate-90 /* --transform-rotate: 90deg; */\n.rotate-180 /* --transform-rotate: 180deg; */\n.-rotate-180 /* --transform-rotate: -180deg; */\n.-rotate-90 /* --transform-rotate: -90deg; */\n.-rotate-45 /* --transform-rotate: -45deg; */\n\n/*\n * TRANSLATE\n * --------------------\n * Utilities for translating elements with transform.\n * By default, only responsive, hover and focus variants are generated for translate utilities.\n */\n\n.translate-x-0 /* --transform-translate-x: 0; */\n.translate-x-1 /* --transform-translate-x: 0.25rem; */\n.translate-x-2 /* --transform-translate-x: 0.5rem; */\n.translate-x-3 /* --transform-translate-x: 0.75rem; */\n.translate-x-4 /* --transform-translate-x: 1rem; */\n.translate-x-5 /* --transform-translate-x: 1.25rem; */\n.translate-x-6 /* --transform-translate-x: 1.5rem; */\n.translate-x-8 /* --transform-translate-x: 2rem; */\n.translate-x-10 /* --transform-translate-x: 2.5rem; */\n.translate-x-12 /* --transform-translate-x: 3rem; */\n.translate-x-16 /* --transform-translate-x: 4rem; */\n.translate-x-20 /* --transform-translate-x: 5rem; */\n.translate-x-24 /* --transform-translate-x: 6rem; */\n.translate-x-32 /* --transform-translate-x: 8rem; */\n.translate-x-40 /* --transform-translate-x: 10rem; */\n.translate-x-48 /* --transform-translate-x: 12rem; */\n.translate-x-56 /* --transform-translate-x: 14rem; */\n.translate-x-64 /* --transform-translate-x: 16rem; */\n.translate-x-px /* --transform-translate-x: 1px; */\n.-translate-x-1 /* --transform-translate-x: -0.25rem; */\n.-translate-x-2 /* --transform-translate-x: -0.5rem; */\n.-translate-x-3 /* --transform-translate-x: -0.75rem; */\n.-translate-x-4 /* --transform-translate-x: -1rem; */\n.-translate-x-5 /* --transform-translate-x: -1.25rem; */\n.-translate-x-6 /* --transform-translate-x: -1.5rem; */\n.-translate-x-8 /* --transform-translate-x: -2rem; */\n.-translate-x-10 /* --transform-translate-x: -2.5rem; */\n.-translate-x-12 /* --transform-translate-x: -3rem; */\n.-translate-x-16 /* --transform-translate-x: -4rem; */\n.-translate-x-20 /* --transform-translate-x: -5rem; */\n.-translate-x-24 /* --transform-translate-x: -6rem; */\n.-translate-x-32 /* --transform-translate-x: -8rem; */\n.-translate-x-40 /* --transform-translate-x: -10rem; */\n.-translate-x-48 /* --transform-translate-x: -12rem; */\n.-translate-x-56 /* --transform-translate-x: -14rem; */\n.-translate-x-64 /* --transform-translate-x: -16rem; */\n.-translate-x-px /* --transform-translate-x: -1px; */\n.-translate-x-full /* --transform-translate-x: -100%; */\n.-translate-x-1/2 /* --transform-translate-x: -50%; */\n.translate-x-1/2 /* --transform-translate-x: 50%; */\n.translate-x-full /* --transform-translate-x: 100%; */\n.translate-y-0 /* --transform-translate-y: 0; */\n.translate-y-1 /* --transform-translate-y: 0.25rem; */\n.translate-y-2 /* --transform-translate-y: 0.5rem; */\n.translate-y-3 /* --transform-translate-y: 0.75rem; */\n.translate-y-4 /* --transform-translate-y: 1rem; */\n.translate-y-5 /* --transform-translate-y: 1.25rem; */\n.translate-y-6 /* --transform-translate-y: 1.5rem; */\n.translate-y-8 /* --transform-translate-y: 2rem; */\n.translate-y-10 /* --transform-translate-y: 2.5rem; */\n.translate-y-12 /* --transform-translate-y: 3rem; */\n.translate-y-16 /* --transform-translate-y: 4rem; */\n.translate-y-20 /* --transform-translate-y: 5rem; */\n.translate-y-24 /* --transform-translate-y: 6rem; */\n.translate-y-32 /* --transform-translate-y: 8rem; */\n.translate-y-40 /* --transform-translate-y: 10rem; */\n.translate-y-48 /* --transform-translate-y: 12rem; */\n.translate-y-56 /* --transform-translate-y: 14rem; */\n.translate-y-64 /* --transform-translate-y: 16rem; */\n.translate-y-px /* --transform-translate-y: 1px; */\n.-translate-y-1 /* --transform-translate-y: -0.25rem; */\n.-translate-y-2 /* --transform-translate-y: -0.5rem; */\n.-translate-y-3 /* --transform-translate-y: -0.75rem; */\n.-translate-y-4 /* --transform-translate-y: -1rem; */\n.-translate-y-5 /* --transform-translate-y: -1.25rem; */\n.-translate-y-6 /* --transform-translate-y: -1.5rem; */\n.-translate-y-8 /* --transform-translate-y: -2rem; */\n.-translate-y-10 /* --transform-translate-y: -2.5rem; */\n.-translate-y-12 /* --transform-translate-y: -3rem; */\n.-translate-y-16 /* --transform-translate-y: -4rem; */\n.-translate-y-20 /* --transform-translate-y: -5rem; */\n.-translate-y-24 /* --transform-translate-y: -6rem; */\n.-translate-y-32 /* --transform-translate-y: -8rem; */\n.-translate-y-40 /* --transform-translate-y: -10rem; */\n.-translate-y-48 /* --transform-translate-y: -12rem; */\n.-translate-y-56 /* --transform-translate-y: -14rem; */\n.-translate-y-64 /* --transform-translate-y: -16rem; */\n.-translate-y-px /* --transform-translate-y: -1px; */\n.-translate-y-full /* --transform-translate-y: -100%; */\n.-translate-y-1/2 /* --transform-translate-y: -50%; */\n.translate-y-1/2 /* --transform-translate-y: 50%; */\n.translate-y-full /* --transform-translate-y: 100%; */\n\n/*\n * SKEW\n * --------------------\n * Utilities for translating elements with transform.\n * By default, only responsive, hover and focus variants are generated for skew utilities.\n */\n\n.skew-x-0 /* --transform-skew-x: 0; */\n.skew-x-3 /* --transform-skew-x: 3deg; */\n.skew-x-6 /* --transform-skew-x: 6deg; */\n.skew-x-12 /* --transform-skew-x: 12deg; */\n.-skew-x-12 /* --transform-skew-x: -12deg; */\n.-skew-x-6 /* --transform-skew-x: -6deg; */\n.-skew-x-3 /* --transform-skew-x: -3deg; */\n.skew-y-0 /* --transform-skew-y: 0; */\n.skew-y-3 /* --transform-skew-y: 3deg; */\n.skew-y-6 /* --transform-skew-y: 6deg; */\n.skew-y-12 /* --transform-skew-y: 12deg; */\n.-skew-y-12 /* --transform-skew-y: -12deg; */\n.-skew-y-6 /* --transform-skew-y: -6deg; */\n.-skew-y-3 /* --transform-skew-y: -3deg; */\n\n/*\n * TRANSFORM ORIGIN\n * --------------------\n * Utilities for specifying the origin for an element's transformations.\n * By default, only responsive variants are generated for transform-origin utilities.\n */\n\n.origin-center /* transform-origin: center; */\n.origin-top /* transform-origin: top; */\n.origin-top-right /* transform-origin: top right; */\n.origin-right /* transform-origin: right; */\n.origin-bottom-right /* transform-origin: bottom right; */\n.origin-bottom /* transform-origin: bottom; */\n.origin-bottom-left /* transform-origin: bottom left; */\n.origin-left /* transform-origin: left; */\n.origin-top-left /* transform-origin: top left; */\n\n/* *******************************************************************************************\n * INTERACTIVITY\n * ******************************************************************************************* */\n \n/*\n * APPEARANCE\n * --------------------\n * Utilities for suppressing native form control styling.\n * By default, only responsive variants are generated for appearance utilities.\n */\n\n.appearance-none /* appearance: none; */\n\n/*\n * CURSOR\n * --------------------\n * Utilities for controlling the cursor style when hovering over an element.\n * By default, only responsive variants are generated for cursor utilities.\n */\n\n.cursor-auto /* cursor: auto; */\n.cursor-default /* cursor: default; */\n.cursor-pointer /* cursor: pointer; */\n.cursor-wait /* cursor: wait; */\n.cursor-text /* cursor: text; */\n.cursor-move /* cursor: move; */\n.cursor-not-allowed /* cursor: not-allowed; */\n\n/*\n * OUTLINE\n * --------------------\n * Utilities for controlling an element's outline.\n * By default, only focus variants are generated for outline utilities.\n */\n\n.outline-none /* outline: 0; */\n\n/*\n * POINTER EVENTS\n * --------------------\n * Utilities for controlling whether an element responds to pointer events.\n * By default, only responsive variants are generated for pointer event utilities.\n */\n\n.pointer-events-none /* pointer-events: none; */\n.pointer-events-auto /* pointer-events: auto; */\n\n/*\n * RESIZE\n * --------------------\n * Utilities for controlling how an element can be resized.\n * By default, only responsive variants are generated for resizing utilities.\n */\n\n.resize-none /* resize: none; */\n.resize /* resize: both; */\n.resize-y /* resize: vertical; */\n.resize-x /* resize: horizontal; */\n\n/*\n * USER SELECT\n * --------------------\n * Utilities for controlling whether the user can select text in an element.\n * By default, only responsive variants are generated for user-select utilities.\n */\n\n.select-none /* user-select: none; */\n.select-text /* user-select: text; */\n.select-all /* user-select: all; */\n.select-auto /* user-select: auto; */\n\n/* *******************************************************************************************\n * SVG\n * ******************************************************************************************* */\n \n/*\n * FILL\n * --------------------\n * Utilities for styling the fill of SVG elements.\n * By default, only responsive variants are generated for fill utilities.\n */\n\n.fill-current /* fill: currentColor; */\n\n/*\n * STROKE\n * --------------------\n * Utilities for styling the stroke of SVG elements.\n * By default, only responsive variants are generated for stroke utilities.\n */\n\n.stroke-current /* stroke: currentColor; */\n\n/*\n * STROKE WIDTH\n * --------------------\n * Utilities for styling the stroke width of SVG elements.\n * By default, only responsive variants are generated for stroke-width utilities.\n */\n\n.stroke-0 /* stroke-width: 0; */\n.stroke-1 /* stroke-width: 1; */\n.stroke-2 /* stroke-width: 2; */\n\n/* *******************************************************************************************\n * ACCESSIBILITY\n * ******************************************************************************************* */\n \n/*\n * SCREEN READERS\n * --------------------\n * Utilities for improving accessibility with screen readers.\n * By default, only responsive, hover, focus and active variants are generated for accessibility utilities.\n */\n\n.sr-only /* position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; */\n.not-sr-only /* position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip: auto; white-space: normal; */\n"
},
{
"path": "frontend/vue.js",
"content": "/* *******************************************************************************************\n * GLOBAL CONFIG\n * Vue.config is an object containing Vue’s global configurations.\n * You can modify its properties listed below before bootstrapping your application.\n * https://vuejs.org/v2/api/#Global-Config\n * ******************************************************************************************* */\n\n\n// Configure whether to allow vue-devtools inspection\nVue.config.devtools = true\n\n// Enable component init, compile, render and patch performance tracing in the browser devtool timeline.\nVue.config.performance = true\n\n// Prevent the production tip on Vue startup.\nVue.config.productionTip = false\n\n// Suppress all Vue logs and warnings\nVue.config.silent = false\n\n// Make Vue ignore custom elements defined outside of Vue\nVue.config.ignoredElements = [\n 'my-custom-web-component',\n 'another-web-component',\n /^ion-/\n]\n\n// Define custom key alias(es) for v-on.\nVue.config.keyCodes = {\n v: 86,\n f1: 112,\n // camelCase won`t work\n mediaPlayPause: 179,\n // instead you can use kebab-case with double quotation marks\n \"media-play-pause\": 179,\n up: [38, 87]\n}\n\n// Assign a handler for uncaught errors during component render function and watchers. \nVue.config.errorHandler = function (err, vm, info) {\n // handle error\n // `info` is a Vue-specific error info, e.g. which lifecycle hook\n // the error was found in. Only available in 2.2.0+\n}\n\n// Define custom merging strategies for options\nVue.config.optionMergeStrategies._my_option = function (parent, child, vm) {\n return child + 1\n}\n\n// Assign a custom handler for runtime Vue warnings.\n// Note this only works during development and is ignored in production.\nVue.config.warnHandler = function (msg, vm, trace) {\n // `trace` is the component hierarchy trace\n}\n\n\n/* *******************************************************************************************\n * GLOBAL API\n * https://vuejs.org/v2/api/#Global-API\n * ******************************************************************************************* */\n\n\nVue.version // Provides the installed version of Vue as a string.\n\nVue.extend(options) // Create a “subclass” of the base Vue constructor.\nVue.mixin( mixin ) // Apply a mixin globally, which affects every Vue instance created afterwards.\nVue.nextTick([callback, context]) // Defer the callback to be executed after the next DOM update cycle.\nVue.use(plugin) // Install a Vue.js plugin. If the plugin is an Object, it must expose an install method.\n\nVue.set(target, key, value) // Set a property on an object. If the object is reactive, ensure the property is created as a reactive property and trigger view updates.\nVue.delete(target, key) // Delete a property on an object. If the object is reactive, ensure the deletion triggers view updates.\n\n// Register or retrieve a global directive.\nVue.directive('my-directive', {\n bind: function () {},\n inserted: function () {},\n update: function () {},\n componentUpdated: function () {},\n unbind: function () {}\n})\n\n// Register (function directive)\nVue.directive('my-directive', function () {\n // This will be called as `bind` and `update`\n})\n\n// Getter, return the directive definition if registered\nvar myDirective = Vue.directive('my-directive')\n\n// Register a global filter\nVue.filter('my-filter', function (value) { })\n\n// Getter, return the filter if registered\nvar myFilter = Vue.filter('my-filter')\n\n// Register an extended constructor\nVue.component('my-component', Vue.extend({ }))\n\n// Register an options object (automatically call Vue.extend)\nVue.component('my-component', { })\n\n// Retrieve a registered component (always return constructor)\nvar MyComponent = Vue.component('my-component')\n\nVue.compile(template) // Compiles a template string into a render function\n\n\n/* *******************************************************************************************\n * OPTIONS > DATA\n * https://vuejs.org/v2/api/#Options-Data\n * ******************************************************************************************* */\n\n\nnew Vue({\n // A list/hash of attributes that are exposed to accept data from the parent component.\n // It has an Array-based simple syntax and an alternative Object-based syntax that allows\n // advanced configurations such as type checking, custom validation and default values.\n props: {\n height: Number,\n age: {\n type: Number,\n default: 0,\n required: true,\n validator: function (value) {\n return value >= 0\n }\n }\n },\n\n // Primarily intended to make unit testing easier\n propsData: {\n age: 12\n },\n\n // The data object for the Vue instance.\n // Vue will recursively convert its properties into getter/setters to make it “reactive”. \n // Note: you should not use an arrow function with the data property\n data () {\n return {\n a: 1,\n b: 2\n }\n },\n\n // Computed properties to be mixed into the Vue instance.\n // All getters and setters have their this context automatically bound to the Vue instance.\n // Computed properties are cached, and only re-computed on reactive dependency changes.\n // Note that if a certain dependency is out of the instance’s scope (i.e. not reactive),\n // the computed property will not be updated.\n computed: {\n // Note: you should not use an arrow function to define a computed property.\n aDouble: function () {\n return this.a * 2\n },\n aPlus: {\n get: function () {\n return this.a + 1\n },\n set: function (v) {\n this.a = v - 1\n }\n }\n },\n\n // An object where keys are expressions to watch and values are the corresponding callbacks.\n // The value can also be a string of a method name, or an Object that contains additional options.\n // The Vue instance will call $watch() for each entry in the object at instantiation.\n watch: {\n // Note: you should not use an arrow function to define a watcher.\n a: function (val, oldVal) {\n console.log('new: %s, old: %s', val, oldVal)\n },\n // String method name\n b: 'someMethod',\n // Deep watcher\n c: {\n handler: function (val, oldVal) { /* ... */ },\n deep: true\n },\n // The callback will be called immediately after the start of the observation\n d: {\n handler: function (val, oldVal) { /* ... */ },\n immediate: true\n }\n },\n\n // Methods to be mixed into the Vue instance. You can access these methods directly on the VM instance,\n // or use them in directive expressions. All methods will have their this context automatically bound to\n // the Vue instance.\n methods: {\n // Note: you should not use an arrow function to define a method.\n plus () {\n this.a++\n }\n }\n})\n\n\n/* *******************************************************************************************\n * OPTIONS > DOM\n * https://vuejs.org/v2/api/#Options-DOM\n * ******************************************************************************************* */\n\n\nnew Vue({\n // Provide the Vue instance an existing DOM element to mount on.\n // It can be a CSS selector string or an actual HTMLElement.\n // After the instance is mounted, the resolved element will be accessible as vm.$el.\n el: '#example',\n\n // A string template to be used as the markup for the Vue instance.\n // The template will replace the mounted element.\n // Any existing markup inside the mounted element will be ignored,\n // unless content distribution slots are present in the template.\n // If the string starts with # it will be used as a querySelector and\n // use the selected element’s innerHTML as the template string. This\n // allows the use of the common