#section-1{
    position:sticky;
    top:0px;
    z-index: 1000;
}
#section3{
    background-color:goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
#section4{
    margin-top: 30px;
    margin-bottom: 30px;
}
#section7{
    background-color:goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
.definition{
    font-weight: bold;
    margin-top: 50px;
    margin-bottom: 50px;
}
.define{
    margin-top: 50px;
    margin-bottom: 50px;
}
#section8{
    background-color:goldenrod;
    color:aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
#section9{
    background-color:antiquewhite;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 20px;
}
.card-handbook{
    margin-top: 30px;
    margin-bottom: 30px;
}
#section10{
    background-color:antiquewhite;
    color: aliceblue;
    padding-top: 20px;
    padding-bottom: 50px;
}
#section11{
    background-color:goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
.card-stages{
    margin-top: 30px;
    margin-bottom: 30px;
}
#section15{
    background-color:goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
/* #section16{
    margin-top: 30px;
    margin-bottom: 30px;
} */
#section17{
    background-color:goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
#section18{
    margin-top: 30px;
    margin-bottom: 30px;
}
#section19{
    margin-top: 30px;
    margin-bottom: 30px;
}
#section20{
    background-color: goldenrod;
    color: aliceblue;
    padding-top: 50px;
    padding-bottom: 50px;
}
#section21{
    margin-top: 30px;
    margin-bottom: 30px;
}
#img1{
    height: 600px;
}
    body{
      font-family: Arial, sans-serif;
      margin: 0;
      background: #f8f8f8;
    }


    .stage-card{
      width: 300px;
      background-color: #ffffff;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      border-radius: 8px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      margin-left: 30px;
    }

    .stage-image{
      position: relative;
      height: 200px;
      background-size: cover;
      background-position: center;
    }

    .stage-title{
      position: absolute;
      bottom: 0;
      width: 100%;
      background-color: #42787A;
      color: white;
      font-weight: bold;
      font-size: 18px;
      text-align: center;
      padding: 10px 0;
    }

    .stage-content{
      padding: 16px;
      background-color: #f2f7e7;
    }

    .stage-content ul{
      padding-left: 20px;
    }

    .stage-content li{
      margin-bottom: 10px;
      line-height: 1.6;
    }

    @media (max-width: 900px) {
      .stage-card {
        width: 90%;
      }
    }
    /* .border-card{
        padding: 10px;
    } */

    .img-size{
        height: 260px;
        width: 260px;
        position: relative;
        top: 10px;
        left: 30px;
    }
    .title-bg{
        background-color:#42787A;
        color: #ffffff;
    }
    .card-bg{
        height: 650px;
        background-color: lightgray;
    }
    .bigCards{
        margin-left: 15%;
        margin-right: 15%;
    }

    #img4Eng{
        height: 270px;
        width: 500px;
    }

    #img5Eng{
        height:430px;
        width: 500px;
    }
    #img6Eng{
        height:270px;
        width: 500px;
    }
    .border-card1{
        height: 550px;
    }
    .border-card2{
        height: 520px;
    }
    .img-size1{
        height: 250px;
        width: 300px;
    }
    .card-bg1{
        height: 835px;
        background-color: lightgray;
    }
    .card-bg2{
        height: 860px;
        background-color: lightgray;
    }
    .QRcode{
        padding-left: 10%;
    }
    .QRtext{
        padding-top: 10%;
        padding-right: 10%;
    }
    .font{
        font-family: Georgia, 'Times New Roman', Times, serif;
    }

    .navbar-brand{
    font-weight: bold;
    font-style: italic;
}

.section{
    font-family: Georgia, 'Times New Roman', Times, serif;
}

    #img4{
        height: 240px;
        width: 450px;
    }
    #img5{
        height: 340px;
        width: 450px;
    }
    #img6{
        height: 200px;
        width: 450px;
    }

    .border-card{
        height: 470px;
    }