:root{
    /* defines CSS variables */
        --GRAY: #323232;
        --MIDGRAY: #4A4A4A;
        --LIGHTGRAY: #F6F6F6;
        --DARKBLUE: #005191;
        --LIGHTBLUE: #539ED0;
        --YELLOW: #FFB351;
        --BODYSANS: "HK Grotesk", Sans-Serif;
        --HEADERSANS: "League Gothic", Sans-Serif;
        --ATIME1: 40s;
        --ATIME2: 42s;
    }
    
    
    body {
    /* 
    Makes body/main take the full height with 0 margin
    Apply flex display
    Base styling
    */
        height:100vh;
        margin:0;
        display:flex;
        flex-direction:column;
        /* UWMC Style */
        font-family: VAR(--BODYSANS);
        font-size: 16px;
        line-height: 30px;
        color: VAR(--GRAY);
    }
    
    #MainContent {
        max-width: 80ch;
        margin: auto;
        margin-top: 4vh;
    }
    
    footer{
        margin-top:auto;
    }
    
    h1 {
        /* UWMC Style */
        font-size: 64px;
        line-height: 66px;
        font-family: VAR(--HEADERSANS);
        text-transform: uppercase;
    }
    
    
    #main-banner {
        display: flex;
        justify-content: flex-end;
        padding: 0px;
        min-height: 68px;
    }
    
    #header-menu{
        padding-bottom: 30px;
        padding-top: 20px;
        min-height: 82px;
    }
    
    a:hover, i:hover{
        color: VAR(--LIGHTBLUE);
    }
    
    a, i {
        color: VAR(--DARKBLUE);
        text-decoration: none;
    }
    
    p{
        margin-bottom: 1ch;
    }
    
    h1 {
        background: inherit !important;
        color: inherit !important;
    }
    
    body > br {
        display: none;
    }
    
    .card {
        border: none;
    }
    
    #eVol-breadcrumbs {
        display: none;
    }
    
    .PartnerAgencyImage {
        display:none;
    }
    
    /* 202401 margin adjustment */
    .my-3 {
        margin-top: 1ch !important;
        margin-bottom: 1ch !important;
    }
    
    .form-horizontal div.row div[class^="col-"] {
        margin-bottom: 0em;
    }
    
    .Row-LineDetail {
        align-items: center;
    }
    
    i.material-icons{
        font-size: inherit;
    }
    
    tr.Row-Designation{
        font-style:  italic;
    }
    tr.Row-Total{
        font-weight: bold
    }
    tr.Row-Designation td.Col-Text{
        padding-left: 4em;
    }
    
    .Row-YTDPledge{
        display: none;
    }
    
    /*
     Nav Menu
         */
        nav#secondary-menu {
            z-index: 7;
            min-width: auto;
        }
    
        nav#secondary-menu ul {
            background-color: inherit !important;
        }
        
        nav#secondary-menu ul li *,
        nav#secondary-menu ul li a{
            /* UWMC Style */
            font-family: VAR(--BODYSANS);
            font-size: 18px;
            line-height: 66px;
            font-weight: 500;
            color: VAR(--GRAY);
            text-transform: initial;
            padding: initial;
        }
        
        nav#secondary-menu ul li ul li>a{
            color: #fff;
            line-height: 20px;
            margin-left: 1ch;
        }
    
        nav#secondary-menu ul li ul li.CSSCloseButton {
            color: #fff;
            line-height: 20px;
            font-style: oblique;
            display: none !important;
        }
        
        /* overrides bootstrap behavior*/
        nav#secondary-menu ul li:hover>a{
            color: VAR(--GRAY);
        }
        
        .Area-UnitedWeFight-P-secondary-menu ul{
            display: flex;
        }
        
        .Area-UnitedWeFight-P-secondary-menu ul li{
            padding: 0px 1em !important;
            white-space: nowrap;
        }
    
        
        .Area-UnitedWeFight-P-secondary-menu ul li ul li{
            padding: 0px 2em 2ch 1em !important;
            white-space: nowrap;
        }
    
        .Area-UnitedWeFight-P-secondary-menu ul li ul li:first-child{
            padding: 2ch 1em 2ch !important;
        }
        
        /* top-level nav hover*/
        .Area-UnitedWeFight-P-secondary-menu .pureCssMenu > li:hover:after{
            opacity: 1;
            height: 8px;
            
        }
        
        .Area-UnitedWeFight-P-secondary-menu .pureCssMenu > li:after{
            position: absolute;
            content: '';
            left: 0;
            bottom: 0;
            width: 100%;
            height: 0px;
            background: VAR(--DARKBLUE);
            z-index: 9;
            opacity: 0;
        }
        
        /* sub menu style */
        
        li ul.pureCssMenum{
            border: none;
            left: 0px;
        }
    
        li ul.pureCssMenum{
            top: 100%;
        }
        
        li .pureCssMenum li{
            background: VAR(--DARKBLUE);
        }
        
        li .pureCssMenum li a, .pureCssMenum .CSSCloseButton {
            color: white;
        }
        
        /* sub menu nav hover */
        nav#secondary-menu ul li ul li:hover>a{
            color: white;
        }
        
        li .pureCssMenum li:hover:before{
            opacity: 1;
        }
        
        li .pureCssMenum li:before {
            opacity: 0;
            content: '';
            width: 6px;
            height: 6px;
            background: #ffb351;
            border-radius: 7px;
        }
    
        ul.pureCssMenu ul li {
            display: flex !important;
            align-items: center;
        }
    
    /* Top content area */
        .Area-UnitedWeFight-P-top-menu{
            display: flex;
            justify-content: flex-end;
            width: 100%;
        }
        .Area-UnitedWeFight-P-top-menu .Portlet-Separator{
            width: 2em;
        }
        /*ROLE CHANGE */
        .ecomm-bottom-menu .Menu-H {
            padding-right: 4em;
        }
            table[id='MENU_BOTTOM_ROLE CHANGE']{
                font-size: 14px;
            }
    
            table[id='MENU_BOTTOM_ROLE CHANGE'] td {
                padding-left: 2ch;
            }
            table[id='MENU_BOTTOM_ROLE CHANGE'] td * {
                text-decoration: underline;
            }
            table[id='MENU_BOTTOM_ROLE CHANGE'] tbody tr {
                display: flex;
                flex-wrap: wrap;
                float: right;
                max-width: 60vw;
            }
            table[id="MENU_BOTTOM_ROLE CHANGE"] tbody tr{
            display: flex;
            width: 20em;
            flex-direction: column;
            background: VAR(--LIGHTGRAY);
            z-index: 10;
            position: relative;
        }
        #roleHead{
            display: flex;
            flex-direction: row;
            align-items: center;
            padding-left: 0px;
            width: 25em;
            background: var(--LIGHTGRAY);
            font-weight: bold;
        }
        .loggedInName{
            z-index: 11;
            position: relative;
        }
        #roleHead #currentRole{
            padding: 0ch 1ch;
            font-weight: normal;
            font-style: oblique;
            text-decoration: none;
        }
        #roleHead:after{
            content: '\e5cf';
            font-family: 'Material Icons';
        }
        #roleHead.uncollapsed:after{
            content: '\e5ce';
            font-family: 'Material Icons';
        }
        table[id="MENU_BOTTOM_ROLE CHANGE"] tbody tr td{
            display: none;
        }
        table[id="MENU_BOTTOM_ROLE CHANGE"] tbody > tr td{
            background: white;
        }
    /* 
        logo 
    */
        #header-menu .uwmc-logo img{
            width: 155px;
            position: absolute;
            left: 1em;
            top: 1em;
        }
        
        /* applies style to all logos */
        .uwmc-logo img{
            height: 110px;
        }
    
            
        #footer, #header-menu, #main-banner, #header-utility {
            background: VAR(--LIGHTGRAY);
            padding-right: 100px;
            padding-left: 20px;
        }
    
        #header-utility{
            border: none;
        }
    
        #header-menu .row .col-lg-3 {
            flex: 0 0 0;
            width: 0px;
            padding: 0px;
            margin: 0px;
        }
        #header-menu .row, #header-menu .row .col-lg-9, .header-top-menu {
            padding: 0px;
            margin: 0px;
            width: 100%;
        }
    
    .popup:hover .popuptext {
      visibility: visible;
      -webkit-animation: popupFadeIn 1s;
      animation: popupFadeIn 1s
    }
    /* Popup container */
    .popup {
      position: relative;
      display: inline-block;
      color: #005191;
      font-weight: bold;
      cursor: pointer;
    }
    
    .popup:hover,
    .popup:hover i{
        color: #539ED0;
    }
    
    /* The actual popup (appears on top) */
    .popup .popuptext {
      visibility: hidden;
      width: 20em;
      background-color: #539ED0;
      color: #fff;
      text-align: center;
      border-radius: 6px;
      padding: 8px 0;
      position: absolute;
      z-index: 1;
      bottom: 125%;
      left: 50%;
      margin-left: -10em;
    }
    
    /* Popup arrow */
    .popup .popuptext::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      margin-left: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: #555 transparent transparent transparent;
    }
    
    /* Add animation (fade in the popup) */
    @-webkit-keyframes popupFadeIn {
      from {opacity: 0;}
      to {opacity: 1;}
    }
    
    @keyframes popupFadeIn {
      from {opacity: 0;}
      to {opacity:1 ;}
    } 
    
    /* 
        main content 
    */
    
        #MainContent {
            padding: 2vh 0vw;
        }
    /* Calendar Date Picker */
    
    .datepick {
        font-family: var(--BODYSANS) !important;
    }
    
    .datepick-month {
        border: none;
    }
    
    .datepick-month-header {
        background: white;
    }
    
    .datepick-month-header select {
        background: var(--LIGHTGRAY);
        border: 1px solid var(--MIDGRAY);
        
    }
    
    .datepick-month table tr span,
    .datepick-month table tr a{
        text-align: center !important;
    }
    
    .datepick-month tr th {
        background-color: var(--DARKBLUE);
    }
    
    .datepick-month td .datepick-weekend {
        background-color: var(--LIGHTGRAY);
    }
    
    .datepick-month tr td a {
        background-color: var(--LIGHTGRAY);
    }
    
    .datepick-ctrl {
        padding-bottom: 1ch
    }
    
    
    /*
        footer
    */
        #footer div.container{
            max-width: 80ch;
            margin: auto;
            margin-top: 5vh;
        }
    
        #footer div.container div.col-lg-2{
            width: 0px;
            padding: 0px;
            flex: 0;
        }
    
        #footer div.container div.col-lg-8{
            width: 100%;
            flex: 0 0 100%;
        }
            
    
        
        .footer-table{
            width: 100%
        }
        
        /* overrides bootstrap */
        #foot-nav .row div{
            max-width: 100%;
            flex: auto;
        }
        #foot-nav .row > div{
            display: none;
        }
    
        #footer #foot-nav div.row > div:first-child {
            display: block !important;
        }
    
        .Footer-Heading {
            font-family: VAR(--HEADERSANS);
            font-size: 22px;
            letter-spacing: 0;
            line-height: 34px;
        }
    
    /* SOCIAL */
        ul.social {
            list-style: none;
            display: block;
            box-sizing: border-box;
            padding: 0px;
            margin-top: 1em;
        }
        footer .social li {
            display: inline-block;
            position: relative;
            width: 2.5em;
            height: 2.5em;
        }
        footer .social li a {
            display: block;
            position: relative;
            z-index: 999;
            width: 2.5em;
            height: 2.5em;
            text-indent: -9999px;
        }
    
        footer .social li:before, footer .social li:after{
            position: absolute;
            top: 0;
            left: 0;
            content: '';
            width: 2.5em;
            height: 2.5em;
        }
        
        footer .social li.twitter:before{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/Twitter.svg") 50% no-repeat;
        }
        
        footer .social li.twitter:after{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/TwitterBlack.svg") 50% no-repeat;
        }
        footer .social li.instagram:before{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/Instagram.svg") 50% no-repeat;
        }
        
        footer .social li.instagram:after{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/InstagramBlack.svg") 50% no-repeat;
        }
        footer .social li.facebook:before{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/Facebook.svg") 50% no-repeat;
        }
        
        footer .social li.facebook:after{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/FacebookBlack.svg") 50% no-repeat;
        }
        footer .social li.youtube:before{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/Youtube.svg") 50% no-repeat;
        }
        
        footer .social li.youtube:after{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/YoutubeBlack.svg") 50% no-repeat;
        }
        footer .social li.linkedin:before{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/LinkedIn.svg") 50% no-repeat;
        }
        
        footer .social li.linkedin:after{
            background: url("<BaseUrl>/UserPreferences/7780752/ePledge/Images/SocialIcons/LinkedInBlack.svg") 50% no-repeat;
        }
    
    
        footer .social li:after{
            opacity: 0;
        }
    
        footer .social li:hover:after{
            opacity: 1;
        }
        footer .social li:hover:before{
            opacity: 0;
        }
    
    #footer div.Footer {
        padding-bottom: 1em;
        font-size: 12px;
    }
    
    /* CG Flag Order */
    .Section-PledgeAddInfo .FlagTable {
        display: flex;
        flex-direction: column;
    }
    .Section-PledgeAddInfo .FlagTable .FlagRow-ePledge3 {
        order: 99;
    }
    
    /* Sticky Designation Nav*/
    .Body-Page-IPledgeDes1 #PledgeNavigation, 
    .Body-Page-IPledgeAddInfo #PledgeNavigationB {
        position: sticky;
        bottom: 0;
        background: white;
        padding: 0vh 0px 2ch;
        border-top: 1px var(--MIDGRAY) solid;
        z-index: 4;
    }
    
    #PledgeNavigationB .PledgeNavigation,
    #PledgeNavigation .PledgeNavigation {
        margin: 1em 0px;	
    }
    #PledgeNavigationB nav.PledgeNavigation ol,
    #PledgeNavigation nav.PledgeNavigation ol {
        margin-top: 0px;
    }
    
    /* GREY BOX */
    #NGSection{
        display: none;
    }
    
    div.TypeSelection-Items{
        margin-bottom: 3ch;
    }
    
    
    .uwmcGreyBox, .specificEntrySection > div,
    .PortletSurvey,
    .Section-Survey
    ,#EventReg > div.Block,
    div.Page-IPledge form.form-horizontal > div:not([class]){
        background: VAR(--LIGHTGRAY);
        padding: 2em clamp(1ch, 5em, 5vw) !important;
        border-radius: 100px;
        border: none !important;
    }
    
    .FeesHead .Row-Header {
    min-width: 8em;
    }
    
    .Page-SinglePageRegEvent li.NavigationClear {
        display: none;
    }
    
    .Section-EventRegistration > .Block > .my-3 {
        flex-direction: column;
    }
    .Section-EventRegistration > .Block > .my-3 .col-md-6 {
    width: auto;
    }
    
    
    .Section-EventRegistration .CouponCodeApply a.button {
    height: 2em;
    }
    
        #AttendListDtl .Col-Details-2{
            min-width: 10em;
        }
    
    @media (max-width: 600px) {
        #AttendListDtl tbody tr {
        display: flex;
        flex-direction: column;
        }
        
        #AttendListDtl thead {
        display: none;
        }
        
        #AttendListDtl tbody {
        display: flex;
        flex-direction: column;
        }
        #AttendListDtl tbody td.Col-AttendSurvey {
        min-width: 100%;
        width: 100%;
        }
    }
    
    #EventReg > div.Block{
        margin-bottom: 3ch;
        padding-top: 3em !important;
        padding-bottom: 3em !important;
    }
    
    .PortletSurvey{
        margin-top: 3ch;
        margin-bottom: 3ch;
    }
    
    .Section-EventRegistration div.BlockDetails .row > div,
    .Section-EventRegistration table tr{
        background: white;
    }
    .EventRegAttendTitleSER table tr {
        background: none;
    }
    
    input#CouponCode {
        max-width: 100%;
    }
    
    .StepUpMessage, .leaderUpSoldMsg, .newleaderLevelMsg  {
        display: none;
    }
    
    /* Buttons */
        /* Nav White Buttons */
        nav.PledgeNavigation a,
        .WhiteButtons .button,
        .DefaultButtons .button,
        .KeywordSearch .SearchNavigation li .button,
        .PledgeNavigationReturn a{
            font-family: VAR(--HEADERSANS);
            font-size: 20px;
            letter-spacing: 1.11px;
            line-height: 1em;
            text-transform: uppercase;
            min-width: 6em;
            width: fit-content;
            max-width: 15em;
            height: 3em;
            text-align: center;
            background: VAR(--DARKBLUE);
            border-radius: 500px;
            color: white !important;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 1em 0.5em;
            margin: 0px;
            border-style: initial;
        }
    
        nav.LoginButtonPanel {
            width: 10em;
        }
        nav.LoginButtonPanel ol{
            display:flex;
            flex-direction: column;
        }
        nav.LoginButtonPanel ol li {
            flex: auto;
        }
        nav.LoginButtonPanel .Forgot a{
            background: none;
            color: VAR(--DARKBLUE) !important;
            border: none;
            text-transform: none;
            font-size: 16px;
            padding: 0px;
            font-family: VAR(--BODYSANS);
        }
        nav.LoginButtonPanel .Forgot a:hover{
            background: none;
            box-shadow: none !important;
            color: VAR(--LIGHTBLUE) !important;
            border: none;
            text-transform: none;
            font-size: 16px;
            padding: 0px;
            font-family: VAR(--BODYSANS);
        }
    
        .WhiteButtons a.disableLink,
        .DefaultButtons a.disableLink,
        input.disableLink,
        button:disabled,
        button[disabled]{
            pointer-events: none;
            opacity: 0.5;
        }
    
        li.WhiteButtons,
        li.DefaultButtons {
            flex: 0 1 10em;
        }
    
        li.WhiteButtons a + span,
        li.DefaultButtons a + span{
            display: inline-block;
            margin-top: 1ch;
        }
    
        nav.PledgeNavigation a:hover,
        .WhiteButtons .button:hover,
        .DefaultButtons .button:hover,
        .KeywordSearch .SearchNavigation li .button:hover{
            box-shadow: 1px 2px 5px VAR(--DARKBLUE) inset !important;
            background: VAR(--LIGHTBLUE);
        }
    
        nav.NavigationButtons ol, 
        nav.PledgeNavigation ol, 
        nav.PledgeConfirmationButtons ol,
        nav.Navigation ol,
        nav.ActionButtons ol{
            display: flex;
            flex-direction: row-reverse;
            justify-content: space-between;
            margin-top: 2em;
        }
    
        .Roll-Donor nav.NavigationButtons ol li a {
            width: auto;
        }
    
        .Section-MyOutput nav.Navigation:first-of-type ol {
            margin-top: 0px;
        }
    
        div nav.Navigation ol {
            flex-direction: row;
        }
    
        .CancelTxtPledgeDsgnBtm, 
        .PledgeNavigationCancel,
        .ButtonCancel{
            display: none;
        }
        
        .PledgeNavigationReturn a:before{
            content: "Return";
            display: block;
        }
        .PledgeNavigationReturn img {
            display: none;
        }
        .PledgeNavigationReturn{
            width: 6em;
        }
        
        .input-group-text {
            background-color: #fff;
            border: none;
            display: inline-block;
            /* affects alignment of calendar input
            margin-top: 1em;*/
        }
    
        .input-group{
            /* class in survey and agency search, etc. */
            flex-wrap: nowrap;
            align-items: center;
        }
    
        #AgencySearchSection .KeywordSearchInput input[type=text]{
            width: 50% !important;
            margin-right: 2em;
        }
    
        #AgencySearchSection a.button {
            height: calc(1.5em + 0.75rem + 2px);
        }
    
    /* Agency Page Navigation */
    .WhiteButtons i.fa,
    .DefaultButtons i.fa {
        color: white;
    }
    
    #recentTransactionsDetails i.fa,
    #quickSummaryDetails i.fa{
        color: VAR(--DARKBLUE);
    }
    
    
    #DocumentsFilterTable{
        display: none;
    }
    
    /* Write in page Designation Table */
    div.WriteIn div.GroupAgency {
        display: none;
    }
    
    .ParentAgencyOnly .form-check-input:disabled~.form-check-label, 
    .ParentAgencyOnly .form-check-input[disabled]~.form-check-label,
    .ParentAgencyOnly .form-check-input:disabled{
        display: none;
    }
        
    /* Breadcrumbs */
    nav.PledgeProgress ol li.WhiteButtons,
    nav.PledgeProgress ol li.DefaultButtons {
        font-family: VAR(--HEADERSANS);
        font-size: 18px;
        text-transform: uppercase;
        margin: 0px;
        padding: 0em 0.5em;
    }
    
    nav.PledgeProgress li.ProgressArrow.WhiteButtons::after,
    nav.PledgeProgress li.ProgressArrow.DefaultButtons::after  {
        content: '\279C';
        color: '#CCCCCC';
    }
    
    nav.PledgeProgress ol li:first-child{
        padding-left: 0px;
    }
    
    nav.PledgeProgress ol li.ProgressStep.WhiteButtons,
    nav.PledgeProgress ol li.ProgressStep.DefaultButtons {
        background: none;
        border: none;
        color: VAR(--MIDGRAY);
    }
    
    nav.PledgeProgress ol li.ProgressStepCurrent.WhiteButtons,
    nav.PledgeProgress ol li.ProgressStepCurrent.DefaultButtons {
        background: none;
        border: none;
        color: VAR(--DARKBLUE);
    }
    
    th, td,
    th.text-right, td.text-right,
    .CampStatus th, .CampHistory th,
    .Block td, .Block th, th.text-end{
        text-align: left !important;
    }
    
    th {
        white-space: nowrap;
    }
    
    
    /* Footer */
    
    .Footer-Heading + a {
        overflow-wrap: anywhere;
    }
    
    .container,
    .container .row {
        max-width: 95vw !important; /* overrides _grid.scss media queries */
        /*width: 80vw;*/
    }
    
    .IPledgeTable .Row-PledgeAmount .input-group input.form-control, 
    .IPledgeTable input[id*=AmountDisplay] {
        width: inherit;
        margin: 0px;
    }
    
    .IPledgeTable .form-row {
        margin: 0px !important;
        justify-content: space-between;
    }
    
    .IPledgeTable .col-md-9 { 
        width: inherit !important;
    }
    
    .IPledgeTable {
        display: flex;
        flex-direction: column;
    }
    
    .IPledgeTable .row > label{
        flex: 1 1 33%;	
    }
    
    
    .IPledgeTable .row > div{
        flex: 2 2 66%;
    }
    
    .BlockDetails .IPledgeTable .row {
        flex-wrap: nowrap;
    }
    
    #MainContent div.container,
    #MainContent div.container .row {
        width: 100% !important;
    }
    
    .uwmc-logo > i{
        display: none;
        position: absolute;
        top: 110px;
        right: 15px;
        font-size: 3rem;
        z-index: 2;
        cursor: pointer;
    }
    
    .uncollapsed {
        display: block !important;
    }
    
    #agyInfoFrame {
        padding: 0px;
    
    }
    
    /* Agency Contact Styling */
    
    .Role-RecipientPP nav.Navigation .Delete {
        display: none;
    }
    
    /* iAttend styling */
    img {
        max-width: 100%;
        object-fit: contain;
    }
    
    div.DIV-EventRegTop {
        overflow-x: auto;
    }
    
    .EventSurvey .Row-LineDetail {
    flex-direction: column;
    }
    
    .EventSurvey .Row-LineDetail label {
    width: 100%
    }
    
    /* UWF Pledge Icons vs CSS: Round 2 */
    #MainContent div.TypeSelection div.TypeSelection-Items label::before,
    #MainContent div.TypeSelection div.TypeSelection-Items label::after {
        display: none;
    }
    #MainContent div.TypeSelection div.TypeSelection-Items{
        display: inherit;
    }
    #MainContent div.TypeSelection div.TypeSelection-Items label{
        padding: initial;
        padding-top: initial;
    }
    .PledgeTypeSelection .TypeSelection-Items input[type="radio"], div#PledgePaymentInfo .form-check input[type="radio"], 
    .IPledgeTable .row div>input[type="radio"]{
        display: inherit !important;
    }
    
    /* WAVES */
    .wave-wrap {
        height: 80vh;
        width: 208px;
        position: absolute;
        padding-top: 200px;
        padding-bottom: 200px;
        overflow: visible;
        left: 0;
        z-index: -1;
        transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -o-transform: rotate(180deg);
    }
    
    
    .wave-wrap .wave {
        position: absolute;
        background-size: contain !important;
        height: 1156px;
        width: 144px;
        top: 30%;
        right: 0;
      }
    
    .wave-wrap div:nth-of-type(2) {
        background: url('https://liveunitedchicago.org/wp-content/themes/united-way-theme/dist/images/wave1.png') repeat-y;
                    -webkit-animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) infinite;
                -o-animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) infinite;
        animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) infinite;
                -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .wave-wrap div:nth-of-type(3) {
        background: url('https://liveunitedchicago.org/wp-content/themes/united-way-theme/dist/images/wave2.png') repeat-y;
                -webkit-animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.125s infinite, swell VAR(--ATIME1) ease -1.25s infinite;
                -o-animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.125s infinite, swell VAR(--ATIME1) ease -1.25s infinite;
        animation: wave VAR(--ATIME1) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.125s infinite, swell VAR(--ATIME1) ease -1.25s infinite;
    }
    
    .wave-wrap div:nth-of-type(4) {
        background: url('https://liveunitedchicago.org/wp-content/themes/united-way-theme/dist/images/wave3.png') repeat-y;
            -webkit-animation: wave VAR(--ATIME2) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.25s infinite, swell VAR(--ATIME2) ease -2.5s infinite;
            -o-animation: wave VAR(--ATIME2) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.25s infinite, swell VAR(--ATIME2) ease -2.5s infinite;
        animation: wave VAR(--ATIME2) cubic-bezier(0.36, 0.45, 0.63, 0.53) -0.25s infinite, swell VAR(--ATIME2) ease -2.5s infinite;	
    }
    
    
    @keyframes wave{
        0%, 100%{
            transform: translate(0px);
        }
        50% {
            transform: translate(0px, -200px);
        }
    }
    
    @keyframes swell {
        0%, 100%{
                -webkit-transform: translate3d(50px, 0, 0);
                transform: translate3d(50px, 0, 0);
        }
        50% {
                -webkit-transform: translate3d(5px, 0, 0);
                transform: translate3d(5px, 0, 0);
        }
    }
    
    
    
    /* DEFAULT CLASSES - OVERRIDE MARGINS */
    
    .BlockHeader {
        padding-top: 5px;
        padding-bottom: 0px;
    }
    
    .form-group{
        margin-bottom: 1ch;
    }
    .FlagTable{
        margin: 0px;
    }
    
    .Page-IPledgeDes1 h2, 
    .Page-IPledgeDes2 h2 {
        margin-top: 0px;	
    }
    .Page-IPledgeDes1 h2, .Page-IPledgeDes2 h2, .Page-IPledgeCombined h2, .AgencySectionHeader h2  {
        background: initial;
        color: inherit;
    }
    
    .KeywordSearch{
        margin: 0px;
    }
    
    .BlockDetails{
        margin-bottom: 2em;
    }
    
    a[href*="NoLink"]{
    /* 
    disables pointer events on no link menu items 
    Jan 18 2022
    MPK
    */
        pointer-events: none;
    }
    
    /*.EventRegAttendTitleSER td b {
        display: none;
    }*/
    
    .DCSMPrjRptSavedDataTable .Col-Campaign,
    .Col-LockProcess,
    .Col-LockDate,
    .Col-LockBy {
        display: none;
    }
    
    #MyOutputs .table-responsive {
        max-height: 50vh;
        overflow-y: auto;
    }
    
    /* File chooser background */
    .Section-Survey .FileChooser-wrap {
        background: white;
        padding: 4px 1em;
        border-radius: 0.375rem;
        border: var(--bs-border-color) 1px solid;
        margin-top: 1ch;
    }
    
    /* MEDIA QUERIES */
    @media (max-width: 1200px){
        /*table[id="MENU_BOTTOM_ROLE CHANGE"] a{
            display: none;
        }*/
        #footer, #header-menu, #main-banner, #header-utility {
            padding-right: 20px;
        }
        #header-menu{
            min-height: 100px;
        }
        .loggedInName{
            position: absolute;
            right: 20px;
        }
    
        .Portlet-Separator{
            width: 1ch;
        }
         nav.PledgeConfirmationButtons ol{
             flex-direction: column;
         }
        .Section-PledgeConfirm .PledgeNavigation{
            height: auto !important;
        }
    
        .specificEntrySection > div, .PortletSurvey, .Section-Survey{
            padding: 2em 1em !important;
            border-radius: 50px;
        }
        .BlockDetails .row:nth-child(3), #FederationsSection div.Row-Even {
            border-top: 1px solid #ddd;
        }
        .Page-IPledgeDes1 .Row-Header{
            display: none;
        }
        .Page-IPledgeDes1 .TargetedAgencies label *, .Col-Info {
            display: none !important;
        }
        .ServiceCategories .Row-Header div.col-sm-1{
            display: none;
        }
    
        #secondary-menu {
            display: none;
        }
        
        .uwmc-logo > i{
            display: block;
        }
        #hamMenu{
            z-index:11;
        }
        p {
            word-break: break-word;
        }
        div.WriteInFields .my-3 {
            flex-direction: column;
        }
        div.WriteInFields > .gx-1 {
            flex-direction: row;
        }
        div.writein-address div.gx-1,
        .AddressSection .AddressMain .gx-1 {
            flex-direction: column;
        }
        .AddressSection .AddressMain .gx-1 .col-3{
            width: 100%;
        }
        nav#secondary-menu .Area-UnitedWeFight-P-secondary-menu ul.pureCssMenu {
            flex-direction: column;
            background-color: VAR(--LIGHTGRAY) !important;
            z-index: 10;
            right: 0px;
            top: 60px;
            min-width: 15em;
        }
        .BlockDetails .IPledgeTable .row {
            flex-direction: column;
        }
        #AskDesSection{
            flex-direction: row;
        }
        #AskDesSection > label {
            flex: 1 1 66%;
        }
        #AskDesSection > div {
            flex: 1 1 33%;
        }
        .ecomm-bottom-menu{
            padding-top: 65px;
        }
        .CampaignStatus tbody {
            display: flex;
            flex-direction: row;
        }
        .CampaignStatus tr.Report-Header,
        .CampaignStatus tr.Row-Odd {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .CampaignStatus tr td,
        .CampaignStatus tr th {
            outline: VAR(--MIDGRAY) 1px solid;
            border-collapse: collapse;
            height: 5ch;
            box-sizing: content-box;
        }
        .Area-UnitedWeFight-P-top-menu {
            flex-direction: column-reverse;
        }
        .Area-UnitedWeFight-P-top-menu div{
            width: 6em;
        }
        table[id="MENU_BOTTOM_ROLE CHANGE"] tbody tr{
            display: flex;
            width: 20em;
            flex-direction: column;
            background: VAR(--LIGHTGRAY);
            z-index: 5;
            position: relative;
        }
        #roleHead{
            display: flex;
            flex-direction: row;
            align-items: center;
            padding-left: 0px;
            width: 25em;
        }
        #roleHead #currentRole{
            padding: 0ch 1ch;
        }
        #roleHead:after{
            content: '\e5cf';
            font-family: 'Material Icons';
        }
        #roleHead.uncollapsed:after{
            content: '\e5ce';
            font-family: 'Material Icons';
        }
        table[id="MENU_BOTTOM_ROLE CHANGE"] tbody tr td{
            display: none;
        }
        .Area-UnitedWeFight-P-top-menu .ecomm-bottom-menu {
            position: absolute;
            top: 60px;
        }
        
        .Area-UnitedWeFight-P-secondary-menu .pureCssMenu li ul.pureCssMenum {
            padding: 0px !important;
            margin-bottom: 1em;
        }
    
        .Area-UnitedWeFight-P-secondary-menu .pureCssMenu li a.pureCssMenui span:after {
            content: '\e5cf';
            font-family: 'Material Icons';
        }
    
        ul.pureCssMenu li:hover>ul, ul.pureCssMenu li:active>ul {
            /* not sure how to collapse submenu without JS, attempted to use active.*/
            display: block;
            position: relative;
        }
    
        nav.NavigationButtons ol{
            flex-direction: column-reverse;
            
        }
        li.WhiteButtons,
        li.DefaultButtons{
            flex: 0 1 1em;
        }
        .wave-wrap{
            display:none;
        }
    
        /* EVENT REG MOBILE */
        #iAttendSection .Section-EventRegistration .BlockDetails{
            display: flex;
            padding-bottom: 
        }
        #iAttendSection .Section-EventRegistration .BlockDetails > div {
            margin: 0px;
        }
        #iAttendSection .Section-EventRegistration .BlockDetails div.row{
            flex-direction: column;
        }
        #iAttendSection .Section-EventRegistration .BlockDetails .FeesHead .col-sm-2,
        #iAttendSection .Section-EventRegistration .BlockDetails .FeesHead .col-sm-3,
        #iAttendSection .Section-EventRegistration .BlockDetails .FeesBody .col-sm-2,
        #iAttendSection .Section-EventRegistration .BlockDetails .FeesBody .col-sm-3{
            flex: 1 1 80px !important;
            max-width: 100% !important;
            width: auto !important;
        }
        #iAttendSection .Section-EventRegistration .BlockDetails *{
            text-align: left;
        }
        #iAttendSection .Section-EventRegistration .BlockDetails #TotalLine {
            display: none;
        }
    
        
    }
    
    @media (max-width: 600px){
        .Role-Admin .Page-Documents .page-header:after{
            content: 'Page designed to be viewed on desktop, increase window width';
            color: red;
            font-style: oblique;
        }
    }
    
    @media (min-width: 992px) {
        .col-lg-8, .col-lg-9 {
        
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
            max-width: 100%;
        }
    
    }
    
    @media only screen and (max-width: 860px) {
        .MobileTable td, .CampStatus td, .CampHistory td, .QuickSumTable td, .RecentTranTable td, .AHistTranTable td, .MyOutputs td {
            padding-left: inherit !important;
        }
    }
    
    @media (max-width: 768px) {
    td.Col-Text {
       word-break: inherit;
       hyphens: auto;
    }