@charset "UTF-8";
/**
 * Copyright © MageWorx. All rights reserved.
 * See LICENSE.txt for license details.
 */

.shipping-zone-selector .modal-content:before,
.shipping-zone-selector .modal-content:after {
    content: "";
    display: table;
}

.shipping-zone-selector .modal-content:after {
    clear: both;
}

#sz-main-container {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
#sz-main-container .slick-prev,
#sz-main-container .slick-next {
    width: 20px;
    height: 20px;
    opacity: 0.6;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}
#sz-main-container .slick-prev:hover,
#sz-main-container .slick-next:hover {
    opacity: 1;
}
#sz-main-container .slick-prev:before,
#sz-main-container .slick-next:before {
    display: none;
}
#sz-main-container .slick-prev {
    background: url(../image/left-arrow.svg) center center/contain no-repeat;
    left: -20px;
}
#sz-main-container .slick-next {
    background: url(../image/right-arrow.svg) center center/contain no-repeat;
    right: -20px;
}

.shipping-zone-location-container {
    position: relative;
    float: right;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    margin-left: 15px;
    vertical-align: top;
    top: 1px;
    display: inline-block;
    speak: none;
    text-align: center;
}

.shipping-zone-selector {
    overflow-y: scroll;
}
.shipping-zone-selector .page-main-actions {
    margin-bottom: 50px;
}

#select-shipping-zone {
    position: relative;
    max-width: 300px;
    height: 30px;
    display: block;
    top: -1px;
    cursor: pointer;
    text-decoration: none;
    font-size: 16px;
    color: black;
    padding: 0 50px 0 20px;
    border: 1px solid #c2c2c2;
    line-height: 30px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
#select-shipping-zone:after {
    content: "";
    width: 9px;
    height: 18px;
    display: block;
    position: absolute;
    right: 10px;
    top: 6px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAABICAMAAACtHXe2AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAgVBMVEUAAACIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4eIh4f///8hxX0YAAAAKXRSTlMAQuL2iwHVl+BreIiGepNtn2kDpXGap/0Gs7KcZVusYKGVfvTnT+jze4gO2XIAAAABYktHRCpTvtSeAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAoUlEQVRIx+3V2w6CMBAE0HqpQOsFUASvqCi6//+DhvYDZkgI+tB9PslmNtmMmkxnc63gLEQkwi4WyiXCOfNbB+N6Z6Fbks4GN6JbQbd2ziCmo+BGdBvoUucy5PJtL7cjXQHdvmMlYtWBYdXRLT0xqjxT6vJvKr9Syp+/plQW1JBK3yjlHzihlAlqSKXulLI9FCraB1fHDVfaT0qpV/v+YPUFNJlBKmX9iOsAAAAASUVORK5CYII=") center center/cover no-repeat;
}
#select-shipping-zone .sz-inner span {
    color: #d00616;
}

.mageworx-extended-zones .zone_name {
    display: inline-block;
    font-size: 1em;
    font-weight: 300;
    text-transform: uppercase;
    color: black;
    padding-bottom: 10px;
}
.mageworx-extended-zones .selected .zone_name {
    font-weight: bold;
    border-bottom: 3px solid black;
}

.shipping-zone-selector .sz-left-content, .shipping-zone-selector .sz-right-content {
    float: left;
    width: 100%;
    clear: both;
}

.mageworx-extended-zones .sz-square {
    width: 170px;
    position: relative;
}

.mageworx-extended-zones .sz-square.no-image .zone_name {
    font-size: 1.5em;
}

.mageworx-extended-zones .sz-square.no-image .zone {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.mageworx-extended-zones .sz-square .zone .sz-table .sz-table-cell {
    text-align: center;
}

#sz-select-address-container {
    display: table;
    margin: 0 auto;
    padding: 15px 0;
}

#sz-main-container .slick-track {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    min-height: 200px;
}

#sz-main-container .slick-track .slick-slide {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    height: auto;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
}

.sz-fields-container {
    text-align: center;
}
.sz-fields-container hr {
    width: 100%;
    background-color: #ddd;
    margin: 0;
}
.sz-fields-container .field-wrapper {
    display: table-row;
    margin-top: 2.1rem;
}
.sz-fields-container .field-wrapper .field,
.sz-fields-container .field-wrapper .control {
    display: table-cell;
}
.sz-fields-container .field-wrapper .field {
    width: 150px;
    padding-right: 15px;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
    padding-bottom: 10px;
    text-align: right;
    color: black;
}
.sz-fields-container .field-wrapper .field:last-child {
    padding-bottom: 0;
}
.sz-fields-container .fieldset {
    width: 100%;
    max-width: 1000px;
    text-align: center;
    margin: 0 auto;
}

.zone_image {
    width: 100%;
    margin: 0 auto;
    max-width: 140px;
    padding: 5px;
    border-radius: 50%;
    border: 1px solid #e0e0e0;
}

.sz-icon {
    position: relative;
    top: -3px;
    display: inline-block;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    margin-right: 10px;
}
.sz-icon .flag {
    background: red;
}

@media only screen and (max-width: 900px) {
    #sz-main-container {
        width: auto;
        margin: 0 5%;
    }

    #select-shipping-zone {
        padding: 0 4px;
        margin-right: 10px;
    }
    #select-shipping-zone:after {
        display: none;
    }
    #select-shipping-zone .sz-inner {
        display: none;
    }
    #select-shipping-zone .sz-icon {
        margin-right: 0;
    }
}
@media only screen and (max-width: 768px) {
    .shipping-zone-location-container {
        margin-left: 0;
    }

    #select-shipping-zone {
        margin-left: 0;
    }
}
@media only screen and (max-width: 639px) {
    #select-shipping-zone {
        margin-top: 10px;
    }
}
@media only screen and (max-width: 600px) {
    #sz-select-address-container {
        width: 100%;
        text-align: center;
    }

    .sz-fields-container .field-wrapper {
        display: block;
    }
    .sz-fields-container .field-wrapper .field {
        display: inline-block;
        text-align: center;
    }
    .sz-fields-container .field-wrapper .control {
        display: block;
    }
}
.flag {
    background: url(../image/flags32.png) no-repeat;
}
.flag._African_Union {
    background-position: 0 -32px;
}
.flag._Arab_League {
    background-position: 0 -64px;
}
.flag._ASEAN {
    background-position: 0 -96px;
}
.flag._CARICOM {
    background-position: 0 -128px;
}
.flag._CIS {
    background-position: 0 -160px;
}
.flag._Commonwealth {
    background-position: 0 -192px;
}
.flag._England {
    background-position: 0 -224px;
}
.flag._European_Union {
    background-position: 0 -256px;
}
.flag._Islamic_Conference {
    background-position: 0 -288px;
}
.flag._Kosovo {
    background-position: 0 -320px;
}
.flag._NATO {
    background-position: 0 -352px;
}
.flag._Northern_Cyprus {
    background-position: 0 -384px;
}
.flag._Northern_Ireland {
    background-position: 0 -416px;
}
.flag._Olimpic_Movement {
    background-position: 0 -448px;
}
.flag._OPEC {
    background-position: 0 -480px;
}
.flag._Red_Cross {
    background-position: 0 -512px;
}
.flag._Scotland {
    background-position: 0 -544px;
}
.flag._Somaliland {
    background-position: 0 -576px;
}
.flag._Tibet {
    background-position: 0 -608px;
}
.flag._United_Nations {
    background-position: 0 -640px;
}
.flag._Wales {
    background-position: 0 -672px;
}
.flag
.flag.eu {
    background-position: 0 -256px;
}
.flag
.flag.ad {
    background-position: 0 -704px;
}
.flag.ae {
    background-position: 0 -736px;
}
.flag.af {
    background-position: 0 -768px;
}
.flag.ag {
    background-position: 0 -800px;
}
.flag.ai {
    background-position: 0 -832px;
}
.flag.al {
    background-position: 0 -864px;
}
.flag.am {
    background-position: 0 -896px;
}
.flag.ao {
    background-position: 0 -928px;
}
.flag.aq {
    background-position: 0 -960px;
}
.flag.ar {
    background-position: 0 -992px;
}
.flag.as {
    background-position: 0 -1024px;
}
.flag.at {
    background-position: 0 -1056px;
}
.flag.au {
    background-position: 0 -1088px;
}
.flag.aw {
    background-position: 0 -1120px;
}
.flag.ax {
    background-position: 0 -1152px;
}
.flag.az {
    background-position: 0 -1184px;
}
.flag.ba {
    background-position: 0 -1216px;
}
.flag.bb {
    background-position: 0 -1248px;
}
.flag.bd {
    background-position: 0 -1280px;
}
.flag.be {
    background-position: 0 -1312px;
}
.flag.bf {
    background-position: 0 -1344px;
}
.flag.bg {
    background-position: 0 -1376px;
}
.flag.bh {
    background-position: 0 -1408px;
}
.flag.bi {
    background-position: 0 -1440px;
}
.flag.bj {
    background-position: 0 -1472px;
}
.flag.bm {
    background-position: 0 -1504px;
}
.flag.bn {
    background-position: 0 -1536px;
}
.flag.bo {
    background-position: 0 -1568px;
}
.flag.br {
    background-position: 0 -1600px;
}
.flag.bs {
    background-position: 0 -1632px;
}
.flag.bt {
    background-position: 0 -1664px;
}
.flag.bw {
    background-position: 0 -1696px;
}
.flag.by {
    background-position: 0 -1728px;
}
.flag.bz {
    background-position: 0 -1760px;
}
.flag.ca {
    background-position: 0 -1792px;
}
.flag.cd {
    background-position: 0 -1824px;
}
.flag.cf {
    background-position: 0 -1856px;
}
.flag.cg {
    background-position: 0 -1888px;
}
.flag.ch {
    background-position: 0 -1920px;
}
.flag.ci {
    background-position: 0 -1952px;
}
.flag.ck {
    background-position: 0 -1984px;
}
.flag.cl {
    background-position: 0 -2016px;
}
.flag.cm {
    background-position: 0 -2048px;
}
.flag.cn {
    background-position: 0 -2080px;
}
.flag.co {
    background-position: 0 -2112px;
}
.flag.cr {
    background-position: 0 -2144px;
}
.flag.cu {
    background-position: 0 -2176px;
}
.flag.cv {
    background-position: 0 -2208px;
}
.flag.cy {
    background-position: 0 -2240px;
}
.flag.cz {
    background-position: 0 -2272px;
}
.flag.de {
    background-position: 0 -2304px;
}
.flag.dj {
    background-position: 0 -2336px;
}
.flag.dk {
    background-position: 0 -2368px;
}
.flag.dm {
    background-position: 0 -2400px;
}
.flag.do {
    background-position: 0 -2432px;
}
.flag.dz {
    background-position: 0 -2464px;
}
.flag.ec {
    background-position: 0 -2496px;
}
.flag.ee {
    background-position: 0 -2528px;
}
.flag.eg {
    background-position: 0 -2560px;
}
.flag.eh {
    background-position: 0 -2592px;
}
.flag.er {
    background-position: 0 -2624px;
}
.flag.es {
    background-position: 0 -2656px;
}
.flag.et {
    background-position: 0 -2688px;
}
.flag.fi {
    background-position: 0 -2720px;
}
.flag.fj {
    background-position: 0 -2752px;
}
.flag.fm {
    background-position: 0 -2784px;
}
.flag.fo {
    background-position: 0 -2816px;
}
.flag.fr {
    background-position: 0 -2848px;
}
.flag.bl {
    background-position: 0 -2848px;
}
.flag.cp {
    background-position: 0 -2848px;
}
.flag.mf {
    background-position: 0 -2848px;
}
.flag.yt {
    background-position: 0 -2848px;
}
.flag.ga {
    background-position: 0 -2880px;
}
.flag.gb {
    background-position: 0 -2912px;
}
.flag.sh {
    background-position: 0 -2912px;
}
.flag.gd {
    background-position: 0 -2944px;
}
.flag.ge {
    background-position: 0 -2976px;
}
.flag.gg {
    background-position: 0 -3008px;
}
.flag.gh {
    background-position: 0 -3040px;
}
.flag.gi {
    background-position: 0 -3072px;
}
.flag.gl {
    background-position: 0 -3104px;
}
.flag.gm {
    background-position: 0 -3136px;
}
.flag.gn {
    background-position: 0 -3168px;
}
.flag.gp {
    background-position: 0 -3200px;
}
.flag.gq {
    background-position: 0 -3232px;
}
.flag.gr {
    background-position: 0 -3264px;
}
.flag.gt {
    background-position: 0 -3296px;
}
.flag.gu {
    background-position: 0 -3328px;
}
.flag.gw {
    background-position: 0 -3360px;
}
.flag.gy {
    background-position: 0 -3392px;
}
.flag.hk {
    background-position: 0 -3424px;
}
.flag.hn {
    background-position: 0 -3456px;
}
.flag.hr {
    background-position: 0 -3488px;
}
.flag.ht {
    background-position: 0 -3520px;
}
.flag.hu {
    background-position: 0 -3552px;
}
.flag.id {
    background-position: 0 -3584px;
}
.flag.mc {
    background-position: 0 -3584px;
}
.flag.ie {
    background-position: 0 -3616px;
}
.flag.il {
    background-position: 0 -3648px;
}
.flag.im {
    background-position: 0 -3680px;
}
.flag.in {
    background-position: 0 -3712px;
}
.flag.iq {
    background-position: 0 -3744px;
}
.flag.ir {
    background-position: 0 -3776px;
}
.flag.is {
    background-position: 0 -3808px;
}
.flag.it {
    background-position: 0 -3840px;
}
.flag.je {
    background-position: 0 -3872px;
}
.flag.jm {
    background-position: 0 -3904px;
}
.flag.jo {
    background-position: 0 -3936px;
}
.flag.jp {
    background-position: 0 -3968px;
}
.flag.ke {
    background-position: 0 -4000px;
}
.flag.kg {
    background-position: 0 -4032px;
}
.flag.kh {
    background-position: 0 -4064px;
}
.flag.ki {
    background-position: 0 -4096px;
}
.flag.km {
    background-position: 0 -4128px;
}
.flag.kn {
    background-position: 0 -4160px;
}
.flag.kp {
    background-position: 0 -4192px;
}
.flag.kr {
    background-position: 0 -4224px;
}
.flag.kw {
    background-position: 0 -4256px;
}
.flag.ky {
    background-position: 0 -4288px;
}
.flag.kz {
    background-position: 0 -4320px;
}
.flag.la {
    background-position: 0 -4352px;
}
.flag.lb {
    background-position: 0 -4384px;
}
.flag.lc {
    background-position: 0 -4416px;
}
.flag.li {
    background-position: 0 -4448px;
}
.flag.lk {
    background-position: 0 -4480px;
}
.flag.lr {
    background-position: 0 -4512px;
}
.flag.ls {
    background-position: 0 -4544px;
}
.flag.lt {
    background-position: 0 -4576px;
}
.flag.lu {
    background-position: 0 -4608px;
}
.flag.lv {
    background-position: 0 -4640px;
}
.flag.ly {
    background-position: 0 -4672px;
}
.flag.ma {
    background-position: 0 -4704px;
}
.flag.md {
    background-position: 0 -4736px;
}
.flag.me {
    background-position: 0 -4768px;
}
.flag.mg {
    background-position: 0 -4800px;
}
.flag.mh {
    background-position: 0 -4832px;
}
.flag.mk {
    background-position: 0 -4864px;
}
.flag.ml {
    background-position: 0 -4896px;
}
.flag.mm {
    background-position: 0 -4928px;
}
.flag.mn {
    background-position: 0 -4960px;
}
.flag.mo {
    background-position: 0 -4992px;
}
.flag.mq {
    background-position: 0 -5024px;
}
.flag.mr {
    background-position: 0 -5056px;
}
.flag.ms {
    background-position: 0 -5088px;
}
.flag.mt {
    background-position: 0 -5120px;
}
.flag.mu {
    background-position: 0 -5152px;
}
.flag.mv {
    background-position: 0 -5184px;
}
.flag.mw {
    background-position: 0 -5216px;
}
.flag.mx {
    background-position: 0 -5248px;
}
.flag.my {
    background-position: 0 -5280px;
}
.flag.mz {
    background-position: 0 -5312px;
}
.flag.na {
    background-position: 0 -5344px;
}
.flag.nc {
    background-position: 0 -5376px;
}
.flag.ne {
    background-position: 0 -5408px;
}
.flag.ng {
    background-position: 0 -5440px;
}
.flag.ni {
    background-position: 0 -5472px;
}
.flag.nl {
    background-position: 0 -5504px;
}
.flag.bq {
    background-position: 0 -5504px;
}
.flag.no {
    background-position: 0 -5536px;
}
.flag.bv {
    background-position: 0 -5536px;
}
.flag.nq {
    background-position: 0 -5536px;
}
.flag.sj {
    background-position: 0 -5536px;
}
.flag.np {
    background-position: 0 -5568px;
}
.flag.nr {
    background-position: 0 -5600px;
}
.flag.nz {
    background-position: 0 -5632px;
}
.flag.om {
    background-position: 0 -5664px;
}
.flag.pa {
    background-position: 0 -5696px;
}
.flag.pe {
    background-position: 0 -5728px;
}
.flag.pf {
    background-position: 0 -5760px;
}
.flag.pg {
    background-position: 0 -5792px;
}
.flag.ph {
    background-position: 0 -5824px;
}
.flag.pk {
    background-position: 0 -5856px;
}
.flag.pl {
    background-position: 0 -5888px;
}
.flag.pr {
    background-position: 0 -5920px;
}
.flag.ps {
    background-position: 0 -5952px;
}
.flag.pt {
    background-position: 0 -5984px;
}
.flag.pw {
    background-position: 0 -6016px;
}
.flag.py {
    background-position: 0 -6048px;
}
.flag.qa {
    background-position: 0 -6080px;
}
.flag.re {
    background-position: 0 -6112px;
}
.flag.ro {
    background-position: 0 -6144px;
}
.flag.rs {
    background-position: 0 -6176px;
}
.flag.ru {
    background-position: 0 -6208px;
}
.flag.rw {
    background-position: 0 -6240px;
}
.flag.sa {
    background-position: 0 -6272px;
}
.flag.sb {
    background-position: 0 -6304px;
}
.flag.sc {
    background-position: 0 -6336px;
}
.flag.sd {
    background-position: 0 -6368px;
}
.flag.se {
    background-position: 0 -6400px;
}
.flag.sg {
    background-position: 0 -6432px;
}
.flag.si {
    background-position: 0 -6464px;
}
.flag.sk {
    background-position: 0 -6496px;
}
.flag.sl {
    background-position: 0 -6528px;
}
.flag.sm {
    background-position: 0 -6560px;
}
.flag.sn {
    background-position: 0 -6592px;
}
.flag.so {
    background-position: 0 -6624px;
}
.flag.sr {
    background-position: 0 -6656px;
}
.flag.st {
    background-position: 0 -6688px;
}
.flag.sv {
    background-position: 0 -6720px;
}
.flag.sy {
    background-position: 0 -6752px;
}
.flag.sz {
    background-position: 0 -6784px;
}
.flag.tc {
    background-position: 0 -6816px;
}
.flag.td {
    background-position: 0 -6848px;
}
.flag.tg {
    background-position: 0 -6880px;
}
.flag.th {
    background-position: 0 -6912px;
}
.flag.tj {
    background-position: 0 -6944px;
}
.flag.tl {
    background-position: 0 -6976px;
}
.flag.tm {
    background-position: 0 -7008px;
}
.flag.tn {
    background-position: 0 -7040px;
}
.flag.to {
    background-position: 0 -7072px;
}
.flag.tr {
    background-position: 0 -7104px;
}
.flag.tt {
    background-position: 0 -7136px;
}
.flag.tv {
    background-position: 0 -7168px;
}
.flag.tw {
    background-position: 0 -7200px;
}
.flag.tz {
    background-position: 0 -7232px;
}
.flag.ua {
    background-position: 0 -7264px;
}
.flag.ug {
    background-position: 0 -7296px;
}
.flag.us {
    background-position: 0 -7328px;
}
.flag.uy {
    background-position: 0 -7360px;
}
.flag.uz {
    background-position: 0 -7392px;
}
.flag.va {
    background-position: 0 -7424px;
}
.flag.vc {
    background-position: 0 -7456px;
}
.flag.ve {
    background-position: 0 -7488px;
}
.flag.vg {
    background-position: 0 -7520px;
}
.flag.vi {
    background-position: 0 -7552px;
}
.flag.vn {
    background-position: 0 -7584px;
}
.flag.vu {
    background-position: 0 -7616px;
}
.flag.ws {
    background-position: 0 -7648px;
}
.flag.ye {
    background-position: 0 -7680px;
}
.flag.za {
    background-position: 0 -7712px;
}
.flag.zm {
    background-position: 0 -7744px;
}
.flag.zw {
    background-position: 0 -7776px;
}
.flag.sx {
    background-position: 0 -7808px;
}
.flag.cw {
    background-position: 0 -7840px;
}
.flag.ss {
    background-position: 0 -7872px;
}
.flag.nu {
    background-position: 0 -7904px;
}
