:root {
     --primary-color: #0c4da2;
     --accent-color: #f7941d;
     --success-color: #39b54a;
     --light-bg: #f8f9fa;
     --dark-overlay: rgba(0, 0, 0, 0.6);
     --primary-color: #0d47a1;
     --secondary-color: #ff8f00;
     --dark-color: #1e1e1e;
     --light-color: #f8f9fa;

     --primary-blue: #0c4da2;
     --success-green: #39b54a;
     --bg-light: #f9f9f9;

     --accent-orange: #f7941d;
     --soft-blue: #eef4fb;
     --bg-gray: #f8f9fa;
     --hvac-cyan: #00bcd4;
     --bg-soft: #f4faff;
     --fire-red: #d32f2f;
     --hover-blue: #086cef;
     --white: #ffffff;
     --dark: #333333;
     --nav-height-desktop: 70px;
     /* Desktop navbar fixed height */
     --nav-height-mobile: 70px;
     /* Mobile navbar fixed height */
 }



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

 body {
     font-family: 'Poppins', sans-serif;
     overflow-x: hidden;
     color: var(--dark);
 }

 /* --- Topbar --- */
 .topbar {
     background-color: #0c4da2;
     font-size: 13px;
     color: white;
     width: 100%;
 }

 .topbar a {
     color: #fff !important;
     transition: 0.3s;
     text-decoration: none;
 }

 /* --- Navbar Core --- */
 .navbar {
     height: var(--nav-height-desktop);
     /* Height ko fix kar diya */
     background: var(--white);
     padding: 0 !important;
     /* Padding 0 taaki height control mein rahe */
     display: flex;
     align-items: center;
     transition: all 0.3s ease;
     z-index: 1000;
 }

 /* Navbar Brand & Logo Logic */
 .navbar-brand {
     display: flex;
     align-items: center;
     padding: 0;
     margin: 0;
     position: relative;
     height: 100%;
     /* Brand container navbar ki height lega */
 }

 .nav-logo {
     /* Desktop par logo bada dikhega aur navbar se thoda bahar bhi nikal sakta hai */
     height: 50px;
     width: auto;
     /* margin-left: -70px; */
     object-fit: contain;
     transition: 0.3s all ease;
     filter: drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.1));
     z-index: 10;
 }

 /* Brand Text Logic */
 .logo-text-wrapper {
     display: flex;
     flex-direction: column;
     justify-content: center;
     margin-left: -10px;
 }

 .logo-text-main {
     color: var(--primary-blue);
     font-family: 'Montserrat', sans-serif;
     font-weight: 700;
     line-height: 1.1;
     font-size: 22px;
     /* Desktop size */
     text-transform: uppercase;
     /* margin-left: -80px; */
 }

 .logo-text-sub {
     color: var(--accent-orange);
     font-weight: 600;
     font-size: 16px;
     letter-spacing: 1px;
 }

 /* Nav Links */
 .nav-link {
     color: var(--primary-blue) !important;
     font-weight: 600;
     font-size: 15px;
     transition: 0.3s;
 }

 .nav-link:hover {
     color: var(--accent-orange) !important;
 }

 /* Call Button */
 .btn-call {
     background: var(--accent-orange);
     color: var(--primary-blue) !important;
     padding: 10px 25px !important;
     font-weight: 600;
     border-radius: 50px;
     white-space: nowrap;
     transition: 0.3s;
 }

 /* --- Media Queries for Responsiveness --- */

 /* Tablet & Smaller Desktops (Under 1200px) */
 @media (max-width: 1199.98px) {
     .logo-text-main {
         font-size: 10px;
     }

     .nav-logo {
         height: 50px;
     }
 }

 /* Mobile Devices (Under 992px) */
 @media (max-width: 991.98px) {
     .navbar {
         height: var(--nav-height-mobile);
         /* Height mobile ke liye fix */
     }

     .nav-logo {
         height: 60px;
         /* Mobile par logo chota ho jayega */
     }

     .logo-text-main {
         font-size: 10px;
         flex-wrap: wrap;
     }

     .logo-text-sub {
         font-size: 12px;
     }

     .navbar-collapse {
         background: var(--white);
         position: absolute;
         top: var(--nav-height-mobile);
         left: 0;
         right: 0;
         padding: 20px;
         box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
         text-align: center;
     }

     .nav-item {
         border-bottom: 1px solid #f1f1f1;
         padding: 10px 0;
     }
 }

 /* Super Small Mobile (320px to 400px) */
 @media (max-width: 400px) {
     .nav-logo {
         height: 50px;
         /* Sabse chote mobile par aur chota logo */
     }

     .logo-text-wrapper {
         max-width: 160px;
         /* Text wrap ho jaye taaki screen se bahar na nikle */
     }

     .logo-text-main {
         font-size: 12px;
     }

     .logo-text-sub {
         font-size: 10px;
     }

     .navbar-toggler {
         padding: 4px;
         font-size: 14px;
     }
 }

 /* Dropdown items hover effect */
 .dropdown-menu .dropdown-item {
     transition: all 0.3s ease;
 }

 .dropdown-menu .dropdown-item:hover {
     background-color: var(--accent-orange);
     /* ya koi bhi color */
     color: #fff;
 }

 /* Optional: active state bhi same jaisa ho */
 .dropdown-menu .dropdown-item:active {
     background-color: var(--accent-orange);
     color: #fff;
 }

 /* Dropdown header ko safe rakho (hover effect na lage) */
 .dropdown-menu .dropdown-header {
     color: #086cef;
     background: #f7941d;
     font-weight: 600;
 }

 /* Hero Section (Aapka existing section update) */
 .hero {
     height: clamp(350px, 60vh, 550px);
     background: linear-gradient(rgba(82, 68, 68, 0.6), rgba(0, 0, 0, 0.6)),
         url('../images/trans5.jpeg');
     background-size: cover;
     background-position: center;
     display: flex;
     align-items: center;
     color: white;
     text-align: center;
 }

 /* --- Service Detail Sections --- */
 .service-section {
     padding: 80px 0;
 }

 .service-section:nth-child(even) {
     background: #f9f9f9;
 }

 .service-image {
     border-radius: 20px;
     box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
     width: 100%;
     height: 350px;
     object-fit: cover;
 }

 .service-icon {
     font-size: 2.5rem;
     color: var(--accent-color);
     margin-bottom: 20px;
 }

 /* --- Counter Section --- */
 .counter-box {
     background: var(--primary-color);
     color: var(--primary-blue);
     padding: 60px 0;
     text-align: center;
 }

 .counter-number {
     font-size: 3rem;
     font-weight: 700;
     color: var(--bg-light);
 }

 /* --- Why Choose Us --- */
 .why-box {
     padding: 40px;
     border-radius: 15px;
     background: white;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
     border-bottom: 5px solid var(--success-color);
     height: 100%;
 }

 .why-box:hover {
     background: #f7941d;
 }

 /* Service Cards */
 .service-card {
     border: none;
     border-radius: 15px;
     transition: all 0.3s ease;
     height: 100%;
     overflow: hidden;
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
 }

 .service-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
 }

 .service-card i {
     font-size: 3rem;
     color: var(--secondary-color);
     margin-bottom: 15px;
 }

 .card-img-top {
     height: 200px;
     object-fit: cover;
 }

 /* --- Footer --- */
 footer {
     background: var(--primary-blue);
     color: white;
     padding: 60px 0 20px;
 }

 /* Mobile Adjustments (320px) */
 @media (max-width: 576px) {
     .navbar-brand span {
         font-size: 0.9rem;
     }

     .navbar-brand img {
         height: 48px;
     }

     .hero h1 {
         font-size: 2rem;
         margin-bottom: 10px;
     }

     .service-image {
         height: 250px;
     }

     .logo-text {
         font-size: 21px;
     }
 }

 @media(max-width:320px) {
     .logo-text {
         font-size: 15px;
     }
 }

 /* --contact-page-- */
 .contact-page-section {
     padding: 80px 0;
     background-color: var(--light-bg);
 }

 .title-line {
     height: 4px;
     width: 60px;
     background: var(--accent-color);
     margin: 15px auto;
     border-radius: 2px;
 }

 .contact-info-card {
     background: #fff;
     border-radius: 15px;
     transition: all 0.3s ease;
     border-left: 5px solid transparent;
 }

 .contact-info-card:hover {
     transform: translateY(-5px);
     border-left: 5px solid var(--primary-color);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
 }

 .contact-icon-box {
     width: 55px;
     height: 55px;
     background: rgba(12, 77, 162, 0.1);
     color: var(--primary-color);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.5rem;
     flex-shrink: 0;
 }

 .contact-form-wrapper {
     border-top: 5px solid var(--primary-color) !important;
 }

 .custom-input:focus {
     border-color: var(--primary-color);
     box-shadow: 0 0 0 0.25rem rgba(12, 77, 162, 0.15);
 }

 .btn-submit {
     background: var(--accent-color);
     color: white;
     border: none;
     transition: 0.3s;
 }

 .btn-submit:hover {
     background: var(--primary-color);
     color: white;
     transform: scale(1.02);
 }

 /* Mobile Responsive 320px */
 @media (max-width: 576px) {
     .contact-page-section {
         padding: 50px 0;
     }

     .display-5 {
         font-size: 1.8rem;
     }

     .contact-form-wrapper {
         padding: 25px 20px !important;
     }

     .contact-info-card {
         padding: 15px !important;
     }

     .contact-icon-box {
         width: 45px;
         height: 45px;
         font-size: 1.2rem;
     }
 }

 /* end */

 /* --About us section start-- */
 /* --- Hero Section --- */
 .gallery-hero {
     position: relative;
     height: 300px;
     background: linear-gradient(rgba(0.5, 0, 0, 0.5), rgba(0, 0, 0, 0.7)),
         url('/images/eimg3.jpg');
     /* Professional Industrial BG */
     background-size: contain;
     background-position: center;
     background-attachment: fixed;
     /* Parallax Effect */
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 .hero-content h1 {
     font-size: 3.5rem;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .hero-breadcrumb {
     font-size: 1.1rem;
     font-weight: 500;
 }

 .hero-breadcrumb a {
     color: var(--accent-orange);
     text-decoration: none;
 }

 /* --- Gallery Style --- */
 .service-title-box {
     border-left: 6px solid var(--accent-orange);
     padding-left: 15px;
     margin-bottom: 30px;
 }

 .service-title-box h3 {
     color: var(--primary-blue);
     font-weight: 700;
     margin-bottom: 5px;
 }

 .gallery-card {
     position: relative;
     border-radius: 15px;
     overflow: hidden;
     height: 280px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
     cursor: pointer;
     margin-bottom: 20px;
 }

 .gallery-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.6s ease;
 }

 .gallery-card:hover img {
     transform: scale(1.15);
 }

 .gallery-card-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(to top, rgba(12, 77, 162, 0.9), transparent);
     display: flex;
     align-items: flex-end;
     padding: 20px;
     opacity: 0;
     transition: 0.4s ease;
 }

 .gallery-card:hover .gallery-card-overlay {
     opacity: 1;
 }

 .gallery-card-overlay h5 {
     color: white;
     font-weight: 600;
     margin: 0;
     transform: translateY(20px);
     transition: 0.4s ease;
 }

 .gallery-card:hover .gallery-card-overlay h5 {
     transform: translateY(0);
 }

 /* --- Mobile Responsive (320px) --- */
 @media (max-width: 576px) {
     .gallery-hero {
         height: 300px;
     }

     .hero-content h1 {
         font-size: 2rem;
     }

     .gallery-card {
         height: 200px;
     }

     .service-title-box h3 {
         font-size: 1.3rem;
     }
 }

 /* --About us section end-- */



 /* Hero Section */
 .about-hero {
     background: linear-gradient(rgba(137, 149, 165, 0.8), rgba(12, 77, 162, 0.8)),
         url('/images/power1.jpeg');
     background-size: cover;
     background-position: center;
     padding: 100px 0;
     color: white;
     text-align: center;
 }

 /* General Styles */
 .section-padding {
     padding: 80px 0;
 }

 .service-img {
     border-radius: 20px;
     box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
     width: 100%;
     height: 350px;
     object-fit: cover;
     border-bottom: 8px solid var(--accent-orange);
 }

 .service-title {
     color: var(--primary-blue);
     font-weight: 700;
     margin-bottom: 20px;
     position: relative;
 }

 .service-title::after {
     content: '';
     position: absolute;
     bottom: -10px;
     left: 0;
     width: 60px;
     height: 4px;
     background: var(--success-green);
 }

 .row-reverse {
     flex-direction: row-reverse;
 }

 .accent-text {
     color: var(--accent-orange);
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 1px;
 }

 /* Responsive Adjustments for 320px */
 @media (max-width: 768px) {
     .section-padding {
         padding: 50px 0;
     }

     .service-img {
         height: 250px;
         margin-bottom: 30px;
     }

     .about-hero {
         padding: 60px 0;
     }

     .display-4 {
         font-size: 2.2rem;
     }

     .logo-text {
         margin-left: -382px;
         font-size: 21px;
     }
 }


 /* WATER SUPPLY SERVICE PAGE START  */



 /* Hero Section */
 .water-hero {
     background: linear-gradient(rgba(37, 35, 62, 0.7), rgba(4, 11, 210, 0.7)),
         url('/images/water8.jpg');
     background-size: cover;
     background-position: center;
     height: 300px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 /* Content Styling */
 .water-section {
     padding: 80px 0;
 }

 .img-frame {
     position: relative;
     padding: 10px;
     background: white;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     border-radius: 15px;
 }

 .img-frame img {
     width: 100%;
     height: 300px;
     object-fit: cover;
     border-radius: 10px;
 }

 .img-frame::after {
     content: '';
     position: absolute;
     top: -10px;
     right: -10px;
     width: 100px;
     height: 100px;
     border-top: 5px solid var(--accent-orange);
     border-right: 5px solid var(--accent-orange);
     z-index: -1;
 }

 .service-tag {
     background: var(--soft-blue);
     color: var(--primary-blue);
     padding: 5px 15px;
     border-radius: 50px;
     font-weight: 600;
     font-size: 0.8rem;
     display: inline-block;
     margin-bottom: 15px;
 }

 .feature-list {
     list-style: none;
     padding: 0;
 }

 .feature-list li {
     margin-bottom: 10px;
     display: flex;
     align-items: center;
 }

 .feature-list li i {
     color: var(--success-green);
     margin-right: 10px;
 }

 .cta-bar {
     background: var(--primary-blue);
     color: white;
     padding: 40px 0;
     border-radius: 20px;
     margin-top: -50px;
     position: relative;
     z-index: 10;
 }

 @media (max-width: 1640px) {
     .logo-text {
         font-size: 17px;
         margin-left: -22px;
     }
 }

 /* Responsive for 320px */
 @media (max-width: 576px) {
     .water-hero {
         height: 300px;
     }

     .water-section {
         padding: 50px 0;
     }

     .img-frame img {
         height: 200px;
     }

     .display-5 {
         font-size: 1.8rem;
     }
 }

 /* MAIN CONTENT START (HT/LT ELECTRICAL SERVICES */

 /* Hero Section for Services */
 .service-hero {
     background: linear-gradient(rgba(134, 169, 215, 0.85), rgba(0, 0, 0, 0.7)),
         url('/images/eimg3.jpg');
     background-size: cover;
     background-position: center;
     height: 300px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 .service-section {
     padding: 80px 0;
     overflow: hidden;
 }

 .service-section:nth-child(even) {
     background-color: var(--bg-light);
 }

 .service-img-wrapper {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
     border-bottom: 8px solid var(--primary-blue);
 }

 .service-img-wrapper img {
     width: 100%;
     height: 400px;
     object-fit: cover;
     transition: 0.5s;
 }

 .service-img-wrapper:hover img {
     transform: scale(1.08);
 }

 .voltage-tag {
     color: var(--accent-orange);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 2px;
     margin-bottom: 10px;
     display: block;
 }

 .service-title {
     color: var(--primary-blue);
     font-weight: 800;
     margin-bottom: 20px;
 }

 .check-list {
     list-style: none;
     padding: 0;
 }

 .check-list li {
     margin-bottom: 15px;
     display: flex;
     align-items: flex-start;
     font-size: 1.05rem;
 }

 .check-list li i {
     color: var(--success-green);
     margin-right: 15px;
     margin-top: 5px;
     font-size: 1.2rem;
 }

 /* Mobile Responsive 320px */
 @media (max-width: 768px) {
     .service-hero {
         height: 300px;
     }

     .service-section {
         padding: 50px 0;
     }

     .service-img-wrapper img {
         height: 280px;
     }

     .display-4 {
         font-size: 2rem;
     }

     .service-title {
         font-size: 1.6rem;
     }
 }

 /* MAIN CONTENT START (CRANE & LIFT SERVICES) */


 /* Hero Banner */
 .crane-hero {
     background: linear-gradient(rgba(110, 138, 175, 0.8), rgba(49, 30, 221, 0.7)),
         url('/images/crane.jpeg');
     background-size: cover;
     background-position: center;
     height: 300px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 /* Section Styles */
 .lifting-section {
     padding: 80px 0;
     overflow: hidden;
 }

 .lifting-section:nth-child(even) {
     background-color: var(--bg-gray);
 }

 .lifting-img-wrapper {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
     border-bottom: 8px solid var(--accent-orange);
 }

 .lifting-img-wrapper img {
     width: 100%;
     height: 400px;
     object-fit: cover;
     transition: 0.5s ease;
 }

 .lifting-img-wrapper:hover img {
     transform: scale(1.08);
 }

 .service-tag {
     color: var(--accent-orange);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 2px;
     display: block;
     margin-bottom: 10px;
 }

 .service-heading {
     color: var(--primary-blue);
     font-weight: 800;
     margin-bottom: 20px;
 }

 .feature-list {
     list-style: none;
     padding: 0;
 }

 .feature-list li {
     margin-bottom: 15px;
     display: flex;
     align-items: flex-start;
     font-size: 1.05rem;
 }

 .feature-list li i {
     color: var(--success-green);
     margin-right: 15px;
     margin-top: 5px;
     font-size: 1.2rem;
 }

 /* Responsive for 320px */
 @media (max-width: 768px) {
     .crane-hero {
         height: 300px;
     }

     .lifting-section {
         padding: 50px 0;
     }

     .lifting-img-wrapper img {
         height: 280px;
     }

     .display-4 {
         font-size: 2.2rem;
     }

     .service-heading {
         font-size: 1.7rem;
     }
 }

 /* MAIN CONTENT START (HVAC & VENTILATION SERVICES) */


 /* Hero Banner */
 .hvac-hero {
     background: linear-gradient(rgba(69, 123, 193, 0.8), rgba(37, 29, 195, 0.7)),
         url('/images/hvac1.jpeg');
     background-size: cover;
     background-position: center;
     height: 300px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 /* Section Styles */
 .hvac-section {
     padding: 80px 0;
     overflow: hidden;
 }

 .hvac-section:nth-child(even) {
     background-color: var(--bg-soft);
 }

 .hvac-img-wrapper {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
     border-bottom: 8px solid var(--hvac-cyan);
 }

 .hvac-img-wrapper img {
     width: 100%;
     height: 400px;
     object-fit: cover;
     transition: 0.6s ease;
 }

 .hvac-img-wrapper:hover img {
     transform: scale(1.1);
 }

 .service-tag {
     color: var(--accent-orange);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 2px;
     display: block;
     margin-bottom: 10px;
 }

 .service-heading {
     color: var(--primary-blue);
     font-weight: 800;
     margin-bottom: 20px;
 }

 .hvac-feature-list {
     list-style: none;
     padding: 0;
 }

 .hvac-feature-list li {
     margin-bottom: 15px;
     display: flex;
     align-items: flex-start;
     font-size: 1.05rem;
 }

 .hvac-feature-list li i {
     color: var(--hvac-cyan);
     margin-right: 15px;
     margin-top: 5px;
     font-size: 1.2rem;
 }

 /* Responsive for 320px */
 @media (max-width: 768px) {
     .hvac-hero {
         height: 300px;
     }

     .hvac-section {
         padding: 50px 0;
     }

     .hvac-img-wrapper img {
         height: 260px;
     }

     .display-4 {
         font-size: 2.2rem;
     }

     .service-heading {
         font-size: 1.6rem;
     }
 }

 /* MAIN CONTENT START (FIRE FIGHTING SERVICES) */



 /* Hero Banner */
 .fire-hero {
     background: linear-gradient(rgba(224, 178, 178, 0.75), rgba(65, 57, 57, 0.75)),
         url('/images/Fire.webp');
     background-size: cover;
     background-position: center;
     height: 300px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: white;
 }

 /* Section Styles */
 .fire-section {
     padding: 80px 0;
     overflow: hidden;
 }

 .fire-section:nth-child(even) {
     background-color: #f8f9fa;
 }

 .fire-img-wrapper {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
     border-bottom: 8px solid var(--fire-red);
 }

 .fire-img-wrapper img {
     width: 100%;
     height: 400px;
     object-fit: cover;
     transition: 0.6s ease;
 }

 .fire-img-wrapper:hover img {
     transform: scale(1.1);
 }

 .service-tag {
     color: var(--fire-red);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 2px;
     display: block;
     margin-bottom: 10px;
 }

 .service-heading {
     color: var(--primary-blue);
     font-weight: 800;
     margin-bottom: 20px;
 }

 .fire-feature-list {
     list-style: none;
     padding: 0;
 }

 .fire-feature-list li {
     margin-bottom: 15px;
     display: flex;
     align-items: flex-start;
     font-size: 1.05rem;
 }

 .fire-feature-list li i {
     color: var(--fire-red);
     margin-right: 15px;
     margin-top: 5px;
     font-size: 1.2rem;
 }

 /* Responsive for 320px */
 @media (max-width: 768px) {
     .fire-hero {
         height: 300px;
     }

     .fire-section {
         padding: 50px 0;
     }

     .fire-img-wrapper img {
         height: 260px;
     }

     .display-4 {
         font-size: 2.2rem;
     }

     .service-heading {
         font-size: 1.6rem;
     }
 }

 @media (max-width:425px) {
     .mobile-num {
         display: block;
     }
 }

 @media (max-width:400px) {
     .logo-text-main {
         text-align: center;
     }
 }

 @media (min-width:400px) and (max-width:500px) {
     .logo-text-main {
         font-size: 11px;
     }
 }

 @media (min-width:501px) and (max-width:1200px) {
     .logo-text-main {
         font-size: 15px;
     }
 }

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