body,#footer { background-color:#005696;}
#header {background-color:white;}
#footer,#header { border-color:#005696; border-bottom-style:none; background-repeat:repeat-x;}
#header	{background: center top;  background-image:url(../images/MHeaderbg.png); background-size:1px 83px;} 
#header img { width:271px; height:83px;}

#footer	{ background-image:url(../images/MFooterbg.gif);}

/* **** New Next Button styles **** */
input#NextButton {
    background-color: #007fb0 !important; /* Should be same color as Desktop button */
    color: #ffffff !important;
    border: none !important;
    /* Don't touch anything the below */
    font-size: 1.4em !important;
    height: 46px !important;
    width: 100% !important;
    border-radius: 0px !important;
    -webkit-appearance: none !important;
}


/* Comment this line out if you have OnePage/Tiles and then un-comment the two lines below. */
.SurveyHolder {padding: .5em .7em;}

/* **** END NEW BUTTON STYLES **** */

.InputRowEven { background-color: #f2f2f2; }


/* Simple Radio Button & Checkbox - Still needed for WCAG */
.MobileMode .checkboxSimpleInput { background: url(../images/WSE_Checkboxes_@2x.png) no-repeat;}

/* Commented out for new WCAG changes.  Radio buttons should be using font awesome, so commenting out
    for WCAG examples until we can update our templates. - T. Perez 2021-01-31
*/
/*.MobileMode .radioSimpleInput { background: url(../images/WSE_Radio_@2x.png) no-repeat;} */

/* WCAG - control the color of the radio buttons (https://confluence.smg.com/pages/viewpage.action?spaceKey=WSE&title=Upgrading+to+WCAG+survey+setup) */
input[type="radio"] ~ label.radioSimpleInput:before {
    font-family: "Font Awesome 5 Pro";
    /*  content: "\f6be";*/
    color: #006BA7;
}

input[type="radio"]:checked ~ label.radioSimpleInput:before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    /*  content: "\f6be";*/
    color: #006BA7;
}

/* **** Footer **** */
#footerPP, #footerPP a, #footerTC, #footerTC a, #footerCPP, #footerCPP a { color: #ffffff; }
#footerCR, #PwBY{ color:#ffffff !important; }


/* **** Finish Page **** */
div#finishConnect {text-align:center; margin-top: 3em; border-top: solid thin black;}
div#finishContainer hr {background-color: Transparent; border-width: 0; height: 0; margin: 0; padding: 0;}
div#connectContent {margin:1em;}
div#connectContent div ul {margin:0 !important;list-style:none;padding:0;}
div#connectContent div ul li {padding:.2em;}
.ConnectOn p.connectHeader, .ConnectOn p.FinishHeader {font-weight:bolder;}


/* **** Pick Language **** */
ul.languageOption {text-align:left !important;padding-left:0;}
ul.languageOption li { display:block; padding:0; margin:0 1em 0 0;}
 
a.POSChanger {font-weight:bold !important; font-size:1.4em;  }
a.POSChanger, ul.languageOption a {color: #005696; }

/* Mobile Receipt */
body.MobileEntryImage .IndexText00 { padding:.5em 2.4em; background-repeat:no-repeat; background-position: left center;margin-bottom: 0;  }
body.MobileEntryImage .ItemOne { background-image:url('../../../Common/images/1.png');} 
body.MobileEntryImage .ItemTwo { background-image:url('../../../Common/images/2.png');} 
body.MobileEntryImage .ItemThree { background-image:url('../../../Common/images/3.png');} 
body.MobileEntryImage .ItemFour { background-image:url('../../../Common/images/4.png');} 
body.MobileEntryImage .ItemFive { background-image:url('../../../Common/images/5.png');} 
body.MobileEntryImage .IndexText01 { background-image:none;}

/* New Global WCAG Class*/
.sr-only {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    padding: 0 !important;
    border: 0 !important;
    white-space: nowrap !important;
    clip: rect(1px 1px 1px 1px) !important; /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px) !important;
    clip-path: inset(50%) !important;
}