/* The container track */

.box{
   
    width:440px;
    height:250px;
    margin-top:100px;
    margin-left: 600px;
    padding: 20px;
    background-color: white;
    border-radius: 10px;
    box-shadow: 2px 2px 4px yellowgreen, -2px -2px 4px rgb(95, 95, 1);
}
.track-input{
    height:60px;
    width: 100%;
    border-radius:10px;
    font-size: 20px;
    color: grey;
    padding-left: 20px;
    margin-top: 20px;
}
.track-button{
    background-color: black;
    color: white;
    height:50px;
    width:130px;
    border-radius: 20px;
    box-shadow: 2px 2px 4px yellowgreen;
    font-size: 18px;
}
body{
    background-image: url("../bbb.jpeg");
   background-size: cover;
  }
  .popupwindow{
    position:absolute;
    left:600px;
    top:100px;
    opacity: 0;
    padding:20px;
    background-color:white;
    height:400px;
    width:700px;
    border-radius: 10px;
    transform: scale(0);
    z-index: 1000;
    box-shadow: 2px 2px 4px rgb(114, 3, 3), -2px -2px 4px rgb(5, 250, 136);
    transition: transform 0.8s;
   
  }
  .output1{
    position:absolute;
    left:500px;
    top:600px;
  }
 
   @media screen and (max-width: 768px) {
    .box{
        margin-left: 0px; 
    }
    .popupwindow{
        left: 4px;
        top:90px;
        width:400px;
        height:450px;

    }
     .menubar{
    background-color: rgb(82, 63, 63);
  }
   .menu{
    display: none;
 }
     
    
  }