@import url("https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap");

body {
  background: #D5EDF3;
  background: linear-gradient(91deg, rgba(213, 237, 243, 1) 0%, rgba(246, 246, 246, 1) 75%, rgba(177, 219, 227, 1) 100%);
  font-family: "Poppins", sans-serif;
  color: #303131;
}

/* body {
  font-family: 'Noto Sans', sans-serif;
} */


/* text selection section */
body ::selection {
  background-color: #4F526A;
  color: whitesmoke;
}

/* text selection for menu */
.menu ::selection {
  background-color: #4F526A;
  color: whitesmoke;
}

/* hide overflow, bug form AOS library */
@media (max-width: 768px) {
  .hideOverflowOnMobile {
    overflow-x: hidden;
  }
}


/* hero section */
.hero {
  min-height: 85vh;
}

/* menu */
.navbar {

  .navbar-brand {
    font-size: 1.4rem;
    color: #303131;
    font-weight: 500;
  }

  @media (max-width: 384px) {
    .navbar-brand {
      font-size: 1.2rem;
    }
  }

  .navbar-brand img {
    border-radius: 1.2rem;
    max-width: 2.4rem;
  }

  /* removes the arrow from the globe */
  .dropdown-toggle::after {
    display: none !important;
  }

  .nav-item {
    position: relative;
    font-size: 1.2rem;
    margin-left: 1.2rem;
  }

  .nav-item::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0%;
    height: 2px;
    background-color: #52546F;
    transition: width 0.5s ease;
  }

  .nav-item:hover::after {
    width: 100%;
  }

  .dropdown-menu {
    /* background-color: transparent; */
    border: none;
  }
}

/* end of navbar */


.landing-content {
  font-size: 1.2rem;
  margin-top: 5rem;
  position: relative;
  top: 2rem;
}


/* landind text */
/* .landing-intro {
  position: relative;
  bottom: 2rem;
} */

.landing-intro h1 {
  font-size: 2.5rem;
  margin-bottom: 2rem;
}

.landing-intro p {
  color: #596867;
}

/* button about me*/
.landing-intro a.btn {
  background-color: #52546F;
  color: whitesmoke;
  border: 3px solid #52546F;
  margin-top: 2rem;
}

.landing-intro a.btn:hover {
  color: #52546F;
  background-color: whitesmoke;
}

.photo-grid-wrapper {
  position: relative;
  width: 100%;
  height: 350px;
}

.photo-grid {
  position: relative;
  width: 100%;
  height: 100%;
}

.photo-grid img {
  width: 60%;
  height: auto;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  /* border-radius: 8px; */
  transition: transform 0.3s ease;
}

/* Πρώτη εικόνα πάνω αριστερά */
.photo-grid .img-1 {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-3deg);
}

/* Δεύτερη εικόνα κάτω δεξιά */
.photo-grid .img-2 {
  position: absolute;
  bottom: 0;
  right: 0;
  transform: rotate(3deg);
}


/* end of hero section */

/* button back to the top */
#scrollButton {
  position: fixed;
  right: 2rem;
  bottom: 1rem;
  color: rgb(245, 245, 245);
  font-size: 1.7rem;
  display: none;
  background-color: #52546F;
  border-radius: 20%;
  z-index: 2;
  border: 4px solid #52546F;
  letter-spacing: 1px;
  transition: 0.2s
}

#scrollButton:hover {
  color: #52546F;
  background-color: whitesmoke;
  border: 4px solid #52546F;
  letter-spacing: 1px;
}

/* end of landing */