/**
 * Media query to adjust size of content for small screens
 */
 @media screen and (min-width: 300px) and (max-width: 600px){
    body {font-size: 0.9em;}
    .car_div_slider {
        height: 320px !important;
     } 
    .car_div {
       height: 300px !important;
     }
     .car_img{
       height: 280px !important;
     }
     .Lifestyles_img{
       height: 200px !important;
     }
     #bgdiv, #imgdiv {
       height:300px;
     }
     #imgdiv img {
       left:25%;
       height:250px;
       width: 200px;
     }
     .prd_img{
       width: 100px !important;
       height: 75px !important;
     }
      /* parallax starts*/
      .paralax-about {
        overflow: hidden;
        height: 700px;
        position: relative;
        width: 95%;
        left:40px;
      }       
      .aboutimg{
            top:10px; left:40px; width:95%; height:55%;
      }
        .paralax-image-r {
            overflow: hidden;
            height: 350px;
            position: relative;
        }

        .paralax-image-r img {
            position: absolute;
        }
        .rm{
            left:55px; width:30%; height:80%;
            max-height:200px; max-width:200px;
            min-width:100px; min-height:100px;
        }
        .r1{
           width:20%; height:40%;
            max-height:200px; max-width:200px;
            min-width:100px; min-height:100px;
        }
        .r2{
            top:130px; width:20%; height:40%;
            max-height:200px; max-width:200px;
            min-width:100px; min-height:100px;
        }
        .c1{
        left:240px;
        }
        .c2{
        left:370px;
        }
        /* parallax end */
   }
 @media screen and (min-width: 600px) and (max-width: 900px){
     .car_div_slider {
       height: 420px !important;
     } 
     .car_div  {
       height: 400px !important;
     }
     .car_img{
       height: 380px !important;
     }
     .Lifestyles_img{
       height: 250px !important;
     }
     #bgdiv, #imgdiv{
       height:450px;
     }
     #imgdiv img {
       left:30%;
       height:400px;
       width: 300px;
     }
     .prd_img{
       width: 150px !important;
       height: 100px !important;
     }
    /* parallax starts*/
      .paralax-about {
        overflow: hidden;
        height: 600px;
        position: relative;
        width: 95%;
        left:40px;
      }       
      .aboutimg{
            top:10px; left:40px; width:95%; height:55%;
      }
      .paralax-image-r {
          overflow: hidden;
          height: 350px;
          position: relative;
      }

      .paralax-image-r img {
          position: absolute;
      }
      .rm{
          left:55px; width:30%; height:80%;
          max-height:300px; max-width:300px;
          min-width:200px; min-height:200px;
      }
      .r1{
        width:20%; height:40%;
          max-height:300px; max-width:300px;
          min-width:150px; min-height:150px;
      }
      .r2{
          top:130px; width:20%; height:40%;
          max-height:300px; max-width:300px;
          min-width:150px; min-height:150px;
      }
      .c1{
      left:350px;
      }
      .c2{
      left:550px;
      }
    /* parallax end */
   }
 @media screen and (min-width: 900px) {
     .car_div_slider {
       height: 520px !important;
     } 
     .car_div  {
       height: 500px !important;
     }
     .car_img{
       height: 480px !important;
     }
     .Lifestyles_img{
       height: 250px !important;
     }
     #bgdiv, #imgdiv{
       height:650px;
     }
     #imgdiv img {
       left:35%;
       height:550px;
       width: 400px;
     }
     .prd_img{
       width: 200px !important;
       height: 150px !important;
     }
     /* parallax starts*/
        .paralax-about {
          overflow: hidden;
          height: 570px;
          position: relative;
          width: 95%;
          left:40px;
        }       
        .aboutimg{
              top:10px; left:40px; width:95%; height:55%;
        }
        .paralax-image-r {
            overflow: hidden;
            height: 350px;
            position: relative;
        }
        .paralax-image-r img {
            position: absolute;
        }
        
        .rm{
        top:10px; left:35px; width:20%; height:55%;
        }
        .r1{
        top:10px; width:15%; height:40%;
        }
        .r2{
        top:130px; width:15%; height:40%;
        }
        .c1{
        left:300px;
        }
        .c2{
        left:600px;
        }
  /* parallax end */
   }
 @media all and (display-mode: standalone) {
   body {
     background-color: #e6e6ff;
   }
 }