@font-face {
    font-family: "San Francisco";
    font-weight: 400;
    src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-regular-webfont.woff");
  }

body{
    margin: 0;
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
    background-color: #fef9f2;
}

.container {
    display: flex;
    height: 100vh;
    width: 100%;
    margin-top: 5%;
}

.sidebar{
    width: 250px;
    height: 100vh;
    top: 15%;
    left: 3%;
    position: fixed;
    overflow-y: auto;
    text-align: right;
}

.menuLink{
    font-size: larger;
    color: #181c14;
    margin-top: 22px;
}

.menuLink:hover{
    color: #bec6a0;
}

.intro{
    width: 100%;
    height: 80vh;
    background-image: url("../img/bg-pic.png");
    background-size: cover;
}

.content {
    margin-left: 250px; /* Push content to the right of the sidebar */
    padding: 0; /* Padding for aesthetics */
    width: calc(100% - 250px); /* Ensure content takes full width minus sidebar */
    height: auto;
}

.intro{
    margin-left: 100px;

}

.featuredProjects{
    width: 100%;
    height: auto;
    opacity: 0; /* Start hidden */
    transform: translateY(30px); /* Start slightly below */
    transition: opacity 0.7s ease, transform 0.7s ease; /* Animation effect */
}

.featuredProjects.visible {
    opacity: 1; /* Fully visible */
    transform: translateY(0); /* Move back to original position */
}

.project_img{
    width: 100%;
    border-radius: 10px;
    margin-bottom: 2%;
}

.project_link{
    color: #181c14;
}

.project_link:hover{
    color : #181c14;
}

.skills{
    width: 100%;
    height: auto;
    margin-bottom: 10%;
}

.btn{
    background-color: #708871;
}

.contact-img {
    width: 50px;
    margin-right: 2%;
    margin-bottom: 5%;
}

.message-box {
    resize: vertical;
    margin-bottom: 3%;
    width: 50%;
}

.form-control:focus {
    box-shadow: 0 0 10px 2px #708871; /* Custom glow with your color */
    border-color: #708871; /* Change the border color to match */
    outline: none; /* Remove default outline */
}