@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@500&display=swap');

html {
	background-size: 100% 100%;
	background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px;
	background: #ffffff;
	background-image: radial-gradient(at 7.9% 86.1%, #d1f1ff 0px, transparent 50%), radial-gradient(at 88.2% 21.4%, #d1fbff 0px, transparent 50%);
	font-family: "Open Sans", sans-serif;
}

.wrapper {
	display: flex;
	flex-flow: row wrap;
	height: 100%;
	text-align: center;
}

.logo {
	display: block;
	float: left;
	text-align: center;
	align-content: center;
}

.logo-container {
	margin: auto;
}

.logo-left {}

.logo-right {}

.logo img {
	width: 800px;
	height: 171px;
}

.links-container,
.links-container div {
	margin: 20px;
}

.links-container img {
	width: 200px;
	height: auto;
}

h2 {
	font-weight: 500;
	font-size: 36px;
	color: #464648;
}

a {
	display: block;
	font-size: 20px;
	font-weight: 500;
	width: 300px;
	color: #ffffff;
	text-align: center;
	margin: 20px auto;
	padding: 15px 30px;
	border-radius: 999px;
    background: #ffa000;
    background-image: linear-gradient(to left, #464648, #1c1c1d, #464648, #464648);
    background-repeat: repeat-x;
    background-position: 50% 0;
    background-size: 300% 100%;
	text-decoration: none;
	transition: 0.6s cubic-bezier(0.55, 0.17, 0.05, 0.85);
    will-change: transform, background-position, box-shadow;
}

a:hover {
    background-position: 100% 0;
}


/* DIFY */
div#dify-chatbot-bubble-button {
	/* background: linear-gradient(0deg,#ffa000,#ff6000,#ff6000) !important; */
}

#dify-chatbot-bubble-window .shrink-0.flex.items-center.justify-between.h-14.px-4.bg-gray-100.bg-gradient-to-r.from-blue-600.to-sky-500 {
	background: linear-gradient(0deg,#ffa000,#ff6000,#ff6000) !important;
}

iframe#dify-chatbot-bubble-window.btn-primary {
	background: linear-gradient(0deg,#ffa000,#ff6000,#ff6000) !important;
}



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

	.logo {
		float: none;
		padding: 10px 20px;
	}

	.logo img {
		max-width: 600px;
		width: 100%;
	}

	.links-container img {
		max-width: 200px;
		height: auto;
		margin: 30px 20px;
	}

	a {
		margin: 30px auto;
		font-size: 14px;
		padding: 15px 10px;
	}

}