@font-face {
  font-family: "NimbusSan-Reg";
  src: url(../fonts/NimbusSansL-Reg.otf);
}
@font-face {
  font-family: "NimbusSan-RegIta";
  src: url(../fonts/NimbusSansL-RegIta.otf);
}
@font-face {
  font-family: "NimbusSan-Bol";
  src: url(../fonts/NimbusSansL-bold.otf);
}
@font-face {
  font-family: "NimbusSan-BolIta";
  src: url(../fonts/NimbusSansL-BolIta.otf);
}
@font-face {
  font-family: "NimbusSan-Bla";
  src: url(../fonts/NimbusSans-black.ttf);
}
@font-face {
  font-family: "Nunito";
  src: url(../fonts/Nunito-VariableFont_wght.ttf);
}

*{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  /* border: 1px dashed red; */
}

:root{
  
}

body {
  font-family: 'Open Sans', sans-serif;
  line-height: 1.2;
}

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

u{
  
}

.u1{
  
}

h1 {
  font-size: 80px;
}

h2 {
  font-size: 45px;
}

h3 {
  font-size: 40px;
}

h4 {
  font-size: 35px;
}

h5 {
  font-size: 30px;
}

h6 {
  font-size: 25px;
}

p {
  font-size: 20px;
}

img {
  max-width: fit-content;
  width: 100%;
  height: auto;
  vertical-align: middle;
}

ul{
  list-style-type: none;
}


sup{
  
}

header {
  
}

nav {

}

main {

}

section {
  
}

.seccon, .seccon2{
  padding-top: 50px;
  padding-left: 7.25vw;
  padding-right: 7.25vw;
}

.seccon > div{
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

footer {
  
}

.bg-black{
  background-color: black;
}

.bg-white{
  background-color: white;
}

.bg-faintgray{
  background-color: #F3F9FA;
}

.bg-faintgray2{
  background-color: #F7F7F7;
}

.bg-faintgray3{
  background-color: #F8F8F8;
}

.bg-faintgray4{
  background-color: #E7E7E7;
}

.bg-red{
  background-color: #FF0000;
}

.bg-maroon{
  background-color: #910000;
}

.bg-blue{
  background-color: #1391CE;
}

.bg-blue2{
  background-color: #0EA8F2;
}

.bg-darkblue{
  background-color: #14294E;
}

.bg-darkblue2{
  background-color: #103a51;
}

.bg-purple{
  background-color: #443B6C;
}

.bg-violet{
  background-color: #12094E;
}

.bg-yellow{
  background-color: #FAA530;
}

.bg-green{
  background-color: #2BC75B;
}

.bg-faintblue{
  background-color: #D3E9ED;
}

.bg-faintblue2{
  background-color: #E8F6FE;
}

.bg-faintbrown{
  background-color: #F4DFC3;
}

.bg-faintbrown2{
  background-color: #f4dfc37a;
}

.bg-gradient1{
  background-image: linear-gradient(to bottom, #103a51 30%, #ffffff 75%);
}

.bg-gradient2{
  background-image: linear-gradient(to right, #E9E8ED 45%, #FFFFFF 55%);
}

.bg-gradient3{
  background-image: linear-gradient(to top, #E9E8ED 20%, #FFFFFF 90%);
}

.bg-hero{
  background-image: url('../images/bg-hero.png');
  background-repeat: no-repeat;
  background-position: bottom center;
}

.bg-parchment{
  background-image: url('../images/bg-parchment.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: clamp(100px, 9vw, 180px) clamp(38px, 10vw, 150px) clamp(80px, 12vw, 150px);
}

.bg-flag{
  background-image: url('../images/bg-flag.png');
  background-repeat: no-repeat;
  background-size: cover;
}

.highlight-yellow{
  background-image: url('../images/yellow-marker.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  background-color: transparent;
  margin: -1% 0;
  padding: 1%;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.highlight-red{
  background-image: url('../images/red-marker.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  background-color: transparent;
  margin: -1% 0;
  padding: 1%;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.highlight-lightred{
  background-image: url('../images/lightred-marker.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  background-color: transparent;
  margin: -1% 0;
  padding: 1%;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.highlight-green{
  background-image: url('../images/green-marker.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  background-color: transparent;
  margin: -1% 0;
  padding: 1%;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.c-p{
  cursor: pointer;
}

.ff-mont{
  font-family: 'Montserrat', sans-serif;
}

.ff-fira-extra-cond{
  font-family: 'Fira Sans Extra Condensed', sans-serif;
}

.ff-nimbus-reg{
  font-family: "NimbusSan-Reg", sans-serif;
}

.ff-nimbus-regIta{
  font-family: "NimbusSan-RegIta", sans-serif;
}

.ff-nimbus-bol{
  font-family: "NimbusSan-Bol", sans-serif;
}

.ff-nimbus-bolIta{
  font-family: "NimbusSan-BolIta", sans-serif;
}

.ff-nimbus-bla{
  font-family: "NimbusSan-Bla", sans-serif;
}

.ff-open{
  font-family: 'Open Sans', sans-serif;
}

.ff-roboto{
  font-family: 'Roboto Condensed', sans-serif;
}

.fw-100{
  font-weight: 100;
}

.fw-200{
  font-weight: 200;
}

.fw-300{
  font-weight: 300;
}

.fw-400{
  font-weight: 400;
}

.fw-500{
  font-weight: 500;
}

.fw-600{
  font-weight: 600;
}

.fw-700{
  font-weight: 700;
}

.fw-800{
  font-weight: 800;
}

.fw-900{
  font-weight: 900;
}

.fw-bold{
  font-weight: bold;
}

.fw-bolder{
  font-weight: bolder;
}

.fs-9{
  font-size: 9px;
}

.fs-11{
  font-size: 11px;
}

.fs-12{
  font-size: 12px;
}

.fs-15{
  font-size: 15px;
}

.fs-16{
  font-size: 16px;
}

.fs-17{
  font-size: 17px;
}

.fs-18{
  font-size: 18px;
}

.fs-20{
  font-size: 20px;
}

.fs-21{
  font-size: 21px;
}

.fs-22{
  font-size: 22px;
}

.fs-23{
  font-size: 23px;
}

.fs-24{
  font-size: 24px;
}

.fs-25{
  font-size: 25px;
}

.fs-26{
  font-size: 26px;
}

.fs-28{
  font-size: 28px;
}

.fs-30{
  font-size: 30px;
}

.fs-32{
  font-size: 32px;
}

.fs-35{
  font-size: 35px;
}

.fs-40{
  font-size: 40px;
}

.fs-50{
  font-size: 50px;
}

.fs-80{
  font-size: 80px;
}

.l-h-1{
  line-height: 1;
}

.l-h-1p1{
  line-height: 1.1;
}

.l-h-1p2{
  line-height: 1.2;
}

.l-h-1p25{
  line-height: 1.25;
}

.l-h-1p4{
  line-height: 1.4;
}

.l-h-1p5{
  line-height: 1.5;
}

.l-h-1p7{
  line-height: 1.7;
}

.l-h-40{
  line-height: 40px;
}

.l-s--0p1{
  letter-spacing: -0.1px;
}

.l-s--0p2{
  letter-spacing: -0.2px;
}

.l-s--0p3{
  letter-spacing: -0.3px;
}

.l-s--0p45{
  letter-spacing: -0.45px;
}

.l-s--0p5{
  letter-spacing: -0.5px;
}

.l-s--0p63{
  letter-spacing: -0.63px;
}

.l-s--0p8{
  letter-spacing: -0.8px;
}

.l-s--1{
  letter-spacing: -1px;
}

.t-c-black{
  color: black;
}

.t-c-white{
  color: white;
}

.t-c-gray{
  color: gray;
}

.t-c-blue{
  color: #1391CE;
}

.t-c-blue2{
  color: #0EA8F2;
}

.t-c-darkblue{
  color: #14294E;
}

.t-c-darkblue2{
  color: #103a51;
}

.t-c-yellow{
  color: #FFDB17;
}

.t-c-yellow2{
  color: #FAA530;
}

.t-c-red{
  color: #FF0000;
}

.t-c-green{
  color: #2BC75B;
}

.t-c-violet{
  color: #A020F0;
}

.t-a-c{
  text-align: center;
}

.t-a-l{
  text-align: left;
}

.t-d-lt{
  text-decoration: line-through;
}

.t-d-t-2{
  text-decoration-thickness: 2px;
}

.t-d-t-4{
  text-decoration-thickness: 4px;
}

.t-d-ul{
  text-decoration: underline;
}

.t-d-ul-h:hover{
  text-decoration: underline;
}

.t-d-c-red{
  text-decoration-color: red;
}

.diagonal-slash{
  position: relative;
  margin: 0 5px;
}

.diagonal-slash::before{
  position: absolute;
  content: "";
  left: -5px;
  top: 50%;
  right: -5px;
  border-top: 3px solid red;
  transform: rotate(-15deg);
  -webkit-transform: rotate(-15deg);
  -moz-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  -o-transform: rotate(-15deg);
}

.w-b-ba{
  word-break: break-all;
}

.w-b-bw{
  word-break: break-word;
}

.scale-2{
  scale: 2;
}

.scale-1p1{
  scale: 1.1;
}

.scale-1p2{
  scale: 1.2;
}

.h-20px{
  height: 20px;
}

.w-100px{
  width: 100px;
}

.w-10p{
  width: 10%;
}

.w-15p{
  width: 15%;
}

.w-20p{
  width: 20%;
}

.w-25p{
  width: 25%;
}

.w-30p{
  width: 30%;
}

.w-40p{
  width: 40%;
}

.w-45p{
  width: 45%;
}

.w-47p{
  width: 47%;
}

.w-50p{
  width: 50%;
}

.w-55p{
  width: 55%;
}

.w-60p{
  width: 60%;
}

.w-70p{
  width: 70%;
}

.w-80p{
  width: 80%;
}

.w-85p{
  width: 85%;
}

.w-90p{
  width: 90%;
}

.w-100p{
  width: 100%;
}

.mx-w-fc{
  max-width: fit-content;
}

.mx-w-22p{
  max-width: 22%;
}

.mx-w-45p{
  max-width: 45%;
}

.mx-w-50p{
  max-width: 50%;
}

.mx-w-100p{
  max-width: 100%;
}

.mx-w-20{
  max-width: 20px;
}

.mx-w-22{
  max-width: 22px;
}

.mx-w-24{
  max-width: 24px;
}

.mx-w-34{
  max-width: 34px;
}

.mx-w-44{
  max-width: 44px;
}

.mx-w-50{
  max-width: 50px;
}

.mx-w-80{
  max-width: 80px;
}

.mx-w-100{
  max-width: 100px;
}

.mx-w-110{
  max-width: 110px;
}

.mx-w-128{
  max-width: 128px;
}

.mx-w-150{
  max-width: 150px;
}

.mx-w-200{
  max-width: 200px;
}

.mx-w-215{
  max-width: 215px;
}

.mx-w-220{
  max-width: 220px;
}

.mx-w-240{
  max-width: 240px;
}

.mx-w-280{
  max-width: 280px;
}

.mx-w-300{
  max-width: 300px;
}

.mx-w-330{
  max-width: 330px;
}

.mx-w-360{
  max-width: 360px;
}

.mx-w-380{
  max-width: 380px;
}

.mx-w-400{
  max-width: 400px;
}

.mx-w-410{
  max-width: 410px;
}

.mx-w-440{
  max-width: 440px;
}

.mx-w-460{
  max-width: 460px;
}

.mx-w-470{
  max-width: 470px;
}

.mx-w-490{
  max-width: 490px;
}

.mx-w-500{
  max-width: 500px;
}

.mx-w-510{
  max-width: 510px;
}

.mx-w-530{
  max-width: 530px;
}

.mx-w-540{
  max-width: 540px;
}

.mx-w-550{
  max-width: 550px;
}

.mx-w-560{
  max-width: 560px;
}

.mx-w-580{
  max-width: 580px;
}

.mx-w-590{
  max-width: 590px;
}

.mx-w-600{
  max-width: 600px;
}

.mx-w-610{
  max-width: 610px;
}

.mx-w-640{
  max-width: 640px;
}

.mx-w-650{
  max-width: 650px;
}

.mx-w-670{
  max-width: 670px;
}

.mx-w-680{
  max-width: 680px;
}

.mx-w-700{
  max-width: 700px;
}

.mx-w-720{
  max-width: 720px;
}

.mx-w-740{
  max-width: 740px;
}

.mx-w-760{
  max-width: 760px;
}

.mx-w-770{
  max-width: 770px;
}

.mx-w-780{
  max-width: 780px;
}

.mx-w-790{
  max-width: 790px;
}

.mx-w-800{
  max-width: 800px;
}

.mx-w-820{
  max-width: 820px;
}

.mx-w-850{
  max-width: 850px;
}

.mx-w-870{
  max-width: 870px;
}

.mx-w-880{
  max-width: 880px;
}

.mx-w-900{
  max-width: 900px;
}

.mx-w-930{
  max-width: 930px;
}

.mx-w-950{
  max-width: 950px;
}

.mx-w-960{
  max-width: 960px;
}

.mx-w-970{
  max-width: 970px;
}

.mx-w-1000{
  max-width: 1000px;
}

.mx-w-1020{
  max-width: 1020px;
}

.mx-w-1030{
  max-width: 1030px;
}

.mx-w-1080{
  max-width: 1080px;
}

.mx-w-1140{
  max-width: 1140px;
}

.mx-w-1170{
  max-width: 1170px;
}

.mx-w-1200{
  max-width: 1200px;
}

.mx-w-1500{
  max-width: 1500px;
}

.pos-a{
  position: absolute;
}

.pos-r{
  position: relative;
}

.pos-f{
  position: fixed;
}

.t-30{
  top: 30px;
}

.r--40{
  right: -40px;
}

.r--10{
  right: -10px;
}

.l--40{
  left: -40px;
}

.r-120{
  right: 120px;
}

.d-b{
  display: block;
}

.d-b-at1400{
  display: none;
}

.d-b-m{
  display: none;
}

.d-i-m{
  display: none;
}

.d-f-m{
  display: none;
}

.d-ib-m{
  display: none;
}

.d-ib{
  display: inline-block;
}

.d-b-at425{
  display: none;
}

.d-i-at425{
  display: none;
}

.d-f{
  display: flex;
}

.d-f-m{
  display: none;
}

.d-g{
  display: grid;
}

.gtc-2-1fr{
  grid-template-columns: 1fr 1fr;
}

.a-i-c{
  align-items: center;
}

.a-i-fs{
  align-items: flex-start;
}

.a-i-fe{
  align-items: flex-end;
}

.j-c-c{
  justify-content: center;
}

.j-c-sb{
  justify-content: space-between;
}

.j-c-se{
  justify-content: space-evenly;
}

.j-c-sa{
  justify-content: space-around;
}

.j-c-fe{
  justify-content: flex-end;
}

.fd-c{
  flex-direction: column;
}

.fw-w{
  flex-wrap: wrap;
}

.fg-1{
  flex-grow: 1;
}

.f-o-1{
  order: 2;
}

.f-o-2{
  order: 3;
}

.f-o-3{
  order: 1;
}

.gap-2vw{
  gap: 2vw;
}

.gap-5vw{
  gap: 5vw;
}

.gap-10vw{
  gap: 10vw;
}

.gap-100p{
  gap: 100%;
}

.gap-5{
  gap: 5px;
}

.gap-10{
  gap: 10px;
}

.gap-15{
  gap: 15px;
}

.gap-20{
  gap: 20px;
}

.gap-30{
  gap: 30px;
}

.gap-40{
  gap: 40px;
}

.gap-50{
  gap: 50px;
}

.gap-80{
  gap: 80px;
}

.gap-100{
  gap: 100px;
}

.p-1p{
  padding: 1%;
}

.p-2p{
  padding: 2%;
}

.p-3p{
  padding: 3%;
}

.p-4{
  padding: 4px;
}

.p-6{
  padding: 6px;
}

.p-10{
  padding: 10px;
}

.p-15{
  padding: 15px;
}

.p-20{
  padding: 20px;
}

.p-30{
  padding: 30px;
}

.p-40{
  padding: 40px;
}

.p-50{
  padding: 50px;
}

.pr-20{
  padding-right: 20px;
}

.pr-30{
  padding-right: 30px;
}

.pr-50{
  padding-right: 50px;
}

.pr-60{
  padding-right: 60px;
}

.pb-0{
  padding-bottom: 0;
}

.pb-20{
  padding-bottom: 20px;
}

.pb-30{
  padding-bottom: 30px;
}

.pb-40{
  padding-bottom: 40px;
}

.pb-50{
  padding-bottom: 50px;
}

.pb-70{
  padding-bottom: 70px;
}

.pb-100{
  padding-bottom: 100px;
}

.pb-120{
  padding-bottom: 120px;
}

.pb-130{
  padding-bottom: 130px;
}

.pb-150{
  padding-bottom: 150px;
}

.pb-170{
  padding-bottom: 170px;
}

.pb-200{
  padding-bottom: 200px;
}

.pb-300{
  padding-bottom: 300px;
}

.pb-310{
  padding-bottom: 310px;
}

.pb-350{
  padding-bottom: 350px;
}

.pb-370{
  padding-bottom: 370px;
}

.pb-400{
  padding-bottom: 400px;
}

.pb-500{
  padding-bottom: 500px;
}

.pb-550{
  padding-bottom: 550px;
}

.pb-600{
  padding-bottom: 600px;
}

.pb-750{
  padding-bottom: 750px;
}

.pt-0{
  padding-top: 0;
}

.pt-10{
  padding-top: 10px;
}

.pt-20{
  padding-top: 20px;
}

.pt-30{
  padding-top: 30px;
}

.pt-50{
  padding-top: 50px;
}

.pt-60{
  padding-top: 60px;
}

.pt-70{
  padding-top: 70px;
}

.pt-100{
  padding-top: 100px;
}

.pt-150{
  padding-top: 150px;
}

.pt-180{
  padding-top: 180px;
}

.pt-200{
  padding-top: 200px;
}

.pt-270{
  padding-top: 270px;
}

.pt-300{
  padding-top: 300px;
}

.pt-400{
  padding-top: 400px;
}

.pt-450{
  padding-top: 450px;
}

.pl-30{
  padding-left: 30px;
}

.pl-50{
  padding-left: 50px;
}

.pl-60{
  padding-left: 60px;
}

.ptb-5{
  padding-top: 5px;
  padding-bottom: 5px;
}

.ptb-10{
  padding-top: 10px;
  padding-bottom: 10px;
}

.ptb-15{
  padding-top: 15px;
  padding-bottom: 15px;
}

.ptb-20{
  padding-top: 20px;
  padding-bottom: 20px;
}

.ptb-30{
  padding-top: 30px;
  padding-bottom: 30px;
}

.ptb-50{
  padding-top: 50px;
  padding-bottom: 50px;
}

.ptb-70{
  padding-top: 70px;
  padding-bottom: 70px;
}

.ptb-80{
  padding-top: 80px;
  padding-bottom: 80px;
}

.plr-0{
  padding-left: 0px;
  padding-right: 0px;
}

.plr-10{
  padding-left: 10px;
  padding-right: 10px;
}

.plr-15{
  padding-left: 15px;
  padding-right: 15px;
}

.plr-20{
  padding-left: 20px;
  padding-right: 20px;
}

.plr-30{
  padding-left: 30px;
  padding-right: 30px;
}

.plr-40{
  padding-left: 40px;
  padding-right: 40px;
}

.plr-50{
  padding-left: 50px;
  padding-right: 50px;
}

.plr-60{
  padding-left: 60px;
  padding-right: 60px;
}

.plr-100{
  padding-left: 100px;
  padding-right: 100px;
}

.plr-150{
  padding-left: 150px;
  padding-right: 150px;
}

.p-5-35{
  padding: 5px 35px;
}

.p-10-20{
  padding: 10px 20px;
}

.p-15-100{
  padding: 15px 100px;
}

.p-20-0{
  padding: 20px 0;
}

.p-20-50{
  padding: 20px 50px;
}

.p-30-50{
  padding: 30px 50px;
}

.p-40-20{
  padding: 40px 20px;
}

.p-50-30{
  padding-top: 50px;
  padding-bottom: 50px;
  padding-right: 30px;
  padding-left: 30px;
}

.p-60-200{
  padding-top: 60px;
  padding-bottom: 50px;
  padding-right: 200px;
  padding-left: 200px;
}

.p-40-50{
  padding: 40px 50px;
}

.p-70-20{
  padding: 70px 20px;
}

.p-10-0-35{
  padding: 10px 0 35px;
}

.p-10-0-50{
  padding: 10px 0 50px;
}

.p-15-0-45{
  padding: 15px 0 45px;
}

.p-15-30-50{
  padding: 15px 30px 50px;
}

.p-30-30-60{
  padding: 30px 30px 60px;
}

.p-15-30-50-60{
  padding: 15px 30px 50px 60px;
}

.p-30-30-60-60{
  padding: 30px 30px 60px 60px;
}

.p-10-30-10-40{
  padding: 10px 30px 10px 40px;
}

.p-30-30-30-60{
  padding: 30px 30px 30px 60px;
}

.m-0-auto{
  margin: 0 auto;
}

.m-auto-0{
  margin: auto 0;
}

.m-0--10{
  margin: 0 -10px;
}

.m--1p{
  margin: -1%;
}

.m--2p{
  margin: -2%;
}

.m--3p{
  margin: -3%;
}

.mt--550{
  margin-top: -550px;
}

.mt--500{
  margin-top: -500px;
}

.mt--420{
  margin-top: -420px;
}

.mt--400{
  margin-top: -400px;
}

.mt--370{
  margin-top: -370px;
}

.mt--350{
  margin-top: -350px;
}

.mt--300{
  margin-top: -300px;
}

.mt--270{
  margin-top: -270px;
}

.mt--250{
  margin-top: -250px;
}

.mt--200{
  margin-top: -200px;
}

.mt--180{
  margin-top: -180px;
}

.mt--150{
  margin-top: -150px;
}

.mt--130{
  margin-top: -130px;
}

.mt--120{
  margin-top: -120px;
}

.mt--100{
  margin-top: -100px;
}

.mt--80{
  margin-top: -80px;
}

.mt--70{
  margin-top: -70px;
}

.mt--50{
  margin-top: -50px;
}

.mt--40{
  margin-top: -40px;
}

.mt--35{
  margin-top: -35px;
}

.mt--30{
  margin-top: -30px;
}

.mt--20{
  margin-top: -20px;
}

.mt--10{
  margin-top: -10px;
}

.mt--5{
  margin-top: -5px;
}

.mt--1{
  margin-top: -1px;
}

.mt-10{
  margin-top: 10px;
}

.mt-20{
  margin-top: 20px;
}

.mt-30{
  margin-top: 30px;
}

.mt-50{
  margin-top: 50px;
}

.mb--400{
  margin-bottom: -400px;
}

.mb--300{
  margin-bottom: -300px;
}

.mb--200{
  margin-bottom: -200px;
}

.mb--150{
  margin-bottom: -150px;
}

.mb--120{
  margin-bottom: -120px;
}

.mb--130{
  margin-bottom: -130px;
}

.mb--100{
  margin-bottom: -100px;
}

.mb--40{
  margin-bottom: -40px;
}

.mb--30{
  margin-bottom: -30px;
}

.mb--20{
  margin-bottom: -20px;
}

.mb-5{
  margin-bottom: 5px;
}

.mb-10{
  margin-bottom: 10px;
}

.mb-15{
  margin-bottom: 15px;
}

.mb-20{
  margin-bottom: 20px;
}

.mb-30{
  margin-bottom: 30px;
}

.mb-40{
  margin-bottom: 40px;
}

.mb-50{
  margin-bottom: 50px;
}

.mb-80{
  margin-bottom: 80px;
}

.mb-90{
  margin-bottom: 90px;
}

.mb-100{
  margin-bottom: 100px;
}

.mb-120{
  margin-bottom: 120px;
}

.mb-150{
  margin-bottom: 150px;
}

.mb-290{
  margin-bottom: 290px;
}

.mb-300{
  margin-bottom: 300px;
}

.mb-310{
  margin-bottom: 310px;
}

.mb-330{
  margin-bottom: 330px;
}

.mb-350{
  margin-bottom: 350px;
}

.ml-auto{
  margin-left: auto;
}

.ml-30p{
  margin-left: 30%;
}

.ml-35p{
  margin-left: 35%;
}

.ml-30{
  margin-left: 30px;
}

.ml-400{
  margin-left: 400px;
}

.ml--2p{
  margin-left: -2%;
}

.ml--20{
  margin-left: -20px;
}

.ml--30{
  margin-left: -30px;
}

.ml--50{
  margin-left: -50px;
}

.ml--60{
  margin-left: -60px;
}

.mr-auto{
  margin-right: auto;
}

.mr-0{
  margin-right: 0;
}

.mr-30{
  margin-right: 30px;
}

.mr-50{
  margin-right: 50px;
}

.mr--10{
  margin-right: -10px;
}

.mr--30{
  margin-right: -30px;
}

.mr--50{
  margin-right: -50px;
}

.mr--60{
  margin-right: -60px;
}

.mr--150{
  margin-right: -150px;
}

.mtb--20{
  margin-top: -20px;
  margin-bottom: -20px;
}

.mtb--30{
  margin-top: -30px;
  margin-bottom: -30px;
}

.mlr-10{
  margin-left: 10px;
  margin-right: 10px;
}

.mlr-30{
  margin-left: 30px;
  margin-right: 30px;
}

.mlr-50{
  margin-left: 50px;
  margin-right: 50px;
}

.mlr-40p-17p{
  margin-left: 40%;
  margin-right: 17%;
}

.mtb-40{
  margin-top: 40px;
  margin-bottom: 40px;
}

.m-0--18px{
  margin: 0 -18px;
}

.top--40{
  top: -40px;
}

.zi-0{
  z-index: 0;
}

.zi-1{
  z-index: 1;
}

.zi-2{
  z-index: 2;
}

.zi-3{
  z-index: 3;
}

.zi-4{
  z-index: 4;
}

.zi-5{
  z-index: 5;
}

.zi-6{
  z-index: 6;
}

.zi-7{
  z-index: 7;
}

.zi-8{
  z-index: 8;
}

.zi-9{
  z-index: 9;
}

.p-e-n{
  pointer-events: none;
}

.divider1{
  border-bottom: solid 2px gray;
}

.divider2{
  border-bottom: solid 3px gray;
}

.divider3{
  border-bottom: solid 4px rgb(157, 157, 157);
}

.divider4{
  border-bottom: solid 3px #1391CE;
}

.line1{
  border-bottom: solid 2px gray;
}

.br-10{
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}

.br-15{
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  -ms-border-radius: 15px;
  -o-border-radius: 15px;
}

.br-20{
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
}

.br-25{
  border-radius: 25px;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  -o-border-radius: 25px;
}

.br-30{
  border-radius: 30px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}

.br-50{
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
}

.br-50p{
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}

.br-top-15{
  border-radius: 15px 15px 0 0;
  -webkit-border-radius: 15px 15px 0 0;
  -moz-border-radius: 15px 15px 0 0;
  -ms-border-radius: 15px 15px 0 0;
  -o-border-radius: 15px 15px 0 0;
}

.br-top-20{
  border-radius: 20px 20px 0 0;
  -webkit-border-radius: 20px 20px 0 0;
  -moz-border-radius: 20px 20px 0 0;
  -ms-border-radius: 20px 20px 0 0;
  -o-border-radius: 20px 20px 0 0;
}

.br-top-25{
  border-radius: 25px 25px 0 0;
  -webkit-border-radius: 25px 25px 0 0;
  -moz-border-radius: 25px 25px 0 0;
  -ms-border-radius: 25px 25px 0 0;
  -o-border-radius: 25px 25px 0 0;
}

.br-bottom-15{
  border-radius: 0 0 15px 15px;
  -webkit-border-radius: 0 0 15px 15px;
  -moz-border-radius: 0 0 15px 15px;
  -ms-border-radius: 0 0 15px 15px;
  -o-border-radius: 0 0 15px 15px;
}

.br-bottom-20{
  border-radius: 0 0 20px 20px;
  -webkit-border-radius: 0 0 20px 20px;
  -moz-border-radius: 0 0 20px 20px;
  -ms-border-radius: 0 0 20px 20px;
  -o-border-radius: 0 0 20px 20px;
}

.br-right-10{
  border-radius: 0 10px 10px 0;
  -webkit-border-radius: 0 10px 10px 0;
  -moz-border-radius: 0 10px 10px 0;
  -ms-border-radius: 0 10px 10px 0;
  -o-border-radius: 0 10px 10px 0;
}

.br-right-50{
  border-radius: 0 50px 50px 0;
  -webkit-border-radius: 0 50px 50px 0;
  -moz-border-radius: 0 50px 50px 0;
  -ms-border-radius: 0 50px 50px 0;
  -o-border-radius: 0 50px 50px 0;
}

.br-bl-20{
  border-radius: 0 0 0 20px;
  -webkit-border-radius: 0 0 0 20px;
  -moz-border-radius: 0 0 0 20px;
  -ms-border-radius: 0 0 0 20px;
  -o-border-radius: 0 0 0 20px;
}

.br-br-20{
  border-radius: 0 0 20px 0;
  -webkit-border-radius: 0 0 20px 0;
  -moz-border-radius: 0 0 20px 0;
  -ms-border-radius: 0 0 20px 0;
  -o-border-radius: 0 0 20px 0;
}

.b-blue{
  border: 1.5px solid #1391CE;
}

.b-black{
  border: 1.5px solid black;
}

.b-black2{
  border: 3px solid black;
}

.b-top-gray{
  border-top: 1px solid gray;
}

.b-right-black2{
  border-right: 2px solid black;
}

.b-left-black2{
  border-left: 2px solid black;
}

.b-white{
  border: 3px solid white;
}

.b-s-1{
  box-shadow: 10px 10px 30px #00000029;
}

.b-s-2{
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.25);
}

.b-s-3{
  box-shadow: 0px 5px 5px #00000029;
}

.t-s-1{
  text-shadow: 3px 3px 0px #0EA8F229, 0px 0px 1px black;
}

.ovflw-h{
  overflow: hidden;
}

.cp1{
  clip-path: polygon(0 0, 50% 100%, 100% 0);
}

.cp2{
  clip-path: polygon(100% 0,100% 85%,50% 100%,0 85%,0 0);
}


/* sales section css */
.sales-section{
  padding-top: 50px;
  padding-left: 7.25vw;
  padding-right: 7.25vw;
  font-family: 'Roboto Condensed', sans-serif;
}

.sales-container{
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

.sales-content{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

.sales-offer{
  max-width: 340px;
  width: 100%;
  padding: 20px;
  text-align: center;
  border: 2px solid black;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  -ms-border-radius: 15px;
  -o-border-radius: 15px;
  font-weight: bold;
  line-height: 1.2;
  cursor: pointer;
  transition: all .2s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  position: relative;
  top: 0;
  font-family: 'Roboto Condensed', sans-serif;
}

.sales-offer:hover {
  top: -5px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.sales-offer:nth-of-type(1)::before{
  content: 'MOST POPULAR';
  padding: 10px;
  background-color: #bd3326;
  text-align: center;
  color: white;
  display: block;
  margin: -25px -25px 10px;
  border-radius: 15px 15px 0 0;
  -webkit-border-radius: 15px 15px 0 0;
  -moz-border-radius: 15px 15px 0 0;
  -ms-border-radius: 15px 15px 0 0;
  -o-border-radius: 15px 15px 0 0;
  font-size: 22px;
  font-weight: bold;
}

.sales-offer:nth-of-type(1){
  max-width: 360px;
  order: 2;
  background-color: #E2F8FF;
  border: 5px solid #11274c;
  animation: outline-ping 3s linear infinite;
  outline: 0px solid #00008b00;
  outline-offset: 0px;
  -webkit-animation: outline-ping 3s linear infinite;
}

@keyframes outline-ping{
  0%{
    outline: 0px solid #00008b00;
    outline-offset: 0px;
  }89%{
    outline: 0px solid #00008b00;
    outline-offset: 0px;
  }90%{
    outline: 3px solid #00008b;
    outline-offset: 0px;
  }100%{
    outline: 0px solid #00008b00;
    outline-offset: 6px;
  }
}

.sales-offer:nth-of-type(2){
  order: 3;
}

.sales-offer:nth-of-type(3){
  order: 1;
}

.sales-offer:nth-of-type(3) > a > div:nth-of-type(1) > img{
  width: 80%;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(1){
  font-size: clamp(38px, 4.5vw, 50px);
  line-height: 1;
  color: #11274c;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(2){
  font-size: 25px;
  margin-bottom: 20px;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(3){
  font-size: 25px;
  margin-top: 10px;
  line-height: 1.4;
  display: none;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(3) > span:nth-of-type(1){
  font-weight: 400;
  margin-right: 5px;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(3) > span:nth-of-type(2){
  position: relative;
  margin-right: 5px;
}

.sales-offer > a > div:nth-of-type(1) > p:nth-of-type(3) > span:nth-of-type(2)::before{
  position: absolute;
  content: "";
  left: -3px;
  top: 50%;
  right: -3px;
  border-top: 2px solid red;
  transform: rotate(-15deg);
  -webkit-transform: rotate(-15deg);
  -moz-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  -o-transform: rotate(-15deg);
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(1){
  font-size: clamp(40px, 5vw, 80px);
  margin-top: 10px;
  margin-bottom: 10px;
  color: #11274c;
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(1) > span{
  font-size: 30px;
  font-weight: 400;
  color: black;
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(2){
  font-size: 25px;
  margin-top: 10px;
  line-height: 1.4;
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(2) > span:nth-of-type(1){
  font-weight: 400;
  margin-right: 5px;
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(2) > span:nth-of-type(2){
  position: relative;
  margin-right: 5px;
}

.sales-offer > a > div:nth-of-type(2) > p:nth-of-type(2) > span:nth-of-type(2)::before{
  position: absolute;
  content: "";
  left: -5px;
  top: 50%;
  right: -5px;
  border-top: 3px solid red;
  transform: rotate(-15deg);
  -webkit-transform: rotate(-15deg);
  -moz-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  -o-transform: rotate(-15deg);
}

.sales-adds{
  margin-top: 10px;
  margin-bottom: 10px;
}

.sales-adds > div{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}

.sales-adds > div > p{
  text-shadow: 2px 2px 4px #000000;
  color: white;
  font-size: clamp(13px, 1.7vw, 20px);
  font-style: italic;
}

.sales-adds > div:nth-of-type(1){
  background-color: #CE1C17;
  margin-bottom: 5px;
}

.sales-adds > div:nth-of-type(2){
  background-color: #008C56;
  margin-bottom: 5px;
}

.sales-adds > div:nth-of-type(3){
  background-color: #FF8700;
  margin-bottom: 5px;
}

.sales-button{
  margin-bottom: 10px;
}

.sales-shipping{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.sales-shipping > img{
  max-width: 30px;
}

.sales-shipping > p{
  font-size: 18px;
  font-weight: 400;
}

.red-badge {
  background-color: #f1170e;
  color: #fff;
  transform: rotate(15deg);
  position: absolute;
  right: 0;
  top: 0;
  height: 70px;
  width: 70px;
  border: 3px solid #fff;
  border-radius: 50%;
  font-weight: 900;
  font-size: 19px;
  line-height: 19px;
  text-align: center;
  text-transform: uppercase;
  padding: 12px 0 0 0;
}


/* testimonials css */

.s7tbx, .s7tbx2 {
  margin: 0 auto;
  padding: 30px 10px 30px 100px;
  position: relative;
}

.s7tbx2 {
  border-bottom: none;
  padding: 0 0 0 96px;
}

.testimonial-portraits {
  width: 100%;
  max-height: 124px;
  max-width: 80px;
  object-fit: cover;
  border-radius: 50px;
}

.s7timg {
  position: absolute;
  left: 10px;
  top: 40px;
}

.s7thding {
  font-weight: bold;
  font-size: 23px;
  line-height: 30px;
  color: #11274c;
  text-align: left;
  margin-top: 6px;
}

.s7ttxt1 {
  font-size: 15px;
  line-height: 22px;
  color: #2f2f2f;
  text-align: left;
  margin-top: 2px;
}

.s7ttxt2, .s7ttxt3 {
  font-size: 18px;
  line-height: 1.2;
  text-align: left;
}

.s7ttxt3 {
  font-size: 20px;
  line-height: 30px;
}

.s7ttxt4 {
  font-size: 12px;
  line-height: 15px;
  text-align: left;
  margin-top: 10px;
  font-style: italic;
}

/* testimonials css end */


/* FAQ css */

#acc > div{
  margin-bottom: clamp(10px, 2vw, 20px);
  background-color: #f0f0f0;
  border: 1px solid black;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}

#acc > div > p{
  font-weight: 700;
  padding: clamp(10px, 2vw, 20px) 20px clamp(10px, 2vw, 20px) clamp(10px, 2vw, 20px);
  font-size: clamp(18px, 2vw, 22px);
  letter-spacing: -0.75px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
}

.acc-content{
  animation: grow-down .5s linear;
  -webkit-animation: grow-down .5s linear;
  border-top: 1px solid gray;
  display: none;
  overflow: hidden;
}

.acc-content > p{
  margin: 20px;
}

@keyframes grow-down{
  from{
    max-height: 0px;
  }to{
    max-height: 300px;
  }
}

@keyframes shrink-up{
  from{
    max-height: 0px;
  }to{
    max-height: 300px;
  }
}

.acc-content > p{
  font-size: clamp(16px, 1.8vw, 18px);
}

.acc-down::after {
  content: "";
  display: block;
  position: absolute;
  width: clamp(10px, 2vw, 15px);
  height: clamp(10px, 2vw, 15px);
  border-bottom: 5px solid;
  border-right: 5px solid;
  transform: rotate(45deg);
  right: clamp(20px, 3vw, 30px);
  top: calc(50% - clamp(10px, 2vw, 15px));
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}

.acc-up::after {
  content: "";
  display: block;
  position: absolute;
  width: clamp(10px, 2vw, 15px);
  height: clamp(10px, 2vw, 15px);
  border-bottom: 5px solid;
  border-right: 5px solid;
  transform: rotate(-135deg);
  right: clamp(20px, 3vw, 30px);
  top: calc(50% - 6px);
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
}

/* FAQ css end */


/* custom classes */

.menu-icon:nth-of-type(1){
  width: 24px;
  height: 8px;
  border-top: 2px solid #1391CE;
  border-bottom: 1px solid #1391CE;
}

.menu-icon:nth-of-type(2){
  width: 24px;
  height: 8px;
  border-top: 1px solid #1391CE;
  border-bottom: 2px solid #1391CE;
}

.ingredients-list > div{
  max-width: 360px;
  width: 100%;
}

.ingredients-list > div:nth-of-type(7){
  max-width: 400px;
  width: 100%;
  margin-left: auto;
}

.ingredients-list > div:nth-of-type(8){
  max-width: 460px;
  width: 100%;
  margin-right: auto;
}

.ingredients-list > div > div > p{
  line-height: 1.2;
  font-weight: 500;
}

.parchment-seal{
  margin-bottom: -150px;
}

.faq{
  width: 100%;
}

.faq > li{
  margin-bottom: 20px;
  font-size: 15px;
  display: flex;
  gap: 15px;
}

.faq > li > span{
  margin-left: 30px;
}

/* footer */
.flt{float:left;width:100%;}
footer {
  background: #11274c;
  padding: 50px 0;
}
.container {
  width: 1170px;
  height: auto;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}
footer{
	background:#11274c;
	padding:50px 0;
}
.ftrlogo{margin:0 auto;display:block;}
ul.ftrlist{padding:25px 0 0 0;text-align:center;}
ul.ftrlist li{
	display:inline-block;
	font-size:16px;
	line-height:16px;
	color:#fff;
	text-align:center;
	margin:4px 0 0 0;
	border-right:1px solid #fff;
	padding:0 15px;
}
ul.ftrlist li:last-child{border-right:none;}
ul.ftrlist li a{color:#fff;}
.ftrtxt, .ftrtxt2 {
	font-size:14px;
	line-height:20px;
	color:#fff;
	text-align:center;
	margin:20px 140px 0 140px;
	
}
.ftrtxt2{
    border: 2px solid #fff;
    padding: 10px 40px;
	font-weight:500;    
}
.footmodal {
    display: none;
    position: fixed;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
}

.footmodal-content {
    position: relative;
    background-color: #fefefe;
    margin: 100px auto;
    padding: min(50px, 5vw);
    border: 1px solid #888;
    width: 95%;
    max-width: 1200px;
}

.footmodal-content > h1{
  margin-bottom:3vw;
  font-size: 32px;
}

.footmodal-content > h2{
  margin-bottom:2vw;
  margin-top:2vw;
  font-size: 24px;
  text-align:left;
}

.footmodal-content > p{
  margin-bottom:1vw;
  text-align:left;
}

.center-text{
  text-align: center;
}

.footmodalclose {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 40px;
  font-weight: bold;
  cursor: pointer;
}

.footmodalclose:hover,
.footmodalclose:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.dsplay {
  width: 100%;
  display: table;
  box-sizing: border-box;
}

@media only screen and (max-width: 1920px) {
  .container {
      max-width: 1000px;
      width: 100%;
  }
}

@media only screen and (max-width: 1190px){
  .ftrtxt, .ftrtxt2 {margin:20px 50px 0 50px;}
  .ftrtxt2{padding:10px 20px;}
  }
  @media only screen and (max-width: 1020px){
  .ftrtxt, .ftrtxt2 {margin:20px 0 0 0;}
  }
  @media only screen and (max-width: 767px){
  footer{padding:30px 0;}
  ul.ftrlist li{font-size:14px;line-height:14px;padding:0 8px;}
  .ftrtxt, .ftrtxt2{
    font-size:13px;
    line-height:19px;
  }
  .ftrtxt2{padding:10px 12px;}
  }

/* modals */

.modal-container {
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  padding: min(50px, 2.5vw);
  overflow-y: scroll;
  animation: fade-in .5s ease-in-out;
  -webkit-animation: fade-in .5s ease-in-out;
}

.modal {
  background-color: white;
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px;
  animation: slide-in .5s ease-in-out;
  -webkit-animation: slide-in .5s ease-in-out;
}

.modal-popup {
  background-color: white;
  position: relative;
  max-width: 600px;
  margin: 0 auto;
  padding: 30px;
  animation: slide-in .5s ease-in-out;
  -webkit-animation: slide-in .5s ease-in-out;
}

.offer-popup{
  max-width: 1000px;
  padding: 0;
  overflow: hidden;
  width: min(1000px, 100%);
}

.offer-popup > div:nth-child(1){
  padding: 30px 20px 40px;
}

.offer-popup > div:nth-child(1) > h2{
  font-family: Tangier-Bla;
  font-size: min(92px, 12vw);
  text-align: center;
  color: #f8e6da;
  margin-bottom: 10px;
}

.offer-popup > div:nth-child(1) > p{
  font-family: 'Montserrat', sans-serif;
  font-size: min(28px, 3.9vw);
  margin: 0 auto;
  font-weight: 600;
  text-align: center;
  color: #fff;
}

.offer-popup > div:nth-child(2) > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(80px, 8vw);
  padding: 40px 20px;
}

.offer-popup > div:nth-child(2) > div > img:nth-child(1){
  width: 38%;
  max-width: fit-content;
}

.offer-popup > div:nth-child(2) > div > img:nth-child(2){
  width: 10%;
  max-width: fit-content;
}

.offer-popup > div:nth-child(2) > div > div{
  position: relative;
}

.offer-popup > div:nth-child(2) > div > div > div{
  right: -50px;
}

.offer-popup > div:nth-child(2) > div > div > img{
  width: min(100%, 18vw);
  max-width: fit-content;
}

.offer-popup > div:nth-child(3){
  padding: 0 20px 20px;
}

.offer-popup > div:nth-child(3) p{
  text-align: center;
  font-family: 'Montserrat', sans-serif;
}

.offer-popup > div:nth-child(3) > p:nth-child(1){
  font-size: 25px;
  max-width: 750px;
  margin: 0 auto;
  font-weight: bold;
}

.offer-popup > div:nth-child(3) > a:nth-child(2) > p{
  font-size: 33px;
  color: white;
  background: linear-gradient(180deg,rgba(255,230,0,1) 0%,rgba(255,196,0,1) 100%);
  padding: 20px;
  width: 90%;
  margin: 20px auto;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
}

.offer-popup > div:nth-child(3) > a:nth-child(2) > p:hover{
  background: rgba(255,230,0,1);
}

.offer-popup > div:nth-child(3) > a:nth-child(2) > p:active{
  background: rgba(255,196,0,1);
}

.offer-popup > div:nth-child(3) > a:nth-child(3) > p:hover{
  background-color: #d42121;
}

.offer-popup > div:nth-child(3) > a:nth-child(3) > p:active{
  background-color: #790000;
}

.offer-popup > div:nth-child(3) > a:nth-child(3) > p{
  font-size: 33px;
  color: white;
  background-color: #ac0303;
  padding: 20px;
  width: 90%;
  margin: 20px auto;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
}

@media screen and (max-width: 768px){
  .modal{
    padding: 2vw;
  }
  div.button{
    position: fixed;
    background-color: white;
    scale: 1.5;
  }
  .offer-popup > div:nth-child(2) > div > div > div{
    right: -20px;
    scale: .8;
  }
  .offer-popup > div:nth-child(3) {
    padding: 0 20px 20px;
  }
  .offer-popup > div:nth-child(3) > p:nth-child(1){
    font-size: 3.8vw;
  }
  .offer-popup > div:nth-child(3) > a:nth-child(2) > p{
    font-size: 5vw;
    padding: 10px;
    width: 100%;
    margin: 10px auto;
  }
  .offer-popup > div:nth-child(3) > a:nth-child(3) > p{
    font-size: 3.8vw;
    padding: 10px;
    width: 100%;
    margin: 10px auto;
  }
}

@media screen and (max-width: 425px){
  .offer-popup > div:nth-child(1) {
    padding: 20px;
  }
  .offer-popup > div:nth-child(1) > p{
    font-size: 5.2vw;
  }
  .offer-popup > div:nth-child(2) > div > div > div{
    top: -20px;
    scale: .65;
  }
  .offer-popup > div:nth-child(2) > div {
    padding: 20px;
  }
  .offer-popup > div:nth-child(3) > p:nth-child(1){
    font-size: 5.6vw;
  }
  
  .offer-popup > div:nth-child(3) > a:nth-child(2) > p{
    font-size: 5vw;
  }
  
  .offer-popup > div:nth-child(3) > a:nth-child(3) > p{
    font-size: 3.6vw;
  }
}

.modal-x-button {
  border-radius: 20px;
  display: flex;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 25px;
  right: 30px;
  align-items: center;
  justify-content: center;
}
.button {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.cross {
  background: black;
  height: 21px;
  position: relative;
  width: 4px;
  transform: rotate(45deg);
}

.cross::after {
  background: black;
  content: '';
  height: 4px;
  position: absolute;
  left: -8px;
  top: 8px;
  width: 21px;
}