html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .header_part
  {

      background-image: url("/assets/images/new.jpg");
      background-repeat: no-repeat;
      background-size: 100% 93%;


      padding-bottom: 420px;

      margin-top: -2px;

  }

  .whatdopart
  {
    margin-top: 99px;
    margin-bottom: 177px;
  }
  .button_inheader
  {
    margin-top: 70px;
  }
  .part_howwork
  {
    background-image: url("/assets/images/background_howitswork.svg");
    background-repeat: no-repeat;
    background-size: cover;

  }
  .auth_header .menu{
    color:#213555 !important;
  }
  .auth_header .En{
    color:#213555 !important;
  }
  .logo{
      margin-top : 15px;
  }
  .auth-btn{
    width: 200px;
    background-color: rgb(255, 255, 255);
    display: inline-flex;
    align-items: center;
    color: rgba(0, 0, 0, 0.54);
    box-shadow: rgba(0, 0, 0, 0.24) 0px 2px 2px 0px, rgba(0, 0, 0, 0.24) 0px 0px 1px 0px;
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 500;
    font-family: Roboto, sans-serif;
    font-weight: 500;
    margin-right: 10px;
    padding: 10px;
    border-radius: 36px;
    margin-bottom: 30px;
  }
  .auth-btn img{
    width: 25px;
    height: 25px;
    margin-right: 10px;
  }
  .auth-btn:hover {
    color: #000;
    background-color:#fff;
    border-color: #fff;
}
.first-hr{
  width: 49%;
  color: rgb(124, 124, 124);
}
.second-hr{
  width: 49%;
  color: rgb(124, 124, 124);
}
.login-or{
  display: flex;
  align-items: top;
  margin: 10px 0;
}
.login-or p{
  margin: 0px 10px;
}
.auth_header #header_big_screen{
  margin-bottom: 30px;
}

.sign-header .login-welcome{
  color: #464646;
  font-size: 40px;
  font-style: normal;
  letter-spacing: 0;
  align-content: center;
}
.sign-header .login-p{
  opacity: 1;
  color: rgba(70, 70, 70, .8);
  font-family: Quicksand-Regular;
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0;
}
.sign-block{
  padding-right: 32%!important;
}
.login-img{
  width: 403px;
  height: 388.6px;
  margin-top: -.5rem;
}

.sign-block{
  padding: 0 20px;
}
.login-form input[type=password], .login-form input[type=text], .login-form input[type=email]{
  background-color: initial;
  border: 1px solid #ebebeb;
  color: #000;

}
input[type=radio]{
  accent-color: #5fb099;
}
.login-form .form-control:focus {
  border: 1px solid #77dcbf !important;
  box-shadow: none !important;
}
.form-control:focus {

  border: 1px solid #77dcbf !important;
  border-color: #77dcbf;

}
.login-form .form-check{

  margin: 20px 0;
}
.login-form .form-group{

  margin-bottom: 30px;
}
#canv1,#canv2{
  height: 40px;
  width: 40px;
  object-fit: contain;
  margin-top: 10px;
}
.login-block{
  margin-bottom: 100px;
}
.img-container {
  position: relative;
}
.img-container .profile-img{
  position: absolute;
  bottom: 6px;
  width: 90px;
  height: 90px;
  left: calc(50% - 50px);
  border-radius: 50%;
  border: 6px solid #fff;
  background-color: rgb(33, 53, 85);
}
.login-form .form-check a{
  float: right;
  color: #000;
  text-decoration: none;
}
@media (max-width: 768px) {
  .login-img {
      display: none;
  }
  .sign-block {
    padding-left: 10px!important;
    padding-right: 10px!important;
}
}
.card-img-top {

    height: 200px;
    object-fit: cover;
}
.center_arrow_box {
    margin-top: 0px!important;
}
#news-page{
    margin: 0;
}
.news-blocks{
    margin-bottom: 70px;
}
.user-description  {
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  .user-description h4{
    color: #77dcbf;
    font-size: 2rem;

  }
  .custom_col_news{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    margin: 10px;
  }
  .custom_col_news .news-text{
    padding-bottom: 25px;
  }
  .custom_col_news .news-text .category-name{

    font-size: 15px;
    margin: 5px 0;
  }
  .desc_card a{
    text-decoration: none;
    color: #000;
  }
  .desc_card a:hover{
    text-decoration: none;
    color: #000;
  }
  .custom_col_news a{
    text-decoration: none;
    color: #000;
  }
  .custom_col_news a:hover{
    text-decoration: none;
    color: #000;
  }
  .custom_col_news:hover {
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
  }
  .user-description:hover {
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
  }
#testimonial {
    background-image: url(/assets/images/back.jpg);
    background-repeat: no-repeat;
    padding-bottom: 100PX;
    margin-top: -2px;
    background-size: 50% 93%;
    background-position: right 10px top 10px;
}
.btn-tall:hover, .btn-tall:focus {
    color: #fff !important;
    background-color: #92e3cc !important;
}

a {
    color: rgb(13 42 102);}
.news-img{
    max-height: 500px;
    width: 100%;
}
.read-more{
    color:#77dcbf!important;
}
.header-container{

    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('/images/hero-bg.jpg') ;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 400px;
    width: 100%;
    position: relative;
    background-position: center center;
    display:flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 25px;
}
.table-footer p{
    font-size: 17px;
    color: #bdb3b3;
    text-transform: capitalize;
    border: 1px solid #eee;
    display: inline-flex
;
}
#aboutus{
    margin-bottom: 70px;
}
.breadcrumb{
    display: flex;
    color: #fff;
    list-style-type: none;
    font-size: 18px;
}
.breadcrumb li{
    margin-right: 5px;
    margin-left: 5px;
}
.breadcrumb li a{
    color: #fff;
    text-decoration: none;
}
.breadcrumb li a:hover{
    color: #fff;
}
.Rectangle_Card {

    height: auto!important;}
.btn-tall {
  width: 100%;
  background-color: #213555!important;
  color: #fff;
  border-radius: 24px;
  box-shadow: 0 2px 12px rgba(1, 37, 43, .3);
}
.sign-up-block{
  text-align: center;
}
.auth_header .menu_active{

  text-decoration: underline;
  padding-bottom: 3px;
  text-underline-offset: 1rem;
}
.sign-header{
  margin-top: 40px;
  text-align: center;
}
.sign-button{
  text-align: center;
}
#multiStepForm .step {
  display: none;
}
#multiStepForm    .step.active {
  display: block;
}

#multiStepForm h2 {
  margin-top: 0;
}

#multiStepForm label {
  /* display: inline; */
  margin: 10px 0 5px;
}


#multiStepForm .custom-radio-btn,#multiStepForm .custom-radio-btn2 {

    cursor: pointer;
    padding: 0.5rem;
    position: relative;

}
#multiStepForm .gender-content .custom-radio-btn{
  margin: 4px;
}
.intl-tel-input,
.iti{
  width: 100%;
}

#multiStepForm .custom-radio-btn {
  border: 2px solid #e1e1e1;
  border-radius: 8px;
}
#multiStepForm .button-container .next{
  background-color: #0d2a66;
  color: #fff;
  padding: 10px 30px;
  border-radius: 24px;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  -ms-border-radius: 24px;
  -o-border-radius: 24px;
}
#multiStepForm .button-container .prev{
  background-color: #0d2a66;
  color: #fff;
  padding: 10px 30px;
  border-radius: 24px;
}
#multiStepForm .button-container .submit{
  background-color: #0d2a66;
  color: #fff;
  padding: 10px 30px;
  border-radius: 24px;
}
#multiStepForm .form-check {

  display: flex;
  align-items: center;
}
#multiStepForm .form-check label{
  margin-left: 14px;
  line-height: 2;
}

.form-check-input:checked {
  background-color: #5fb099;
  border-color: #5fb099;
}
#multiStepForm .button-container {
  overflow: auto;
  margin-top: 20px;
  text-align: center;
}

/* #multiStepForm .button-container button {
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  margin-left: 10px;
}

#multiStepForm button.prev {
  background-color: #f1f1f1;
  float: left;
  margin-left: 62%;
}

#multiStepForm button.next {
  background-color: #4CAF50;
  color: white;
  float: right;
} */

#multiStepForm button[type="submit"] {
  background-color: #4CAF50;
  color: white;
  float: right;
}
  .language_part{
      float: right;margin-right: 11px;margin-top: 15px;

  }
  .form-box {
    /* max-width: 500px; */
    margin: auto;
    padding: 20px 50px;
    background: #ffffff;
    border: 10px solid #f2f2f2;
  }
  #checkout_form label{
      text-align: left
  }
  .form-box h1{
      margin-bottom: 30px;
  }
  #checkout_form .form-group {
    margin-bottom: 30px;
  }
  .header-container-nav{
    margin-left: 80px;
  }
  .tomargineall_right_left
  {
      margin-left: 80px;
      margin-right: 70px;

  }

  .tomargineall_right_left_header
  {
      margin-left: 80px;
      margin-right: 80px;

  }

  .margin_left_whatwedopart
  {
    margin-left: 80px;
    margin-right: 70px;
  }

  .menu_active {
    width: 48px;
    height: 23px;
    /* margin: 0 1px 19px 0; */
    /* font-family: Poppins; */
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #77dcbf;
    text-decoration: none;
    margin-right: 44px!important;

  }

  .menu {
      width: 72px;
      height: 23px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
      text-decoration: none;
      margin-right: 44px;


    }


  .menu:hover {
    color: #77dcbf;

  }


    .What-We-Do-In-Life-E {
      width: 574px;
      height: 140px;
      margin: 0 0 40px;
      font-family: Quicksand;
      font-size: 56px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }
#web_how_its_how{
    font-size: 30px;
}
    .Lorem-ipsum-dolor-si {
      width: 75%;
      height: 69px;
      margin: 40px 69px 31px 0;
      font-family: unset;
      font-size: 20px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .BG {
      width: 205px;
      height: 64px;

      padding: 21px 32px 21px 32px;
      border-radius: 32.5px;
      box-shadow: 0 32px 54px 0 rgba(3, 3, 3, 0.14);
      background-color: #77dcbf;
    }


    .hover_effect_white :hover{

      color: #fff;
    }

    .hover_effect_black :hover{

      color: #000;
    }

    .Register-Now {
      width: 105px;
      height: 23px;
      margin: 0 0px 0 0;
      font-family: Poppins;
      font-size: 16px;
      font-weight: 500;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #1d2d29;
    }



    .send_message_text{
      width: 105px;
      height: 23px;
      margin: 0 0px 0 0;
      font-family: Poppins;
      font-size: 15px;
      font-weight: 600;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #1d2d29;
    }



  img.Langauge-icon {
    width: 24px;
    height: 24px;
    margin: 0 4px 2px 0;
    object-fit: contain;
  }

  .En {
      width: 19px;
      height: 23px;
      margin: 1px 4px 2px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
  }

  .En:hover {

    color: #77dcbf;
  }

  img.Group-4 {
  width: 24px;
  height: 24px;
  margin: 2px 0 0 4px;
  object-fit: contain;
  }

  .Line {
      width: 1px;
      height: 24px;
      margin: 0 16px 2px;
      border: solid 1px #fff;
    }

    img.Profile-icon {
      width: 24px;
      height: 24px;
      margin: 0 4px 1px 1px;
      object-fit: contain;
    }

    .Login {
      width: 43px;
      height: 23px;
      margin: 1px 0 2px 4px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .Login:hover {

      color: #77dcbf;
    }


  /* part two in home page */

  .We-Unlock-Potential {
  width: 493px;
  height: 140px;
  margin: 0 12px 24px 4px;
  /* font-family: Quicksand; */
  font-size: 35px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #464646;
  }


  .home_page_part2_desc {
      width: 505px;
      height: 299px;
      margin: 24px 0 30px 4px;
      /* font-family: Poppins; */
      font-size: 20px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }


    .football-player-playing-field {
      width: 290px;
      height: 561px;
      margin: 0 16px 0 105px;

    }

    img.Rectangle {
      width: 290px;
      height: 437px;
      margin: 0 0 124px 16px;

      border-radius: 18px;
    }


    /* home page part 3 with cards */
    .home_page_part3{
      background-image: url("/assets/images/home_page_part3.png");
      background-repeat: no-repeat;
      background-size: cover;

    }
    .error {
        color: red;
        text-align: left;
    }
    .content-wrapper {
    margin-top: 32px;
}

    .Who-is-TripleF-for {
      width: 405px;
      height: 60px;

      font-family: Quicksand;
      font-size: 48px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }




  .Rectangle_Card {
    width: 289px;
    height: 395px;
    margin: 53px 0px 0 0;
    padding: 32px 25px 28px 26px;
    border-radius: 12px;
    box-shadow: 0 2px 24px 0 rgba(70, 70, 70, 0.12);
    background-color: #fff;
  }

  .oval_circle {
      width: 80px;
      height: 80px;
      margin: 0 79px 12px;
      padding: 16px;
      border-radius: 90px;
      background-color: rgba(228, 248, 242, 0.7);
    }

  img.football {
      width: 48px;
      height: 48px;
      object-fit: contain;
  }

  .title_card {
      width: 84px;
      height: 30px;
      margin: 12px 77px 16px;
      font-family: Quicksand;
      font-size: 24px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }

    .desc_card {
      width: 238px;
      height: 89px;
      margin: 16px 0 45px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      text-align: center;
      color: rgba(70, 70, 70, 0.8);

    }

    .Read-More {
      width: 86px;
      height: 23px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #1a2a44;
    }

    .howitswork_topmargin
    {
      padding-top: 50px;
      padding-bottom: 10px;

    }
    .Shape {
      width: 163.5px;
      height: 163.5px;
      margin: 0 0.5px 527px 1202px;
      background-color: #cefbee;
    }

    .Rectangle-197 {
      width: 500px;
      /* height: 148px; */
      margin: 0 1px 30px 50px;
      padding: 31px 31px 30px 24px;
      border-radius: 10px;
      box-shadow: 0 4px 40px 0 rgba(255, 255, 255, 0.08);
      background-color: #fff;
      place-items: center;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      -ms-border-radius: 10px;
      -o-border-radius: 10px;
}

    .How-its-Work {
      width: 305px;
      height: 60px;
      margin: 0 200px 20px 0;
      font-family: Quicksand;
      font-size: 75px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .How-its-Work_desc {
      width: 505px;
      height: 230px;
      margin: 20px 0 0;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .Ellipse-35 {
      width: 24px;
      height: 24px;
      margin: -15px 33px -16px -4px;
      opacity: 0.31;
      background-color: #84f4d4;
      border-radius : 90px;
      margin-top: 4px
    }

    .number_how_its_work {
      width: 40px;
      height: 24px;
      margin: 12px 0 0 8px;
      font-family: Poppins;
      font-size: 40px;
      font-weight: 500;
      font-stretch: normal;
      font-style: normal;
      line-height: 0.6;
      letter-spacing: normal;
      color: #356255;
    }

    .Step-One {
      /* width: 137px; */
      /* height: 30px; */
      margin: 5px 33px 9px 7px;
      font-family: Quicksand;
      font-size: 24px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
      text-align: left;
    }

    .howitswork_step_desc {
      /* width: 310px;
      height: 47px; */
      margin: 4px 0 0 7px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: rgba(70, 70, 70, 0.8);
      text-align: left;
    }

    .middle_card_right{
      margin-right: 86px;
    }

    .What-people-are-sayi {
      width: 550px;
      height: 60px;
      margin: 0 0 47px 0px;
      font-family: Quicksand;
      font-size: 48px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;

    }

  .margin_left
  {
    margin-left: 80px;

  }

  .margin_left_sendmessage_part
  {
    margin-left: 80px;
    margin-top: 50px;

  }

  #news{
    margin-bottom: 100px;
    }
  .margin_left_part_what_people_say_part
  {
    margin-left: 80px;

  }
  .margin_left_news_cards
  {
  margin-top: 80px;

    margin-left: 80px;
  }
.testidev{
    width: 70%!important;
}
    .Leading-an-organizat {
      /* width: 449px;
      height: 115px; */
      /* margin: 0 0 32px; */
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
      margin-top: 15px;
      margin-bottom: 20px;
    }

    .--Mila-McSabbu {
      /* width: 126px;
      height: 23px; */
      margin: 0 28px 8px 0;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }

    .Freelance-Designer {

      margin: 8px 0 0;
      opacity: 0.7;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }

    .Rectangle_right_left_button {
      width: 40px;
      height: 40px;
      margin: 0 20px 0px 0;
      padding: 12px 11px 13px 11.9px;
      transform: rotate(-180deg);
      border-radius: 5px;
      background-color: #213555;
      margin-top: 5px;
    }

    .rectangle_left
    {
      transform: rotate(180deg);
      -webkit-transform: rotate(180deg);
      -moz-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
      -o-transform: rotate(180deg);
      }
    #contactus{
    margin-bottom: 85px;
    }
    .center_arrow_box{
      margin-top: -10px;
    }

    img.Group-350 {
      width: 70px;
      height: 70px;
      margin: 51px 28px 9px 86px;
      object-fit: contain;
    }

    img.Group-349 {
      width: 130px;
      height: 130px;
      margin: 0 0 0 240px;
      object-fit: contain;
    }

    img.Group-346 {
      width: 230px;
      height: 230px;
      margin: 9px 42px 67px 28px;
      object-fit: contain;
    }
    #contact_form .error{
        color: #fff;
    }

    .Rectangle_become_client_part {
      width: 60%;
      /* height: 679px; */
      border-radius: 30px 0px 0px 30px;
      background-color: #213555;

    }




    .boy-standing-with-ball-football-field-ready-start-play-new-game {
      width: 100%;
      /* height: 765px; */
      margin-left: -11%;
      margin-top : 50px;
      object-fit: contain;
    }

    .Become-a-client-Do-y {
      width: 100%;
      /* height: 113px; */
      margin: 53px 34px 17px 0;
      font-family: Quicksand;
      font-size: 48px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .name_email {
      width: 89px;
      height: 23px;

      margin-top: 17px;
      font-family: Poppins;
      font-size: 16px;
      font-weight: normal;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #fff;
    }

    .Rectangle_input_field {
      width: 100%;
      height: 55px;
      margin: 4px 0 0;
      border-radius: 8px;
      border: solid 1px rgba(255, 255, 255, 0.4);
      background-color: rgba(26, 42, 68, 0.8);
    }

    .Rectangle_input_message {
      width: 544px;
      height: 147px;
      margin: 4px 0 10px;
      border-radius: 8px;
      border: solid 1px rgba(255, 255, 255, 0.4);
      background-color: rgba(26, 42, 68, 0.8);
    }
    #contact_form .btn-tall{
        width:150px;
        color: #fff !important;
        background-color: #92e3cc !important;
    }
    #contact_form .btn-tall:hover{
        color: #fff !important;
        background-color: #7cc0ad !important;
    }
    .margin_left_become_client{
      margin-left: 50px;
      margin-right: 50px;
    }

    .send_message_button {
      width: 166px;
      height: 48px;
      float: right;
      margin-right: 50px;
      padding: 13px 24px 12px;
      border-radius: 24px;
      box-shadow: 0 2px 12px 0 rgba(1, 37, 43, 0.3);
      background-color: #77dcbf;
    }

    .Our-Latest-News {
      width: 479px;
      height: 60px;

      font-family: Quicksand;
      font-size: 48px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: normal;
      letter-spacing: normal;
      color: #464646;
    }
    main header {
        padding: 30px 0;
      }
      main header h1 {
        font-size: 2.5em;
        font-weight: 700;
      }
     main header p {
        font-size: 1.1em;
      }
main{
    overflow-x: hidden;
    color: #555;
    text-align: center;
}
      main {
        padding: 30px 0;
      }
      main .row > div {
        /* padding: 0; */
      }
      main .row > div.pro .table {
        border: 3px solid #fff;
        border-bottom: none;
      }
      .no-data{
        margin: 0 0 20px 0;
        font-size: 20px;
        color: #bdb3b3;
      }
      main .table {
        background: #fff;
        padding: 0 5px;
        overflow: hidden;
        position: relative;
        border: 1px solid #eee;
      }
      .package-content ul li{
        list-style-type: none;
      }
      .package-content p{
        padding-bottom: 4px;
        font-size: 1.1em;
        color: #666;
        margin-bottom: 0;
      }
      .title-section{
        margin: 0 0 35px 0;
        font-size: 40px;
        color: #46beb3;
      }
      main .table .ribbon {
        background: #46beb3;
        color: #fff;
        font-weight: 600;
        font-size: 0.9em;
        display: inline-block;
        padding: 66px 40px 10px;
        transform: rotate(-45deg);
        position: absolute;
        top: -29px;
        left: -60px;
      }
      main .table .table-header {
        padding: 20px 0;
      }
      main .table .table-header::after {
        content: "";
        width: 100%;
        height: 1px;
        background: #eee;
        display: block;
        margin-top: 20px;
      }
      main .table .table-header h2 {
        font-size: 2.2em;
        font-weight: 600;
        color: #46beb3;
        text-transform: capitalize;
      }
      main .table .table-header h3 {
        font-size: 2.5em;
        font-weight: 700;
      }
      main .table .table-header h3 small {
        font-size: 0.4em;
        text-transform: lowercase;
      }
      main .table .table-header h3 sup {
        font-size: 0.5em;
        font-weight: 400;
        display: inline-block;
        transform: translateY(-10px);
        background-color: unset;
      }
      main .table .table-body ul li {
        padding: 8px 0;
        font-size: 1.1em;
        color: #666;
      }
      main .table a.signup {
        padding: 10px 40px;
        color: #fff;
        background: #46beb3;
        border: 1px solid #46beb3;
        font-weight: 1.5em;
        font-weight: 600;
        text-transform: uppercase;
        margin: 20px 0;
        border-bottom: 3px solid #369b91;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
      }
      main .table a.signup:hover {
        transform: translateY(3px);
        border-bottom: 3px solid transparent;
      }

      @media screen and (min-width: 991px) {
        .row > div.pro {
          transform: translateY(-33px);
          z-index: 90;
        }
        .row > div.pro a.signup {
          margin-top: 50px;
        }
        .row > div.pro .table {
          box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1), -2px 0 4px rgba(0, 0, 0, 0.1);
        }

      }
      @media screen and (max-width: 991px) {
        main .row > div {
          padding: 0 40px;
        }
      }


  .Rectangle_news {
    width: 83%;
    height: 347px;
    margin: 0 0 12px;
    border-radius: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

  .category-name {
    /* width: 133px;
    height: 23px; */
    margin: 12px 258px 0 0;
    opacity: 0.6;
    font-family: Poppins;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #464646;
  }

  img.Single-1-point-Right {
    width: 40.5px;
    height: 18px;

    object-fit: contain;
  }

  .View-More {
    width: 83px;
    height: 23px;
    margin: 0 8px 0 0;
    font-family: Poppins;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #213555;
  }

  img.Group-6 {
    width: 156px;
    height: 65px;
    margin: 50px 107px 22px 0;
    object-fit: contain;
    display: block;
  }

  .desc_footer{
    width: 238px;
    height: 115px;
    margin: 0 968px 18px 0;
    font-family: Poppins;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #464646;
  }

  img.Group-20 {
    width: 29px;
    height: 29px;
    margin: 18px 8px 61px 0;
    object-fit: contain;
  }

  .Useful-Links {
    width: 163px;
    height: 25px;
    margin: 0 12px 13px 0;
    font-family: Poppins;
    font-size: 18px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #464646;
  }



  .About-Us-How-it-work {
    width: 119px;
    height: 191px;
    margin: 13px 0 0;
    font-family: Poppins;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 3;
    letter-spacing: normal;
    color: #464646;
  }

  .foot_style{
    background-image: url("/assets/images/bacground_footer.png");
    background-repeat: no-repeat;
    background-size: cover;
  }

  .footer_col{
    margin-top: 50px;
  }

  .Line-11 {
    width: 1206px;
    height: 2px;
    margin: 0 0 38px;
    opacity: 0.15;
    border: solid 1px #000b33;
  }

  .row{

  }

  .Dopamine-All {
    width: 293px;
    height: 26px;

    opacity: 0.72;
    font-family: Quicksand;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.63;
    letter-spacing: normal;
    text-align: center;
    color: #464646;
  }

  .href_remove_line{
    text-decoration: none;
  }
  .toggle-password {
    float: right;
    cursor: pointer;
    margin-right: 10px;
    margin-top: -31px;
}
  .footer_links
  {
    color: #464646;
  }
  .footer_links:hover
  {
    color: #77dcbf;
    text-decoration: underline;
  }
  .footer_img_social:hover
  {
    opacity: 60%;

  }

  .Rectangle_box_latest_news {
    width: 185px;
    height: 30px;

    padding: 4px 16px 3px;
    border-radius: 4px;
    background-color: #213555;
  }

  .datetime_news_box {
    width: 153px;
    height: 23px;
    font-family: Poppins;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #fff;
  }

  .margin_arrows{
    margin-left: 1px;
  }

  .what_people_say_part{
    background-color: #fafafa;
  }


  /* Circle */
  .hover15  {
      position: relative;
  }
  .hover15 :before {
      position: absolute;
      top: 50%;
      left: 50%;
      z-index: 2;
      display: block;
      content: '';
      width: 0;
      height: 0;
      background: rgba(255,255,255,.2);
      border-radius: 100%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      opacity: 0;
  }
  .hover15 :hover::before {
      -webkit-animation: circle .75s;
      animation: circle .75s;
  }
  @-webkit-keyframes circle {
      0% {
          opacity: 1;
      }
      40% {
          opacity: 1;
      }
      100% {
          width: 200%;
          height: 200%;
          opacity: 0;
      }
  }
  @keyframes circle {
      0% {
          opacity: 1;
      }
      40% {
          opacity: 1;
      }
      100% {
          width: 200%;
          height: 200%;
          opacity: 0;
      }
  }


  .witecolor {
    color : #fff
  }

  .logo_small_screen
  {
    width: 86px;
    height: 36px;
    margin: 10px;
    margin-left: 77px;
    object-fit: contain;
  }

  .logo_mobile_screen
  {
    width: 79px;
    height: 35px;
    margin: 10px;
    margin-left: 27px;
    object-fit: contain;
  }


  .menu_button_small_screen
  {
    width: 18px;
    height: 14px;
    margin: 10px;
    margin-right: 77px;
    margin-top: 19px;
    object-fit: contain;
    float: right;
  }

  .menu_button_mobile_screen
  {
    width: 18px;
    height: 14px;
    margin: 10px;
    margin-right: 27px;
    margin-top: 19px;
    object-fit: contain;
    float: right;
  }

  .menu_small:hover{
    color: #77dcbf;
  }

  .view_more_href
  {
    float: right;margin-right: 163px;
    margin-top: 15px;
    text-decoration: none;
  }

  .number_part
  {
    /* width: 19%; */
  }

  .row {
    position: relative;
  }
  .corner-image {
    position: absolute;
    top: 0;
    right: 0;
    width: 150px; /* Adjust the size as needed */
    height: 150px; /* Adjust the size as needed */
  }
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    background-color: #213555;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
  }

  .sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #fff;
    display: block;
    transition: 0.3s;
  }

  .sidenav a:hover {
      color: #77dcbf;
  }

  .sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
  }




  @media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
  }





          #whatwedo_desc_mobile
          {
          display: none;
          }

          #whatwedo_desc_web
          {
          display: block;
          }

          #header_big_screen {
              display: block;
          }

          #small_screen_header {
              display: none;
          }

          #small_mobile_header
          {
              display: none;
          }

          .whatwedo_desc
          {
              display: block;
          }


          #images_potential_mobile
         {
          display: none;
         }




         @media only screen and (min-width: 1000px) {
          .margin_left_whotr
          {
              margin-left : 1px;
          }

         }
      /* When the screen width is small */
      @media only screen and (max-width: 1070px) {

          #header_big_screen {
              display: none;
          }

          /* Show the header_small_screen div */
          #small_screen_header {
              display: block;
          }

          #small_mobile_header
          {
              display: none;
          }

          .middle_card_right
          {
              margin-right: 0px;
          }
      }

      #mobile_peoples
      {
          display: none;
      }
      #mobile_how_its_how
      {
          display: none;
      }
      #web_how_its_how
      {
          display: block;
      }

         /* When the screen width is small */
         @media only screen and (max-width: 800px)
         {

         #header_big_screen {
             display: none;
         }

         /* Show the header_small_screen div */
         #small_screen_header {
             display: none;
         }

         #small_mobile_header
         {
            display: flex;
            justify-content: space-between;
         }
         .sidenav a {

            font-size: 18px;
        }
         #images_potential_mobile
         {
          display: block;
         }


         #whatwedo_desc_mobile
          {
          display: block;
          color: #fff;
          }

          #whatwedo_desc_web
          {
          display: none;
          }

          #mobile_peoples
      {
          display: block;
      }





      #mobile_how_its_how
      {
          display: block;
      }
      #web_how_its_how
      {
          display: none;
      }





     }





      /* When the screen width is small */
      @media only screen and (max-width: 1700px) {

          .football-player-playing-field {
              width: 258px;

              margin: 0 16px 0 67px;
          }

          img.Rectangle {
              width: 258px;

          }


      }


      /* When the screen width is small */
      @media only screen and (max-width: 1450px) {

          .football-player-playing-field {
              width: 245px;

              margin: 0 16px 0 35px;
          }

          img.Rectangle {
              width: 245px;

          }


      }

       /* When the screen width is small */
       @media only screen and (max-width: 1250px) {

          .football-player-playing-field {
              width: 235px;

              margin: 0 16px 0 11px;
          }

          img.Rectangle {
              width: 235px;

          }


      }


      .custom_col_footer {
             width: 25%;


         }
         .custom_col_footer_center
         {
          width: 67%;
          margin: auto;
         }


       /* When the screen width is small */
       @media only screen and (max-width: 1100px) {

         .football-player-playing-field {
             width: 211px;

             margin: 0 16px 0 7px;
         }

         img.Rectangle {
             width: 211px;

         }


     }


        /* When the screen width is small */
        @media only screen and (max-width: 1019px)
        {

         .custom_col_footer {
             width: 100%;



         }
         .custom_col_footer_center
         {
          width: 100%;
          margin: auto;
         }





     }



        /* When the screen width is small */
        @media only screen and (max-width: 1000px) {

        .whatdopart
        {
          margin-top: 55px;
          margin-bottom: 165px;
        }


     }

        /* When the screen width is small */
        @media only screen and (max-width: 990px) {

          .football-player-playing-field {
              display: none;

          }

          img.Rectangle {
              display: none;


          }


      }


        /* When the screen width is small */
        @media only screen and (max-width: 990px) {

          .margin_left_part_what_people_say_part
          {
              margin-left: 0px;
          }

          .Rectangle_become_client_part
          {
              height: 870px;
          }


      }


          @media only screen and (max-width: 850px) {




      }



      .custom_col_steps_part
      {
          width: 50%;
      }

      .custom-col-sm-width
      {
          width: 25%;
      }









      @media only screen and (max-width: 1800px) {
          .boy-standing-with-ball-football-field-ready-start-play-new-game

          {
              margin-left: -8% ;
          }

          .view_more_href
          {
              margin-right: 90px;

          }

          .Rectangle_news
          {
              width: 93%;
          }

          .header_part
          {

              padding-bottom: 320px;

          }


      }


      @media only screen and (max-width: 1700px) {


          .Rectangle_news
          {
              width: 99%;
          }


          .header_part
          {

              padding-bottom: 260px;

          }


      }

      @media only screen and (max-width: 1666px) {
          .boy-standing-with-ball-football-field-ready-start-play-new-game

          {
              margin-left: -7% ;
              width: 104%;
          }

          .header_part
          {

              padding-bottom: 270px;

          }


      }

      @media only screen and (max-width: 1600px) {


          .header_part
          {

              padding-bottom: 200px;

          }


      }

      @media only screen and (max-width: 1565px) {
          .boy-standing-with-ball-football-field-ready-start-play-new-game

          {
              margin-left: -7% ;
              width: 110%;
          }



      }

      @media only screen and (max-width: 1500px) {
          .Rectangle_become_client_part

          {

              width: 57%;
          }

          .boy-standing-with-ball-football-field-ready-start-play-new-game

          {
              margin-left: -8% ;
              width: 118%;
          }

          .header_part
          {

              padding-bottom: 160px;

          }


      }


      .custom_col_news
      {
          width: 31%;
      }


      @media only screen and (max-width: 1400px) {
          .Rectangle_become_client_part

          {

              width: 53%;
          }

          .boy-standing-with-ball-football-field-ready-start-play-new-game

          {
              margin-left: -8% ;
              width: 126%;
          }

          .custom_col_news
          {
              width: 50%;
          }

          .Rectangle_news
          {
              width: 77%;
          }

          .news_3th
          {
              display: none;
          }


          .header_part
          {

              padding-bottom: 77px;

          }



      }

      @media only screen and (max-width: 1350px) {
          .custom-col-sm-width
          {
              width: 50%;
          }



      }

      @media only screen and (max-width: 1300px) {
          .Rectangle_become_client_part

          {

              width: 85%;
              border-radius: 30px 30px 30px 30px;
          }
          .boy-standing-with-ball-football-field-ready-start-play-new-game
          {
              display: none;
          }




      }

      @media only screen and (max-width: 1200px) {
          .Rectangle_news
          {
              width: 81%;
          }

          .Rectangle_Card {

              height: 410px;
          }

          .whatdopart
          {
          margin-top: 55px;
          margin-bottom: 177px;

          }

          .header_part {
              padding-bottom: 22px;
          }




      }




      @media only screen and (max-width: 1100px) {
          .custom_col_news
          {
              width: 100%;
              margin: 10px;

          }

          .margin_left_news_cards
          {
              margin-left: 1px;
          }
          .custom_col_news_center{
              width: 73%;
              margin: auto;
          }
          .Rectangle_news
          {
              width: 100%;
          }

          .Rectangle_news
          {
              width: 91%;
          }


          .whatdopart
          {

          margin-bottom: 166px;

          }

          .header_part {
              padding-bottom: 22px;
          }


      }


      @media only screen and (max-width: 1060px) {

          .order1
{
order: 1;
}
.order2
{
order: 2;
}



          .custom_col_steps_part
          {
              width: 100%;

          }
          .res_center_small_screen
          {
              margin: auto;
              width: 400px;
          }
          .res_center_small_screen73
          {
              margin: auto;
              width: 73%;
          }
          #peoples_img{
              display: none;
          }


          .whatdopart
          {

          margin-bottom: 165px;

          }

          .header_part {
              padding-bottom: 93px;
          }



      }


      @media only screen and (max-width: 999px) {

          .whatdopart
          {

          margin-bottom: 133px;

          }

          .header_part {
              background-size: 100% auto;
          }



      }

      @media only screen and (max-width: 920px) {

          .whatdopart
          {

          margin-bottom: 111px;

          }





      }


      @media only screen and (max-width: 900px) {

          .whatdopart
          {

          margin-bottom: 77px;

          }





      }

      @media only screen and (max-width: 850px) {

          .whatdopart
          {

          margin-top: 33px;

          }





      }

      @media only screen and (max-width: 800px)
      {

          .whatdopart
          {

          margin-top: 22px;
          margin-bottom: 77px;

          }

          .button_inheader
          {
          margin-top: 17px;
          }

          .What-We-Do-In-Life-E {
              font-size: 41px;
          }

          .header_part {


          }

          .margin_left_whatwedopart
          {
              margin-left: 27px;
              margin-right: 27px;
          }


          .tomargineall_right_left
          {
              margin-right: 27px;
              margin-left: 27px;
          }

          .We-Unlock-Potential
          {
              font-size: 24px;
          }

          .BG {


             width: 156px;
             height: 42px;
             margin: 18px 18px 0 0px;
             padding: 11px 16px 11px 17px;
             border-radius: 32.5px;

         }


         .res_center_small_screen
         {
             margin: auto;
             width: 95%;
             margin-left: 27px;
             margin-right: 27px;
         }
         .How-its-Work
         {
          font-size:  24px;
         }

         .What-people-are-sayi
         {
          font-size:  24px;
         }

         .Who-is-TripleF-for
         {
          font-size: 35px;
         }
         .language-item{
            text-decoration: none;
         }
         .Rectangle-197
         {
          margin:  1px 30px 13px ;
          margin-bottom: 30px;
          /* height: 163px; */
         }

         .what_people_say_part {
              background-color: #f5f6f7;
          }
          #testimonial {
            background-image: unset!important;

        }
          .Become-a-client-Do-y
          {
              font-size: 24px;
              height: 111px;
          }

          .Rectangle_become_client_part
          {
              height: 670px;
          }

          .Our-Latest-News
          {
              font-size: 24px;
          }

      }


      @media only screen and (max-width: 747px) {
          .custom-col-sm-width
          {
              width: 100%;
              padding-left: 0px;
              padding-right: 0px;
          }



          .button_inheader
          {
          margin-top: 9px;
          }

          .What-We-Do-In-Life-E {
              font-size: 31px;
          }

          .margin_left_sendmessage_part
          {
              margin-left: 0px;
              width: 100%;
              border-radius: 0px;
              margin-top: 0px;
          }


      }



      @media only screen and (max-width: 700px)
      {


          .whatwedo_desc
          {}


      .margin_left
      {
         margin-left: 43px;
         width: 87%;
      }




      .margin_left_whatwedopart
      {
          margin-left: 27px;
      }
      .whatdopart
          {

          margin-top: 7px;
          margin-bottom: 77px;

          }

          .button_inheader
          {
          margin-top: 7px;
          }

          .What-We-Do-In-Life-E {
              font-size: 24px;
          }

          .header_part {
             padding-bottom: 77px;


          }

          #whatwedo_desc_mobile
          {
              margin-top: 11px;
              color :#cccccc;
          }

          .howitswork_step_desc
          {
              width: 271px;
          }


      }


      @media only screen and (max-width: 600px)
      {



          .header_part {
             padding-bottom: 11px;


          }




      }


      @media only screen and (max-width: 500px)
      {



          .header_part {
             padding-bottom: 3px;
             background-size: 100% 100%;


          }




      }





      body {

    }
    .popup {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: #ffffff;
        padding: 20px;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
        z-index: 1000;
        width: 90%;
        max-width: 500px;
        transition: all 0.3s ease-in-out;
    }
    .popup.active {
        display: block;
    }
    .popup-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #e0e0e0;
        padding-bottom: 10px;
        margin-bottom: 20px;
    }
    .popup-header h2 {
        margin: 0;
        font-size: 1.5em;
        color: #333;
    }
    .popup-header .close-btn {
        cursor: pointer;
        font-size: 1.5em;
        color: #333;
    }
    .search-container {
        margin-bottom: 20px;
    }
    .search-container input {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 8px;
        box-sizing: border-box;
        outline: none;
        font-size: 1em;
        transition: border 0.3s ease-in-out;
        -webkit-transition: border 0.3s ease-in-out;
        -moz-transition: border 0.3s ease-in-out;
        -ms-transition: border 0.3s ease-in-out;
        -o-transition: border 0.3s ease-in-out;
}
    .search-container input:focus {
        border-color: #007bff;
    }
    .language-list {
        max-height: 300px;
        overflow-y: auto;
        border-top: 1px solid #e0e0e0;
    }
    .language-item {
        display: flex;
        align-items: center;
        padding: 10px;
        cursor: pointer;
        transition: background-color 0.3s ease-in-out;
        text-decoration: none;
    }
    .language-item img {
        margin-right: 10px;
        width: 24px;
        height: auto;
        border-radius: 4px;
    }
    .language-item:hover {
        background-color: #f0f0f0;
    }
    .language-item span {
        font-size: 1em;
        color: #333;
    }
    a.open-popup-link {
        text-decoration: none;
        color: #007bff;
        font-size: 1.2em;
        cursor: pointer;
        transition: color 0.3s ease-in-out;
    }
    a.open-popup-link:hover {
        color: #0056b3;
    }