title: How to make a mobile responsive column
body: <p>I have a schedule on my website which consists of two columns. I want it to be 2 columns in desktop devices and 1 column in mobile devices.</p>
  
  <pre><code>.text_demoBlock {
      padding-bottom:20px; 
      width:65%;
      text-align:justify;
      column-count: 2; 
      -moz-column-count: 2; 
      -webkit-column-count: 2; 
      column-gap: 40px; 
      -moz-column-gap: 40px;
      -webkit-column-gap: 40px;
      column-rule: 1px solid #000; 
      -moz-column-rule: 1px solid #000;
      -webkit-column-rule: 1px solid #000;
      }
  
    &lt;div class="text_demoBlock"&gt;
      &lt;p&gt;&lt;b&gt;Time&lt;/b&gt;&lt;/p&gt;
      &lt;p&gt;&lt;b&gt;08:55  Time&lt;/span&gt;
  &lt;br&gt;Time&lt;/b&gt;
  &lt;/p&gt;
  &lt;p&gt;09:00 Time&lt;/p&gt;
  &lt;p&gt;09:30  Time&lt;/p&gt;
  &lt;p&gt;10:00  Time&lt;/p&gt;  
  &lt;p&gt;       Time&lt;/p&gt;
  &lt;p&gt;11:00  Time&lt;/p&gt;
  &lt;p&gt;11:30  Time&lt;/p&gt;
  &lt;p&gt;12:00  Time&lt;/p&gt;
  &lt;p&gt;13:00  Lunch&lt;/p&gt;
  &lt;p&gt;14.00  Time&lt;/p&gt;
  &lt;p&gt;14.30  Time&lt;/p&gt;
  &lt;p&gt; 14.50  
  3.  «Why We Love to Hate HR…and What HR Can   Do About It?»&lt;/p&gt;
  &lt;p&gt;16:00  Time&lt;/p&gt;
  &lt;p&gt;16:30  Time&lt;/p&gt;
  &lt;p&gt;17:00  Time&lt;/p&gt;
  &lt;p&gt;17:30  Time&lt;/p&gt;
  &lt;p&gt;18:00  Time&lt;/p&gt;
  &lt;p&gt;18:10  Time&lt;/p&gt;
  &lt;p&gt;18:15  It’s party time!&lt;/p&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>How can I make it mobile responsive?</p>