Fixed the error with grid align. Small fixes.

src/components/CardContainer.js

@@ -9,7 +9,7 @@ const CardContainer = ({searchTerm, facilities}) => {
         return name.includes(searchTerm.toLowerCase())
     }
     return (
-        <Grid container className={'card-container-root'} spacing={24} justify={'center'} align={'flex-end'}>
+        <Grid container className={'card-container-root'} spacing={24} justify={'center'} alignItems={'flex-end'}>
             {facilities.filter(filterCards).map(item =>{
                 return(
                     <Grid key={item.slug} item>

src/containers/FacilityCard.js

@@ -53,7 +53,8 @@ class FacilityCard extends React.Component {
     }
 
     handleCardClick = () => {
-        this.props.setSelectedFacility(this.props.facility);
+        const isSelected = this.props.selectedFacility.slug === this.props.facility.slug;
+        this.props.setSelectedFacility(isSelected ? null : this.props.facility);
     };
 
     toggleMap = () => {
@@ -158,7 +159,7 @@ class FacilityCard extends React.Component {
                             addFavoriteFacility={addFavoriteFacility} isHovered={this.state.isHovered} removeFavoriteFacility={removeFavoriteFacility}/>
 
             <CardContent className={'fc-card-content'}>
-                <Grid container align={'center'} direction={'column'} className={'fc-small-grid-container-spacing'}>
+                <Grid container alignItems={'center'} direction={'column'} className={'fc-small-grid-container-spacing'}>
                     <Grid item className={classnames('fc-small-grid-item-spacing', 'fc-ellipsis-container')}>
                         <Typography type={'subheading'} align={'center'} className={classnames('fc-title', 'fc-one-line-ellipsis')}>
                             {removeBrackets(facility.facility_name)}

src/styles/containers/layout.scss

@@ -9,7 +9,7 @@
   height: 100%;
   display: flex;
   overflow-x: hidden;
-  overflow-y:scroll;
+  overflow-y: auto;
   -webkit-overflow-scrolling: touch;
 }