#slider-image {

  height: 600px;

  object-fit: cover;

  display: block;

  width: 100%;

  filter: saturate(110%);

  transition: transform .7s var(--ease), filter .7s var(--ease);

}

.jobdetailsahref{

  text-decoration: none;

  color: white;

}

.image-slider {

  height: 600px;

  overflow: hidden;

  margin-top: 0 !important;

  padding-top: 0 !important;

}



.image-wrapper {

  position: relative;

  display: block;

  width: 100%;

  height: 600px;

  overflow: hidden;

  background-color: #f8f9fa;

}



.image-wrapper img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.image-slider {

  width: 100%;

}



.overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(to bottom, rgba(1,28,56,.35), rgba(1,28,56,.55));

  pointer-events: none;

}



.carousel-inner {

  position: relative;

  height: 600px;

  overflow: hidden;

  width: 100%;

}



.carousel-item {

  height: 600px;

  overflow: hidden;

  width: 100%;

}



.carousel-inner .caption-one {

  position: absolute;

  bottom: 30px;

  z-index: 100;

  left: 50%;

  transform: translateX(-50%);

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}



.caption-one h3 {

  text-align: center;

  font-size: 44px;

  font-weight: 700;

  margin-bottom: 55px;

  color: white;

}



.caption-one p {

  text-align: center;

  width: 650px;

  margin: auto;

  font-size: 20px;

  font-weight: 400;

  margin-bottom: 30px;

  color: white;

}



.caption-one button {

  padding: 12px 18px;

  border-radius: 999px;

  background: var(--brand-accent);

  color: #06253f;

  border: none;

  margin-bottom: 20px;

  font-weight: 700;

}



/* overview section */

.overview {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  gap: 40px 0;

  margin-top: 0;

  /* border: 2px solid red; */

  padding: 10px;

  background: linear-gradient(180deg, #eef6ff 0%, #ffffff 40%);

}



.overview .one {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  gap: 35px 0;

  width: 90%;

  /* border: 2px solid yellow; */

}



.overview .one h1 {

  font-size: 35px;

  font-weight: 700;

  text-align: center;

}



.overview .one p {

  width: 70%;

  text-align: center;

  font-size: 18px;

  font-weight: 600;

}



.overview .two {

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

  /* border: 2px solid red; */

  width: 80%;



  gap: 20px;

}



.two .services {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}



.two .services i {

  font-size: 120px;

}



/* Home carousel hover depth */

.carousel-item.active #slider-image {

  transform: scale(1.03);

  filter: saturate(120%);

}



/* css for header and footer */

.app-footer {

  display: flex;

  flex-direction: column;

  padding: 5%;

  height: fit-content;

  gap: 10px;

  color: #ffff;

  background-color: #011c38;

}



.app-footer .brand {

  font-size: 25px;

}



.app-footer .brand-slogan {

  font-size: 15px;

  font-weight: bold;

}



.login-btn {

  text-decoration: none;

  color: #ffff;

}



.register-btn {

  text-decoration: none;

  color: #011c38;

  background-color: #0dcaf0;

  padding: 5px;

  border-radius: 5px;

  width: fit-content;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: 0.2s ease-in-out;

}



.register-btn:hover {

  background-color: #00aacc;

}



.footer-list {

  display: flex;

  flex-direction: column;

  list-style: none;

  margin-left: 0;

  padding: 0;

}



.footer-list li {

  transition: 0.3s ease-in-out;

}



.footer-list li:hover {

  opacity: calc(0.5);

  cursor: pointer;

}



.navitem {

  padding: 2%;

  width: 100%;

  font-size: 20px;

  transition: 0.3s ease-in-out;

}



/* Force white icons in dark navbar across pages */

/* .navbar.navbar-dark .navbar-brand i,

.navbar.navbar-dark .nav-link i,

.navbar.navbar-dark .dropdown-toggle i {

  color: #ffffff !important;

}



.navbar.navbar-dark .nav-link:hover i,

.navbar.navbar-dark .nav-link.active i {

  color: #ffffff !important;

}



.navitem:hover {

  background-color: #dddddd;

  color: white !important;

}



.offcanvas-body {

  padding: 0 !important;

}



.navbar-toggler:focus {

  box-shadow: none !important;

} */



/* recent job posts */

.recent-posts {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  padding: 40px 10px 20px 10px;

  background: hsl(210, 83%, 24%);

  gap: 40px;

}



.recent-posts .head {

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

  gap: 10px 0;

  padding: 0 10px;

}



.recent-posts .head h1 {

  font-size: 35px;

  font-weight: 700;

  text-align: center;

  color: white;

}



.recent-posts .head p {

  text-align: center;

  font-size: 20px;

  letter-spacing: 2px;

  font-weight: 400;

  color: white;

}



.job-listings {

  display: flex;

  flex-direction: column;

  gap: 20px;

  max-width: 1000px;

  width: 100%;

}



.job-box {

  background: white;

  padding: 40px;

  border-radius: 10px;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

}



.job-header {

  display: flex;

  justify-content: space-between;

  margin-bottom: 10px;

}



.created-at,

.save {

  background: #bbd0e5;

  padding: 5px 10px;

  border-radius: 5px;

  font-size: 12px;

  font-weight: bold;

  color: #042d56;

}



.job-details {

  display: flex;

  align-items: center;

  margin-bottom: 15px;

}



.company-logo img {

  width: 50px;

  height: 50px;

  border-radius: 50%;

  margin-right: 10px;

}



.job-info h1 {

  font-size: 18px;

  margin: 0;

}



.job-info p {

  font-size: 14px;

  color: gray;

}



.job-meta {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  align-items: center;

  gap: 20px 0;

}



.ok {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

  font-size: 12px;

  color: gray;



  align-items: center;

}



.meta-item {

  display: flex;

  align-items: center;

  gap: 5px;

}



.job-details-btn {

  background: #042d56;

  color: white;

  padding: 10px;

  border: none;

  border-radius: 5px;

  cursor: pointer;

}



/* reviews section */

.reviews {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  padding: 40px 10px 30px 10px;

  background: hsl(0, 0%, 100%);

  gap: 30px;

}



.reviews .head {

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

  gap: 10px 0;

  padding: 0 10px;

}



.reviews .head h1 {

  font-size: 35px;

  font-weight: 700;

  text-align: center;

}



.reviews .head p {

  text-align: center;

  font-size: 20px;

  letter-spacing: 2px;

  font-weight: 400;

}



.reviews .review-cont {

  display: flex;

  justify-content: center;

  gap: 20px;

  max-width: 1000px;

  width: 100%;

  flex-wrap: wrap;

  position: relative;

}



.reviews .review-cont .review-box {

  padding: 20px 20px;

  width: 300px;

  display: flex;

  align-items: center;

  flex-direction: column;

  /* gap: 20px 0; */

  border-radius: 30px;

  background: linear-gradient(to bottom, #042d56, white);

}



.review-cont .review-box .star {

  margin: auto;

  gap: 0 3px;

}



.review-cont .review-box .stars i {

  color: yellow;

  font-size: 25px;

}



.review-cont .review-box p {

  text-align: center;

  font-size: 20px;

  font-weight: 500;

  margin-top: 20px;

}



.review-cont .review-box .divider {

  height: 2px;

  width: 70%;

  background: #042d56;

  margin-top: 10px;

}



.review-cont .review-box .profile {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-top: 30px;

}



.review-cont .review-box .profile img {

  width: 50px;

  height: 50px;

  border-radius: 50%;

  margin-right: 10px;

}



.review-cont .review-box .profile .data {

  display: flex;

  flex-direction: column;

  gap: 0;

}



.review-cont .review-box .profile .data h5 {

  font-size: 19px;

  font-weight: 600;

  margin: 0;

}



.review-cont .review-box .profile .data p {

  margin: 0;

  font-size: 14px;

  font-weight: 400;

  text-align: start;

}



@media (max-width: 790px) {

  #slider-image {

    height: 500px;

  }

  

  .image-slider {

    height: 500px;

  }

  

  .image-wrapper {

    height: 500px;

  }

  

  .carousel-inner {

    height: 500px;

  }

  

  .carousel-item {

    height: 500px;

  }



  .carousel-inner .caption-one {

    width: 82%;

  }



  .caption-one h3 {

    font-size: 35px;

    margin-bottom: 45px;

    width: 90%;

  }



  .caption-one p {

    width: 90%;

    font-size: 18px;

  }



  .overview .one p {

    width: 95%;

    font-size: 16px;

  }



  .overview .two {

    padding: 0 20px;

    width: 100%;

    align-items: center;

    gap: 10px;

  }



  .recent-posts .head h1 {

    font-size: 30px;

  }



  .recent-posts .head p {

    font-size: 17px;

  }

}



@media (max-width: 430px) {

  #slider-image {

    height: 400px;

  }

  

  .image-slider {

    height: 400px;

  }

  

  .image-wrapper {

    height: 400px;

  }

  

  .carousel-inner {

    height: 400px;

  }

  

  .carousel-item {

    height: 400px;

  }



  .caption-one h3 {

    font-size: 27px;

    margin-bottom: 35px;

    width: 95%;

  }



  .caption-one p {

    width: 95%;

    font-size: 17px;

  }



  .caption-one button {

    padding: 7px 10px;

    font-size: 14px;

  }



  .job-box {

    padding: 15px;

  }



  .reviews .review-cont .review-box {

    width: 100%;

  }



  .two .services i {

    font-size: 80px;

  }

}



@media (max-width: 312px) {

  .two .services i {

    font-size: 60px;

  }

}



/* student page css  */



.offcanvas-body {

    padding: 0 !important;

}

.navbar-toggler:focus{

    box-shadow: none !important;

}

#profile-icon {

    width: 30px;

    height: 30px;

    object-fit: cover;

    border-radius: 20px;

}

#notification-bell {

    outline: none;

    border: none;

    font-size: 23px;

    border-radius: 20px;

    transition: 0.3s ease-in-out;

}

#notification-bell:hover {

    background-color: #aaaaaa;

}

#search:focus {

    outline: none;

}

#search {

    border: none;

    width: 40vw;

}

.search {

    display: flex;

    align-items: center;

    padding: 10px;

    gap: 5px;

    border: 0.3px solid #aaaaaa;

    border-radius: 30px;

}



.link {

   color: black !important;

   

}

.section-main {

   padding: 10%;

   

   height: auto;

   color: rgb(0, 0, 0);

}

.internship-column {

    padding: 5%;

    width: 100%;

    height: fit-content;

    border-radius: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

}

.chart-column {

    height: 50vh;

    border-radius: 20px;

    padding: 2%;

}

.badges-column {

    height: 50vh;

    border-radius: 20px;

    padding: 2%;

}

.cards {

    list-style: none;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5%;

}

.cards .card-item {

    display: flex;

    flex-direction: column;

    align-items: left;

    justify-content: center;

    background-color: #31baff;

    border-radius: 20px;

    padding: 10px;

}

#image {

    width: 240px;

    height: 127.5px;

    margin-bottom: 20px;

    border-radius: 20px;

}

.img {

    position: relative;

    bottom: 30px;

}

#apply-btn {

    padding: 2%;

    height: fit-content;

    font-size: 20px;

    outline: none;

    border: none;

    border-radius: 20px;

    background-color: rgb(255, 255, 53);

}

#see-all-btn {

    border-radius: 20px;

    width: fit-content;

    color: rgb(0, 119, 255);

    font-weight: bold;

    border: 2px solid rgb(0, 119, 255);

    transition: 0.3s ease-in-out;

}

#see-all-btn:hover {

    background-color: rgb(0, 119, 255);

    color: #ffff;

}



/* company page css */

/* === Statistics === */

.stats {

  background: #e7eff8;

  padding: 60px 20px;

  text-align: center;

  border-radius: 14px;

  margin: 30px auto;

  max-width: 1200px;

}



.stats h2 {

  font-weight: bold;

  margin-bottom: 40px;

  color: #011c38;

}



.stat-box {

  background-color: #0b2f55;

  color: #ffffff;

  padding: 22px 26px;

  border-radius: 14px;

  margin: 14px auto;

  font-size: 1.05rem;

  font-weight: 700;

  min-width: 220px;

  text-align: center;

  box-shadow: var(--shadow-sm);

  transition: transform .18s var(--ease), box-shadow .18s var(--ease);

}



.stat-box:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }



/* === About Us Section === */

.pagef { padding: 60px 20px; background: #244966; color: #eef6ff; }



.pagef h1 { text-align: center; font-weight: bold; color: #ffffff; margin-bottom: 40px; }



.third {

  display: flex;

  flex-wrap: wrap;

  gap: 30px;

  align-items: center;

  justify-content: center;

  margin-bottom: 50px;

}



.third img { max-width: 420px; width: 100%; border-radius: 12px; box-shadow: var(--shadow-sm); }



.third p { flex: 1; font-size: 1.05rem; color: #e6eef8; }



.header-bar { font-size: 1.35rem; font-weight: 700; text-align: center; color: #fff; background-color: #0b2f55; padding: 14px 18px; margin: 26px auto 30px; border-radius: 12px; max-width: 520px; }



/* === Job Cards === */

.job-card {

  border: 1px solid #ccc;

  border-radius: 10px;

  padding: 20px;

  margin-bottom: 30px;

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);

}



.time-badge {

  float: right;

  background: #6f42c1;

  color: white;

  padding: 5px 10px;

  border-radius: 20px;

  font-size: 0.8rem;

}



.job-header {

  display: flex;

  align-items: center;

  gap: 20px;

}



.company-logo {

  width: 60px;

  height: 60px;

  border-radius: 50%;

}



.job-details span {

  display: inline-block;

  margin-right: 20px;

  margin-top: 10px;

  color: #444;

}



.job-footer {

  margin-top: 15px;

  display: flex;

  justify-content: space-between;

  align-items: center;

}



.apply-btn {

  background-color: #011c38;

  color: white;

  border: none;

  padding: 8px 18px;

  border-radius: 5px;

}



/* === Form === */

.form-container {

  background: #1e4261;

  padding: 32px;

  border-radius: 12px;

}



.form-title { text-align: center; font-size: 1.6rem; margin-bottom: 22px; color: #ffffff; background: #0b2f55; padding: 10px 16px; border-radius: 10px; display: inline-block; }



.form label { font-weight: 700; margin-top: 12px; color: #ffffff; }



.input { width: 100%; padding: 12px; border-radius: 10px; margin-top: 6px; border: 1px solid #cfd8e3; background: #ffffff; }



.row .column {

  flex: 1;

  padding: 10px;

}



.submit-btn { background-color: #0b2f55; color: #ffffff; border: none; padding: 12px 24px; border-radius: 12px; margin-top: 20px; font-weight: 700; box-shadow: var(--shadow-sm); }

.submit-btn:hover { background-color: #0f3c6f; }



/* contact page css  */



.contact-text h2,

.contact-form-box h3 {

  font-family: 'Roboto', sans-serif;

}

/* css for header and footer */

.login-btn {

  text-decoration: none;

  color: #ffff;

}



.register-btn {

  text-decoration: none;

  color: #011c38;

  background-color: #0dcaf0;

  padding: 5px;

  border-radius: 5px;

  width: fit-content;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: 0.2s ease-in-out;

}



.register-btn:hover {

  background-color: #00aacc;

}



.contact-header {

  text-align: center;

  background-color: #000;

  color: white;

  padding: 2rem;

  height: 100px;

}



.contact-header h1 {

  font-size: 2rem;

}



/* ===== Contact Section ===== */

/* Contact Section Styling */

.contact-section {

  padding: 60px 20px;

  background: #fff;

}



.contact-container {

  display: flex;

  flex-wrap: wrap;

  gap: 40px;

  justify-content: center;

  align-items: flex-start;

  max-width: 1400px;

  /* Increased the max-width */

  margin: auto;

  padding: 5px 25px 5px 25px;

  /* Added padding to make it spacious */

}



.contact-text {

  flex: 1;

  min-width: 300px;



}



.contact-text h2 {

  font-size: 35px;

  font-weight: 700;

  margin-top: 40px;

  margin-bottom: 15px;

}



.contact-text p {

  color: #555;

  margin-bottom: 30px;

  font-size: small;

}



.contact-info {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 40px;

}



.info-box {

  display: flex;

  gap: 15px;

  align-items: flex-start;

}



.info-box i {

  font-size: 20px;

  color: #1e3a8a;

  margin-top: 5px;

}



.info-box h4 {

  font-size: 15px;

  font-weight: 600;

  margin: 20px 0px 20px 0px;

}



.info-box p {

  margin: 2px 0 0;

  color: #333;

}



/* Contact Form Styling */



.contact-form-box {

  background-color: #cbdcf0;

  padding: 30px;

  border-radius: 10px;

  max-width: 400px;

  flex: 1;

  min-width: 280px;

}





.contact-form-box h3 {

  margin-bottom: 5px;

  font-weight: 700;

  color: #0f172a;

  text-align: center;

}



.contact-form-box p {

  font-size: 14px;

  margin-bottom: 20px;

  color: #334155;

  text-align: center;

}



.contact-form .row {

  display: flex;

  gap: 15px;

  /* margin-bottom: 15px; */



}



.contact-form .form-group {



  gap: 30px;

  margin-right: 20px;

  width: 95%;

}



.contact-form input,

.contact-form textarea {

  width: 100%;

  padding: 10px;

  border: none;



  border-radius: 5px;

  font-size: 14px;

}



.contact-form input {

  flex: 1;



}



.contact-form textarea {

  resize: none;

  margin-bottom: 15px;



}



.contact-form button {

  width: 50%;

  padding: 10px;

  background-color: #0f295e;

  color: white;

  border: none;

  border-radius: 6px;

  cursor: pointer;

  font-weight: 600;

  font-size: 14px;

}



.contact-form button:hover {

  background-color: #1e3a8a;

}



.contact-form .form-group {

  display: flex;

  flex-direction: column;

  margin-bottom: 15px;

  flex: 1;

}



.contact-form label {

  margin-bottom: 5px;

  font-weight: 600;

  font-size: 13px;

  color: #1e293b;

}





/* ===== Map Section ===== */

.map-container {

  margin: 2rem 4%;

}



.map-container iframe {

  width: 100%;

  height: 300px;

  border: none;

  border-radius: 8px;

}



.partners {

  background-color: #ffffff;

  padding: 30px 0;

  text-align: center;

}



.partner-logos {

  display: flex;

  justify-content: flex-start;

  align-items: center;

  gap: 60px;

  /* Adjust the space between logos */

  overflow-x: auto;

  /* Enable horizontal scrolling */

  padding: 20px 0;

  white-space: nowrap;

  /* Prevent logos from wrapping to the next line */

}



/* Style each logo image */

.partner-logos img {

  max-height: 40px;

  /* Adjust the size of the logos */

  opacity: 0.6;

  /* Apply opacity for a slightly faded effect */

  transition: transform 0.3s ease, opacity 0.3s ease;

  /* Smooth hover transition */

  flex-shrink: 0;

  /* Prevent logos from shrinking */

}



/* Hover effect for logos */

.partner-logos img:hover {

  opacity: 1;

  transform: scale(1.05);

  /* Slightly enlarge the logo on hover */

}



.partners {

  background-color: #ffffff;

  padding: 30px 0;

  text-align: center;

}



.partner-logos {

  display: flex;

  justify-content: flex-start;

  align-items: center;

  gap: 60px;

  /* Adjust the space between logos */

  overflow-x: hidden;

  /* Hide the scrollbar */

  padding: 20px 0;

  white-space: nowrap;

  /* Prevent logos from wrapping to the next line */

  cursor: pointer;

  /* Optional: Change the cursor to indicate scrollable content */

}



.partner-logos:hover {

  overflow-x: auto;

  /* Enable horizontal scrolling when hovered */

}



/* Style each logo image */

.partner-logos img {

  max-height: 40px;

  /* Adjust the size of the logos */

  opacity: 0.6;

  /* Apply opacity for a slightly faded effect */

  transition: transform 0.3s ease, opacity 0.3s ease;

  /* Smooth hover transition */

  flex-shrink: 0;

  /* Prevent logos from shrinking */

}



/* Hover effect for logos */

.partner-logos img:hover {

  opacity: 1;

  transform: scale(1.05);

  /* Slightly enlarge the logo on hover */

}



/* ===== Media Queries ===== */

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

  /* .navbar {

      flex-direction: column;

      align-items: flex-start;

    }

  

    .nav-links {

      flex-direction: column;

      margin-top: 1rem;

      gap: 0.5rem;

    }

  

    .nav-buttons {

      margin-top: 1rem;

      width: 100%;

      justify-content: flex-start;

    } */



  .contact-section {

    flex-direction: column;

    padding: 2rem 1rem;

  }



  .contact-left,

  .contact-right {

    padding: 0;

  }



  .partners {

    gap: 1rem;

  }



}



/* job details page css  */

.job-content {

  flex: 3;

  background: #fff;

  padding: 2rem;

  border-radius: 8px;

  min-width: 300px;

}



.sidebar {

  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 2rem;

  min-width: 280px;

}



.job-description {

  max-width: 1400px;

}



.job-description ul li {

  list-style: none;

}



.job-header{

  margin: 0.5rem 0;

  padding: 30px ;

}



.job-tags {

  display: flex;

  flex-wrap: wrap;

  gap: 0.5rem;

}



.job-tags span {

  font-size: 0.9rem;

  

  display: inline-flex;

  align-items: center;

  max-width: 150px;

  gap: 5px;

}





.apply-btn {

  display: inline-block;

  margin-top: 1rem;

  padding: 0.4rem 0.8rem;

  background: #052b6c;

  color: white;

  border-radius: 10px;

  text-decoration: none;

  margin-left: auto;

  display: block;

  text-align: center;

  min-width: 400px;

}



i {

  color: #052b6c;

}



.responsibilities li,

.skills li {

  margin: 1rem 0;

}



.share {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-top: 20px;

  flex-wrap: wrap;

}



.share p {

  margin: 0;

  font-weight: bold;

}



.share a {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 32px;

  height: 32px;

  background-color: #f1f1f1;

  color: #000;

  border-radius: 50%;

  text-decoration: none;

  font-size: 16px;

  transition: background-color 0.3s, color 0.3s;

}



.share a:hover {

  background-color: #000;

  color: #fff;

}



.share a i {

  color: #000;

}



.tags span {

  background: #c5d9f3;

  padding: 5px 10px;

  margin: 5px;

  display: inline-block;

  border-radius: 10px;

}



.job-overview {

  background: #bac6d6;

  padding: 1rem;

  border-radius: 8px;

  max-width: 400px;

}



.job-overview ul li {

  list-style: none;

  margin: 0.5rem 0;

}



.job-overview ul li p {

  margin-left: 30px;

}



.contact-form {

  background: #c5d9f3;

  padding: 2rem;

  border-radius: 8px;

  max-width: 400px;

}



.contact-form input,

.contact-form textarea {

  width: 100%;

  margin: 0.5rem 0;

  padding: 0.5rem;

  border-radius: 10px;

  border: 1px solid #ccc;

}



.contact-form textarea {

  min-height: 80px;

}



.contact-form button {

  background: #052b6c;

  color: white;

  border: none;

  padding: 1rem;

  width: 100%;

  border-radius: 10px;

  font-weight: bold;

}



.related-jobs {

  padding: 2rem;

}



.map img {

  border-radius: 10px;

  width: 100%;

  height: auto;

}



.time-posted {

  font-size: 0.9rem;

  background: #c5d9f3;

  color: black;

  padding: 0.2rem 0.5rem;

  border-radius: 10px;

  display: inline-block;

  margin-bottom: 5px;

}



.job-card {

  background: white;

  padding: 1rem;

  margin: 1rem 0;

  border-radius: 8px;

}





.job-card .job-header {

  display: flex;

  align-items: center;

  gap: 10px;

}



.job-card .job-header img {

  width: 32px;

  height: 32px;

  border-radius: 50%;

  object-fit: cover;

}



.job-card p {

  margin-left: 25px;

}



.btn-details {

  display: inline-block;

  margin-top: 1rem;

  padding: 0.4rem 0.8rem;

  background: #052b6c;

  color: white;

  border-radius: 10px;

  text-decoration: none;

  margin-left: auto;

  display: block;

  text-align: center;

  max-width: 120px;

}







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

  .container {

    flex-direction: column;

  }



  .apply-btn,

  .btn-details {

    margin-left: 0;

  }

}



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

  .job-header h2 {

    font-size: 1.3rem;

  }



  .job-tags {

    flex-direction: column;

    gap: 5px;

  }



  .job-card {

    padding: 1rem 0.5rem;

  }

}



/* job listing page css  */



.joblisting{

  font-family: Arial, sans-serif;

  background-color: #f4f4f4;

  background: hsl(210, 83%, 24%);

  min-height: 100vh;

}

.body {

  background-color:#001a3f;

  display: flex;

  justify-content: center;

  align-items: center;

  min-height: 100vh;

  padding: 20px;

  background: hsl(210, 83%, 24%);

}

.main {

  width: 100vw;

  display: flex;

  gap: 10px;

  justify-content: space-between;

  flex-direction: row-reverse;

}





.go-b-1 {

  display: flex;

  padding: 0 20px;

  padding-top: 5px;

}

.go-b-1 a{

  color:hsl(210, 83%, 24%) ;

  background: white;

  text-decoration: none;

  padding: 8px 20px;

  font-size: 20px;

  border-radius: 7px;

  font-weight: 600;

}



.sidebar {

  width: 25%;

  background: #bbd0e5;

  padding: 7px 20px;

  border-radius: 10px;

  height: fit-content;

  display: flex;

  flex-direction: column;

  position: relative;

}

.sidebar #job-title{

  margin:0 ;

}

.sidebar .h3 {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin: 0;

  top: 0;

  z-index: 1;

  padding: 0;

}

.sidebar .h3 h3{

  margin: 15px 0;

}



.sidebar .h3 button {

  display: none;

  background: none;

  font-size: 30px;

  color: black;

  border: none;

  cursor: pointer;

  display: none;

}

.sidebar input[type="text"]{

     cursor: text;

     width: 83%;

}

.sidebar input,

.sidebar select {

  width: 90%;

  padding: 8px;

  margin-bottom: 10px;

  border-radius: 5px;

  border: 1px solid #ccc;

  outline: none;

  cursor: pointer;

}

#filterForm {

  display: flex;

  flex-direction: column;

  flex-grow: 1;

  height: 100%;



}

.sidebar input[type="radio"] {

  width: auto;

}

.sidebar label {

  display: block;

  margin-bottom: 6px;

  white-space: nowrap;

  font-size: 16px;

  cursor: pointer;

}

.over {

  overflow-y: auto;

  flex-grow: 1;

  margin-bottom: 10px;

  padding-right: 10px;

}

.sidebar button.submit {

  display: none;

  width: 100%;

  position: sticky;

  bottom: 0;

  padding: 10px;

  background: #042d56;

  color: white;

  border: none;

  border-radius: 5px;

  cursor: pointer;

  margin-top: auto;

}



.job-listings {

  display: flex;

  flex-direction: column;

  gap: 20px;

  width: 70%;

}



.job-box {

  background: white;

  padding: 40px;

  border-radius: 10px;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

}



.job-header {

  display: flex;

  justify-content: space-between;

  margin-bottom: 10px;

}



.created-at,

.save {

  background: #bbd0e5;

  padding: 5px 10px;

  border-radius: 5px;

  font-size: 12px;

  font-weight: bold;

  color: #042d56;

}



.job-details {

  display: flex;

  align-items: center;

  margin-bottom: 15px;

}



.company-logo img {

  width: 50px;

  height: 50px;

  border-radius: 50%;

  margin-right: 10px;

}



.job-info h1 {

  font-size: 18px;

  margin: 0;

}



.job-info p {

  font-size: 14px;

  color: gray;

}



.job-meta {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  align-items: center;

  gap: 20px 0;

}

.ok {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

  font-size: 12px;

  color: gray;



  align-items: center;

}



.meta-item {

  display: flex;

  align-items: center;

  gap: 5px;

}



.job-details-btn {

  background: #042d56;

  color: white;

  padding: 10px;

  border: none;

  border-radius: 5px;

  cursor: pointer;

}

.sidebar-toggle button {

  display: none;

  width: 110px;

  float: right;

  top: 20px;

  left: 20px;

  z-index: 1001;

  background-color: #fff;

  border: none;

  text-align: center;

  padding: 10px 10px;

  font-size: 18px;

  cursor: pointer;

  border-radius: 4px;

  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);

}



@media (max-width: 768px) {

  

  .sidebar {

    position: fixed;

    top: 0;

    right: -400px;

    width: 300px;

    height: 100%;

    background: #bbd0e5;

    padding: 5px 20px;

    z-index: 1002;

    transition: left 0.3s ease;

    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.2);

    box-sizing: border-box;

    display: flex;

    flex-direction: column;

  }



  .over {

    max-height: calc(100% - 80px);

  }

  .sidebar.active {

    right: 0;

  }

  .sidebar .h3 button {

    display: block;

  }



  .sidebar-toggle button {

    display: block;

  }



  .main {

    flex-direction: column-reverse;

  }

  .job-listings {

    width: 100%;

  }

}



@media (max-width: 410px) {

  .job-box {

    padding: 15px;

  }

}



/* login page css  */





    .card {

      border: none;

      border-radius: 1rem;

    }



    .card-body {

      padding: 2rem;

    }



    .card-header-title {

      background-color: #002d62;

      color: white;

      font-weight: 700;

      font-size: 1.75rem;

      letter-spacing: 0.5px;

      padding: 1rem;

      border-top-left-radius: 1rem;

      border-top-right-radius: 1rem;

      text-align: center;

    }



    .form-label {

      font-weight: 600;

      color: #333;

    }



    .form-control {

      padding: 10px 12px;

      font-size: 1rem;

      border-radius: 8px;

    }



    .btn-primary {

      background-color: #002d62 !important;

      border-color: #002d62 !important;

      font-weight: 600;

      font-size: 1.1rem;

      border-radius: 8px;

    }



    .btn-primary:hover {

      background-color: #001a3f !important;

    }



    .google-btn {

      background-color: #fff;

      border: 1px solid #ddd;

      color: #444;

      font-weight: 500;

      padding: 10px;

      font-size: 1rem;

      border-radius: 8px;

      transition: all 0.2s ease-in-out;

    }



    .google-btn:hover {

      background-color: #f1f1f1;

      border-color: #ccc;

    }



    .google-icon {

      vertical-align: middle;

      margin-right: 10px;

      width: 20px;

      height: 20px;

    }



    .text-muted {

      font-size: 0.95rem;

      color: #888 !important;

    }



    /* signup page css  */



    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');





.card-body {

  padding: 2rem;

}



.card-title {

  background-color: #002d62; /* Navy blue */

  color: white;

  font-weight: 700;

  font-size: 1.75rem;

  letter-spacing: 0.5px;

  text-align: center;

  padding: 0.75rem;

  border-radius: 0.5rem;

}



.form-label {

  font-weight: 600;

  color: #333;

}



.form-control {

  padding: 10px 12px;

  font-size: 1rem;

  border-radius: 8px;

}



.form-check-label {

  font-weight: 500;

  color: #555;

}



.btn-primary {

  background-color: #001a3f !important;

  border-color:  #001a3f !important;

  font-weight: 600;

  font-size: 1.1rem;

  border-radius: 8px;

  transition: all 0.2s ease-in-out;

}



.btn-primary:hover {

  background-color: #001a3f !important;

  border-color: #001a3f !important;

}



.btn:focus {

  box-shadow: 0 0 0 0.2rem rgba(0, 45, 98, 0.25);

}



.google-btn {

  background-color: #fff;

  border: 1px solid #ddd;

  color: #444;

  font-weight: 500;

  padding: 10px;

  font-size: 1rem;

  border-radius: 8px;

  transition: all 0.2s ease-in-out;

}



.google-btn:hover {

  background-color: #f5f5f5;

  border-color: #ccc;

}



.google-icon {

  vertical-align: middle;

  margin-right: 10px;

  width: 20px;

  height: 20px;

}



.text-muted {

  font-size: 0.95rem;

  color: #888 !important;

}



/* ===== Global Theme & UI Enhancements ===== */

:root {

  --brand-bg: #011c38;

  --brand-bg-2: #012b59;

  --brand-accent: #0dcaf0;

  --brand-text: #0f172a;

  --muted-text: #64748b;

  --surface: #ffffff;

  --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);

  --shadow-md: 0 8px 24px rgba(0,0,0,0.12);

  --radius-sm: 6px;

  --radius-md: 10px;

  --radius-lg: 20px;

  --ease: cubic-bezier(.2,.7,.3,1);

}



html {

  scroll-behavior: smooth;

}



body {

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  color: var(--brand-text);

  padding-top: 70px !important;

  

}



/* Unify icon look */

.navbar i,

.dropdown-menu i,

.meta-item i,

.info-box i,

.share a i,

.cards i,

.i {

  color: rgb(40, 67, 191);

}



/* Navbar polish */

.navbar {

  -webkit-backdrop-filter: saturate(120%) blur(6px);

  backdrop-filter: saturate(120%) blur(6px);

  position: fixed !important;

  top: 0 !important;

  left: 0 !important;

  right: 0 !important;

  width: 100% !important;

  z-index: 1030 !important;

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);

  transition: box-shadow 0.3s ease;

  margin-bottom: 0 !important;

  height: auto !important;

  min-height: 56px;

}



/* Ensure navbar stays on top when scrolling */

header {

  position: relative;

  z-index: 1030;

  margin: 0;

  padding: 0;

}

/* Remove white gap, increase navbar height */

.navbar {

  margin-bottom: 0 !important;

  border: none !important;

}

.navbar.navbar-dark {

  min-height: 70px;

  padding: 12px 0;

  background-color: #011c38 !important;

}

/* Click ripple - waves with #ffc043 on any click */

.click-ripple {

  position: fixed;

  pointer-events: none;

  border-radius: 50%;

  background: radial-gradient(circle, rgba(255,192,67,0.5) 0%, rgba(255,192,67,0.2) 40%, transparent 70%);

  animation: rippleExpand 0.8s ease-out forwards;

  z-index: 99998;

}

@keyframes rippleExpand {

  from { transform: translate(-50%,-50%) scale(0); opacity: 1; }

  to { transform: translate(-50%,-50%) scale(4); opacity: 0; }

}



/* Go-to-top button - #ffc043 gold, auto-shows when scroll down */

.go-to-top {

  position: fixed;

  bottom: 30px;

  right: 30px;

  width: 50px;

  height: 50px;

  background: #011c38;

  color: #ffc043;

  border: 2px solid #ffc043;

  border-radius: 50%;

  cursor: pointer;

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

  transition: all 0.3s ease;

  z-index: 99999;

  box-shadow: 0 4px 16px rgba(255,192,67,0.3);

  display: flex;

  align-items: center;

  justify-content: center;

}

/* Carousel custom cursor (matches go-to-top gold) */
.carousel-item,
.carousel-item .image-wrapper,
.carousel-item img {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><circle cx='12' cy='12' r='6' fill='%23ffc043' stroke='%23011c38' stroke-width='2'/></svg>") 12 12, pointer;
}

.go-to-top.show {

  opacity: 1;

  visibility: visible;

  pointer-events: auto;

}

.go-to-top:hover {

  background: #1e3c72;

  transform: translateY(-3px);

  box-shadow: 0 6px 20px rgba(255,192,67,0.45);

}

.go-to-top:active {

  transform: translateY(-1px);

}

.go-to-top,

.go-to-top svg {

  color: #ffc043;

}

.go-to-top svg {

  width: 24px;

  height: 24px;

}

@media (max-width: 768px) {

  .go-to-top {

    bottom: 20px;

    right: 20px;

    width: 45px;

    height: 45px;

  }

  .go-to-top svg {

    width: 20px;

    height: 20px;

  }

}



/* Remove extra space after navbar */

.image-slider {

  margin-top: 0 !important;

}



/* Ensure no white space between navbar and content */

header + main,

header + .image-slider {

  margin-top: 0 !important;

}



.navbar .nav-link {

  position: relative;

  transition: color .2s var(--ease), opacity .2s var(--ease);

}

.navbar .nav-link::after {

  content: "";

  position: absolute;

  left: 12px;

  right: 12px;

  bottom: 6px;

  height: 2px;

  background: var(--brand-accent);

  transform: scaleX(0);

  transform-origin: center;

  transition: transform .25s var(--ease);

}

.navbar .nav-link:hover::after,

.navbar .nav-link.active::after {

  transform: scaleX(1);

}

.navbar .dropdown-menu {

  border: none;

  box-shadow: var(--shadow-sm);

  animation: dropdownFade .18s var(--ease);

}

@keyframes dropdownFade {

  from { opacity: 0; transform: translateY(6px); }

  to { opacity: 1; transform: translateY(0); }

}



/* Buttons */

.btn,

.job-details-btn,

.apply-btn,

#see-all-btn {

  transition: transform .15s var(--ease), box-shadow .15s var(--ease), background-color .2s var(--ease), color .2s var(--ease);

}

.btn:hover,

.job-details-btn:hover,

.apply-btn:hover,

#see-all-btn:hover {

  transform: translateY(-1px);

  box-shadow: var(--shadow-sm);

}



/* Cards and surfaces */

.card,

.job-box,

.job-card,

.contact-form-box,

.stat-box {

  box-shadow: var(--shadow-sm);

  transition: box-shadow .2s var(--ease), transform .2s var(--ease);

}

.card:hover,

.job-box:hover,

.job-card:hover,

.contact-form-box:hover,

.stat-box:hover {

  box-shadow: var(--shadow-md);

  transform: translateY(-2px);

}



/* Carousel caption entrance */

.carousel .caption-one h3,

.carousel .caption-one p,

.carousel .caption-one button {

  animation: riseIn .6s var(--ease) both;

}

.carousel .caption-one p { animation-delay: .06s; }

.carousel .caption-one button { animation-delay: .12s; }

@keyframes riseIn {

  from { opacity: 0; transform: translateY(10px); }

  to { opacity: 1; transform: translateY(0); }

}



/* Service icons hover */

.two .services {

  padding: 10px;

  border-radius: var(--radius-md);

  transition: background-color .2s var(--ease), transform .2s var(--ease);

}

.two .services:hover {

  background: #eef6ff;

  transform: translateY(-2px);

}



/* Active state helper (when JS adds .is-active to body) */

body.nav-home a[href$="index.html"].nav-link,

body.nav-student a[href$="student.html"].nav-link,

body.nav-company a[href$="company.html"].nav-link,

body.nav-admin a[href$="Admin.html"].nav-link,

body.nav-contact a[href$="contactus.html"].nav-link {

  color:#fff;

}



/* Footer social icons subtle motion */

footer a[class^="fab"] {

  transition: transform .2s var(--ease), opacity .2s var(--ease);

}

footer a[class^="fab"]:hover { transform: translateY(-2px) scale(1.06); opacity: .95; }



/* Contact Us Page - Exact Design Match */

.contact-banner {

    background: linear-gradient(135deg, #011c38 0%, #023a6b 100%);

    height: 300px;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

}



.contact-banner::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300"><defs><pattern id="network" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="20" cy="20" r="3" fill="rgba(108,192,200,0.3)"/><circle cx="80" cy="30" r="2" fill="rgba(108,192,200,0.4)"/><circle cx="50" cy="70" r="2.5" fill="rgba(108,192,200,0.3)"/><line x1="20" y1="20" x2="50" y2="70" stroke="rgba(108,192,200,0.2)" stroke-width="1"/><line x1="80" y1="30" x2="50" y2="70" stroke="rgba(108,192,200,0.2)" stroke-width="1"/></pattern></defs><rect width="400" height="300" fill="url(%23network)"/></svg>');

    opacity: 0.6;

}



.banner-content {

    position: relative;

    z-index: 2;

    text-align: center;

    width: 100%;

}



.banner-text h1 {

    font-size: 4rem;

    font-weight: 800;

    color: white;

    margin: 0;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);

}



.banner-arrows {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    width: 100%;

    display: flex;

    justify-content: space-between;

    padding: 0 30px;

    z-index: 3;

}



.arrow-btn {

    background: #ffd700;

    color: #011c38;

    border: none;

    width: 50px;

    height: 50px;

    border-radius: 50%;

    font-size: 1.5rem;

    font-weight: bold;

    cursor: pointer;

    transition: all 0.3s ease;

    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);

}



.arrow-btn:hover {

    background: #ffed4e;

    transform: scale(1.1);

}



.contact-main {

    padding: 80px 0;

    background: white;

}



.contact-form-section {

    padding: 0 50px;

}



.form-container {

    max-width: 600px;

}



.form-heading {

    font-size: 2.5rem;

    font-weight: 700;

    color: #011c38;

    margin-bottom: 15px;

}



.form-subtitle {

    font-size: 1.1rem;

    color: #666;

    margin-bottom: 40px;

}



.contact-form .form-group {

    margin-bottom: 30px;

}



.contact-form label {

    display: block;

    font-size: 1rem;

    font-weight: 600;

    color: #011c38;

    margin-bottom: 8px;

}



.contact-form input,

.contact-form textarea {

    width: 100%;

    padding: 15px 20px;

    border: 2px solid #011c38;

    border-radius: 8px;

    font-size: 1rem;

    background: white;

    transition: all 0.3s ease;

    font-family: inherit;

}



.contact-form input:focus,

.contact-form textarea:focus {

    outline: none;

    border-color: #023a6b;

    box-shadow: 0 0 0 3px rgba(1, 28, 56, 0.1);

}



.contact-form textarea {

    resize: vertical;

    min-height: 120px;

}



.submit-btn {

    background: #011c38;

    color: white;

    border: none;

    padding: 15px 40px;

    border-radius: 8px;

    font-size: 1.1rem;

    font-weight: 600;

    cursor: pointer;

    transition: all 0.3s ease;

    width: 100%;

}



.submit-btn:hover {

    background: #023a6b;

    transform: translateY(-2px);

    box-shadow: 0 5px 15px rgba(1, 28, 56, 0.3);

}



.contact-info-section {

    position: relative;

    padding: 0 20px;

}



.social-bar {

    position: absolute;

    right: 0;

    top: 0;

    background: #011c38;

    width: 60px;

    height: 200px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: 20px;

    border-radius: 10px 0 0 10px;

}



.social-link {

    color: white;

    font-size: 1.5rem;

    text-decoration: none;

    transition: all 0.3s ease;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.1);

}



.social-link:hover {

    background: rgba(255, 255, 255, 0.2);

    transform: scale(1.1);

}



.contact-details {

    margin-top: 50px;

    padding-left: 20px;

}



.contact-item {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 25px;

}



.contact-icon {

    width: 40px;

    height: 40px;

    background: #28a745;

    color: white;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.2rem;

    flex-shrink: 0;

}



.contact-text span {

    font-size: 1rem;

    color: #333;

    font-weight: 500;

}



.map-section {

    padding: 0;

}



.map-container {

    width: 100%;

    height: 400px;

    border-radius: 0;

    overflow: hidden;

}



.map-container iframe {

    width: 100%;

    height: 100%;

    border: none;

}



.partners-section {

    padding: 60px 0;

    background: #ffffff;

}



.partner-logos {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 60px;

    flex-wrap: wrap;

}



.partner-logos img {

    height: 40px;

    width: auto;

    opacity: 0.7;

    transition: opacity 0.3s ease;

    filter: grayscale(100%);

}



.partner-logos img:hover {

    opacity: 1;

    filter: grayscale(0%);

}



/* Responsive Design for Contact Page */

@media (max-width: 992px) {

    .banner-text h1 {

        font-size: 3rem;

    }

    

    .contact-form-section {

        padding: 0 30px;

    }

    

    .form-heading {

        font-size: 2.2rem;

    }

    

    .social-bar {

        width: 50px;

        height: 180px;

    }

    

    .social-link {

        width: 35px;

        height: 35px;

        font-size: 1.3rem;

    }

}



@media (max-width: 768px) {

    .contact-banner {

        height: 250px;

    }

    

    .banner-text h1 {

        font-size: 2.5rem;

    }

    

    .banner-arrows {

        padding: 0 20px;

    }

    

    .arrow-btn {

        width: 40px;

        height: 40px;

        font-size: 1.2rem;

    }

    

    .contact-main {

        padding: 60px 0;

    }

    

    .contact-form-section {

        padding: 0 20px;

        margin-bottom: 40px;

    }

    

    .form-heading {

        font-size: 2rem;

    }

    

    .contact-info-section {

        padding: 0 20px;

    }

    

    .social-bar {

        position: relative;

        width: 100%;

        height: 60px;

        flex-direction: row;

        justify-content: center;

        border-radius: 10px;

        margin-bottom: 30px;

    }

    

    .contact-details {

        margin-top: 0;

        padding-left: 0;

    }

}



@media (max-width: 576px) {

    .contact-banner {

        height: 200px;

    }

    

    .banner-text h1 {

        font-size: 2rem;

    }

    

    .banner-arrows {

        padding: 0 15px;

    }

    

    .arrow-btn {

        width: 35px;

        height: 35px;

        font-size: 1rem;

    }

    

    .contact-main {

        padding: 40px 0;

    }

    

    .contact-form-section {

        padding: 0 15px;

    }

    

    .form-heading {

        font-size: 1.8rem;

    }

    

    .form-subtitle {

        font-size: 1rem;

    }

    

    .contact-form input,

    .contact-form textarea {

        padding: 12px 15px;

    }

    

    .submit-btn {

        padding: 12px 30px;

        font-size: 1rem;

    }

    

    .contact-info-section {

        padding: 0 15px;

    }

    

    .social-bar {

        height: 50px;

        gap: 15px;

    }

    

    .social-link {

        width: 30px;

        height: 30px;

        font-size: 1.1rem;

    }

    

    .contact-item {

        margin-bottom: 20px;

    }

    

    .contact-icon {

        width: 35px;

        height: 35px;

        font-size: 1rem;

    }

    

    .contact-text span {

        font-size: 0.9rem;

    }

}