body{
margine: 0;
padding: 0;
font-family: 'Arial', 'serif';
}

.nav{
  background-color: #595959;
  color: #ffffff;
  list-style: none;
  text-align:  center;
  padding: 20px 0 20px 0;
}

.nav > li {
display: inline-block;
padding: 0 35px 0 36px ;
}

.nav > li > a {
text-decoration: none;
color: #ffffff;
}

.nav > li > a:hover {
color:#c1c1c1;

}

#header{
  background-color: #006;
  color: #FFF;
  padding: 20px;
  border: medium black solid;
}

/* #center{
width:71%;
height:64%;
float:left;
border:  medium black solid;
overflow:scroll;
} */

#end{
  background-color: #595959;
  width: 100%;
  height: 2.5%;
  padding: 10px 0 10px 0;
}

.sidebar{
background-color: #595959;
color: #ffffff;
width: 14%;
height:650px;

/* padding: 20px 0 0 20px; */
padding: .5% .5% .5% .5%;
float:left;
text-decoration: none;
display:run-in;
/* border: thin black solid; */
}

.sidebarr{
background-color: #595959;
color: #ffffff;
width: 14%;
height:650px;
padding: .5% .5% .5% .5%;
float:right;
text-decoration: none;
/* display:run-in; */
}

.Content{
background-color: yellow;
/* color: #ffffff; */
width: 69.88%;
/* height: 40%; */
padding: 1.65% 0 1.65% 0;
float: left;
border: thin black solid;
margin: auto;
}

#body{
  background-image: "/home/brucer4995/web_repo/img/1732491-bigthumbnail.jpg" no-repeat;
  /* background-color: yellow; */
  /* border: medium black solid; */
  margin: 0,0,0,0;

  }


/* .sidebar > li > a {
text-decoration: none;
color: #ffffff;
}

.sidebar > li > a:hover {
color:#c1c1c1; */

#footer{
  background-color: #006;
  color: #FFF;
  padding: 20px;
  border: medium black solid;
}

#img1{
/* border: thin black solid; */
width: 6%;
float:left;
padding: 80px 20px 20px 150px;
}
#img2{
/* border: thin black solid; */
width: 10%;
float:left;
padding: 30px 120px 20px 20px;
}
#img3{
/* border: thin black solid; */
width: 10%;
float:left;
padding: 20px 145px 20px 20px;
}
#img4{
/* border: thin black solid; */
width: 10%;
float:left;
padding: 60px 320px 20px 20px;
}
#img5{
/* border: thin black solid; */
width: 10%;
float:left;
padding: 20px 120px 20px 20px;
}

#img6{
border: thin black solid;
width: 10%;
float:left;
padding: 20px 20px 20px 20px;
}

#img7{
border: thin black solid;
width: 10%;
float:left;
padding: 20px 20px 20px 20px;
}

#description{
  border: thick black solid;
padding: 40px 40px 40px 40px;
float: center;
width: 70%;
}

#title{
background-color: yellow;
width:50%;
height:64%;
float:left;
border: medium black solid;
}

/*scale for a tablet*/
@media screen and (max-width:960px){

.nav{
width:100%;
}
.Content{
  width:69.88%;
}
#center{
width:71%;
}
.sidebar{
  width:14%;
}
.sidebarr{
width:14%;
}
#description{
  width:70%;
}

#title{
  width:50%;
}

#img1{
width: 6%;
}
#img2{
width: 10%;
}
#img3{
width: 10%;
}
#img4{
/* border: thin black solid; */
width: 10%;
}
#img5{
/* border: thin black solid; */
width: 10%;

}

#img6{
width: 10%;
}

#img7{
width: 10%;

}

#footer{
  width:100%;
}

}
/*scale for a phone*/
@media screen and (max-width:640px){
  .nav{
  width:100%;
  }

.Content{
  width:69.88%;
}
#center{
width:71%;
}
.sidebar{
  width:100%;
}
.sidebarr{
width:100%;
}
#description{
  width:70%;
}

#img1{
width: 6%;
}
#img2{
width: 10%;
}
#img3{
width: 10%;
}
#img4{
/* border: thin black solid; */
width: 10%;
}
#img5{
/* border: thin black solid; */
width: 10%;

}

#img6{
width: 10%;
}

#img7{
width: 10%;

}

#footer{
  width:100%;
}

}

/*minimum size 320 px*/
@media screen and (max-width:320px){
  .nav{
  width:100%;
  }
  #title{
    width:50%;
  }

.Content{
  width:320px;
}
#center{
width:320px;
}
.sidebar{
  width:320px;
}
.sidebarr{
width:320px;
}
#description{
  width:320px;
}

#img1{
width: 320px;
}
#img2{
width: 320px;
}
#img3{
width: 320px;
}
#img4{
/* border: thin black solid; */
width: 320px;
}
#img5{
/* border: thin black solid; */
width: 320px;

}

#img6{
width: 320px;
}

#img7{
width: 320px;

}


#footer{
  width:320px%;
}

}

/* @media (min-width:100px) and (max-width:500px) {
body{
  background-color: red;

}


} */