/* body { 
    overflow-y: hidden;
} */  
a {
    color: #fff;
    text-decoration: none;
}
/* =============================================================== */
.main-body {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    padding: 2rem 0;
}
 

/* =========================================== */

.sec {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    padding: 0rem 4rem;
}
.container {
    width: 50%;
}
.container > img {
    width: 100%;
}
.slider {
    display: flex;
}
.slider button {
    background-color: var(--color);
    border: 2px solid transpare;
    border-radius: 50px;
    margin: 5px 0;
    padding: 4px 9px;
}
.slider button:hover {
    transform: scale(1.01);
    box-shadow: 0 0 5px 2px var(--color);
}

.slide {
    display: none;
    text-align: left;
}
.slide h2 {
    text-transform: capitalize;
    font-size: 2rem;
    color: black;
    margin: 0.5rem auto;
    text-align: left;
}
.slide p {
    margin: 0.3rem;
    font-size: 1.1rem;
    color: black;
}
.current {
    display: unset;
}



/* ================================== */
/* HEADING AND HR CSS */

.heading > h2, .content h2, .text h2 {
    font-size: 2rem;
    color: black;
    text-align: left;
    /* text-transform: uppercase; */
    margin: 0 1rem 1rem 1rem; 
}
.sec2 .heading > h2 {
    text-align: center;
}
.heading > hr, .content hr, .text hr {
    width: 15%;
    margin: 0 auto;
    height: 0.1rem;
    background-color: black;
    border: 1px solid black;
    border-radius: 3px;
    margin-bottom: 1rem;
}


/* ======================== */

.sec2-content {
    width: 80%;
    margin: auto;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    gap: 4rem; 
}

.wrap {
    width: 40%;
    /* text-align: left; */
}
.wrap .sec2-nav {
    width: 90%;
    height: 3rem;
    margin: 1.5rem auto;
    padding: 1.5rem 1rem;
    border: 3px solid #fff;
    border-radius: 8px;
    box-shadow: 2px 2px 5px 2px rgb(163, 163, 163);
    list-style-position: inside;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wrap .sec2-nav > a {
    font-size: 1.2rem;
    color: black;
    text-decoration: none;
    font-weight: bold;
    /* text-align: center; */
}
.wrap .sec2-nav a:hover {
    color: red;
    /* text-shadow: 2px 2px 5px red; */
    font-size: 1.197rem;
}


/* ======================================= */
.sec3 {
    position: relative;
}
.overlay {
    background: url("../media/(index)private-limited-company-1.jpg") no-repeat center fixed;
    background-size: cover;
}
.about-us {
    background-color: hsl(10, 100%, 2%, 0.85);
    padding: 3rem;
    text-align: justify;
}

.content {
    border: 0.1rem solid #fff;
    padding: 2rem 1rem;
}
.content > h2 {
    text-align: center;
}
.content> h2, .content p {
    color: white;
    border-color: #fff;
}
.content> hr {
    background-color: #fff;
    border-color: #fff;
}
.content> p {
    font-size: 1.05rem;
    /* line-height: 1.2rem; */
}

/* ======================================= */

.dark {
    position: relative;
    /* background-color: rgb(148, 148, 148, 0.2); */
    background-color: rgba(0,43,70, 0.15);
}
.light {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    margin: auto;
}

.sec-content {
    width: 80%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem 0;
}
.text {
    width:50%;
    margin: 4rem auto;
}
.text>h2, .text>p {
    padding: 1rem 0;
}
.text>h2, .text>p, .text> hr {
    margin: 0;
    text-align: left;
}
.text p {
    text-align: justify;
}
.sec-img {
    width: 50%;
}
.sec-img> img {
    width: 100%;
}
.sec-btn {
    margin-top: 1rem;
    border-radius: 0.8rem;
    padding: 0.4rem 0.55rem;
    background-color: var(--color);
}
.sec-btn:hover {
    box-shadow: 2px 2px 5px 2px rgb(133, 133, 133, 0.4);
}

/* ====================================================== */





/* =============================================================== */

.sec10 {
    width: 80%;
    margin: auto;
    display: flex;
    gap:1.5rem;
}
.list-1,.list-2 {
    width: 50%;
    border: 0.1rem solid transparent;
    border-radius: 1.5rem;
    box-shadow: 3px 3px 10px 2px #797979;
    padding: 1rem 2rem;
    color:black;
}
.sec10 ul {
    list-style: none;
}
.sec10 h2 {
    font-size: 1.8rem;
    margin: 1rem 0;
}
.sec10-list li a {
    color: black;
}
.sec10-list li a:hover {
    text-shadow: 2px 2px 5px black66;
    font-size: 1.05rem;
}
.hr {
    width: 15%;
    margin: 0;
    height: 0.1rem;
    background-color: black;
    border: 1px solid black;
    border-radius: 3px;
    margin-bottom: 1.5rem;
}
.list-1 li, .list-2 li {
    font-size: 1.05rem;
    margin: 0.5rem 0;
} 



/* =========================================================== */
.custom-shape-divider-top-1664513777 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-top-1664513777 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 24px;
    transform: rotateY(180deg);
}
.custom-shape-divider-top-1664513777 .shape-fill {
    fill: #ffffff;
}


.custom-shape-divider-bottom-1664513335 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}
.custom-shape-divider-bottom-1664513335 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 32px;
    transform: rotateY(180deg);
}
.custom-shape-divider-bottom-1664513335 .shape-fill {
    fill: #ffffff;
}
/* =========================================================== */

/* ANIMATION */

.sec{
    position: relative;
    animation: rise 33s ease-in 1sec 1;
}
@keyframes rise {
    from {
        top: 0;
    }
    to {
        top:100px;
    }
}


















/* =========================================================== */
/* @media queries */

/* 
@media (max-width:1024px) {
    
} */
@media (max-width:767px) {
    .main-body {
        gap: 0.5rem;
        text-align: center;
    }
    .hr, hr, .heading > hr, .content hr, .text hr {
        margin: auto;
    }
    .heading > h2, .content h2, .text h2, h2, .slide h2{
        text-align: center;
        font-size: 2rem;
    }

    .about-us {
        padding: 2.5rem 0.5rem;
    }
    .sec {
        max-width: 100%;
        flex-direction: column-reverse;
        gap: 0;
    }
    .intro, .slide {
        max-width: 100%;
    }
    .slide, .text {
        text-align: center;
    }

    .sec2-content {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }
    .wrap {
        width: 100%;
        margin: auto;
    }
    .sec2-nav {
        text-align: left;
    }



    .text , .sec-img, .container{
        width: 100%;
    }
    .sec-content {
        flex-direction: column;
    }
    .light {
        flex-direction: column-reverse;
    }

    .sec10 {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }
    .list-1,.list-2 {
        width: 70%;
    }
}

/* =========================================================== */