@font-face {
    font-family: 'banner-moncompte__montserratregular';
    src: url("../fonts/Montserrat-Regular-webfont.eot");
    src: url("../fonts/Montserrat-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Regular-webfont.woff2") format("woff2"), url("../fonts/Montserrat-Regular-webfont.woff") format("woff"), url("../fonts/Montserrat-Regular-webfont.ttf") format("truetype"), url("../fonts/Montserrat-Regular-webfont.svg#montserratregular") format("svg");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'banner-moncompte__montserratbold';
    src: url("../fonts/Montserrat-Bold-webfont.eot");
    src: url("../fonts/Montserrat-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Bold-webfont.woff2") format("woff2"), url("../fonts/Montserrat-Bold-webfont.woff") format("woff"), url("../fonts/Montserrat-Bold-webfont.ttf") format("truetype"), url("../fonts/Montserrat-Bold-webfont.svg#montserratbold") format("svg");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'banner-moncompte__montserratlight';
    src: url("../fonts/Montserrat-Light-webfont.eot");
    src: url("../fonts/Montserrat-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Light-webfont.woff2") format("woff2"), url("../fonts/Montserrat-Light-webfont.woff") format("woff"), url("../fonts/Montserrat-Light-webfont.ttf") format("truetype"), url("../fonts/Montserrat-Light-webfont.svg#montserratlight") format("svg");
    font-weight: 300;
    font-style: normal;
}

.banner-mon-compte__connected-avatar {
    display: none;
}

.banner-mon-compte__sub-menu .item-menu-mcp {
    width: 100%;
    position: relative;
    padding: 3rem 0;
    border-bottom: 2px solid #2c4051;
    text-align: left;
    display: inline-block;
}

    .banner-mon-compte__sub-menu .item-menu-mcp a {
        color: #fff;
    }

.banner-mon-compte__connexion-wrapper ul {
    padding: 0;
    list-style: none;
}

.mon-paris .nav-item {
    padding: 0;
}

@media (min-width: 1024px) {
    .banner-mon-compte__sub-menu .item-menu-mcp {
        padding: 0;
    }

    .banner-mon-compte__connexion-wrapper {
        z-index: 2000;
        position: relative;
        top: 0.25em;
        right: 1em;
        color: #0B2438;
        padding-bottom: 0.5em;
        white-space: nowrap;
    }

    .banner-mon-compte__sub-menu {
        white-space: normal;
    }

        .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar,
        .banner-mon-compte__connexion-wrapper .banner-mon-compte__connected-avatar {
            -webkit-box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.57);
            -moz-box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.57);
            box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.57);
            border: none;
            border-radius: 80px;
            display: inline-block;
            overflow: hidden;
            height: 60px;
            width: 60px;
            position: relative;
        }

        .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar {
            display: flex;
            align-items: center;
            padding-left: 20px;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
        }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar span.banner-mon-compte__my-account {
                display: inline-block;
                font-size: 16px;
                opacity: 0;
                left: 16px;
                top: 50%;
                transform: translate(60px, -50%);
                position: absolute;
                text-transform: uppercase;
                white-space: nowrap;
                -webkit-transition: opacity 0.2s ease-in-out;
                -moz-transition: opacity 0.2s ease-in-out;
                transition: opacity 0.2s ease-in-out;
            }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar:hover {
                width: 220px;
                -webkit-transition: all 0.6s ease-in-out;
                -moz-transition: all 0.6s ease-in-out;
                transition: all 0.6s ease-in-out;
            }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar .banner-mon-compte__my-account::after {
                content: 'Mon Paris';
                display: block;
                font-family: 'banner-moncompte__montserratregular','Source Sans Pro','Helvetica Neue',Helvetica, Arial, sans-serif;
                font-weight: 300;
                color: #fff;
            }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connexion-avatar:hover span.banner-mon-compte__my-account {
                opacity: 1;
                -webkit-transition: opacity 0.8s ease-in-out;
                -moz-transition: opacity 0.8s ease-in-out;
                transition: opacity 0.8s ease-in-out;
            }

        .banner-mon-compte__connexion-wrapper .banner-mon-compte__connected-avatar {
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            display: -webkit-box;
            /* OLD - iOS 6-, Safari 3.1-6, BB7 */
            display: -ms-flexbox;
            /* TWEENER - IE 10 */
            display: -webkit-flex;
            /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
            display: flex;
            /* NEW, Spec - Firefox, Chrome, Opera */
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: 0;
            position: relative;
            list-style-type: none;
            margin: 0;
        }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connected-avatar span.letter {
                display: inline-block;
                font-size: 26px;
                font-family: 'banner-moncompte__montserratregular','Source Sans Pro','Helvetica Neue',Helvetica, Arial, sans-serif;
                text-transform: uppercase;
            }

            .banner-mon-compte__connexion-wrapper .banner-mon-compte__connected-avatar.wrapper-avatar {
                border: 6px solid #071f32;
            }

                .banner-mon-compte__connexion-wrapper .banner-mon-compte__connected-avatar.wrapper-avatar img.avatar {
                    display: block;
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    -webkit-transform: translate(-50%, -50%);
                    /* Safari and Chrome */
                    -moz-transform: translate(-50%, -50%);
                    /* Firefox */
                    -ms-transform: translate(-50%, -50%);
                    /* IE 9 */
                    -o-transform: translate(-50%, -50%);
                    /* Opera */
                    max-width: 100%;
                }

        .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent {
            list-style: none;
            list-style-type: none;
            position: absolute;
            top: 0;
            right: 0;
            height: 100%;
            width: 100%;
        }

            .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent ul.banner-mon-compte__sub-menu {
                visibility: hidden;
                background: white;
                position: absolute;
                padding: 0;
                opacity: 0;
                top: 100%;
                right: 0;
                width: 180px;
                transform: translateY(-1rem);
                -webkit-transform: translateY(-1rem);
                -moz-transform: translateY(-1rem);
                -ms-transform: translateY(-1rem);
                -o-transform: translateY(-1rem);
                -webkit-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
                -moz-transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
                transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
                transition: all 0.3s ease-in-out 0s;
                -webkit-box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.37);
                -moz-box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.37);
                box-shadow: 0px 0px 15px -1px rgba(0, 0, 0, 0.37);
            }

                .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent ul.banner-mon-compte__sub-menu:before {
                    content: '';
                    width: 0;
                    height: 0;
                    border-left: 16px solid transparent;
                    border-right: 16px solid transparent;
                    border-bottom: 16px solid white;
                    position: absolute;
                    right: 15px;
                    top: -15px;
                }

                .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent ul.banner-mon-compte__sub-menu li {
                    border-bottom: 0.1rem solid #CCC;
                    font-family: "banner-moncompte__montserratregular",'Source Sans Pro','Helvetica Neue',Helvetica, Arial, sans-serif;
                    font-size: 14px;
                    list-style: none;
                    height: 45px;
                    line-height: 45px;
                    margin: 0 auto;
                    text-transform: uppercase;
                    text-align: center;
                    width: 90%;
                }

                    .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent ul.banner-mon-compte__sub-menu li a {
                        color: #071f32;
                        text-decoration: none;
                        font-family: 'banner-moncompte__montserratregular','Source Sans Pro','Helvetica Neue',Helvetica, Arial, sans-serif;
                    }

        .banner-mon-compte__connexion-wrapper ul.banner-mon-compte__sub-menu li a:hover {
            text-shadow: none;
        }

        .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent:hover ul.banner-mon-compte__sub-menu, .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent:focus ul.banner-mon-compte__sub-menu {
            visibility: visible;
            /* shows sub-menu */
            opacity: 1;
            display: block;
            z-index: 1;
            transform: translateY(1rem);
            -webkit-transform: translateY(1rem);
            -moz-transform: translateY(1rem);
            -ms-transform: translateY(1rem);
            -o-transform: translateY(1rem);
            transition-delay: 0s, 0s, 0.3s;
            /* this removes the transition delay so the menu will be visible while the other styles transition */
        }

    .navbar-banner-mcp .banner-mon-compte__menu_item {
        display: none;
    }
}

/*********** MC BANNER INFO STYLES ****************/
#mcModalContent {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

    #mcModalContent h2 {
        font-family: 'banner-moncompte__montserratbold', Helvetica, Arial, sans-serif;
        font-size: 36px;
        color: #fff;
        line-height: 50px;
        margin-top: 15px
    }

        #mcModalContent h2 a {
            color: #f8e56d;
            text-decoration: underline
        }

    #mcModalContent hr {
        border-top: 1px solid #517992;
        width: 100%;
        margin-top: 50px
    }

    #mcModalContent button {
        font-family: 'banner-moncompte__montserratlight', Helvetica, Arial, sans-serif;
        margin-top: 25px;
        color: #fff;
        background: none;
        border: 0;
        font-size: 16px;
        text-decoration: underline
    }

    #mcModalContent .btn {
        border: medium none;
        border-radius: 5px;
        color: #fff;
        cursor: pointer;
        display: inline-block;
        font-size: 16px;
        font-weight: bold;
        line-height: 20px;
        overflow: hidden;
        padding: 15px 20px;
        text-transform: uppercase;
        position: relative;
        text-align: center;
        text-decoration: none;
        vertical-align: middle;
        z-index: 1;
    }

        #mcModalContent .btn::after {
            border-radius: 5px;
            content: "";
            display: block;
            height: 100%;
            left: 0px;
            position: absolute;
            top: 0px;
            transition: width 0.35s ease 0s;
            width: 0px;
            z-index: -1;
        }

        #mcModalContent .btn:hover::after {
            width: 100%
        }

    #mcModalContent.btn-primary {
        text-shadow: initial;
        box-shadow: initial;
        background-image: initial
    }

    #mcModalContent .btn-primary, .btn-primary:focus, .btn-primary:hover {
        background-color: #df225a
    }

        #mcModalContent .btn-primary::after {
            background-color: #b41a48
        }

        #mcModalContent .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active {
            color: #fff;
            background-color: #b41a48;
            border-color: #b41a48;
        }

/*** Featherlight – ultra slim jQuery lightbox ***/
.featherlight {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2147483647;
    text-align: center;
    cursor: pointer;
}

    .featherlight:last-of-type {
        background: rgba(0, 0, 0, 0.2)
    }

    .featherlight .featherlight-content {
        /* position: centering vertical and horizontal */ text-align: center;
        vertical-align: middle;
        display: inline-block;
        /* dimensions: cut off images */ overflow: auto;
        padding: 4% 20%;
        border-bottom: 25px solid transparent;
        /* dimensions: handling large content */ margin-top: 12%;
        min-height: 80%;
        width: 100%;
        /* styling */ font-family: 'banner-moncompte__montserratregular', Helvetica, Arial, sans-serif;
        color: #fff;
        background-color: #0a4871;
        cursor: auto
    }

    .featherlight .featherlight-inner {
        display: block
    }

    .featherlight .featherlight-close-icon {
        display: none
    }

@media (max-width: 1024px) {
    #mcModalContent h2 {
        font-size: 28px;
    }
}

@media (max-width: 1024px) {
    .banner-mon-compte__connexion-wrapper.off {
        display: none;
    }

    .navbar-banner-mcp .banner-mon-compte__menu_item {
        display: block;
    }

    .banner-mon-compte__connexion-wrapper {
        top: 8px;
        right: 15px;
    }

        .banner-mon-compte__connexion-wrapper ul > li.banner-mon-compte__sub-menu-parent ul.banner-mon-compte__sub-menu:before {
            right: 10px;
        }

    #mcModalContent h2 {
        font-size: 22px;
        line-height: 32px
    }
}

@media (max-width: 640px) {
    #mcModalContent h2 {
        font-size: 18px;
    }
}