header{
    width: 100%;
}

body{
    margin: 0;
    padding: 0;
    font-size: 15px;
    background:#ffd140;
}

section {
    margin: 0 auto;
    min-width: 300px;
    max-width: 1500px;
    width: 100%;
}



/* Navigation */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
    font-family: 'Poppins', sans-serif;
}

.showsdot li  {
  list-style-type: disc; /* shows dots */
  margin-inline-start: 20px;    
}

li {
  list-style-type: none;

}

a {
  color:#ffffff;
  display: block;
  line-height: 2em;
  padding: 1em 0em;
  text-decoration: none;
  font-weight: bolder;
  font-size: 1.6rem;
}

a:link {
  text-decoration: none;
}

a:hover {
  color:#5CCE3E;
}


/* .header{
    border-bottom: 1px solid #E2E8F0;
} */

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
}

.navbar_logo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0rem;
}


.hamburger {
    display: none;
}

.bar {
    display: block;
    width: 25px;
    height: 3px;
    margin: 5px auto;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color:#103249 ;
   
}

/* button floating-----------------------------> */ 

.mobile-menu {
  position: fixed;
  width: 50px;
  height: 50px;
  top: 2.3%;
  right: 3%;
  background: #ffd140;
  border-color: #3cae8b; 
  display: inline-block;
  cursor: pointer;
  box-shadow: 0 16px 16px rgb(50 50 71 / 8%), 0 24px 32px rgb(50 50 71 / 8%);
}

.rounded-full {
  border-radius: 9999px;
}

.z-50 {
  z-index: 50;
}

.nav-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.nav-link{
    font-size: 1.6rem;
    font-weight: 400;
    color: #475569;
}

.nav-link:hover{
    color: #482ff7;
}

.nav-logo {
    font-size: 2.1rem;
    font-weight: 500;
    color: #482ff7;
    padding: 0;
}


/* end button floating-----------------------------> */ 


.download-nav {
  display: none;
}

.phone-img-small {
  display: none;
}

 .earn-your-badge-small {
  display: none;
}

.belt-img-small{
  display: none;
}

.footer-logo-img-small{
  display: none;
}

.footer-company-name-small{
  display: none;
}

.footer-card-small{
  display: none;
}

.footer-logo-img-nav{
  display: none;
}

.footer-company-name-nav{
  display: none;
}





.logo-img{
    float: left;
    position: relative;
    margin: 10px;
    width: 73px; 
    height: 60px; 
}

.bg-div{
   background:#103249;
   overflow: hidden;
   padding-left: 20px;
   padding-right: 20px;
}

.company-name{
    color: rgb(255, 254, 254);
    display: inline-block; 
    font-size: 25px;font-weight: 500;
    font-family:poppins;
    position: relative;
    margin: 20px 15px 15px 10px;
}

.footer-company-name{
    color: rgb(255, 254, 254);
    display: block; 
    font-size: 25px;font-weight: 500;
    font-family:poppins;
    position: relative;
    margin: 20px 15px 15px 0px;
}

.privacy-sub{
    font-size: 25px;
    font-weight: bolder;
    font-family:poppins;
    text-align: left;
    margin: 20px 15px 15px 100px;
}

ul.no-bullets {
    list-style-type: none;
    margin-top: 50px;
    padding: 20px 50px 10px 50px;
    line-height: 30px;
    text-align: left;
    text-decoration: none;
  }

.send-feedback {
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    transition-duration: 0.4s;
    cursor: pointer;
    border-color: #103249;
    border-radius: 50px;
    /* margin-left: 20px; */
  }
  
  .button1 {
    background-color: #103249; 
    /* color: black;  */
    border: 2px solid #103249;
  }
  
  .button1:hover {
    background-color: #103249;
    color: white;
  }

/* .send-feedback {
    background: #fff;
    border-radius: 50px;
    font-family: Objectivity;
    font-weight: 700;
    font-size: 16px;
    color: #6b83ff;
    border: 3px solid #fff;
    transition: all .2s ease-in-out;
    outline: none;

} */

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

.py-2 {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

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

.gradient-navy {
  height: 570px;
  background-color: #103249; /* For browsers that do not support gradients */
  background-image: linear-gradient(-207deg,#103249 14.28%,rgb(107, 131, 255));
}

.gradient-purple {
    height: 600px;
    background-color: #103249; /* For browsers that do not support gradients */
    background-image: linear-gradient(rgb(107, 131, 255) 53.75%, rgb(184, 195, 253) 91.98%);
  }

.gradient-green {
    height: 800px;
    background-color: #103249; /* For browsers that do not support gradients */
    background-image: linear-gradient(
        -283.99deg
        , rgb(176, 202, 136) 7.28%, rgb(112, 185, 162));
  }

.gradient-pink {
    height: 800px;
    background-color: #103249; /* For browsers that do not support gradients */
    background-image: linear-gradient(
        -283.99deg
        ,#ff7b92 7.28%,#e13894);
  }
  
  .gradient-yellow {
    height: 900px;
    background-color: #103249; /* For browsers that do not support gradients */
    background-image: linear-gradient(
        -283.99deg
        ,#F9DF7A 7.28%,#E2C15B);;
  }
  
  .gradient-yellow-green {
    background-color: #103249; /* For browsers that do not support gradients */
    background-image: linear-gradient(
        -283.99deg
        ,#F9DF7A 7.28%,#7ABEC0);
  }

  /* .gradient-height-terms {
    height: 1800px;
  }

  .gradient-height-policy {
    height: 900px;
  }

  .gradient-height-frequent {
    height: 650px;
  } */

  /* .gradient-height-about {
    height: 450px;
  } */

  hr {
    color: #D1EEEF;
  }

  .all-white {
      height: 600px ;
      background-color: #fff; /* For browsers that do not support gradients */
      /* background-image: linear-gradient(rgb(107, 131, 255) 53.75%, rgb(184, 195, 253) 91.98%); */
  }

  .all-white-height-faq {
    height: 600px;
  }

  .bg-navy-blue {
    height: 1000px;
    background-color: #103249;
    padding: 20px 0 25px 0;
    width: 100%;
    /* For browsers that do not support gradients */
    /* background-image: linear-gradient(rgb(107, 131, 255) 53.75%, rgb(184, 195, 253) 91.98%); */
  }

  .all-white-privacy{
    font-size: 20px;
    line-height: 35px;
    text-align: left;
    padding: 0px 100px 0px 100px;
  
    /* background-color: #fff; For browsers that do not support gradients */
    background-image: linear-gradient(rgb(107, 131, 255) 53.75%, rgb(184, 195, 253) 91.98%);
  }

  .grid-container1 {
    display: grid;
    grid-template-columns: auto;
  }

  .grid-container1-small {
    display: grid;
    grid-template-columns: auto;
  }
  

  .grid-container2 {
      display: grid;
      grid-template-columns: auto auto;
    }

    .grid-container3-small {
      display: grid;
      grid-template-columns: auto  auto auto;
    }

  .grid-container2-nav {
      display: grid;
      grid-template-columns: auto auto;
    }

  .grid-container3 {
      display: grid;
      grid-template-columns: auto  auto auto;
    }

  .grid-container4 {
      display: grid;
      grid-template-columns: auto auto auto auto;
    }
    
  .grid-item  {
      /* font-size: 30px; */
      text-align: center;
      font-family:poppins;
  }

  .grid-item-pad-left{
  
    padding-left: 10%;
  }

  .grid-margin-pink{
      padding: 0px 200px;
  }

.w-full {
    width: 100%;
}

.flex{
    display: flex;
}

  h2{
      padding-top: 50px;
  }

.img-position{
    float: center;
    position: relative;
    margin: 10px 15px 15px 10px;
  }

.phone-img{
    width: 420px; 
    height: 560px; 
    padding-left: 50px;
    padding-right: 100px;
    padding-top: 50px;
}

.belt-img{
    width: 650px; 
    height: 630px; 
    padding: 50px;
}

.ninja-img{
    width: 120px; 
    height: 120px; 
    padding-top: 30px;
}

.footer-logo-img{
    float: center;
    position: relative;
    width: 125px; 
    height: 105px; 
    margin: 100px 100px 0 100px ;
}

.footer-card {
    background: #ffd140;
    border-radius: 8px;
    width: 500px; 
    height: 400px; 
    margin: 40px 40px;
}

footer p.sub {
    font-size: 13px;
    /* font-size: 1.3rem; */
    line-height: 18px;
    line-height: 1.8rem;
    padding-top: 20px;
}

footer a:hover {
    color: #5CCE3E;
} 

span .year {
  font-family: poppins;
  font-style: normal;
  font-weight: bold;
}

.download{
    float: center;
    position: relative;
    margin: 12rem 70px;
    width: 200px; 
    height: 70px; 
}

.font-normal {
    font-family: poppins;
    font-style: normal;
    font-weight: 400;
}

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

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

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

.border-t {
    margin: 0 20px 0 20px;
    border-top-width: 1px;
    border: 1 solid #e2e8f0;
    padding-top: 50px;
    padding-bottom: 20px;
}

/* hr.new1 {
    
    border-top-width: 1px;
    border: 1 solid #e2e8f0;
  } */

  /* body {
    font-family: sans-serif;
    margin: 50px;
  } */
  
  .secure-your-site {
    /* animation: move 3s;
    -webkit-animation: move 3s; */
    font-size: 40px;
    line-height: 60px;
    text-align: left;
    padding-top: 50px;
    padding-left: 100px;
  }

  .tab {
    padding-left: 45px!important; 
  }

   .tab1 {
    padding-left: 45px!important; 
  }

  
  
  
  /* @keyframes move {
    0% {
      transform: scale(0, .025);
    }
    50% {
      transform: scale(1, .025);
    }
  }
               */
  /* @-webkit-keyframes move {
    from {
      margin-left: 100%;
      width: 300%; 
    }
  
    to {
      margin-left: 0%;
      width: 100%;
    }
  } */




/* 
.secure-your-site {
    font-size: 40px;
    line-height: 60px;
    text-align: left;
    padding-top: 50px;
    padding-left: 100px;
} */

.secure-your-site-pink {
    font-size: 40px;
    /* line-height: 60px; */
    text-align: center;
    padding-top: 50px;
    padding-bottom: 0px;
}

.share-thoughts {
    font-size: 40px;
    /* line-height: 60px; */
    /* text-align: center; */
    padding-top: 20px;
    padding-left: 20px;
    padding-bottom: 00px;
}

.have-thoughts{
    font-size: 15px;
    line-height: 30px;
    text-align: left;
    padding: 20px ;
}

.earn-your-badge {
    font-size: 40px;
    /* line-height: 60px; */
    text-align: left;
    padding-top: 50px;
    padding-left: 20px;
    /* margin: 20px 150px 0px 0px; */
    
}

.from-f{
    font-size: 40px;
    line-height: 60px;
    text-align: left;
    padding-left: 100px;
}

.hackers-are{
    font-size: 20px;
    line-height: 30px;
    text-align: left;
    padding: 20px 20px 20px 100px;
}

.more-sophisticated{
    font-size: 20px;
    line-height: 35px;
    text-align: center;
    padding: 40px 400px;
}

.traditionally{
    font-size: 20px;
    line-height: 35px;
    text-align: left;
    padding: 50px 100px 70px 20px;
}
/* ? */
.frequent{
    font-size: 40px;
    text-align: left;
    padding-top: 50px;
    padding-left: 20px;
    margin: 10px 0px 0px 80px;
    
}

.privacy-title{
    font-size: 40px;
    text-align: left;
    padding-top: 50px;
    padding-left: 20px;
    margin-left: 80px;
    
}

.all-you{
    font-size: 20px;
    line-height: 35px;
    text-align: left;
    padding: 0px 100px 0px 100px;
   
}

.lessons-gif{
    font-size: 15px;
    line-height: 35px;
    text-align: center;
    padding: 10px 10px 10px 10px;
}

.text-white {
    --text-opacity: 1;
    color: #fff;
    color: rgba(255,255,255,var(--text-opacity));
}

.text-navy-blue {
    --text-opacity: 1;
    color: #103249;
   
    /* color: rgba(255,255,255,var(--text-opacity)); */
}

.text-navy-blue-margin{
  margin: 3% 0 0 0;
}

.text-purple {
  color:#526DF1;
}

.accordion {
    background-color: #526DF1;
    color: #D1EEEF;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px; font-weight: bolder;
    transition: 0.4s;
    font-family: poppins;
  }
  
  .activeAccord, .accordion:hover {
    background-color: #F9DF7A;
    color: #103249;
  }
  
  .accordion:after {
    /* content: '\2304'; */
    color: #D1EEEF;
    font-weight: bold;
    float: right;
    margin-left: 5px;
    content: "";
    position: relative;
    right: 10px;
    top: calc(50% - 7px);
    font-size: 15px;
    font-weight: 200;
    /* color: #444; */
    height: 15px;
    width: 24px;
    background: url(../image/arrow-down.png) center center no-repeat;
    background-size: 50%;
  }
  
  .activeAccord:after {
    /* content: "\2303"; */
    content: "";
    /* color: #103249; */
    background: url(../image/arrow-up.png) center center no-repeat;
    background-size: 50%;
  }
  
  .panel {
    font-family: poppins;
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    color: #103249;
    transition: max-height 0.2s ease-out;
  }

 /* .accordion-margin {
     margin: 50px 100px 50px 100px;
 } */


/* accordion */
 
.accordionMenu{
    margin-left: 100px;
    margin-right: 100px;
}

.accordionMenu input[type=radio]{
    display: none;
}

.accordionMenu:hover {
    background-color: #F9DF7A;
    color: #103249;
}

.accordionMenu label{
    font-family: poppins;
    display: block;
    height: 50px;
    line-height: 47px;
    padding: 0 25px 0 10px;
    background: #526DF1;
    font-size: 18px;
    color: #fff;
    text-align: left;
    cursor: pointer;
    border-bottom: 1px solid #e6e6e6;
}

.accordionMenu label::after{
    display: block;
    /* content: ""; */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #ffffff;
    position: absolute;
    right: 10px;
    top: 20px;
    z-index: 10;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition:all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.accordionMenu .content{
    max-height: 0;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 4s ease-in-out;
    -moz-transition: all 4s ease-in-out;
    -o-transition: all 4s ease-in-out;
    transition: all 4s ease-in-out;
}
.accordionMenu .content .inner{
    font-size: 1.7rem;
    color: #103249;
    line-height: 1.5;
    background: #F9DF7A;
    padding: 20px 10px;
    font-family: poppins;
    text-align: left;
}
.accordionMenu input[type=radio]:checked + label:after{
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}
 
.accordionMenu input[type=radio]:checked + label + .content{
    max-height: 2000px;
    height: auto;
}


/* * {
    box-sizing: border-box;
  } */
  
  .row::after {
    content: "";
    clear: both;
    display: table;
  }
  
  [class*="col-"] {
    float: left;
    padding: 15px;
  }
  
  html {
    font-family: "Poppins", Arial, sans-serif;
  }


  #axis:before .move-up {
    transform: translate(0,-350px);
    -webkit-transform: translate(0,-350px);
    -o-transform: translate(0,-350px); 
    -moz-transform: translate(0,-350px);
}

.object {
    position: inherit;
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out; /** Chrome & Safari **/
    -moz-transition: all 2s ease-in-out; /** Firefox **/
    -o-transition: all 2s ease-in-out; /** Opera **/
}