.partners-parts {
  list-style-type: none;
}

.mar-ul {
  float: left;
}

.marquee {
  padding-left: 0;
  white-space: nowrap;
  overflow: hidden;
}

.marquee div {
  animation: animat 10s linear infinite;
}

@keyframes animate {
  100% {
    transform: translateX(-10000px);
  }
}

#partners {
  margin: 10px;
  padding-top: 50px;
}

#contact {
  margin: 10px;
  padding-top: 50px;
}

aside {
  width: 250px;
  padding-top: 50px;
}

.follow-aside {
  position: sticky;
  top: 0;
}

.owner {
  border: 2px solid gray;
  border-radius: 10px;
}

/* Scroll - smooth behaviour */
html {
  scroll-behavior: smooth;
  background-color: black;
}

/* All - The whole code */
* {

  /* Hero - Top */
  #home  {
    margin: 20px;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;

    /* Title - NC and more */
    .title-and-more {
      
      /* Whole - description */
      .auth {
        font-size: clamp(0.1rem, 2vw, 3rem);
        color: white;
        line-height: 0;
        padding-left: 10px;
      }

      /* Title - NC community */
      h1 {
        font-size: clamp(1rem, 4vw, 7rem);
        color: blue;
        line-height: 0.2;
      }

      /* Author */
      h2 {
        font-size: clamp(0.1rem, 3.75vw, 5rem);
        color: white;
        line-height: 0.2;
        padding-left: 10px;
      }

      /* Info - general specification */
      .info {
        font-size: clamp(0.1rem, 1.5vw, 3rem);
        color: white;
        padding-left: 30px;
      }
    }

    /* Icon - on the right */
    .icon {

    }
  }

  /* navigation - the horizontal navigation bar */
  nav {
    /* mouvement - stay on the screen */
    position: sticky;
    top: 0;
    padding-left: 0px;
    padding-right: 0px;
    /* bar - the bar properties */
    .bar {
      /* Style the list items to float left (horizontal layout) */
      display: flex;
      flex-direction: row;


      /* Reset default browser margins and padding */
      list-style-type: none; /* Removes bullet points */
      margin: 0;
      padding: 0;
      overflow: visible; /* Ensures background color covers floated items */
      background-color: #333; /* Adds a background color */
    }
    .bar-items {
      /* Style the links inside the navigation bar */
      a {
        display: block; /* Makes the entire link area clickable */
        color: white; /* Text color */
        text-align: center;
        padding: 14px 16px; /* Spacing around the text */
        text-decoration: none; /* Removes default link underlines */
        background-color: #333;
      }
      /* Style the links inside the navigation bar */
      p {
        display: block; /* Makes the entire link area clickable */
        color: white; /* Text color */
        text-align: center;
        padding: 14px 16px; /* Spacing around the text */
        text-decoration: none; /* Removes default link underlines */
      }
      /* Style the links inside the navigation bar */
      button {
        display: block; /* Makes the entire link area clickable */
        color: white; /* Text color */
        text-align: center;
        padding: 14px 16px; /* Spacing around the text */
        text-decoration: none; /* Removes default link underlines */
        background-color: #333;
        border: none;
      }
      button:hover {
        background-color: #111;
      }
      /* Change the color of links on hover */
      a:hover {
        background-color: #111;
      }
      /* Add a color to the active/current link */
      a.active {
        background-color: #04AA6D;
        color: white;
      }
    }

    /* Hide dropdown by default */
    .dropdown-menu {
      display: none;
      position: absolute;
      background: #333;
      list-style: none;
      padding: 8px 0;
      border-radius: 8px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
      min-width: 150px;
    }
    /* Show on hover */
    .dropdown:hover .dropdown-menu {
      display: block;
    }
    .dropdown {
      position: relative;
    }
    .dropdown-menu li a {
      display: block;
      padding: 8px 16px;
    }
    .dropdown-menu li a:hover {
      background: #111;
    }

    .nav-logo {
      opacity: 0;
      transition: opacity 0.3s ease;
      color: white;
    }

    .nav-logo.visible {
      opacity: 1;
    }
  }

  /* main - what is this all about */
  #about {
    /* arrangement - arranging the elements with the aside bar */
    /*
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    */
    scroll-margin-top: 60px;

    /* text properties - for different text font-size and color */
    h2 {
      font-size: 25px;
      color: white;
    }
    
    #team {
      scroll-margin-top: 60px;

      h3 {
        color: white;
      }

      .team-list {
        .team-owner {
          h5 {
            color: white;
          }

          h4 {
            color: white;
          }

          p {
            color: white;
          }
        }
      }
    }

    #our-projects {
      scroll-margin-top: 60px;

      h3 {
        color: white;
      }

      p {
        color: white;
      }

      .our-projects-list {
        .mc-server {
          h4 {
            color: white;
          }

          h5 {
            color: white;
          }

          p {
            color: white;
          }
        }
      }
    }
    /* partners - people or companies partnered */
    /*
    #partners {
      /* text - properties */
      /*
      p {
        color: white;        
      }

      /* marquee - the partners scrolling */
      /*
      .marquee {
        div {
          color: white;
        }
      }
    }

    /* about - information about the website */
    /*
    #about {
      /* arrangement */
      /*
      margin: 10px;
      padding-top: 50px;
 
      /* text - properties */
      /*
      h4 {
        color: white;
      }

      p {
        color: white;
      }

      /* communtity - section */
      /*
      .community {

      }

      /* what we do? - section */
      /*
      .what {

      }

      /* contact - not general section */
      /*
      .contact {

      }
    }

    #team {
      margin: 10px;
      padding-top: 50px;
      display: flex;
    }
    */
  }

  footer {
    background-color: #333;

    p {
      color: white;
      padding: 5px 5px;
    }
  }
}