/* fonts */

/* media query */

.view-select-a-country .view-header h1 {

    font-weight: 300;
}

.view-select-a-country ul#region-box {

    width:100%;

    padding: 0.3125rem;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-direction: row;

        flex-direction: row;

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;

    -ms-flex-pack: justify;

        justify-content: space-between;

    -ms-flex-line-pack: justify;

        align-content: space-between;

    -ms-flex-align: stretch;

        align-items: stretch;

    overflow: hidden;
}

.view-select-a-country ul#region-box li {

    -ms-flex-order: 0;

        order: 0;

    -ms-flex: 0 1 auto;

        flex: 0 1 auto;

    -ms-flex-item-align: auto;

        -ms-grid-row-align: auto;

        align-self: auto;

    list-style: none inside;

    margin:0.5rem 1.25% 0.5rem 0;

    height:7.9375rem;

    position: relative;

    display:inline-block;
}

.view-select-a-country ul#region-box li a {

    position: absolute;

    left:0;

    right: 0;

    top:1px;

    z-index:1;

    padding:6.5625rem 0 0 0;

    display:block;

    width:6.25rem;

    margin:0 auto;

    text-decoration:none;

    font-size:12px;

    font-weight:300;

    text-align:center;

    color: #333333;

    background-position:center top;

    background-repeat: no-repeat;

    background-size: 100px 100px;

    transition: all .15s ease;
}

.view-select-a-country ul#region-box li::before {

    content: '';

    position: relative;

    display: block;

    box-shadow: 0 0 10px 0 rgba(127, 127, 127, .25);

    border: .50px solid transparent;

    background-color: #ffffff;

    width: 6.375rem;

    height: 100%;

    z-index: 0;

    margin: 0 auto;

    transition: all .15s ease;
}

.view-select-a-country ul#region-box li:hover::before {

    transition: background-color .35s ease;

    background-color: #839BA9;
}

.view-select-a-country ul#region-box li:hover a {

    transition: color .10s ease;

    color: #ffffff;
}

.view-select-a-country .region-group {

    margin:0 0.625rem 0 0.3125rem;

    background-color: rgba(166, 182, 194, .30);

    padding:0.625rem;

    overflow: hidden;
}

.csscolumns .view-select-a-country .region-group {

    -moz-column-count:5;

         column-count:5;

    -moz-column-gap:15px;

         column-gap:15px
}

.view-select-a-country .region-group a {

    display:inline-block;

    width:100%;

    height:2.1875rem;

    font-size:0.625em;

    text-decoration: none;

    color: #333333;

    vertical-align: middle;

    padding-left: 1.625rem;

    -webkit-hyphens: auto;

        -ms-hyphens: auto;

            hyphens: auto;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;
}

.view-select-a-country .region-group a img {

    vertical-align: top;

    margin-left: -1.75rem;

    margin-right: 0.125rem;

    transition:all .15s ease;
}

.view-select-a-country .region-group a:hover {}

.view-select-a-country .region-group a:hover img {

    filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.44882000000000005 0.50064 0.05054 0 0 0.14882 0.80064 0.05054 0 0 0.14882 0.50064 0.35054 0 0 0 0 0 1 0" /></filter></svg>#filter');

    -webkit-filter: grayscale(70%);

            filter: grayscale(70%);

    transition: -webkit-filter 1s ease;

    transition: filter 1s ease;

    transition: filter 1s ease, -webkit-filter 1s ease;
}

.view-select-a-country-3506 #region-box li:nth-of-type(1)::before,.view-select-a-country-3516 #region-box li:nth-of-type(2)::before,.view-select-a-country-3521 #region-box li:nth-of-type(3)::before {

    border: .50px solid #FFFFFF;
}

@media (min-width:980px) and (max-width:1199px) {

    .csscolumns .view-select-a-country .region-group {

        -moz-column-count: 5;

        column-count: 5;
    }
}

@media (min-width:768px) and (max-width:979px) {

    .csscolumns .view-select-a-country .region-group {

        -moz-column-count: 4;

        column-count: 4;
    }
}

@media (min-width:480px) and (max-width:767px) {

    .csscolumns .view-select-a-country .region-group {

        -moz-column-count: 3;

        column-count: 3;
    }
}

@media (max-width:479px) {

    .csscolumns .view-select-a-country .region-group {

        -moz-column-count: 2;

        column-count: 2;
    }
}

@media (max-width:767px) {

    .view-select-a-country .region-group a {

        font-size: 0.725em;
    }
}