/*
    Copyright (c) Just Eat, 2016. All rights reserved.
    Licensed under the Apache 2.0 license. See the LICENSE file in the project root for full license information.
*/ 

div.apple-pay {max-width: 325px;width: 50px;height: 30px;}
.new-apple-pay-25 div.apple-pay {max-width: unset;}

.en.apple-pay {
   /*text-align:left !important;*/
   width:20px;
   position:relative;
   /*left:-10px;*/
}
.ar.apple-pay {
   /*text-align:right !important;*/
   width:20px;
   position:relative;
   /*right:-10px;*/
}

@supports (-webkit-appearance: -apple-pay-button) {
    .apple-pay-button {
        display: inline-block;
        /*-webkit-appearance: -apple-pay-button;*/
    }
    .apple-pay-button-black {
        -apple-pay-button-style: black;        
        margin-top:2px;
    }
    .apple-pay-button-white {
        -apple-pay-button-style: white;
    }
    .apple-pay-button-white-with-line {
        -apple-pay-button-style: white-outline;
    }
    .apple-pay-button-with-text {
        display: inline-block;
        -webkit-appearance: -apple-pay-button;
        -apple-pay-button-type: buy;
    }
    .apple-pay-button-with-text > * {
        display: none;
    }
    .apple-pay-button-black-with-text {
        -apple-pay-button-style: black;
    }
    .apple-pay-button-white-with-text {
        -apple-pay-button-style: white;
    }
    .apple-pay-button-white-with-line-with-text {
        -apple-pay-button-style: white-outline;
    }
}

@supports not (-webkit-appearance: -apple-pay-button) {
    .apple-pay-button {
        display: inline-block;
        background-size: 100% 60%;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        border-radius: 5px;
        padding: 0px;
        box-sizing: border-box;
        min-width: 200px;
        min-height: 32px;
        max-height: 64px;
    }
    .apple-pay-button-black {
        background-image: -webkit-named-image(apple-pay-logo-white);
        background-color: black;
        margin-top:2px;
    }
    .apple-pay-button-white {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color:#F5F6F8;
    }
    .apple-pay-button-white-with-line {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color: white;
        border: .5px solid black;
    }
    .apple-pay-button-with-text {
        --apple-pay-scale: 1; /* (height / 32) */
        display: inline-flex;
        justify-content: center;
        font-size: 12px;
        border-radius: 5px;
        padding: 0px;
        box-sizing: border-box;
        min-width: 200px;
        min-height: 32px;
        max-height: 42px;
    }
    .apple-pay-button-black-with-text {
        background-color: black;
        color: white;
    }
    .apple-pay-button-white-with-text {
        background-color: white;
        color: black;
    }
    .apple-pay-button-white-with-line-with-text {
        background-color: white;
        color: black;
        border: .5px solid black;
    }
    .apple-pay-button-with-text.apple-pay-button-black-with-text > .logo {
        background-image: -webkit-named-image(apple-pay-logo-white);
        background-color: black;
    }
    .apple-pay-button-with-text.apple-pay-button-white-with-text > .logo {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color: white;
    }
    .apple-pay-button-with-text.apple-pay-button-white-with-line-with-text > .logo {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color: white;
    }
    .apple-pay-button-with-text > .text {
        font-family: -apple-system;
        font-size: calc(1em * var(--apple-pay-scale));
        font-weight: 300;
        align-self: center;
        margin-right: calc(2px * var(--apple-pay-scale));
    }
    .apple-pay-button-with-text > .logo {
        width: calc(35px * var(--scale));
        height: 100%;
        background-size: 100% 60%;
        background-repeat: no-repeat;
        background-position: 0 50%;
        margin-left: calc(2px * var(--apple-pay-scale));
        border: none;
    }
}

.apple-pay-set-up-button {
    display: inline-block;
    -webkit-appearance: -apple-pay-button;
    -apple-pay-button-type: set-up;
}
.apple-pay-set-up-button-black {
    -apple-pay-button-style: black;
}
.apple-pay-set-up-button-white {
    -apple-pay-button-style: white;
}
.apple-pay-setup-button-white-with-line {
    -apple-pay-button-style: white-outline;
}

.apple-pay-donate-button {
    display: inline-block;
    -webkit-appearance: -apple-pay-button;
    -apple-pay-button-type: donate;
}

.apple-pay-donate-button-black {
    -apple-pay-button-style: black;
}

.apple-pay-donate-button-white {
    -apple-pay-button-style: white;
}

.apple-pay-donate-button-white-with-line {
    -apple-pay-button-style: white-outline;
}

/* START new design */
@font-face {
    font-family: "sf-pro-display-regular";
    src: url("fonts/sf-pro-display_regular.otf") format("opentype");
}
@font-face {
    font-family: "sf-pro-display-semibold";
    font-weight: bold;
    src: url("fonts/sf-pro-display_semibold.otf") format("opentype");
}

@font-face {
    font-family: "sf-pro-ar-regular";
    src: url("fonts/SFProAR_regular.otf") format("opentype");
}

@font-face {
    font-family: "sf-pro-ar-semibold";
    font-weight: bold;
    src: url("fonts/SFProAR_semibold.otf") format("opentype");
}
@font-face {
    font-family: "SF Arabic";
    src: url("fonts/SF-Arabic.ttf") format("truetype");
}
.page-header-fixed .page-container.new-apple-pay-25-container {margin-top: unset;}
.new-apple-pay {margin-top: 50px;width: 100%;}
.new-apple-pay.new-apple-pay-25 {margin-top: unset;display: inline-flex !important;align-items: center;justify-content: center;height: calc(var(--vh, 1vh) * 100);width: 100vw;}

.new-apple-section {background: #F2F1F6;border-radius: 10px !important;}
.new-apple-pay-25 .new-apple-section {padding: unset;width: 375px;background-color: #F5F5F5;}

.apple-box-img-section {margin-top: -20px;margin-bottom: -20px;}

.en .new-apple-pay-25 .apple-box-img-section {margin-top: 0px;margin-bottom: 0px;padding: 11px 15px;text-align: right;}
.ar .new-apple-pay-25 .apple-box-img-section {margin-top: 0px;margin-bottom: 0px;padding: 11px 15px;text-align: left;}

.powered-by {font-size: 12px;}

.apple-box-img {width: 100%;}

.new-apple-footer {background: #FFFFFF;padding-bottom: 15px;border-radius: 0px 0px 10px 10px !important;}
.new-apple-pay-25 .new-apple-footer {padding-bottom: 0px;}

.new-apple-pay-25 .new-apple-footer {border-radius: 10px !important;padding: 16px;border-top: 1px solid #EAEAEA;}

.new-apple-footer .apple-btn-container {position: relative;bottom: 20px;width: 100%; text-align:center;}
.new-apple-pay-25 .new-apple-footer .apple-btn-container {bottom: 2px;display: unset;}

.new-apple-footer .pay-by-apple {width:100%;text-align:center;}

.new-apple-footer #apple-pay-button {width:100%;text-align:center;padding-top:0px;margin:0 auto !important;background-color: #000000;border-color: #000000;min-width: 430px;height: 50px !important;line-height: 47px;}
.new-apple-pay-25 .new-apple-footer #apple-pay-button {padding-top:unset;margin: unset !important;background-color: #1B1D21;border-color: unset;border: 1px solid #1B1D21;min-width: unset;height: unset !important;line-height: unset;padding: 12px !important;cursor: pointer;}

.new-apple-footer .footer-payment-confirmation {text-align: center;padding-top: 35px;padding-left: 60px;padding-right: 60px;color: #000;}
.en .new-apple-pay-25 .new-apple-footer .footer-payment-confirmation {text-align: left;padding-top: 0px;padding-left: 0px;padding-right: 0px;padding-bottom: 16px;color: #212121;}
.ar .new-apple-pay-25 .new-apple-footer .footer-payment-confirmation {text-align: right;padding-top: 0px;padding-left: 0px;padding-right: 0px;padding-bottom: 16px;color: #212121;}

.new-apple-footer .footer-payment-confirmation-heading {font-size: 31px;font-weight: bold;}
.new-apple-pay-25 .new-apple-footer .footer-payment-confirmation-heading {font-size: 21px;font-weight: 700;display: flex;justify-content: space-between;align-items: center;}

.new-apple-footer .footer-payment-confirmation-content {font-size: 16px;padding: 23px 34px 54px 34px;font-weight: 600;}
.new-apple-pay-25 .new-apple-footer .footer-payment-confirmation-content {padding: 8px 0;font-weight: 400;}

.new-apple-pay-25 .new-apple-section {box-shadow: 0px 3px 15px #8e8e8e;}

@media (min-width: 1374px) and (max-width: 1418px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 29px;}
    .new-apple-footer #apple-pay-button {min-width: 350px;}
}
@media (min-width: 1324px) and (max-width: 1373px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 28px;}
    .new-apple-footer #apple-pay-button {min-width: 350px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 15px;}
}
@media (min-width: 1283px) and (max-width: 1323px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 27px;}
    .new-apple-footer #apple-pay-button {min-width: 350px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 14px;}
}
@media (min-width: 1146px) and (max-width: 1282px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 23px;}
    .new-apple-footer #apple-pay-button {min-width: 350px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 13px;}
}
@media (min-width: 1078px) and (max-width: 1145px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 21px;}
    
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 320px;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {min-width: unset;max-width: unset;}

    .new-apple-footer .footer-payment-confirmation-content {font-size: 10px;}
}
@media (min-width: 810px) and (max-width: 1080px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 25px;}
    
    .new-apple-footer .footer-payment-confirmation-content {font-size: 14px;padding: 23px 20px 54px 20px;}
    .new-apple-pay-25 .new-apple-footer .footer-payment-confirmation-content {font-size: inherit;}

    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 350px;}
}
@media (min-width: 1009px) and (max-width: 1077px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 19px;}
    
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 260px;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {min-width: unset;max-width: unset;}

    .new-apple-footer .footer-payment-confirmation-content {font-size: 11px;padding: 23px 17px 54px 17px;}
}
@media (min-width: 992px) and (max-width: 1008px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 18px;}
    
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 260px;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {min-width: unset;max-width: unset;}

    .new-apple-footer .footer-payment-confirmation-content {font-size: 8px;}
}
@media (min-width: 768px) and (max-width: 807px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 23px;}

    .new-apple-footer .footer-payment-confirmation-content {font-size: 13px;padding: 23px 15px 54px 15px;}
    .new-apple-pay-25 .new-apple-footer .footer-payment-confirmation-content {font-size: inherit;}
    
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 340px;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {min-width: unset;max-width: unset;}
}
@media (min-width: 481px) and (max-width: 767px) {
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 430px;}
}
@media (min-width: 481px) {
    .new-apple-section {box-shadow: 0px 3px 15px #8e8e8e;}
    
    .ar .new-apple-footer #apple-pay-button {line-height: 46px;}
    .ar .new-apple-pay-25 .new-apple-footer #apple-pay-button {line-height: unset;}
}
/* mobile size */
@media (max-width: 480px) {
    .new-apple-pay {margin-top: 0px;padding: 0;}

    .new-apple-section {border-radius: 0px !important;padding-left: 0;padding-right: 0;}
    .new-apple-pay-25 .new-apple-section {border-radius: 10px !important;}

    .apple-box-img-section {margin-top: 0px;margin-bottom: -63px;}
    .new-apple-footer {padding-bottom: 0px;}
    .new-apple-footer #apple-pay-button {min-width: unset;height: 50px !important;line-height: 46px;max-width: 380px;}
    
    .ar .new-apple-footer #apple-pay-button {line-height: 46px;}
    .ar .new-apple-pay-25 .new-apple-footer #apple-pay-button {line-height: unset;}

    .new-apple-footer .footer-payment-confirmation {padding-top: 18px;padding-left: 30px;padding-right: 30px;}
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 31px;}
    .new-apple-footer .footer-payment-confirmation-content {padding: 15px 35px 47px 35px;}
}

@media (max-width: 433px) {
    .apple-box-img-section {margin-bottom: -56px;}
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 27px;}
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 350px;}
    
    .new-apple-pay.new-apple-pay-25 {height: unset;}
    .new-apple-pay-25 .new-apple-section {width: 100%;}
    .new-apple-pay.new-apple-pay-25 {position: fixed;bottom: -400px;left: 50%;transform: translateX(-50%);transition: bottom 0.6s ease-out, opacity 0.6s ease-out;z-index: 1000;opacity: 0;}
    .new-apple-pay-25.show {bottom: 0px;opacity: 1;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {min-width: unset;max-width: unset;}
    .new-apple-pay-25 .new-apple-footer {border-radius: 10px 10px 0px 0px !important;}
}
@media (max-width: 391px) {
    .apple-box-img-section {margin-bottom: -51px;}
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 26px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 15px;padding: 15px 26px 47px 26px;}
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 320px;}
}
@media (max-width: 356px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 25px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 14px;padding: 15px 24px 47px 24px;}
}
@media (max-width: 344px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 24px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 14px;padding: 15px 22px 47px 22px;}
}
@media (max-width: 333px) {
    .apple-box-img-section {margin-bottom: -42px;}
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 22px;}
    
    .new-apple-footer .footer-payment-confirmation-content {font-size: 13px;padding: 15px 20px 47px 20px;}
    .new-apple-pay-25 .new-apple-footer .footer-payment-confirmation-content {font-size: inherit;}

    .new-apple-footer #apple-pay-button {min-width: unset !important;max-width: 270px;height: 46px !important;line-height: 42px;}
    .new-apple-pay-25 .new-apple-footer #apple-pay-button {max-width: unset;}

    .ar .new-apple-footer #apple-pay-button {line-height: 43px;}
    .ar .new-apple-pay-25 .new-apple-footer #apple-pay-button {line-height: unset;}
}
@media (max-width: 280px) {
    .new-apple-footer .footer-payment-confirmation-heading {font-size: 21px;}
    .new-apple-footer .footer-payment-confirmation-content {font-size: 12px;}
    .new-apple-footer #apple-pay-button {min-width: unset;max-width: 240px;}
}
/* END new design */