* {
			      box-sizing: border-box;
		    }

    		.flex-container {
	    		  display: flex;
		    	  flex-wrap: wrap;  
			      flex-direction: row;
    			  font-size: 30px;
	    		  text-align: center;
		    	  width: 100%;
    		}

    		.flex-item {
	    		  padding: 10px;
		    	  /*width: 235px;*/
			      width: 33%;
    			  font-size: 10pt;
		    }

    		.flex-item:hover {
	    		background: rgba(236, 236, 236, .3);
    		}

    		.flex-item a:hover {
	    		text-decoration: none;
    		}

	    	/* Responsive layout - makes a one column-layout instead of two-column layout */
    		@media screen and (max-width: 990px) {
	    	  	.flex-item {
		    	    width: 50%; 
    			}   
	    	}
		
    		@media (max-width: 600px) {
	    		.flex-container {
		    	    flex-direction: column;
    			}   

	    		.flex-item {
		    	    width: 100%; 
			    }
    		}