.services-heading{
    text-align: center;
    padding-top: 300px 50px;
}
.services-container
{
    width:100%;
    display:grid;
    grid-template-columns: 1fr;
    margin-top:300px;
    margin-bottom: -200px;
}

.grey-bg
{
    background-color:#d7e6e0;
   
    min-height: 30vh;
}

.services-container>div{
    display:grid;
    grid-template-columns: 1fr 1fr;
    justify-content: center;
    align-items: center;
    /* padding:100px; */
}

.services-container>div>img{
    width: 80%;
    margin: auto;
    height: 40vh;
    padding:100px;
  
}

.services-container>div>section{
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.services-container>div>section>p{
    padding:0 5vw;
  }
  
.services-container>div>section>h1{
  text-align: center;
  
}

.services-container>div>section>a{
    text-align: center;
    margin-top: 50px;
    display: inline-block;
    
}

/* business-website-service */
.introduction
{
    grid-gap:100px;
}

.introduction img{
    width:65%;
    margin: auto;
   height: 35vh;
   
}

.introduction section{
    width:80%;
    margin:auto;
}

/* logo designing and branding */

.heading h1
{
    margin:300px 100px;
    text-align:center;
}

/* about */
#webgo-logo
{
    width: 60%;
    margin: auto;
    height: 40vh;
}

#webgo-picture
{
    object-fit: contain;
    height: 40vh;
    width:100%;
   
}
/* small business website */
#small-business-image
{
    width:100%;
   
}
@media(max-width:1000px)
{
   
    .services-heading
    {
        padding-top:70px;
    }

    .services-container
    {
        margin-top: 150px;
        
    }

    .services-container>div{
        grid-template-columns: 1fr;
        grid-gap:50px;
        padding:50px;
    }

    .services-container>div:nth-child(even) img
    {
        grid-row: 1/2;
    }

    .container-width
    {
        width: 90%;
    }
}


@media(max-width:1000px)
{
    .heading h1
    {
        margin:150px 100px;
    }
}
@media(max-width:768px)
{

    .services-container>div>img{
        width: 100%;
        margin: auto;
        height: 25vh;
        padding: 0;
    }
    .introduction img{
        width:90%;
        margin: auto;
       height: 35vh;
    }
    .services-container>div>section>p{
        padding:0 0;
      }

      .introduction
      {
          grid-gap:80px;
      }
 
}

@media(max-width:400px)
{

    .services-container>div>img,.introduction img{
        width: 100%;
        margin: auto;
        height: 20vh;
    }
}