:root {
    /*Main Theme Colors*/
    /*    --MainThemeColor: #1e0dad;
    --MainThemeAccentColor: #1e90ff;*/
    --MainThemeGreenColor: #50AD0D;
    --MainThemePurpleColor: #6a12af;
    --MainThemeRedColor: red;
    /*Hover Pipeline Highlight*/
    --ColorTransparentMain: 0, 49, 184;
    /*Text Color Options*/
    --BlackText: #000000;
    --WhiteText: #ffffff;
    --statusTabs: 9;
    --tabsHoverREM: 29rem;
    --lastTab: 0;
    --FontFamily: Arial;
    --FontFamilySecondary: Arial;
    --FontSize: 12px;
    --FontSmall: 10px;
    --FontMedium: 15px;
    --FontLarge: 20px;
    --Nav-Height: 80px;
    --Side-Nav-Width: 100px;
    --primary: var(--MainThemeColor);
    --secondary: var(--MainThemeAccentColor);
}





    body > form {
        padding: 1.5em
   /*     position: absolute;*/
     /*   width: calc(100vw - 100px);*/
/*        padding: 90px 0 0 120px;*/
/*        margin-left: var(--Side-Nav-Width);
        margin-top: var(--Nav-Height);*/
/*        right: 0;*/
        /* bottom: 12rem; */
      /*  top: 80px;*/
    }

nav .row {/*
    height: auto;
    width: 100%;
    margin-bottom: 0px !important;*/
    margin-right: auto;
    margin-left: auto;
}





/*======================TOP NAV==================*/
header {
    height: var(--Nav-Height);
    width: 100%;
    background-color: white;
    border-bottom: 5px solid var(--MainThemeColor);
    box-shadow: 0px 3px 5px rgb(0 0 0 / 30%);
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
}

.personalinfo {
    display: flex;
    width: auto;
    position: relative;
    float: right;
}

    .personalinfo i {
        cursor: pointer
    }

.cpanel {
    width: auto;
    display: flex;
    margin: auto
}

/*div.cpanel > span > i {
    color: white;
    background-color: var(--MainThemeColor);
    border-radius: 50%;
    padding: 13px;
    font-size: inherit;
    top: 0;
    left: 0;
}*/

div.cpanel > .activeNavIcon > i {
    background-color: var(--MainThemeAccentColor) !important;
}

.activeNavIcon > i {
    background-color: var(--MainThemeAccentColor) !important;
}


/*div.cpanel > a > i {
    color: white;
    background-color: var(--MainThemeColor);
    border-radius: 50%;
    padding: 13px;
    font-size: inherit;
    top: 0;
    left: 0;
    margin: 0.5em;
}*/

.navigation-icon {
    color: var(--primary);
    display: flex;
    font-size: 2em;
    justify-content: center;
    align-items: center;
    margin: 10px;
}

div.cpanel > a > i {
    color: var(--MainThemeColor);
    font-size: inherit;
    top: 0;
    left: 0;
    margin: auto;
}

.openMainMenuHam{
    display: none
}

.mainHamMenuBtn i {
    background-color: var(--MainThemeAccentColor);
}


nav .imgLogo {
    width: 100%;
    max-width: 250px;
    object-fit: contain;
    margin: 8px;

}


#usrNmAndMssgContainer {
    margin: auto;
}



/*.cpanel > span > i {
    margin: .5em
}*/


.topnav #myLinks {
  /*  display: none;*/
/*  display:flex;*/
/*    background-color: var(--MainThemeColor);*/
/*    display: inline-flex;*/
/*    bottom: 0;
    flex-wrap: wrap;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    justify-content: center;*/
}

/*.acctAddressBook i {
    color: #ffffff;
    background-color: var(--MainThemeColor);
    border-radius: 50%;
    padding: 13px;
}
*/
.mobile-container .topnav a {
    padding: 6px;
    text-decoration: none;
    font-size: 11px;
    width: 18%;
    color: var(--WhiteText);
    background-color: var(--MainThemeColor);
}

.mobile-container .topnav a i {
    display: block;
}

.mobileTopNavOptions .icon {
    position: relative;
    top: auto;
    height: auto;
    color: black;
}

.mobileTopNavOptions {
    width: 100%;
    height: 100%;
    background-color: #ddd;
    padding: 1em;
    text-align: center;
    border-bottom: 3px solid var(--MainThemeAccentColor);
}

    .mobileTopNavOptions .mobMenuBtnOpt {
        border-right: 2px solid white;
    }

.topnav a.icon {
    position: initial;
    text-align: end;
}



/*======================END TOP NAV==================*/





/*======================SIDE NAV==================*/
.sideNavig {
    width: var(--Side-Nav-Width);
    height: 100%;
    background: gray;
    position: fixed;
    left: 0px;
    z-index: 5000;
    border-color: white;
       top: var(--Nav-Height);
    background: none repeat scroll 0 0 var(--MainThemeColor);
    color: white;
    text-shadow: none;
    border-left: 0px;
    border: none;
    padding-bottom: 10em;
}

/*======================END SIDE NAV==================*/





/*======================ACCOUNT DROP DOWN==================*/
.acctLogMenu {
    text-align: center;
    background-color: var(--primary) !important;
    position: absolute;
    will-change: transform;
    top: var(--Nav-Height) !important;
    transform: none !important;
    right: 0;
}

.acctLogMenu a{
color:white
}

    .acctLogMenu span {
        color: white;
        cursor:pointer;
    }

.adminTab2 {
    width: 100%;
    position: absolute;
    display: grid;
    /* padding: 10px; */
    height: auto;
    text-align: center;
    color: white;
    top: 60px;
    padding: 10px;
}
/*======================END ACCOUNT DROP DOWN==================*/





/*======================ACCOUNT DROP DOWN==================*/

/*======================END ACCOUNT DROP DOWN==================*/



@media only screen and (min-width: 320px) and (max-width: 480px) { /*Mobile devices*/
    /*==================================HEADER NAV====================================*/
    #headerNav img {
        display: block;
        margin: auto;
        max-width: 100%;
    }

    #usrNmAndMssgContainer {
        display: none;
    }

    .imgLogo {
        max-width: 220px;
    }

    .personalinfo {
        float: none;
    }

    :root {
        /*--Nav-Height: 140px;*/
        --Side-Nav-Width: 100px;
    }




    /*==================================END HEADER NAV====================================*/
    /*==================================Account Dropdown Menu====================================*/
    .acctLogMenu {
        width: 100%;
    }

    .myAccountIconBtn{
        display: none
    }


    .acctLogMenu hr {
        border-bottom: 1px solid white;
    }

    .personalinfo > i {
        padding: 24px;
        font-size: 3em;
    }

    /*==================================END Account Dropdown Menu====================================*/

    /*==================================SIDE NAV====================================*/
    .menu-button {
        position: fixed !important;
        left: 0;
        background-color: var(--MainThemeAccentColor);
        cursor: pointer;
        -webkit-transition: .3s;
        transition: .3s;
        height: 100%;
        width: 9px;
        z-index: 20000;
    }
    
    .menu-button div {
        top: 38%;
        position: absolute;
        background-color: var(--MainThemeAccentColor);
        border-radius: 0 20% 20% 0;
    }

#nav-closed {
    color: #FFF;
    width: 20px;
    height: 56.5px;
    font-size: 16px;
    padding-top: 20px;
}
#nav{
    display:none
}
/*    .sideNavig {
        display: none;
        top: calc(var(--Nav-Height) + va(--Mobile-Sub-Nav));
        width: var(--Side-Nav-Width)
    }*/
    .NavMoreOptions {
        position: absolute;
        left: 100%;
        height: 100%;
        background: var(--MainThemeAccentColor);
        padding: 20px 20px;
        top: 0;
        width: 200px;
        font-size: inherit;
        text-align: center;
    }
 

    /*==================================END SIDE NAV====================================*/

    /*===============================DEALS MENU DROPDOWN====================*/
  /*  #topNav {
        display: block;
        width: 100%;
        right: 0px;
        top: 40px;
        position: absolute;
    }*/

   /* body {
        margin-top: var(--Nav-Height);
        margin-left: 0px;
        padding: 2em;
    }*/

}

@media only screen and (max-width: 1023px) {
/*    #mobileView {
        display: initial;
    }
*/
/*    #nav {
        display: none;
    }*/

    #usrNmAndMssgContainer {
        display: none
    }

    .openMainMenuHam {
        display: flex;
        user-select: none;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    }
    .mobileFooterIcons {
        display: block
    }

/*    nav .imgLogo {
        margin: auto;
        display: block;
    }*/
 /*   body > form {
        width: 100%;
        padding: 140px 0 0 10px;
    }*/

    #bodyLayout {
        margin-left: auto;
        width: 100%;
    }

    /*#topNav {
        display: block;*/
        /*    width: 50%;*/
        /*right: 0px;
        top: auto;
        position: fixed;
        bottom: 0;
        background-color: var(--MainThemeColor);
    }*/


  
}

@media only screen and (min-width: 481px) and (max-width: 768px) { /*ipad tablet devices*/

}
body > form

@media only screen and (min-width: 769px) and (max-width: 1024px) { /*small screens and laptops devices*/
    #MenuContainer {
        margin-top: 43px;
    }

 /*   body > form {
        width: 100%;
        padding-top: 140px;
    }*/

}

@media only screen and (min-width: 1025px) and (max-width: 1200px) { /*desktop and large screens devices*/

}

@media only screen and (min-width: 1201px) and (more) { /*extra large screens, tv devices*/

}