.container {
  display: flex;
  width: 1fr;
  min-height: 100px;
  overflow: hidden;
  margin: 120px;
  /*border:1px solid grey;*/
  flex-direction: column;
  justify-content: space-between;
  align-items: left;
}

.item {
  height: 500px;
  width: 36vw;
  flex-shrink: 0;
  /*border: 10px solid black;*/
}

.itemseven {
  align-self: flex-end;
  margin-bottom: 350px;
  /*margin-right: 0;*/
}

.items {
    margin-top: -150px;
}

.container .item:nth-child(1) {
  margin-top: 30px;
}

#footer {
  width: 70%;
  margin: 0 auto 0 auto;
  height: 80px;
  border-top: 1px solid black;
  /*background: #ddd;*/
  text-align: center;
  font-size: 1.2em;
  padding: 30px;
  font-family: avenir, sans-serif;
  line-height: .7em;
}

/* Nested Div CSS Background image responsive image rules below */
#title_section {
  display: inline-block;
  position: relative;
  width: 100%;
  left: 0%;
  margin-top: 0px;
}

#title_inner {
  padding-top: 110%;
}

.title_picdiv {
  background-image: url("images/chriseichlerux5.jpg");
  /*box-shadow: 10px 10px 5px #999;*/
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  padding: 0px 0 0px 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.title_picdiv:hover {
  opacity: .9;
}

#hash_section {
  display: inline-block;
  position: relative;
  width: 100%;
  left: 0%;
  margin-top: 0px;
}

#hash_inner {
  padding-top: 170%;
}

.hash_picdiv {
  background-image: url("images/HashHomepage4.jpg");
  /*box-shadow: 10px 10px 5px #999;*/
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  padding: 0px 0 0px 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.hash_picdiv:hover {
  opacity: .95;
}

#info_section {
  display: inline-block;
  position: relative;
  width: 100%;
  left: 0%;
  margin-top: 0px;
}

#info_inner {
  padding-top: 170%;
}

.info_picdiv {
  background-image: url("images/infoshop_cover_2.jpg");
  /*box-shadow: 10px 10px 5px #999;*/
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  padding: 0px 0 0px 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.info_picdiv:hover {
  opacity: .9;
}

#blick_section {
  display: inline-block;
  position: relative;
  width: 100%;
  left: 0%;
  margin-top: 0px;
}

#blick_inner {
  padding-top: 180%;
}

.blick_picdiv {
  background-image: url("images/blick_iphone_cover.jpg");
  /*box-shadow: 10px 10px 5px #999;*/
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  padding: 0px 0 0px 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.blick_picdiv:hover {
  opacity: .9;
}

/************** AT MEDIA RULES ************/

@media
screen and (-webkit-min-device-pixel-ratio: 1.5),
screen and (-moz-min-device-pixel-ratio: 1.5),
screen and (min-device-pixel-ratio: 1.5) {
/*  #myimage {
    background-image: url(hi-res.jpg);
  }*/
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
    /* Retina-specific stuff here */
  .info_picdiv {
    background-image: url("images/infoshop_cover_b.jpg");
  }
  .hash_picdiv {
    background-image: url("images/HashHomepage4_b.jpg");
  }
}

/* Large desktop */
@media (min-width: 1441px) {
 body { font-size:100%;
 line-height: 100%;}

  .item {
    height: 700px;
  }
}

@media (min-width: 1000px) {
 body { font-size:100%;
 line-height: 100%;}

  .item {
    width: 36vw;
    margin-top: -150px;
  }

  .item1 {
    margin-top: 0px;
  }

  .itemseven {
    align-self: flex-end;
  }

  .container {
    margin: 100px;
  }
}

@media (max-width: 1189px) {
 body { font-size:100%;
 line-height: 100%;}

  .item {
    height: 350px;
  }
}

/*
@media (max-width: 979px) {
 body { font-size:100%;
 line-height: 100%;}

  .item {
    width: 36vw;
    margin-top: -150px;
    height: 280px;
  }

  .item1 {
    margin-top: 0px;
  }

  .itemseven {
    align-self: flex-end;
  }

  .container {
    margin: 100px;
  }
}
*/
@media (max-width: 999px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  width: 75vw;
  margin-top: 40px;
  height: 850px;
 }

   #hash_cover {
  height: 910px;
 }

 #info_cover {
  height: 970px;
 }

 .itemseven {
  align-self: left;
 }

 .container {
  margin: 20px;
  margin-bottom: 50px;
  align-items: center;
 }

.itemseven, .itemsodd {
  align-self: center;
}

#footer p {
  font-size: 1.8em;
  line-height: 1.2em;
}

}

@media (max-width: 899px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  height: 750px;
 }

#hash_cover {
  height: 770px;
 }

 #info_cover {
  height: 850px;
 }
}

@media (max-width: 769px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  height: 600px;
 }

   #hash_cover {
  height: 610px;
 }

  #info_cover {
  height: 720px;
 }
}

@media (max-width: 629px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  height: 500px;
 }

   #hash_cover {
  height: 430px;
 }

   #info_cover {
  height: 600px;
 }
}

@media (max-width: 539px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  height: 400px;
 }

 #hash_cover {
  height: 310px;
 }

 #info_cover {
  height: 500px;
 }
}

@media (max-width: 419px) {
 body { font-size: 110%;
 line-height: 110%;}

 .item {
  height: 310px;
 }

  #hash_cover {
  height: 170px;
 }

 #info_cover {
  height: 400px;
 }
}
