[class~="cover"]{ width: 100%; height: 100%; background: black; display: flex; opacity: 0%; position: fixed; z-index: -10000; cursor: pointer; } [class~="circle"]{ height: 4.375rem; width: 4.375rem; z-index: 10000000; border-radius: 50%; border: 0.5rem solid var(--background-color); border-top-color: var(--primary-color); animation: animate 2s linear infinite; position: fixed; top: 50%; left: 48%; transform: translate(-50%, -50%); display: none; z-index: 1000000000000000000000000000000000; } @keyframes animate{ 0%{ transform: rotate(0deg); } 100%{ transform: rotate(360deg); } } [class~="the-message"]{ width: 18.75rem; font-size: 0.9375rem; height:max-content; display: none; flex-direction: column; padding: 1.5rem; color: var(--white-color); position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: black; border-radius: 0.9375rem; text-align: center; z-index: 1000000000000000000000000000000000; gap: 0.625rem; } [class~="bridge-connect"]{ display: flex; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 45rem; height: fit-content; background: black; z-index: -100000; border: solid .0.125rem rgba(128, 128, 128, 0.186); border-radius: 0.9375rem; opacity: 0; transition: .2s ease-in-out; } [class~="bridge-connect"] [class~="bridge-connect-container"]{ display: grid; grid-template-columns: 40% 60%; width: 100%; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"]{ display: flex; flex-direction: column; margin-top: 1rem; width: fit-content; width: 100%; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="head"]{ display: flex; flex-direction: column; padding: 0.125rem 1.125rem 0.5rem; position: relative; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="head"] h1{ font-size: 1.125rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="head"] [class~="exit"]{ position: absolute; right:1rem; top: 0rem; cursor: pointer; width: 1.75rem; height: 1.75rem; border-radius:50% ; background: #4B4F58; display: flex; align-items: center; justify-content: center; cursor: pointer; display: none; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"]{ display: flex; flex-direction: column; padding: 0 1.125rem 1.125rem; margin-top: 1.25rem; gap: 0.3125rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"] h2{ font-size: 0.8125rem; color: #ffffff99; margin-bottom: 0.5rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"] [class~="one"]{ display: flex; align-items: center; gap: 0.9375rem; padding: 0.3125rem; cursor: pointer; border-radius: 0.5rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"] [class~="one"]:hover{ background: #4B4F58; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"] [class~="one"] img{ width: 1.75rem; height: 1.75rem; border-radius: 0.3125rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="bottom"] [class~="one"] p{ font-size: 0.9375rem; color: white; font-weight: 600; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="learn"]{ display: flex; justify-content: space-between; padding: 1rem 1.5rem; border-top: solid .0.125rem rgba(128, 128, 128, 0.186); display: flex; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="learn"] p{ font-size: 0.8125rem; color: #ffffff99; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="learn"] [class~="learn-more"]{ cursor: pointer; display: none; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="learn"] [class~="learn-more"] p{ font-size: 0.8125rem; color: #3898ff; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"]{ display: flex; border-left: solid .0.125rem rgba(128, 128, 128, 0.186); height: 100%; padding: 1rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"]{ display: flex; flex-direction: column; width: 100%; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"]{ display: flex; justify-content:flex-start; height: 1.875rem; width: 1.875rem; margin-bottom: 0.75rem; width: 100%; position: relative; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="back"]{ cursor: pointer; display: flex; align-items: center; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="smart"]{ font-size: 1.125rem; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 1rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="hidden"]{ display: none; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="smart"]{ display: non; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="exit"]{ width: 1.75rem; height: 1.75rem; border-radius:50% ; background: #4B4F58; display: flex; align-items: center; justify-content: center; cursor: pointer; position: absolute; right: 0; top: 0; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="top"] [class~="exit"] svg{ font-weight: 700; display: flex; justify-content: center; align-items: center; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"]{ display: flex; margin: 0 0.5rem; justify-content: center; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"]{ display: flex; flex-direction: column; width: 19.5rem; gap: 1.5625rem; margin-top: 1.5625rem; align-items: center; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] h1{ font-size: 1.125rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] [class~="two"]{ display: flex; gap: 1.25rem; align-items: center; width: 100%; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] [class~="two"] img{ width: 3rem; height: 3rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] [class~="two"] [class~="other"]{ display: flex; flex-direction: column; gap: 0.1875rem; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] [class~="two"] [class~="other"] h5{ font-size: 0.8125rem; font-weight: 600; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"] [class~="two"] [class~="other"] p{ font-size: 0.8125rem; font-weight: 400; line-height: 1.5; color: #ffffff99; } @media(max-width:48.4375rem){ [class~="bridge-connect"]{ width: 23rem; height: 26.75rem; } [class~="bridge-connect"] [class~="bridge-connect-container"]{ display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"]{ display: none; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="head"] h1{ text-align: center; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="learn"] [class~="learn-more"]{ cursor: pointer; display: flex; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="leftside"] [class~="leftside-container"] [class~="head"] [class~="exit"]{ display: flex; } } @media(max-width:23.4375rem){ [class~="bridge-connect"]{ width: 90%; height: fit-content; } [class~="bridge-connect"] [class~="bridge-connect-container"] [class~="rightside"] [class~="rightside-container"] [class~="bottom"] [class~="wrapper"]{ width: 100%; } }