@media only screen and (min-width: 1920px) {
    .container{max-width: 1720px;}
}

 @media only screen and (min-width:1200px) { 
          #header-part .navbar-nav .nav-link{max-width: fit-content;margin: auto;}
          #header-part .navbar-nav .nav-item.dropdown {filter: drop-shadow(0px 28px 21px rgba(0, 0, 0, 0.12)); }
          #header-part .navbar-nav .nav-item .dropdown-menu {visibility: hidden; display: block !important; -webkit-transition: 0.5s; transition: 0.5s; clip-path: polygon(0% 0%,100% 0%,100% 0%,0% 0%); padding: 15px 5px; border-radius: 20px; background: #4A3DAC;}
          #header-part .navbar-nav .nav-item:hover .dropdown-menu, #header-part .navbar-nav .nav-item .dropdown-menu.show{visibility: visible; clip-path: polygon(0% 0%,100% 0%,100% 100%,0% 100%);} 
          #header-part .dropdown-item{ color: #fff; font-size: 16px; font-weight: 500; transition: all ease 0.5s;}
          #header-part .dropdown-item:hover{ transform: translateX(5px); background: transparent; opacity: 1;}
          #header-part .dropdown-item:hover .dropdown-menu{ opacity: .5;}
        }

    @media only screen and (max-width: 1199px) {
      #header-part { position: fixed; top: 0; width: 100%; z-index: 12; transition: all ease 0.5s; flex-direction: row-reverse; align-content: space-between; align-items: center;}
      #header-part{ padding: 0px 0px !important; background: #fff;}
      #header-part .navbar-nav{ padding: 75px 0px;}
      #header-part .navbar .navbar-collapse { position: fixed; left: 0px; top: 0px; right: auto; z-index: 5; background-color: #fff; width: calc(100% - 00px); height: calc(100% - 00px) !important; opacity: 1; visibility: visible; transform-origin: right; overflow-y: auto; overflow-x: hidden; flex-wrap: wrap; padding-top: 0; -webkit-clip-path: polygon(100% 00%, 100% 0%, 100% 0%, 100% 00%); -webkit-transition: -webkit-clip-path 0.3s ease; transition: -webkit-clip-path 0.3s ease; transition: clip-path 0.3s ease, -webkit-clip-path 0.3s ease; will-change: transform, clip-path; clip-path: polygon(100% 00%, 100% 0%, 100% 0%, 100% 00%);}
      #header-part .navbar .navbar-collapse::before{content: '';display: block;position: absolute;top: 0;width: 100%;height: 100%;background:url(../img/welcome-bg.jpg) no-repeat;background-size: cover;background-position: bottom left;opacity: .15;z-index: -1;}
      #header-part .navbar .navbar-collapse.show { clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 100% 0%);}
      #header-part button.navbar-toggler,
      #header-part button.navbar-toggler:focus {position: absolute;top: 28px;right: 15px;padding: 0;height: 30px;width: 55px;border-radius: 0;box-shadow: unset;font-size: 15px;text-transform: uppercase;font-weight: 500;letter-spacing: 0.3px;overflow: hidden;border: none;}
      #header-part button.navbar-toggler:after,
      #header-part button.navbar-toggler:before {content: "";position: absolute;height: 2px;width: 100%;background: #343434;left: 0;}
      #header-part button.navbar-toggler:after { left: 0; top: 0;}
      #header-part button.navbar-toggler:before { bottom: 0; left: 0;}
      #header-part button.navbar-toggler span {height: 2px;background: #343434;width: 100%;position: absolute;top: 50%;transform: translateY(-50%);}
      #header-part button.navbar-toggler span:after {content: "Menu";position: absolute;left: 0;top: -5px;font-size: 12px;background: #ffffff;padding: 0 3px 0 0;transform: translateX(-27px);transition: all 0.4s;color: #343434;}
      #header-part button.navbar-toggler span:before { content: "Open"; position: absolute; right: 0; top: -5px; font-size: 12px; background: #ffffff; padding: 0 0px 0 3px; transform: translateX(50px); transition: all 0.4s; color: var(--blue);}
      #header-part button.navbar-toggler:hover span:after {transform: translateX(-70px);}
      #header-part button.navbar-toggler:hover span:before {transform: translateX(-50px);}
      #header-part .navbar .navbar-collapse .mobile_text { display: flex; height: 100%; flex-direction: column; position: absolute; left: 0; top: 0;}
      #header-part .navbar .navbar-collapse .mobile_text span { height: calc(33.33% - 0px); text-align: center; vertical-align: middle; align-items: center; display: flex; font-size: 100px; font-weight: 700; font-family: "Roboto Condensed", sans-serif; padding: 40px; background: #004e98; border-bottom: 2px solid #e9f2f8; justify-content: center; line-height: 1.3; color: #e9f2f8;}
      #header-part .navbar .navbar-collapse .mobile_text span:last-child { border: unset;}
      .close_and_title_text{ position: fixed; top: 12px; right: 0; z-index: 11; transition: all ease 0.5s;}
      .close_and_title_text button.navbar-toggler {line-height: 2; color:var(--blue); top: 12px;}
      #header-part .navbar-nav .nav-link{font-size: 28px;font-weight: 600;text-transform: uppercase;padding: 18px 30px !important;}
      #header-part .navbar-nav .dropdown-menu {position: static;padding: 15px 15px 15px 15px;border-radius: 0px;background:#4A3DAC;border: none;}
      #header-part .navbar-nav .dropdown-item{white-space: normal;color: #fff;font-size: 22px;transition: all ease 0.5s;padding: 12px 15px;}
      #header-part .dropdown-item:focus, #header-part .dropdown-item:hover{ transform: translateX(15px); background: transparent;}
      #header-part .dropdown-item.active,  #header-part .dropdown-item:active{ background: transparent; color: #444;}
      #main-slider .carousel-caption { max-width: 400px; left: 10%;}
      #main-slider .carousel-caption h5{ font-size: 30px;}
      .performance-info h3{ font-size: 30px;}
      .header-menu .navbar { padding: 18px 0px;}
      #header-part .navbar-brand { margin: 0px 45px 0px 0px; max-width: 210px;}
      #header-part .navbar-brand img{ width: 100%;}
      #sustainability-section {right: 0%;}
      .right-top{ display: none;}
      .header-menu .nav-item button.dropdown-toggle{ right: 20px; top: 26px; bottom: unset;}
    }
    @media only screen and (max-width: 991px) {
      .experience-counter, .choose-img:before, .choose-img img, .about-img:before, .about-img img, .experinece-data .experience-counter{ border-radius: 20px;}
    }

    @media only screen and (max-width: 767px) {
      #banner-section{ padding: 200px 0px 150px 0px;}
      .slider-text .rr-scroller ul li{ padding: 0px 0px;}
      .experience-counter, .choose-img:before, .choose-img img, .about-img:before, .about-img img, .experinece-data .experience-counter{ border-radius: 20px;}
      .progress-content .counter, .experinece-data .progress-content .counter{ height: 35px;}
      .progress-content .counter > span{ width: 16px;}
      .mantra-text h4{ position: absolute;}
      .progress-content, .experinece-data .progress-content{ border: none;}
      #lead-process{ padding: 25px 0px 25px 0px;}
      #lead-process::before{ width: 100%;}
    }