.mejri-logo {
  /* max-width: 140px; */
  max-width: 99px;
  top: -2px;
  left:-70px;
  /* left:-170px; */
  /* top: -2px;  */
  position: relative; 
}
/* .mejri-text {
  margin-left: -69px;
  position: relative;
} */
.sidebarframe {
  /* width: 250px; */
  height: 100%;
  /* background-color: #0ed918; */
  color: #000;
  /* position: fixed; */
  position: relative;
  top: 0;
  /*left: 20px;*/
 /* left: 60px;*/
 /* left: 135px; */
 /* left: 50px; */
 left: 78px;
 overflow-y: auto;
}
@media only screen and (min-width: 960px) {
    /* styles for browsers larger than 960px; */
    .mejri-logo {
      max-width: 140px;
      /* left:-170px; */
      top: -2px; 
      position: relative;
    }
    /* .sidebarframe {
      position: relative;
      left: 135px;
  } */
}
@media only screen and (min-width: 1440px) {
    /* styles for browsers larger than 1440px; */
    .mejri-logo {
      max-width: 140px;
      /* left:-170px !important; */
      left:-113px !important;
      top: -2px; 
      position: relative;
    }
    .mejri-text {
      margin-left: -69px;
      position: relative;
    }
    .sidebarframe {
      position: relative;
      /* left: 135px; */
      /* left: 50px; */
      left: 78px;
  }
}
@media only screen and (min-width: 2000px) {
    /* for sumo sized (mac) screens */
    .mejri-logo {
      max-width: 140px;
      top: -2px; 
      position: relative;
    }
    .sidebarframe {
      position: relative;
       /* left: 135px; */
      /* left: 50px; */
      left: 78px;
  }
}
@media only screen and (max-device-width: 480px) {
   /* styles for mobile browsers smaller than 480px; (iPhone) */
   .mejri-logo {
    max-width: 140px;
    top: -2px; 
    position: relative;
  }
  .mejri-text {
    font-size: 5px !important;
    margin-left: 0px;
    position: relative;
  }
  .sidebarframe {
    position: relative;
    /* left: 50px; */
    left: 78px;
  }
}
@media only screen and (device-width: 768px) {
   /* default iPad screens */
   .mejri-logo {
    max-width: 140px;
   
    top: -18px !important;
    position: relative;
  }
  .mejri-text {
    font-size: 16px !important;
    margin-left: 0px;
    position: relative;
  }
  .sidebarframe {
    position: relative;
    /* left: 50px; */
    left: 78px;
   }
}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
  .mejri-logo {
    max-width: 140px;
    top: -2px; 
    position: relative;
  }
  .sidebarframe {
    position: relative;
    /* left: 135px; */
   }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
  .mejri-logo {
    max-width: 140px;
    top: -2px; 
    position: relative;
  }
  .sidebarframe {
    position: relative;
    /* left: 135px; */
   }
}


@media only screen and (min-width: 200px) and (max-width: 767px)  {
    /* Put your CSS here for 200px to 767px width devices (cover all width between 200px to 767px // */
    .mejri-logo {
        max-width: 140px;
        /* left:-100px; */
        top: -18px !important;
        position: relative;
        left: -20px;
      }
      .sidebarframe {
        position: relative;
        /* left: 135px; */
        left: 20px;
       }

       h2 {
        font-size: 26px !important;
        line-height: 32px;
       }
   
    }