.header_div
{
height: 150px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-family: verdana;
font-size: 32px;
font-weight: bold;
color: blue;
background: linear-gradient(to bottom, rgba(0, 0, 128, 0.5), rgba(255, 255, 255, 0.8),rgba(128, 0, 0, 0.5));
}

.button {
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

.button1 {background-color: #04AA6D;} /* Green */
.button2 {background-color: #008CBA;} /* Blue */
.button3 {background-color: #f44336;} /* Red */ 
.button4 {background-color: #e7e7e7; color: black;} /* Gray */ 
.button5 {background-color: #555555;} /* Black */

.button6 {background-color: #04AA6D;} /* Green */
.button7 {background-color: #008CBA;} /* Blue */
.button8 {background-color: #f44336;} /* Red */ 
.button9 {background-color: #e7e7e7; color: black;} /* Gray */ 
.button10 {background-color: #555555;} /* Black */

pic_div
{
border: 1px solid black;
}


nav_div
{
border: 1px solid black;
}
/* for devices 40em max width */
@media screen and (max-width:40em)
{
width:300px;
}

/* for devices 41-60em width */
@media screen and (min-width:41em) and (max-width:60em)
{
width:600px;
}

/* for devices greater than 61em width */
@media screen and (min-width:61em)
{
width:100%;
}

article
{
-moz-column-rule: 1px solid black;
-webkit-column-rule: 1px solid black;
column-rule: 1px solid black;
}
/* for devices 40em max width */
@media screen and (max-width:40em)
{
   article
   {
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;      
  }
}

/* for devices 41-60em width */
@media screen and (min-width:41em) and (max-width:60em)
{
   article
   {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;      
  }
}

/* for devices greater than 61em width */
@media screen and (min-width:61em)
{
   article
   {
    -moz-column-count: 3;
    -webkit-column-count: 3;
    column-count: 3;      
  }
}

p
{
font-family:verdana;
font-size: 16px;
}
h1
{
font-family:verdana;
font-size: 24px;
}
