lapikud.github.io/_sass/contact.scss

#contact {

  h2 {
    margin-top : 1.5rem;
  }

  #helpdesk {
    display         : flex;
    justify-content : center;
    align-items     : center;

    #helpdesk-banner-container {
      background : black;
      padding    : 3rem;
    }

    #helpdesk-banner {
      display : block;
      width   : 100%;
      height  : auto;
    }
    #helpdesk-banner-container, #helpdesk-info {
      flex   : 1;
      margin : 0 2rem;
    }
  }

  #management {

    #container {
      display         : flex;
      flex-direction  : row;
      flex-wrap       : wrap;
      justify-content : center;

      .person {
        margin-left   : 2rem;
        margin-right  : 2rem;
        margin-bottom : 5rem;

        img {
          display : block;
          width   : 100%;
          height  : auto;
        }

        * {
          margin : 0.2rem 0;
        }
      }

    }
  }

  #main-wrapper {
    width           : 100%;
    display         : flex;
    flex-direction  : row;
    flex-wrap       : wrap;
    justify-content : center;
    align-items     : center;
  }

  #maparea {
    margin        : 0 2rem;
    min-width     : 44.55%;
    flex          : 1;

    #map {
      width      : 100%;
      float      : right;
      margin     : 0 auto;
      height     : 60vh;
      max-height : 300px;
    }
  }

  #main {
    margin            : 0 2rem;


    h4{
      padding-bottom  : 5px;
    }
  }

  * {
    margin            : 0.2rem 0;
  }

}
@media (max-width : 900px) {

  #contact {
    #helpdesk {
      flex-direction : column;

      #helpdesk-banner-container {
        margin : 2rem 0;
      }
      #helpdesk-info {
        margin : 0;
      }
    }
    #main-wrapper{
      #maparea{
        flex-direction: column;
        margin: 2rem;
      }
    }
  }
}