﻿.radio-box {
    width: 445px; //333px;
    float: left;
    margin: 20px 0px 20px 66px;

    &.transport-box {
        margin-left: 67px;
        margin-top: 10px;
    }

    &.payment-box {
        min-height: 90px;
        margin-top: 10px;

        &.repeat-payment {
            margin: 0 auto !important;
            float: none !important;

            strong.price {
                margin-right: 7px !important;
            }
        }
    }

    .deliveryGroup, .paymentGroup {
        width: 437px; //325px;
        border: 4px solid #f0f0f0;
        float: left;

        .box-wrap {
            float: left;
            display: block;
            position: relative;
            width: 423px; //311px;
            cursor: pointer;
            background-color: #fff;
            padding: 8px 7px;
            min-height: 30px; //30px;
            //background-image: none;
            border-bottom: 4px solid transparent;

            .tooltip-trigger {
                top: 14px;
            }

            .price {
                color: #727272;
                font: 16px RobotoMedium;
                float: right;
                padding-top: 5px;

                &.free {
                    color: #7ab51c;
                    text-transform: uppercase;
                    font-size: 15px;
                    font-family: RobotoBold;
                }
            }

            label {
                height: auto;
                cursor: inherit;
                max-width: 216px;
                float: left;
                margin-left: 77px; //87px;
                margin-top: 2px;
            }

            .iradio {
                float: left;
                margin-right: 8px;
                position: relative;
                top: 8px;
            }

            p {
                display: none;
                font-family: RobotoLight;
                font-size: 13px;
                margin: 10px;

                a.strong_a {
                    color: #000;
                    font-weight: bold;
                    text-decoration: none;

                    &:hover {
                        text-decoration: underline;
                    }
                }

                &.twist {
                    font-size: 13px;
                    margin: 10px 0 10px 6px;

                    span {
                        color: #f00;
                        font-family: RobotoBold;

                        &.margin-tw {
                            font-family: RobotoLight;
                            color: #000;
                            margin-top: 0; // 5px;
                            display: inline-block;
                        }
                    }

                    a {
                        color: #000;
                    }

                    &.visible {
                        color: #f00; /* text color */
                        font-family: "RobotoRegular";
                        font-size: 13px;
                        display: block;
                        float: left;
                        margin: 3px 0 0 25px;

                        span {
                            color: #f00; /* text color */
                            font-family: "RobotoMedium";
                            font-size: 13px;
                        }
                    }
                }
            }

            &.placeholder,
            &.pickup-point-4h,
            &.zasilkovna-box,
            &.all-pickup-points,
            &.pickup-points {
                &.other-payments {
                    background-color: #f5f5f5;
                    border-bottom: 0;

                    .icon-check {
                        background-image: url(../img/otherPaymentsArrowIco.png) !important;
                        -webkit-border-radius: 0px;
                        -moz-border-radius: 0px;
                        border-radius: 0px;
                        border: 0;
                        height: 9px;
                        width: 14px;
                        background-repeat: no-repeat;
                        background-position: center center;
                        background-color: #f5f5f5;
                        margin-top: 12px;
                        display: inline-block;
                        float: left;
                        position: relative;
                        //  top: 5px;
                        margin-right: 7px;
                    }

                    label {
                        margin-left: 4px;
                        max-width: 380px;
                        font-size: 14px;
                        font-family: RobotoLight;

                        strong {
                            font-weight: normal;
                            font-family: RobotoMedium;
                            font-size: 15px;
                        }

                        span {
                            font-size: 14px;
                            font-family: RobotoLight;

                            &.alter {
                                display: none !important;
                            }
                        }
                    }

                    &#ClosePaymentMethod {
                        .icon-check {
                            background-image: url(../img/otherPaymentsArrowCloseIco.png) !important;
                        }
                    }
                }

                &.pickup,
                &.zasilkovna,
                &.zasilkovnahu,
                &.zasilkovnaro,
                &.all-pickup-points,
                &.single {
                    border-bottom: 0;

                    .places-count {
                        font-family: RobotoLight;
                        font-size: 12px;

                        .HU & {
                            font-size: 11px;
                        }
                    }

                    .fake-change, .selected-address {
                        display: none;
                    }

                    .fake-change {
                        color: #000; /* text color */
                        font-family: "RobotoLight";
                        font-size: 14px;

                        span {
                            font-family: "RobotoLight";
                            font-size: 14px;
                            color: #32bcad;
                        }
                    }

                    .selected-address,
                    .available-pickup-points {
                        margin-left: 99px; //87px;
                        color: #000; /* text color */
                        font-family: "RobotoLight";
                        font-size: 12px;
                        float: left;
                    }

                    .selected-address {
                        max-width: 216px;
                    }

                    .icon-check {
                        display: inline-block;
                        margin: 0;
                        padding: 0;
                        width: 12px;
                        height: 12px;
                        background: #fff;
                        border: 1px solid #1cb3a2;
                        cursor: pointer;
                        position: relative;
                        top: 2px;
                        -webkit-border-radius: 12px;
                        -moz-border-radius: 12px;
                        border-radius: 12px;
                        float: left;
                        margin-right: 8px;
                        position: relative;
                        top: 8px;
                    }

                    &.active {
                        margin-bottom: -4px !important;
                        border-bottom: 4px solid #8dd9d0;

                        .fake-change,
                        .selected-address {
                            display: inline-block;
                        }

                        .places-count {
                            display: none;
                        }

                        .selected-address,
                        .available-pickup-points {
                            margin-bottom: -5px;
                        }

                        .icon-check {
                            background: #1cb3a2 url(../img/checked.png?v=1) center center no-repeat;
                            border-color: #1cb3a2;
                        }

                        label {
                            margin-top: -7px;
                        }

                        strong.price {
                            margin-top: -9px;
                        }
                    }
                }
            }

            &.active {
                border: 4px solid #8DD9D0;
                margin: -4px 0 0px -4px !important;
                position: relative;
                background-color: #fafffe;

                &#TwistoPayment {
                    height: 80px;

                    .twist {
                        display: block;
                        margin-left: 25px;
                        float: left;
                    }
                }
            }

            &.paczkomat-box,
            &.zasilkovna-box,
            &.all-pickup-points,
            &.pickup-points {

                .selected-address {
                    margin-left: 99px; //87px;
                    color: #000; /* text color */
                    font-family: "RobotoLight";
                    font-size: 12px;
                    float: left;
                }
                /* &.active {
                    padding-bottom: 25px; 
                    
                }*/
                &.disabled {
                    cursor: default;
                    color: #b3b3b3;

                    span.paczkomatDisable {
                        display: inline-block;
                        width: 16px;
                        height: 15px;
                        padding: 0;
                        float: left;
                        margin: 6px 7px 0 0;
                        background-repeat: no-repeat;
                        background-position: center center;
                        background-image: url(../img/paczkomatDisable.png);
                    }

                    .price {
                        display: none;
                    }
                }

                label.pl-info {
                    display: none;
                    float: left;
                    clear: both;
                    margin: 0 !important;
                    padding: 0;
                    color: #989898;
                    font-family: "RobotoMedium";
                    font-size: 14px;
                    margin-top: 20px !important;
                    margin-left: 100px !important;
                }

                &.active {
                    /* pl radio hack (ie) */
                    .iradio {
                        background: #1CB3A2 url(../img/checked.png?v=1) center center no-repeat;
                        border-color: #1CB3A2;
                    }

                    margin: -4px 0 -4px -4px !important;
                }
            }

            &.aggregate-pickup {
                &.pickup-points {
                    &.active {
                        label {
                            margin-top: -7px;
                        }
                    }
                }
            }
        }

        .subgroup {
            display: none;
            width: 437px;
            float: left;

            &.active {
                border-top: none;
                position: relative;

                &.payment {
                    z-index: 0;
                }
            }

            .box-wrap {
                padding-left: 7px;
                width: 423px; //293px;
                &.active {
                    padding-left: 7px;
                    /* &.last{
                        border-bottom: 4px solid #8dd9d0;
                    }*/
                }
                /* &.last{
                        margin-bottom: -4px !important;
                        border-bottom: 4px solid #f0f0f0;
                    }*/
            }
        }
    }

    .deliveryGroup {
        .box-wrap {
            .christmas-delivery-guarantee-tree {
                margin: 6px 0 0 4px;
            }

            &.pickup {
                .christmas-delivery-guarantee-tree {
                    margin: 6px 0 0 4px;
                }
            }

            &.all-pickup-points {
                .christmas-delivery-guarantee-tree {
                    @media only screen and (min-width: 480px) {
                        position: absolute;
                        top: 5px;
                    }
                }

                &:not(.active) {
                    .christmas-delivery-guarantee-tree {
                        @media only screen and (min-width: 480px) {
                            margin: 0;
                            right: 95px;
                        }
                    }
                }

                &.active {
                    .christmas-delivery-guarantee-tree {
                        @media only screen and (min-width: 480px) {
                            margin-top: -1px;
                        }
                    }
                }
            }
        }
    }
}



.all-pickup-points {
    .pickup-point-title {
        margin-top: -8px !important;
    }

    &:not(.active) {
        .pickup-point-title {
            width: 100% !important;
        }
    }

    .available-pickup-points {
        display: flex;
        margin-top: -1px;

        &:before, &:after {
            content: "";
            display: table;
        }

        &:after {
            clear: both;
        }

        .pickup-point {
            float: left;
            margin-right: 10px;

            strong, em {
                font-weight: 300;
                font-style: normal;
            }

            strong {
                width: 0;
                display: inline-block;
                height: 0;
                overflow: hidden;
            }

            &:before {
                background-position: center center;
                background-repeat: no-repeat;
                background-size: 16px;
                content: '';
                display: inline-block;
                height: 16px;
                margin-right: 1px;
                position: relative;
                top: 3px;
                width: 16px;
            }
        }

        .pickup-point--ZSKN {
            order: 1;

            &:before {
                background-image: url('/Content/img/logos/deliveryMethods/ico-mini-pickup-point-zasilkovna.png');
            }
        }

        .pickup-point--CPBO {
            order: 3;

            &:before {
                background-image: url('/Content/img/logos/deliveryMethods/ico-mini-pickup-point-na-postu.png');
            }
        }

        .pickup-point--CPBL {
            order: 2;

            &:before {
                background-image: url('/Content/img/logos/deliveryMethods/ico-mini-pickup-point-balikovna.png');
            }
        }

        .pickup-point--4H {
            order: 4;

            &:before {
                background-image: url('/Content/img/logos/deliveryMethods/ico-mini-pickup-point-4h.png');
            }
        }

        .pickup-point--PMAT {
            &:before {
                background-image: url('/Content/img/logos/deliveryMethods/ico-mini-pickup-point-paczkomat.png');
            }
        }
    }

    &.active {
        strong.price {
            margin-top: 0 !important;
        }
    }
}


.CZ {
    .radio-box {
        .deliveryGroup,
        .paymentGroup {
            .box-wrap {
                &.active {
                    &.pc {
                        margin-bottom: -4px !important;
                        padding-bottom: 12px;
                    }
                }

                &.zasilkovna-box {
                    &.active {
                        margin: -4px 0 0px -4px !important;
                    }
                }

                &.pickup-point-4h {
                    label {
                        margin-top: -7px;
                    }

                    .selected-address {
                        color: #000; /* text color */
                        display: inline-block;
                        float: left;
                        font-family: "RobotoLight";
                        font-size: 12px;
                        margin-bottom: -5px;
                        margin-left: 99px; //87px;
                    }
                }
            }
        }
    }
}

.HU {
    .radio-box {
        .deliveryGroup,
        .paymentGroup {
            .box-wrap {
                &.active {
                    &.zasilkovnahu,
                    //&.magyarposta, // kvůli změně pořadí dopravců na HU webu, prohození i zde, aby se správně vykreslil rámeček vybraného přepravce
                    &.gglpay {
                        margin-bottom: -4px !important;
                        padding-bottom: 12px;
                    }
                }
            }
        }

        .deliveryGroup {
            .box-wrap {
                &.zasilkovna-box {
                    &.zasilkovnahu {
                        .places-count {
                            font-size: 11px;
                        }
                    }
                }

                &.all-pickup-points {
                    .places-count {
                        display: block;
                        margin-bottom: 1px;
                    }
                }
            }
        }
    }
}

.RO {
    .radio-box {
        .deliveryGroup,
        .paymentGroup {
            .box-wrap {
                &.active {
                    &.zasilkovnaro,
                    &.gglpay {
                        margin-bottom: -4px !important;
                        padding-bottom: 12px;
                    }
                }

                label {
                    max-width: 200px;
                }
            }
        }
    }
}

#PickUpPlacesHiddenOverlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: none;
    background: rgba(0, 0, 0, 0.3);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0 0;
    width: 100%;
    height: 100%;

    #PickUpPlacesWrapper {
        padding: 0 2%;
    }
}

#PickUpPlacesHidden {
    display: none;
    position: relative;
    z-index: 1000;
    width: 839px;
    max-width: 100%;
    height: 529px;
    background-color: #fff;
    padding: 25px;
    top: 20px;
    margin-bottom: 20px;
    margin-left: -50000px;

    &.display {
        display: block !important;
        margin-left: auto;
        margin-right: auto;



        &.valid-error {
            .btns-wrap {
                p.validation-error {
                    display: inline-block;
                }
            }
        }
    }

    &.pl {
        h2.pickup-title {
            margin-top: -10px;
        }
    }

    .pickup-close {
        width: 200px;
        display: inline-block;
        color: #252525;
        font-family: "RobotoRegular";
        font-size: 17px;
        float: right;
        text-align: right;
        padding-right: 25px;
        background-image: url(../swipebox/img/icons2.png);
        background-repeat: no-repeat;
        border: none !important;
        text-decoration: none !important;
        cursor: pointer;
        background-position: 205px center;
        height: 25px;
        line-height: 27px;
        top: -20px;
        position: relative;
        right: -20px;
    }

    .clearfix {
        height: 1px;
        width: 100%;
    }

    h2 {
        color: #2c2c2c;
        font-family: "RobotoRegular";
        font-size: 23px !important;
        width: 100%;
    }

    .pickup-info {
        width: 410px;
        float: left;

        #PickUpInput {
            padding: 0 13px 0 35px;
            display: block;
            width: 360px;
            height: 32px;
            border: 1px solid #7a7a7a;
            background-image: url(../img/PickUpPlaceSearchIcon.jpg);
            background-repeat: no-repeat;
            background-position: 5px center;
            background-color: #fff !important;
            color: #3e3e3e; /* text color */
            font-family: "RobotoLight";
            font-size: 14px;
            line-height: 32px;
        }

        .info-helper {
            float: left;
            margin-top: 10px;

            &.sk, &.pl {
                display: none;
            }

            img {
                float: left;
                margin-right: 5px;
                margin-left: 14px;
            }

            span {
                float: left;
                height: 25px;
                line-height: 25px;
                color: #242424; /* text color */
                font-family: "RobotoLight";
                font-size: 13px;
            }
        }

        #pickup-list {
            height: 347px; //330px;
            margin-top: 16px;
            float: left;
            padding-right: 10px;
            overflow: auto;
            overflow-x: hidden;
            /* #mCSB_1_container{
                padding-right: 10px;
            }*/
            &.sk {
                height: 382px;

                .box-wrap {
                    strong.price {
                        //display: none;
                    }

                    img {
                        // display: none;
                    }

                    label {
                        max-width: 250px;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        white-space: nowrap;
                        font-size: 12px;

                        @media(max-width: 370px) {
                            max-width: 195px;
                            font-size: 11px;
                        }
                    }
                }
            }

            .box-wrap {
                background-image: none !important;
                background-color: #fff;
                float: left;
                width: 100%;
                height: 30px;
                line-height: 30px;
                border: 4px solid #fff;
                cursor: pointer;

                .iradio, input[type=radio] {
                    float: left;
                    cursor: pointer;
                    //  width: 20px;
                    //  height: 20px;
                    top: 0;
                    margin: 8px 10px;
                    display: none !important;
                }

                img {
                    cursor: pointer;
                    float: left;
                    margin: 0 10px;
                }

                label {
                    cursor: pointer;
                    padding: 0;
                    color: #4c4c4c;
                    font-family: "Arial";
                    font-size: 13px;
                    float: left;
                    height: auto;
                    height: 30px;
                    line-height: 30px;
                    max-width: 250px;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                    font-size: 12px;

                    @media(max-width: 350px) {
                        max-width: 190px;
                    }

                    &.pickUpHk {
                        margin-top: -6px;
                    }
                }

                p.express-delivery {
                    color: red;
                    font-family: RobotoRegular;
                    font-size: 12px;
                    float: left;
                    margin: -17px 0;

                    strong {
                        font-family: RobotoMedium;
                        font-weight: normal;
                    }
                }

                strong.price {
                    cursor: pointer;
                    float: right;
                    color: #4c4c4c;
                    font-family: "Arial";
                    font-size: 13px;
                    height: 30px;
                    line-height: 30px;

                    &.free {
                        font-weight: bold;
                        color: #7ab51c;
                        text-transform: uppercase;
                    }
                }

                &:nth-child(odd) {
                    background-color: #ebf6fc;
                    border: 4px solid #ebf6fc;
                }

                &.active {
                    border: 4px solid #8dd9d0;
                }
            }
        }

        &.pl {
            width: 100%;

            #PaczkomatCityContentBox,
            #PaczkomatBoxContentBox {
                width: 50%;
                float: left;
                max-width: 350px;
            }

            label.pl-info {
                font-family: RobotoMedium;
                margin-bottom: 2px;

                &.inactive {
                    opacity: .5;
                }
            }

            .select-wrapper {
                position: relative;
                border: 1px solid #bbb;
                -webkit-border-radius: 4px;
                -moz-border-radius: 4px;
                border-radius: 4px;
                float: left;
                clear: both;
                margin-top: 0px;
                width: 300px;
                z-index: 1000;
                background-color: #fff;

                &.cities {
                    z-index: 10000;
                }

                &.valid-error {
                    border-color: red;

                    .selected-label /*.paczkomatbox-label*/ {
                        color: red;
                    }
                }

                &.active {
                    border-bottom: 1px solid transparent;
                    -webkit-border-radius: 4px 4px 0 0;
                    -moz-border-radius: 4px 4px 0 0;
                    border-radius: 4px 4px 0 0;
                }

                .selected-label {
                    -webkit-box-sizing: border-box;
                    -moz-box-sizing: border-box;
                    box-sizing: border-box;
                    height: 32px;
                    line-height: 18px;
                    padding: 6px 32px 6px 10px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    cursor: pointer;
                    display: block;
                    font-family: RobotoRegular;
                    font-size: 15px;
                    color: #000;
                    background-image: url(../img/paczkomatArrow.png);
                    background-repeat: no-repeat;
                    background-position: 280px center;

                    &.inactive {
                        opacity: 0.5;
                        cursor: default;
                    }
                }

                .custom-dropdown {
                    display: none;
                    position: absolute;
                    width: 100%;
                    max-height: 300px;
                    overflow-y: hidden; //auto;
                    overflow-x: hidden;
                    border: 1px solid #bbb;
                    -webkit-border-radius: 0 0 4px 4px;
                    -moz-border-radius: 0 0 4px 4px;
                    border-radius: 0 0 4px 4px;
                    border-top: 0;
                    left: -1px;
                    background-color: #fff;


                    input[type="text"] {
                        padding: 0 13px 0 35px;
                        display: block;
                        width: 236px;
                        height: 32px;
                        border: 1px solid #7a7a7a;
                        background-image: url(../img/PickUpPlaceSearchIcon.jpg);
                        background-repeat: no-repeat;
                        background-position: 5px center;
                        color: #3e3e3e;
                        font-family: "RobotoLight";
                        font-size: 14px;
                        line-height: 32px;
                        margin-left: 7px;
                        -webkit-border-radius: 2px;
                        -moz-border-radius: 2px;
                        border-radius: 2px;
                        margin-bottom: 5px;
                    }


                    .paczkomat-list {
                        position: relative;
                        max-height: 258px;
                        overflow-x: hidden;
                        overflow-y: auto;

                        .paczkomat-place-box {
                            display: block;
                            float: left;
                            width: 92%;
                            padding: 4px 4%;
                            cursor: pointer;

                            input {
                                display: none;
                            }

                            label {
                                margin: 0;
                                padding: 0;
                                font-family: RobotoLight;
                                font-size: 14px;
                                color: #000;
                                cursor: pointer;
                            }

                            &:hover {
                                background-color: #eee;
                            }
                        }
                    }
                }
            }
        }
    }

    #PickUpMapPL {
        width: 100%;
        height: 358px;
        float: left;
        margin-top: 18px;
        background-image: url(../img/defaultMapImagePL.jpg?v=1);
        background-position: center;
        background-repeat: no-repeat;

        &.active {
            background-image: none;
        }
    }

    #PickUpMap {
        width: 410px;
        height: 432px; //415px;
        background-color: #e9e5dc;
        float: right;
    }

    #PickUpMapLegend {
        background-color: transparent;
        display: none;

        div {
            background-color: #fff;
            -webkit-border-radius: 2px;
            -moz-border-radius: 2px;
            border-radius: 2px;
            box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);
            margin: 10px 10px;
            padding: 10px;

            h6 {
                color: #20648b;
                font-family: "Arial";
                font-size: 15px;
            }

            span {
                color: #4c4c4c;
                font-family: "Arial";
                font-size: 13px;
            }
        }
    }

    .btns-wrap {
        text-align: center;

        span {
            display: inline-block;
            padding: 0px 10px;
            cursor: pointer;
            text-align: center;
            width: auto;
            height: 46px;
            line-height: 46px;

            &.pickup-close {
                float: left;
                color: #2c2c2c;
                font-family: "RobotoMedium";
                font-size: 17px;
                background-color: #e8e8e8;
                border: 1px solid #d8d8d8 !important;
                background-image: none;
                position: static;

                &:hover {
                    background-color: #d8d8d8;
                }

                &.pl {
                    em {
                        font-style: normal;

                        &.normal {
                            display: block;
                        }

                        &.alter {
                            display: none;
                        }
                    }
                }
            }

            &.pickup-submit {
                color: #fff; /* text color */
                font-family: "RobotoMedium";
                font-size: 17px;
                float: right;
                border: 1px solid #229f91;
                background-color: #21b5a4;

                &:hover {
                    background-color: #229f91;
                }
            }
        }

        p.validation-error {
            display: none;
            margin: 0;
            height: 48px;
            line-height: 48px;

            img {
                float: left;
                margin-top: 14px;
                margin-right: 7px;
            }

            span {
                display: inline-block;
                padding: 0;
                cursor: default;
                height: 48px;
                line-height: 48px;
                float: left;
                color: #f00; /* text color */
                font-family: "RobotoLight";
                font-size: 17px;
            }
        }
    }
}

.send-form#second-step.PL {
    label {
        font-size: 14px;
    }

    .radio-box {
        .deliveryGroup, .paymentGroup {
            .box-wrap.subline {
                label, strong {
                    margin-top: -5px;
                }

                .tooltip-trigger {
                    top: 10px;
                }

                span {
                    color: red;
                    float: left;
                    margin-left: 99px;
                    font-size: 11px;
                }
            }
        }
    }
}

.pickup-map-legend-wrap {
    left: 454px;
    position: absolute;

    @media only screen and (max-width: 989px) {
        left: 440px;
        top: 60px;
    }
}

/* 1360- */
@media(max-width: 1359px) {
    .send-form#second-step {
        width: 970px;
        margin-left: -60px;

        .radio-box {
            margin: 0 0px 20px 26px;

            &.transport-box {
                margin-left: 27px;
            }
        }
    }
}

/* 800 */
@media(max-width: 989px) {
    .send-form#second-step {
        width: 100%;
        margin-left: 0px;

        .radio-box {
            display: inline-block;
            float: none;
            margin: 0 0 20px 0 !important;
            text-align: left;

            &.transport-box {
                margin-right: 40px;
            }
        }
    }

    #PickUpPlacesHidden {
        width: auto;
        height: auto !important;
        padding: 35px 20px 113px 440px;
        /* top: 2%;
        bottom: 2%;*/
        left: 0;
        right: 0;

        &.display {
            display: block !important;
            margin-left: auto;
            height: 400px !important;

            &.pl {
                padding: 35px 20px;
                height: auto !important;
            }
        }

        .pickup-close {
            top: -30px;
            right: -15px;
        }

        h2 {
            position: absolute;
            left: 20px;
            top: 20px;
        }

        .pickup-info {
            position: absolute;
            left: 20px;
            top: 60px;
            height: auto;
            bottom: 88px;
            padding-top: 85px;

            #PickUpInput {
                position: absolute;
                top: 0;
            }

            .info-helper {
                position: absolute;
                top: 44px;
                margin-top: 0px;
            }

            #pickup-list {
                height: auto;
                margin-top: 0;
                float: left;
                padding-right: 10px;
                max-height: 100%;
            }

            &.pl {
                width: 100%;
                top: 0;
                position: relative;
                padding: 0;
                left: 0;
                bottom: 0;
            }
        }

        #PickUpMapPL {
            margin-bottom: 40px;
        }

        #PickUpMap {
            width: 100%;
            height: 100%;
        }

        .btns-wrap {
            position: absolute;
            left: 20px;
            right: 20px;
            bottom: 20px;
        }
    }
}

/* 640 */
@media ( max-width: 799px ) {
    .radio-box {

        &.transport-box {
            //   margin-right: 20px;
        }
    }
}

/* 640 - helper */
@media ( max-width: 735px ) {
    .radio-box {

        &.transport-box {
            margin-right: 0px;
        }
    }

    #PickUpPlacesHiddenOverlay {
        #PickUpPlacesWrapper {
            box-sizing: border-box;
            height: 100%;
            padding: 10px;
            width: 100%;
        }
    }

    #PickUpPlacesHidden {
        right: auto;
        padding: 20px 20px;
        width: 410px;

        &.pl {
            h2.pickup-title {
                top: auto !important;
            }
        }

        &.display {
            height: 500px !important;

            &.valid-error {
                height: 550px !important;

                .pickup-info {
                    bottom: 138px;
                }
            }
        }

        .pickup-close {
            top: -20px;
        }

        h2 {
            left: 20px;
            right: 20px;
            width: auto;
        }

        .pickup-info {
            &.pl {
                width: 100%;

                #PaczkomatCityContentBox,
                #PaczkomatBoxContentBox {
                    width: 100%;
                    float: left;
                }
            }
        }

        #PickUpMap {
            display: none !important;
            height: 0 !important;
            width: 0 !important;
        }

        #PickUpMapLegend {
            display: none !important;
        }

        .btns-wrap {
            span.pl {
                font-size: 14px !important;
            }
        }
    }
}

/* 320 */
@media ( max-width: 479px ) {
    .radio-box {
        width: 308px;

        .deliveryGroup, .paymentGroup {
            width: 300px;

            .box-wrap {
                width: 286px;

                label {
                    clear: both;
                    margin-left: 22px;
                    margin-top: 5px;
                }

                &.placeholder.pickup .selected-address,
                &.zasilkovna-box.zasilkovna .selected-address,
                &.zasilkovna-box.zasilkovnahu .selected-address,
                &.zasilkovna-box.zasilkovnaro .selected-address,
                &.pickup-point-4h.pc .selected-address,
                &.all-pickup-points.aggregate-pickup .available-pickup-points,
                &.all-pickup-points.aggregate-pickup .selected-address,
                &.pickup-points.aggregate-pickup .selected-address {
                    margin-left: 22px;
                }

                &.all-pickup-points.aggregate-pickup {
                    .pickup-point-title {
                        margin-top: 5px !important;
                    }

                    .available-pickup-points {
                        margin-bottom: 5px;
                    }
                }

                &.placeholder.other-payments {
                    label {
                        clear: none;
                        margin-top: 2px;

                        span {
                            display: none !important;

                            &.alter {
                                display: inline-block !important;
                            }
                        }
                    }
                }

                &.placeholder.pickup.active label {
                    margin-top: 10px;
                }

                &.zasilkovna-box.zasilkovna.active,
                &.zasilkovna-box.zasilkovnahu.active,
                &.zasilkovna-box.zasilkovnaro.active,
                &.pickup-point-4h.pc,
                &.all-pickup-points.aggregate-pickup.active,
                &.pickup-points.aggregate-pickup.active {
                    label {
                        margin-top: 0;
                    }

                    strong.price {
                        margin-top: 0;
                    }
                }

                &.all-pickup-points.aggregate-pickup.active {
                    .pickup-point-title {
                        margin-top: 8px !important;
                    }

                    .available-pickup-points {
                        margin-bottom: 5px;
                    }

                    .selected-address {
                        float: none;
                        width: 100%;
                    }
                }

                &.paczkomat-box,
                &.pickup-points {
                    .selected-address {
                        margin-left: 22px;
                    }

                    label.pl-info {
                        margin-left: 22px !important;
                    }
                }

                &.active {
                    &#TwistoPayment {
                        height: 130px;
                    }
                }
            }

            .subgroup {
                width: 300px;

                .box-wrap {
                    width: 286px;
                }
            }
        }

        .deliveryGroup {
            .box-wrap {
                .christmas-delivery-guarantee-tree {
                    float: right;
                    margin: 9px 22px 0 0;
                }

                &.pickup {
                    .christmas-delivery-guarantee-tree {
                        float: right;
                        margin: 9px 22px 0 0;
                    }
                }
            }
        }
    }

    /*#PickUpPlacesHidden {
        width: 94%;
        padding: 20px 2%;
        left: 1%;
        right: 1%;*/

    #PickUpPlacesHiddenOverlay {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 100;
        display: none;
        background: rgba(0, 0, 0, 0.3);
        overflow-y: auto;
        overflow-x: hidden;
        padding: 0 0;
        width: 100%;
        height: 100%;

        #PickUpPlacesWrapper {
            box-sizing: border-box;
            height: 100%;
            padding: 10px;
            width: 100%;
        }
    }

    #PickUpPlacesHidden {
        display: none;
        position: relative;
        z-index: 1000;
        width: 839px;
        max-width: 100%;
        height: 529px;
        background-color: #fff;
        padding: 25px;
        //top: 20px;
        margin-bottom: 20px;
        margin-left: -50000px;
        top: 0;

        &.display {
            //margin-left: 0 !important;
            //height: 320px !important;
            box-sizing: border-box;
            height: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            width: 100% !important;
            /*&.pl {
                padding: 35px 2%;
            }*/
        }

        .pickup-close {
            //right: -5px;
            //background-image: none;
            //width: 1px;
            //padding: 0;
            background-position: 11px 7px;
            height: 20px;
            padding: 10px !important;
            right: 0 !important;
            top: 0 !important;
            width: 20px;
            z-index: 1;
        }

        h2.pickup-title {
            //font-size: 18px !important;
            //top: 30px !important;
            //left: 2%;
            font-size: 17px !important;
            left: 10px !important;
            margin: 0 !important;
            top: 10px !important;
        }

        &.pl {
            h2.pickup-title {
                font-size: 17px !important;
                left: 10px !important;
                margin: 0 !important;
                top: 10px !important;

                span {
                    display: none !important;
                }
            }
        }

        .pickup-info {
            //left: 2%;
            //right: 2%;
            width: auto;
            bottom: 68px;
            padding-top: 50px;
            left: 10px !important;
            right: 10px !important;
            top: 40px !important;

            #PickUpInput {
                width: 88%;
                padding: 0 2% 0 10%;
                left: 0 !important;
                right: 0 !important;
                position: absolute;
                margin-left: -1px;
            }

            .info-helper {
                display: none;

                img {
                    float: left;
                    margin-right: 2px;
                    margin-left: 7px;
                }

                span {
                    float: left;
                    height: 25px;
                    line-height: 25px;
                    color: #242424;
                    font-family: "RobotoLight";
                    font-size: 10px;
                }
            }

            #pickup-list {
                //padding-right: 10px;
                //height: auto; //330px;
                margin-top: 0;
                float: left;
                max-height: 100%;
                box-sizing: border-box;
                height: auto !important;
                padding-right: 0 !important;
                width: 100%;

                .box-wrap {
                    background-image: none !important;
                    background-color: #fff;
                    float: left;
                    width: 100%;
                    //height: 30px;
                    //line-height: 30px;
                    border: 4px solid #fff;
                    cursor: pointer;
                    //min-width: 278px;
                    box-sizing: border-box;
                    min-width: 1px;
                    height: 38px;

                    img {
                        margin: 0 3px;
                        display: none;
                    }

                    label {
                        font-size: 11px !important;
                        max-width: 220px !important;
                        padding-left: 10px;

                        &.pickUpHk {
                            margin-top: 0;
                        }
                    }

                    p.express-delivery {
                        display: none;
                    }

                    strong.price {
                        padding-right: 2px;
                        font-size: 10px;
                    }
                }
            }

            &.pl {
                top: auto !important;
            }
        }

        #PickUpMapPL {
            width: 100%;
            height: 230px;
        }

        .btns-wrap {
            position: absolute;
            /*left: 2%;
            right: 2%;
            bottom: 20px;
            min-width: 296px;*/
            bottom: 10px;
            left: 10px;
            min-width: 1px;
            right: 10px;

            span {
                font-size: 14px !important;
                height: 36px;
                line-height: 36px;
                padding: 0 3px;

                &.pickup-close {
                    padding: 0 3px !important;
                }

                &.pl {
                    font-size: 14px !important;
                    padding: 0 9px;

                    em {
                        &.normal {
                            display: none !important;
                        }

                        &.alter {
                            display: block !important;
                        }
                    }
                }
            }
        }
    }

    .send-form#second-step.PL {


        .radio-box {
            .deliveryGroup, .paymentGroup {
                .box-wrap.subline {
                    label {
                        margin-top: 2px;
                    }

                    .tooltip-trigger {
                        //  top: 10px;
                    }

                    span {
                        color: red;
                        float: left;
                        margin-left: 22px;
                        font-size: 9px;
                    }
                }
            }
        }
    }
}

@media only screen and (max-width: 360px) {
    #PickUpPlacesHidden {
        h2 {
            &.pickup-title {
                font-size: 14px !important;
            }
        }
    }
}