/*rg testing*/

.card li, .ajax-PopOverMenuBoxes li, .ajax-PopOverMenuBoxesMobile li { padding-left:3px;}
.card a, .ajax-PopOverMenuBoxes a, .ajax-PopOverMenuBoxesMobile a { width:100%; box-sizing:border-box; padding-left:5px; display:inline-block;}
.MainMenuOption li:hover, .MainMenuOption li a:hover {background-color:#0c90b1; color:#fff }
 
    .card a:hover, .card a:focus,
    .ajax-PopOverMenuBoxes a:hover, .ajax-PopOverMenuBoxes a:focus,
    .ajax-PopOverMenuBoxesMobile a:hover, .ajax-PopOverMenuBoxesMobile a:focus
     {
        outline: none;
        color: #fff;
        background-color: #0c90b1;
    }





/*This is currently only for the top menubar that RG is working on.*/
.MenuBarContainer { position:fixed; top:0px; right:0px; left: 0px; height:49px; background-color:#fff; padding:0px; box-sizing:border-box; z-index:100;box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
                    margin-bottom:20px; overflow:visible;
                    min-height: 1px; /*for IE7*/
                    float:left; width:100%;
                    background-color:#fff;
                    height:initial;
                    display:table;
}

    
.MenuBarSpacer {z-index:-1; 

                /*height:49px;*/
                visibility:hidden;
}
.MenuBarLogoContainer {margin:5px;  display:inline-block; vertical-align:top;}

/*The Navigation Menu Links Bar:  http://www.w3schools.com/css/css_navbar.asp     */
.MenuOptionsContainer { display: inline-block; font-family: 'HelveticaNeue-Light','Segoe UI Light','Segoe UI','Lucida Grande',Verdana,Arial,Helvetica,sans-serif; color: #707070; font-weight: normal; font-size: 20px;}


.MenuOptionsContainer ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #fff; }
.MenuOptionsContainer li { float: left; }
.MenuOptionsContainer li a { display: block; color: #707070; text-align: center; padding: 6px 16px; text-decoration: none; }
.MenuOptionsContainer li a:hover { color: #fff; background-color: #0c90b1; }
/*The Employee Quick Search Text Box*/
#EmployeeQuickSearch { }
.EmployeeQuickSearchContainer { display: inline-block; text-align:left; margin: 0 auto; margin: 8px; position: relative; border: 1px solid #A9A9A9; box-sizing: border-box; float: right; width: 240px; height: 27px;}
.EmployeeQuickSearchContainer input, .EmployeeQuickSearchContainer input[type="search"] { width: 200px; height: 23px; border: none; font-weight: normal; max-width: none; outline: 0; font-size: 15px; font-family: 'HelveticaNeue-Light','Segoe UI Light','Segoe UI','Lucida Grande',Verdana,Arial,Helvetica,sans-serif; color: #707070; color: #333; font-weight: normal; 
                                                                                           -webkit-appearance:none;  -webkit-border-radius:0px; /*iphone fix;*/
                                                                                            }
.EmployeeQuickSearchContainer button { background-color: #eee; color: #707070; border: none; font-size: 18px; float: right; height:25px; }

#EQSUIContainer {padding:3px;box-sizing:border-box; float:right;}

.UserInfoText {display:inline-block; margin-right:10px; line-height:11px;margin-top:5px; font-family:'HelveticaNeue-Light','Segoe UI','Lucida Grande',Verdana,Arial,Helvetica,sans-serif; color:#707070;}


/*#QuickLinksContainer {position:fixed; top:50px; left:0px; right:0px; height:74px;z-index:100;}*/
#QuickLinksContainer {float:left; width:100%; left:0px; right:0px; height:74px;z-index:100;}
#QuickLinksSpacer {z-index:-1; height:74px;}
.QuickLinkLabel { }
/*Quick Links Bar*/
    /* Transforms the list into a horizontal navigation */
    .subnav li { text-align: center; transition: border .5s; }
    .icon { padding-top: .4em; }
        .icon i:hover { font-size: 19px; }
        .icon + span { margin-top: 1.1em; transition: margin .5s; }
    /* Positioning the icons and preparing for the animation*/
    .subnav i { position: relative; display: inline-block; margin: 0 auto; padding: 0.4em; border-radius: 50%; font-size: 1.8em; box-shadow: 0 0 0 0.8em transparent; background: rgba(255,255,255,0.1); transform: translate3d(0, 0, 0); transition: box-shadow .6s ease-in-out; }
    /* Animate the box-shadow to create the effect */
    /*.no-touch .subnav a:hover i,*/
    .no-touch .subnav a:active i,
    .no-touch .subnav a:focus i { box-shadow: 0 0 0px 0px rgba(255,255,255,0.2); transition: box-shadow .4s ease-in-out; }
    .no-touch .subnav .icon i:hover { box-shadow: 0 0 0px 0px rgba(255,255,255,0.2); transition: box-shadow .4s ease-in-out; margin-bottom: 2px; /*This stops the text underneath the icon from moving on hover*/ }


#SpotlightPopUpContent .subnav ul li { background-color:#333; font-size:.8em;}

 #TermsOfUseIframe {width:1000px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}









/*We'll show/hide some elements as the screent gets smaller*/
@media only screen and (max-width: 1410px) {
    MenuOptionsContainer {font-size:16px;}
    #HomeMenuButtonLabelText{ display:none;} /*hides the home button's label*/
    #LogoutButtonLabelText {display:none;}
    #TermsOfUseIframe {width:1000px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}
}
   
@media only screen and (max-width: 1315px) {
    MenuOptionsContainer {font-size:18px;}
    .MenuOptionLabelText {font-size:18px; }
     #TermsOfUseIframe {width:800px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}
        }
@media only screen and (max-width: 1294px) {
    .MenuOptionLabelText {font-size:16px; }
    .UserInfoText {font-size:10px;}
     #TermsOfUseIframe {width:700px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}
        }
@media only screen and (max-width: 1220px) {
    #HomeMenuButtonLabelText{ display:inherit;} /*Turn these back on if we're wrapping the labels*/
    #LogoutButtonLabelText {display:inherit;}    
    .MenuOptionLabelText {display:block;font-size:10px; }
     #TermsOfUseIframe {width:675px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}
        }
@media only screen and (max-width: 1050px) { /*This is where we should wrap the employee search*/    
    #EQSUIContainer { float:none; clear:both; text-align:center; border-top:solid 1px #ccc;}
    .EmployeeQuickSearchContainer { float:none; clear:both;}
    .MenuOptionsContainer { font-size:25px;}
    .UserInfoText {font-size:9px;}
    #TermsOfUseIframe {width:675px; border-style:inset; border-color:#eee ; height:450px;border-width:3px;}
    }

@media only screen and (max-width:700px) {/*We're getting real small, so hide the labels*/
    #HomeMenuButtonLabelText{ display:none;} /*Turn these all off here:*/
    #LogoutButtonLabelText {display:none;}
    #LogoutButtonLabelText {display:none;}
    #NavigationMenuButtonLabelText { display:none;}
    #LinkedLoginsMenuButtonLabelText { display:none;}
    #AtAGlanceMenuButtonLabelText{ display:none;}
    #TermsOfUseIframe {width:500px; border-style:inset; border-color:#eee ; height:350px;border-width:2px;}
    .QuickLinkLabel {font-size:10px;}
}
@media only screen and (max-width:600px) {
    .UserInfoText {visibility:hidden; display:none;}
    #TermsOfUseIframe {width:400px; border-style:inset; border-color:#eee ; height:350px;border-width:1px;}
}

@media only screen and (max-width:530px) {
    .MenuBarLogoContainer { display:none;}
    .QuickLinkLabel { display:none;} /*Hide the labels on quick link bars....may need to tag this to the container ID so it works in the popup menu too*/    
    #TermsOfUseIframe {width:320px; border-style:inset; border-color:#eee ; height:250px;border-width:1px;}
}
/*just while we're developing*/
.MenuOptionsContainer {}
#EQSUIContainer { background-color: #fff; }
/*
    Scrollout header section:
    http://lifeinthegrid.com/simple-css-fixed-header/

    Fixed header dynamic height (basically copying same content into spacer div and hiding it):
    http://codepen.io/parkerbennett/details/hbzJm

    */