html{
  background-color:#ECEBEB;  
}
body {
  margin:5px 5% 5px 5%;
  
  background-color: #F8F8F8;
  font-family:arial;
  border:#A8A8A8 solid 1px; 
}
.navigation {
  padding:5px 5% 5px 5%;
}
a {
  text-decoration:none;
  color:#FF9900;
}
span {
  color: orange;
}

.head {
  margin-top:-2%;
  width:100%;

}
.navi {
  display: inline-block;
  height:20px;
  float: right;


}


 .navi li {
      display: inline;
      padding: 0px 10px 0px 10px;
    }

.image {
  
  background-image: url('http://i.imgur.com/NE5GEJ9.jpg');
  height: 500px;
 width: 100%;
  background-size: cover;
  display: inline-block;
  
  }
.jumbotron{
  background: rgba(0, 0, 0, 0.3);
  color: white;
  width: 400px;
  height: 100px;
  position:relative;
  left:15%;
  top:70%;
}
.jumbotron h3 {
  text-align: left;
  margin: 1%;
}
.jumbotron p {
  margin:1%;
  font-size:13px;
}
h3 {
  text-align: center;
}


.col-1-4 {
  width:25%;
}
.col-1-4 img{
  /* height:auto;
  width: 240px;*/
  height: 57%;
    width: 90%;
  border: 1px solid #9B8C75;
  padding: 4px;
  
}
 
.col-2-4 {
  width:25%;
}
.col-2-4 img{
  /* height:auto;
  width: 240px;*/
  border: 1px solid #9B8C75;
  padding: 4px;
height: 57%;
    width: 90%;
}
.col-3-4 {
  width:25%;
}
.col-3-4 img{
 /* height:161px;
  width: 240px;*/
  height: 57%;
    width: 90%;
  border: 1px solid #9B8C75;
  padding: 4px;

}
.col-4-4 {
  width:25%;
}
.col-4-4 img{
 /*height:161px;
  width: 240px;*/
  height: 57%;
    width: 90%;
  border: 1px solid #9B8C75;
  padding: 4px; 
}


  
.thick {
  padding-top:10px;
  clear:both;
}
.thick hr{
  height:7px;
  background-color: #D9D7D7;
  border: none;
 
}

[class*='col-'] {
  float: left;
}

.col-2-3 {
  width: 75%;

}
.col-2-3 .harry {
  float:left;
  height:200px;
  width:155px;
   border: 2px solid #9B8C75;
  padding: 4px;
  margin: 0 10px 10px 0px;
}
.col-2-3 .harry1 {
  margin-right:50px;
}
.boop {
  clear:both;
  margin-right:10px;
}
.col-2-3 .potter{
   float:left;
  height:200px;
  width:155px;
   border: 2px solid #9B8C75;
  padding: 4px;
  margin: 0 10px 10px 0;  
}
.col-2-3 .potter1 {
  margin-right:50px;
}
.col-1-3 {
  width: 25%;
}
.twitter{
  width:90%;
}
.email {
  color:orange;
}
.thick2 {
  padding-top:10px;
  clear:both;
}
.thick2 hr{
  height:7px;
  background-color: #D9D7D7;
  border: none;
}

.col-1-3-3 {
  width:45%;
}
.col-1-3-3 .aboutus{
  margin-right:50px;
  margin-bottom:30px;
}
.read {
  display:block;
  height:50px;
  width:100px;
  background-color: #FF9900;
  color:white;
  text-decoration:none;
  text-align:center;
  text-indent:-0.8px;
height:34px;
line-height:36px;
width:100px;
  margin-left:75%;
  margin-top:8px;

}

.col-2-3-3 {
  width:30%;
}
.col-2-3-3 li{
  line-height:200%;
}
.col-3-3-3{
  width:25%;
}

.footer {
  clear:both;
  border-top: 10px solid #383838;
  background-color:#686868;
  height:200px;



}

.col-a {
  width:20%;
  /*padding-left:8px;
  padding-right:10px;*/
}
.col-a div  {
  margin-left:8px;
  margin-right:10px;
}

.col-b {
  width:32%;
}
.col-b hr{
  width:90%;
}
.col-c {
  width:28%;
}
.col-c hr{
  width:80%;
  margin-left:0;
}
.col-dp {
  width:20%;
}
.copyright{
  height:40px;
 background-color:#383838; 
  color:white;


}
#poppy{
  padding-top:12px;
  padding-left:5px;
}
.navi{
  margin-top:-35px;
  }
}