﻿
html {
  overflow-x: hidden;
}

/* All iPad Air Models - Portrait & Landscape Combined */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {
        .loginMenu{padding-bottom:1px !important;}
        /* Common iPad row styling */
        .row {
        width: 100%;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center;
        text-align: center !important;
        margin: 0 auto;
        }
        #MainContent_leaveApplyBox .row{display:block !important;}
        #empBar {
        top: 1px !important;
        }

        .Loggedin {
        display: block !important;
        color: white !important;
        font-size: 13px !important;
        margin: -55px -178px !important;
        text-align: center !important;
        }
        .aboveMenu{    margin: -26px;
        font-size: 13px !important;
        color: white !important;
        line-height: 5px;
        }
        .nav-bar {
        width: 90vw;
        background-color: #2a4052;
        direction: ltr;
        float: left;
        margin: 1px;
        padding: 6px;
        }

}

/* Portrait iPad Air */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {

  .row {
    gap: 2px;
    max-width: 100%;
  }
}

/* Landscape iPad Air */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

  .row {
    gap: 20px;
    max-width: 700px;
  }
}


    /* Phones + small tablets: make it fixed on screen */
@media (max-width: 767px) {
#hamburgerBtn {
position: sticky !important;top:10px;

z-index: 9999;
}
#open-popup{top:-60px !important;}
.nav-bar {
width: 96vw;
    background-color: #2a4052;
    direction: ltr;
    float: left;
    margin: -36px;
    padding: 2px;
    transition: background-color 0.3s ease, padding 0.3s ease
}
.nav-bar:hover {
    background-color: #3b5870; /* new color on hover */
    padding: 2px;         /* example: slightly taller */
}
.loginMenu{padding-bottom:1px !important;}
.Loggedin {margin: -14px !important;text-align: center !important;}
.aboveMenu{margin:-34px;}
#empMenu{padding-top:22px;}
.containerBody{padding: 3em 0 2em 0 !important;}
}
