@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background-color: #100d2a;
}

header{
    /* border: 2px solid red; */
    /* box-shadow: .0rem .1rem .5rem rgb(25, 56, 67); */
    /* margin-block: 3rem; */
}

.gen-layout{
    max-width: 1000px;
    margin: auto;
}

.Top-box{
    /* border: 2px solid white; */
}

.Top-container{
    /* border: 2px solid blue; */
    margin-top: 1rem;
    display: flex;
}

.image{
    /* border: 2px solid red; */
    display: flex;
    gap: 0.2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .image{
                  margin-left: 1rem;
                  gap: 0.5rem;
           }
        }

.image >h1{
    color: white;
    font-size: 30px;
    margin-top: 0.8rem;
    font-family: "Montserrat", serif;
}

.image >img{
    /* border: 2px solid greenyellow; */
    width: 4rem;
}

label, .check_icon{
    display: none;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                label{
                  display: block;
                  color: white;
                  margin: auto;
                  font-weight: 900;
                  font-size: 2rem;
                  margin-left: 6.5rem;
           }
        }

.Top-right{
    /* border: 2px solid goldenrod; */
    width: 1000px;
    margin-left: 7rem;
    align-items: center;
    gap: 3rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Top-right{
                  display: none;
                  position: absolute;
                  width: 340px;
                  padding: 1.8rem;
                  top: 4.4rem;
                  right: 3px;
                  z-index: 1;
                  background-color: #91b2ac;
                  opacity: .97;
                  border-bottom: 4px solid #094c3d;
                  transform: translate(100%, 0);
                  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
           }
        }

.Top-item{
    /* border: 2px solid blanchedalmond; */
    margin-top: 1.2rem;
    text-transform: capitalize;
    margin-left: 1.5rem;
    align-items: center;
    gap: 3rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Top-item{
                    padding: 0;
                    display: flex;
                    flex-direction: column;
           }
        }

.Top-item >a{
    color: rgb(136, 132, 132);
    /* border: 2px solid red; */
    margin-left: 1.4rem;
    text-decoration: none;
    /* gap: 2rem; */
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Top-item >a{
                  width: 100%;
                  color: #094c3d;
                  font-size: 18px;
                  padding: 0.6rem;
                  text-align: right;
                  border-bottom: 4px solid #fff;
           }
        }

#toggle:checked + .Top-right {
    display: block;
    transform: none;
}

.Top-item > a:hover{
    color: white;
}

.banner{
    /* border: 2px solid greenyellow; */
    margin-top: 5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner{
                  /* border: 2px solid greenyellow; */
           }
        }

.banner-container{
    display: flex;
    /* border: 2px solid blue */
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-container{
                    display: inline;
                  /* border: 2px solid rgb(255, 47, 47); */
           }
        }

.banner-content{
    /* border: 2px solid blue; */
    width: 33rem;
    margin-block: 3rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-content{
                  /* border: 2px solid rgb(255, 47, 241); */
                  width: 21rem;
                  margin-block: 1rem;
           }
        }

.banner-content >h1{
    color: white;
    font-size: 2.5rem;
    margin-top: 5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-content >h1{
                  /* border: 2px solid greenyellow; */
                  width: 20rem;
                  margin-left: 0.5rem;
           }
        }

.banner-content >p{
    color: white;
    /* border: 2px solid red; */
    font-size: 1.5rem;
    width: 32rem;
    margin-block: 3rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-content >p{
                  /* border: 2px solid greenyellow; */
                  width: 19rem;
                  margin-left: 0.8rem;
           }
        }

.banner-content > button{
    padding: 0.8rem 2.2rem;
    border-radius: 20px;
    background-color: transparent;
    cursor: pointer;
    border: 1px solid #ffffff;
    color: #fff;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-content >button{
                  margin-left: 5rem;
           }
        }

.banner-content > button:hover{
    background-color: white;
    color: black;
}

.banner-image{
    /* border: 2px solid red; */
    width: 30rem;
    height: 98vh;
    /* margin-left: 5rem; */
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-image{
                  /* border: 2px solid greenyellow; */
                  width: 21.5rem;
                  height: 50vh;
           }
        }

.banner-image >img{
    /* border: 2px solid gold; */
    width: 30rem;
    height: 98vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .banner-image >img{
                  /* border: 2px solid rgb(71, 47, 255); */
                  width: 21.2rem;
                  height: 50vh;
           }
        }

.Pro{
    /* border: 2px solid goldenrod; */
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Pro{
                  /* border: 2px solid greenyellow; */
           }
        }

.product{
    /* border: 2px solid hotpink; */
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    display: grid;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product{
                  /* border: 2px solid rgb(255, 47, 241); */
                  display: inline-block;
                  width: 21.5rem;
           }
        }

.productP{
    /* border: 2px solid firebrick; */
    width: 20rem;
}

.productP >h1{
    color: white;
    font-size: 3rem;
    margin-block: 3rem;
    margin-left: 8rem;
    padding-top: 2.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .productP >h1{
                  /* border: 2px solid greenyellow; */
                  margin-left: 5rem;
           }
        }

.product-box1{
        /* border: 2px solid red; */
        border-radius: 10px;
        background-image: radial-gradient(circle, #2d2078, #240a6b, #3d147b);
        width: 30rem;
        height: 50vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box1{
                  /* border: 2px solid greenyellow; */
                  width: 21rem;
                  margin-block: 2rem;
                  margin-left: 0.1rem;
                  height: 35vh;
           }
        }

.product-box1 >h1{
    /* border: 2px solid red; */
    color: white;
    font-size: 2.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box1 >h1{
                    margin-left: 1.5rem;
           }
        }

.product-box1 >h4{
    /* border: 2px solid red; */
    color: white;
    font-size: 1.8rem;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box1 >h4{
                    margin-left: 1.5rem;
                    margin-block: 0.2rem;
           }
        }

.product-box1 >button{
    padding: 0.8rem 1.5rem;
    border: 1px solid white;
    border-radius: 20px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box1 >button{
                    margin-block: 1rem;
                    margin-left: 1.5rem;
           }
        }

.product-box1 >button:hover{
    background-color: white;
    color: #000;
}

.product-box1 >a{
    color: rgb(136, 132, 132);
    /* border: 2px solid red; */
    margin-left: 1.4rem;
    text-decoration: none;
    /* gap: 2rem; */
}

.product-box1 >a:hover{
    color: white;
}

.product-box2{
        /* border: 2px solid red; */
        border-radius: 10px;
        background-image: radial-gradient(circle, #2d2078, #240a6b, #3d147b);
        width: 30rem;
        height: 50vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box2{
                  /* border: 2px solid greenyellow; */
                  width: 21rem;
                  margin-block: 2rem;
                  margin-left: 0.1rem;
                  height: 35vh;
           }
        }

.product-box2 >h1{
    /* border: 2px solid red; */
    color: white;
    font-size: 2.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box2 >h1{
                    margin-left: 1.5rem;
           }
        }

.product-box2 >h4{
    /* border: 2px solid red; */
    color: white;
    font-size: 1.8rem;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box2 >h4{
                    margin-left: 1.5rem;
                    margin-block: 0.2rem;
           }
        }

.product-box2 >button{
    padding: 0.8rem 1.5rem;
    border: 1px solid white;
    border-radius: 20px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box2 >button{
                    margin-block: 1rem;
                    margin-left: 1.5rem;
           }
        }

.product-box2 >button:hover{
    background-color: white;
    color: #000;
}

.product-box2 >a{
    color: rgb(136, 132, 132);
    /* border: 2px solid red; */
    margin-left: 1.4rem;
    text-decoration: none;
    /* gap: 2rem; */
}

.product-box2 >a:hover{
    color: white;
}

.product-box3{
        /* border: 2px solid red; */
        border-radius: 10px;
        background-image: radial-gradient(circle, #2d2078, #240a6b, #3d147b);
        width: 30rem;
        height: 50vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box3{
                  /* border: 2px solid greenyellow; */
                  width: 21rem;
                  margin-block: 2rem;
                  margin-left: 0.1rem;
                  height: 35vh;
           }
        }

.product-box3 >h1{
    /* border: 2px solid red; */
    color: white;
    font-size: 2.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box3 >h1{
                    margin-left: 1.5rem;
           }
        }

.product-box3 >h4{
    /* border: 2px solid red; */
    color: white;
    font-size: 1.8rem;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box3 >h4{
                    margin-left: 1.5rem;
                    margin-block: 0.2rem;
           }
        }

.product-box3 >button{
    padding: 0.8rem 1.5rem;
    border: 1px solid white;
    border-radius: 20px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box3 >button{
                    margin-block: 1rem;
                    margin-left: 1.5rem;
           }
        }

.product-box3 >button:hover{
    background-color: white;
    color: #000;
}

.product-box3 >a{
    color: rgb(136, 132, 132);
    /* border: 2px solid red; */
    margin-left: 1.4rem;
    text-decoration: none;
    /* gap: 2rem; */
}

.product-box3 >a:hover{
    color: white;
}

.product-box4{
    /* border: 2px solid red; */
    border-radius: 10px;
    background-image: radial-gradient(circle, #2d2078, #240a6b, #3d147b);
    width: 30rem;
    height: 50vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box4{
                  /* border: 2px solid greenyellow; */
                  width: 21rem;
                  margin-block: 2rem;
                  margin-left: 0.1rem;
                  height: 35vh;
           }
        }

.product-box4 >h1{
    /* border: 2px solid red; */
    color: white;
    font-size: 2.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box4 >h1{
                    margin-left: 1.5rem;
           }
        }

.product-box4 >h4{
    /* border: 2px solid red; */
    color: white;
    font-size: 1.8rem;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box4 >h4{
                    margin-left: 1.5rem;
                    margin-block: 0.2rem;
           }
        }

.product-box4 >button{
    padding: 0.8rem 1.5rem;
    border: 1px solid white;
    border-radius: 20px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .product-box4 >button{
                    margin-block: 1rem;
                    margin-left: 1.5rem;
           }
        }

.product-box4 >button:hover{
    background-color: white;
    color: #000;
}

.product-box4 >a{
    color: rgb(136, 132, 132);
    /* border: 2px solid red; */
    margin-left: 1.4rem;
    text-decoration: none;
    /* gap: 2rem; */
}

.product-box4 >a:hover{
    color: white;
}

.congnite{
    /* border: 2px solid red; */
    margin-block: 3rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .congnite{
                    /* border: 2px solid red; */
           }
        }

.conginited{
    /* border: 2px solid goldenrod; */
    display: flex;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .conginited{
                    /* border: 2px solid rgb(255, 128, 0); */
                    display: inline-block;
           }
        }

.container{
    /* border: 2px solid greenyellow; */
    width: 33rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .container{
                    /* border: 2px solid rgb(8, 0, 255); */
                    width: 21.3rem;
           }
        }

.container >h1{
    /* border: 2px solid chocolate; */
    width: 20rem;
    color: white;
    font-size: 35px;
    margin-top: 8rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .container >h1{
                    /* border: 2px solid rgb(8, 0, 255); */
                    width: 18rem;
                    margin-left: 1.5rem;
                    margin-top: 5rem;
           }
        }

.container >h3{
    /* border: 2px solid red; */
    width: 15rem;
    color: white;
    font-size: 18px;
    margin-block: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .container >h3{
                    /* border: 2px solid rgb(255, 0, 43); */
                    width: 18rem;
                    margin-left: 1.5rem;
           }
        }

.container >p{
    /* border: 2px solid red; */
    width: 32rem;
    color: white;
    font-size: 17px;
    margin-block: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .container >p{
                    /* border: 2px solid rgb(255, 0, 43); */
                    width: 20.5rem;
                    margin-block: 1rem;
                    margin-left: 0.5rem;
           }
        }

.container >button{
    padding: 0.8rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.container >button:hover{
    background-color: white;
    color: black;
}

.Box{
    /* border: 2px solid blue; */
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Box{
                    /* border: 2px solid rgb(0, 255, 17); */
                    gap: 0.5rem;
                    margin-left: 0.5rem;
           }
        }

.Con1{
    /* border: 2px solid red; */
    height: 40vh;
    width: 14rem;
    background-image: url(./image/Ai.jpeg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Con1{
                    /* border: 2px solid rgb(0, 255, 217); */
                    height: 20vh;
                    width: 10rem;
           }
        }

.Con2{
    /* border: 2px solid red; */
    height: 40vh;
    width: 14rem;
    background-image: url(./image/images\ \(2\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Con2{
                    /* border: 2px solid rgb(0, 255, 217); */
                    height: 20vh;
                    width: 10rem;
           }
        }

.Con3{
    /* border: 2px solid red; */
    height: 40vh;
    width: 14rem;
    background-image: url(./image/Cube.jpeg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Con3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    height: 20vh;
                    width: 10rem;
           }
        }

.Con4{
    /* border: 2px solid red; */
    height: 40vh;
    width: 14rem;
    background-image: url(./image/images\ \(3\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Con4{
                    /* border: 2px solid rgb(0, 255, 217); */
                    height: 20vh;
                    width: 10rem;
           }
        }

.Why{
    /* border: 2px solid blue; */
    margin-block: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Why{
                    /* border: 2px solid rgb(0, 255, 217); */
           }
        }

.Why >h1{
    /* border: 2px solid white; */
    width: 17rem;
    font-size: 37px;
    color: white;
    margin-left: 8.4rem;
    margin-block: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .Why >h1{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 15rem;
                    margin-left: 3rem;
           }
        }

.whyS{
    /* border: 2px solid red; */
    display: flex;
}

.contain{
    /* border: 2px solid indigo; */
}

.why1{
    border: 1px solid white;
    background-color: rgba(33, 33, 33, 0.858);
    width: 28rem;
    border-radius: 26px;
    height: 43vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why1{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 11.5rem;
                    height: 40vh;
           }
        }

.why1 >h3{
    /* border: 2px solid darkgoldenrod; */
    width: 16rem;
    font-size: 20px;
    margin-left: 2.5rem;
    color: white;
    margin-block:1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why1 >h3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 11rem;
                    margin-left: 0.2rem;
           }
        }

.why1 >ul{
    /* border: 2px solid salmon; */
}

.why1 >ul >li{
    /* border: 2px solid saddlebrown; */
    color: white;
    margin-left: 3.3rem;
    width: 18rem;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why1 >ul >li{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 11rem;
                    margin-left: 0.2rem;
                    margin-block: 0.5rem;
           }
        }

.why2{
    border: 1px solid white;
    background-color: rgba(33, 33, 33, 0.858);
    width: 28rem;
    border-radius: 26px;
    margin-block: 2rem;
    height: 19vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why2{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 11rem;
                    height: 18vh;
           }
        }

.why2 >h3{
    /* border: 2px solid darkgoldenrod; */
    width: 16rem;
    font-size: 20px;
    margin-left: 2.5rem;
    margin-top: 2rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why2 >h3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 10.5rem;
                    margin-left: 0.2rem;
                    /* height: 18vh; */
           }
        }

.const{
    /* border: 2px solid white; */
    margin-left: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .const{
                    margin-left: 0.1rem;
           }
        }

.why3{
    border: 1px solid white;
    background-color: rgba(33, 33, 33, 0.858);
    width: 28rem;
    border-radius: 26px;
    height: 19vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9.5rem;
                    height: 18vh;
           }
        }

.why3 >h3{
    /* border: 2px solid darkgoldenrod; */
    width: 16rem;
    font-size: 20px;
    margin-left: 2.5rem;
    margin-top: 2rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why3 >h3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9rem;
                    margin-left: 0.2rem;
                    /* height: 18vh; */
           }
        }

.why4{
    border: 1px solid white;
    background-color: rgba(33, 33, 33, 0.858);
    width: 28rem;
    border-radius: 26px;
    height: 19vh;
    margin-top: 1.8rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why4{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9.5rem;
                    height: 18vh;
           }
        }

.why4 >h3{
    /* border: 2px solid darkgoldenrod; */
    width: 16rem;
    font-size: 20px;
    margin-left: 2.5rem;
    margin-top: 2rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why4 >h3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9rem;
                    margin-left: 0.2rem;
                    /* height: 18vh; */
           }
        }

.why5{
    border: 1px solid white;
    background-color: rgba(33, 33, 33, 0.858);
    width: 28rem;
    border-radius: 26px;
    margin-top: 2.3rem;
    height: 19vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why5{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9.5rem;
                    height: 18vh;
           }
        }

.why5 >h3{
    /* border: 2px solid darkgoldenrod; */
    width: 16rem;
    font-size: 20px;
    margin-left: 2.5rem;
    margin-top: 1.2rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .why5 >h3{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 9rem;
                    margin-left: 0.2rem;
                    /* height: 18vh; */
           }
        }

.industry-container{
    /* border: 2px solid red; */
    margin-block: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .industry-container{
                    border: 1px solid white;
                    overflow-x: scroll;
           }
        }

.industry-container >h1{
    /* border: 2px solid wheat; */
    width: 20rem;
    font-size: 40px;
    color: white;
    margin-left: 8rem;
    margin-block: 1.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .industry-container >h1{
                    /* border: 2px solid rgb(0, 255, 217); */
                    width: 11rem;
                    margin-left: 5rem;
           }
        }

.industry-content{
    /* border: 2px solid darkorange; */
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .industry-content{
                   gap: 2rem;
                   margin-left: 1rem;
           }
        }

.finance-box{
    /* border: 2px solid darkred; */
    margin-block: 1rem;
    width: 18.3rem;
}

.finance-image{
    /* border: 2px solid firebrick; */
    height: 48vh;
    width: 18rem;
    background-image: url(./image/download\ \(1\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

.finance-box >h1{
    /* border: 2px solid salmon; */
    width: 10rem;
    font-size: 30px;
    color: purple;
    margin-block: 1rem;
}

.finance-box >p{
    /* border: 2px solid salmon; */
    width: 16em;
    font-size: 18px;
    color: white;
    margin-block: 1rem;
}

.finance-box >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-top: 2.5rem;
}

.finance-box >button:hover{
    background-color: white;
    color: #000;
}

.health-box{
    /* border: 2px solid darkred; */
    width: 18.3rem;
    margin-block: 1rem;
}

.health-image{
    /* border: 2px solid firebrick; */
    height: 48vh;
    width: 18rem;
    background-image: url(./image/download\ \(3\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

.health-box >h1{
    /* border: 2px solid salmon; */
    width: 10rem;
    color: purple;
    font-size: 30px;
    margin-block: 1rem;
}

.health-box >p{
    /* border: 2px solid salmon; */
    width: 16em;
    font-size: 18px;
    color: white;
    margin-block: 1rem;
}

.health-box >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.health-box >button:hover{
    background-color: white;
    color: #000;
}

.cities-box{
    /* border: 2px solid darkred; */
    width: 18.3rem;
    margin-block: 1rem;
}

.cities-image{
    /* border: 2px solid firebrick; */
    height: 48vh;
    width: 18rem;
    background-image: url(./image/download\ \(2\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

.cities-box >h1{
    /* border: 2px solid salmon; */
    width: 10.5rem;
    font-size: 30px;
    color: purple;
    margin-block: 1rem;
}

.cities-box >p{
    /* border: 2px solid salmon; */
    width: 16em;
    font-size: 18px;
    color: white;
    margin-block: 1rem;
}

.cities-box >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.cities-box >button:hover{
    background-color: white;
    color: #000;
}

.manufacture-box{
    /* border: 2px solid darkred; */
    width: 18.3rem;
    margin-block: 1rem;
}

.manufacture-image{
    /* border: 2px solid firebrick; */
    height: 48vh;
    width: 18rem;
    background-image: url(./image/download\ \(4\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

.manufacture-box >h1{
    /* border: 2px solid salmon; */
    width: 18rem;
    font-size: 25px;
    color: purple;
    margin-block: 1rem;
}

.manufacture-box >p{
    /* border: 2px solid salmon; */
    width: 16em;
    font-size: 18px;
    color: white;
    margin-block: 1rem;
}

.manufacture-box >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.manufacture-box >button:hover{
    background-color: white;
    color: #000;
}

.supply-box{
    /* border: 2px solid darkred; */
    width: 18.3rem;
    margin-block: 1rem;
}

.supply-image{
    /* border: 2px solid firebrick; */
    height: 48vh;
    width: 18rem;
    background-image: url(./image/download\ \(5\).jpg);
    background-position: center;
    background-size: cover;
    border-radius: 30px;
}

.supply-box >h1{
    /* border: 2px solid salmon; */
    width: 18rem;
    font-size: 25px;
    color: purple;
    margin-block: 1rem;
}

.supply-box >p{
    /* border: 2px solid salmon; */
    width: 16em;
    font-size: 18px;
    color: white;
    margin-block: 1rem;
}

.supply-box >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.supply-box >button:hover{
    background-color: white;
    color: #000;
}

.part-container{
    /* border: 2px solid red; */
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-container{
                   overflow-x: scroll;
           }
        }

.part-container >h1{
    /* border: 2px solid salmon; */
    width: 15rem;
    font-size: 35px;
    margin-left: 8rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-container >h1{
                    width: 10rem;
                    margin-left: 5rem;
           }
        }

.part-container >h4{
    /* border: 2px solid salmon; */
    width: 23rem;
    font-size: 19px;
    margin-block: 1rem;
    margin-left: 8rem;
    color: white;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-container >h4{
                    width: 18rem;
                    margin-left: 2rem;
           }
        }

.who{
    /* border: 2px solid white; */
    display: flex;
    gap: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .who{
                   width: 59em;
                   gap: 1rem;
           }
        }

.part-content1{
    /* border: 2px solid red; */
    background-color: rgb(39, 39, 39);
    height: 30vh;
    width: 11.5rem;
    background-image: url(./image/download\ \(1\).png);
    background-position: center;
    background-size: cover;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-content1{
                    width: 11rem;
                    /* margin-left: 2rem; */
           }
        }

.part-content2{
    /* border: 2px solid red; */
    background-color: rgb(39, 39, 39);
    height: 30vh;
    width: 11.5rem;
    background-image: url(./image/download\ \(2\).png);
    background-position: center;
    background-size: cover;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-content2{
                    width: 11rem;
                    /* margin-left: 2rem; */
           }
        }

.part-content3{
    /* border: 2px solid red; */
    background-color: rgb(39, 39, 39);
    height: 30vh;
    width: 11.5rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-content3{
                    width: 11rem;
                    /* margin-left: 2rem; */
           }
        }

.part-content3 >img{
    /* border: 2px solid blue; */
    height: 25vh;
    margin-top: 1rem;
    width: 11rem;
}

.part-content4{
    /* border: 2px solid red; */
    height: 30vh;
    width: 11.5rem;
    background-image: url(./image/download\ \(4\).png);
    background-color: rgb(39, 39, 39);
    background-position: center;
    background-size: cover;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-content4{
                    width: 11rem;
                    /* margin-left: 2rem; */
           }
        }
.part-content5{
    /* border: 2px solid red; */
    height: 30vh;
    width: 11.5rem;
    background-image: url(./image/download\ \(2\).png);
    background-color: rgb(39, 39, 39);
    background-position: center;
    background-size: cover;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .part-content5{
                    width: 11rem;
                    /* margin-left: 2rem; */
           }
        }

.box{
    border-bottom: 2px solid white;
    /* display: flex; */
    margin-block: 5rem;
    height: 50vh;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .box{
                    width: 70rem;
           }
        }

.contents{
    /* border: 2px solid firebrick; */
    background-image: radial-gradient(circle, #1f1848, #180c39, #100620);
    height: 44vh;
    margin-left: 1rem;
    width: 60rem;
    display: flex;
}

.containers{
    /* border: 2px solid green; */
    height: 45vh;
}

.containers >h1{
    /* border: 2px solid blueviolet; */
    width: 30rem;
    height: 30vh;
    margin-left: 4rem;
    margin-top: 5rem;
    font-size: 30px;
    color: white;
}

.btn >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    margin-left: 14rem;
    margin-top: 7rem;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    /* margin-block: 1rem; */
}

.btn >button:hover{
    background-color: white;
    color: #000;
}

.cover{
    /* border: 2px solid rgb(87, 0, 0); */
    display: flex;

    gap: 2rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .cover{
                border: 1px solid white;
                overflow-x: scroll;
           }
        }

.box1{
    /* border: 2px solid red; */
    height: 75vh;
    width: 28rem;
}

.box1 >h1{
    /* border: 2px solid blue; */
    width: 20rem;
    font-size: 30px;
    color: white;
    margin-block: 2rem;
}

.box1 >p{
    /* border: 2px solid blue; */
    width: 25.2rem;
    font-size: 25px;
    margin-block: 2rem;
    color: white;
}

.box1 >button{
    padding: 0.6rem 1.5rem;
    border: 1px solid white;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    color: #fff;
    margin-block: 1rem;
}

.box1 >button:hover{
    background-color: white;
    color: #000;
}

.box1 >h2{
    width: 20rem;
    font-size: 28px;
    color: white;
    margin-block: 2rem;
}

.box1_media >a{
    /* border: 2px solid red; */
    display: flex;
    opacity: .58;
    /* gap: 4rem; */
}

.box1_media >a:hover{
    opacity: .9;
}

.box1-content{
    /* border: 2px solid goldenrod; */
}

.box1_media{
    /* border: 2px solid blue; */
    display: flex;
    color: black;
    width: 16rem;
    align-items: center;
    /* justify-content: space-between; */
    gap: 3rem;
}

.box2{
    /* border: 2px solid darkblue; */
}

.box2 >h1{
    /* border: 2px solid blue; */
    width: 20rem;
    font-size: 35px;
    color: white;
    margin-block: 2rem;
}

.box2 >h2{
    width: 20rem;
    font-size: 25px;
    color: white;
    margin-block: 2rem;
}

.box3 >h1{
    /* border: 2px solid blue; */
    width: 10rem;
    font-size: 35px;
    color: white;
    margin-block: 2rem;
}

.box3 >h2{
    width: 20rem;
    font-size: 25px;
    color: white;
    margin-block: 2rem;
}

.futar{
    /* border: 2px solid red; */
    display: flex;
    gap: 25rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .futar{
                /* border: 2px solid darkgoldenrod; */
                gap: 2rem;
           }
        }

.futar >h1{
    width: 20rem;
    font-size: 25px;
    color: white;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .futar >h1{
                /* border: 2px solid darkgoldenrod; */
                width: 13rem;
                height: 4vh;
                margin-top: 2rem;
                font-size: 15px;
           }
        }

.futar >h2{
    width: 20rem;
    font-size: 25px;
    color: white;
    margin-block: 1rem;
}

              /* Responsiveness code */
              @media(min-width: 162px) and (max-width: 460px){
                .futar >h2{
                /* border: 2px solid darkgoldenrod; */
                width: 18rem;
                height: 4vh;
                margin-top: 2.3rem;
                font-size: 15px;
           }
        }