﻿
.ow-view-all-shop {
    cursor: pointer
}




.rlx-corner-nav a:link, a:visited, a:hover, a:active {
    text-decoration: none;
}


/*@media screen and (max-width:640px) {
    .RolexTooltip .tooltiptext {
        left: 30%;
    }
}*/

    .ow-map-section div, .ow-map-section div iframe {
        height: 100%;
        width: 100%;
    }




    #btnViewAll {
        position: absolute;
        top: 24px;
        left: 0;
        z-index: 1;
        margin: 0;
        padding: 0 0 0 12px;
        border: 0 none transparent;
        color: #bbb;
        background-color: transparent;
        text-transform: uppercase;
        outline: none;
    }

        #btnViewAll::before {
            content: "";
            display: inline-block;
            vertical-align: middle;
            width: 0;
            height: 0;
            margin-right: 12px;
            border-top: 6px solid transparent;
            border-bottom: 6px solid transparent;
            border-right: 6px solid #bbb
        }



    @media screen and (min-width:768px) {
        .ow-shopMap {
            /*        position: relative;
        top: 0;
        clear: both;
        overflow: hidden;*/
            width: 100%;
            display: flex;
        }

        .ow-map-section {
            width: 50%;
            float: left;
            position: relative;
            overflow: hidden;
            height: 520px
        }

        .ow-map-section, .ow-shop-section {
            /*        text-align: center;*/
            display: inline-block;
            /*        width: 50%;*/
            position: relative;
            overflow: hidden;
            width: 100%;
            position: relative;
            overflow: hidden;
            float: none;
            display: table-cell;
            vertical-align: middle;
            margin: 0px;
            padding: 0px;
            min-width: 410px;
            background: #FFF;
            width: 35vw;
        }

        .ow-map-section {
            /*            position: relative;*/
            height: 700px;
            padding: 0;
            width: 65vw;
        }

        .ow-shop-info-dtl {
            /*                margin: 0;
                position: absolute;
                top: 53%;
                left: 50%;
                transform: translate(-50%,-50%)*/
        }
    }

    @media screen and (max-width:767px) {

        .ow-map-section div, .ow-map-section div iframe {
            width: 100%;
            height: 400px;
            overflow: hidden;
        }
        /*Added by Vincent 2020.11.18*/

        /*    #mapContent .ow-shop-section > div {
        padding: 50px 0 30px 0
    }
*/
        /*        #mapContent .ow-shop-section > div > div {
            text-align: center
        }
*/

      
        
        .ow-shopMap {
            display: -webkit-flex;
            display: flex;
            -webkit-flex-direction: column-reverse;
            flex-direction: column-reverse;
        }
    }

    .mapContent-bottom {
        padding-bottom: 80px
    }

    @media screen and (max-width:1024px) {
        .mapContent-bottom {
            padding-bottom: 60px
        }
    }

    @media screen and (max-width:640px) {
        .mapContent-bottom {
            padding-bottom: 35px
        }

        #btnViewAll {
            position: relative;
        }
    }

/*.rolex-badge-icon a {
    text-decoration: none;
    cursor: pointer !important;
}*/



    .ow-shop-info-dtl {
        margin: 0;
        padding: 40px 25%;
        height: 100%;
        align-content: center;
        color: #452C1E;
    }

.rcpo-shop-info-dtl {
    margin: 0;
    padding: 40px 25%;
    height: 100%;
    align-content: center;
    background: #000;
    color: #FFF;
}



    @media screen and (max-width:640px) {
    .ow-shop-info-dtl {
        padding: 40px 10%;
    }

   
}


@media screen and (max-width:767px) {

    .rcpo-shop-info-dtl {
        padding: 40px 10%;
        text-align: center;
    }
}



    @media screen and (max-width:640px) {
        .ow-shop-info hgroup h1 {
            font-size: 17px;
            margin-top: 4px
        }
    }





    .ow-shops-area-grid {
        display: grid;
        grid-gap: 1rem;
        grid-auto-flow: dense;
        padding: 0;
    }

    @media screen and (min-width: 1200px) {
        .ow-shops-area-grid {
            grid-template-columns: repeat(4,1fr);
        }
    }

    @media screen and (max-width: 1199px) {
        .ow-shops-area-grid {
            grid-template-columns: repeat(3,1fr);
        }
    }

    @media screen and (max-width: 767px) {
        .ow-shops-area-grid {
            grid-template-columns: repeat(2,1fr);
        }
    }

    @media screen and (max-width: 575px) {
        .ow-shops-area-grid {
            grid-template-columns: repeat(1,1fr);
        }
    }


    .ow-shops-area {
        min-width: 100%;
        margin: 0 auto;
        /*padding:0 10%*/
    }


    .ow-shop-info {
        display: inline-block;
        padding: 40px 10px;
        vertical-align: top;
        position: relative;
        background-color: rgba(0,0,0,0.03);
        text-align: center;
        color: #452C1E;
    }

    /*        .ow-shops-area ul li div {
            margin-bottom: 20px
        }*/

    .ow-shops-area-title {
        color: #452C1E;
        font-size: 20px;
        margin: 0;
        line-height: 1.2;
        /*    letter-spacing: .05em*/
    }

        .ow-shops-area-title:lang(zh-HK),
        .ow-shops-area-title:lang(zh-CN) {
            letter-spacing: 0;
            line-height: 1.2em !important;
        }

    .ow-shops-area button {
        position: absolute;
        bottom: 40px;
        border-width: 0;
        padding: 0px;
        background: rgba(255,255,255,0);
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        border: none;
        outline: none;
        width: 100%;
    }

    /*    @media screen and (max-width:992px) {
        .ow-shops-area {
            margin-top: 40px;
            padding: 0
        }
    }*/

    /* -----------------------------------------------
    rolex_contact.aspx shops details Part J End
------------------------------------------------- */



    .ow-btn {
        border: 0;
        margin: 0;
        outline: 0;
        padding: 0;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: transparent;
        border: 1px solid #e6e6e6;
        color: #767676;
        display: inline-block;
        font-size: 14px;
        line-height: 3.55;
        padding: 0px 25px !important;
        text-align: center;
        -moz-transition: opacity .6s cubic-bezier(0.23,1,0.32,1),background-color .6s cubic-bezier(0.23,1,0.32,1),color .6s cubic-bezier(0.23,1,0.32,1),border-color .6s cubic-bezier(0.23,1,0.32,1);
        -o-transition: opacity .6s cubic-bezier(0.23,1,0.32,1),background-color .6s cubic-bezier(0.23,1,0.32,1),color .6s cubic-bezier(0.23,1,0.32,1),border-color .6s cubic-bezier(0.23,1,0.32,1);
        -webkit-transition: opacity .6s cubic-bezier(0.23,1,0.32,1),background-color .6s cubic-bezier(0.23,1,0.32,1),color .6s cubic-bezier(0.23,1,0.32,1),border-color .6s cubic-bezier(0.23,1,0.32,1);
        transition: opacity .6s cubic-bezier(0.23,1,0.32,1),background-color .6s cubic-bezier(0.23,1,0.32,1),color .6s cubic-bezier(0.23,1,0.32,1),border-color .6s cubic-bezier(0.23,1,0.32,1);
        white-space: nowrap;
    }

    .ow-contact input, .ow-contact textarea,
    .ow-contact select {
        background: transparent;
        border: solid #ccc;
        border-radius: 0;
        border-width: 0 0 1px;
        color: #212121;
        display: inline-block;
        font-size: 14px;
        line-height: 20px;
        outline: 0;
        padding: 0;
        -moz-transition: border .3s ease-out;
        -o-transition: border .3s ease-out;
        -webkit-transition: border .3s ease-out;
        transition: border .3s ease-out;
        vertical-align: middle;
        width: 100%
    }

    .ow-contact .ow-fieldset {
        border: 0;
        margin: 0;
        min-width: 0;
        padding: 0;
        position: relative
    }

    .ow-contact .ow-select-area {
        overflow: hidden;
        position: relative
    }

        .ow-contact .ow-select-area::after {
            border: solid transparent;
            border-top-color: #767676;
            border-width: 4px;
            content: "";
            height: 0;
            left: 100%;
            margin-left: -8px;
            margin-top: -2px;
            pointer-events: none;
            position: absolute;
            top: 50%;
            width: 0
        }

    .ow-contact .ow-select {
        -moz-appearance: none;
        -webkit-appearance: none;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        background: transparent;
        border: solid #ccc;
        border-width: 0 0 1px;
        color: #212121;
        font-size: 14px;
        height: 21px;
        line-height: 20px;
        outline: 0;
        padding: 0;
        width: 130%
    }

    .ow-contact {
        text-align: center;
        padding: 50px 0;
    }

        .ow-contact .error {
            color: red;
            border-color: red
        }

        .ow-contact .ow-contact-form {
            position: relative;
            font-size: 0;
            margin: 60px auto 0;
            max-width: 650px;
            width: 90%;
        }

        .ow-contact .ow-login-form {
            max-width: 400px;
        }

    @media screen and (max-width:640px) {
        .ow-contact .ow-contact-form {
            margin: 30px auto 0
        }
    }

    .ow-contact .ow-contact-row {
        /*    margin: 0 0 60px;*/
        text-align: center;
        display: -webkit-flex;
        display: flex;
    }

    .ow-contact .ow-row-margin-bottom {
        margin: 0 0 33px;
    }


    .ow-title {
        width: 13%;
        margin: 0 3% 0 0
    }

    .ow-fname, .ow-birthday {
        margin: 0 3% 0 0
    }

    .ow-lname {
        margin: 0
    }



    .ow-phone-code {
        margin: 0 2% 0 0
    }

    .ow-phone {
        margin: 0
    }

    .ow-message {
        margin: 0;
        width: 100%
    }

    .ow-action {
        align-items: center;
        justify-content: right;
        display: flex;
    }

    .ow-btn-cancel {
        border-color: transparent
    }

        .ow-btn-cancel:hover {
            color: #212121 !important;
            background: transparent !important
        }

    .ow-notice {
        font-size: 14px;
        color: #212121;
        -webkit-justify-content: flex-end;
        justify-content: flex-end
    }

        .ow-notice .ow-error {
            color: red;
        }

        .ow-notice .ow-success, .ow-notice .ow-error {
            margin-bottom: 30px
        }


    .ow-fieldset.ow-fieldset-last .ow-contact-row.ow-notice {
        margin-bottom: 0
    }

    .ow-btn-submit {
        border: 1px solid #212121;
        background: #212121;
        color: #e6e6e6
    }

        .ow-btn-submit:hover {
            background-color: #fff;
            color: #212121
        }

    .ow-contact .ow-text-area {
        border-width: 1px;
        height: 100px;
        padding: 2%
    }

    @media screen and (max-width:1024px) {
        .ow-fieldset {
            width: 100%
        }
    }

    @media screen and (min-width:641px) {
        .ow-phone-code {
            width: 14%;
            margin-right: 3%
        }

        .ow-fname, .ow-birthday {
            width: 35%
        }

        .ow-email {
            width: 50%;
            margin-right: 3%
        }

        .ow-mailaddress {
            width: 100%;
            margin-right: 0%
        }

        .ow-phone {
            width: 32%
        }
    }

    .ow-contact .ow-contact-row > div {
        margin-bottom: 40px;
    }

    @media screen and (max-width:640px) {
        .ow-contact {
            padding-bottom: 0
        }

            .ow-contact .ow-contact-row {
                flex-wrap: wrap;
                margin-bottom: 0
            }

                .ow-contact .ow-contact-row > div {
                    margin-bottom: 25px;
                }

            .ow-contact .ow-phone {
                width: 73%
            }

            .ow-contact .ow-phone-code {
                width: 24%;
                margin: 0 3% 0 0
            }

            .ow-contact .ow-fname {
                width: 84%;
                margin: 0
            }

            .ow-contact .ow-lname, .ow-contact .ow-email, .ow-contact .ow-mailaddress, .ow-contact .ow-image-verify-code, .ow-contact .ow-birthday {
                width: 100%;
                margin: 0
            }
    }

    .ow-notice .ow-contact-info-area {
        display: none
    }



    .ow-top {
        padding-top: 60px
    }


    @media screen and (max-width:767px) {
        .ow-contact {
            padding: 20px 0;
        }
    }

    .ow-contact-header {
        display: inline-block;
        margin: 0;
        text-align: left;
        width: 55%;
        max-width: 600px
    }

    .ow-login-header {
        max-width: 400px
    }

    @media screen and (max-width:1280px) {
        .ow-contact-header {
            width: 70%
        }
    }

    @media screen and (max-width:1024px) {
        .ow-contact-header {
            width: 85%
        }
    }

    @media screen and (max-width:880px) {
        .ow-contact-header {
            width: 95%
        }
    }

    @media screen and (max-width:640px) {
        .ow-contact-header {
            width: 100%;
            padding-left: 25px;
            padding-right: 25px
        }
    }


    @media screen and (min-width:1280px) {
        .ow-contact-header hgroup h1 {
            font-size: 36px
        }
    }

    @media screen and (max-width:640px) {
        .ow-contact-header hgroup h1 {
            font-size: 17px;
            margin-top: 4px
        }
    }

    .ow-contact-header p {
        color: #767676;
        line-height: 24px
    }

    .ow-contact .ow-select {
        color: #212121;
        width: 100%
    }
    /* -----------------------------------------------
    rolex_contact.aspx submit contact info Part K End
------------------------------------------------- */

    .password {
        -webkit-text-security: disc;
    }


    .ChkBoxClass input {
        width: 16px;
        height: 16px;
    }

    .error-checkbox {
        color: red;
        border-color: red
    }




    /*  ----------------------------------------------------
    User Selection check Box style
   ----------------------------------------------------*/

    /* The chkContainer */
    .chkContainer {
        /*
    display: block;
  */
        position: relative;
        padding-left: 23px;
        margin-bottom: 5px;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

        /* Hide the browser's default checkbox */
        .chkContainer input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 0;
            width: 0;
        }

    /* Create a custom checkbox */
/*    .checkmark {
        position: absolute;
        top: 3px;
        left: 0;
        height: 14px;
        width: 14px;
        border: 1px solid #767676;
    }*/

    /* On mouse-over, add a grey background color */
    .chkContainer:hover input ~ .checkmark {
        /*
  background-color: #eee;
  background-color: #ccc;
  */
    }

    /* When the checkbox is checked, add a blue background */
    .chkContainer input:checked ~ .checkmark {
        background-color: #127749;
        border-color: #127749;
    }



    /* Create the checkmark/indicator (hidden when not checked) */
/*    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }*/

    /* Show the checkmark when checked */
    .chkContainer input:checked ~ .checkmark:after {
        display: block;
    }

    .chkContainer input:checked ~ .labelStyle {
        color: #127749;
    }

    /*  ----------------------------------------------------
    User Selection check Box style End
   ----------------------------------------------------*/



    .contactButton {
        color: #452C1E;
        background: #fff;
        height: 36px;
        width: 36px;
        border-radius: 50%;
        margin: 0 10px;
        text-align: center;
    }

    .contactButtonSpan {
        font-size: 14px;
        text-transform: initial;
        letter-spacing: 0;
        color: #212121;
        height: 36px;
    }

    span.contactButtonSpan i {
        line-height: 36px;
        transition: border-color 0.3s ease 0s, background-color 0.3s ease 0s, fill 0.3s ease 0s;
    }

    .contactButton:hover {
        /*        background-color: #127749;
        color: white;*/
        color: #127749;
    }

    .contactBannerTop {
        width: 100%;
        height: 15vw;
        min-height: 170px;
        max-height: 230px;
        position: relative;
        /*    background-position: 50% 50%;*/
        background-position: right;
        background-repeat: no-repeat;
        background-size: cover;
    }

    @media screen and (max-width: 768px) {
        .contactBannerTop {
            width: 100%;
            height: 180px;
            position: relative;
            /*background-position: top;*/ /*50% 50%;*/
            background-position: right;
            background-repeat: no-repeat;
            background-size: cover;
        }
    }


    .rolex_retailer_header {
        color: #127749 !important;
        font-size: 11px;
        text-transform: uppercase;
        font-weight: normal;
        /*        margin-bottom: 5px;*/
    }

    .zh .rolex_retailer_header {
        font-size: 14px;
    }