/* setting margins and background for body */

body
{
background-color:white;
  margin-top:10px;
  margin-bottom:10px;
  margin-right:10px;
  margin-left:10px;
}

table.headerbar
{
font-size:20px:
}



/* Setting up horozontal schroll bars */

div.scrollmenu {
  background-color:#5DADE2;
  overflow: auto;
  white-space: nowrap;
  padding:5px;
  color: white;
}

div.scrollmenu a
{
  display: inline-block;
  background-color:gray;
  border:1px solid gray;
  color: white;
  text-align: center;
  padding: 4px;
  text-decoration: none;
}

div.scrollmenu a:hover
{
  background-color:#5DADE2;
}


@media screen and (min-width: 601px) {
  div.scrollmenu {
    font-size: 16px;
  }
}
@media screen and (max-width: 600px) {
  div.scrollmenu {
    font-size: 16px;
  }
}

.imagediv
{
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

.imagediv img
{
    flex-shrink: 0;
    width: 100%;
}
{
  background-color:white;
    padding:5px;
  color: white;
}

h1
{font-size:20px;
}

h4
{
font-size:12px;
text-align:center;
color:blue;
}




/* Setting up the header/title of the page */

.headerbar
{
text-align: center;
border-collapse:collapse;
background-color:#5DADE2;
width:100%;
color:white;
}

.headerbar2
{
text-align: center;
border-collapse:collapse;
background-color:#5DADE2;
width:100%;
height:20px;
color:white;
}

.headerbar3
{
text-align: center;
border-collapse:collapse;
background-color:#5DADE2;
width:100%;

color:white;
}

/* Main Text Area */

table.maintext
{
border-collapse:collapse;
width:100%;
background-color:#AFEEEE;
}

td.marginbar
{
border-collapse:collapse;
background-color:#AFEEEE;
width=4px;
}

td.copyright
{
  text-align: right;
  padding-right:10px;
  background-color:white;
  border-top: 2px solid #85929E;
}

h3
{
text-align: center
}


td.maintext
{
background-color:white;
color:black;
padding: 10px;
}

ul.earthquakes
{
  list-style-type: circle;
  list-style-position: outside;
}



/* image settings */

#95-percent-image
{
width: 100%; 
height: auto;
}


#100-percent-image
{
width: 100%; 
height: auto;
}

#ninety-percent-image
{
width: 90%; 
height: auto;
}

#ninety-percent-image2
{
width: 90%; 
height: auto;
}

#ninety-percent-image3
{
width: 90%; 
height: auto;
}


#ninety-percent-image3
{
width: 90%; 
height: auto;
}

#eighty-percent-image1
{
width: 80%; 
height: auto;
}

#eighty-percent-image2
{
width: 80%; 
height: auto;
}

#eighty-percent-image3
{
width: 80%; 
height: auto;
}
#fifty-percent-image
{
width: 50%; 
height: auto;
}