#grid-image-1 {
    background-image: url(../images/work/gateway/1.png);
  }
  
  #grid-image-2 {
    background-image: url(../images/work/gateway/2.png);
  }
  
  #grid-image-3 {
    background-image: url(../images/work/gateway/3.png);
  }
  
  #grid-image-4 {
    background-image: url(../images/work/gateway/4.png);
  }
  
  #grid-image-5 {
    background-image: url(../images/work/gateway/5.png);
  }
  
  #grid-image-6 {
    background-image: url(../images/work/gateway/6.png);
  }
  
  #grid-image-7 {
    background-image: url(../images/work/gateway/7.png);
  }
  
  #grid-image-8 {
    background-image: url(../images/work/gateway/8.png);
  }
  
  #grid-image-9 {
    background-image: url(../images/work/gateway/9.png);
  }
  
  #grid-image-10 {
    background-image: url(../images/work/gateway/10.png);
  }
  
  #grid-image-11 {
    background-image: url(../images/work/gateway/11.png);
  }
  
  #grid-image-12 {
    background-image: url(../images/work/gateway/12.png);
  }
  
  #grid-image-13 {
    background-image: url(../images/work/gateway/13.png);
  }
  
  #grid-image-14 {
    background-image: url(../images/work/gateway/14.png);
  }
  
  #grid-image-15 {
    background-image: url(../images/work/gateway/15.png);
  }
  
  #grid-image-16 {
    background-image: url(../images/work/gateway/16.png);
  }
  
  #grid-image-17 {
    background-image: url(../images/work/gateway/17.png);
  }
  
  #grid-image-18 {
    background-image: url(../images/work/gateway/18.png);
  }
  
  #grid-image-19 {
    background-image: url(../images/work/gateway/19.png);
  }
  
  #grid-image-20 {
    background-image: url(../images/work/gateway/20.png);
  }
  
  #grid-image-21 {
    background-image: url(../images/work/gateway/21.png);
  }
  
  #grid-image-22 {
    background-image: url(../images/work/gateway/22.png);
  }
  
  @media only screen and (max-width: 1000px){
    #grid-image-1,
    #grid-image-2 {
      grid-column: span 3 / auto;
    }
  
    #grid-image-3,
    #grid-image-4,
    #grid-image-5 {
      grid-row: span 1 / auto;
      grid-column: span 2 / auto;
    }
  
    #grid-image-6,
    #grid-image-8,
    #grid-image-7 {
        grid-column: span 3 / auto;
    }

    #grid-image-9 {
        grid-column: span 6 / auto;
        grid-row: span 2 / auto;
    }

    #grid-image-6,
    #grid-image-8,
    #grid-image-9,
    #grid-image-10,
    #grid-image-11,
    #grid-image-12,
    #grid-image-13 {
      grid-row: span 1 / auto;
    }
  
    #grid-image-7 {
      grid-row: span 2 / auto;
    }

    #grid-image-16,
    #grid-image-17 {
        grid-column: span 3 / auto;
    } 

    #grid-image-20,
    #grid-image-21,
    #grid-image-22 {
      grid-row: span 1 / auto;
    }
  }
  
  @media only screen and (max-width: 650px){
    #grid-image-1,
    #grid-image-2 {
      grid-column: span 6 / auto;
    }

    #grid-image-3,
    #grid-image-4 {
      grid-column: span 3 / auto;
    }

    #grid-image-5 {
      grid-column: span 4 / auto;
    }

    #grid-image-10,
    #grid-image-11 {
      grid-row: span 2 / auto;
    }

    #grid-image-16,
    #grid-image-17 {
      grid-column: span 6 / auto;
    }

    #grid-image-18,
    #grid-image-19 {
      grid-row: span 1 / auto;
    }
  }