:root { font-family: "Poppins", Arial, sans-serif; background-color: #fff; font-size: 16px; } * { padding: 0px; margin: 0px; box-sizing: border-box; } a { text-decoration: none !important; color: inherit; display: table; cursor: pointer; } a:visited { color: inherit; } a:hover { color: inherit; filter: brightness(0.7); } p { margin: 0; } ul { list-style: none; margin: 0; padding: 0; } img { height: auto; max-width: 100%; border-style: none; display: block; } span.line-through { text-decoration: line-through; } body, body.body-css { overflow-x: hidden; width: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; font-family: inherit; font-size: inherit; background-color: inherit; margin: 0 !important; } button { font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; } .row { display: grid; align-items: stretch; justify-content: flex-start; gap: 2rem; } @media screen and (max-width: 1024px) { .row { gap: 1rem; } } @media screen and (max-width: 640px) { .row { gap: 0.5rem; } } .row.row-wrap { flex-wrap: wrap; } .container { max-width: 100%; margin: auto; padding: 1rem 0.5rem; } @media (max-width: 768px) { .container { padding: 0.3rem 0.5rem; } } @media (min-width: 1024px) { .container { width: 1440px; } } .btn { text-transform: uppercase; background-color: rgba(0, 0, 0, 0.5); align-items: center; color: #fff; outline: none; border: none; padding: 0.5rem 1.5rem; position: relative; border-radius: 8px; cursor: pointer; } .btn.btn-green { background-color: #61d81d; } .btn.btn-blue { background: #3a77cc; background: linear-gradient(to bottom, #3a77cc, #2c2f79); } .btn.rounded { border-radius: 100rem; } .btn img { width: 45px; height: 45px; position: absolute; right: 0.25rem; } .btn.has-img { display: flex; gap: 1rem; justify-content: space-around; height: calc(45px + 0.5rem); padding: 0.25rem 2rem; padding-right: calc(2rem + 45px); } .title { text-transform: uppercase; font-size: 2rem; font-family: "Arial-Rounded", Arial, sans-serif; text-shadow: 0 4px 3px rgba(0, 0, 0, 0.25); } @media screen and (max-width: 768px) { .title { font-size: 1.2rem; } } .content h2 { color: #2c2f79; font-weight: 500; text-transform: uppercase; font-size: 1.75rem; margin-bottom: 1rem; } .content p { color: #2c2f79; } table { width: 100%; border-collapse: separate; border-spacing: 0 1rem; table-layout: fixed; font-size: 1rem; font-weight: 700; } table.flat-table { border-spacing: 0; border-collapse: collapse; } table.flat-table td, table.flat-table th { border: 2px solid #3c3d3e; padding: 0.5rem 1.5rem; padding-left: 0; padding-right: 0; text-align: center; } table.flat-table th { text-transform: uppercase; font-weight: bold; background-color: #3a77cc; color: #fff; } table.flat-table td { font-weight: 400; } table.table-design th, table.simple th { text-align: left; color: #fff; text-transform: uppercase; } table.table-design th strong, table.simple th strong { padding: 0.5rem 1.5rem; display: block; background-color: #3a77cc; } @media screen and (max-width: 1024px) { table.table-design th strong, table.simple th strong { padding: 0.25rem 0.75rem; } } table.table-design tbody tr td, table.simple tbody tr td { background-color: #bcebfb; padding: 0 1rem; } table.table-design tbody tr:nth-child(even) td, table.simple tbody tr:nth-child(even) td { background-color: #dff7ff; } table.table-design tfoot tr td, table.simple tfoot tr td { padding: 0.5rem 1.5rem; background-color: #5dca36; color: #000; text-transform: uppercase; font-size: 1.2em; } @media screen and (max-width: 1024px) { table.table-design tfoot tr td, table.simple tfoot tr td { padding: 0.25rem 0.75rem; } } table.table-design tfoot tr td:first-child, table.simple tfoot tr td:first-child { border-radius: 100rem 0 0 100rem; } table.table-design tfoot tr td:last-child, table.simple tfoot tr td:last-child { border-radius: 0 100rem 100rem 0; font-size: 1.5em; } table.table-design th strong { width: 80%; border-radius: 100rem; background: #1e549c; background: linear-gradient(to right, #1e549c, #61d81d); } @media screen and (max-width: 1024px) { table.table-design th strong { width: 90%; } } table.table-design tbody tr td { padding: 0.5rem 1.5rem; } @media screen and (max-width: 1024px) { table.table-design tbody tr td { padding: 0.25rem 0.75rem; } } table.table-design tbody tr td:first-child { border-radius: 100rem 0 0 100rem; } table.table-design tbody tr td:last-child { border-radius: 0 100rem 100rem 0; } table.table-design tbody tr:last-child td { padding: 0.5rem 1.5rem; background-color: #5dca36; color: #000; text-transform: uppercase; font-size: 1.2em; } @media screen and (max-width: 1024px) { table.table-design tbody tr:last-child td { padding: 0.25rem 0.75rem; } } table.table-design tbody tr:last-child td:first-child { border-radius: 100rem 0 0 100rem; } table.table-design tbody tr:last-child td:last-child { border-radius: 0 100rem 100rem 0; font-size: 1.5em; } table.simple { border-spacing: 0; } table.simple tbody tr td { padding: 0.5rem 1rem; background-color: #dff7ff; } table.simple tbody tr:nth-child(even) td { background-color: #bcebfb; } header { background-color: #dff7ff; height: 5.5rem; position: fixed; width: 100%; z-index: 100; } header .download-app-banner { display: flex; padding: 0.5rem; gap: 0.5rem; justify-content: space-between; align-items: center; position: relative; display: none; background: #dff7ff; background: linear-gradient(to bottom, #dff7ff, #5dca36); } header .download-app-banner .app-icon { max-width: 45px; border-radius: 8px; overflow: hidden; } header .download-app-banner h3 { font-size: 0.9rem; font-weight: 400; } header .download-app-banner .btn { font-size: 1rem; padding: 0.5rem 1rem; } header .download-app-banner .close-download { font-size: 2rem; font-weight: 700; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 768px) { header { height: 4rem; } header.show-download-banner { height: rem; } header.show-download-banner .download-app-banner { display: flex; } } header .burger-icon { height: auto; width: 30px; margin: 0; padding: 0; box-sizing: border-box; display: none; gap: 6px; flex-direction: column; align-items: flex-end; cursor: pointer; } @media screen and (max-width: 768px) { header .burger-icon { display: flex; grid-area: burgerIcon; } } header .burger-icon span { display: block; width: 80%; height: 3px; background-color: #33b2c1; border-radius: 2px; transition: all 0.3s ease; position: relative; } header .burger-icon span:nth-child(2) { width: 100%; } header .burger-icon.open span:nth-child(1) { transform: rotate(45deg); top: 11px; transform-origin: center; } header .burger-icon.open span:nth-child(2) { opacity: 0; } header .burger-icon.open span:nth-child(3) { transform: rotate(-45deg); bottom: 7px; transform-origin: center; } @media screen and (max-width: 768px) { header nav ul.menu > li:not(.country-selector) { display: none; } } header .modal-menu { display: none; position: fixed; top: 0; left: 0; width: 100vw; background-color: #dff7ff; max-height: 0; height: 100%; overflow: hidden; transition: all 0.3s ease; opacity: 0; } @media screen and (max-width: 768px) { header .modal-menu { display: block; } } header .modal-menu.open { max-height: 100vh; opacity: 1; } header .modal-menu .menu-content { padding: 2rem 2rem; position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 100%; } header .modal-menu .menu-content h3 { text-align: center; text-transform: uppercase; font-size: 1.5rem; } header .modal-menu .menu-content span.close-menu { position: absolute; top: calc(2rem - 5px); right: 2rem; font-size: 2rem; } header .modal-menu .menu-content ul.menu { flex-direction: column; flex-grow: 1; margin-top: 3rem; gap: 1rem; } header .modal-menu .menu-content ul.menu li a { min-width: 180px; text-align: center; display: block; } header .modal-menu .menu-content ul.menu > li.country-selector { display: none; } header .modal-menu .menu-content .login-signup-wrap { display: flex; flex-direction: column; margin-top: 2rem; } header .modal-menu .menu-content .login-signup-wrap > li { width: 180px; text-align: center; display: flex; justify-content: center; } header .modal-menu .menu-content .login-signup-wrap > li a { padding:0.5rem 0; } header .header-wrap { padding: 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; position: relative; } @media screen and (max-width: 1280px) { header .header-wrap { gap: 0.5rem; } } @media screen and (max-width: 768px) { header .header-wrap > .login-signup-wrap .signup-btn { display: none; } } @media screen and (min-width: 769px) and (max-width: 1024px) { header .header-wrap .logo { width: 100px; } } @media screen and (max-width: 640px) { header .header-wrap .logo { width: 80px; } } header .header-wrap ul { display: flex; align-items: center; gap: 3rem; } @media screen and (min-width: 769px) and (max-width: 1280px) { header .header-wrap ul { gap: 0.5rem; } } header .header-wrap ul li { position: relative; padding: 2px; border-radius: 8px; } header .header-wrap ul li > a { display: flex; align-items: center; gap: 1em; padding: 0.25rem 1rem; border-radius: 8px; } @media screen and (min-width: 769px) and (max-width: 1280px) { header .header-wrap ul li > a { padding: 0.25rem 0.5rem; gap: 0.5rem; font-size: 0.9rem; } } header .header-wrap ul img { width: 30px; height: 30px; border-radius: 30px; overflow: hidden; } header .header-wrap ul .sub-menu { flex-direction: column; position: absolute; z-index: 100; background-color: rgba(223, 247, 255, 0.5); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); border-radius: 8px; gap: 0; margin-top: 1rem; margin-left: 0; align-items: flex-start; width: 200px; max-height: 0; overflow: hidden; transition: all 0.3s ease; } @media screen and (max-width: 768px) { header .header-wrap ul .sub-menu { margin-top: 0.5rem; } } header .header-wrap ul .sub-menu li { padding: 0.5rem 0; } header .header-wrap ul .sub-menu li img { width: 30px; } header .header-wrap ul.menu > li:hover .sub-menu { max-height: 500px; } header .header-wrap ul.menu > li:not(.no-border) { background: #1e549c; background: linear-gradient(to bottom, #1e549c, #dff7ff); border-radius: 8px; transition: all 0.3s ease; } header .header-wrap ul.menu > li:not(.no-border) a { background-color: #dff7ff; } header .header-wrap ul.menu > li:not(.no-border):hover { background: #1e549c; background: linear-gradient(to bottom, #1e549c, #1e549c); } header .header-wrap ul.menu > li:not(.no-border):hover a { filter: brightness(1); } header .header-wrap ul.login-signup-wrap { gap: 0.5rem; } header .header-wrap ul.login-signup-wrap li a { color: #fff; } @media screen and (max-width: 640px) { header .header-wrap ul.login-signup-wrap li a { padding: 0.25rem 0.5rem; font-size: 0.85rem; } } header .header-wrap ul.login-signup-wrap li.login-btn { background: #1e549c; background: linear-gradient(to bottom, #1e549c, #3a77cc); } header .header-wrap ul.login-signup-wrap li.signup-btn { background-color: #57b24d; } section.with-bg { background-repeat: no-repeat; background-size: cover; background-position: center; } section.with-bg .hero-slider { display: flex; justify-content: center; aspect-ratio: 1261/543; margin: 0 auto; } main { padding-top: 5.5rem; } @media screen and (max-width: 768px) { main { padding-top: 4rem; } main.show-download-banner { padding-top: rem; } } .apply-agent-wrap { display: grid; justify-content: space-around; grid-template-columns: 500px auto; align-items: center; width: 90%; margin: 0 auto; font-weight: 900; } @media screen and (min-width: 769px) and (max-width: 1024px) { .apply-agent-wrap { grid-template-columns: auto 400px; } } @media screen and (min-width: 641px) and (max-width: 768px) { .apply-agent-wrap { grid-template-columns: auto 320px; width: 97%; padding: 1rem 0; } } @media screen and (max-width: 640px) { .apply-agent-wrap { padding: 1rem 0; text-align: center; grid-template: "leftSection" "rightSection"; row-gap: 2rem; } .apply-agent-wrap .left-section { grid-area: leftSection; display: flex; flex-direction: column; align-items: center; } .apply-agent-wrap .right-section { grid-area: rightSection; } .apply-agent-wrap .right-section img { max-width: 420px; width: 90%; margin: 0 auto; } } .apply-agent-wrap .left-section { font-family: "Arial-Rounded", Arial, sans-serif; } .apply-agent-wrap h3 { background-color: #1e549c; border-radius: 100rem; text-transform: uppercase; padding: 0.25rem 2rem; color: #fff; display: inline-block; font-weight: 400; font-size: 1.8em; } @media screen and (max-width: 1024px) { .apply-agent-wrap h3 { font-size: 1.2em; margin-bottom: 0.3rem; } } .apply-agent-wrap h2 { color: #1e549c; text-transform: uppercase; font-size: 3.5em; text-shadow: 0 4px 3px rgba(0, 0, 0, 0.25); font-weight: 900; } @media screen and (max-width: 1024px) { .apply-agent-wrap h2 { font-size: 2em; } } .apply-agent-wrap p { line-height: 1.5em; font-size: 1.5rem; display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; font-weight: inherit; font-weight: 400; } @media screen and (max-width: 1024px) { .apply-agent-wrap p { line-height: 1.5rem; font-size: 1.1rem; margin-bottom: 0.5rem; } } .apply-agent-wrap p em { font-style: normal; font-size: 2em; color: #1e549c; border-radius: 100rem; background-color: #61d81d; padding: 1rem 1rem 0.5rem; display: block; } @media screen and (max-width: 1024px) { .apply-agent-wrap p em { font-size: 1.7em; padding: 0.6rem 0.6rem 0.6rem; margin: 0.3rem auto; display: block; } } .apply-agent-wrap .btn { margin-top: 1.5rem; font-size: 1.4rem; color: #1e549c; box-shadow: 0 4px 3px rgba(0, 0, 0, 0.25); } @media screen and (min-width: 641px) and (max-width: 768px) { .apply-agent-wrap .btn { font-size: 1rem; } } #about-us { margin: 2rem 0; } @media screen and (max-width: 768px) { #about-us { margin: 1rem 0; } } .about-content { background-color: #e7edf1; border-radius: 8px; padding: 2rem 4rem; display: grid; grid-template-columns: 400px auto; gap: 1.5rem; align-items: center; justify-content: space-between; position: relative; overflow: hidden; } .about-content .bg-img { position: absolute; bottom: 0; right: 0; width: 220px; opacity: 0.5; display: none; -o-object-fit: contain; object-fit: contain; -o-object-position: bottom right; object-position: bottom right; aspect-ratio: 1/1; } @media screen and (max-width: 768px) { .about-content .bg-img { display: block; } } @media screen and (min-width: 769px) and (max-width: 1024px) { .about-content { grid-template-columns: 280px auto; gap: 1rem; padding: 1rem 2rem; } } @media screen and (max-width: 768px) { .about-content { grid-template-columns: 1fr; padding: 1rem 2rem; } .about-content .img-holder { display: none; } } .about-content .img-holder img { width: 85%; } #sponsor { background: #fff; background: linear-gradient(to bottom, white, #57b24d); } .sponsor-holder { display: flex; justify-content: center; align-items: center; gap: 3rem; } @media screen and (max-width: 768px) { .sponsor-holder { gap: 0.5rem; padding: 0.5rem 2rem; } } @media screen and (max-width: 640px) { .sponsor-holder { padding: 0.5rem 0.5rem; } } .sponsor-holder h2 { text-transform: uppercase; font-size: 2em; text-align: center; white-space: nowrap; font-family: "Arial-Rounded", "arial"; max-width: 220px; white-space: wrap; } @media screen and (max-width: 768px) { .sponsor-holder h2 { font-size: 1.5em; text-align: left; } } @media screen and (max-width: 640px) { .sponsor-holder h2 { max-width: 100%; font-size: 1em; } } .sponsor-holder ul { display: flex; gap: 1rem; } @media screen and (max-width: 640px) { .sponsor-holder ul { gap: 0.25rem; } } #commission { margin: 2rem 0; } @media screen and (max-width: 768px) { #commission { margin: 1rem 0; } } .commission-wrap { background-color: #e7edf1; border-radius: 8px; padding: 2rem 0; } .commission-wrap h2 { text-align: center; font-family: "Arial-Rounded"; color: #2c2f79; padding: 1rem 0; } @media screen and (max-width: 768px) { .commission-wrap { padding: 1rem 0; padding-top: 0; } } .commission-wrap .commission-holder { display: flex; gap: 2rem; justify-content: space-evenly; align-items: stretch; width: 85%; margin: 0 auto; } @media screen and (max-width: 1024px) { .commission-wrap .commission-holder { gap: 1rem; width: 95%; } } @media screen and (max-width: 640px) { .commission-wrap .commission-holder { flex-wrap: wrap; width: 100%; gap: 0; } } .commission-wrap .com-card { display: flex; flex-direction: column; align-items: center; gap: 1rem; flex-basis: 20%; position: relative; } @media screen and (max-width: 768px) { .commission-wrap .com-card { flex-basis: unset; min-width: 100px; } } @media screen and (max-width: 640px) { .commission-wrap .com-card { min-width: 25%; max-width: 25%; } .commission-wrap .com-card:last-child { margin: 1rem auto 0; min-width: 100%; max-width: 100%; } .commission-wrap .com-card:last-child .icon { display: none; } .commission-wrap .com-card:last-child p { border-radius: 8px; box-shadow: 0 4px 13px rgba(0, 0, 0, 0.25); padding: 1rem 1.5rem; width: 100%; font-size: 0.; } } .commission-wrap .com-card:nth-child(1):after, .commission-wrap .com-card:nth-child(2):after, .commission-wrap .com-card:nth-child(3):after, .commission-wrap .com-card:nth-child(4):after { position: absolute; top: 50%; right: -1rem; transform: translateY(-50%); font-size: 2rem; font-weight: bold; } @media screen and (max-width: 1024px) { .commission-wrap .com-card:nth-child(1):after, .commission-wrap .com-card:nth-child(2):after, .commission-wrap .com-card:nth-child(3):after, .commission-wrap .com-card:nth-child(4):after { font-size: 1.5rem; } } @media screen and (max-width: 640px) { .commission-wrap .com-card:nth-child(1):after, .commission-wrap .com-card:nth-child(2):after, .commission-wrap .com-card:nth-child(3):after, .commission-wrap .com-card:nth-child(4):after { margin-top: -1rem; font-size: 1rem; right: -0.5rem; } } .commission-wrap .com-card:nth-child(1):after, .commission-wrap .com-card:nth-child(2):after, .commission-wrap .com-card:nth-child(3):after { content: "-"; } .commission-wrap .com-card:nth-child(4):after { content: "="; } .commission-wrap .com-card .icon { border-radius: 8px; box-shadow: 0 4px 13px rgba(0, 0, 0, 0.25); width: 75px; height: 75px; display: flex; justify-content: center; align-items: center; } .commission-wrap .com-card .icon img { max-width: 100%; max-height: 100%; } @media screen and (max-width: 768px) { .commission-wrap .com-card .icon { width: 50px; height: 50px; padding: 0.5rem; } } .commission-wrap .com-card p { font-size: 1.25rem; font-weight: bold; text-transform: uppercase; text-align: center; max-width: 80%; } @media screen and (max-width: 1024px) { .commission-wrap .com-card p { font-size: 1rem; } } @media screen and (max-width: 768px) { .commission-wrap .com-card p { font-size: 0.9rem; } } @media screen and (max-width: 640px) { .commission-wrap .com-card p { font-size: 0.6rem; max-width: 95%; } } #commission-table { margin: 2rem 0; padding-top: 0; } @media screen and (max-width: 768px) { #commission-table { margin: 1rem 0; } } .commission-table-holder { background-color: #e7edf1; padding: 1.5rem 3rem; border-radius: 8px; } .commission-table-holder.table-holder { margin-bottom: 3rem; } .commission-table-holder.table-holder table { width: 90%; max-width: 600px; margin: 0 auto; } @media screen and (max-width: 1024px) { .commission-table-holder { padding: 1rem 0.5rem; overflow: auto; } } .commission-table-holder .img-holder { display: flex; justify-content: center; max-width: 1080px; width: 80%; margin: 1rem auto; } @media screen and (max-width: 768px) { .commission-table-holder .img-holder { width: 90%; } } @media screen and (max-width: 1024px) { .commission-table-holder table { width: auto; } .commission-table-holder table th { min-width: 200px; } } #cx-advantage { margin: 2rem 0; } @media screen and (max-width: 768px) { #cx-advantage { margin: 1rem 0; } } h2.header-with-bg { background-color: #dff7ff; border-radius: 8px; text-align: center; padding: 1rem 0; margin-bottom: 3rem; color: #2c2f79; } @media screen and (max-width: 768px) { h2.header-with-bg { margin-bottom: 1rem; } } .cx-advantage h2, .register-guide h2 { background-color: #dff7ff; border-radius: 8px; text-align: center; padding: 1rem 0; margin-bottom: 3rem; color: #2c2f79; } @media screen and (max-width: 768px) { .cx-advantage h2, .register-guide h2 { margin-bottom: 1.5rem; } } .cx-advantage .box-holder, .register-guide .box-holder { border-radius: 8px; display: flex; flex-direction: column; text-align: center; align-items: center; width: 100%; height: 100%; padding: 2rem; } @media screen and (max-width: 1024px) { .cx-advantage .box-holder, .register-guide .box-holder { padding: 1rem; } } .cx-advantage .row { grid-template-columns: repeat(4, 1fr); } @media screen and (max-width: 768px) { .cx-advantage .row { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 640px) { .cx-advantage .row { grid-template-columns: repeat(2, 1fr); } } .cx-advantage .box-holder { background-color: #dff7ff; color: #122d5c; justify-content: space-around; } .cx-advantage .box-holder .icon { border-radius: 8px; background: #1e549c; background: linear-gradient(to bottom, #1e549c, #dff7ff); width: 50px; height: 50px; position: relative; display: flex; align-items: center; justify-content: center; } .cx-advantage .box-holder .icon:before { content: ""; width: calc(100% - 2px); height: calc(100% - 2px); background-color: #dff7ff; position: absolute; top: 1px; left: 1px; border-radius: inherit; } .cx-advantage .box-holder .icon img { position: relative; z-index: 2; } .cx-advantage .box-holder strong { text-transform: uppercase; margin: 1.5rem 0 0.2rem; font-size: 1.2rem; } @media screen and (max-width: 640px) { .cx-advantage .box-holder strong { font-size: 1rem; margin-top: 1rem; } } .cx-advantage .box-holder p { font-size: 0.; width: 80%; } @media screen and (max-width: 640px) { .cx-advantage .box-holder p { width: 90%; } } #register-guide { margin: 2rem 0; } @media screen and (max-width: 768px) { #register-guide { margin: 1rem 0; } } .register-guide h2 { margin-bottom: 6.5rem; } @media screen and (max-width: 768px) { .register-guide h2 { margin-bottom: 4rem; } } .register-guide .row { grid-template-columns: repeat(3, 1fr); justify-content: space-between; gap: 5rem; } @media screen and (max-width: 1024px) { .register-guide .row { gap: 1rem; } } @media screen and (max-width: 768px) { .register-guide .row { grid-template-columns: repeat(2, 1fr); } .register-guide .row .grid-wrap { margin-bottom: 3rem; } } @media screen and (max-width: 640px) { .register-guide .row { grid-template-columns: repeat(1, 1fr); } } .register-guide .box-holder { background-color: #fff; padding-top: 5rem; position: relative; justify-content: flex-start; aspect-ratio: 1/0.8; } @media screen and (max-width: 640px) { .register-guide .box-holder { aspect-ratio: unset; padding-top: 3rem; padding-bottom: 2rem; } } .register-guide .box-holder .img { width: 150px; height: 150px; border-radius: 150px; background-color: #fff; overflow: hidden; position: absolute; top: -75px; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 768px) { .register-guide .box-holder .img { width: 100px; height: 100px; top: -50px; } } .register-guide .box-holder .img img { width: 85%; } .register-guide .box-holder h3 { font-size: 1.5rem; margin-bottom: 3rem; font-weight: 500; color: #122d5c; } @media screen and (max-width: 768px) { .register-guide .box-holder h3 { font-size: 1.3rem; } } @media screen and (max-width: 640px) { .register-guide .box-holder h3 { margin-bottom: 1rem; } } .register-guide .box-holder ul { list-style: disc; text-align: left; margin-left: 1rem; font-size: 1rem; color: #696984; } @media screen and (max-width: 768px) { .register-guide .box-holder ul { font-size: 0.9rem; list-style: none; } .register-guide .box-holder ul li { text-align: center; } } #affiliate-video { margin: 2rem 0; } @media screen and (max-width: 768px) { #affiliate-video { margin: 1rem 0; } } .affiliate-video { border-radius: 8px; background-color: #fff; padding: 3rem 3rem; } @media screen and (max-width: 1024px) { .affiliate-video { padding: 2rem 2rem; } } @media screen and (max-width: 640px) { .affiliate-video { padding: 1rem 1rem; } } .affiliate-video h2 { text-align: center; padding: 1rem 0; margin-bottom: 2rem; color: #2c2f79; } @media screen and (max-width: 768px) { .affiliate-video h2 { margin-bottom: 0.5rem; } } .affiliate-video .video-container { aspect-ratio: 1/0.5; background-color: #dff7ff; border-radius: 8px; width: 90%; max-width: 920px; margin: 0 auto; overflow: hidden; } @media screen and (max-width: 640px) { .affiliate-video .video-container { width: 100%; } } .affiliate-video .video-container iframe { width: 100%; height: 100%; } #affilaite-review { margin: 2rem 0; margin-bottom: 0; } @media screen and (max-width: 768px) { #affilaite-review { margin: 1rem 0; } } .review-holder { background: #3a77cc; background: linear-gradient(to bottom, #3a77cc, #5dca36); padding: 2rem 3rem; padding-bottom: 6rem; border-radius: 8px; } @media screen and (max-width: 1024px) { .review-holder { padding: 2rem 2rem; padding-bottom: 5rem; } } .review-holder h2 { color: #fff; } .review-holder .review-container { margin-top: 2rem; } .review-holder .review-container .review-content { background-color: #fff; border-radius: 8px; padding: 4rem 2rem 2rem; position: relative; margin-left: 10px; height: 100%; } .review-holder .review-container .review-content .img-holder { position: absolute; top: 5px; left: -10px; } .review-holder .review-container .review-content p { font-size: 0.; margin-top: 1rem; line-height: 1.5rem; } .review-holder .review-container .slider-nav { visibility: visible; border: 1px solid #fff; background-color: rgba(0, 0, 0, 0); width: 45px; height: 45px; border-radius: 45px; position: absolute; bottom: -4rem; top: unset; left: calc(50% - 2.5rem); right: unset; transform: translateX(-50%); padding: 0 0.25rem; display: flex; justify-content: center; align-items: center; } .review-holder .review-container .slider-nav.slider-nav-next { left: calc(50% + 2.5rem); } .review-holder .review-container .slider-nav:before { width: 2rem; height: 2rem; } @media screen and (max-width: 768px) { .review-holder .review-container .slider-nav:before { width: 1rem; height: 1rem; } } .review-holder .review-container .slider-nav:after { width: 2rem; height: 2rem; } @media screen and (max-width: 768px) { .review-holder .review-container .slider-nav:after { width: 1rem; height: 1rem; } } footer { background-color: #dff7ff; padding: 1rem 0; margin-top: 2rem; } footer .footer-wrap { display: grid; grid-template-columns: auto 320px; } @media screen and (max-width: 768px) { footer .footer-wrap { grid-template: "rightFooter" "leftFooter"; row-gap: 1rem; } } @media screen and (max-width: 768px) { footer .footer-wrap .left-section { grid-area: leftFooter; } } footer .footer-wrap .left-section ul { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: minmax(auto, auto); gap: 1.5rem; margin-bottom: 4rem; } @media screen and (max-width: 768px) { footer .footer-wrap .left-section ul { gap: 1rem; margin-bottom: 2rem; } footer .footer-wrap .left-section ul li { display: flex; justify-content: center; } footer .footer-wrap .left-section ul li a { display: block; text-align: center; font-size: 0.9rem; } } footer .footer-wrap .left-section .logo-copyright { display: flex; align-items: flex-end; gap: 2.5rem; } @media screen and (max-width: 640px) { footer .footer-wrap .left-section .logo-copyright { flex-direction: column; align-items: center; gap: 1rem; } } footer .footer-wrap .left-section .logo-copyright > * { flex-basis: calc(50% - 1.5rem); } @media screen and (max-width: 768px) { footer .footer-wrap .right-section { grid-area: rightFooter; display: flex; flex-direction: column; align-items: center; } } footer .footer-wrap .right-section .social-link h3 { text-transform: uppercase; font-weight: 500; } @media screen and (max-width: 768px) { footer .footer-wrap .right-section .social-link h3 { text-align: center; } } footer .footer-wrap .right-section .social-link ul { margin: 1rem 0; margin-bottom: 2rem; display: flex; justify-content: space-between; } @media screen and (max-width: 768px) { footer .footer-wrap .right-section .social-link ul { justify-content: center; gap: 1.5rem; } } footer .footer-wrap .right-section p { margin-bottom: 2rem; } footer .footer-wrap .right-section a.link { width: 180px; display: block; } footer .footer-wrap .right-section a.link .btn { width: 100%; } .content-holder { background-color: #dff7ff; border-radius: 8px; padding: 3rem 4rem; } @media screen and (max-width: 640px) { .content-holder { padding: 1rem 2rem; } } .content-holder .content-editor ul { list-style-type: disc; font-weight: 300; } .content-holder .content-editor ul li { margin-bottom: 0.5rem; } .content-holder .content-editor ul li a { display: inline-block; color: #1e549c; text-decoration: underline !important; } .cx-promo-material .row { grid-template-columns: repeat(2, 1fr); } @media screen and (max-width: 640px) { .cx-promo-material .row { grid-template-columns: repeat(1, 1fr); } } .cx-promo-material .content-holder { margin: 0 auto; } @media screen and (max-width: 1280px) { .cx-promo-material .content-holder { padding: 3rem 1rem; } } .cx-promo-material .promo-type-tabs { display: flex; justify-content: space-evenly; border-bottom: 1px solid rgba(0, 0, 0, 0.3); padding: 0.5rem 0 1rem; text-transform: uppercase; font-weight: 700; } .cx-promo-material .promo-holder { display: grid; grid-template-columns: 220px auto; justify-content: space-between; align-items: flex-start; margin: 2rem auto; gap: 1rem; } @media screen and (max-width: 1280px) { .cx-promo-material .promo-holder { grid-template-columns: 180px auto; } } @media screen and (min-width: 641px) and (max-width: 1024px) { .cx-promo-material .promo-holder { grid-template: "leftSection" "rightSection"; } } @media screen and (max-width: 640px) { .cx-promo-material .promo-holder { grid-template: "leftSection" "rightSection"; } } .cx-promo-material .left-section { aspect-ratio: 1/1; overflow: hidden; border-radius: 8px; } @media screen and (min-width: 641px) and (max-width: 1024px) { .cx-promo-material .left-section { grid-area: leftSection; aspect-ratio: unset; width: 220px; margin: 0 auto; } } @media screen and (max-width: 640px) { .cx-promo-material .left-section { grid-area: leftSection; aspect-ratio: unset; width: 220px; margin: 0 auto; } } @media screen and (min-width: 641px) and (max-width: 1024px) { .cx-promo-material .right-section { grid-area: rightSection; } } @media screen and (max-width: 640px) { .cx-promo-material .right-section { grid-area: rightSection; } } .cx-promo-material .right-section .social-icons { display: flex; gap: 1rem; margin: 0 auto; margin-bottom: 1rem; justify-content: center; } .cx-promo-material .right-section .social-icons a { width: 30px; aspect-ratio: 1/1; } .cx-promo-material .right-section table td, .cx-promo-material .right-section table th { font-weight: 400; } .cx-promo-material .right-section table td:first-child, .cx-promo-material .right-section table th:first-child { width: calc(100% - 180px); } .cx-promo-material .right-section table td:last-child, .cx-promo-material .right-section table th:last-child { width: 180px; } @media screen and (max-width: 768px) { .cx-promo-material .right-section table td:last-child, .cx-promo-material .right-section table th:last-child { width: 50px; } } @media screen and (max-width: 768px) { .cx-promo-material .right-section table th:last-child { width: 120px; } } .cx-promo-material .right-section table tbody td a { display: flex; align-items: center; padding-left: 1rem; justify-content: space-between; gap: 0.5rem; background-color: #5dca36; width: 160px; border-radius: 8px; text-transform: uppercase; font-size: 0.; overflow: hidden; font-weight: 400; } @media screen and (max-width: 768px) { .cx-promo-material .right-section table tbody td a { padding: 0; gap: 0; width: 25px; } } @media screen and (max-width: 768px) { .cx-promo-material .right-section table tbody td .download-text { display: none; } } .cx-promo-material .right-section table tbody td .download-icon { width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; background-color: #57b24d; justify-self: flex-end; } 