/* ----------------- MAIN CONTENT HERE --------------*/

/* ----------------- EC start this Responsive card stretch from quac--------------*/
.grid { 
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 20px;
  align-items: stretch;
  }
.grid > article {
  border: 1px solid #ccc;
  box-shadow: 2px 2px 6px 0px  rgba(0,0,0,0.3);
}
.grid > article img {
  max-width: 100%;
}
.text {
  padding: 0 20px 20px;
}
.text > button {
  background: gray;
  border: 0;
  color: white;
  padding: 10px;
  width: 100%;
  }
/* ----------------- EC ends Responsive card stretch from quac--------------*/



/* ----------------- EC starts CSS Image Gallery w3s--------------*/

div.gallery {
  margin: 5px;
  border: 1px solid #ccc;
  float: left;
  width: 250px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
}


/* ----------------- EC end  CSS Image Gallery w3s --------------*/

/* ----------------- EC starts html/ css text color chagne for sale promo w3s--------------*/


c  {
  color: red;
  font-family: courier;
  font-size: 140%;
}


/* ----------------- EC ends html/ css text color chagne for sale promo w3s--------------*/

/* ----------------- EC starts Button Color change from w3 --------------*/
.button {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 5px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

.button2 {background-color: #008CBA;} /* Blue */
.button3 {background-color: #f44336;} /* Red */ 
.button4 {background-color: #e7e7e7; color: black;} /* Gray */ 
.button5 {background-color: #555555;} /* Black */
/* ----------------- EC ends Button Color change from w3 --------------*/