@charset "UTF-8";

/* Icon */

.icon {
  text-decoration: none;
  border-bottom: none;
  position: relative;
  margin: 2em 0 0 0;
  display: inline-block; /* Hace que los iconos se comporten como elementos en línea */
  padding: 10px; /* Añade espacio alrededor del icono */
  border-radius: 50%; /* Crea iconos circulares */
  background-color: #f0f0f0; /* Fondo gris claro (puedes personalizar el color) */
  transition: all 0.3s ease; /* Agrega una transición suave para los cambios de estilo */
}

.icon:hover {
  background-color: #ddd; /* Cambia el color de fondo al pasar el mouse */
  transform: scale(1.1); /* Amplía ligeramente el icono al pasar el mouse */
}

.icon:before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-transform: none !important;
  font-size: 20px; /* Ajusta el tamaño del icono */
  color: #333; /* Color del icono */
}

.icon > .label {
  display: none;
}


/* List */

	ol {
		list-style: decimal;
		margin: 0 0 2em 0;
		padding-left: 1.25em;
	}

		ol li {
			padding-left: 0.25em;
		}

	ul {
		list-style: disc;
		margin: 0 0 2em 0;
		padding-left: 1em;
	}

		ul li {
			padding-left: 0.5em;
		}

		ul.alt {
			list-style: none;
			padding-left: 0;
		}

			ul.alt li {
				border-top: solid 1px;
				padding: 0.5em 0;
			}

				ul.alt li:first-child {
					border-top: 0;
					padding-top: 0;
				}

		ul.icons {
			cursor: default;
			list-style: none;
			padding-left: 0;
		}

			ul.icons li {
				display: inline-block;
				padding: 0 1em 0 0;
			}

				ul.icons li:last-child {
					padding-right: 0;
				}

				ul.icons li .icon:before {
					font-size: 2em;
				}

		ul.actions {
			cursor: default;
			list-style: none;
			padding-left: 0;
		}

			ul.actions li {
				display: inline-block;
				padding: 0 1em 0 0;
				vertical-align: middle;
			}

				ul.actions li:last-child {
					padding-right: 0;
				}

			ul.actions.small li {
				padding: 0 0.5em 0 0;
			}

			ul.actions.vertical li {
				display: block;
				padding: 1em 0 0 0;
			}

				ul.actions.vertical li:first-child {
					padding-top: 0;
				}

				ul.actions.vertical li > * {
					margin-bottom: 0;
				}

			ul.actions.vertical.small li {
				padding: 0.5em 0 0 0;
			}

				ul.actions.vertical.small li:first-child {
					padding-top: 0;
				}

			ul.actions.fit {
				display: table;
				margin-left: -1em;
				padding: 0;
				table-layout: fixed;
				width: calc(100% + 1em);
			}

				ul.actions.fit li {
					display: table-cell;
					padding: 0 0 0 1em;
				}

					ul.actions.fit li > * {
						margin-bottom: 0;
					}

				ul.actions.fit.small {
					margin-left: -0.5em;
					width: calc(100% + 0.5em);
				}

					ul.actions.fit.small li {
						padding: 0 0 0 0.5em;
					}

			@media screen and (max-width: 480px) {

				ul.actions {
					margin: 0 0 2em 0;
				}

					ul.actions li {
						padding: 1em 0 0 0;
						display: block;
						text-align: center;
						width: 100%;
					}

						ul.actions li:first-child {
							padding-top: 0;
						}

						ul.actions li > * {
							width: 100%;
							margin: 0 !important;
						}

							ul.actions li > *.icon:before {
								margin-left: -2em;
							}

					ul.actions.small li {
						padding: 0.5em 0 0 0;
					}

						ul.actions.small li:first-child {
							padding-top: 0;
						}

			}

	dl {
		margin: 0 0 2em 0;
	}

		dl dt {
			display: block;
			font-weight: 700;
			margin: 0 0 1em 0;
		}

		dl dd {
			margin-left: 2em;
		}

	ul.alt li {
		border-top-color: rgba(255, 255, 255, 0.15);
	}

/* Tab */

	ul.tab-list {
		list-style: none;
		margin: 0 0 1em 0;
		padding: 0;
	}

		ul.tab-list li a {
			background: rgba(255, 255, 255, 0.075);
			border-radius: 4px;
			color: rgba(255, 255, 255, 0.5) !important;
			margin-bottom: .5em;
			padding: .5em 1em;
			display: inline-block;
			width: 100%;
		}

			ul.tab-list li a.active {
				background: #aa14cc;
				color: #fff !important;
			}

			ul.tab-list li a:hover {
				background: #693dcc;
				color: #fff !important;
			}

	.tab {
		display: none;
	}

		.tab.active {
			display: -ms-flexbox;
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
		}