@font-face {
    font-family: 'Proxima_Nova_Soft';
    src: url('../fonts/FontsFree-Net-Proxima-Nova-Soft-W03-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Big_Shoulders_Text';
    src: url('../fonts/BigShouldersText-Regular.ttf') format('truetype');

}
@font-face {
  font-family: 'Big_Shoulders_semobold';
  src: url('../fonts/BigShouldersDisplay-SemiBold.ttf') format('truetype');

}
@import url(vision.css);
@import url(about.css);
@import url(nav.css);
@import url(mission.css);
@import url(passion.css);
body {
    font-family: 'Proxima_Nova_Soft';
    background-color: #211E1F;
    overflow-x: clip;
    box-sizing: border-box;
    overflow-y: scroll;
    margin: 0;
    height: 100vh;
    width: 100vw;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

body::-webkit-scrollbar {
    display: none;
    scroll-behavior: smooth;
}
.section-part1{
  width:100vw;
  height: 100vh;
  position: relative;
  background-blend-mode: multiply;

}
.section-part1 section {
  width: 100vw;
  height: 100vh;
  position: absolute;

}


section {
    position: relative;
    height: 100vh;
    width: 100vw;
    scroll-behavior: smooth;
    overflow-x: clip;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;

}
a{
  text-decoration: none;
}


#home {

    color: white;
    background-color: #BA0767;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    z-index: 999;
}

#home h1 {
    font-family: 'Big_Shoulders_Text';
    font-size: calc(5vw + 4vh);
    font-weight: 400;
    letter-spacing: -6.5px;
}

.div_home {
    width: 80vw;
    padding-left: 8vw;
}

#eclipse {
    position: relative;
    width: 6vw;
    top: 0vh;

}

.div_image_home {
  display: flex;
  align-items: flex-end;
  position: absolute;
  justify-content: flex-end;
  bottom: 0vh;
  height: 50vh;
  flex-wrap: wrap;
  padding-left: 90vw;
  flex-direction: row;
}

#eclipse_double {
  position: absolute;
  width: calc(41vw + 41vh);
}

#scroll_icon {
    width: 0.7vw;
    margin-left : 3vw;
    margin-bottom: 6vw;
}



#orbit, #orbit2 {
    width: calc(51vw + 53vh);
    height: calc(27vw + 27vh);
    border: 0.5px solid #ffffff2e;
    border-radius: 50%;
    position: relative;
    top: 21vh;
    left: 24vw;
   
   
  }
  #orbit{
    transform: rotate(158deg);
  }
  #orbit2 {
    transform: rotate(232deg);
   
  }
  
  #satellite, #satellite2,#satellite3 {
    width: 4vw;
    height: 4vw;
    background-color: #BA0767;
    border-radius: 50%;
    position: absolute;
   
    transform-origin: center bottom;
    animation: orbit 5s linear infinite;
  }
  #satellite {
    top: 79%;
    left: 85%;
  }
  #satellite2 {
    top: 89%;
    left: 22%;
  }
  #satellite3 {
    top: 79%;
    left: 85%;
  }



  .section {
    transition: transform 0.9s ease, border-radius 0.9s ease; /* Add transition property */
}

.section.scaled {
    transform: scale(0.9);
    border-radius: 2vw;
    
}
.bar {
  width: 3vw;
  height: 1px;
  background-color: white;
  margin: 3vh 0;
  transition: 0.4s;
}
.bar_about_us, .bar_our_vision, .bar_our_mission,.bar_our_passion , .bar_our_costume, .bar_ready , .bar_our_project {
    width: 3vw;
    height: 1px;
    background-color: white;
    margin: 3vh 0;
    transition: 0.4s;
}

.hamburger{
  width: 4vw;
  padding-left: 8vw;
}
.activebar {
  width: 5.5vw;
}

#our_project .bar, #our_project2 .bar, #our_project3 .bar , #our_project4 .bar , #our_project5 .bar{
  background-color: black;
}
#our_project .bar_our_project, #our_project2 .bar_our_project, #our_project3 .bar_our_project,#our_project4 .bar_our_project,#our_project5 .bar_our_project{
  background-color: black;
}

.mini_scroll{
  height: 20vh;
    width: 0.7vw;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50vw;
}
.mini_scroll_button{
  height: 4vh;
  width: 0.7vw;
  background-color: white;
  border-radius: 50vw;
  transform: translateY(-50%);
}
.eclipse_double {
  border: 1px solid white;
    background-color: transparent;
    border-radius: 50%;
    position: absolute;
    width: calc(41vw + 41vh);
    height: calc(41vw + 41vh);
    top: 65vh;
    left: 61vw;
  transform: translate(-50%, -50%);
 
}

.mini_eclipse_double {
  border: 1px solid white;
    background-color: transparent;
    border-radius: 50%;
    position: absolute;
    width: calc(10vw + 10vh);
    height: calc(10vw + 10vh);
    top: 17%;
    left: 61%;
}

@keyframes rotate_eclipse_double {
  from {
      transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
      transform: translate(-50%, -50%) rotate(-100deg);
  }
}
@media (max-width: 1024px) {
    #eclipse {
    
    width: 8vw;
    }
    #home h1 {
    
    letter-spacing: -4.5px;
}
}
@media (max-width : 768px)
{
        #home h1 {
          letter-spacing: -2.5px;
          line-height: 18vw;
          width: 75vw;
        font-size: calc(7vw + 5vh);
    }
    #eclipse {
      visibility: hidden;
    }
    #satellite, #satellite2,#satellite3 {
      width: 13vw;
      height: 13vw;
    }
    .mini_scroll_button {
      height: 4vh;
        width: 1.7vw;
    }
    #scroll_icon {
      width: 1.7vw;
      margin-left: 3vw;
      margin-bottom: 68vw;
  }
  #logo {
    width: 23vw;
}
#orbit, #orbit2{
  width: calc(61vw + 63vh);
  height:calc(52vw + 49vh);
}
  .mini_scroll {
    height: 17vh;
  }  
  .eclipse_double {
    border: 1px solid #ffffff8c;
    background-color: transparent;
    border-radius: 50%;
    position: absolute;
    width: calc(34vw + 32vh);
    height: calc(34vw + 32vh);
    top: 45vh;
    left: 39vw;
  }
  .mini_eclipse_double {
    border: 1px solid #ffffff85;
    background-color: transparent;
    border-radius: 50%;
    position: absolute;
    width: calc(10vw + 10vh);
    height: calc(10vw + 10vh);
    top: 17%;
    left: 49%;
}
#satellite{
  top: 79%;
  left: 81%;
}
#satellite2{
  top: 89%;
  left: 19%;
}
#satellite3 {
  top: 79%;
  left: 81%;
}
}
@media (max-width : 500px){
    #home h1 {
        letter-spacing: -2.5px;
    }
}