@font-face {
  font-family: title;
  src: url(../font/LandRoverWeb-Bold.ttf);
}
@font-face {
  font-family: body;
  src: url(../font/LandRoverWeb-Medium.ttf);
}

div.grid-container {
  display: grid;
}
div.grid-container-1X3 {
  grid-template-columns: auto auto auto;
}
div.grid-container-1X4 {
  grid-template-columns: auto auto auto auto;
}
div.grid-container-1X5 {
  grid-template-columns: auto auto auto auto auto;
}

div.grid-item {
  border: 0.25rem solid #20201e;
  border-radius: 2rem;
  /*
  background: rgb(4, 43, 62);
  background: linear-gradient(
    90deg,
    rgba(4, 43, 62, 1) 0%,
    rgba(3, 117, 119, 1) 100%,
    rgba(0, 255, 226, 1) 100%
  );
  background: rgb(6, 145, 148);
  background: linear-gradient(
      90deg,
      rgba(6, 145, 148, 1) 67%,
      rgba(3, 34, 50, 1) 100%,
      rgba(3, 117, 119, 1) 100%,
      rgba(11, 143, 128, 1) 100%
      );
      */
  background: white;
  font-size: 30px;
  text-align: center;
  margin-right: 20px;
  margin-bottom: 20px;
  overflow: hidden;
}

p.sub2-title {
  color: white;
  opacity: 100%;
  font-size: 1.1rem;
  font-weight: 500;
  text-align: center;
  font-family: "title";
}
p.sub2-title1 {
  color: #fff;
}
p.pop-up-description {
  font-family: "body";
  text-align: justify;
  font-size: 14px;
}

p.pop-up-description-fuel {
  font-size: 14px;
  color: black;
  font-weight: 700;
  font-family: "title";
}
p.pop-up-sup-des {
  font-size: 16px;
  margin-left: 50px;
  font-weight: 700;
  font-family: "title";
}

div.grid-body {
  color: black;
  padding: 1.1rem;
  text-align: justify;
  font-size: 1.1rem;
  font-weight: 500;
  font-family: body;
}

div.grid-title {
  background-color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 66px;
}
div.grid-title1 {
  background-color: #333333;
}

div.grid-img {
  margin: 0;
  background-color: transparent;
  border-bottom-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
}

/*-----------------------------------------------------------*/
p.pop-up-title {
  font-family: title;
  color: #45454a;
  font-size: 36px;
  font-weight: 700;
  align-items: center;
  text-align: left;
}

div.pop-up-title-box {
  text-align: center;
  background-color: transparent;
  margin-bottom: 2rem;
  border-top-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
}
/*grid in indexpage*/

div.grid-container1 {
  display: grid;
  padding: 10px;
  justify-content: center;
  grid-template-columns: 300px 300px 300px;
  grid-template-rows: 300px 300px 300px;
}

div.grid-item1 {
  border: 0.3rem solid #333333;
  border-radius: 1rem;
  margin-left: 20px;
  margin-bottom: 20px;
  overflow: hidden;
}

/*---------------------------*/
div.category {
  display: flex;
}

div.category1 {
  width: 60%;
}
div.category2 {
  width: 40%;
}
img.cat {
  border-radius: 2rem;
  padding: 1rem;
}
.heading-02 {
  text-align: center;
  color: #333333;
}

a.ad-online:hover {
  text-decoration: red;
  outline: none;
  color: red;
}

/* -----------Responsive Web Design--------------*/
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width: 321px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width: 320px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px 300px;
    grid-template-rows: 300px 300px 300px;
  }
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
}
/**********
    iPad 3
    **********/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px 300px;
    grid-template-rows: 300px 300px 300px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
}
/* Desktops and laptops ----------- */
@media only screen and (min-width: 1224px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto auto;
    margin-top: -30px;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px 300px;
    grid-template-rows: 300px 300px 300px;
  }
  div.category {
    display: flex;
  }

  div.category1 {
    width: 60%;
  }
  div.category2 {
    width: 40%;
    margin-top: -110px;
  }
}

/* Large screens ----------- */
@media only screen and (min-width: 1824px) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px 300px;
    grid-template-rows: 300px 300px 300px;
  }
  div.category {
    display: flex;
  }

  div.category1 {
    width: 60%;
  }
  div.category2 {
    width: 40%;
    margin-top: -110px;
  }
}

/* iPhone 4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPhone 6, 7, 8 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPhone 6+, 7+, 8+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPhone X ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* iPhone XS Max, XR ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }

  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px 300px;
    grid-template-rows: 300px 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3) {
  /* Styles */
  div.grid-container-1X3 {
    grid-template-columns: auto;
  }
  div.grid-container-1X4 {
    grid-template-columns: auto;
  }
  div.grid-container-1X5 {
    grid-template-columns: auto;
  }
  div.grid-container1 {
    display: grid;
    padding: 10px;
    justify-content: center;
    grid-template-columns: 300px;
    grid-template-rows: 300px;
  }
  div.category {
    display: block;
    justify-content: center;
  }
  div.category1 {
    width: 100%;
  }
  div.category2 {
    width: 100%;
    align-items: center;
  }
}

div.heading-colour {
  background-color: transparent;
  border-top-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
}

div.pad {
  margin-bottom: 20px;
}

/*********/