* {
  box-sizing: border-box;
}
.headers {
  background-color:#77A679;
  color:#FFFFFF;
}
.storiesheaders {
  font-size:150%;
  background-color:#6C9FBE;
  color:#FFFFFF;
}
.main {
  float:left;
  width:66%;
  padding:0 20px;
}
.main-left {
  background-color:#F5EED1;
  float:left;
  width:49%;
  padding:15px;
  margin-top:7px;
  margin-right:2px;
}
.main-right {
  background-color:#F5EED1;
  float:left;
  width:49%;
  padding:15px;
  margin-top:7px;
  margin-left:2px;
}
.right {
  background-color:#BCD8E1;
  float:left;
  width:33%;
  padding:5px;
  margin-top:2px;
  text-align:center;
}
.history {
  background-color:#BCD8E1;
  float:left;
  width:98%;
  padding:5px;
  margin-top:2px;
  text-align:center;
}
.bottom-left {
  background-color:#636465;
  font-size:18px;
  float:left;
  width:33%;
  margin-top:1px;
  margin-left:3px;
  margin-right:1px;
  margin-bottom:1px;
  padding-top:4px;
  padding-bottom:6px;  
  text-align:center;  
}
.bottom-center {
  background-color:#636465;
  font-size:18px;
  float:left;
  width:33%;
  margin-top:1px;
  margin-left:1px;
  margin-right:1px;
  margin-bottom:1px;
  padding-top:4px;
  padding-bottom:6px;    
  text-align:center;
}
.bottom-right {
  background-color:#636465;
  font-size:18px;
  float:left;
  width:33%;
  margin-top:1px;
  margin-left:1px;
  margin-right:1px;
  margin-bottom:1px;
  padding-top:4px;
  padding-bottom:6px;  
  text-align:center;
}
@media only screen and (max-width:640px) {
  /* For mobile phones: */
    .main, .main-left, .main-right, .right, .bottom-left, .bottom-center, .bottom-right {
    width:100%;
    }
}
@media only screen and (min-width: 641px) and (max-width: 900px) {
  /* For mobile phones and tables : */
	.main, .right { width:100%; }
	.bottom-left, .bottom-center { width:46%; }
	.bottom-right { width:100%; }
}