body {
   font-family:Arial;
   margin: 0;
}

tr:hover {background: #FAFAFA;}

.noh tr:hover {background: #FFFFFF};

tr {
   border-top: 1px solid LightGray;
   border-bottom: 1px solid LightGray;
}

td {
   padding: 20px;
   vertical-align: middle;
   display: table-cell;
   vertical-align: middle;
}


table.center {
  border-collapse: collapse;
  margin-left: auto; 
  margin-right: auto;
  max-width: 760px;

}

table p {
   padding:0px;
}

@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	tr { border: 1px solid LightGray; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		position: relative;

	}
	
	td:before { 
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
}





p {
  margin-left: auto; 
  margin-right: auto;
  max-width: 760px;
padding-left:20px;
padding-right:20px;
}


h1 {
   text-align:center;
   font-weight: lighter;
   font-size: 250%;
   margin-left: auto; 
   margin-right: auto;
   max-width: 760px;

}

h2 {
   font-weight: lighter;
   font-size: 140%;
}

.preview img {
   border:1px solid Gray;
display:block; margin:0 auto;
}


img {
   border:0;
}




/* The navigation bar */
.navbar {
  overflow: hidden;
  background-color: #333;
  position: fixed; 
  top: 0; 
  width: 100%; 
  /*max-height: 42px;*/
   z-index: 1;
}

@media only screen and (max-width: 720px) {
    .navbar {
        position: absolute;
    }
}

.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 12px 16px;
  text-decoration: none;
}

.navbar a:hover {
  background: #ddd;
  color: black;
}

.navbar a.active {
  background-color: #ddd;
  color: black;
}

.soloImage {
  width: 100%;
max-width:600px;
  height: auto;
}