body
{
    overflow-x: hidden;
}
.publicResponsiveBlocks
{
    width:100%;
    margin: 0 auto;
    display: block;
}
.publicResponsiveBlock
{
    display: inline-block;
    zoom: 1;
    border: 1px solid #00528d;
    border-radius: 5px;
    padding: 1px;
    padding-left: 5px;
    padding-right: 5px;
    vertical-align: top;
    margin: 5px;
    text-align: left;
    width: 45%;
}


/* registration blocks */

#LMSCQuestionsContainer
{
    display: block;
    zoom: 1;
    border: 1px solid #00528d;
    border-radius: 5px;
    padding: 15px;
    vertical-align: top;
    margin: 5px 0;
    text-align: left;
    width: 98%;
}
.publicResponsiveBlock90pct
{
    display: block;
    zoom: 1;
    border: 1px solid #00528d;
    border-radius: 5px;
    padding: 1px;
    padding-left: 5px;
    padding-right: 5px;
    vertical-align: top;
    margin: 15px auto 5px auto;
    text-align: left;
    width: 95%;
}
#MemberInformationReviewContainer .mailingaddress
{
    width:90%;
}
#MemberInformationReviewContainer textarea[name="NoteText"]
{
    width: 99%;
    height: 110px;
    margin: 0 auto;
    display: block;
}
#MemberInformationReviewContainer .edit_link
{
    position: relative !important;
    right: auto !important;
    float:right;
    text-decoration: underline;
}
/*#sslTable
{
    width: 100%;
}*/
#masterResponsive
{
    display: block;
    position: relative;
    width: calc(100% + 29px);
    z-index: 9999;
    margin-left:-14px;
}
#masterResponsive ul, #masterResponsive li
{
    list-style:none;
    margin:0;
    padding:0;
    z-index: 9999;
}

#masterResponsive h1
{
    font-size:100%;
    font-weight:normal;
}
#masterResponsive > ul
{
    background-color:#CA292D;
    /*border-top: 1px solid #B02427;
    border-bottom: 1px solid #B02427;*/
    position:relative;
    z-index: 9999;
}
#masterResponsive ul li{display:block;float:left;}
#masterResponsive > ul > li
{
    padding: 8px 0;
    font-weight:bold;
    position:relative;
    z-index: 9999;
}
#masterResponsive > ul > li:hover
{
    background-color: #B02427;
    text-decoration: none !important;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    -moz-border-top-left-radius: 6px;
    -moz-border-top-right-radius: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    position: relative;
    top: -5px;
    padding-bottom: 3px;
    padding-top: 13px;
}

#masterResponsive > ul > li:hover, #masterResponsive > ul > li a:hover
{
    cursor: default;
}
#masterResponsive > ul > li > a,#masterResponsive > ul > li > h1 > a
{
    border-left: 1px solid #B02427;
    text-decoration:none !important;
    font-weight:bold;
    padding:0 15px;
    color:#ffffff !important;
}
#masterResponsive > ul > li > a:hover,#masterResponsive > ul > li > h1 > a:hover
{
    text-decoration:underline;
}
#masterResponsive > ul > li:hover > a,#masterResponsive > ul#header-navigation-main > li:hover + li > a /*,#masterResponsive li.active-nav a,#masterResponsive li.active-nav + li > a*/
{
    border-left:1px solid transparent;
    text-decoration:none;
    font-weight:bold;
}
#masterResponsive > ul > li:hover > a:hover,#masterResponsive > ul#header-navigation-main > li:hover + li > a:hover,#masterResponsive li.active-nav a:hover,#masterResponsive li.active-nav + li > a:hover{text-decoration:underline;}
#masterResponsive > ul > li:first-child > a,#masterResponsive > ul > li:first-child > h1 > a{border:0;text-decoration:none;font-weight:bold;}
#masterResponsive li.last.show-sub .subnav,#masterResponsive li.last:hover .subnav{left:-90px;}
#masterResponsive li .subnav
{
    position:absolute;
    top:32px;
    left:-999999px;
    background-color: #B02427;
    z-index:9999999;
    width:198px;
    padding-top:8px;
    font-weight:bold;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    -moz-border-top-right-radius: 6px;
    -moz-border-bottom-right-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    z-index: 9999;
}
#masterResponsive li:hover .subnav,#masterResponsive li.show-sub .subnav
{
    left:0;
}
#masterResponsive li.two-col ul
{
    width:440px;
}
#masterResponsive li.active-nav,#masterResponsive li.active-nav:hover
{
    background-color:#d2dcdd;
}
#masterResponsive li.active-nav a{color:rgb(0, 51, 102)  !important;cursor:default;text-decoration:none;font-weight:bold;}
#masterResponsive li .subnav li
{
    margin:0 4px 1px;
    width:190px;
    /*border-bottom:1px solid #ebf7ff;*/
    font-weight:bold;
}
#masterResponsive li.two-col li { width: 212px; }
#masterResponsive li .subnav li a, #masterResponsive li .subnav li .sub_header
{
    font-size: 85%;
    display:block;
    padding:5px 10px;
    margin-bottom:1px;
    color: #FFF !important;
    text-decoration:none;
    font-weight:bold;
    z-index: 9999;
}
#masterResponsive li .subnav li .sub_header
{
    font-weight: bold;
    color: #FFF !important;
    font-size: 13px;
    text-decoration: underline;
    z-index: 9999;
}
#masterResponsive li .subnav li a.active{color:rgb(0, 51, 102)  !important;}
#masterResponsive li .subnav li a:hover
{
    background-color: #FFF;
    text-decoration: none !important;
    color: #B02427 !important;
    cursor: pointer;
}
#masterResponsive > ul.subnav{overflow:hidden;background-color:#d2dcdd;margin-top:1px;}
#masterResponsive > ul.subnav li{padding:5px 0 7px;font-weight:bold;}
#masterResponsive > ul.subnav li h2{font-size:100%;}
#masterResponsive > ul.subnav li a,#masterResponsive > ul.subnav li h2 a{color:rgb(0, 51, 102)  !important;padding:0 10px;border-left:1px solid #99b3b6;font-size:100%;text-decoration:none;font-weight:bold;}
#masterResponsive > ul.subnav li.first a{border-left:0;text-decoration:none;font-weight:bold;}
#masterResponsive > ul.subnav li a.active{font-weight:bold;}
#masterResponsive > ul.subnav li:hover{background:none;}
#masterResponsive > ul.subnav li a:hover{text-decoration:underline;cursor:pointer;}

#masterResponsive .empty
{
    border: none !important;
}
#masterResponsive .border_top
{
    border-top:1px solid #ebf7ff;
}
#masterResponsive .border_bottom
{
    border-bottom:1px solid #ebf7ff;
}
#masterResponsive .border_top a
{
    padding-top: 4px !important;
}
#masterResponsive .border_bottom a
{
    padding-bottom: 4px !important;
}

#masterResponsive .social_media_buttons
{
    padding: 0 !important;
    font-weight: normal;
    text-align: right;
    position: relative;
    top: 2px !important;
    float: right;
    left: -10px;
    padding-bottom: 10px !important;
}
#masterResponsive .social_media_buttons a
{
    cursor: pointer !important;
}

#masterResponsive #nav-facebook, #masterResponsive #nav-twitter, #masterResponsive #nav-youtube, #masterResponsive #nav-rss
{
    background: url(/graphics/layout/social_buttons/SocialSprite-24x26.png) no-repeat;
}

#masterResponsive #nav-facebook
{
    background-position: -5px -32px;
}
#masterResponsive #nav-facebook:hover
{
    background-position: -5px -125px;
}
#masterResponsive #nav-twitter
{
    background-position: -5px -63px;
}
#masterResponsive #nav-twitter:hover
{
    background-position: -5px -94px;
}
#masterResponsive #nav-youtube
{
    background-position: -5px -187px;
}
#masterResponsive #nav-youtube:hover
{
    background-position: -5px -156px;
}
#masterResponsive #nav-rss
{
    background-position: -5px -0px;
}
#masterResponsive #nav-rss:hover
{
    background-position: -5px -218px;
}

#masterResponsive .social_media_buttons span
{
    width: 24px;
    display: inline-block;
    height: 26px;

    /*Inline-block fix for IE7*/
    zoom:1;
    *display: inline;
    _height: 100%;
}

#masterResponsive .social_media_buttons:hover
{
    background: none !important;
    text-decoration: none !important;
    font-weight: normal;
    border: none !important;
    padding: 0 ;
    margin: 0;
    text-align: right;
    float: right;
}

#masterResponsive .social_media_buttons a
{
    border: none;
    font-weight: normal;
    padding: 0;
    border: none !important;
    margin: 0;
    margin-left: 5px;
}
.containerResponsive
{
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    padding: 0px 0px;
    /*width:80%;*/
    max-width: 1200px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    background-color: #FFF;
    overflow-x: hidden !important;
}
#main_body_responsive
{
    overflow: visible;
    width: 100%;
    max-width: 1200px;
    margin-bottom: 5px;
    background-color: #FFF;
    padding-top: 10px;
    padding-bottom: 15px;
}
#in_this_section input[type="checkbox"],#related_links input[type="checkbox"]
{
    display: none;
}
#in_this_section .open_parent, #in_this_section .open_parent:hover
{
    background: transparent !important;
}
#in_this_section span:hover
{
    color:#085899 !important;
}
/* stylize flogs */
form[name="flogform"]
{
    width:80%;
    margin:0 auto;
}
form[name="flogform"] input[type="submit"]
{
    margin-top: 10px;
}
table.flogActivityTable, table.flogActivityTable td, table.flogActivityTable th
{
    border: 2px solid #000;
}
table.flogActivityTable
{
    border-collapse: collapse;
}
table.flogActivityTable td, table.flogActivityTable th
{
    padding: 5px;
}
/* Stylize Flog Preferance Page */
.flogFormRow
{
    width:100%;
    clear: both;
}
.flogLabel
{
    text-align: left;
    width:100%;
    padding:5px 0 5px 0;
}
.checkBoxLeft
{
    float: left;
    width:10%;
    text-align: center;
}
.flogLabelRight
{
    float: left;
    width:90%;
}
.flogSubmit
{
    margin-top: 20px;
}

#membership_banner_video
{
    width:370px;
    height:206px;
}
.flogWOContainer, .flogMeasurementContainer, .flogNewType, .newFlogTypeContainer
{
    float: left;
}
.flogMeasurementContainer, .flogNewType:nth-child(2)
{
    margin-left:15px;
}
.newFlogTypeContainer
{
    clear: both;
    margin-top:15px;
}
.flogNewType
{
    width:172px;
    white-space:nowrap;
}
.flogRadioButtons
{
    min-height: 100px;
}
.iframe-wrapper iframe
{
    display: block;
    margin:0 auto;
}
@media screen and (min-width:1036px)
{
    #ClubAndWOGroupsContainer
    {
        width:710px;
    }
    .priceBlock
    {
        margin-top:-150px;
    }
    .memberIdentification,.mailingAddress
    {
        width:28%;
    }
    .contactDetals,.persInfoContinue
    {
        width:36%;
    }
    .swimmingRoles,.moreAboutYou
    {
        width:28%;
    }

}
@media screen and (max-width:1035px)
{
    #masterResponsive
    {
        display:none;
    }
    #mobile-nav
    {
        display: block !important;
    }
    #header-main
    {
        display: none;
    }
    .reg_progress
    {
        display:none;
    }
   #SoftDuplicatesContainer table tr
    {
        float:left;
        /*display: inline-block;
        clear: none;
        width:50%;*/
    }
    #SoftDuplicatesContainer table th{
        display:flex;


    }
    #SoftDuplicatesContainer table td{
        display:flex;

    }
    #SoftDuplicatesContainer table input.box_submit_green
    {
        width:90% !important;
    }
    #LMSCMap img
    {
        width: 100% !important;
        height: auto !important;
    }
    #MemberInformationReviewContainer .publicWidgetInlineBlock
    {
        width:50% !important;
    }
    #MemberInformationReviewContainer .col2
    {
        width:43% !important;
    }
    #MemberInformationReviewContainer .col2 .publicResponsiveBlock,#MemberInformationReviewContainer .col2 .publicWidgetInlineBlock
    {
        width:100% !important;
    }
    #MemberInformationReviewContainer .LMSCquestions
    {
        float: left;
        width:50%;
    }
    .nav__list label > span
    {
        margin-right:35%;
    }
    #header-topstripe
    {
        height:auto;
        padding-bottom:26px;
    }
    /* fix address verification in mobile */
    .fancybox-inner
    {
        width:auto !important;
        height:auto !important;
    }
    #VerifyAddressFancybox > div
    {
        width:auto !important;
    }
    #LMSCMap img, #usmsmap
    {
        visibility: hidden;
    }
    #LMSCMap
    {
        background: url('/graphics/lmscmap-700.png');
        background-size: 100%;
    }
    #main_body_responsive #bodydiv
    {
        background: none;
    }
    /*Make center column 100% for responsive */
    #centercolumn
    {
        padding-left: 10px;
        clear: both;
    }
    /* Get rid of ads in responsive view */
    #leftcolumn .encouraging_more_adults_to_swim, #leftcolumn .join_renew, #leftcolumn .sponsor
    {
        display: none;
    }
    /* hide In This Section ul and add margin to the bottom */
    #in_this_section{
        display: block;
        position: relative;
        z-index: 2;
        -webkit-user-select: none;
        user-select: none;
    }
   #related_links {
        display: block;
        position: relative;
        z-index: 1;
        -webkit-user-select: none;
        user-select: none;
    }
    #in_this_section > span:nth-child(3),#related_links > span:nth-child(3)
    {
        background: #ffffff;
        margin-top: -35px;
        left:15px;
        border-radius: 0;
        transform: rotate(-50deg);
        -webkit-transform: rotate(-50deg);
        -moz-transform: rotate(-50deg);
    }
    #in_this_section > span:nth-child(4), #related_links > span:nth-child(4)
    {
        background: #ffffff;
        margin-top: -25px;
        border-radius: 0;
        transform: rotate(-310deg);
        -webkit-transform: rotate(-310deg);
        -moz-transform: rotate(-310deg);
        left:-6px;
    }
    #in_this_section .content ul li:hover,  #in_this_section .content ul li a:hover, #in_this_section li:hover a, li:hover a,
    #in_this_section li > ul > li:hover a, #related_links .content ul li:hover,  #related_links .content ul li a:hover, #related_links li:hover a, li:hover a,
    #related_links li > ul > li:hover a
    {
        background-color:transparent !important;
        color: rgba(0, 50, 105, 0.64) !important;
    }
    #in_this_section .title, #related_links .title
    {
        margin-bottom:10px;
        text-indent: 25px;
    }

    #in_this_section input, #related_links input {
        display: block !important;
        width: 100%;
        height: 28px;
        position: absolute;
        top: 0;
        left: 0;
        cursor: pointer;
        opacity: 0; /* hide this */
        -moz-opacity: 0;
        -khtml-opacity: 0;
        z-index: 999; /* and place it over the hamburger */
    }

    /*
     * Start drawing down down arrow
     */

    #in_this_section span, #related_links span {
        display: block;
        width: 15px;
        height: 3px;
        margin-bottom: 5px;
        position: absolute;
        border-radius: 3px;
        z-index: 1;
        transform-origin: 14px 10px;
        -webkit-transform-origin: 14px 10px;
        -moz-transform-origin: 14px 10px;
        transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  opacity 0.55s ease;
        -webkit-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  opacity 0.55s ease;
        -moz-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),  opacity 0.55s ease;
        background: #fff;
    }

    #in_this_section span:first-child, #related_links span:first-child { transform-origin: 0% 0%; }

    #in_this_section span:nth-last-child(1), #related_links span:nth-last-child(1) { transform-origin: 0% 100%; }

    /*
     * Transform all the slices of hamburger
     * into a down arrow.
     */

    #in_this_section input:checked ~ span, #related_links input:checked ~ span{
        opacity: 1;
        -moz-opacity: 1;
        -khtml-opacity: 1;
        transform: rotate(45deg) translate(-2px, -1px);
        -webkit-transform: rotate(45deg) translate(-2px, -1px);
        -moz-transform: rotate(45deg) translate(-2px, -1px);
        background: #232323;
    }

    /*
     Get rid of third span
     */

    #in_this_section input:checked ~ span:nth-last-child(3), #related_links input:checked ~ span:nth-last-child(3){
        opacity: 1;
        -moz-opacity: 1;
        -khtml-opacity: 1;
        transform: rotate(45deg) translate(-7px, 11px);
        -webkit-transform: rotate(45deg) translate(-7px, 11px);
        -moz-transform: rotate(45deg) translate(-7px, 11px);
        background: #232323;
        border-radius: 3px;
        width:35px;
        height:4px;
        left:0;
    }

    /*
     * Cahnge spans that are not in the title back to normal
     */
    #in_this_section .content span, #related_links .content span
    {
        width:100%;
        height:auto;
    }

    #in_this_section input:checked ~ span:nth-last-child(2), #related_links input:checked ~ span:nth-last-child(2) {
        opacity: 1;
        -moz-opacity: 1;
        -khtml-opacity: 1;
        transform: rotate(-45deg) translate(-1px, -1px);
        -webkit-transform: rotate(-45deg) translate(-1px, -1px);
        -moz-transform: rotate(-45deg) translate(-1px, -1px);
        border-radius: 3px;
        height:4px;
        width:35px;
    }

    /*
     * Push menu off of the left side of page
     */
    #in_this_section ul.subnav_parent, #related_links ul.subnav_parent
    {
        position: relative;
        margin-left: 15px !important;
    }
    #in_this_section span.parent, #in_this_section .content span,
    #related_links span.parent, #related_links .content span
    {
        position: relative;
    }
    #in_this_section ul.subnav_parent > li,
    #related_links ul.subnav_parent > li
    {
        margin-top:15px;
    }
    #in_this_section .parent .parent_arrow_img, #related_links .parent .parent_arrow_img
    {
        float: none !important;
        top:0;
    }
    #in_this_section span, #related_links span
    {
        border-radius: 0;
    }

    .content ul {
        position: absolute;
        width: 500%;
        margin: -100px 0 0 -50px;
        padding: 50px;
        padding-top: 125px;
        background: #ffffff none;
        list-style-type: none;

        transform-origin: 0% 0%;
        transform: translate(-110%, 0);
        transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);

        -webkit-transform-origin: 0% 0%;
        -webkit-transform: translate(-110%, 0);
        -webkit-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);

        -moz-transform-origin: 0% 0%;
        -moz-transform: translate(-110%, 0);
        -moz-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);

    }

    .content ul li {
        padding: 10px 0 10px 20px !important;
        background: none !important;
        position: relative;
        z-index: 1;
        margin-left:30px;
    }

    /*
     * And let's fade it in from the left
     */

    #in_this_section input:checked ~ .content ul, #related_links input:checked ~ .content ul {
        transform: scale(1.0, 1.0);
        -webkit-transform: scale(1.0, 1.0);
        -moz-transform: scale(1.0, 1.0);
        /*transform: translate(-2%, 0);*/

        opacity: 1;
        -khtml-opacity: 1;
        -moz-opacity: 1;
        margin-left:-30px;
    }
    .content ul:not(.subnav_parent)
    {
        margin-top:-40px !important;
        padding-top: 60px !important;
    }
    #membership_banner_text, #membership_banner_video
    {
        width:50% !important;
        height:245px;
    }
    #in_this_section li > ul > li a
    {
        font-size: inherit;
    }
    .benefits_col
    {
        width:30% !important;
        background-size: cover;
        margin: 0 1% 0 1%;
        height:705px !important;
    }
    .benefits_col ul
    {
        padding-left:29px;
        padding-right:5px;
    }
    .join_table
    {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .insurance_col
    {
        margin-top:10px;
        display: block;
        clear: both;
    }
    .benefits_video
    {
        width:50% !important;
        margin-bottom: 15px;
    }
    .benefits_video_holder
    {
        width:50% !important;
        margin-bottom: 15px;
    }
    .benefits_video_holder iframe
    {
        width:100% !important;

    }

}
@media screen and (max-width: 920px)
{
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 43%;
    }
    /* hide third tds for responsive layout */
    .loginwidget form td:nth-child(3)
    {
        display: none;
    }
    #membership_banner_text, #membership_banner_video
    {
        height:215px;
    }
    img[alt="Improve Your Tri Swim"]
    {
        width: 90%;
        height:auto;
    }
    .iframecontainer {
        height: 100%;
        text-align: center;
        padding: 1em;
        box-sizing: border-box;
    }
    .iframe-wrapper {
        position: relative;
        height: 0;
        padding-top: 56.25%;
        overflow: hidden;
    }

    .iframe-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        margin: 0 auto;
    }
    #SanctionRequests, .wysiwygTable, #gview_PublicLMSCMembersGrid, #gview_PublicClubMembersGrid
    {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        width:auto !important;
        /*width: 525px;*/
    }
    #gview_PublicLMSCMembersGrid, #gview_PublicClubMembersGrid
    {
        width:300px !important;
    }
    #singlecolumn
    {
        overflow-x: hidden;
    }
    #SanctionRequests .ui-tabs-nav{
       width:925px;
    }
    #SanctionRequests .SanctionRequest div, #SanctionRequests .headlines div
    {
        overflow: auto;
        white-space: initial;
    }
    /* #main_body_responsive
     {
         overflow-x: hidden;
     }
     #SanctionRequests .headlines
     {
         white-space: pre-wrap;
         line-height:15px
     }
     #SanctionRequests{
         display: block;
         overflow-x: auto;
         white-space: nowrap;
     }
     #SanctionRequests .event_title
     {
         white-space: pre-wrap;
     } */
    #gview_NewOnlineRegGrid, table#PublicClubMembersGrid{
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        width: auto !important;
    }
    #MemberSearchResultsContainer {
        display: block;
        width: auto !important;
    }
    #gview_NewOnlineRegGrid
    {
       width:370px !important;
    }
    #NewOnlineRegGrid
    {
        width:100% !important;
    }
    .toptenind table tr, table.toptenlist tr, table#PublicClubMembersGrid tr,
    table.ui-jqgrid-htable tr, table.gtdTables, table.gtdTables tr, table.gtdTablesGoals,
    table.gtdTablesGoals tr, table.gtdTablesClubs, table.gtdTablesClubs tr{
        display: inherit !important;
    }
    table.gtdTablesGoals tr td{
        width:20%;
    }
    table.gtdTablesClubs tr td{
        width:33%;
    }
    #sanctionRequestReview .ui-accordion-content{
        overflow: visible;
    }
    #sanctionRequestReview table, table#PublicClubMembersGrid{
        flex:none;
    }
    #mobileSanctionReview
    {
        display: block;
        overflow-x: auto;
        /*white-space: nowrap;*/
        width: auto !important;
    }
    #pg_PublicLMSCMembersGrid_toppager table td, #pg_PublicClubMembersGrid_toppager table td
    {
        flex: none !important;
    }
    #gbox_PublicLMSCMembersGrid .ui-jqgrid-toppager,#gview_PublicClubMembersGrid .ui-jqgrid-toppager
    {
        height:auto !important;
    }
    #view-members-grid select, #MemberSearchTable input, #MemberSearchTable select, table#MemberSearchTable,
    table.gtdTablesClubs select
    {
        width: 100%;
    }

}
@media screen and (max-width: 900px)
{
        .benefits_col, .benefits_col td
        {
            background: none !important;
            height:auto !important;
        }
    .benefits_col
    {
        box-shadow: #cccccc 0px 0px 3px inset;
        min-height: 395px;
    }

}
@media screen and (max-width: 849px)
{
    .publicResponsiveBlock
    {
        width:90%;
        display: block;
        margin:0 auto 15px auto;
    }
    #LMSCQuestionsContainer
    {
        width:90%;
        display: block;
        margin:0 auto 15px auto;
    }
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 43%;
    }

    #header-main
    {
        display: none;
    }
    #header-logo
    {
        width: 50%;
    }
    #header-logo img
    {
        width:100%;
        height: auto;
    }
    #LMSCMap img
    {
        width: 100% !important;
        height: auto !important;
    }
    #MemberInformationReviewContainer .col2
    {
        width:100% !important;
        margin:0 auto;
    }
    #MemberInformationReviewContainer .LMSCquestions, #MemberInformationReviewContainer .col2 .publicResponsiveBlock,
    #MemberInformationReviewContainer .col2 .publicWidgetInlineBlock,#MemberInformationReviewContainer .publicWidgetInlineBlock,
    #MemberInformationReviewContainer .publicResponsiveBlock, .publicWidgetInlineBlock
    {
        width: 95% !important;
        display: block;
        margin:15px auto 0 auto;
        float:none !important;
    }
    #FeesReviewContainer .publicWidgetInlineBlock
    {
        width:95% !important;
    }
    .col_40, .col_60
    {
        width:100%;
    }

}
@media screen and (max-width: 820px)
{
    #membership_banner_text, #membership_banner_video
    {
        height: 205px;
    }
}
@media screen and (max-width: 800px)
{
    #membership_banner_text, #membership_banner_video
    {
        height: 195px;
    }
    .benefits_col
    {
        width: 31% !important;
    }

}
@media screen and (max-width: 770px)
{
    .benefits_col
    {
        width: 30% !important;
    }

}
@media screen and (max-width: 740px)
{
    #membership_banner_text, #membership_banner_video
    {
        height: 180px;
    }
    .benefits_col
    {
        width: 28% !important;
    }
    #MemberSearchFormContainer input[type=text]:not(#SwimmerIDInput),
    #MemberSearchFormContainer select
    {
        /*width: 175px;*/
        width: 100%;
    }

}
@media screen and (max-width: 677px)
{
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 42%;
    }
    .nav__list label > span
    {
        margin-right:30%;
    }
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 305px;
        background-size: cover;
    }
    .join_left_col
    {
        width:100% !important;
    }
    .join_right_col
    {
        width:0% !important;
    }
    .join_table
    {
        background: url('/graphics/join_or_renew_all_blue.png') left center !important;
    }
    .benefits_col
    {
        width: 48% !important;
    }

}

@media screen and (max-width: 645px)
{
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 40%;
    }
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 295px;
        background-size: cover;
    }
    .contentbar
    {
        clear: both;
    }
    .sub-navigation-container > ul li{
        background-color:#58C25A;
    }

}
    @media screen and (max-width: 600px)
    {
      .benefits_col
      {
          width: 46% !important;
      }
    .benefits_col td
    {
        padding-left: 2px;
        padding-bottom: 2px;
    }

    }
@media screen and (max-width: 580px)
{
    #VanityIDCheckResults
    {
        width: auto !important;
    }
    td.monthday, td.nomonthday, td.saturday, td.selectedday, td.sunday
    {
        height:60px;
    }
    .loginwidget form input[type="text"],.loginwidget form input[type="hidden"], .loginwidget form input[type="password"]
    {
        width:98%;
    }
    form[name="flogform"]
    {
        width:100%;
        margin:0 auto;
    }

    .checkBoxLeft
    {
        float: left;
        width:20%;
        text-align: center;
    }
    .flogLabelRight
    {
        float: left;
        width:80%;
    }
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 275px;
        background-size: cover;
    }
    .benefits_video
    {
        width:100% !important;
    }
    .benefits_video_holder
    {
        width:100% !important;
        margin-top:4% !important;
        margin-bottom: 4% !important;
    }
}
@media screen and (max-width: 540px)
{
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 255px;
        background-size: cover;
    }
}
@media screen and (max-width: 510px)
{
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 235px;
        background-size: cover;
    }
    .benefits_col
    {
        width:97% !important;
        margin: 0 2% 5% 2%;
        display: block;
        min-height:auto !important;
        height:auto !important;
    }
}
@media screen and (max-width: 470px)
{
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 215px;
        background-size: cover;
    }
}
@media screen and (max-width: 450px)
{
    .flogRadioButtons
    {
        min-height: inherit !important;
    }
    .flogMeasurementContainer, .newFlogTypeContainer, .flogNewType:nth-child(2)
    {
        margin:15px 0 0 0 !important;
    }
    .flogWOContainer, .flogMeasurementContainer, .flogNewType
    {
        width:100%;
    }
    .benefits_col
    {
        width:97% !important;
        margin: 0 2% 10% 2%;
        display: block;
    }
    .content_presented_by
    {
        display: block;
        clear: both;
        width:100%;
        position: relative;
        text-align: right;
        margin-top: 20px;
    }
    .content_preseted_by_text
    {
        display: block;
        margin-top: 20px;
    }
    .join_left_col
    {
        width: 100% !important;
    }
    .join_right_col
    {
        width:0% !important;
    }

}
@media screen and (max-width: 430px)
{
    #membership_banner_text, #membership_banner_video
    {
        width:100% !important;
        height: 195px;
        background-size: cover;
    }
}
@media screen and (max-width: 395px)
{
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 38%;
    }
    #SoftDuplicatesContainer table input.box_submit
    {
        width:90% !important;
    }
    .optionalText
    {
        display: none;
    }
    td.monthday, td.nomonthday, td.saturday, td.selectedday, td.sunday
    {
        height:60px;
    }
    .loginwidget form input[type="text"], .loginwidget form input[type="hidden"], .loginwidget form input[type="password"]
    {
        width:98%;
    }
    .loginwidget form input#bdate
    {
        width:80px;
    }
    .loginwidget form .dateformat
    {
        display: none;
    }
    /*hide the third td */
    .loginwidget form td:nth-child(3)
    {
        display: none;
    }
    .loginwidget input[name="loginGender"], .loginwidget form label[for="Gender_F"], .loginwidget form label[for="Gender_M"]
    {
        padding:0;
        margin:0;
    }
    .myusms form td{
        padding-left:0;
    }
    /*form[name="flogform"] #entrytype td:nth-child(3)
    {
        display: inline-block;
    } */
    form[name="flogform"] #entrytype td
    {
        display: block;
    }
    form[name="flogform"] #entrytype td:empty
    {
        display: none;
    }
    form[name="flogform"] table#entrytype
    {
        empty-cells: hide !important;

    }
    #membership_banner_text
    {
        height:auto;
        width:100% !important;
        background-size: cover;
    }
    #membership_banner_video
    {
        width:100% !important;
        height: 175px;

    }
    a.register
    {
        margin-bottom: 25px !important;
    }

}
@media screen and (max-width: 360px)
{
    #membership_banner_text
    {
        height:auto;
        width:100% !important;
        background-size: cover;
    }
    #membership_banner_video
    {
        width:100% !important;
        height: 160px;
    }
}
@media screen and (max-width: 342px)
{
    .usms_seperator .left_seperator, .usms_seperator .right_seperator
    {
        width: 37%;
    }
    #membership_banner_text
    {
        height:auto;
        width:100% !important;
        background-size: cover;
    }
    #membership_banner_video
    {
        width:100% !important;
        height: 155px;
    }
    .content_presented_by
    {
        display: block;
        clear: both;
        width:100%;
        position: relative;
        text-align: right;
        margin-top: 20px;
    }
    .content_preseted_by_text
    {
        display: block;
        margin-top: 20px;
    }
    .benefits_video
    {
        width:100% !important;
    }

}
/* start mobile nave */
#mobile-nav
{
    margin: 0;
    padding:10px;
    background: #CA292D;
    color: #cdcdcd;
    font-family: "Avenir Next", "Avenir", sans-serif;
    clear: both;
    display: none;

}

#mobile-nav .option-heading
{
    background: none;
    padding-left: 0;
    font-weight: normal;
    margin: 0;
}

#mobile-nav .option-heading:hover
{
    /* color:tomato; */
}

/* hide arrow and heading style for child nav items */
#mobile-nav ul#menu li ul li .arrow-up, #mobile-nav ul#menu li ul li .arrow-down
{
    display: none !important;
}

/* remove ul style style type of dynamic mobile nav */
#mobile-nav ul#menu li ul li, #mobile-nav ul#menu li ul li
{
    list-style-type: none !important;
}

#mobile-nav li.empty
{
    display: none;
}

#mobile-nav .option-content
{

    background-color: #f3f1f1;
    background-color: #ffffff;
}
h3.ui-state-active
{
    border:0 !important;
    background: #7bbde9 !important;
}
#mobile-nav .option-content a
{
    display: block;
    clear: both;
    color: #00538d;
    width: 100%;
}

#mobile-nav .option-content span
{
    height: auto;
    background: none;
    color: #232323;
    width: 100%;
}

#mobile-nav .option-content u
{
    color: #00538d;
}

#mobile-nav a
{
    text-decoration: none;
    transition: color 0.3s ease;
    -webkit-transition: color 0.3s ease;
    -moz-transition: color 0.3s ease;
}

#menuToggle, #searchToggle
{
    display: block;
    position: relative;
    /* top: 50px; */
    left: 5%;
    z-index: 3;
    -webkit-user-select: none;
    user-select: none;
    width: 93%;
}

#menuToggle input
{
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    left: -5px;
    margin-top: -10px;
    cursor: pointer;
    opacity: 0; /* hide this */
    -moz-opacity: 0;
    -khtml-opacity: 0;
    z-index: 2; /* and place it over the hamburger */
    -webkit-touch-callout: none;
}
#mobile-nav input#header-search-input-responsive
{
    border:none;
}
#mobile-nav form#header-search-form
{

}
#header-items-container
 {
     display: inline-block;
     position: absolute;
     /* top: 0; */
     right: 0;
     margin-top:-25px;
    width: 75%;
    z-index:3;
 }
.header-items
{
    display: inline-block;
    float: left;
    width:20%;
}
.header-items-search
{
    display: inline-block;
    float: left;
    width:55%;
    padding-top: 5px;
}
#header-search-input-responsive
{
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    padding: 2px 3px;
    padding-right: 24px;
}
#mobile-nav input#header-search-input-responsive
{
    background: #fff url('/graphics/layout/HeaderSearchIcon.png') no-repeat 95% center;
    background-size: 18px 15px;
    width:80%;
}
/*
 * creating hamburger effect
 */
#menuToggle span
{
    display: block;
    width: 25px;
    height: 3px;
    margin-bottom: 4px;
    position: relative;
    background: #ffffff;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 4px 0px;
    -moz-transform-origin: 4px 0px;
    -webkit-transform-origin: 4px 0px;
    -webkit-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
    -moz-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
}

#menuToggle span:first-child
{
    transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;
    -moz-transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
    transform-origin: 0% 100%;
    -webkit-transform-origin: 0% 100%;
    -moz-transform-origin: 0% 100%;
}

#menuToggle span.sub_header
{
    display: block;
    width: 250px;
    height: 16px;
    margin-bottom: 0px;
    position: relative;
    background: #ffffff;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 4px 0px;
    -webkit-transform-origin: 4px 0px;
    -moz-transform-origin: 4px 0px;
    -webkit-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
    -moz-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
    opacity 0.55s ease;
}
/*
 * create slices of hamburger
 */
#menuToggle input:checked ~ span
{
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    transform: rotate(45deg) translate(-2px, -1px);
    -webkit-transform: rotate(45deg) translate(-2px, -1px);
    -moz-transform: rotate(45deg) translate(-2px, -1px);
    background: #232323;
}

/*
 * hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
    -webkit-transform: rotate(0deg) scale(0.2, 0.2);
    -moz-transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * change direction of last hamburger slice
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
    opacity: 1;
    -khtml-opacity: 1;
    -moz-opacity: 1;
    transform: rotate(-45deg) translate(0, -1px);
    -webkit-transform: rotate(-45deg) translate(0, -1px);
    -moz-transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make menu list absolute positioned
 * at the top left of the screen
 */
#menu
{
    position: absolute;
    width: 175%;
    margin: -35px 0 0 -155px;
    padding: 50px 0 50px 65px;
    padding-top: 125px;
    top: 0;
    background: #ffffff url('/graphics/layout/mobile/mobile_nav_bg.jpg') repeat-x left top;
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;
    -moz-transform-origin: 0% 0%;

    transform: translate(-170%, 0);
    -webkit-transform: translate(-170%, 0);
    -o-transform: translate(-170%, 0);
    -moz-transform: translate(-170%, 0);

    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
    -webkit-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
    -moz-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
}

#menu li
{
    padding: 10px 0 0 60px;

}
#menu li .subnav
{
    margin-left:0;
    padding-left:0;
}
/*
 * Make t fade in from the left
 */
#menuToggle input:checked ~ ul
{
    transform: scale(1.0, 1.0);
    -webkit-transform: scale(1.0, 1.0);
    -w0-transform: scale(1.0, 1.0);
    -moz-transform: scale(1.0, 1.0);
    opacity: 1;
    -khtml-opacity: 1;
    -moz-opacity: 1;
}

#menuToggle img
{
    cursor: pointer;
    /* height: 6vw; */
    height: 100%;
    top: 50%;
}
/* end mobile nav */

/* show hide mobile nav with css */
.nav__list ol, .nav__list ul, .nav__list li
{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}
nav
{
    display: block
}
/*ul.nav__list span.sub_header
{
    display: none !important;
}
*/
nav ol, nav ul
{
    list-style: none
}

nav a
{
    text-decoration: none;
}


/* Top level items */

nav a, nav label
{
    display: block;
    padding: .85rem;
    color: #0087e3;
    -webkit-transition: all .25s ease-in;
    transition: all .25s ease-in;
    -moz-transition: all .25s ease-in;
}

nav a:focus, nav a:hover, nav label:focus, nav label:hover
{
    color: rgba(0, 50, 105, 0.64);

}

nav label
{
    cursor: pointer;
}
/*first level lists items*/

.nav__list .group-list a, .nav__list .group-list label
{
    padding-left: 2rem;
}

.nav__list .group-list a:focus, .nav__list .group-list a:hover,
.nav__list .group-list label:focus, .nav__list .group-list label:hover,
ul.nav__list span.sub_header
{
    background: #cccccc;
}

/*Second level list items*/

.nav__list .sub-group-list a, .nav__list .sub-group-list label
{
    padding-left: 4rem;
    background: #353535;
    box-shadow: inset 0 -1px #474747;
}

.nav__list .sub-group-list a:focus, .nav__list .sub-group-list a:hover,
.nav__list .sub-group-list label:focus, .nav__list .sub-group-list label:hover
{
    background: #232323;
}

/*Styling list items past 2nd level if needed*/

.nav__list .sub-sub-group-list a, .sub-sub-group-list label
{
    padding-left: 6rem;
    background: #454545;
    box-shadow: inset 0 -1px #575757;
}

.nav__list .sub-sub-group-list a:focus, .nav__list .sub-sub-group-list a:hover,
.nav__list .sub-sub-group-list label:focus, .nav__list .sub-sub-group-list label:hover
{
    background: #333333;
}

/* Hide nested lists*/

.nav__list .group-list, .sub-group-list, .sub-sub-group-list
{
    height: 100%;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height .5s ease-in-out;
    transition: max-height .5s ease-in-out;
    -moz-transition: max-height .5s ease-in-out;
}

.nav__list input[type=checkbox]:checked + label + ul
{
    /* reset height when checkbox is checked */
    max-height: 1000px; }

/*Rotate arrow when clicked*/

.nav__list label > span
{
    float: right;
    -webkit-transition: -webkit-transform .65s ease;
    transition: transform .65s ease;
    -moz-transition: transform .65s ease;
}

.nav__list input[type=checkbox]:checked + label > span
{
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -moz-transform: rotate(90deg);
}
.group-list li a span
{
    margin-bottom:15px !important;
}
/*Responsive Tables*/
/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px)  {
    .contenttext {
        overflow-x: scroll;
    }
/*
    table {
        width: 800px;
    }
*/
}


