body{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    margin: 0;
}

html{
    scroll-behavior: smooth;
}

/* navbar */

.nav_container{
    display: flex;
    align-items: center;
    height: 8vw;
}

.body_container{
    width: 100%;
}

.main_navbar {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: white;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    height: 6vw;
    /* top: -50px;
    position: sticky;
    z-index: 100; */
    align-items: center;
}
  
.nav_body_h {
    display: block;
    color: black;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    scroll-behavior: smooth;
    transition: all 0.5s ease-in-out;
}
  
.nav_body_h:hover {
    background-color: #10f70d;
    color: white;
    border-radius: 6px;
}

.nav_container{
    display: flex;
    align-items: center;
}

.nav_btn{
    background-color: #03ff00;
    border-radius: 6px;
    padding: 10px;
    transition: all 0.5s ease-in-out;
    transform: scale(1);
}

.nav_btn1{
    background-color: white;
    border-radius: 6px;
    padding: 10px;
    transition: all 0.5s ease-in-out;
    transform: scale(1);
}

.nav_btn:hover{
    color: black;;
    background-color: white;
    cursor: pointer;
    transform: scale(1.2);
}

.nav_btn1:hover{
    color: white;
    background-color: #10f70d;
    cursor: pointer;
    transform: scale(1.2);
}

.mobile_container{
    display: none;
}

/* footer */

.footer{
    background-color: black;
    text-align: center;
    padding: 1vw 0vw;
}

.footer_text{
    color: #10f70d;
}

.footer_a{
    color: #10f70d;
    text-decoration: none;
}
/* index page */

.logo {
    width: 70%;
    margin: -7vw 0vw -6vw 2vw;
}

.slideshow-container {
    position: relative;
}

.mySlides {
    display: none;
}

.slideshow_headers{
    font-size: 5vw;
    color: #10f70d;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
}

.slideshow_headers1{
    font-size: 5vw;
    color: #10f70d;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
}

.slide_body{
    font-size: 2vw;
    color: white;
    font-weight: 600;
    width: 70%;
}

.slide_body1{
    font-size: 2vw;
    color: white;
    font-weight: 600;
    width: 70%;
}

.slide_btn{
    background-color: #03ff00;
    border-radius: 6px;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    padding: 1vw 2vw;
    font-size: 2vw;
    font-weight: 700;
    margin: 7vw 3vw;
    z-index: 3;
    transform: scale(1);
}

.slide_btn:hover{
    background-color: white;
    color: black;
    transform: scale(1.2);
    z-index: +1;
    filter: drop-shadow(0px 0px 40px rgba(0 0 0 / 100%));
}

.index_info_sec{
    position: absolute;
    z-index: 5;
    margin: 0vw 0vw 0vw 3vw;
    width: 50%;
}

.video{
    width: 100%;
    box-shadow: 0px 10px 85px rgba(0, 0, 0, 1);
    margin: 0vw 0vw 0vw 0vw;
}

/* about page */

.divider{
    width: 100%;
    height: 5vw;
    background-color: #10f70d;
    margin: -1vw 0vw;
    
}

.index_about{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin: 0vw 0vw 0vw 0vw;
    width: 100%;
    height: 40vw;
}

.index_banner{
    position: relative;
    width: 98vw;
    top: 36.5vw;
}

.top_sec{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.about_header{
    font-size: 3vw;
    color: #10f70d;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
    margin: 0vw 0vw 0vw 0vw;
}

.about_header1{
    font-size: 5vw;
    color: #10f70d;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
    text-align: center;
    margin: 2vw 0vw 0vw 0vw;
}

.about_header2{
    font-size: 5vw;
    color: #10f70d;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
    text-align: center;
}

.about_body{
    font-weight: bold;
    font-size: 2vw;
    text-align: center;
    width: 69%;
    margin: 1vw 0vw 4vw 0vw;
}

.about_sec{
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-evenly;
}

.about_sec1{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    margin: 2vw 0vw 1vw 0vw;
    width: 100%;
    transition: all 0.5s ease-in-out;
}

.mission_sec{
    text-align: center;
    border: 4px solid #10f70d;
    margin: 0vw 1vw 0vw 1vw;
    border-radius: 10px;
    padding: 2vw 1vw;
    width: 300px;
    height: 150px;
    transition: all 0.5s ease-in-out;
    z-index: 4;
    transform: scale(1.2);
}

.vision_sec{
    border: 4px solid #10f70d;
    border-radius: 10px;
    margin: 0vw 1vw 0vw 1vw;
    text-align: center;
    padding: 2vw 1vw;
    width: 300px;
    height: 150px;
    transition: all 0.5s ease-in-out;
    z-index: 4;
    transform: scale(1.2);
}

.vision_link{
    text-decoration: none;
    color: black;
    cursor: pointer;
}

.mission_sec:hover{
    transform: scale(1);
    z-index: +5;
}

.vision_sec:hover{
    transform: scale(1);
    z-index: +5;
}

.about_body1{
    font-weight: bold;
}

.about_body2{
    font-weight: bold;
}

.integrity_sec{
    border: 4px solid #10f70d;
    border-radius: 10px;
    margin: 0vw 3vw 0vw 1vw;
    padding: 1vw;
    text-align: center;
    width: 200px;
    height: 300px;
    z-index: 4;
    background-color: white;
    transition: all 0.5s ease-in-out;
}

.loyalty_sec{
    border: 4px solid #10f70d;
    border-radius: 10px;
    padding: 1vw;
    margin: 0vw 2vw 0vw 2vw;
    text-align: center;
    width: 270px;
    height: 300px;
    z-index: 5;
    transform: scale(1.2);
    background-color: white;
    transition: all 0.5s ease-in-out;
}

.excellence_sec{
    border: 4px solid #10f70d;
    border-radius: 10px;
    margin: 0vw 1vw 0vw 3vw;
    padding: 1vw;
    text-align: center;
    width: 200px;
    height: 300px;
    z-index: 4;
    background-color: white;
    transition: all 0.5s ease-in-out;
}

.loyalty_sec:hover{
    transform: scale(1);
    z-index: +1;
}

.integrity_sec:hover{
    transform: scale(1.2);
    z-index: +5;
}

.excellence_sec:hover{
    transform: scale(1.2);
    z-index: +5;
}

.integrity_img{
    width: 60%;
}

.loyalty_img{
    width: 30%;
}

.excellence_img{
    width: 60%;
}

.open_btn{
    display: none;
}

.integrity_header{
    font-size: 2vw;
    font-weight: bold;
}

.loyalty_header{
    font-size: 2vw;
    font-weight: bold;
}

.excellence_header{
    font-size: 2vw;
    font-weight: bold;
}

.values_sec{
    margin: 20vw 0vw -17vw 0vw;
}

.myValues {
    display: none;
}

.fade_in {
    animation: fadeIn 1.5s ease-in-out; /* For entrance */
}

.fade_out {
    animation: fadeOut 1.5s ease-in-out; /* For exit */
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

/* app page */

.index_app{
    background-image: url(../images/about.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 250vh;
    display: flex;
    flex-direction: row;
}

.app_container{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.three_d{
    display: flex;
    align-items: flex-end;
}

.detail_container{
    display: flex;
    flex-direction: column;
    width: 22%;
    height: 29.29%;
    margin: 90.86vw 0vw 0vw 4vw;
    border: 4px solid black;
    border-radius: 20px;
    z-index: 3;
}

.top_section{
    display: flex;
    flex-direction: column;
    background-color: white;
    padding: 0.5vw 1vw;
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;

}

.mid_section{
    display: flex;
    flex-direction: column;
    background-color: black;
    color: #10f70d;
    list-style-type: disc;
    padding: 1vw;
}

.bottom_section{
    display: flex;
    flex-direction: column;
    background-color: white;
    border-bottom-left-radius: 19px;
    border-bottom-right-radius: 19px;
    padding: 1vw 2vw;
}

.top_header{
    font-size: 1.5vw;
}

.mid_header{
    font-size: 1.5vw;
}

.bottom_header{
    font-size: 1.5vw;
}

.top_ul{
    display: flex;
    flex-direction: column;
    margin: 0vw 0vw 0vw 0vw;
}

.mid_ul{
    display: flex;
    flex-direction: column;
    margin: 0vw 0vw 0vw 0vw;
    background-color: black;
}

/* .banner_container{
    /* display: flex; */
    /* align-items: flex-end;
    z-index: 2;
    position: absolute;
    top: 391.5%;
    height: 75.1%;
    right: 0px;
    margin: 45.1vw 0vw 0vw 0vw;
    background-color: white;
    width: 84%;
    border-top: 4px solid black;
    border-bottom: 4px solid black; */


.banner_container{
    align-items: flex-end;
    z-index: 2;
    position: absolute;
    top: 362vh;
    height: 75.1%;
    right: 0px;
    background-color: white;
    width: 84%;
    border-top: 4px solid black;
    border-bottom: 4px solid black;
}

.banner_img{
    width: 70%;
    height: 500px;
}

.phone_container{
    display: flex;
    align-items: flex-end;
    margin: 91vw 0vw 0vw 6vw;
}

.phone_img{
    width: 700px;
    z-index: 3;
    position: relative;
}

.divider2{
    width: 100%;
    height: 7vw;
    background-color: white;
}

/* index contact page */

.index_contact{
    background-image: url(../images/index_contact.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 135vh;
}

.contact_top_header{
    font-size: 7vw;
    color: white;
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: black;
    text-align: center;
}

.contact_top_body {
    font-weight: 400;
    font-size: 2vw;
    text-align: center;
    width: 90%;
    margin: -4vw 0vw 8vw 0vw;
    padding: 0vw 5vw;
}

.contact_mid_sec{
    display: flex;
    justify-content: center;
}

.contact_mid_btn{
    background-color: white;
    border-radius: 6px;
    padding: 1vw 2vw;
    transition: all 0.5s ease-in-out;
    transform: scale(1);
    font-weight: bold;
    cursor: pointer;
    margin: -3vw 0vw 2vw 0vw;
}

.contact_mid_btn.has-transition{
    transition: transform 750ms ease-in-out 0s;
}

.contact_mid_btn:is(:hover, :focus) {
    transform: scale(1.5);
    background-color: #10f70d;
    color: white;
    filter: drop-shadow(0px 0px 10px rgba(0 0 0 / 70%));
  }

.contact_bottom{
    display: flex;
    flex-direction: row;
}

.contact_right{
    display: flex;
    flex-direction: column;
    /* justify-content: space-evenly; */
    width: 18%;
    padding: 0vw 2vw 0vw 2vw;
}

.contact_left{
    width: 60%;
    margin: 0vw 4vw;
}

.contact_h3{
    color: #ff3131;
}

.contact_ul{
    text-decoration: 2px black underline;
    margin: 0;
    padding: 0;
    font-weight: bold;
}

.contact_logo{
    width: 100%;
    margin: 2vw 0vw -4vw 0vw;
}

/* Contact page */

.contact_bg{
    background-image: url(../images/fc_img.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 32vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact_bg_mobile{
    background-image: url(../images/fc_img.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 45vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 2px solid black;
    border-radius: 10px;
    background-color: white;
    width: 60%;
    padding: 1vw;
}

.contact_heading{
    margin: 0vw 0vw 0vw 8vw;
    font-size: 3.5vw;
}

.contact_body{
    margin: 0vw 1vw 1vw 8vw;
    font-weight: bold;
}

.contact_form{
    display: flex;
    flex-direction: row;
}

.contact_input{
    border-bottom: 4px solid #10f70d;
    border-top: none;
    border-left: none;
    border-right: none;
    color: black;
    background-color: white;
    width: 100%;
    padding: 1vw 0vw 1vw 0.5vw;
    margin: 1vw 0vw;
    font-size: 1.5vw;
}

.contact_btn{
    background-color: #10f70d;
    border-radius: 10px;
    padding: 1vw 2vw;
    transition: all 0.5s ease-in-out;
    transform: scale(1);
    font-weight: bold;
    font-size: 1.5vw;
    width: 37%;
}

.contact_btn:hover{
    transform: scale(1.2);
    z-index: +5;
    background-color: white;
    cursor: pointer;
}

.sec1{
    display: flex;
    flex-direction: column;
    margin: 0vw 3vw;
    width: 50%;
}

.sec2{
    display: flex;
    flex-direction: column;
    margin: 0vw 3vw;
    width: 50%;
}

.mobile_sec{
    display: none;
}

.sub_head{
    font-size: 1.5vw;
    font-weight: bold;
}

.contact_label{
    font-weight: bold;
    font-size:1vw;
    margin: 0.2vw 0vw 1vw 0vw;
}

.contact_select{
    font-weight: bold;
    user-select: none;
    font-size:1.5vw;
}

.options{
    font-weight: bold;
    user-select: none;
    transition: background-color 0.5s, color 0.5s;
}

.options:hover{
    background-color: #10f70d;
    color:white;
    cursor: pointer;
}


  
/* fraud page */

.fraud_bg{
    background-image: url(../images/fc_img.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 32vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fraud_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 2px solid black;
    border-radius: 10px;
    background-color: white;
    width: 60%;
    padding: 0.5vw;
}

.this_part{
    display: flex;
    flex-direction: row;
}

.fraud_info{
    width: 40%;
    display: flex;
    flex-direction: column;
    margin: 0vw 2vw;
    color: red;
}

.fraud_form{
    display: flex;
    flex-direction: row;
    width: 50%;
}

.fraud_btn{
    background-color: #10f70d;
    border-radius: 10px;
    padding: 1vw 2vw;
    transition: all 0.5s ease-in-out;
    transform: scale(1);
    font-weight: bold;
    font-size: 1.5vw;
    width: 20%;
    margin: -5vw 0vw 0vw 28vw;
}

.fraud_btn:hover{
    transform: scale(1.2);
    z-index: +5;
    background-color: white;
    cursor: pointer;
}

.form_1{
    margin: 0vw 1vw 0vw 0vw;
}

.form_2{
    margin: 0vw 0vw 0vw 1vw;
}

.fraud_input{
    border-bottom: 4px solid #10f70d;
    border-top: none;
    border-left: none;
    border-right: none;
    color: black;
    background-color: white;
    width: 90%;
    padding: 1vw 0vw 1vw 0.5vw;
    margin: 1vw 0vw;
    font-size: 1vw;
    font-weight: bold;
}

.fraud_input1{
    border-bottom: 4px solid #10f70d;
    border-top: none;
    border-left: none;
    border-right: none;
    color: black;
    background-color: white;
    width: 90%;
    padding: 1vw 0vw 1vw 0.5vw;
    margin: 1vw 0vw;
    font-size: 1vw;
    font-weight: bold;
}

.fraud_header{
    font-size: 3vw;
    font-weight: bold;
    margin: 0vw 0vw 0vw 2vw;
}

.up_icon1{
    width: 35%;
    margin: -11px;
}

.up_btn1{
    display: flex;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
}

.new_text{
    font-size: 0.9vw;;
}


.btn1 {
    background-color: #10f70d;
    color: black;
    padding: 0.8vw;
    border-radius: 0.3vw;
    cursor: pointer;
    margin-top: 1vw;
    font-weight: bold;
    border: 1px solid black;
    transform: scale(1);
  }
  
.btn1:hover {
    transform: scale(1.2);
    z-index: +5;
    background-color: white;
    cursor: pointer;
}
  
  .files{
    margin-left: 0.3vw;
    margin-top: 0.3vw;
  }

  select{
    background-color: #10f70d;
  }
  
  option{
    color: white;
  }

  .new_nav{
    display: none;
  }

  @media only screen and (max-width: 768px) {

    .main_navbar{
        height: 8vw;
    }

    .about_header {
        -webkit-text-stroke-width: 0px;
    }

    .about_header1 {
        -webkit-text-stroke-width: 0px;
    }

    .about_header2 {
        font-size: 6vw;
        margin: 8vw;
        -webkit-text-stroke-width: 0px;
    }
    .top_sec{
        width: 96%;
    }

    .index_banner{
        width: 99vw;
        top: 57vw;
    }

    .detail_container{
        width: 39%;
        margin: 89vw 0vw 0vw 4vw;
        height: 30.9%;
    }

    .banner_container{
        height: 68%;
        right: 0px;
        margin: -72vw 0vw 0vw 0vw;
    }

    .phone_img {
        width: 450px;
    }

    .slideshow_headers1 {
        font-size: 6vw;
        -webkit-text-stroke-width: 0px;
    }

    .slide_body {
        font-size: 3vw;
    }

    .slideshow_headers {
        font-size: 5vw;
    }

    .slide_body1 {
        font-size: 4vw;
    }

    .contact_right{
        width: 30%;
    }

    .contact_top_header {
        -webkit-text-stroke-width: 0px;
    }
    
    .slide_btn{
        margin: 1vw 3vw;
    }

    .about_sec1{
        margin: 2vw 0vw 1vw 11vw;
        width: 80%;
    }

    .about_body{
        margin: 1vw 0vw 6vw 0vw;
    }
    
    .mission_sec{
        width: 270px;
        height: 150px;
    }

    .vision_sec{
        width: 270px;
        height: 150px;
    }

    .index_app {
        height: 220vh;
    }
    
    .fraud_container{
        width: 90%;
        padding: 1vw;
    }

    .fraud_info{
        font-size: 1.5vw;
    }

    .fraud_input{
        margin: 1vw 0vw;
        font-size: 1.8vw;
    }

    .fraud_input1{
        margin: 1.5vw 0vw;
        font-size: 1.8vw;
    }

    .fraud_btn{
        font-size: 2vw;
        width: 30%;
        margin: -6vw 0vw 0vw 40vw;
    }

    .fraud_header {
        font-size: 4vw;
    }

    .fraud_bg{
        height: 63vw;
    }
  }

  @media only screen and (max-width: 600px) {

    /* sidenav */

    .sidenav_menu {
        width: 0;
        position: fixed;
        z-index: 10;
        top: 0;
        left: 0;
        background-color: black;
        overflow-x: hidden;
        padding-top: 60px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
        transform-origin: center center;
        align-content: center;
        flex-wrap: wrap;
    }
    
    .sidenav_menu a {
        padding: 1vw 0vw 3vw 0vw;
        text-decoration: none;
        font-size: 20px;
        color: white;
        display: flex;
        transition: 0.3s;
        flex-direction: row;
        justify-content: center;
        width: 90%;
        height: 24vw;
    }
      
    .sidenav_menu a:hover {
        color: #f1f1f1;
    }
    
    .sidenav_menu .close_btn {
        position: absolute;
        top: 10px;
        right: 25px;
        font-size: 36px;
        width: 30%;
    }

    .mobile_nav_container{
        width: 70%;
        padding: 0vw 6vw 0vw 6vw;
    }

    .logo_mobile{
        width: 100%;
    }

    .new_nav{
        display: flex;
    }
    
    .open_btn {
        font-size: 10vw;
        cursor: pointer;
        background-color: black;
        color: white;
        padding: 10px 15px;
        border: none;
        width: 100%;
    }
    
    .nav_btn{
        width: 70%;
        font-size: 5vw;
    }
    
    .nav_btn1{
        width: 70%;
        font-size: 5vw;
    }

    /* index */


    .about_header1 {
        font-size: 12vw;
        -webkit-text-stroke-width: 0px;
    }

    .about_header{
        font-size: 8vw;
        margin: 0vw 0vw -2vw 0vw;
        -webkit-text-stroke-width: 0px;
    }

    .about_body{
        width: 90%;
        font-size: 6vw;
        margin: 3vw 0vw 17vw 0vw;
    }

    .about_sec{
        align-items: center;
    }

    .about_sec1 {
        flex-direction: column;
        align-items: center;
    }

    .about_header2 {
        font-size: 12vw;
        -webkit-text-stroke-width: 0px;
        margin: 0;
    }

    .index_about{
        height: 180vh;
        justify-content: flex-start;
    }

    .index_info_sec{
        margin: 2vw 0vw 0vw 5vw;
        width: 75%;
    }

    .integrity_sec {
        margin: 5vw 3vw 20vw 1vw;
        height: 250px;
        width: 250px;
        transform: scale(1.2);
    }

    .integrity_header{
        margin: 0vw 0vw -2vw 0vw;
        font-size: 4vw;
    }

    .loyalty_sec{
        width: 250px;
        height: 250px;
    }

    .loyalty_header{
        margin: 1vw 0vw -1vw 0vw;
        font-size: 4vw;
    }
    
    .excellence_sec {
        width: 250px;
        height: 250px;
        margin: 20vw 1vw 5vw 3vw;
        transform: scale(1.2);
    }

    .excellence_header{
        margin: 1vw 0vw -1vw 0vw;
        font-size: 4vw;
    }

    .mission_sec{
        width: 280px;
        margin: 6vw 1vw 6vw 1vw;
    }

    .vision_sec{
        width: 280px;
        margin: 20vw 1vw 3vw 1vw;
    }

    .detail_container {
        width: 90%;
        height: 22.3%;
        margin: 206vw 0vw 0vw 4vw
    }

    .video{
        box-shadow: 0px 10px 30px rgba(0, 0, 0, 1);
        position: absolute;
        margin: 0vw;
        width: 700px;
        height: 394px;
        right: 0vw;

    }

    .divider {
        margin: 92vw 0vw 0vw 0vw;
        position: relative;
        height: 10vw;
    }

    .contact_mid_sec{
        display: flex;
        justify-content: center;
        margin: 10vw 0vw;
    }

    .banner_container{
        display : none;
    }

    .phone_container{
        margin: 16vw 0vw 0vw 2vw;
    }

    .phone_img {
        width: 400px;
    }

    .about_sec {
        flex-direction: column;
        width: 100%;
    }

    .slideshow_headers {
        font-size: 8vw;
        -webkit-text-stroke-width: 0px;
        margin: 2vw 0vw 0vw 0vw;
    }

    .slide_body {
        font-size: 6vw;
        margin: 2.5vw 0vw;
    }

    .slideshow_headers1 {
        font-size: 8vw;
        -webkit-text-stroke-width: 0px;
        margin: 2vw 0vw 0vw 0vw;
    }

    .slide_body1 {
        font-size: 6vw;
        margin: 2.5vw 0vw 5.5vw 0vw;
    }

    .slide_btn{
        padding: 2vw 5vw;
        font-size: 4vw;
        margin: 1.5vw 1vw;
    }

    .index_app{
        flex-direction: column;
        height: 200vh;
    }

    .top_header {
        font-size: 4.5vw;
    }

    .top_ul {
        font-size: 4vw;
    }

    .mid_ul {
        font-size: 4vw;
    }

    .mid_header {
        font-size: 4.5vw;
    }

    .bottom_header {
        font-size: 4.5vw;
    }

    .bottom_section {
        font-size: 4.5vw;
    }

    .app_container{
        flex-wrap: wrap;
    }

    .contact_top_header {
        font-size: 14vw;
        -webkit-text-stroke-width: 0px;

    }

    .contact_top_body{
        /* width: 80%; */
        margin: -4vw 0vw 8vw 0vw;
        padding: 0vw 5vw;
        font-size: 6vw;
        width: 90%;
    }

    .contact_mid_btn {
        font-size: 5vw;
        padding: 3vw 4vw;
    }

    .contact_bottom{
        flex-direction: column;
    }

    .contact_left {
        margin: 0vw 0vw;
        padding: 0vw 5vw;
        width: 90%;
    }

    .contact_right{
        width: 90%;
        padding: 0vw 0vw 0vw 9vw;
    }

    /* contact page */

    .contact_bg{
        height: 135vw;
    }

    .contact_bg_mobile{
        background-image: url(../images/fc_img.svg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        height: 170vw;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contact_container{
        width: 90%;
        padding: 1vw;
    }

    .contact_heading{
        font-size: 3.5vw;
        text-align: center;
    }

    .contact_body{
        font-size: 4.5vw;
        text-align: center;
        margin: 0vw 10vw 1vw 10vw;
    }

    .contact_input{
        font-size: 4.5vw;
        margin: 1.5vw 0vw;
    }

    .mobile_sec{
        display: flex;
        flex-direction: column;
        width: 90%;
    }

    .contact_form{
        justify-content: center;
    }

    .contact_label{
        font-size: 3vw;
        margin: 0vw 0vw 0vw 0vw;
    }

    .contact_select{
        font-size: 4.5vw;
        margin: 1.5vw 0vw;
    }

    .contact_btn{
        font-size: 4.5vw;
        width: 40%;
        margin: 4vw 24vw;
    }

    .contact_logo {
        width: 100%;
        margin: 2vw 0vw -16vw 0vw;
    }


    .d1{    
        margin: -14vw 0vw 0vw -5vw;
    }

    .index_contact{
        height: 350vw;
    }

    /* fraud page */

    .fraud_bg{
        height: 230vw;
    }

    .fraud_info{
        width: 95%;
        flex-direction: column;
        font-size: 4vw;
        text-align: center;
    }
    
    .fraud_form{
        width: 95%;
        flex-direction: column;
    }

    .fraud_container{
        width: 90%;
        margin: 3vw 1vw 0vw 1vw;
    }

    .this_part {
        flex-direction: column;
    }

    .fraud_header {
        font-size: 8vw;
        text-align: center;
    }

    .fraud_input{
        margin: 1vw 5vw;
        font-size: 5vw;
    }

    .fraud_input{
        margin: 1vw 5vw;
        font-size: 5vw;
    }

    .form_2 {
        margin: 0vw 0vw 0vw 0vw;
    }

    .fraud_btn{
        font-size: 6.5vw;
        width: 40%;
        margin: 4vw 0vw 0vw 28vw;
    }
    
    .footer_text {
        font-size: 3vw;
    }

  }

  @media only screen and (max-width: 426px) {

    /* sidenav */

    .sidenav_menu {
        width: 0;
        position: fixed;
        z-index: 10;
        top: 0;
        left: 0;
        background-color: black;
        overflow-x: hidden;
        padding-top: 60px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
        transform-origin: center center;
        align-content: center;
        flex-wrap: wrap;
    }
    
    .sidenav_menu a {
        padding: 1vw 0vw 3vw 0vw;
        text-decoration: none;
        font-size: 20px;
        color: white;
        display: flex;
        transition: 0.3s;
        flex-direction: row;
        justify-content: center;
        width: 90%;
        height: 24vw;
    }
      
    .sidenav_menu a:hover {
        color: #f1f1f1;
    }
    
    .sidenav_menu .close_btn {
        position: absolute;
        top: 10px;
        right: 25px;
        font-size: 36px;
        width: 30%;
    }

    .mobile_nav_container{
        width: 70%;
        padding: 0vw 6vw 0vw 6vw;
    }

    .logo_mobile{
        width: 100%;
    }

    .new_nav{
        display: flex;
    }
    
    .open_btn {
        font-size: 10vw;
        cursor: pointer;
        background-color: black;
        color: white;
        padding: 10px 15px;
        border: none;
        width: 100%;
    }
    
    .nav_btn{
        width: 70%;
        font-size: 5vw;
    }
    
    .nav_btn1{
        width: 70%;
        font-size: 5vw;
    }

    /* index */


    .about_header1 {
        font-size: 12vw;
        -webkit-text-stroke-width: 0px;
    }

    .about_header{
        font-size: 8vw;
        margin: 0vw 0vw -2vw 0vw;
        -webkit-text-stroke-width: 0px;
    }

    .about_body{
        width: 90%;
        font-size: 6vw;
        margin: 3vw 0vw 17vw 0vw;
    }

    .about_sec{
        align-items: center;
    }

    .about_sec1 {
        flex-direction: column;
        align-items: center;
    }

    .about_header2 {
        font-size: 12vw;
        -webkit-text-stroke-width: 0px;
        margin: 0;
    }

    .index_about{
        height: 180vh;
        justify-content: flex-start;
    }

    .index_info_sec{
        margin: 2vw 0vw 0vw 5vw;
        width: 75%;
    }

    .integrity_sec {
        margin: 5vw 3vw 20vw 1vw;
        height: 250px;
        width: 250px;
        transform: scale(1.2);
    }

    .integrity_header{
        margin: 0vw 0vw -2vw 0vw;
        font-size: 4vw;
    }

    .loyalty_sec{
        width: 250px;
        height: 250px;
    }

    .loyalty_header{
        margin: 1vw 0vw -1vw 0vw;
        font-size: 4vw;
    }
    
    .excellence_sec {
        width: 250px;
        height: 250px;
        margin: 20vw 1vw 5vw 3vw;
        transform: scale(1.2);
    }

    .excellence_header{
        margin: 1vw 0vw -1vw 0vw;
        font-size: 4vw;
    }

    .mission_sec{
        width: 280px;
        margin: 6vw 1vw 6vw 1vw;
    }

    .vision_sec{
        width: 280px;
        margin: 20vw 1vw 3vw 1vw;
    }

    .detail_container {
        width: 90%;
        height: 22.3%;
        margin: 206vw 0vw 0vw 4vw
    }

    .video{
        box-shadow: 0px 10px 30px rgba(0, 0, 0, 1);
        position: absolute;
        margin: 0vw;
        width: 700px;
        height: 394px;
        right: 0vw;

    }

    .divider {
        margin: 92vw 0vw 0vw 0vw;
        position: relative;
        height: 10vw;
    }

    .contact_mid_sec{
        display: flex;
        justify-content: center;
        margin: 10vw 0vw;
    }

    .banner_container{
        display : none;
    }

    .mobile_banner{
        flex-direction: column;
        justify-content: flex-end;
        margin: 20vw 0vw 0vw 0vw;
    }

    .req_banner{
        width: 100%;
        /* margin: 400vw 1vw 1vw 1vw; */
        position: relative;
        top: 200vw;
    }

    .hand_banner{
        width: 100%;
        /* margin: 15vw 0vw 0vw 0vw; */
        position: relative;
        top: 210vw;
    }

    .phone_container{
        margin: 16vw 0vw 0vw 2vw;
    }

    .phone_img {
        width: 400px;
    }

    .about_sec {
        flex-direction: column;
        width: 100%;
    }

    .slideshow_headers {
        font-size: 8vw;
        -webkit-text-stroke-width: 0px;
        margin: 2vw 0vw 0vw 0vw;
    }

    .slide_body {
        font-size: 6vw;
        margin: 2.5vw 0vw;
    }

    .slideshow_headers1 {
        font-size: 8vw;
        -webkit-text-stroke-width: 0px;
        margin: 2vw 0vw 0vw 0vw;
    }

    .slide_body1 {
        font-size: 6vw;
        margin: 2.5vw 0vw 5.5vw 0vw;
    }

    .slide_btn{
        padding: 2vw 5vw;
        font-size: 4vw;
        margin: 1.5vw 1vw;
    }

    .index_app{
        flex-direction: column;
        height: 290vh;
    }

    .top_header {
        font-size: 4.5vw;
    }

    .top_ul {
        font-size: 4vw;
    }

    .mid_ul {
        font-size: 4vw;
    }

    .mid_header {
        font-size: 4.5vw;
    }

    .bottom_header {
        font-size: 4.5vw;
    }

    .bottom_section {
        font-size: 4.5vw;
    }

    .app_container{
        flex-wrap: wrap;
    }

    .contact_top_header {
        font-size: 14vw;
        -webkit-text-stroke-width: 0px;

    }

    .contact_top_body{
        /* width: 80%; */
        margin: -4vw 0vw 8vw 0vw;
        padding: 0vw 5vw;
        font-size: 6vw;
        width: 90%;
    }

    .contact_mid_btn {
        font-size: 5vw;
        padding: 3vw 4vw;
    }

    .contact_bottom{
        flex-direction: column;
    }

    .contact_left {
        margin: 0vw 0vw;
        padding: 0vw 5vw;
        width: 90%;
    }

    .contact_right{
        width: 90%;
        padding: 0vw 0vw 0vw 9vw;
    }

    /* contact page */

    .contact_bg{
        height: 135vw;
    }

    .contact_bg_mobile{
        background-image: url(../images/fc_img.svg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        height: 170vw;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .contact_container{
        width: 90%;
        padding: 1vw;
    }

    .contact_heading{
        font-size: 3.5vw;
        text-align: center;
    }

    .contact_body{
        font-size: 4.5vw;
        text-align: center;
        margin: 0vw 10vw 1vw 10vw;
    }

    .contact_input{
        font-size: 4.5vw;
        margin: 1.5vw 0vw;
    }

    .mobile_sec{
        display: flex;
        flex-direction: column;
        width: 90%;
    }

    .contact_form{
        justify-content: center;
    }

    .btn1{
        margin-left: 5vw;
    }

    .files {
        margin-left: 5.3vw;
        margin-top: 0.3vw;
    }

    .contact_label{
        font-size: 3vw;
        margin: 0vw 0vw 0vw 0vw;
    }

    .contact_select{
        font-size: 4.5vw;
        margin: 1.5vw 0vw;
    }

    .contact_btn{
        font-size: 4.5vw;
        width: 40%;
        margin: 4vw 24vw;
    }

    .contact_logo {
        width: 100%;
        margin: 2vw 0vw -16vw 0vw;
    }


    .d1{    
        margin: -14vw 0vw 0vw -5vw;
    }

    .index_contact{
        height: 350vw;
    }

    /* fraud page */

    .fraud_bg{
        height: 230vw;
    }

    .fraud_info{
        width: 95%;
        flex-direction: column;
        font-size: 4vw;
        text-align: center;
    }
    
    .fraud_form{
        width: 95%;
        flex-direction: column;
    }

    .fraud_container{
        width: 90%;
        margin: 3vw 1vw 0vw 1vw;
    }

    .this_part {
        flex-direction: column;
    }

    .fraud_header {
        font-size: 8vw;
        text-align: center;
    }

    .fraud_input{
        margin: 1vw 5vw;
        font-size: 5vw;
    }

    .fraud_input1{
        margin: 1vw 5vw 2vw 5vw;
        font-size: 5vw;
    }

    .form_2 {
        margin: 0vw 0vw 0vw 0vw;
    }

    .fraud_btn{
        font-size: 6.5vw;
        width: 40%;
        margin: 4vw 0vw 0vw 28vw;
    }
    
    .footer_text {
        font-size: 3vw;
    }

  }

  @media only screen and (max-width: 360px) {
        
    .new_nav{
        display: flex;
    }

    .sidenav_menu a{
        padding: 1vw 0vw 3vw 0vw;
    }

    .mobile_nav_container{
        width: 70%;
        padding: 0vw 6vw 0vw 6vw;
    }

    .logo_mobile{
        width: 100%;
    }

    .video{
        width: 600px;
        height: 337px;
    }

    .divider {
        margin: 94vw 0vw 0vw 0vw;
    }

    .vision_sec {
        width: 270px;
    }

    .mission_sec {
        width: 270px;
    }

    .index_app {
        height: 290vh;
    }

    .detail_container {
        width: 90%;
        height: 22.3%;
        margin: 260vw 0vw 0vw 4vw;
    }

    .index_app {
        flex-direction: column;
        height: 290vh;
        align-items: center;
        justify-content: flex-end;
    }

    .mobile_banner{
        flex-direction: column;
        justify-content: flex-end;
        margin: 20vw 0vw 0vw 0vw;
    }

    .req_banner{
        width: 100%;
        /* margin: 400vw 1vw 1vw 1vw; */
        position: relative;
        top: -25vw;
    }

    .hand_banner{
        width: 100%;
        /* margin: 15vw 0vw 0vw 0vw; */
        position: relative;
        top: -10vw;
    }

    .index_contact {
        height: 380vw;
    }

    .detail_container {
        height: 19.8%;
    }

    .index_contact {
        height: 405vw;
    }

    .phone_container {
        margin: 16vw 0vw 0vw -12vw;
    }

    .footer_text {
        font-size: 5vw;
    }
    
    .footer{
        padding: 2vw 0vw;
    }

}