/* mobile screen */

@media (max-width:576px) {

    .element-button{
        font-size: 12px;
    }
    
    .login-button{
        padding: 8px 22px;
    }



    .headline{
        font-size: 28px ;
        width: 100%;
    }

    .section-padding{
        padding: 46px 0px;
    }
    .line{
        width: 40px;
    }

    .paragraph-text{
        font-size: 12px;
    }
    .headline-line{
        font-size: 14px;
    }

    .sub-headline{
        font-size: 20px;
    }
    .action-button{
        width: 200px;
        padding: 15px 10px;
    }
    
    .integrity-headline{
        font-size: 1rem !important;
    }

    .values-text{
        font-size:1.3rem;
        padding: 0 10px;
    }

    .swiper-slide img {
        height: 325px;
      }


      .location-content{
        width: 55% !important;
    }

      .cta-headline {
        font-size: 40px !important;
    }


    .login-form{
        padding: 32px 24px !important;
    }

    .story-years h3{
        font-size: 24px !important;
    }

    .story-years p{
        font-size: 14px;
    }

    .card-headline {
        font-size: 18px;
    }

    .numbers-text{
        font-size: 38px !important;
    }

    .value-second-column{
        transform: translateY(0)
    }


    .sub-team-headline{
        font-size: 14px;
        gap: 16px;
    }

    .hr{
        width: 50px;
    }

}


@media (min-width: 577px) and (max-width: 768px) {
    .headline {
        font-size: 38px;
    }

    .paragraph-text{
        font-size: 14px;
    }

    .integrity-headline{
        font-size: 1.2rem !important;
    }

    .values-text{
        font-size: 2rem;
    }

    .cta-headline {
        font-size: 40px !important;
    }

    .location-content{
        width: 45% !important;
    }

    .login-form{
        padding: 32px 24px !important;
    }

    .story-years h3{
        font-size: 32px !important;
    }

    .card-headline {
        font-size: 18px;
    }

    .sub-headline{
        font-size: 28px;
    }

    .numbers-text{
        font-size: 42px;
    }

    .value-second-column{
        transform: translateY(0)
    }

    .sub-team-headline{
        font-size: 16px;
        gap: 20px;
    }
}




@media (min-width: 769px) and (max-width: 992px) {

    .headline{
        font-size: 41px;
    }

    .paragraph-text{
        font-size: 14px;
    }

    .sub-headline{
        font-size: 28px;
    }


    .cta-headline {
        font-size: 40px;
    }

    .login-form{
        padding: 24px ;
    }

    .story-years h3{
        font-size: 32px !important;
    }

    .card-headline {
        font-size: 18px;
    }

    .numbers-text{
        font-size: 38px;
    }

    .sub-team-headline{
        font-size: 16px;
        gap: 20px;
    }


}


/* large screen */

@media (max-width: 992px) {

    .cta-headline {
        font-size: 40px;
    }

    .logo-image{
        width: 150px;
    }

    .drop-down-content {
        background-color: #111111;
    }


    .menu-elemets{
        position: absolute;
        top: 66px;
        right: 0;
        left: 0;
        background-color: #000000dc;
        height: calc(100vh - 66.46px);
        padding:16px 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .menu-elemets::backdrop{
        background-color: #000000;
    }

    .element-link{
        padding: 8px ;
    }

    nav{
        width: 100%;
    }

    .dropdown{
        width: 100%;
    }

    .header-navlinks ul, .header-navlinks ul a, .header-navlinks ul a li {
        width: 100%;
        text-align: center;
    }

    .header-navlinks ul a:hover{
        background-color: #8ea1bb8a;
    }

    .element-button{
        width: 100%;
        text-align: center;
        justify-content: center;
    }




    /* Mega menu */

    .mega-menu{
        position: absolute;
        width: 100%;
        top: 100px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 2;
        background-color: #ffffff;
        height: calc(100vh - 170px);
        color: black;
        text-shadow: none;
        box-shadow: 1px 2px 4px #11111120;
        display: none;
        overflow-y: scroll;
    }

    .mega-menu::-webkit-scrollbar{
        display: none;
    }


    /* swiper */

    .swiper-slide {
        width: 100%;
      }

      .integrity-content{
        width: 80%;
        padding: 16px;
        right: 20px;
        top: 20px;
        bottom: 20px;
      }

      .content{
         font-size: 12px;
      }


      .explore-button{
        padding: 5px 22px;
        color: white;
        border-radius: 20px;
      }



      .footer-column{
        border-right:none;
        padding-right: 0;
    }
    
    .login-form{
        padding: 50px;
    }

}


/* xtralarge screen */

@media (max-width: 1200px) {
    .element-link{
        font-size: 14px;
    }

    .mega-links{
        font-size: 14px;
    }
   
    .card-headline{
        font-size: 22px;
    }

}


@media screen and (max-width: 63.9375em){
    .banner-headline{
        min-height: 400px;
    }
}