#feed a {
     color:black;
}




 #feed {
     -webkit-column-count: 3;
     -webkit-column-gap: 0.7rem;
     -webkit-column-width: 100%;
     -moz-column-count: 3;
     -moz-column-gap: 0.7rem;
     -moz-column-width: 100%;
     column-count: 3;
     column-gap: 0.7rem;
     column-width: 100%;
}


.card:nth-child(3n+1) {
    clear: left;
}

 .card {
    float: left;

     box-sizing: border-box;
     background: #fffef8;
     width: 100%;
     height:auto;
     font-size: 0.7rem;
     border: 1px solid #d2d2d2;
     margin-bottom:0.7rem;
     -webkit-transition: border 300ms ease-out;
     -moz-transition: border 300ms ease-out;
     -o-transition: border 300ms ease-out;
     transition: border 300ms ease-out;
     color: black;
}


 .card:hover {

     position: relative;
     -webkit-transition: border 300ms ease-out;
     -moz-transition: border 300ms ease-out;
     -o-transition: border 300ms ease-out;
     transition: border 300ms ease-out;
}
 .card img, .card video {
     width: 100%;
     cursor: pointer;
}
 .card a {
     border-bottom:0;
}
 .card .text {
     padding:0.4rem 0.7rem 0.8rem 0.7rem;
     color: blue;
}
.card .text a, .card .text a:link, .card .text a:visited, .card .text a:active {
     color: red;
     text-decoration: none;
     border-bottom: 0.12rem solid red;
}
 .card .text a:hover {
     color: black;
     text-decoration: none;
     border-bottom: 0.12rem solid black;
}



 @media screen and (max-width: 1200px) {

     #feed {
         -webkit-column-count: 2;
         -moz-column-count: 2;
         column-count: 2;
    }
}
 @media screen and (max-width: 800px) {

     #feed {
         -webkit-column-count: 1 !important;
         -moz-column-count: 1 !important;
         column-count: 1 !important;
    }
     .card {
         font-size: 0.85rem;
         margin-bottom: 1.5rem;
    }
}