body {
      /*background-color: #5bc0de;*/
      background-color: #f2f2f2;
      width: 100%;
      height: 100%;
      color: #1D1D25;
      font-family: Corbel, Verdana, "Bitstream Vera Sans", sans-serif;
     
    }

#header {
  background-color: #e6e6e6;
  color: #000;
  margin-top: 0px;
  padding-bottom: 50px;
  height: auto;
}

#allContent {
  height: auto;
}


#header h1 {
  padding-left: 30px;
  padding-top: 30px;
}

button {
  border-radius: 5px;
  background-color: #fff;

  


}
div.well {
  background-color: #e6e6e6;
  width: 400px;
  border: 2px solid #e6e6e6;;
  height: auto;
}

div#headContent {
  width: auto;
}

img.imgCon {
      width: 400px;
      height: 400px;
      border: 2px solid #000;
}
canvas {
      width: 400px;
      height: 400px;
      border: 2px solid #000;
      border-radius: 5px;
}
video {
      width: 400px;
      height: 400px;
      border: 2px solid #000;
}



@media (min-width: 1200px) {

  div.lgFirstRow {
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 120px;
      /*opacity: .6;*/
  }  
  div.lgSecondRow {
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 200px;
      /*opacity: .6;*/
  }
  div.lgThridRow  {
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 160px;
  }
  div.lgFourthRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 180px;
  }
}

/********** Medium devices only **********/
@media (min-width: 992px) and (max-width: 1199px) {
  
    div.mdFirstRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 120px;
  }
  div.mdSecondRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 180px;
  }
  div.mdThirdRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 200px;
  }
  div.mdFourthRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 140px;
  }
  div.mdFivthRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 180px;
  }
  div.mdSixthRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 180px;
  }
  div.mdSeventhRow{
      background-color: #e6e6e6;
      width: 400px;
      border: 2px solid #e6e6e6;
      height: 170px;
  }
 

}

/********** Small devices only **********/
@media (min-width: 768px) and (max-width: 991px) {


}

/********** Extra small devices only **********/
@media (max-width: 767px) {
  /* Header */
  

}
@media (max-width: 400px){
  #header{
    width: 375px;
  }
  
div.well {
  background-color: #e6e6e6;
  width: 375px;
  border: 2px solid #e6e6e6;;
  height: auto;
}

div#headContent {
  width: 375px;
}

img.imgCon {
      width: 375px;
      height: 400px;
      border: 2px solid #000;
}
canvas {
      width: 375px;
      height: 400px;
      border: 2px solid #000;
      border-radius: 5px;
}
video {
      width: 375px;
      height: 400px;
      border: 2px solid #000;
}


}
  
  

hr.red {
  border: 1px solid #e6e6e6;
}

#footer {
  
  /*background-color: red;*/
}







