a {
  text-decoration:none;
  color:inherit;
  background-color:transparent;
  cursor:pointer
}
b {
  font-weight:600
}
small {
  font-size:80%
}
img {
  border-style:none;
  display:block
}
button,
input {
  font-family:inherit;
  font-size:100%;
  line-height:1
}
html {
  line-height:1.15;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth!important
}
body {
  font-family:main,Arial,sans-serif;
  font-weight:400;
  font-size:20px;
  color:#175e92;
  text-align:center;
  counter-reset:steps offers;
  line-height:1.4;
  letter-spacing:.2px
}
h1,
h2,
h3 {
  font-weight:600
}
h2 {
  padding:30px 20px;
  font-size:2.2rem;
  line-height:1.2;
  text-align:center
}
h2 small {
  display:table;
  font-weight:300;
  font-size:.6em;
  letter-spacing:.03rem;
  line-height:1.3;
  padding:10px 0;
  border-top:solid 1px #ffffff38;
  opacity:.7;
  margin:20px auto
}
section,
main,
header,
footer {
  width:100%;
  position:relative
}
section {
  padding:40px 0
}
main {
  padding:20px;
  text-align:left
}
main h1 {
  text-align:center
}
main>*,
main ul li {
  margin:15px 0
}
main ul {
  list-style-type:square;
  padding-left:10px
}
header {
  /* background:#17629b; */
  z-index:100;
  /* background:linear-gradient(295deg,#1d83c0,#005eb8); */
  overflow:hidden;
}
.logo,
.logo img {
  height: 50px;
  position:relative
}
.logo {
  float:left;
  margin:10px
}
ul,
ol {
  text-align:left
}
ul {
  list-style-type:none
}
.hamburger {
  font-family:Arial,sans-serif;
  color: #000000bf;
  font-size: 44px;
  line-height:30px;
  margin:7px;
  padding:8px;
  background:rgb(255 255 255/17%);
  position:absolute;
  height:45px;
  right:0;
  z-index:5
}
#top-menu {
  position:fixed;
  background: #ffffffeb;
  /* background:linear-gradient(158deg,#206bc0,#6ca7df); */
  /* right:0; */
  top:0;
  z-index:1000;
  margin: 55px 0 20px 20px;
  height:100vh;
  /* box-shadow:-5px 0 15px #00000061; */
  /* display: none; */
  /* margin-right:-100vw; */
  transition:margin .5s cubic-bezier(.22,.61,.36,1);
  /* will-change:transform; */
}
#top-menu>* {
  margin:10px 0;
  padding:15px 30px;
  display:block;
  text-align:right;
  background:#5a98d7;
  text-align: left;
  color:#ffffffeb;
  /* border-radius:25px 0 0 25px; */
}
#top-menu #close-menu {
  font-family:Arial,sans-serif;
  font-size:50px;
  line-height:28px;
  padding:10px;
  width:50px;
  height:48px;
  display:block;
  position:absolute;
  top:0;
  right:0;
  border-radius:2px;
  margin-right:8px;
  text-align:center
}
#top-menu .smaller {
  font-size:70%
}
#top-menu .join {
  background:#4fa322
}
#top-menu.open {
  margin-right:0
}
#r,
#h {
  position:absolute;
  top:0
}
header svg {
  fill:#ffffff5e;
  width:20px;
  height:20px;
  margin-right:5px;
  vertical-align:middle
}
#top {
  overflow:hidden;
  font-family:Arial,sans-serif;
  padding:0
}
#top .rating div,
#welcome .client small:before,
#users ul li::before {
  background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA5MDAgNjUxLjcnPjxwYXRoIGQ9J002NzcuMyAyNDcuN2MtMTMuNC00MS45LTIwMi0zMi4xLTIyNy44LTQyLjdDNDMwLjggMTgzLjkgMzgyLjggMS4xIDMzOC40IDFzLTkzIDE4Mi43LTExMS4xIDIwNGMtMjg2LjggMTYuNC0yOTEuMSAyOS4yLTY4LjUgMjExLjZDODYuMiA2OTMuOSA5NS41IDcwNCAzMzguNCA1NDcuNGMyNy41IDYuMSAxNzMuNCAxMjUuNSAyMDkuNCA5OS42UzUxNS45IDQ0NC41IDUxOCA0MTYuNmMxNC40LTI0LjMgMTcyLjgtMTI2LjcgMTU5LjMtMTY4Ljl6JyBmaWxsPScjZmZjMTA3Jy8+PC9zdmc+);
  height:15px;
  width:95px;
  margin-bottom:5px
}
#top .rating span {
  font-size:.6rem
}
#top .rating b {
  font-size:1.5em;
  font-family:main,Arial,sans-serif
}
h1 {
  text-align:left;
  font-size:2.4rem;
  line-height:1.15;
  padding:20px 30px 30px;
  letter-spacing:-.04rem;
  color:#1f609c;
  background:linear-gradient(115deg,#2793e6,#0065a0);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent
}
#intro {
  padding:0
}
body:before,
#rewards:before {
  content:"";
  position:absolute;
  z-index:-1;
  top:83px;
  right:0;
  width:35vh;
  opacity:.03;
  height:55vh;
  background:url(../img/favicon.svg) no-repeat 0 0;
  background-size:cover
}
#hero {
  width:100%;
  padding:0;
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:contain;
  height:100vw;
  max-width:500px;
  margin:0 auto;
  max-height:500px
}
#benefits {
  padding:0
}
#rewards-page #benefits,
#join-page #benefits {
  margin-bottom:60px
}
#benefits ul {
  margin:50px 25px
}
#benefits ul li {
  margin:18px 0;
  position:relative;
  padding-left:30px
}
.wave {
  position:absolute;
  left:0;
  width:100%;
  top:-10px;
  height:30px;
  fill:#fff
}
.wave:last-child {
  transform:rotate(180deg);
  top:auto;
  bottom:-10px;
  fill:#ddeffd
}
#benefits ul li::before,
#secure ul li::before {
  content:"";
  width:22px;
  height:22px;
  position:absolute;
  left:0
}
#benefits ul li::before,
#terms_box.checked::before,
#secure ul li::before,
#steps h2:before,
#offers .client ul li:before,
.checkmark {
  background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAzOTEgMzkxJz48Y2lyY2xlIGN4PScxOTUnIGN5PScxOTUnIHI9JzE5NScgc3R5bGU9J2ZpbGw6IzRmYTMwNScvPjxwYXRoIGQ9J00zMjguOSwxNDcuMWMtMi44LTEuNi01MS44LTU1LjMtNTQuOS01MS4yLTguMi0yLjEtOTkuNCw5OC45LTEwNS40LDEwMS42LTcuOC0zLjQtMzYuOS00OC42LTQ5LjctMzdzLTYyLjMsNDkuMS00OC42LDYxLjNjNi4yLDUuNiw5MC4xLDk2LjcsOTguMyw5NC43LDguMywyLDE1NC4yLTE1My45LDE2MC4zLTE1Ni43QTksOSwwLDAsMCwzMjguOSwxNDcuMVonIHN0eWxlPSdmaWxsOiNmZmYnLz48L3N2Zz4=)
}
#signup {
  padding:0;
  margin:30px 0 40px
}
#steps-page #signup {
  margin-top:80px
}
#faqs-page #signup {
  padding:30px 0 0;
  margin:0;
  background:#ddeffd
}
#form {
  border-radius:30px;
  z-index:102;
  width:94%;
  margin-left:3%;
  color:#ffffffad;
  background:#177fc1;
  background:linear-gradient(359deg,#18629b,#1e88c5);
  padding:20px 0;
  box-shadow:0 -2px 12px 0 #002b4899;
  border-radius:10px;
  will-change:transform;
  transform:translateZ(0)
}
#form h2 {
  color:#fff;
  display:block;
  border-radius:50px;
  width:90%;
  margin:0 5% 20px;
  font-size:1.3rem;
  padding:5px 10px
}
#submit {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  padding:18px 30px 16px;
  display:block;
  background:#4fa322;
  width:90%;
  border-radius:50px;
  color:#fff;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 0 15px 1px #00000029;
  border-bottom:2px solid #0000001c;
  background-size:25px;
  background-position:95% 55%;
  margin:10px auto
}
#form.fixed {
  position:fixed;
  width:98%;
  margin-left:1%;
  bottom:-20px;
  margin-bottom:0;
  border-radius:40px 40px 0 0;
  animation:breathing 4s ease-in-out infinite normal
}
@keyframes breathing {
  50% {
    transform:translateY(10px)
  }
}
#form.fixed h2 {
  background:#4fa322;
  border-bottom:solid 4px #00000014;
  padding:15px
}
#form.fixed #fold {
  overflow:hidden;
  max-height:0;
  transition:max-height .4s ease-out;
  will-change:transform
}
#arrow1,
#arrow2 {
  z-index:3;
  position:absolute;
  padding:5px;
  line-height:.7;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#63bf32;
  color:#fff;
  margin-top:15px;
  animation:breathe-h 3s ease-in-out infinite normal;
  font-family:Main,Arial,sans-serif;
  font-size:26px;
  will-change:transform;
  transform:translateZ(0)
}
#arrow2 {
  top:5px;
  left:-20px
}
@keyframes breathe-h {
  50% {
    transform:translateX(-3px)
  }
}
#signup.open #fold {
  max-height:300px;
  padding-bottom:20px
}
#arrow1:after,
#arrow2:after {
  content:"";
  position:absolute;
  height:0;
  border-top:6px solid transparent;
  border-bottom:6px solid transparent;
  border-left:6px solid #63bf32;
  right:-4px;
  top:3px
}
#arrow1.error,
#arrow2.error {
  background:red
}
#arrow1.error:after,
#arrow2.error:after {
  border-left-color:red
}
#signup.open form.fixed {
  animation:none;
  border-color:#18629b;
  background:linear-gradient(359deg,#18629b,#1e88c5)
}
#signup.open #form.fixed h2 {
  background:0 0;
  padding-top:8px;
  border-top:none;
  border-bottom:solid 1px #ffffff1c;
  font-weight:600;
  animation:none
}
#signup #fog,
#welcome #fog {
  background:#4f5461f5;
  opacity:0;
  will-change:opacity;
  transition:opacity .3s
}
#signup.open #fog,
#welcome #fog {
  position:fixed;
  width:100%;
  height:100%;
  opacity:1;
  top:0;
  left:0;
  z-index:101
}
form h2 b {
  display:inline-block;
  padding:5px 10px;
  background:rgba(67,192,0,.83);
  border-radius:5px
}
form input {
  font-family:main,Arial,sans-serif;
  padding:12px 20px;
  width:90%;
  border-radius:25px;
  text-align:center;
  outline:none;
  border:none;
  font-weight:600;
  cursor:text
}
#email:focus::-webkit-input-placeholder {
  font-size:70%;
  position:absolute;
  top:0
}
form svg {
  width:15px;
  height:15px;
  fill:#ffdc23ab;
  vertical-align:sub;
  stroke:#002643;
  stroke-width:3px;
  margin-right:5px
}
#terms_box {
  padding:15px 5px;
  display:inline-block;
  color:#ffffff9e;
  text-align:left;
  font-family:Arial,sans-serif;
  font-size:80%;
  z-index:1;
  position:relative
}
#terms_box::before {
  content:" ";
  height:25px;
  width:25px;
  background:#fff;
  display:inline-block;
  border-radius:3px;
  border:2px solid #000;
  font-size:140%;
  cursor:pointer;
  margin-bottom:-8px;
  margin-right:5px
}
#terms_box.checked::before {
  background-color:#4fa305
}
#submit,
#faqs>ul>li::after,
#steps ol li::after,
.more:after,
.client .button,
#benefits:after,
#users h3:after {
  background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHN0eWxlPSdmaWxsOiNlNmY0ZmZhMycgd2lkdGg9JzQ0NC44JyBoZWlnaHQ9JzQ0NC44Jz48cGF0aCBkPSdNMzUyIDE5Ni43bC0xODYtMTg2QTM0IDM0IDAgMCAwIDE0MC4yIDBhMzQgMzQgMCAwIDAtMjUuNyAxMC44TDkyLjggMzIuM0EzNSAzNSAwIDAgMCA4Mi4yIDU4YzAgMTAgMy41IDE4LjYgMTAuNiAyNmwxMzguOCAxMzguNUw5Mi44IDM2MS4yYTM1IDM1IDAgMCAwLTEwLjYgMjUuN2MwIDEwIDMuNSAxOC42IDEwLjYgMjZsMjEuNyAyMS40YTM1IDM1IDAgMCAwIDI1LjcgMTAuNiAzNSAzNSAwIDAgMCAyNS43LTEwLjZsMTg2LTE4NmM3LTcuNCAxMC42LTE2IDEwLjYtMjZhMzUgMzUgMCAwIDAtMTAuNi0yNS43eicvPjwvc3ZnPg==);
  background-repeat:no-repeat
}
#submit:active {
  background-color:#418605
}
#rewards {
  background:#cae7f159;
  position:relative;
  margin-top:80px;
  background:#196aa4;
  background:linear-gradient(145deg,#1c85c2,#005eb8);
  padding:30px 0;
  padding:60px 0 90px
}
#faqs-page #rewards,
#join-page #rewards {
  margin-top:0
}
#rewards-page #rewards {
  margin-top:0;
  padding-bottom:30px;
  margin-bottom:50px
}
#faqs-page #rewards .wave,
#join-page #rewards .wave {
  fill:#ddeffd
}
#rewards-page #rewards .wave {
  display:none
}
#rewards:before {
  height:500px;
  width:300px
}
#rewards #diam {
  height:90px;
  width:160px;
  display:block;
  margin:0 auto 30px;
  z-index:1;
  position:relative
}
#rewards h2 {
  color:#fffdf4;
  margin:0 auto
}
#rewards h2 svg {
  fill:#ffffff45;
  width:180px;
  height:180px;
  display:block;
  margin:-20px auto 30px
}
#rewards ul {
  padding:0 25px;
  margin-top:-10px
}
#rewards ul li {
  font-size:.9em;
  border-bottom:solid 1px #ffffff17;
  padding:25px 10px 30px;
  min-height:100px
}
#rewards ul li:even {
  margin-left:-10px
}
#rewards ul li svg {
  fill:#ffffff99;
  float:left;
  width:80px;
  height:80px;
  margin-top:-5px;
  margin-right:20px;
  margin-bottom:30px
}
#rewards ul li h3 {
  font-size:1.4rem;
  margin:5px 0;
  color:#fffdf4;
  letter-spacing:-.01em;
  line-height:1;
  padding-bottom:5px
}
#rewards ul li p {
  font-family:Arial,sans-serif;
  font-weight:400;
  color:#5b97b7;
  line-height:1.1;
  letter-spacing:.6px;
  color:#ffffffa6
}
#rewards ul li:last-child {
  border:none
}
#brands {
  grid-column:1/9;
  grid-row:7;
  background:#fff
}
#steps {
  padding:40px 15px 0;
  background:#ddeffd;
  grid-row:8
}
#faqs-page #steps,
#join-page #steps {
  padding-bottom:40px
}
#steps img {
  width:100%;
  margin-top:-80px;
  margin-bottom:20px
}
#steps ol {
  list-style-type:none;
  position:relative;
  padding-left:4px;
  max-width:400px;
  margin:0 auto
}
#steps ol li {
  position:relative;
  margin-bottom:16px;
  padding:30px;
  border-radius:15px;
  text-align:left;
  box-shadow:0 10px 35px rgb(170 190 209/45%);
  background:#fff;
  font-size:1.15rem;
  min-height:160px;
  text-align:left
}
#steps li svg {
  float:right;
  fill:#1e84c170;
  height:90px;
  width:90px;
  margin-left:10px;
  margin-right:-10px;
  position:relative;
  margin-bottom:5px
}
#steps ol li:before {
  counter-increment:steps;
  content:counter(steps);
  color:#fff;
  border-radius:50%;
  background:#4fa322;
  line-height:2.8rem;
  font-size:1.8rem;
  width:2.8rem;
  height:2.8rem;
  text-align:center;
  margin-right:12px;
  display:block;
  position:absolute;
  top:-6px;
  left:-9px;
  font-weight:600
}
#steps ol li:last-child:after {
  display:none
}
#steps ol li::after {
  content:" ";
  position:absolute;
  display:block;
  height:80px;
  width:80px;
  clear:both;
  background-size:contain;
  bottom:-50px;
  left:40%;
  transform:rotate(90deg);
  z-index:1
}
#steps ol li h3 {
  margin-bottom:15px;
  line-height:1.2;
  margin-left:3px;
  font-size:1.5rem;
  background:linear-gradient(137deg,#1e84c1,#004c88);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent
}
#steps>small {
  display:block;
  padding:20px;
  font-size:.9rem
}
#steps .wave:last-child {
  fill:#ddeffd;
  transform:none;
  bottom:-30px
}
#secure {
  background:#fff7e6;
  color:#7d7d7d
}
#secure h2 {
  margin-bottom:0
}
#secure svg,
#secure img {
  margin:30px auto;
  max-width:200px;
  display:block
}
#secure ul {
  padding:40px 30px;
  list-style-type:none
}
#secure ul li {
  padding-bottom:20px;
  padding-left:30px;
  position:relative
}
#secure svg {
  height:200px;
  display:block;
  margin:-10px auto 0
}
#faqs {
  background:#ddeffd;
  padding-top:0
}
#faqs h2:before {
  content:"?";
  font-size:60px;
  font-weight:600;
  border-radius:50%;
  background:#195e92;
  display:block;
  width:82px;
  height:82px;
  background:linear-gradient(137deg,#1e84c1,#008fff);
  color:#fff;
  margin:20px auto;
  line-height:1.35;
  text-align:center
}
#faqs:after {
  position:absolute;
  bottom:-6vw;
  left:-2%;
  width:102%;
  z-index:1
}
#faqs ul {
  padding:0 3%;
  position:relative
}
#faqs ul:after {
  content:"";
  width:100%;
  height:120px;
  position:absolute;
  background:#daecf8;
  bottom:-30px;
  left:0;
  z-index:2;
  background:linear-gradient(to bottom,#fff0 0%,#daecf8 60%,#daecf8 100%)
}
#faqs>ul>li,
.more {
  background:rgb(255 255 255);
  margin:15px 0;
  padding:18px 15px;
  display:table;
  position:relative;
  border-radius:5px;
  text-align:left;
  position:relative;
  box-shadow:0 10px 20px 0 rgb(17 94 197/17%);
  border-left:solid 5px #1378bf;
  will-change:transform
}
#faqs>ul>li.visible h3 {
  color:#0a8ae4
}
#faqs.open ul:after,
#welcome #faqs ul:after {
  display:none
}
section#faqs.open>ul>li {
  display:table
}
#faqs>ul>li::after {
  content:"";
  background-size:20px;
  background-position:50% 50%;
  position:absolute;
  right:10px;
  top:calc(50% - 10px);
  width:20px;
  height:20px
}
#faqs>ul>li>div {
  padding:15px;
  display:none
}
#faqs>ul>li>div br {
  content:"";
  padding-top:10px;
  display:block
}
#faqs>ul>li.visible>div {
  display:block
}
#faqs>ul>li.visible::after {
  transform:rotate(90deg);
  right:20px;
  top:20px
}
#faqs h3 {
  cursor:pointer;
  line-height:1.2;
  padding-left:10px;
  color:#125283;
  z-index:1;
  position:relative;
  padding-right:30px;
  font-size:1.3rem;
  -webkit-tap-highlight-color:transparent
}
#faqs h3:before {
  content:"?";
  position:absolute;
  left:-8px;
  top:-1.5rem;
  opacity:.03;
  font-size:3.5rem
}
#faqs ol {
  margin:10px 0 10px 20px
}
#faqs ol li {
  margin-bottom:10px;
  line-height:1.3
}
.more {
  font-weight:600;
  padding:15px;
  padding-right:40px;
  text-align:center;
  position:relative;
  background: #188db7;
  color:#ffffffeb;
  letter-spacing:1px;
  max-width:300px;
  display:block;
  margin:40px auto 10px;
  border:none
}
.more:after {
  content:"";
  position:absolute;
  display:block;
  width:25px;
  height:25px;
  background-size:25px;
  background-position:50% 50%;
  z-index:2;
  right:15px;
  top:calc(50% - 11px);
  transform:rotate(90deg);
  opacity:.3
}
#users {
  padding-top:80px
}
#users .wave {
  fill:#dceefd
}
#users #mapimg {
  position:relative;
  min-height:550px;
  display:flex;
  justify-content:center;
  align-items:center
}
#users #mapimg img {
  width:96%;
  max-height:500px;
  margin:40px auto 0;
  display:table;
  opacity:.5
}
#users #mapimg svg {
  position:absolute;
  z-index:1
}
#users #u1 {
  top:0;
  left:calc(20% - 85px);
  height:171px;
  width:160px
}
#users #u2 {
  bottom:25%;
  left:4%;
  width:85px;
  height:100px
}
#users #u3 {
  top:62px;
  right:5%;
  width:120px;
  height:120px
}
#users #u4 {
  bottom:10px;
  right:10px;
  width:140px;
  height:130px
}
#users h3 {
  margin:50px 0 -20px;
  opacity:1;
  color:#dae4eb
}
#users h3:after {
  content:"";
  width:30px;
  height:30px;
  background-size:30px;
  display:inline-block;
  top:8px;
  margin-left:10px;
  position:relative
}
#users ul {
  width:100%;
  white-space:nowrap;
  overflow-x:scroll;
  padding:20px
}
#users ul li {
  position:relative;
  display:block;
  margin:20px 30px;
  padding:30px;
  padding-top:50px;
  border-radius:20px;
  background:#fff;
  font-size:.9rem;
  box-shadow:0 0 25px #003e6824;
  border-bottom:solid 4px #dce7eb;
  white-space:normal;
  width:80%;
  margin:20px 5px;
  display:inline-block;
  vertical-align:top
}
#users ul li em {
  font-weight:600
}
#users ul li::before {
  position:absolute;
  content:"\1F464";
  text-indent:-25px;
  opacity:.4;
  top:20px;
  left:40px;
  width:100px
}
#users ul li:last-child::before {
  width:92px
}
#user-count {
  display:block;
  margin:10px auto;
  font-size:2.4rem;
  letter-spacing:3px;
  font-weight:400
}
#user-count span {
  width:2.3rem;
  display:inline-block;
  text-align:center;
  line-height:140%;
  border-radius:.6rem;
  margin-right:.2rem;
  color:#fff;
  background:#18629b;
  background:linear-gradient(to bottom,#35aeff 0%,#3073a5 49%,#123d5f 50%,#1a639c 100%);
  padding-left:.15rem
}
#us {
  padding:50px 20px;
  text-align:left
}
#us .logo {
  opacity:.1;
  margin:10px auto;
  padding:0;
  max-width:88%;
  height:100px;
  display:block;
  float:none;
  filter:invert(70%) hue-rotate(312deg)
}
#us br,
#charity br {
  content:"";
  display:block;
  margin-top:15px
}
#charity {
  padding:50px 20px
}
#charity svg {
  opacity:.7;
  height:150px;
  margin-top:-15px
}
#charity h2 {
  color:#be8986;
  margin-top:0
}
#charity p {
  padding:40px;
  color:#7d716b;
  background:#facdb41a;
  border-radius:20px;
  font-size:1rem;
  line-height:1.6
}
#us p {
  padding:5px 10px
}
#end {
  padding:0
}
#end a {
  width:auto;
  display:block;
  text-align:center;
  margin:0 auto;
  padding:20px 30px;
  background:#b1d3ee;
  font-weight:600;
  color:#005fa7;
  position:relative;
  text-decoration:underline
}
footer {
  padding:20px 15px 50px;
  background: rgb(8 170 156);
  width:100%;
  color:#ffffffa3
}
footer ul {
  width:100%;
  padding:10px 10px 20px;
  overflow:hidden;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  text-decoration:u
}
footer ul li {
  margin:15px 0;
  color:#fff;
  float:left;
  margin-left:20px;
  width:calc(50% - 20px)
}
footer ul li>* {
  border-top:solid 1px #ffffff14;
  padding-top:10px;
  display:block;
  line-height:1.1
}
footer small {
  display:block;
  margin-top:10px
}
footer .logo {
  /* width:220px; */
  height:50px;
  background: white;
  border-radius: 10px;
}
#to-top {
  float:right;
  padding:7px;
  opacity:.3;
  border-radius:50%;
  background:#fff;
  margin:10px
}
#to-top svg {
  width:40px;
  height:40px;
  fill:#18629b;
  display:block
}
#welcome .hamburger {
  font-size:7px;
  text-transform:uppercase;
  letter-spacing:1px;
  padding:8px 12px;
  font-weight:600
}
#w-intro {
  background:#f0f9ff;
  padding-bottom:0;
  margin-bottom:0;
  overflow:visible
}
#w-intro svg:not(#w-check) {
  fill:#3c99d466;
  margin:0 auto;
  height:160px
}
#welcome h1 {
  text-align:center;
  padding:10px 20px
}
#w-intro:after {
  content:"";
  position:absolute;
  width:0;
  height:0;
  border-left:80px solid transparent;
  border-right:80px solid transparent;
  border-top:50px solid #54baf52b;
  left:calc(50% - 80px);
  bottom:20px;
  opacity:0;
  animation:point 3s ease-in-out infinite normal
}
@keyframes point {
  50% {
    bottom:0;
    opacity:1
  }
}
#steps-intro {
  padding:20px;
  color:#2c7dba
}
#steps-intro a {
  font-size:.8em;
  font-weight:600;
  border-radius:5px;
  margin-left:10px;
  opacity:.6;
  margin:15px 0 15px auto;
  border-bottom:dotted 2px;
  display:table
}
#offers,
#intro {
  padding-top:0
}
#offers {
  padding-bottom:50px;
  background:#f0f9ff
}
#offers h2 {
  font-size:1.8rem;
  padding:30px 20px 10px
}
#offers .client {
  display:block;
  margin:0 auto 55px;
  padding:20px 30px 30px;
  background:#52b2ec26;
  border-radius:17px;
  box-shadow:0 10px 35px rgb(170 190 209/81%);
  background:#fff;
  border-top:solid 10px #54baf5;
  width:calc(100% - 30px);
  max-width:400px;
  position:relative;
  transition:background .5s;
  counter-increment:offer
}
#offers .client:before {
  content:counter(offer);
  position:absolute;
  background:#54baf5;
  color:#fff;
  text-align:center;
  border-radius:50%;
  padding:8px 15px;
  line-height:1;
  font-weight:600;
  font-size:1.4rem;
  top:-1.6rem;
  left:calc(50% - 20px)
}
#offers .client small {
  position:relative
}
#offers .client small:before {
  content:"";
  position:absolute;
  top:0;
  opacity:.5;
  width:100px;
  left:calc(50% - 50px);
  background-color:#fff
}
#offers .client>* {
  display:block
}
#offers .client .details {
  text-decoration:underline;
  text-decoration-style:dotted;
  text-decoration-color:#3c99d447;
  font-weight:600;
  font-size:1rem;
  border-radius:10px;
  padding:15px;
  padding-left:40px;
  background:#f0f9ff;
  display:block;
  position:relative
}
#offers .client .details:after {
  position:absolute;
  left:5px;
  content:"\1F53D";
  margin-left:5px;
  opacity:.2
}
#offers .client .clogo {
  min-height:90px;
  display:flex;
  align-items:flex-end
}
#offers .client img {
  padding:10px 0;
  margin:0 auto;
  max-height:120px;
  display:table;
  vertical-align:bottom
}
#offers .client small {
  margin-top:15px;
  margin-bottom:22px;
  padding-top:30px;
  font-size:90%
}
#offers .client ul li {
  text-align:left;
  font-size:1em;
  position:relative;
  margin-left:15px;
  margin-top:20px
}
#offers .client ul li b {
  color:#0a9df2
}
#offers .client ul li:before {
  content:"";
  width:17px;
  height:17px;
  position:absolute;
  left:-22px;
  top:3px
}
#offers .client .button {
  width:106%;
  max-width:unset;
  margin:35px auto 0;
  outline:none;
  border:none;
  border-radius:20px;
  padding:15px 50px 15px 30px;
  color:#fff;
  background-color:#4fa322;
  font-size:1.3rem;
  display:block;
  box-shadow:0 10px 35px rgb(170 190 209/45%);
  z-index:2;
  position:relative;
  border-bottom:solid 3px #00000030;
  text-align:center;
  cursor:pointer;
  left:-3%;
  background-size:30px;
  background-position:95%
}
#offers .client .special {
  padding:15px;
  line-height:1.3;
  color:#ff6a00;
  text-shadow:0 0 16px #00000030;
  margin-top:5px;
  margin-bottom:-30px;
  position:relative;
  font-size:1.4rem;
  font-size:1rem;
  display:table
}
#offers .client .special b {
  text-transform:uppercase;
  font-size:1.2em
}
#offers .client .special:before {
  content:"\1F381";
  margin-right:5px
}
#offers .client svg {
  width:50px;
  height:50px;
  fill:#e1b500;
  margin:0 10px
}
.client small.expand,
.client ul.expand {
  max-height:400px;
  overflow:visible
}
#offers .client.off {
  transition:all 1s;
  opacity:.5
}
#offers .client.off b {
  color:red;
  font-size:1.3rem;
  text-transform:uppercase;
  display:block
}
#offers .client.off h3 {
  display:block;
  font-size:1rem;
  padding-top:10px
}
#offers .client.onlypop {
  -webkit-tap-highlight-color:transparent
}
#w-intro #w-check {
  width:50px;
  height:50px;
  border-radius:50%;
  display:block;
  stroke-width:5;
  stroke:#fff;
  stroke-miterlimit:10;
  box-shadow:inset 0 0 0 #7ac142;
  animation:fill .4s ease-in-out .4s forwards,scale .4s ease-in-out .7s both;
  margin:0 auto;
  margin-left:calc(50% + 10px);
  margin-top:-40px;
  position:relative
}
#check-c {
  stroke-dasharray:175;
  stroke-dashoffset:166;
  stroke-width:2;
  stroke-miterlimit:10;
  stroke:#7ac142;
  fill:none;
  animation:stroke .5s cubic-bezier(.65,0,.45,1) forwards
}
#check-tick {
  transform-origin:50% 50%;
  stroke-dasharray:48;
  stroke-dashoffset:48;
  animation:stroke .6s cubic-bezier(.65,0,.45,1) .8s forwards
}
@keyframes stroke {
  100% {
    stroke-dashoffset:0
  }
}
@keyframes scale {
  50% {
    transform:scale3d(1.2,1.2,1)
  }
}
@keyframes fill {
  100% {
    box-shadow:inset 0 0 0 50px #7ac142
  }
}
#welcome #steps {
  padding:50px 15px
}
#ie-warning {
  width:600px;
  background:#ffd400;
  padding:30px;
  font-size:30px;
  color:red;
  z-index:9999;
  clear:both;
  text-align:center
}
.green-button {
  background:#4fa322;
  display:table;
  margin:30px auto;
  padding:10px 20px;
  color:#fff;
  border-radius:25px;
  font-size:1.2em
}
.nospam {
  display:none
}
.popup {
  position:fixed;
  background:#00355ef5;
  width:100%;
  top:0;
  left:0;
  height:100%;
  z-index:999
}
.popup.open {
  display:block
}
.popup>div {
  position:fixed;
  top:100px;
  background:#fff;
  z-index:999;
  text-align:center;
  max-width:700px;
  left:50%;
  transform:translateX(-50%);
  padding:20px 20px 40px;
  border-radius:10px;
  box-shadow:0 2px 10px 5px #00223b4d;
  width:95%
}
.popup a {
  max-width:120px;
  width:50%;
  display:inline-block;
  border-radius:30px;
  padding:20px;
  color:#fff;
  margin:10px 5px;
  background:#0097ff;
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:1px;
  font-size:150%
}
.popup.gender a {
  font-size:100%;
  text-transform:none;
  letter-spacing:-.5px
}
.popup.gender a.female {
  background:#e38797
}
.popup a svg {
  width:50px;
  height:80px;
  display:block;
  margin:auto;
  fill:#fff;
  margin-bottom:10px
}
#howmany {
  -webkit-text-fill-color:#7ac142;
  color:#7ac142
}
#cbmsg:before {
  content:"🍪";
  font-size:300%;
  position:absolute;
  top:-40px;
  left:20px
}
#cbmsg {
  background:#767676;
  padding:20px 40px;
  border-radius:20px 20px 0 0;
  position:fixed;
  bottom:0;
  left:0;
  z-index:10000;
  width:100%;
  max-width:1100px;
  box-shadow:0 -3px 15px 0 #969696;
  color:#fff;
  font-size:1rem;
  left: 50%;
  transform: translateX(-50%);
}
#cbmsg.open {
    display: block!important;
}
#cbmsg p {
  max-width:700px;
  float:left;
  width:100%;
  /*! margin-top:10px; */
  line-height: 1.2
}
#cbmsg span {
  display:inline-block;
  padding:10px 15px;
  border-radius:10px;
  margin-top:5px;
  color:#fff;
  cursor:pointer;
  box-shadow:0 0 15px #747474;
  font-size:1.2rem
}
#accept {
  background:#4fa322
}
#reject {
  background:gray;
  margin-left:15px
}