body, html {
    height: 100%;
  }

.bg { 
    background-image: url(../images/BumpedUpSMBanner-01.png);
    height: 100%;
    max-width:100% !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  @media(min-width:468px){
    .container-1{
      display:flex;
      /*
      align-items:flex-start;
      align-items:flex-end;
      align-items:center;
      
      flex-direction:column;
      */
    }
    
    .container-2{
      display:flex;  
      /*
      justify-content:flex-start;
      justify-content:flex-end;
      justify-content:center;
      justify-content:space-around;
      */
      justify-content:space-between;
    }
  }
  
  .container-3{
    display:flex;  
    flex-wrap:wrap;
    justify-content:space-between;
  }
  
  .container-1 div, .container-2 div, .container-3 div{
    padding:10px;
  }
  
  .box-1{
    flex:2;
    order:2;
  }

  .box-3{
    padding: 2% !important;
    color: #000000;
  }


  #mydiv {
    flex: 1;
    width: auto;
    height: auto;
    position: absolute;
    margin-left: auto;
    background-color: #f1f1f1;
    border: 1px solid #d3d3d3;
    text-align: center;
}

#mydivheader {
  padding: 10px;
  height: auto;
  cursor: move;
  background-color: #142e66;
  color: #fff;
}


  @media (min-width: 360px) and (max-width: 640px) {

    .bg { 
          margin-top:30%;
          background-image: url(../images/BumpedUpSMBanner-01.png);
          height: 44%;
        }
  }

  @media (min-width: 320px) and (max-width: 568px) {

    .bg { 
          margin-top:30%;
          background-image: url(../images/BumpedUpSMBanner-01.png);
          height: 44%;
        }
  }

  @media (min-width: 1024px) and (max-width: 1366px) {

    .bg { 
          margin-top:20%;
          background-image: url(../images/BumpedUpSMBanner-01.png);
          height: 44%;
        }
  }

  @media (min-width: 1024px) and (max-width: 768px) {

    .bg { 
          background-image: url(../images/BumpedUpSMBanner-01.png);
          height: 44%;
        }
  }

  @media (min-width: 768px) and (max-width: 1024px) {

    .bg { 
          margin-top:20%;
          background-image: url(../images/BumpedUpSMBanner-01.png);
          height: 44%;
        }
  }


  @media (min-width: 375px) and (max-width: 667px) {

	.bg { 
        margin-top:30%;
        background-image: url(../images/BumpedUpSMBanner-01.png);
        height: 44%;
      }
}



@media (min-width: 651px) and (max-width: 1090px) {

	.bg { 
        background-image: url(../images/BumpedUpSMBanner-01.png);
        height: 60%;
      }
}
@media (min-width: 1091px) and (max-width: 1600px) {

	.bg { 
        background-image: url(../images/BumpedUpSMBanner-01.png);
        height: 50%;
      }
}

@media (min-width : 375px) and (max-width : 812)  {
    .bg { 
        background-image: url(../images/BumpedUpSMBanner-01.png);
        height: 10%;
      }

      .box-3{
        padding: 2% !important;
        color: #000000;
      }

}


.jumbotron.logo{
    z-index: 147 !important;
    height: 120px !important;
    background-color:#d8d8d8;
}

.jumbotron .img-responsive{
    width: 100%;
    
}

.img-responsive{
    margin-top: -3.3%;
    z-index: 147 !important;
    height: 100px !important;
}

h1{
  font-size: 35px;
}