/* ------ Fonts ------ */
@font-face {
    font-family: Rubik;
    src:  url(/c/campaign/1885/content/rubik-regular.ttf) format('opentype');
    font-display: swap;
}
@font-face {
    font-family: Rubik-Bold;
    src:  url(/c/campaign/1885/content/rubik-bold.ttf) format('opentype');
    font-display: swap;
} 
@font-face {
    font-family: Rubik-Medium;
    src:  url(/c/campaign/1885/content/rubik-medium.ttf) format('opentype');
    font-display: swap;
}

/* Start css reset and tools */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,button,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,
html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block
}
body {
    line-height: 1
}
ol,ul {
    list-style: none
}
blockquote,q {
    quotes: none
}
blockquote:after,blockquote:before,q:after,q:before {
    content: '';
    content: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
body,html {
    margin: 0;
    padding: 0;
    border: 0;
    font: 16px/1.25 'Rubik', Lato, Calibri, sans-serif;
    letter-spacing: .5px;
    overflow-x: hidden
}
.noScroll {
    height: 100%;
    overflow: hidden
}
h1,h2,h3,h4,h5,h6 {
    margin: 0;
    padding: 0;
    font-family: 'Rubik-bold';
    color:#2944A1;
}
h1 {
    color:#fff;
}
a,abbr,acronym,blockquote,dd,dt,input,li,ol,p,q,select,td,textarea,th,ul {
    margin: 0;
    padding: 0
}
blockquote {
    margin: 1.25rem;
    padding: 1.25rem
}
q {
    font-style: italic
}
abbr,acronym {
    cursor: help;
    border-bottom: 1px dashed
}
a,a:active,a:hover,a:link,a:visited {
    text-decoration: none;
}
img {
    border: none
}
table {
    margin: 0;
    padding: 0;
    border: none
}
form {
    margin: 0;
    padding: 0;
    display: table
}
form .formRow {
    padding-top: 16px
}
label {
    font-size: 1.3rem
}
input[type=button],input[type=email],input[type=number],input[type=submit],input[type=text],textarea {
    -webkit-appearance: none;
    border-radius: 0;
    border: 1px solid transparent;
    font: 14px/1.25 'Rubik', Lato, Calibri, sans-serif;
}
.entry,.nextLoad {
    display: none
}
.clear {
    clear: both
}
.floatLeft {
    float: left
}
.floatRight {
    float: right
}
.textLeft {
    text-align: left
}
.textRight {
    text-align: right
}
.textCenter {
    text-align: center
}
.textJustify {
    text-align: justify
}
.blockCenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}
.bold {
    font-family:'Rubik-Bold';
}
.light {
    font-weight: 300
}
.italic {
    font-style: italic
}
.underline {
    text-decoration: underline
}
.noindent {
    margin-left: 0;
    padding-left: 0
}
.nomargin {
    margin: 0 !important
}
.nopadding {
    padding: 0
}
.xtrPad {
    padding-top: 26px
}
.nobullet {
    list-style: none;
    list-style-image: none
}
.hide {
    display: none
}
.alert {
    text-align: center
}
/* --- End css reset and tools --- */

/* --- Overall start --- */
.main-content{
    padding:5rem 0 0;
}
body {
    background-color:#F4F6F7;
}
section {
    position:relative;
    overflow:hidden;
    padding:2rem 1.5rem;
}
.container {
    max-width:1092px;
    margin:auto;
}
.flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
    position:relative;
    z-index: 2;
}
.flex.col {
    flex-direction: column;
    align-items: flex-start;
}
.flexJustifyStart{
    justify-content: flex-start;
}
.flexJustifyEnd{
    justify-content: flex-end;
}
.flexJustifyBetween{
    justify-content: space-between;
}
.flexJustifyAround{
    justify-content: space-around;
}
.flexJustifyEven{
    justify-content: space-evenly;
}
.flexJustifyCenter{
    justify-content: center;
}
.flexAlignStart {
    align-items: flex-start;
}
.flexAlignEnd {
    align-items: flex-end;
}
.flexAlignBetween {
    align-items: space-between;
}
.flexAlignAround {
    align-items: space-around;
}
.flexAlignEven {
    align-items: space-evenly;
}
.flexAlignCenter {
    align-items: center;
}
.flexContentStart {
    align-content: flex-start;
}
.flexContentEnd {
    align-content: flex-end;
}
.flexContentBetween {
    align-content: space-between;
}
.flexContentAround {
    align-content: space-around;
}
.flexContentStretch{
    align-content: stretch;
}
.flexContentCenter {
    align-content: center;
}
.full {
    width:100%;
    height:auto;
}
.half {
    width:50%;
    height:auto;
}
h1 {
    font-size:2.25rem;
}
h2 {
    font-size:2rem;
}
h3 {
    font-size:1.75rem;
    font-weight:700;
}
h4 {
    font-size:1.5rem;
    font-weight:700;
}
h5 {
    font-size:1.25rem;
}
h6 {
    font-size:1rem;
}
p {
    font-size: 1rem;
    padding:0.5rem 0
}
.small {
    font-size:0.875rem;
}

video {
    object-fit: cover;
    width:100%;
    height:100%;
    /*max-width:1064px;
    margin:auto;
    display:block;*/
}
video::-webkit-media-controls-panel {
  background-color: transparent;
}
.light,.dark {
    overflow:hidden;
}
.light {
    background-color:#F4F6F7;
    color:#242836;
}
.dark {
    background-color:#2944A1;
    color:#F4F6F7;
}

@media(min-width:768px) {
    h1 {
        font-size:3rem;
    }
    h2 {
        font-size:2.75rem;
    }
    h3 {
        font-size:2.5rem;
    }
    h4 {
        font-size:2rem;
    }
    h5 {
        font-size:1.5rem;
    }
    h6 {
        font-size:1rem;
    }
    p {
        font-size:1.25rem;
    }
    .small {
        font-size:1rem;
    }
    .flex.col {
        align-items: flex-start;
    }
    .flex.col.textCenter {
        align-items: center;
    }
    .copy {
        width:60%;
        height:auto;
    }
}

@media(min-width:1440px) {
    .container {
        max-width:1280px;
        margin:auto;
    }
}

/* --- Overall end --- */

/* --- animations start --- */
@keyframes upBounce {
    0% {
        transform: translateY(20%);
    }
    100% {
        transform: translateY(0);
    }
}
@keyframes downBounce {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(20%)
    }
}
@keyframes leftBounce {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(20%);
    }
}
@keyframes rightBounce {
    0% {
        transform: translateX(20%);
    }
    100% {
        transform: translateX(0%);
    }
}
.upBounce {
    -webkit-transition: opacity .5s, top 1s;
    transition: opacity .5s, top 1s;
    position: relative;
    top: 20px;
    opacity:0;
}
.upBounce.move {
    top: 0;
    opacity:1;
}
.downBounce {
    -webkit-transition: top 1s;
    transition: top 1s;
    position: relative;
    top: 0;
    opacity:0;
}
.downBounce.move {
    top: 20px;
    margin-top: -100px;
    opacity:1;
}
.leftBounce {
    -webkit-transition: opacity .5s, left 1s;
    transition: opacity .5s, left 1s;
    position: relative;
    left: 20px;
    opacity:0;
}
.leftBounce.move {
    left: 0;
    opacity:1;
}
.rightBounce {
    -webkit-transition: opacity .5s, right 1s;
    transition: opacity .5s, right 1s;
    position: relative;
    right: 20px;
    opacity:0;
}
.rightBounce.move {
    right: 0;
    opacity:1;
}
/* --- animations end --- */

/* --- buttons and links start --- */
a {
    color:#fff;
    font-family:'Rubik-Bold';
    font-style: normal;
    font-weight: 500;
    font-size:1.1em;
}
button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14px 20px;
    gap: 8px;
    border-radius: 4px;
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 700;
    font-size:1.4em;
}
a.primaryBtn,a.secondaryBtn, a.outlineBtn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14px 35px;
    gap: 8px;
    border-radius: 31px;
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 700;
    font-size:1.25em;
    line-height:initial!important;
}
.primaryBtn {
    background: #2944A1;
    color:#fff;
}
.secondaryBtn {
    background:rgba(41, 68, 161, 0.1);
    color:#2944A1;
}
.outlineBtn {
    background: none;
    color:#fff;
    border: 2px solid #fff;
}
/* --- buttons end --- */
/* --- lists start --- */
ul,li {
    padding: 1.14286rem 0;
    font-size: 1.14286rem;
}
li {
    padding: 0.5rem 0.75rem;
}
.activeList:before {
    content:"| ";
    color:#EE1753;
    font-family: 'Rubik-Bold';
}
.activeList {
    font-family:"Rubik-Bold";
    font-size:1.71425rem
}
.listAnime {
    cursor:pointer;
}
.products-services .listAnime {
    cursor:auto;
}
/* --- lists end --- */
/* --- header and nav start --- */
.fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    z-index: 1030;
    background-color: #fff!important;
}
header {
    height: 64px;
    padding: 8px 16px;
}
header > div:first-of-type {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    height:60px;
}
#hamburgMob svg g path {
    fill: #2944A1;
}
.navbar-brand {
    background: url(/c/campaign/1885/content/mkodowhite.svg);
    background-repeat: no-repeat;
    background-size: 130px;
    height: 40px;
    width: 168px;
    position:absolute;
}
.links {
    display:none;
    position: absolute;
    top:114px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
    width: 180px;
}
.links a {
    line-height:40px;
    display: block;
    margin-bottom: 8px;
    color:#fff;
}
main a {
    color: #2944A1;
}
.anchor {
    position: absolute;
    top: -80px;
    z-index:-1;    
}
.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1020;
    background-color: #000;
    opacity: .85;
    display: none
}
.modal-backdrop.in {
    opacity: .8
}
.modal-mkodo {
    color:#242836;
    background-color:#F4F6F7;
    position: fixed;
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    z-index: 1030;
}
.modal-body,.modal-header-mkodo {
    padding:1.25rem;
}
.modal-header-mkodo h2 {
    font-family: 'Rubik-Bold';
}
#cookieModal {
    bottom: 16px;
    position: fixed;
    z-index: 4;
    -webkit-box-shadow: 0 10px 6px -6px #777;
    -moz-box-shadow: 0 10px 6px -6px #777;
    box-shadow: 0 10px 6px -6px #777;
    max-width:660px;
}
#cookieModal button{
    float: right;
}
#cookieModal a {
    color:#2944A1;
}
.closeModal {
    color: #000;
    width: 40px;
    height: 40px;
    float: right;
    background-color: transparent;
    font-size: 2rem;
    padding: 0 0 4px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1;
}
/* ---- FAQs ---- */
.terms, .content-toggle, .content {
    list-style-type: none;
    -webkit-padding-start: 0;
}
.termsLink {
    text-decoration:none;
}
.content-toggle {
    position: relative;
    -webkit-padding-end: 8px;
}
.content-toggle>a:after, .content-toggle.up>a:after {
    background-image: url("/c/campaign/1885/content/dropDownChevron.svg");
    background-repeat: no-repeat;
    content: "";
    display: block;
    height: 22px;
    width: 22px;
    background-position: 5px;
    position: absolute;
    right: -8px;
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.content-toggle.up>a:after {
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.content-toggle a {
    font-family:'Rubik';
}
.content {
    padding-top: 20px;
}
.accordion {
    background: #ffffff;
    border-radius: 32px;
    margin: 10px 0;
    padding: 24px 32px;
}
@media(min-width:768px) {
    .modal-mkodo {
        width:60%;
        top:100px;
        max-width: 600px;
        height:auto;
    }
    .modal-mkodo {
        border-radius: 12px;
    }
    .modal-mkodo .modal-body img {
        border-radius:12px 0 0 12px;
    }
    #cookieModal {
        -webkit-box-shadow: 6px 10px 6px -6px #777;
        -moz-box-shadow: 6px 10px 6px -6px #777;
        box-shadow: 6px 10px 6px -6px #777;
        right: 16px;
    }
}
@media(min-width:924px) {
    header #aniTrigger {
        display:none;
    }
    header {
        padding: 16px 32px 0;
        background-color:#fff;
    }
    .navbar-brand {
        background-size: 160px;
        height: 62px;
    }
    .links {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        gap:20px;
        position:initial;
        width:initial;
        margin:initial;
    }
    .links a {
        line-height:initial;
        color:#2944A1;
    }
}
/* --- header and nav end --- */
/* --- footer start --- */
footer {
    padding:2.4rem 1.2rem;
    background-color:#2944A1;
    color:#fff;
}
footer .flex {
    align-items: flex-start;
    justify-content: center;
    gap: 28px;
}
.footerLinks, .footerSubLinks{
    align-items: flex-start;
    flex-wrap: nowrap;
    flex-direction:column;
}
.footerLinks a{
    font-family:"Rubik-Medium";
}
.footerLinks .flex{
    flex-direction:column;
}
img.regulatorLogo {
    width:20%;
    height:auto;
}
.footerLinks .logos{
    flex-direction: row;
    justify-content: flex-start;
}
.footerSubLinks a{
    font-family:"Rubik";
    text-decoration:underline;
}
.footerCopyright {
    padding-top:4.2rem;
    text-align:center;
}
.geolocsfooter {
  display: flex;
  width: 100%;
  height:auto;
  justify-content: space-between;
  flex-direction:column;
  align-items:flex-start;
}
.geolocsfooterbtm {
  display: flex;
  width: 100%;
  height:auto;
  justify-content: space-between;
  margin-top:40px;
  flex-direction: column;
  align-items:flex-start;
}
.geolocsfooterbtmarrow {
  display: flex;
  width: 100%;
  height:auto;
  justify-content: center;
  margin-top:100px;
}
.geolocsright {
    margin-top:60px;
}
#shape {
    display:none;
}
@media(min-width:768px) {
    footer {
        padding:5.5rem 1.2rem;
    }
    footer .flex {
        justify-content: space-around;
    }
    .footerLinks .flex{
        flex-direction:row;
    }
    .footerCopyright {
        padding-top:8.5rem;
    }
    .geolocsfooter {
        flex-direction:row;
    }
    .geolocsfoot {
      display: flex;
      width: 100%;
      justify-content: space-between;
    }
    .geolocsfootbtm {
      display: flex;
      width: 100%;
      justify-content: space-between;
      margin-top:40px;
    }
    .geolocsfootbtmarrow {
      display: flex;
      width: 100%;
      justify-content: center;
      margin-top:100px;
    }
    .geolocsright {
        margin-left:auto;
        margin-top:0;
        align-items: flex-end!important;
    }
    .navbar-brand-geolocs{
        background: url(/c/campaign/1885/content/mkodowhite.svg);
        background-repeat: no-repeat;
        background-size: 162px;
        height: 53px;
        width: 164px;
        position: relative;
    }
    img.regulatorLogo {
        width:10%;
    }
}
/* --- footer end --- */


/* --- Contact --- */
#contactForm {
    width:100%;
    margin:auto;
    height:auto;
}
input, textarea {
    height:44px;
    width:100%;
    margin-top:8px;
    border-radius:6px;
    padding:8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
}
input::placeholder,textarea::placeholder {
    color: #555E80;
}
textarea {
    height:94px;
    resize: none;
}
#contactSub {
    margin:16px auto;
}
.contactDetails a{
    color:#242836;
}
.contactDetails, .contactDetails .flex {
    gap: 16px;
}
@media(min-width:768px) {
    #contactForm {
        width:50%;
    }
    .modal-mkodo #contactForm {
        width:70%;
    }
}
/* --- Contact End--- */

/* --- GeoLocs --- */
.navbar-brand-geolocs{
    background: url(/c/campaign/1885/content/mkodowhite.svg);
    background-repeat: no-repeat;
    background-size: 162px;
    height: 53px;
    width: 164px;
    position: relative;
}
.navbar-geolocs{
    background: url(/c/campaign/1885/content/geolocs.svg);
    background-repeat: no-repeat;
    background-size: 150px;
    height: 60px;
    width: 199px;
    position: absolute;
}
#topgeolocs img {
    width:126px;
    margin:initial;
}
#whygeolocs{
    background-color:#B7DBF3;
}
#validateplayer {
    /*background-color:#ACE8DC;*/
    background: rgb(159,216,214);
    background: linear-gradient(0deg, rgba(159,216,214,1) 0%, rgba(159,216,214,1) 50%, rgba(172,232,220,1) 50%, rgba(172,232,220,1) 100%);
}
#geoboundaries {
    /*background-color:#F8C1BA;*/
    background: rgb(227,180,183);
    background: linear-gradient(0deg, rgba(227,180,183,1) 0%, rgba(227,180,183,1) 50%, rgba(248,193,186,1) 50%, rgba(248,193,186,1) 50%);
}
#keyOne {
    /*background-color:#ACE8DC;*/
    background: rgb(159,216,214);
    background: linear-gradient(0deg, rgba(159,216,214,1) 0%, rgba(159,216,214,1) 50%, rgba(172,232,220,1) 50%, rgba(172,232,220,1) 100%);
}
#keyTwo {
    /*background-color:#F8C1BA;*/
    background: rgb(227,180,183);
    background: linear-gradient(0deg, rgba(227,180,183,1) 0%, rgba(227,180,183,1) 50%, rgba(248,193,186,1) 50%, rgba(248,193,186,1) 50%);
}
#keyThree{
    background-color:#B7DBF3;
}
#howitworks {
    background-color:#B7DBF3;
}
/*#geotestimonials {
    background-color:#DDC5E7;
}*/
#geotestimonialsOne, #geotestimonialsTwo, #geotestimonialsThree, #geolocsStats {
    background-color:#DDC5E7;
}
#contactus {
    background-color:#ACE8DC;
}
.whygeoimg { 
    margin-top:-40%;
}
#geoVideo {
  position: absolute;
  right: 0;
  bottom: 0;
  left:0;
  top:0;
  min-width: 100%;
  min-height: 100%;
  z-index:2;
}
section img {
    width:80%;
    margin:auto;
    height:auto;
}
img.clientLogo {
    width:28%;
    height:auto;
}
.testimonialImg {
    display: flex;
    gap: 24px;
    width: 160px;
    margin-right: 0px;
}
.quoteMark {
    position: absolute;
    top: 70px;
    left: -20px;
    width: 160px;
    z-index:-1;
}
.quoteName {
    font-style: italic;
    color: #fff;
    font-family: 'Rubik-Medium';
    font-size: 1.25rem;
}
blockquote {
    font-size: 1.5rem;
    font-family: 'Rubik-bold';
    color: #2944A1;
    margin:auto;
    padding:0;
}
.tile {
    background-color: #A9CCEB;
    border-radius: 20px;
    padding: 24px 32px;
    align-items: flex-start;
    gap:0;
}
.tile img {
    width: initial;
    margin: 0;
}
.tile.quote {
    background-color:rgba(41, 68, 161, 0.1);
}
.stars {
    width:60%;
    height:auto;
}
.reorder {
    order:1;
}
.pips {
    display:none;
}
.flex.copy {
    gap:16px;
} 

@media (min-width:768px) {
    #shape {
        display:block;
        height: 100vh;
        width: 100%;
        background-color: #2944A1;
        z-index: 1;
        position: relative;
        top: 0;
        clip-path: circle(50%);
        right: 30%;
        opacity: 10%;
        min-height:800px;
    }
    section {
        height: calc(100vh - 80px);
        min-height:800px;
        padding: 0;
    }
    section#topgeolocs {
        min-height:640px;
    }
    section > .container {
        height:inherit;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        padding: 2rem 1.5rem;
    }
    .pips {
        display:flex;
        position:fixed;
        top:0;
        bottom:0;
        right:48px;
        z-index:9999;
        gap:8px;
    }
    .sectionLink {
        box-sizing: border-box;
        width: 16px;
        height: 16px;
        border:3px solid #2944A1;
        border-radius: 999px;
    }
    .active {
        background-color:#fff;
        border:none;
    }
    #howitworks {
        height:initial;
        padding: 2rem 0;
    }
    #howitworks .container {
        position: relative;
    }
    section img {
        width:30%;
    }
    img.clientLogo {
        width:20%;
    }
    #topgeolocs h1 {
        width:70%;
    }
    #topgeolocs .container {
        flex-wrap:nowrap;
    }
    #geotestimonials h2{
        width:50%;
    }
    #geotestimonials .reorder{
        width:40%;
    }
    .testimonialImg {
        margin-right:inherit;
    }
    .quoteMark {
        top: 0;
        bottom: 0;
        left:0;
    }
    .quoteName {
        font-size: 1.5rem;
    }
    blockquote {
        font-size: 2rem;
    }
    .tile.quote {
        max-width: 420px;
    }
    .tile p {
        font-size:1rem;
    }
    .reorder {
        order:0;
    }
    #contactus, #keyfeatures, #keyThree, #geolocsStats {
        height: calc(50vh - 80px);
        min-height:400px;
        padding: 0;
    }
    
}


/* Media Query */

@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */
    
}