html {
    /*position: relative;*/
    min-height: 100%;
    width: 100%;
}

body{
	background-color: #ffffff;
	color: #000;
	font-family: Arial, "Times New Roman", sans-serif;
	font-size: 1em;
  width: 100%;
  /* bottom = footer height */
  /*padding: 25px;*/
}

#van-link{
  background-color: #FFCC33;
  color: #000;
  padding: 5px;
}

#van-link:hover {
  background-color: #000;
  color: #FFCC33;
  text-decoration: none;
}

.links:link{
  text-decoration: underline;
}

.links:hover {
  background-color: #000;
  color: #FFCC33;
  text-decoration: none;
}

.container{
  margin-right: auto;
  margin-left: auto;
  /*padding-right: 2rem;
  padding-left: 2rem;*/
  width: 80%;

}

#notice-banner{
  border: 1px dotted #000;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color: #FFCC33;
  /*background: rgba(255, 204, 51, 0.7);*/
  border-style: round;
  /*background-color: #FFD700;*/ /*FFD700*/
  /*border:1px #666 dotted;*/
  padding: 10px;
  text-align: center;
  font-size: 0.8em;
  width: 10%;
  height: auto;
  /*position: -webkit-sticky;
  position: sticky;*/
  position: fixed;
  top: 50%;
  left: 88.5%;
  /*float: right;*/
  /*overflow-wrap: break-word;*/
}

#banner{
	background-color: #FFCC33;
	/*border: #000 solid 1px;
  margin-top: 10px;*/
	padding: 5px 10px 5px 10px;
  /*text-align: center;*/
  color:#000;
  font-weight:bold;
  width: 100%;
  height: auto;
  /*position: fixed;*/
}

/*#banner-title{
  float: left;
}*/

#banner-title h1{
  border-top: 5px double #000;
}

/*#banner-text{
  float: right;
}*/

/*.sticky {
  position: fixed;
  opacity: 0.95;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 102px;
}*/

.car-block{
  float:left;
  /*width:auto;*/
  margin-top: 5%;
  /*border:2px #ccc solid;
  background-color:#f0f0f0;
  *margin-right: 0.5%;*/
}

.car-block img{
  width: 280px;
  height: 200px;
}

#van-block img{
  width: 300px;
  height: 200px;
}

/*.car-block img:nth-child(1){
  width: 280px;
  height: 200px;
}

.car-block img:nth-child(2){
  width: 300px;
  height: 250px;
}

.car-block img:nth-child(3){
  width: 300px;
  height: 250px;
}

.car-block img:nth-child(4){
  width: 300px;
  height: 250px;
}*/

.text-block{
  float: left;
  /*column-count: 2;*/
  width: 40%;
  margin-top: 2%;
  margin-bottom: 15%;
  margin-right: 5%;
}

#hsd-img{
  width: 60%;
  height: auto;
}

.grey-box{
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background-color: #efefef;
  padding: 5px 10px 5px 10px;
  /*position: absolute;*/
  /*left: 0;
  bottom: 0;*/
  height: auto;
  width: 100%;
  overflow: hidden;
}

footer{
  background-color: #999;
  padding: 5px 10px 5px 10px;
  /*position: absolute;*/
  left: 0;
  bottom: 0;
  height: auto;
  width: 100%;
  overflow: hidden;
}


.number{
	font-size: 1.5em;
}

.links{
  color: black;
  text-decoration: none;
}

a:hover{
  text-decoration: underline;
}


/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
    /* For mobile phones: */

    body{
      font-size: 2.5em;
      text-align: center;
    }
    /*[class*="col-"] {
        width: 100%;
        height: auto;
    }*/
    .car-section{
      width: 100%;
      margin-top: 150%;
    }
    .car-block{
      float: left;
      height: auto;
      width: 100%;
    }
    .car-block img{
      height: auto;
      width: 100%;
    }

    #van-block img{
      height: auto;
      width: 100%;
    }

    .text-block{
      float: left;
      width: 100%;
      margin-top: 2%;
      margin-bottom: 15%;
      margin-right: 5%;
    }

    #banner-text{
      float: left;
      font-size: 0.7em;
    }

    #notice-banner{
      width: 100%;
      height: 10%;
      left: 0;
      bottom:0;
      top: 90%;
      font-size: 0.7em;
      border-top-left-radius: 0px;
      border-bottom-left-radius: 0px;
    }

    #hsd-img{
      width: 100%;
      height: auto;
    }

}