@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@700&family=Poppins:wght@400;500;600;700&display=swap');
*{
    margin: 0;
    padding: 0;
    outline: 0;
    box-sizing: border-box;
}
body{
    font-family: 'Poppins', sans-serif;
}
.container{
    width: 1110px;
    margin: auto;
    /* border: 2px solid black; */
}
ul {
    list-style-type: none;
}
a {
    text-decoration: none;
}
body {
    font-family: "Poppins", sans-serif;
}
.row {
    display: flex;
    flex-wrap: wrap;
}
/* header */
#header .nav .row{
    justify-content: space-between;
    align-items: center;
}
#header .nav .row ul li{
    display: inline-block;
    /* justify-content: center; */
}
#header .nav .row ul li a{
    text-transform: uppercase;
    display: inline-block;
    color: #353535;
    padding: 5px 28px;
    line-height: 200%;
    font-size: 15px;
    font-weight: 500;
    position: relative;
}
#header .nav .row ul  li:nth-child(5) a{
    margin-right: 0;
}
#header .nav ul li a::after {
    position: absolute;
    content: "";
    width: 0%;
    right: 0;
    height: 1px;
    background-color: #353535;
    bottom: 0;
    transition: 0.5s;
}
#header .nav ul li a:hover::after {
    left: 0;
    width: 100%;
}
/* header end */
/* footer */
footer{
    height: 480px;
    background:#9B9B9B url(./../image/footer-bg.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
footer .container .row .upper-footer{
    margin-top: 80px;
    display: flex;
    flex-direction: row;
    gap: 148px;
    /* border: 2px solid white; */
}
footer .container .row .upper-footer .heading{
    /* border: 2px solid white; */
    width: 410px;
    height: 159px;
}
footer .container .row .upper-footer .heading h2{
    font-size: 700;
    color: white;
    font-size: 36px;
    line-height: 9%;
    margin-top: 15px;
    margin-bottom: 25px;
}
footer .container .row .upper-footer .heading p{
    color: #BBB9B9;
    line-height: 180%;
    font-weight: 400;
    font-size: 16px;
}
footer .container .row .upper-footer .talk{
    width: 174px;
    height: 63px;
    background-color: #FFCC00;
    border-radius: 16px;
    justify-content: center;
    text-align: center;
    display: flex;
    align-items: center;
}
footer .container .row .upper-footer .talk span a{
    color: white;
    font-size: 18px;
    font-weight: 600;
}
footer .container .row .upper-footer .talk i{
    color: white;
    padding-left: 10px;
    font-size: large;
    cursor: pointer;
}
footer .container .row .lower-footer{
    margin-top: 80px;
    /* border: 2px solid white; */
    display: flex;
    flex-direction: row;
    gap: 100px;
}
footer .container .row .lower-footer .call{
    margin-right: 140px;
}
footer .container .row .lower-footer .mail{
    margin-right: 83px;
}
footer .container .row .lower-footer p{
    font-weight: 400;
    font-size: 18px;
    line-height: 180%;
    color: #BBB9B9;
    text-transform: capitalize;
}
footer .container .row .lower-footer a{
    color: white;
    font-size: 20px;
    font-weight: 500;
}
footer .container .row .lower-footer .follow ul li,
#main .container .row .left-content .follow ul li{
    display: inline-block;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 400;
    line-height: 180%;
    text-transform: capitalize;
}
footer .container .row .lower-footer .follow ul li:nth-child(4),
#main .container .row .left-content .follow ul li:nth-child(4){
    padding-right: 0;
}
footer .container .row .lower-footer .follow ul li i,
#main .container .row .left-content .follow ul li i,{
    display: inline-block;
    width: 30px;
    text-align: center;
    line-height: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #484848;
}
/* footer end */
/* home */
/* main */
#main{
    margin: 80px 0;
    /* border: 2px solid black; */
}
#main .container .row .left-content{
    width: 50%;
    /* border: 2px solid black; */
}
#main .container .row .left-content .heading{
    /* border: 2px solid black; */
}
#main .container .row .left-content .heading p{
    font-size: 24px;
    font-weight: 400;
    text-transform: capitalize;
    color: #353535;
}
#main .container .row .left-content .heading p i,
#main .container .row .left-content .click-span a i{
    padding-left: 10px;
}
#main .container .row .left-content .heading h1{
    font-family: "PT Sans", sans-serif;
    font-size: 64px;
    font-weight: 700;
    color: #353535;
}
#main .container .row .left-content .heading small{
    display: block;
    width: 425px;
    line-height: 190%;
    font-size: 20px;
    font-weight: 400;
    color: #353535;
}
#main .container .row .left-content .click-span{
    display: flex;
    gap: 40px;
    padding: 40px 0;
}
#main .container .row .left-content .click-span .talk,
#main .container .row .left-content .click-span .download{
    width: 209px;
    height: 69px;
    /* border: 2px solid black; */
    border-radius: 20px;
    text-align: center;
    background-color: #FFCC00;
}
#main .container .row .left-content .click-span a{
    color: white;
    font-size: 20px;
    font-weight: 600;
    line-height: 69px;
    text-transform: capitalize;
}
#main .container .row .left-content .follow ul li{
    color: #353535;
    padding: 0 4px;
    cursor: pointer;
}
#main .container .row .left-content .follow ul li i{
    background-color: #F4F3F3;
    color: black;
    cursor: pointer;
}
#main .container .row .right-content{
    width: 50%;
}
#main .container .row .right-content img{
    width: 100%;
}
/* main end */
/* main section-2 */
#main-2{
    /* border: 2px solid red; */
    background-image: url(./../image/main-2-bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
#main-2 .container .row .left-content,
#main-2 .container .row .right-content{
    width: 50%;
    /* border: 2px solid red; */
}
#main-2 .container .row .left-content img{
    width: 100%;
}
#main-2 .container .row .right-content{
    padding-top: 150px;
}
#main-2 .container .row .right-content p{
    color: #353535;
    font-weight: 400;
    font-size: 20px;
    line-height: 190%;
}
#main-2 .container .row .right-content .see-more{
    margin-top: 25px;
    width: 171px;
    height: 66px;
    border: 2px solid #353535;
    border-radius: 20px;
    text-align: center;
}
#main-2 .container .row .right-content .see-more a{
    text-transform: capitalize;
    color: #353535;
    font-size: 18px;
    line-height: 66px;
}
/* main section-2 end */
/* main section-3  */
#main-3{
    margin-top: 80px;
    /* border: 2px solid red; */
}
#main-3 .container .row .product-card{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-evenly;
    /* border: 2px solid red; */
}
#main-3 .container .row .product-card .card .img{
    width: 78px;
    height: 79px;
    margin: auto;
}
#main-3 .container .row .product-card .card{
    width: 350px;
    height: 367px;
    padding: 45px 0;
    text-align: center;
    border: 2px solid whitesmoke;
    border-radius: 20px;
    box-shadow: 5px 5px 5px -5px #353535;
}
#main-3 .container .row .product-card .card .img img{
    width: 100%;
}
#main-3 .container .row .product-card .card p{
    padding-top: 25px;
    margin: auto;
    width: 258px;
    height: 120px;
    font-size: 16px;
    font-weight: 400;
    color: #7A7A7A;
}
#main-3 .container .row .product-card .card h3{
    padding-top: 25px;
    font-size: 22px;
    font-weight: 600;
    text-transform: capitalize;
    color: #353535;
}
/* main section-3 end */
/* main section 4 */
#main-4{
    margin: 80px 0;
    /* border: 2px solid black; */
}
#main-4 .container{
    width: 1110px;
    height: 500px;
    /* border: 2px solid black; */
    background-image: url(./../image/main-4-bg.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
#main-4 .container .row .left-content{
    width: 516px;
    height: 462px;
    padding-top: 40px;
    /* border: 2PX SOLID black; */
}
#main-4 .container .row .left-content img{
    width: 100%;
}
#main-4 .container .row .right-content{
    width: 50%;
    padding: 100px;
}
#main-4 .container .row .right-content h2{
    font-family: "PT Sans", sans-serif;
    font-size: 44px;
    font-weight: 700;
    color: #353535;
    text-transform: capitalize;
    padding-bottom: 25px;
}
#main-4 .container .row .right-content p{
    font-size: 18px;
    font-weight: 400;
    color: #353535;
}
#main-4 .container .row .right-content .see-more{
    width: 171px;
    height: 66px;
    border: 2px solid black;
    border-radius: 20px;
    text-align: center;
    margin-top: 60px;
    margin-left: 25px;
}
#main-4 .container .row .right-content .see-more a{
    font-size: 17px;
    color: #353535;
    font-weight: 600;
    line-height: 66px;
    text-transform: capitalize;
}
/* main section 4 end */
/* main sect6ion 5 */
#main-5{
    margin: 80px;
    /* border: 2px solid red; */
}
#main-5 .container .row{
    justify-content: space-between;
}
#main-5 .container .row .left-content,
#main-5 .container .row .right-content{
    width: 45%;
    /* border: 2px solid red; */
}
#main-5 .container .row .left-content .product-card{
    /* border: 2px solid black; */
    display: flex;
    flex-direction: column;
    gap: 20px;
}
#main-5 .container .row .left-content .product-card .card{
    display: flex;
    flex-direction: row;
    gap: 25px;
    padding-left: 20px;
    width: 380px;
    height: 92px;
    /* border: 2px solid black; */
    box-shadow: 5px 5px 15px -5px #353535;
    border-radius: 20px;
}
#main-5 .container .row .left-content .product-card .card .icon{
    width: 58px;
    height: 58px;
    margin-top: 18px;
    background-color: #55852F;
    border-radius: 50%;
}
#main-5 .container .row .left-content .product-card .card:nth-child(2) .icon{
    background-color: #FEDC2A;
}
#main-5 .container .row .left-content .product-card .card:nth-child(3) .icon{
    background-color: #FF8D3A;
}
#main-5 .container .row .left-content .product-card .card .icon i{
    display: block;
    line-height: 58px;
    color: white;
    text-align: center;
    font-size: 32px;
}
#main-5 .container .row .left-content .product-card .card .heading{
    margin-top: 18px;
    width: 190px;
    height: 55px;
    /* border: 2px solid black; */
}
#main-5 .container .row .left-content .product-card .card .heading h3{
    font-weight: 600;
    font-size: 18px;
    text-transform: capitalize;
    color: #353535;
}
#main-5 .container .row .left-content .product-card .card .heading small{
    font-size: 12px;
    font-weight: 500;
    color: #353535;
}
#main-5 .container .row .right-content{
    text-align: right;
}
#main-5 .container .row .right-content h3{
    font-family: "PT Sans", sans-serif;
    font-size: 50px;
    font-weight: 700;
    color: #353535;
    text-transform: capitalize;
    margin-bottom: 26px;
}
#main-5 .container .row .right-content p{
    font-size: 20px;
    color: #353535;
    margin-bottom: 32px;
}
#main-5 .container .row .right-content .number{
    display: flex;
    width: 298px;
    height: 86px;
    margin-left: auto;
    /* border: 2px solid black; */
    justify-content: space-between;
}
#main-5 .container .row .right-content .number h3{
    font-size: 40px;
    font-weight: 700;
    font-family: "PT Sans", sans-serif;
    color: #353535;
}
#main-5 .container .row .right-content .number p{
    font-size: 14px;
    font-weight: 500;
    color: #353535;
    text-transform: capitalize;
    /* border: 2px solid black; */
}
/* main sect6ion 5 end */
/* main section 6 */
#main-6{
    margin: 80px;
    /* border: 2px solid black; */
}
#main-6 .container .title{
    /* border: 2px solid black; */
    margin: auto;
    text-transform: capitalize;
    font-family: "PT Sans", sans-serif;
    font-size: 50px;
    color: #353535;
    font-weight: 700;
    margin-bottom: 70px;
}
#main-6 .container .row .work .card{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 44px;
}
#main-6 .container .row .work .card .heading{
    width: 30%;
    /* border: 2px solid black; */
}
#main-6 .container .row .work .card .heading h3,
#main-6 .container .row .work .card .content h3{
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    color: #353535;
    margin-bottom: 12px;
}
#main-6 .container .row .work .card .heading p,
#main-6 .container .row .work .card .content p{
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    color: #7A7A7A;
}
#main-6 .container .row .work .card .content{
    width: 50%;
    position: relative;
    /* border: 2px solid black; */
}
#main-6 .container .row .work,
#about .section-3 .container .row .left-content .experience-card .card,
#about .section-3 .container .row .left-content .experience-card,
#about .section-3 .container .row .right-content .experience-card .card,
#about .section-3 .container .row .right-content .experience-card{
    position: relative;
}
#main-6 .container .row .work::before,
#about .section-3 .container .row .left-content .experience-card::before,
#about .section-3 .container .row .right-content .experience-card::before{
    content: '';
    position: absolute;
    width: 2px;
    height: 100%;
    border-left: 2px dashed #353535;
    top: 0;
    left: calc(50% - 80px);
}
#main-6 .container .row .work .card .content::before,
#about .section-3 .container .row .left-content .experience-card .card .date::before,
#about .section-3 .container .row .right-content .experience-card .card .date::before{
    position: absolute;
    content: '';
    width: 42px;
    height: 42px;
    background-color: white;
    border: 2px dashed #353535;
    border-radius: 50%;
    left: -105px;
    top: -21px;
    z-index: 95;
}
#main-6 .container .row .work .content::after,
#about .section-3 .container .row .left-content .experience-card .card .date::after,
#about .section-3 .container .row .right-content .experience-card .card .date::after{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    border-radius: 50%;
    left: -92px;
    top: -8px;
    z-index: 9595;
}
#main-6 .container .row .work .card:nth-child(1) .content::after,
#about .section-3 .container .row .left-content .experience-card .card:nth-child(1) .date::after,
#about .section-3 .container .row .right-content .experience-card .card:nth-child(1) .date::after{
    background-color: #52AB70;
}
#main-6 .container .row .work .card:nth-child(2) .content::after,
#about .section-3 .container .row .left-content .experience-card .card:nth-child(2) .date::after,
#about .section-3 .container .row .right-content .experience-card .card:nth-child(2) .date::after{
    background-color: #F17676;
}
#main-6 .container .row .work .card:nth-child(3) .content::after,
#about .section-3 .container .row .left-content .experience-card .card:nth-child(3) .date::after,
#about .section-3 .container .row .right-content .experience-card .card:nth-child(3) .date::after{
    background-color: #FFD233;
}
/* main section 6 end */
/* main section 7 */
#main-7{
    margin: 80px;
}
#main-7 .container .row{
    justify-content: space-between;
}
#main-7 .container .row .left-content,
#main-7 .container .row .right-content{
    width: 48%;
    /* border: 2px solid red; */
}
#main-7 .container .row .left-content h2{
    font-size: 50px;
    font-weight: 700;
    font-family: "PT Sans", sans-serif;
    color: #353535;
    margin-bottom: 40px;
}
#main-7 .container .row .left-content p{
    font-size: 20px;
    font-weight: 400;
    color: #353535;
    margin-bottom: 14px;
}
#main-7 .container .row .left-content .download{
    width: 180px;
    height: 49px;
    /* border: 2px solid black; */
    text-align: center;
    line-height: 49px;
    text-transform: capitalize;
    border-radius: 12px;
    background-color: #FFCC00;
}
#main-7 .container .row .left-content .download a{
    color: white;
    font-size: 16px;
}
#main-7 .container .row .left-content .download a i{
    padding-left: 10px;
}
#main-7 .container .row .right-content .top-section{
    flex-direction: row;
    justify-content: flex-start;
    gap: 72px;
    /* border: 2px solid black; */
}
#main-7 .container .row .right-content .top-section .skills,
#main-7 .container .row .right-content .top-section .education{
    width: 174px;
    height: 63px;
    border-radius: 20px;
    text-align: center;
    border: 2px solid white;
    transition: 0.3s;
    margin-bottom: 25px;
}
#main-7 .container .row .right-content .top-section .skills a,
#main-7 .container .row .right-content .top-section .education a{
    text-transform: capitalize;
    color: #353535;
    line-height: 63px;
    font-size: 18px;
    font-weight: 500;
}
#main-7 .container .row .right-content .top-section .skills:hover,
#main-7 .container .row .right-content .top-section .education:hover{
    border: 2px solid #353535;
    transition: 0.3s;
}
#main-7 .container .row .right-content .lower-section .card,
#about .container .row .skills-card .card{
    margin-bottom: 25px;
    position: relative;
}
#main-7 .container .row .right-content .lower-section .card h3,
#about .container .row .skills-card .card h3{
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
}
#main-7 .container .row .right-content .lower-section .card .half,
#about .container .row .skills-card .card .half{
    margin-top: 11px;
    width: 100%;
    height: 6px;
    border-radius: 50px;
    background-color: #D9D9D9;
}
#main-7 .container .row .right-content .lower-section .card .value,
#about .container .row .skills-card .card .value{
    width: 85%;
    height: 6px;
    bottom: 0;
    border-radius: 50px;
    background-color: #F16500;
    position: absolute;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(2) .value{
    width: 75%;
    background-color: #03249B;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(3) .value{
    width: 80%;
    background-color: #700D60;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(4) .value{
    width: 70%;
    background-color: #234BDA;
}
#main-7 .container .row .right-content .lower-section .card p,
#about .container .row .skills-card .card p{
    position: absolute;
    top: 0;
    left: 80%;
    font-size: 18px;
    color: #F16500;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(2) p{
    left: 70%;
    color: #03249B;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(3) p{
    left: 75%;
    color: #700D60;
}
#main-7 .container .row .right-content .lower-section .card:nth-child(4) p{
    left: 65%;
    color: #234BDA;
}
/* main section 7 end */
/* main section 8 */
#main-8{
    margin: 80px 0 0 0;
    padding: 70px 0;
    background-color: #FFF7D5;
}
#main-8 .container .row .heading{
    width: 613px;
    height: 142px;
    margin: auto;
    text-align: center;
    margin-bottom: 70px;
}
#main-8 .container .row .heading h3{
    font-family: "PT Sans", sans-serif;
    font-size: 50px;
    font-weight: 700;
    text-transform: capitalize;
    color: #353535;
}
#main-8 .container .row .heading p{
    font-size: 18px;
    font-weight: 500;
    color: #7A7A7A;
}
#main-8 .container .row .services-card{
    gap: 25px;
    justify-content: space-between;
    /* border: 2px solid red; */
}
#main-8 .container .row .services-card .card{
    width: 350px;
    height: 422px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: white;
    border-radius: 12px;
    /* border: 2px solid white; */
    text-align: center;
    box-shadow: 5px 5px 5px -5px #353535;
    transition: 0.4s;
}
#main-8 .container .row .services-card .card img{
    width: 88px;
    height: 88px;
    margin-bottom: 20px;
}
#main-8 .container .row .services-card .card h3{
    font-size: 24px;
    color: #353535;
    font-weight: 600;
}
#main-8 .container .row .services-card .card p{
    width: 253px;
    height: 135px;
    font-size: 15px;
    font-weight: 400;
    color: #7A7A7A;
    margin-top: 20px;
}
#main-8 .container .row .services-card .card:hover{
    scale: 1.1;
    background-image: linear-gradient(to right, #FFCC00, #FFE476);
    transition: 0.3s;
}
#main-8 .container .row .services-card .card:hover p{
    width: 269px;
}
#main-8 .container .row .services-card .card:hover h3{
    font-size: 26px;
}
#main-8 .container .row .services-card .card:hover p{
    font-size: 16px;
}
/* main section 8 end */
/* main section 9 */
#main-9{
    padding-top: 92px;
    background-color: #FBFBFB;
}
#main-9 .container .row .heading h3{
    font-family: "PT Sans", sans-serif;
    font-size: 50px;
    font-weight: 700;
    color: #353535;
    margin-bottom: 13px;
}
#main-9 .container .row .heading p{
    font-size: 18px;
    font-weight: 400;
    color: #7A7A7A;
    width: 703px;
    height: 64px;
    margin-bottom: 63px;
}
#main-9 .container .content .left-content,
#main-9 .container .content .right-content{
    width: 50%;
    margin-bottom: 57px;
    /* border: 2px solid red; */
}
#main-9 .container .content .left-content img{
    width: 100%;
}
#main-9 .container .content .right-content{
    padding: 95px 0 0 40px;
    width: 500px;
}
#main-9 .container .content .right-content p{
    font-size: 20px;
    font-weight: 400;
    color: #7A7A7A;
    margin-bottom: 27px;
}
#main-9 .container .content .right-content h3{
    padding-left: 50px;
    font-size: 24px;
    font-weight: 500;
    color: #353535;
}
#main-9 .container .content .right-content h4{
    padding-left: 50px;
    font-size: 16px;
    font-weight: 400;
    color: #7A7A7A;
}
/* main section 9 end */
/* main section 10  */
#main-10{
    margin: 80px;
    /* border: 2px solid red; */
}
#main-10 .container .row .heading{
    margin-left: auto;
}
#main-10 .container .row .heading h2{
    text-transform: capitalize;
    font-size: 50px;
    font-family: "PT Sans", sans-serif;
    font-weight: 700;
    color: #353535;
}
#main-10 .container .row .product-card{
    justify-content: space-between;
    margin-top: 100px;
    /* border: 2px solid red; */
}
#main-10 .container .row .product-card .card{
    width: 524px;
    height: 200px;
    /* border: 2px solid red; */
    display: flex;
    flex-direction: row;
}
#main-10 .container .row .product-card .card .image{
    width: 260px;
    height: 200px;
    /* border: 2px solid red; */
}
#main-10 .container .row .product-card .image img{
    width: 100%;
    height: 100%;
}
#main-10 .container .row .card-heading{
    padding-left: 25px;
}
#main-10 .container .row .card-heading .date,
#about .section-3 .container .row .date{
    gap: 25px;
    margin-bottom: 10px;
}
#main-10 .container .row .card-heading .date p,
#about .section-3 .container .row .date p,
#blog .section-2 .container .row .right-content p,
#blog .section-3 .container .row .blog-card .card .heading p{
    font-size: 14px;
    color: #7A7A7A;
}
#main-10 .container .row .card-heading .date p i,
#about .section-3 .container .row .date p i,
#blog .section-2 .container .row .right-content p i,
#blog .section-3 .container .row .blog-card .card .heading p i{
    padding-right: 10px;
}
#main-10 .container .row .card-heading .date h3{
    font-size: 14px;
    font-weight: 500;
    color: #353535;
}
#main-10 .container .row .card-heading h3{
    font-size: 18px;
    font-weight: 600;
    color: #353535;
}
#main-10 .container .row .card-heading .read p{
    font-size: 18px;
    color: #353535;
    font-weight: 500;
    margin-top: 15px;
}
/* main section 10 end  */
/* main section 11 */
#main-11 .container{
    background-image: linear-gradient(to right, #FFCC00, #FFF5CB);
    height: 295px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 80px;
}
#main-11 .container .row .content .left-content,
#main-11 .container .row .content .right-content{
    /* border: 2px solid red; */
    width: 50%;
}
#main-11 .container .row .content .left-content .heading p{
    font-size: 20px;
    font-weight: 400;
    color: #353535;
    text-transform: capitalize;
}
#main-11 .container .row .content .left-content .heading h3{
    font-size: 36px;
    font-weight: 600;
    color: #353535;
    text-transform: capitalize;
}
#main-11 .container .row .content .left-content .heading h4{
    font-size: 18px;
    font-weight: 400;
    color: #353535;
    text-transform: capitalize;
}
#main-11 .container .row .content .right-content .box{
    position: relative;
}
#main-11 .container .row .content .right-content .box .left-box{
    margin-left: 15px;
    z-index: 9;
}
#main-11 .container .row .content .right-content .box .left-box input{
    width: 455px;
    height: 82px;
    border-radius: 16px;
    padding-left: 25px;
    font-size: 18px;
    border: none;
    text-transform: capitalize;
}
#main-11 .container .row .content .right-content .box .right-box{
    width: 132px;
    height: 82px;
    top: 0;
    right: 0;
    z-index: 99;
    background-color: #FF6565;
    border-radius: 0 16px 16px 0;
    position: absolute;
    border: none;
    cursor: pointer;
}
#main-11 .container .row .content .right-content .box .right-box h3{
    line-height: 82px;
    text-align: center;
    text-transform: capitalize;
    font-size: 16px;
    font-weight: 600;
    color: white;
}
/* main section 11 end */
/* home end */
/* about */
/* about main section 1 */
#about .section-1 .container,
#project .section-1 .container,
#contact .section-1 .container,
#blog .section-1 .container{
    margin-top: 80px;
    height: 180px;
    background-image: url(./../image/about-1-bg.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#about .section-1 .container .row,
#project .section-1 .container .row .title,
#contact .section-1 .container .row .title,
#blog .section-1 .container .row .title{
    flex-direction: column;
    color: white;
    margin: auto;
    text-align: center;
}
#about .section-1 .container .row h1,
#project .section-1 .container .row .title h1,
#contact .section-1 .container .row .title h1,
#blog .section-1 .container .row .title h1{
    margin-top: 30px;
    margin-bottom: 15px;
    font-size: 46px;
    font-weight: 700;
    text-transform: capitalize;
    font-family: "PT Sans", sans-serif;
}
#about .section-1 .container .row p,
#project .section-1 .container .row .title p,
#contact .section-1 .container .row .title p,
#blog .section-1 .container .row .title p{
    font-size: 18px;
    font-weight: 600;
    position: relative;
    width: fit-content;
    margin: auto;
}
#about .section-1 .container .row p::after,
#project .section-1 .container .row .title p::after,
#contact .section-1 .container .row .title p::after,
#blog .section-1 .container .row .title p::after{
    content: "";
    position: absolute;
    width: 84px;
    height: 2px;
    background: white;
    top: 50%;
    right: -90px;
}
#about .section-1 .container .row p::before,
#project .section-1 .container .row .title p::before,
#contact .section-1 .container .row .title p::before,
#blog .section-1 .container .row .title p::before{
    content: "";
    position: absolute;
    width: 84px;
    height: 2px;
    background: white;
    top: 50%;
    left: -90px;
}
/* main section 1 end */
/* about main section 2 */
#about .section-2{
    margin: 80px 0;
}
#about .section-2 .container .row .content{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#about .section-2 .container .row .content .left-content{
    width: 400px;
    /* border: 2px solid black; */
}
#about .section-2 .container .row .content .left-content img{
    width: 100%;
}
#about .section-2 .container .row .content .right-content{
    width: 60%;
    /* border: 2px solid black; */
}
#about .section-2 .container .row .content .right-content .top-content p{
    width: 665px;
    margin-bottom: 105px;
    font-size: 19px;
    font-weight: 400;
    color: #7A7A7A;
}
#about .section-2 .container .row .content .right-content .down-content{
    justify-content: space-between;
}
#about .section-2 .container .row .content .right-content .down-content .left-contents{
    display: flex;
    flex-direction: row;
}
#about .section-2 .container .row .content .right-content .down-content ul li{
    display: flex;
    flex-direction: row;
    padding-bottom: 15px;
}
#about .section-2 .container .row .content .right-content .down-content ul li h4{
    font-size: 19px;
    font-weight: 400;
    color: #7A7A7A;
}
#about .section-2 .container .row .content .right-content .down-content ul li h3,
#about .section-2 .container .row .content .right-content .down-content ul li a{
    font-size: 19px;
    font-weight: 400;
    color: #353535;
    padding-left: 15px;
}
#about .section-2 .container .row .content .right-content .download{
    margin-top: 34px;
    width: 180px;
    height: 49px;
    /* border: 2px solid black; */
    border-radius: 12px;
    text-align: center;
    line-height: 49px;
    background-color: #FFCC00;
    text-transform: capitalize;
}
#about .section-2 .container .row .content .right-content .download a{
    color: white;
    font-size: 16px;
}
#about .section-2 .container .row .content .line{
    width: 100%;
    height: 2px;
    background-color: #7A7A7A;
    margin-top: 70px;
}
/* about main section 2 end */
/* about main section 3 */
#about .section-3{
    margin: 80px 0;
}
#about .section-3 .container .row .left-content .experience-card .card .date::after,
#about .section-3 .container .row .right-content .experience-card .card .date::after{
    background-color: #03249B;
}
#about .section-3 .container .row .left-content .experience-card::before,
#about .section-3 .container .row .right-content .experience-card::before{
    top: 0;
    left: -55px;
}
#about .section-3 .container .row .left-content .experience-card .card .date::before,
#about .section-3 .container .row .right-content .experience-card .card .date::before{
    width: 34px;
    height: 34px;
    left: -74px;
    top: -5px;
    z-index: 95;
}
#about .section-3 .container .row .left-content .experience-card .card .date::after,
#about .section-3 .container .row .right-content .experience-card .card .date::after{
    width: 16px;
    height: 16px;
    left: -63px;
    top: 5px;
    z-index: 9595;
}
#about .section-3 .container .row .left-content,
#about .section-3 .container .row .right-content{
    margin-left: 110px;
    width: 40%;
    /* border: 2px solid red; */
}
#about .section-3 .container .row .left-content .title,
#about .section-3 .container .row .right-content .title{
    font-family: "PT Sans", sans-serif;
    font-size: 40px;
    font-weight: 700;
    color: #353535;
    text-transform: capitalize;
    margin-bottom: 25px;
}
#about .section-3 .container .row .left-content .card,
#about .section-3 .container .row .right-content .card{
    margin-bottom: 45px;
}
#about .section-3 .container .row .left-content .card h3,
#about .section-3 .container .row .right-content .card h3{
    font-size: 20px;
    font-weight: 600;
    color: #353535;
    margin-bottom: 10px;
}
#about .section-3 .container .row .left-content .card p,
#about .section-3 .container .row .right-content .card p{
    font-size: 18px;
    font-weight: 400;
    color: #353535;
    width: 450px;
}
/* about main section 3 end */
/* about main section 4 */
#about .section-4{
    margin: 80px 0;
}
#about .section-4 .container .row{
    flex-direction: column;
}
#about .section-4 .container .row .title{
    margin-bottom: 50px;
}
#about .section-4 .container .row .title h2{
    font-size: 40px;
    font-weight: 700;
    text-transform: capitalize;
    font-family: "PT Sans", sans-serif;
    color: #353535;
}
#about .section-4 .container .row .skills-card .card{
    /* border: 2px solid black; */
    width: 30%;
}
#about .section-4 .container .row .skills-card{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /* border: 2px solid black; */
    justify-content: space-between;
}
#about .container .row .skills-card .card .value{
    top: 53%;
    width: 95%;
    background-color: #F16500;
}
#about .container .row .skills-card .card:nth-child(2) .value{
    width: 80%;
    background-color: #700D60;
}
#about .container .row .skills-card .card:nth-child(3) .value{
    width: 85%;
    background-color: #EFC003;
}
#about .container .row .skills-card .card:nth-child(4) .value{
    width: 95%;
    background-color: #03249B;
}
#about .container .row .skills-card .card:nth-child(2) p{
    left: 75%;
    color: #700D60;
}
#about .container .row .skills-card .card:nth-child(3) p{
    left: 80%;
    color: #EFC003;
}
#about .container .row .skills-card .card:nth-child(4) p{
    left: 90%;
    color: #03249B;
}
#about .container .row .skills-card .card:nth-child(1) p{
    left: 90%;
    color: #F16500;
}
/* about main section 4 end */
/* about end */
/* project */
/* project main section 1 start */
#project{
    margin: 80px 0;
}
#project .section-1 .container .row .title,
#contact .section-1 .container .row .title,
#blog .section-1 .container .row .title{
    position: relative;
    z-index: 19;
}
#project .section-1 .container .row .title .image,
#contact .section-1 .container .row .title .image,
#blog .section-1 .container .row .title .image{
    position: absolute;
    z-index: 0;
    top: 20px;
    right: 64%;
}
/*project main section 1 end*/
/* project main section 2 */
#project .section-2{
    margin: 80px;
}
#project .section-2 .container .row .catagories ul li{
    display: inline-block;
    margin-right: 65px;
    width: 149px;
    height: 63px;
    border: 1px solid white;
    border-radius: 20px;
    text-align: center;
    line-height: 63px;
    transition: 0.4s;
    cursor: pointer;
}
#project .section-2 .container .row .catagories ul li a{
    color: #353535;
    font-size: 14px;
    font-weight: 500;
    text-transform: capitalize;
}
#project .section-2 .container .row .catagories ul li:hover{
    border: 1px solid black;
}
#project .section-2 .container .row .project-card{
    margin: 15px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
#project .section-2 .container .row .project-card .card{
    margin: 30px 0;
    width: 500px;
    display: flex;
    flex-direction: column;
    /* border: 2px solid red; */
}
#project .section-2 .container .row .project-card .card .image{
    width: 500px;
    /* border: 2px solid red; */
}
#project .section-2 .container .row .project-card .card .image img{
    /* border: 2px solid red; */
    width: 100%;
}
#project .section-2 .container .row .project-card .card h4{
    color: #7A7A7A;
    font-weight: 400;
    font-size: 15px;
    padding: 5px 0;
}
#project .section-2 .container .row .project-card .card h3{
    color: #353535;
    font-weight: 600;
    font-size: 24px;
}
/* project main section 2 end */
/* project end */
/* contact starts here */
/* contact section 1  */
#contact .form{
    margin: 80px 0;
    /* border: 2px solid black; */
}
#contact .form .container .row{
    justify-content: space-between;
}
#contact .form .container .row .left-section{
    /* border: 2px solid black; */
    width: 35%;
    display: flex;
    flex-direction: column;
}
#contact .form .container .row .left-section .card{
    display: flex;
}
#contact .form .container .row .left-section .card .icon{
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #FFEBDC;
    text-align: center;
    margin-right: 21px;
    margin-bottom: 38px;
}
#contact .form .container .row .left-section .card .icon i{
    font-size: 28px;
    color: #F16500;
    line-height: 70px;
}
#contact .form .container .row .left-section .card:nth-child(2) .icon i{
    color: #55852F;
}
#contact .form .container .row .left-section .card:nth-child(3) .icon i{
    color: #234BDA;
}
#contact .form .container .row .left-section .card:nth-child(2) .icon{
    background-color: #F0FFE4;
}
#contact .form .container .row .left-section .card:nth-child(3) .icon{
    background-color: #EEF2FF;
}
#contact .form .container .row .left-section .card .heading h3{
    font-size: 24px;
    color: #353535;
    font-weight: 500;
    text-transform: capitalize;
}
#contact .form .container .row .left-section .card .heading h4,
#contact .form .container .row .left-section .card .heading h4 a{
    font-size: 17px;
    color: #7A7A7A;
    font-weight: 400;
    text-transform: capitalize;
}
#contact .form .container .row .right-section{
    width: 60%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    /* border: 2px solid black; */
}
#contact .form .container .row .right-section .name-email,
#contact .form .container .row .right-section .phone-subject{
    display: flex;
    flex-direction: row;
    gap: 15px;
    flex-wrap: wrap;
    /* border: 2px solid black; */
}
#contact .form .container .row .right-section .name-email input,
#contact .form .container .row .right-section .phone-subject input{
    width: 310px;
    height: 64px;
    border: none;
    outline: none;
    border: 1px solid #7A7A7A;
    border-radius: 12px;
    font-size: 17px;
    color: #7A7A7A;
    text-transform: capitalize;
    padding-left: 30px;
    margin-bottom: 15px;
}
#contact .form .container .row .right-section .textarea{
    max-width: 636px;
    max-height: 246px;
    border: 1px solid #7A7A7A;
    border-radius: 12px;
    font-size: 17px;
    color: #7A7A7A;
    padding: 15px 0 0 15px;
    font-family: "Poppins", sans-serif;
    text-transform: capitalize;
}
#contact .form .container .row .right-section .button{
    margin-top: 15px;
    width: 180px;
    height: 54px;
    background-color: #FFCC00;
    border-radius: 12px;
    text-align: center;
    line-height: 54px;
}
#contact .form .container .row .right-section .button a{
    color: white;
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 500;
}
/* contact section 1 end */
/* contact ends here */
/* blog starts here */
/* blog section 1 */
#blog{
    margin: 80px;
}
#blog .section-1 .container .row .title .image{
    position: absolute;
    z-index: 0;
    top: 20px;
    right: 59%;
}
/* blog section 1 end */
/* blog section 2 */
#blog .section-2{
    margin: 80px 0;
    /* border: 2px solid black; */
}
#blog .section-2 .container .row{
    justify-content: space-between;
}
#blog .section-2 .container .row .left-content,
#blog .section-2 .container .row .right-content{
    width: 49%;
    /* border: 2px solid black; */
}
#blog .section-2 .container .row .left-content img{
    width: 100%;
}
#blog .section-2 .container .row .right-content h2{
    font-size: 30px;
    font-weight: 600;
    color: #353535;
    margin-bottom: 15px;
    line-height: 164%;
}
#blog .section-2 .container .row .right-content h3{
    font-size: 18px;
    color: #7A7A7A;
    font-weight: 400;
    margin-bottom: 15px;
    line-height: 200%;
}
#blog .section-2 .container .row .right-content p,
#blog .section-3 .container .row .blog-card .card .heading p{
    line-height: 190%;
}
/* blog section 2 end */
/* blog section 3 */
#blog .section-3{
    margin: 80px 0;
}
#blog .section-3 .container .row .blog-card{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
#blog .section-3 .container .row .blog-card .card{
    margin-bottom: 40px;
    width: 30%;
}
#blog .section-3 .container .row .blog-card .card .image{
    width: 350px;
    height: 328px;
    border-radius: 20px;
    margin-bottom: 35px;
}
#blog .section-3 .container .row .blog-card .card .image img{
    width: 100%;
    border-radius: 20px;
}
#blog .section-3 .container .row .blog-card .card .heading h3{
    font-size: 20px;
    color: #353535;
    font-weight: 600;
    line-height: 190%;
}
#blog .section-3 .container .row .blog-card .card .heading h2{
    font-size: 16px;
    color: #7A7A7A;
    font-weight: 400;
    line-height: 200%;
}
/* blog section 3 end */
/* blog ends here */