*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
/*--------portfolio banner start--------------*/

.portfolio-bg{
    height:700px;
    width: 100%;
    background-image:url(/images/portfolio-banner-final.jpg) ;
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size:cover;
    text-align: center;
}
.portfolio-bg img{
    height: 150px;
    width: 650px;
    margin-top: 80px;
}

/* Mobile devices (up to 767px) */
@media (max-width: 767px) {
  .portfolio-bg{
        height:200px;
    }
    .portfolio-bg img{
        height: 50px;
        width: 200px;
        margin-top: 10px;
    }
}

/* Tablets (768px to 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
   .portfolio-bg{
        height:327px;
        background-size: contain;
    }
    .portfolio-bg img{
        height: 90px;
        width: 400px;
        margin-top: 50px;
    }
}

/* Small Laptops / Desktop (1025px to 1366px) */
@media (min-width: 1025px) and (max-width: 1366px) {
    .portfolio-bg{
        height:500px;
    }
    .portfolio-bg img{
        height: 130px;
        width: 550px;
        margin-top: 50px;
    }
}
/*----------portfolio banner close------------*/

/*---------portfolio start------------*/

.main-port{
    /* border: 1px solid yellow; */
    padding: 0 0 50px 0;
}
.main-port .head-port{
    /* border: 1px solid red; */
    padding: 50px 0 50px 0;
    text-align: center;
    color: white;
}
.main-port .head-port h1{
    color: white;
    font-family: Savate,sans-serif;
    font-weight: 600;
    letter-spacing: 2px;
}
.main-port .inner-port{
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    padding: 0 150px 0 150px;
}
.main-port .inner-port .port1{
    height: 435px;
    width: 47%;
    border: 2px dotted orange;
    box-shadow: 0 0 15px #F09E1F;
}

.main-port .inner-port .port1 .port{
    height:350px;
    width: 100%;
    background: rgb(0, 0, 0);
}
.main-port .inner-port .port1 .port img{
    height: 100%;
    width: 100%;
    /* object-fit: contain; */
}
.main-port .inner-port .port1 .port-h{
    height: 80px;
    width: 100%;
    /* background: coral; */
    text-align: center;
    line-height: 80px;
}
.main-port .inner-port .port1 .port-h h2{
    font-family:sora, sans-serif;
    font-size: 20px;
    color: white;
    font-weight:400;
    letter-spacing: 2px;
}

/* Mobile devices (up to 767px) */
@media (max-width: 767px) {
    .main-port .inner-port{
        gap: 30px;
        padding: 0 0px 0 0px;
    }
   .main-port .inner-port .port1{
        height:280px;
        width: 100%;
    }
      .main-port .inner-port .port1 .port{
        height:230px;
        width: 100%;
    }
    .main-port .inner-port .port1 .port-h{
        height: 50px;
        width: 100%;
        line-height: 50px;
    }
}

/* Tablets (768px to 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
   .main-port .inner-port{
        gap: 30px;
        padding: 0 0px 0 0px;
    }
    .main-port .inner-port .port1{
        height:320px;
        width: 48%;
    }
    .main-port .inner-port .port1 .port{
        height:250px;
        width: 100%;
    }
    .main-port .inner-port .port1 .port-h{
        height: 70px;
        width: 100%;
        line-height: 70px;
    }
}

/* Small Laptops / Desktop (1025px to 1366px) */
@media (min-width: 1025px) and (max-width: 1366px) {
    .main-port .inner-port{
        padding: 0 30px 0 50px;
    }
}
/*---------portfolio close-----------*/