html{
    scroll-behavior: smooth;
  }
  
  * {
      box-sizing: border-box;
      font-family: 'Oswald', sans-serif;
    }
    
    body {
      font-size: 20px;
    }
    
    .container {
      position: relative;
      max-width: 1000px;
      margin: 0 auto;
    }
    
    .container img {vertical-align: middle;}
    
    .container .content {
      position: absolute;
      bottom: 0;
      background: rgb(0, 0, 0); /* Fallback color */
      background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
      color: #f1f1f1;
      width: 100%;
      padding: 5px;
    }
  
  
    a {
      text-decoration: none;  
      display: inline-block;
      padding: 4px 8px;
    }
    
    a:hover {
      background-color: #ddd;
      color: black;
    }
    
    .previous {
      background-color: black;
      color: white;
      font-size: 17px;
    }
    
    .next {
      background-color: #04AA6D;
      color: white;
    }
    
    .round {
      border-radius: 50%;
    }
  
    .para{
        color: rgb(0, 0, 0);
        text-align: center;
        padding: 10px;
        justify-content: center;
        background: lightslategray;
        color: lightyellow;
        margin: 10px;
        border-radius: 40px;
    }
  
    body {
      font-family: "Lato", sans-serif;
    }
    
    .sidenav {
      height: 100%;
      width: 0;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: #111;
      overflow-x: hidden;
      transition: 0.5s;
      padding-top: 60px;
    }
    
    .sidenav a {
      padding: 8px 8px 8px 32px;
      text-decoration: none;
      font-size: 17px;
      color: #818181;
      display: block;
      transition: 0.3s;
    }
    
    .sidenav a:hover {
      color: #f1f1f1;
    }
    
    .sidenav .closebtn {
      position: absolute;
      top: 0;
      right: 25px;
      font-size: 36px;
      margin-left: 50px;
    }
    
    #main {
      transition: margin-left .5s;
      padding: 16px;
    }
    
    @media screen and (max-height: 450px) {
      .sidenav {padding-top: 15px;}
      .sidenav a {font-size: 18px;}
    }
  
    #myBtn {
      display: none;
      position: fixed;
      bottom: 20px;
      right: 30px;
      z-index: 99;
      font-size: 18px;
      border: none;
      outline: none;
      background-color: red;
      color: white;
      cursor: pointer;
      padding: 15px;
      border-radius: 4px;
    }
    
    #myBtn:hover {
      background-color: #555;
    }
  
  .Heading h2{
    align-content: center;
    text-align: center;
    justify-content: center;
    display: inline-block;
    padding: 20px 60px;
    background-color: dimgrey;
    color: #f1f1f1;
    border-radius: 25px;
    transition: 3s;
  }
    
  @media screen and (max-width: 550px){
    img.Austin{
      width: 50%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Austin1{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Standard{
      width: 50%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Standard1{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.MG{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.MG1{
      width: 49%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Hillman{
      width: 47%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Hillman1{
      width: 50%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Rolls{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Rolls1{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Airline{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Airline1{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Saloon{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Saloon1{
      width: 45%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Sports{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Sports1{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Norton{
      width: 48%;
    }
  }
  
  @media screen and (max-width: 550px){
    img.Norton1{
      width: 40%;
    }
  }
  
  .Heading{
      animation-name: fadeIn;
      -webkit-animation-name: fadeIn;	
  
      animation-duration: 1.5s;	
      -webkit-animation-duration: 1.5s;
  
      animation-timing-function: ease-in-out;	
      -webkit-animation-timing-function: ease-in-out;		
  
      visibility: visible !important;	
  }
  
  @keyframes Heading {
      0% {
          transform: scale(0);
          opacity: 0.0;		
      }
      60% {
          transform: scale(0.9);	
      }
      80% {
          transform: scale(0.9);
          opacity: 1;	
      }	
      100% {
          transform: scale(1);
          opacity: 1;	
      }		
  }
  
  @-webkit-keyframes fadeIn {
      0% {
          -webkit-transform: scale(0);
          opacity: 0.0;		
      }
      60% {
          -webkit-transform: scale(0.9);
      }
      80% {
          -webkit-transform: scale(0.9);
          opacity: 1;	
      }	
      100% {
          -webkit-transform: scale(1);
          opacity: 1;	
      }		
  }
  
  .container{
  animation-name: pullDown;
  -webkit-animation-name: pullDown;	
  
  animation-duration: 1.1s;	
  -webkit-animation-duration: 1.1s;
  
  animation-timing-function: ease-out;	
  -webkit-animation-timing-function: ease-out;	
  
  transform-origin: 50% 0%;
  -ms-transform-origin: 50% 0%;
  -webkit-transform-origin: 50% 0%; 		
  }
  
  @keyframes pullDown {
  0% {
    transform: scaleY(0.1);
  }
  40% {
    transform: scaleY(1.02);
  }
  60% {
    transform: scaleY(0.98);
  }
  80% {
    transform: scaleY(1.01);
  }
  100% {
    transform: scaleY(0.98);
  }				
  80% {
    transform: scaleY(1.01);
  }
  100% {
    transform: scaleY(1);
  }							
  }
  
  @-webkit-keyframes pullDown {
  0% {
    -webkit-transform: scaleY(0.1);
  }
  40% {
    -webkit-transform: scaleY(1.02);
  }
  60% {
    -webkit-transform: scaleY(0.98);
  }
  80% {
    -webkit-transform: scaleY(1.01);
  }
  100% {
    -webkit-transform: scaleY(0.98);
  }				
  80% {
    -webkit-transform: scaleY(1.01);
  }
  100% {
    -webkit-transform: scaleY(1);
  }		
  }
  
  .para{
      animation-name: expandOpen;
      -webkit-animation-name: expandOpen;	
  
      animation-duration: 1.2s;	
      -webkit-animation-duration: 1.2s;
  
      animation-timing-function: ease-out;	
      -webkit-animation-timing-function: ease-out;	
  
      visibility: visible !important;	
  }
  
  @keyframes expandOpen {
      0% {
          transform: scale(1.8);		
      }
      50% {
          transform: scale(0.95);
      }	
      80% {
          transform: scale(1.05);
      }
      90% {
          transform: scale(0.98);
      }	
      100% {
          transform: scale(1);
      }			
  }
  
  @-webkit-keyframes expandOpen {
      0% {
          -webkit-transform: scale(1.8);		
      }
      50% {
          -webkit-transform: scale(0.95);
      }	
      80% {
          -webkit-transform: scale(1.05);
      }
      90% {
          -webkit-transform: scale(0.98);
      }	
      100% {
          -webkit-transform: scale(1);
      }					
  }
  