html,body{
    position:relative;
    height:100vh
   
  }
  
  #cover-page{
      text-align:center;
      padding-top:0px;
       width:100%;
      height:100%;
      overflow:hidden;
     
  }
  #cover-page{
      /* background:#98bf21;
       position:absolute;
       top:-160px;*/
      background-color:DodgerBlue;
      background-image: url('../img/pharma/covers/coverbg1.jpg');
     /* width:100vw;
      height:100%;
       z-index: 1200; */
      
      
  }
  
  #pharmacies{
      position:absolute;
      z-index:1100;
      top:30%;
      left:45%;
     
  }
  #hospital_img{
      position:absolute;
      z-index:1100;
      top:30%;
      left:30%;
     
  }
  #sales{
      position:absolute;
      z-index:1100;
      top:36%;
      left:60%;
     
  }
  #stores{
      position:absolute;
      z-index:1100;
      top:36%;
      left:20%;
      border-radius:10px;
     
  }
  #managers{
      position:absolute;
      z-index:1100;
      top:6%;
      left:40%;
     
  }
  #cashiers{
      position:absolute;
      z-index:1100;
      top:62%;
      left:40%;
     
  }
  
  #customer,#slogan{
      color:white;
      text-transform:capitalize;
      font-weight:bold;
      z-index: 1100;
     
  }
  #customer{
      position:absolute;
      top:5%;
      left:5%;
      z-index: 1100;
  }
  #slogan{
      position:absolute;
      top:5%;
      right:5%;
      z-index: 1100;
  }
  .store-title{
      position:absolute;
      top:36%;
      left:20%;
      color:black;
      /* transform:rotate(-90deg); */
      font-weight:bold;
      z-index:1200;
      background-color:white;
      padding:5px 5px 0 5px;
      font-size:1rem;
      border-radius: 10px;
      
     
  }
  .manager-title{
      position:absolute;
      top:6%;
      left:40%;
      color:black;
      /* transform:rotate(-90deg); */
      font-weight:bold;
      
      background-color:white;
      padding:5px 5px 0 5px;
      font-size:1rem;
      border-radius: 10px;
      z-index: 1200;
     
  }
  .cashier-title{
      position:absolute;
      top:62%;
      left:40%;
  
      color:black;
      /* transform:rotate(-90deg); */
      font-weight:bold;
      
      background-color:white;
      padding:5px;
      font-size:1rem;
      border-radius: 10px;
      z-index: 1200;
     
  }
  .sales-title{
      position:absolute;
      top:36%;
      left:60%;
  
      color:black;
      /* transform:rotate(-90deg); */
      font-weight:bold;
      
      background-color:white;
      padding:5px;
      font-size:1rem;
      border-radius: 10px;
      z-index: 1200;
     
  }
  .intro{
      position:absolute;
      bottom:10%;
      left:0%;
  
      color:white;
      /* transform:rotate(-90deg); */
      font-weight:bold;
      z-index:1100;
      background-color:dodgerBlue;
      padding: 2px 5px;
      font-size:1rem;
      
      width:100%;
      text-align:center;
      box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
     
  }
  .synex{
      position:absolute;
      bottom:5%;
      right:30%;
       width:40%;
      color:white;
      font-weight:bold;
      z-index:1100;
      font-size:1rem;
      text-transform:capitalize;
      box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  }
  .synex-logo{
      position:absolute;
      bottom:1%;
      right:5%;
      z-index:1100;
      box-shadow: 0 4px 18px 2px rgba(0,0,0,0.5);
  }
  .togo-map{
      position:absolute;
      top:14%;
      right:7%;
  }
  .pharma-product1{
      position:absolute;
      top:50%;
      left:7%;
  }
  .pharma-product2{
      position:absolute;
      top:-1%;
      right:40%;
      transform:rotate(90deg);
  }
  .pharma-product3{
      position:absolute;
      top:20%;
      right:20%;
      transform:rotate(120deg);
  }
  #login-content{
    height: 100vh;
  }