diff --git a/dex.html b/dex.html
index 00853ed1..0c66cf46 100644
--- a/dex.html
+++ b/dex.html
@@ -51,6 +51,218 @@
background-color: #3fbcc0;
z-index: 9999;
}
+
+ .custom-button {
+ position: relative;
+ background-color: #3fbcc0a6;
+ color: white;
+ border: 2px solid #000;
+ border-radius: 10px;
+ overflow: hidden;
+ transition: color 0.3s ease;
+ z-index: 1;
+ padding: 10px 15px; /* Adjust padding to make the button bigger */
+ font-size: 14px;
+ margin-top: -10px;
+ }
+
+ .custom-button::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 0;
+ height: 100%;
+ background-color: #55a5ea;
+ transition: width 0.3s ease;
+ z-index: -1;
+ }
+
+ .custom-button:hover {
+ color: #fff;
+ }
+
+ .custom-button:hover::before {
+ width: 100%;
+ }
+
+ .home__container {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ }
+
+ .home__image {
+ width: 50%;
+ }
+
+ .home__data {
+ text-align: left;
+ flex: 1;
+ }
+
+
+ .about__container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .imt {
+ width: 40%;
+ }
+
+ .about__data {
+ text-align: left;
+ flex: 1; /* Allow text content to expand */
+ color: #fff; /* Set a default text color */
+ font-size: 16px; /* Set a default font size */
+ z-index: 1;
+ margin-left: 20px;
+ }
+
+ .security__container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .security__image {
+ width: 40%; /* Adjust image width as needed */
+ }
+
+ .security__data {
+ text-align: left;
+ flex: 1;
+ }
+
+
+
+ .services__data {
+ display: flex;
+ flex-direction: column;
+ align-items: center; /* Center content horizontally */
+ text-align: center; /* Center text */
+ }
+
+ .services__data .button-link {
+ margin: 20px auto 0; /* Center button and add spacing */
+ }
+
+ .app__container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 50px 0;
+ }
+
+ .app__data {
+ text-align: left;
+ flex-grow: 1; /* Allow the content to expand to fill available space */
+ }
+
+ .section__title-center {
+ text-align: center;
+ margin-right: 10px; /* Adjust the margin value as needed */
+ }
+
+ .imt {
+ width: 30%;
+ padding-right: 60px; /* Add padding to the right */
+ margin-top: 20px; /* Move the image down */
+ }
+
+
+ .contact__container {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+ flex-wrap: wrap;
+ padding-top: 50px;
+ text-align: left;
+ }
+
+ .contact__content {
+ flex: 1;
+ max-width: 45%;
+ display: flex;
+ flex-direction: column;
+ padding-left: 20px;
+ gap: 1rem;
+ padding-left: 100px;
+ color: white;
+ }
+
+ .contact__heading {
+ text-align: left;
+ margin-bottom: 0.5rem; /* Reduce space below heading */
+ }
+
+ .section__title-center {
+ position: relative;
+ right: 20px;
+ }
+
+ .contact__description {
+ text-align: left;
+ margin-bottom: 1rem; /* Space below description */
+ }
+
+ .contact__map {
+ flex: 1;
+ max-width: 70%;
+ margin-left: 10px;
+ margin-top: 20px;
+ }
+
+ .contact__map iframe {
+ width: 85%; /* Ensure iframe takes full width of its container */
+ }
+
+ .contact__address {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ margin: 10px 0;
+ color: white;
+ }
+
+ .contact__information {
+ font-weight: bold;
+ color: white;
+ }
+
+ .button {
+ display: inline-block;
+ margin-top: 20px;
+ padding: 10px 20px;
+ background-color: #007bff;
+ color: white;
+ text-decoration: none;
+ border-radius: 5px;
+ text-align: center;
+ }
+
+ .button:hover {
+ background-color: #0056b3;
+ }
+
+ @media (max-width: 768px) {
+ .contact__container {
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .contact__content,
+ .contact__map {
+ max-width: 100%;
+ }
+
+ .contact__map {
+ margin-left: 0;
+ margin-top: 20px;
+ }
+ }