.bee-table td, .bee-table th {
    border: 1px solid #000
}

.header, .main-nav > .nav-list > li > a:hover:before, .user-nav > ul > li > a:hover > b:before {
    right: 0;
    left: 0
}

.news-date > span, .title h2, p.side-note, span.use-address-btn {
    text-transform: uppercase
}

.bee-table, .confirm-modal, .home-banner, .int-hide, .login-modal, .mobile-menu, .news-content > p, .option-cont, .profile-pic, .radio-box, .radio-switch, .tool-list .qtool, .trackStep, form#qtrack-form {
    overflow: hidden
}

@font-face {
    font-family: rambla;
    src: url('../fonts/rambla-regular-webfont.woff') format('woff'),url('../fonts/rambla-regular-webfont.eot') format('embedded-opentype'),url('../fonts/rambla-regular-webfont.ttf') format('truetype'),url('../images/rambla-regular-webfont.svg') format('svg');
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: rambla;
    src: url('../fonts/rambla-italic-webfont.woff') format('woff'),url('../fonts/rambla-italic-webfont.eot') format('embedded-opentype'),url('../fonts/rambla-italic-webfont.ttf') format('truetype'),url('../images/rambla-italic-webfont.svg') format('svg');
    font-weight: 400;
    font-style: italic
}

@font-face {
    font-family: rambla;
    src: url('../fonts/rambla-bold-webfont.woff') format('woff'),url('../fonts/rambla-bold-webfont.eot') format('embedded-opentype'),url('../fonts/rambla-bold-webfont.ttf') format('truetype'),url('../images/rambla-bold-webfont.svg') format('svg');
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: rambla;
    src: url('../fonts/rambla-bolditalic-webfont.woff') format('woff'),url('../fonts/rambla-bolditalic-webfont.eot') format('embedded-opentype'),url('../fonts/rambla-bolditalic-webfont.ttf') format('truetype'),url('../images/rambla-bolditalic-webfont.svg') format('svg');
    font-weight: 700;
    font-style: italic
}

@font-face {
    font-family: GothamLight;
    src: url('../fonts/gothamlight.otf') format('opentype'),url('../fonts/gothamlight.ttf') format('truetype')
}

@font-face {
    font-family: GothamExtraLight;
    src: url('../fonts/gothamextralight.otf') format('opentype'),url('../fonts/gothamextralight.ttf') format('truetype')
}

@font-face {
    font-family: GothamBook;
    src: url('../fonts/gothambook.otf') format('opentype'),url('../fonts/gothambook.ttf') format('truetype')
}

@font-face {
    font-family: Gotham;
    src: url('../fonts/gotham.ttf')
}

@font-face {
    font-family: GothamBold;
    src: url('../fonts/gothambold.otf') format('opentype'),url('../fonts/gothambold.ttf') format('truetype')
}

.bee-table {
    border: 0;
    background: #fefefe;
    width: 100%;
    color: #000;
    font: 400 13px rambla,sans-serif
}

    .bee-table th, .main-nav > .nav-list, .sport-font {
        font-weight: 700
    }

    .bee-table td, .bee-table th {
        padding: 12px 15px;
        text-align: left
    }

    .bee-table th {
        text-shadow: 1px 1px 1px #d42e12;
        background: #d42e12;
        color: #fff;
        padding: 12px 15px
    }

.grey-cut > div, body {
    background-color: #efefef
}

.bee-table td.first, .bee-table th.first {
    text-align: left;
    border-right: 1px solid #000
}

.bee-table td.last {
    border-right: none
}

body {
    font-family: rambla
}

a, a:hover, a:visited {
    color: inherit
}

    a.red-link {
        color: #d42e12
    }

.footer-line {
    height: 36px;
    background: #6a6865;
    background: -moz-linear-gradient(45deg,#6a6865 1%,#6b6765 15%,#6f6b67 26%,#6d6968 50%,#7b7474 71%,#7b7576 82%,#9d918c 100%);
    background: -webkit-linear-gradient(45deg,#6a6865 1%,#6b6765 15%,#6f6b67 26%,#6d6968 50%,#7b7474 71%,#7b7576 82%,#9d918c 100%);
    background: linear-gradient(45deg,#6a6865 1%,#6b6765 15%,#6f6b67 26%,#6d6968 50%,#7b7474 71%,#7b7576 82%,#9d918c 100%)
}

.footer-menu-block {
    background-color: #423f3f;
    color: #fff;
    padding: 20px 0 30px
}

    .footer-menu-block h2 {
        margin: 10px 0 25px;
        font-size: 22px
    }

.footer-menu {
    color: #949292;
    list-style: none;
    margin: 0;
    padding-left: 25px
}

    .footer-menu > li {
        position: relative;
        margin: 5px 0;
        line-height: 1;
        padding: 6px 0
    }

        .footer-menu > li:after, .footer-menu > li:before {
            content: '';
            background-color: #fff;
            position: absolute;
            display: block;
            width: 9px;
            height: 2px;
            left: -25px;
            top: 0;
            bottom: 0;
            margin: auto;
            transform-origin: 8px center;
            border-radius: 1px
        }

        .footer-menu > li:before {
            transform: rotate(45deg)
        }

        .footer-menu > li:after {
            transform: rotate(-45deg)
        }

.footer-bottom {
    background-color: #fff;
    text-align: center;
    color: #4e4b4b
}

    .footer-bottom ul {
        list-style: none;
        padding: 0;
        margin: 23px 0 26px
    }

.main-nav > .nav-list, .user-nav > ul {
    padding: 0;
    margin: 0;
    list-style: none
}

.footer-bottom ul > li {
    display: inline-block;
    height: 44px;
    vertical-align: top;
    padding: 0 25px;
    line-height: 44px
}

    .footer-bottom ul > li + li {
        border-left: 1px solid #c2c2c2
    }

.icon-eft, .icon-maestro, .icon-mastercard, .icon-thawte, .icon-visa {
    background-image: url('../images/footer_icons.png');
    float: left;
    display: inline-block
}

.icon-thawte {
    width: 81px;
    height: 20px;
    margin: 12px 4px
}

.icon-eft, .icon-maestro, .icon-mastercard, .icon-visa {
    width: 33px;
    height: 20px;
    margin: 12px 2px
}

.icon-maestro {
    background-position: 0 -70px
}

.icon-mastercard {
    background-position: -34px -70px
}

.icon-visa {
    background-position: 0 -92px
}

.icon-eft {
    background-position: -34px -92px
}

.icon-facebook, .icon-google, .icon-instagram, .icon-linkedin, .icon-twitter, .icon-youtube {
    width: 24px;
    height: 24px;
    background-image: url('../images/footer_icons.png');
    display: inline-block;
    float: left;
    margin: 10px 7px;
    cursor: pointer;
    transition: .1s;
    opacity: .8
}

    .icon-facebook:hover, .icon-google:hover, .icon-instagram:hover, .icon-linkedin:hover, .icon-twitter:hover, .icon-youtube:hover, .int-hide, .parcel-3d.length .box-side.left .length, input#qtrack-submit:hover, span.info-bubble:hover, table.service-table tr.last-row td.hover {
        opacity: 1
    }

.icon-facebook {
    background-position: 0 -20px
}

.icon-twitter {
    background-position: -25px -20px
}

.icon-instagram {
    background-position: -52px -20px
}

.icon-youtube {
    background-position: 0 -45px
}

.icon-google {
    background-position: -25px -45px
}

.icon-linkedin {
    background-position: -52px -45px
}

.sport-font {
    font-style: italic;
    vertical-align: text-bottom;
    margin-right: 8px
}

.icon-cricket, .icon-rugby {
    background-image: url('../images/sports_icons.png');
    display: inline-block;
    height: 58px;
    margin: -7px 5px
}

.icon-cricket {
    width: 60px
}

.icon-rugby {
    width: 65px;
    background-position: -64px 0
}

.header {
    position: fixed;
    color: #fff;
    font-family: GothamLight,arial,sans-serif;
    z-index: 900
}

.header-logo {
    float: left;
    width: 208px;
    transition: .3s;
    position: absolute;
    left: 0;
    top: 0
}

.home-banner, .parcel-cnt, .title h2, .tool-list .qtool, .user-nav, .user-nav > ul > li > a, form#qtrack-form {
    position: relative
}

.header-logo img {
    max-width: 100%;
    transition: .3s
}

.main-nav {
    float: left;
    margin: 10px 10px 13px 220px;
    font-size: 17px
}

    .main-nav > .nav-list > li {
        float: left;
        margin: 10px 5px
    }

        .main-nav > .nav-list > li > a {
            line-height: 1;
            padding: 12px 4px;
            display: inline-block;
            position: relative;
            z-index: 1
        }

.row.notification > div > label, .title h2 {
    line-height: 2
}

.main-nav > .nav-list > li > a:before, .user-nav > ul > li > a > b:before {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    right: 50%;
    height: 5px;
    display: inline-block;
    background: #f7b512;
    transition: .2s cubic-bezier(.51, .08, .68, .53);
    z-index: -1;
    transform: skew(27deg)
}

.main-nav > .nav-list > li > a:hover, .steps-progress > a.step:hover, .user-nav > ul > li > a:hover {
    text-decoration: none
}

.user-nav {
    float: right;
    margin: 23px 76px;
    font-size: 17px;
    perspective: 400px
}

#ipay-form, .clock .clock-s, .destination-list input, .frost-tabs > input, .main-nav, .radio-box input, .user-nav-h, span.ram-radio > input {
    display: none
}

.user-nav > ul > li {
    float: left;
    margin: 0 4px
}

    .user-nav > ul > li > a {
        font-weight: 700;
        padding: 12px 0;
        display: inline-block;
        line-height: 1;
        z-index: 1
    }

        .user-nav > ul > li > a > b {
            font-family: GothamBold;
            margin-right: 10px;
            font-size: 17px
        }

        .user-nav > ul > li > a.wbtn, .wbtn {
            display: inline-block;
            border: 2px solid #fff;
            padding: 12px 17px;
            border-radius: 100px;
            font-size: .82em;
            cursor: pointer;
            transition: .2s;
            min-width: 95px;
            text-align: center;
            line-height: 1
        }

            .user-nav > ul > li > a.wbtn:hover, .wbtn:hover {
                text-decoration: none;
                background-color: #f7b512;
                border-color: #f7b512
            }

.header.solid {
    transition: .3s;
    top: 0
}

@media (min-width:1550px) {
    .header.solid .header-logo {
        width: 180px
    }

    .header.solid .main-nav {
        margin: 0 0 0 200px
    }

    .user-nav > ul > li > a.wbtn:hover, .wbtn:hover {
        text-decoration: none;
        background-color: #d42e12;
        border-color: #d42e12
    }

    .header.solid .user-nav {
        background-color: #d42e12;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        font-size: 14px;
        border-top-left-radius: 25px !important;
        border-bottom-left-radius: 25px !important
    }

        .header.solid .user-nav > ul > li {
            margin: 0
        }

            .header.solid .user-nav > ul > li > a {
                padding: 12px 5px
            }

                .header.solid .user-nav > ul > li > a.wbtn {
                    padding: 12px 0 0 !important
                }

                .header.solid .user-nav > ul > li > a.wbtn, .wbtn {
                    min-width: 85px
                }

    .solid .user-nav > ul > li > a.wbtn, .solid .wbtn {
        border: none;
        font-size: 1em
    }

    .solid .main-nav > .nav-list > li {
        margin: 0 5px
    }

        .solid .main-nav > .nav-list > li > a:hover {
            text-decoration: none;
            color: #d42e12
        }

    .solid .user-nav > ul > li > a:hover, .solid .user-nav > ul > li > span:hover {
        text-decoration: none;
        color: #f7b512
    }

    .user-nav > ul > li > a > b:before {
        display: none
    }
}

.tool-list .qtool, input#qtrack-submit {
    background-color: #f7b512;
    cursor: pointer
}

.home-banner {
    display: inline-block;
    width: 100%;
    min-height: 650px;
    padding: 0;
    background-image: url(../images/background.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-position: center
}

.truck, .van {
    background-position: top;
    background-repeat: no-repeat;
    top: 90%;
    left: 100%
}

.parcel-cnt {
    display: inline-block;
    width: 100%;
    padding: 0
}

.cloud-1, .cloud-2, .movables, .truck, .van {
    position: absolute
}

.truck {
    background-image: url(../images/truck.png);
    width: 120px;
    animation: 20s linear infinite truck-move
}

.van {
    background-image: url(../images/van.png);
    width: 72px;
    animation: 15s linear -3s infinite van-move
}

    .truck:before, .van:before {
        content: '';
        vertical-align: top;
        width: 100%;
        display: inline-block;
        padding-bottom: 100%
    }

.movables {
    width: 100%;
    height: 100%;
    top: 0
}

@keyframes van-move {
    0% {
        left: 46%;
        top: -4%;
        transform: rotate(-8deg) scale(1,1)
    }

    10% {
        left: 56%;
        top: 6%;
        transform: rotate(-8deg) scale(1,1)
    }

    20% {
        left: 66%;
        top: 16.3%;
        transform: rotate(-8deg) scale(1,1)
    }

    30% {
        left: 76%;
        top: 27.7%;
        transform: rotate(-4deg) scale(1.1,1.1)
    }

    40% {
        left: 86%;
        top: 41.7%;
        transform: rotate(3deg) scale(1.1,1.1)
    }

    50% {
        left: 96%;
        top: 58.2%;
        transform: rotate(5deg) scale(1.1,1.1)
    }

    55% {
        left: 101%;
        top: 68.2%;
        transform: rotate(5deg) scale(1.1,1.1)
    }

    70% {
        left: 110%;
        top: 70%;
        transform: rotate(-8deg) scale(1,1)
    }

    80% {
        left: 110%;
        top: -4%;
        transform: rotate(-8deg) scale(1,1)
    }
}

@keyframes truck-move {
    0% {
        transform: rotate(2deg) scale(1,1);
        left: 100%;
        top: 90%
    }

    7% {
        left: 92%;
        top: 74.4%;
        transform: rotate(1deg) scale(1,1)
    }

    15% {
        left: 82%;
        top: 56.4%;
        transform: rotate(-5deg) scale(1,1)
    }

    20% {
        left: 74%;
        top: 43%;
        transform: rotate(-6deg) scale(1,1)
    }

    25% {
        left: 65%;
        top: 31.4%;
        transform: rotate(-10deg) scale(.9,.9)
    }

    30% {
        left: 55%;
        top: 19.4%;
        transform: rotate(-15deg) scale(.85,.85)
    }

    35% {
        left: 45%;
        top: 8.4%;
        transform: rotate(-16deg) scale(.8,.8)
    }

    40% {
        left: 35%;
        top: -2.2%;
        transform: rotate(-16deg) scale(.8,.8)
    }

    45% {
        left: 24%;
        top: -13.5%;
        transform: rotate(-17deg) scale(.9,.9)
    }

    95% {
        left: 150%;
        top: -20%;
        transform: rotate(0) scale(1,1)
    }

    100% {
        left: 150%;
        top: 100%;
        transform: rotate(0) scale(1.1,1.1)
    }
}

.cloud-1 {
    width: 884px;
    height: 482px;
    background-image: url(../images/cloud_left.png);
    left: -200px;
    top: 0;
    bottom: 100px;
    margin: auto;
    animation: 55s linear -10s infinite cloud-move-1
}

.cloud-2 {
    width: 830px;
    height: 319px;
    background-image: url(../images/cloud_right.png);
    right: -300px;
    top: 0;
    bottom: 250px;
    margin: auto;
    animation: 55s linear -12s infinite cloud-move-2
}

.bottom-shaddow, .top-shaddow {
    height: 200px;
    background-repeat: repeat-x;
    background-position: top
}

.bottom-shaddow, .quick-tools {
    bottom: 0;
    position: absolute;
    right: 0;
    left: 0
}

@keyframes cloud-move-1 {
    0% {
        left: -680px;
        opacity: 0;
        top: 50px
    }

    50% {
        left: -200px;
        opacity: 1;
        top: 0
    }

    99% {
        left: 300px;
        top: 100px;
        opacity: 0
    }

    100% {
        left: -880px;
        opacity: 0;
        top: 50px
    }
}

@keyframes cloud-move-2 {
    0% {
        right: 300px;
        top: 100px;
        opacity: 0
    }

    50% {
        right: -200px;
        opacity: 1;
        top: 0
    }

    100% {
        right: -680px;
        opacity: 0;
        top: 50px
    }
}

.top-shaddow {
    background-image: url(../images/fade_top.png);
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}

.bottom-shaddow {
    background-image: url(../images/fade_bottom.png)
}

.bw-sponser, .news-block, .service-icon, .tool-list .qtool .ticon, input#qtrack-submit {
    background-repeat: no-repeat
}

@media only screen and (max-height:720px) {
    .quick-tools > h1 {
        margin: 0 0 20px;
        font-size: 56px
    }

    .tool-list .qtool {
        padding: 18px
    }

    .back-bar h1 {
        font-size: 30px;
        padding: 0 0 0 30px
    }

    div.back-btn {
        padding: 10px 30px 10px 0
    }

    .frost-tabs > label {
        padding: 12px 0;
        height: 65px
    }

    div#quick-send-slider {
        margin: 0
    }

    .row-num {
        width: 42px;
        height: 42px;
        line-height: 42px
    }

    div#send-parcel-section {
        top: 60px
    }
}

div#banner-slider {
    margin-top: 130px
}

.quick-tools {
    margin: auto;
    text-align: center;
    color: #fff;
    top: 0;
    height: 310px;
    transition: .5s
}

.send-parcel .quick-tools {
    transform: scale(1.2,1.2);
    opacity: 0;
    visibility: hidden
}

.quick-tools > h1 {
    font-weight: 300;
    font-family: GothamExtraLight;
    font-size: 60px;
    margin: 0 0 30px;
    text-shadow: 0 2px 3px #000
}

    .quick-tools > h1 > b {
        font-weight: 300;
        font-family: GothamBook;
        font-style: italic
    }

.tool-list .qtool {
    display: inline-block;
    min-width: 300px;
    box-sizing: border-box;
    vertical-align: top;
    margin: 0 5px;
    border-radius: 10px;
    box-shadow: 0 6px 16px -4px #000;
    padding: 21px 22px
}

    .tool-list .qtool:after {
        content: '';
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        right: 0;
        box-shadow: inset 0 -38px 36px -5px #fff,0 0 20px 10px #fff;
        opacity: 0;
        transition: .2s;
        bottom: 75%
    }

.bw-sponser, .hl > span, .service-bubble:before, .title h2 {
    display: inline-block
}

.tool-list .qtool:hover:after {
    opacity: .1;
    transition: .2s;
    bottom: 56%
}

.contact-form button.red, .submit-btn.red, .tool-list .qtool.track, form.parcel-login button.red, table.terms_table.prohibited th {
    background-color: #d42e12
}

.frost-tabs > input:checked + label, .radio-box input:checked + label {
    background-color: #279989;
    color: #fff
}

.tool-list .qtool.contact {
    background-color: #666366
}

.tool-list .qtool .ticon {
    background-image: url(../images/home_action_icons.png);
    width: 50px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px 3px 0;
    height: 48px
}

.qtool.track .ticon {
    background-position-y: -49px
}

.qtool.contact .ticon {
    background-position-y: -98px;
    height: 51px
}

.title {
    white-space: nowrap
}

    .title h2 {
        font-family: GothamBook,arial,sans-serif;
        font-size: 17px;
        font-weight: 300;
        text-shadow: 0 1px 1px rgba(0,0,0,.22);
        margin: 10px 5px
    }

        .title h2 > span {
            position: absolute;
            bottom: -5px;
            left: 0;
            margin: 0;
            font-size: .6em;
            text-shadow: none;
            line-height: 1;
            opacity: .6
        }

form#qtrack-form {
    margin: 10px 0 0
}

.grey-cut, .grey-cut > div, .grey-cut > div:after, input#qtrack-submit {
    position: absolute;
    bottom: 0
}

input#waybill {
    width: 100%;
    padding: 10px 15px;
    border: none;
    border-radius: 3px;
    box-shadow: inset 0 4px 6px -4px #a7a7a7
}

input#qtrack-submit {
    top: 0;
    right: -35px;
    border: none;
    width: 32px;
    height: 31px;
    margin: auto;
    font-weight: 700;
    color: #fff;
    border-radius: 100px;
    transition: .3s;
    background-image: url(../images/search_ico_white.png);
    background-size: contain;
    opacity: .8
}

input:valid + input#qtrack-submit {
    right: 5px
}

.courier-band > h2 {
    color: #fff;
    font-family: GothamBook,Arial,sans-serif;
    font-style: italic;
    font-size: 17px;
    margin-bottom: 20px
}

.courier-band {
    background-color: #212020
}

.bw-sponser {
    background-image: url(../images/sports_icons_colour.png);
    margin: 0 10px 20px 0;
    height: 80px
}

    .bw-sponser.cricket {
        width: 83px
    }

    .bw-sponser.rugby {
        width: 102px;
        background-position: right
    }

.grey-cut {
    height: 21px;
    left: 0;
    right: 0
}

    .grey-cut > div {
        top: 0;
        float: left
    }

        .grey-cut > div:after {
            content: '';
            width: 0;
            height: 0;
            border: 21px solid #efefef;
            border-left-width: 28px;
            border-right-width: 28px;
            border-top-color: transparent
        }

        .grey-cut > div:first-child {
            margin-right: 28px;
            right: 50%;
            left: 0
        }

        .grey-cut > div:nth-child(2) {
            margin-left: 28px;
            left: 50%;
            right: 0
        }

        .grey-cut > div:first-child:after {
            border-right-color: transparent;
            border-left: 0;
            left: 100%
        }

        .grey-cut > div:nth-child(2):after {
            border-left-color: transparent;
            border-right: 0;
            right: 100%
        }

h1.home-head {
    font-family: GothamExtraLight,Arial,sans-serif;
    text-align: center;
    font-size: 44px;
    margin: 100px 20px 26px
}

.services-section h3, .services-section h4 {
    color: #5e5e5e;
    font-family: Gotham,Gotham,arial,sans-serif;
    font-size: 19px;
    line-height: 1;
    text-align: center
}

.service-bubble {
    width: auto;
    background-color: #fff;
    border-radius: 1000px;
    position: relative;
    margin: 0 10px
}

.frost-tabs > label:before, .hl:before, .service-icon {
    position: absolute;
    top: 0;
    bottom: 0
}

.service-bubble:before {
    content: '';
    padding-bottom: 100%;
    vertical-align: top
}

.service-icon {
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
    height: 40px;
    width: 84px;
    background-image: url(../images/home_icons.png)
}

.frost-tabs > label, .frosted-block, .hl, .hl > span, .radio-switch {
    position: relative
}

.hl, div#quick-send-slider {
    margin: 0
}

.service-icon.local-courier {
    background-position: 50% 0;
    background-size: 100% auto;
    height: 72px
}

.service-icon.special-courier {
    background-position: 50% 28%;
    height: 63px
}

.service-icon.distribution {
    background-position: 50% 50.5%;
    height: 56px
}

.service-icon.international {
    background-position: 50% 75%;
    height: 68px
}

.service-icon.warehousing {
    background-position: 50% 100%;
    height: 64px
}

.services-section h3 {
    margin: 18px 0 0
}

.services-section h4 {
    margin: 6px 0 0
}

.hl {
    text-align: center;
    color: #ccc;
    padding: 0
}

    .hl:before {
        content: '';
        left: 0;
        right: 0;
        width: 100%;
        height: 1px;
        border-top: 1px solid;
        margin: auto
    }

    .hl > span {
        color: inherit;
        line-height: 1;
        font-size: .7em;
        background: #fff;
        padding: 0 10px
    }

.login-modal a.ram-btn {
    margin: 5px 0 0;
    width: 100%;
    background-color: #666266
}

.grey-back hr {
    border-color: #c9c9c9;
    margin: 50px 0
}

.radio-box:first-child, .radio-box:nth-child(2) {
    border-right: 1px solid #aaa
}

.grey-back p {
    color: #b0b0b0;
    line-height: 1.5;
    font-size: 1.2em;
    text-align: justify;
    font-family: GothamBook,Gotham,arial,sans-serif;
    text-align-last: center;
    -moz-text-align-last: center
}

    .grey-back p > a {
        color: #515151;
        font-weight: 700
    }

div#news-slider {
    margin: 46px 0 30px
}

.news-block {
    width: 480px;
    max-width: 98%;
    min-height: 380px;
    background-color: #fff;
    background-image: url(../images/corner_fold.png);
    background-position: bottom right;
    margin: auto;
    display: block
}

.news-picture {
    height: 200px;
    background-position: center top;
    background-size: cover;
    margin: 0 0 20px
}

.news-date {
    width: 80px;
    float: left;
    border-right: 2px solid #f7b512;
    color: #d42e12;
    text-align: center;
    max-width: 16.667%
}

    .news-date > span {
        display: block;
        line-height: 1;
        font-family: rambla,arial,sans-serif;
        font-weight: 700
    }

span.news-day {
    font-size: 32px
}

span.news-month {
    font-size: 18px;
    margin: 2px 0 0
}

.news-content {
    float: left;
    width: 400px;
    padding: 0 30px 0 18px;
    max-width: 83.333%
}

    .news-content > h1 {
        margin: 0 0 12px;
        font-family: Gothambook,gotham,airal,sans-serif;
        font-size: 21px
    }

    .news-content > p {
        font-size: 14px;
        text-align: left;
        font-family: Myriad Pro,arial,sans-serif;
        text-align-last: initial;
        -moz-text-align-last: initial;
        line-height: 20px;
        height: 60px;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical
    }

.back-bar h1, .back-btn > span, .frost-tabs, .frost-tabs > label, .ico-globe, .ico-pin, .row-num, div.back-btn {
    display: inline-block
}

.news-arrow-row {
    float: left;
    text-align: right;
    width: 100%;
    padding: 5px 15px 20px 0
}

    .news-arrow-row img, .wpwl-group-cvv, button#send-next {
        float: right
    }

.frosted-block {
    margin: auto;
    z-index: 10;
    color: #3f3f3f;
    transition: .4s ease-out;
    border: 1px solid #cbcbcb;
    background: #fff
}

div#send-parcel-section {
    margin: auto;
    width: 100%
}

.send-parcel div#send-parcel-section {
    transform: scale(1,1);
    opacity: 1;
    z-index: 5
}

.back-bar {
    width: 1140px;
    margin: auto auto 5px;
    max-width: 97%
}

div.back-btn {
    color: #fff;
    font-family: GothamBook,arial,sans-serif;
    font-size: 20px;
    padding: 14px 30px 14px 0;
    border-right: 2px solid #fff;
    cursor: pointer
}

.back-btn > span {
    background-image: url(../images/back_arrow.png);
    width: 50px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: bottom;
    margin-right: 20px
}

.back-bar h1, .form-row p, .ico-globe, .ico-pin, .row-num {
    vertical-align: middle
}

.back-bar h1 {
    color: #f7b512;
    font-family: Gothamlight,arial,sans-serif;
    padding: 0 0 10px 40px;
    font-size: 35px;
    line-height: 1;
    margin: auto
}

.frost-tabs {
    width: 100%
}

    .frost-tabs > label {
        float: left;
        width: 50%;
        text-align: center;
        font-size: 20px;
        font-weight: 700;
        padding: 10px 0;
        color: #767475;
        z-index: 2;
        box-shadow: inset 0 0 0 0 #fff;
        transition: box-shadow .2s;
        cursor: pointer;
        max-height: 75px;
        background-color: #f2f2f2
    }

        .frost-tabs > label:before {
            content: '';
            width: 100%;
            background-color: #fff;
            opacity: .4;
            z-index: -1;
            transition: width .3s
        }

        .frost-tabs > label#domestic-parcel:before {
            right: 0
        }

        .frost-tabs > label#international-parcel:before {
            left: 0
        }

        .frost-tabs > label:hover {
            box-shadow: inset 0 -20px 70px -30px #fff
        }

    .frost-tabs > input:checked + label:hover {
        box-shadow: none;
        background-color: #279989;
        color: #fff
    }

    .frost-tabs > input:checked + label {
        box-shadow: inset 0 0 0 0 #000;
        cursor: default;
        text-decoration: none
    }

        .frost-tabs > input:checked + label:before {
            width: 0%
        }

.ico-globe, .ico-pin {
    background-image: url(../images/shipping_icons2.png);
    line-height: 10px;
    margin: 0 15px 4px 0
}

.ico-pin {
    width: 32px;
    height: 42px;
    background-position: -46px 0
}

input:checked + label > .ico-pin {
    background-position: -5px 0
}

.ico-globe {
    width: 41px;
    height: 41px;
    background-position: 41px 41px
}

input:checked + label > .ico-globe {
    background-position: 0 41px
}

.form-row {
    padding: 0 30px;
    margin: 0 0 6px
}

.row-num {
    border: 2px solid #fff;
    width: 48px;
    height: 48px;
    text-align: center;
    line-height: 45px;
    border-radius: 100px;
    font-family: Gothambook;
    font-size: 11px;
    margin: 4px 22px 4px 0
}

.slider-btns, span.ico-box + sub {
    text-align: right
}

.form-row p {
    font-family: Gothambook,arial,sans-serif;
    line-height: 1.2;
    display: inline-block;
    width: 100%;
    margin: 10px 0 0
}

.parcel-size:before, .radio-box label {
    display: inline-block;
    vertical-align: top
}

.first-slide .form-row {
    margin: 0 0 8px
}

.radio-switch {
    border: 1px solid #aaa;
    width: 100%;
    height: 50px
}

.radio-box {
    width: 33.3%;
    height: 48px;
    transition: .3s;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0
}

    .radio-box:nth-child(2) {
        left: 33.3%
    }

    .radio-box:nth-child(3) {
        left: 66.6%
    }

.int .radio-box {
    width: 50%
}

    .int .radio-box:nth-child(2) {
        left: 50%
    }

    .int .radio-box:nth-child(3) {
        left: 100%
    }

.radio-switch .radio-box:nth-child(2) label:before, .radio-switch .radio-box:nth-child(3) label:before {
    content: '';
    height: 100%;
    position: absolute;
    width: 1px;
    background-color: #fff;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 0
}

.int-hide, .int-hide > .row, .option-cont, .option-slider, .radio-box label, .slider-btns, div#parcel-bar {
    position: relative
}

.radio-box label {
    text-align: center;
    width: 100%;
    padding: 12px 10px;
    font-family: Gothamlight,arial,sans-serif;
    margin: -1px 0;
    cursor: pointer;
    height: 50px
}

span.label-text {
    font-size: 1em
}

.option-cont {
    width: 100%;
    height: 40px
}

.option-slider {
    height: 100px;
    top: 0;
    transition: .2s
}

    .option-slider.int {
        top: -50px
    }

.int-hide {
    height: 50px;
    width: 100%;
    transition: .3s
}

.ico-box, .ico-document {
    width: 23px;
    height: 25px
}

.int-hide > .row {
    top: 0;
    transition: .3s
}

.int-hide.noshow, .parcel-3d.height .box-side.bottom:after, .parcel-3d.height .box-side.front:before, .parcel-3d.length .box-side.bottom .arrows, .parcel-3d.length .box-side.bottom .length, .parcel-3d.width .box-side.bottom:after, .parcel-3d.width .box-side.front:after {
    opacity: 0
}

    .int-hide.noshow > .row {
        top: -50px;
        position: relative
    }

.ico-box, .ico-document, .ico-gun {
    background-image: url(../images/parcel_type_icons2.png);
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    margin: 0 6px 2px 0;
    background-size: auto 75px
}

.ico-box {
    background-position: -3px 0
}

span.ico-box + sub {
    display: block;
    margin: -6px 3px 0 0;
    line-height: 1px;
    font-size: .7em;
    vertical-align: middle;
    opacity: .7
}

.ico-document {
    background-position: -3px -50px
}

.ico-gun {
    width: 28px;
    height: 23px;
    background-position: 0 -25px
}

.radio-box input:checked + label .ico-box {
    background-position: -31px 0
}

.radio-box input:checked + label .ico-gun {
    background-position: -28px -25px
}

.radio-box input:checked + label .ico-document {
    background-position: -31px -50px
}

.contact-form input, .contact-form select, .contact-form textarea, .form-input-box > input, .form-input-box > select {
    width: 100%;
    padding: 4px 12px;
    margin: 0;
    border: 1px solid #aaa;
    line-height: 1;
    font-size: 16px;
    vertical-align: middle;
    display: inline-block;
    height: 40px;
    transition: .3s
}

button#send-backBtn, button#send-next, p.side-note {
    width: 100%;
    font-weight: 700;
    font-size: 18px;
    text-align: center
}

.form-input-box > select option {
    padding: 1px 0
}

.contact-form input, .contact-form select, .contact-form textarea {
    border: 1px solid #b6b6b6;
    color: #222;
    margin: 0 0 15px;
    font-family: GothamBook,Gotham,Arial,sans-serif;
    resize: vertical;
    height: auto
}

button#send-backBtn, button#send-next {
    margin: 0 40px;
    padding: 10px 12px;
    background: #d3d3d3;
    border: none;
    color: #000;
    transition: .3s;
    cursor: pointer;
    border-radius: 21px;
    max-width: 100px;
    display: block;
    outline: 0
}

    button#send-backBtn:focus, button#send-next:focus {
        border: .1px solid #000
    }

    .form-block p > a, .page-content p a, .terms_chbx > label > a, button#send-backBtn:hover, button#send-next:hover {
        color: #279989
    }

    button#send-backBtn.go, button#send-next.go {
        color: #fff;
        background: #279989
    }

    button#send-backBtn.no, button#send-next.no {
        color: #fff;
        background: #d32e12
    }

button#send-backBtn {
    display: none;
    background: #f7b512;
    color: #fff
}

.showBack button#send-backBtn {
    float: left;
    display: block
}

p.side-note {
    border: 3px solid;
    padding: .7em 1.3em;
    border-radius: 6px;
    margin: 0 0 10px;
    color: #d42e12
}

p.form-note {
    margin: 0 15px 8px;
    line-height: 1.1;
    padding: 7px 15px;
    font-size: 1em;
    background-color: #009d89;
    color: #fff
}

span.use-address-btn {
    background-color: #f7b512;
    color: #fff;
    float: right;
    line-height: 1;
    text-align: center;
    padding: 7px 10px;
    margin: 4px 0 0 5px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 300;
    font-family: Gotham,Arial,sans-serif
}

    span.use-address-btn:hover {
        background-color: #ffa91d
    }

div#parcel-bar {
    height: 2px;
    background: #999;
    margin: 0 30px;
    border-radius: 0
}

    div#parcel-bar > div {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 10%;
        background-color: #888;
        transition: width .5s
    }

.parcel-size {
    background-image: url(../images/parcel_sizes.png);
    background-size: 100% auto;
    width: 233px;
    margin: 10px auto
}

.box-side, .size-block > .units {
    margin: auto;
    position: absolute
}

.parcel-size:before {
    content: '';
    width: 100%;
    padding-bottom: 81.545%
}

.parcel-size.l {
    background-position-y: -66.66%
}

.parcel-size.w {
    background-position-y: -33.33%
}

.parcel-size.h {
    background-position-y: -100%
}

.parcel-3d {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 250px;
    perspective: 2em;
    -webkit-perspective: 2em;
    perspective-origin: -20% -40%;
    -webkit-perspective-origin: -20% -40%;
    font-size: 300px;
    padding: 0 10px
}

.box-side {
    width: .5em;
    height: .5em;
    top: 0;
    bottom: 25%;
    right: 10%;
    left: 0;
    border: 4px solid;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transition: .4s ease-in-out;
    transform-origin: center
}

.page-banner, .page-scbanner {
    background-size: cover;
    background-position: center top;
    display: inline-block;
    height: 316px;
    vertical-align: top;
    color: #fff
}

.page-banner, .page-scbanner, .size-block, h1.content-title {
    position: relative
}

.box-side.front {
    transform: rotate3d(0,1,0,0deg) translate3d(0,0,.25em);
    z-index: 100
}

.box-side.top {
    transform: rotate3d(1,0,0,90deg) translate3d(0,0,.25em);
    z-index: 80
}

.box-side.bottom {
    transform: rotate3d(1,0,0,90deg) translate3d(0,0,-.25em);
    z-index: 50
}

.box-side.right {
    transform: rotate3d(0,1,0,90deg) translate3d(0,0,.25em);
    z-index: 50
}

.box-side.left {
    transform: rotate3d(0,1,0,-90deg) translate3d(0,0,.25em);
    z-index: 80
}

.box-side.back, .box-side.bottom, .box-side.front, .box-side.top {
    border-top-color: #fea800;
    border-bottom-color: #fea800
}

.box-side.back, .box-side.right {
    border-bottom: none;
    border-right: none
}

.box-side.back, .box-side.front, .box-side.left {
    border-left-color: #279989;
    border-right-color: #279989
}

.box-side.back {
    transform: rotate3d(0,1,0,0deg) translate3d(0,0,-.25em);
    z-index: 10
}

.box-side.right {
    border-left-color: #279989
}

.box-side.bottom {
    border-top: none;
    border-right: none
}

.parcel-3d .box-side.bottom .arrows, .parcel-3d .box-side.bottom .length, .parcel-3d .box-side.front .height, .parcel-3d .box-side.front .width, .parcel-3d .box-side.left .length {
    content: '';
    position: absolute;
    font-size: .05em;
    background-repeat: no-repeat;
    background-position: center;
    text-align: center;
    transition: .2s
}

.parcel-3d .box-side.front .width {
    width: 100%;
    top: 100%;
    margin-top: 6%;
    background-image: url(../images/length_h.png);
    background-size: 100% auto
}

.parcel-3d .box-side.bottom .arrows, .parcel-3d .box-side.bottom .length {
    margin: auto 5% auto auto;
    top: 0;
    background-size: auto 100%;
    line-height: 10em;
    height: 100%
}

.parcel-3d .box-side.bottom .arrows {
    bottom: 0;
    right: 100%;
    background-image: url(../images/length_w.png);
    width: 13%
}

.parcel-3d .box-side.bottom .length {
    bottom: 10px;
    right: 104%;
    transform: rotate3d(1,0,0,-90deg) translate3d(0,0,.25em);
    width: 22%;
    z-index: 10;
    text-align: right
}

.parcel-3d .box-side.left .length {
    width: 100%;
    top: 100%;
    margin-top: 6%;
    background-image: url(../images/length_h.png);
    background-size: 100% auto;
    opacity: 0
}

.parcel-3d .box-side.front .height {
    height: 100%;
    line-height: 10em;
    margin: auto auto auto 5%;
    bottom: 10px;
    top: 0;
    left: 100%;
    width: 33%;
    background-image: url(../images/length_w.png);
    background-size: auto 100%;
    background-position: 22% 50%
}

.parcel-3d.length .box-side.front {
    transform: rotate3d(0,1,0,40deg) translate3d(0,0,.25em);
    z-index: 120;
    opacity: .8
}

.parcel-3d.length .box-side.top {
    transform: rotate3d(0,1,0,40deg) rotate3d(1,0,0,90deg) translate3d(0,0,.25em);
    z-index: 120
}

.parcel-3d.length .box-side.bottom {
    transform: rotate3d(0,1,0,40deg) rotate3d(1,0,0,90deg) translate3d(0,0,-.25em)
}

.parcel-3d.length .box-side.right {
    transform: rotate3d(0,1,0,40deg) rotate3d(0,1,0,90deg) translate3d(0,0,.25em);
    z-index: 0
}

.parcel-3d.length .box-side.left {
    transform: rotate3d(0,1,0,40deg) rotate3d(0,1,0,-90deg) translate3d(0,0,.25em);
    z-index: 120
}

.parcel-3d.length .box-side.back {
    transform: rotate3d(0,1,0,40deg) rotate3d(0,1,0,0deg) translate3d(0,0,-.25em);
    opacity: .8
}

.parcel-3d.length .box-side.left, .parcel-3d.length .box-side.right, .parcel-3d.width .box-side.back, .parcel-3d.width .box-side.bottom, .parcel-3d.width .box-side.front, .parcel-3d.width .box-side.top {
    border-left-color: transparent;
    border-right-color: transparent
}

.parcel-3d.height .box-side.back, .parcel-3d.height .box-side.front, .parcel-3d.height .box-side.left, .parcel-3d.height .box-side.right, .parcel-3d.length .box-side.bottom, .parcel-3d.length .box-side.top {
    border-top-color: transparent;
    border-bottom-color: transparent
}

    .parcel-3d.height .box-side.bottom .arrows, .parcel-3d.height .box-side.front .width, .parcel-3d.length .box-side.bottom .arrows, .parcel-3d.length .box-side.bottom .length, .parcel-3d.length .box-side.front span, .parcel-3d.width .box-side.bottom .arrows, .parcel-3d.width .box-side.bottom .length, .parcel-3d.width .box-side.front .height, .parcel-3d.width .box-side.left, .parcel-3d.width .box-side.right, button:disabled {
        opacity: .8
    }

.parcel-3d.height .box-side.front {
    transform: rotate3d(1,-1,0,-10deg) translate3d(0,0,.25em);
    z-index: 120
}

.parcel-3d.height .box-side.top {
    transform: rotate3d(1,-1,0,-10deg) rotate3d(1,0,0,90deg) translate3d(0,0,.25em);
    z-index: 120;
    opacity: .8
}

.parcel-3d.height .box-side.bottom {
    transform: rotate3d(1,-1,0,-10deg) rotate3d(1,0,0,90deg) translate3d(0,0,-.25em)
}

.parcel-3d.height .box-side.right {
    transform: rotate3d(1,-1,0,-10deg) rotate3d(0,1,0,90deg) translate3d(0,0,.25em);
    z-index: 0
}

.parcel-3d.height .box-side.left {
    transform: rotate3d(1,-1,0,-10deg) rotate3d(0,1,0,-90deg) translate3d(0,0,.25em);
    z-index: 120
}

.parcel-3d.height .box-side.back {
    transform: rotate3d(1,-1,0,-10deg) rotate3d(0,1,0,0deg) translate3d(0,0,-.25em);
    opacity: .8
}

table.dims-table {
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box
}

.col-md-6 + .col-md-6.gap, .parcel-float h2 {
    padding: 0 0 0 6px
}

.form-input-box.size-block > input {
    background-color: transparent;
    color: #000;
    font-size: 1em;
    padding: 7px 8px;
    -webkit-appearance: none;
    margin: 2px 0;
    height: auto;
    -moz-appearance: textfield
}

    .form-input-box.size-block > input::placeholder {
        color: #fff
    }

    .form-input-box.size-block > input[type=number]::-webkit-inner-spin-button, .form-input-box.size-block > input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0
    }

.size-block > .units {
    top: 0;
    bottom: 0;
    right: 15px;
    width: 2.5em;
    height: 2.5em;
    color: #3f3f3f;
    line-height: 2.5em;
    text-align: center;
    border-radius: 100px;
    font-size: .7em;
    border: 1px solid #fff
}

.size-block > .limits {
    position: absolute;
    top: 100%;
    right: 15px;
    font-style: italic;
    font-size: .8em
}

.form-input-box.size-block {
    width: 100%;
    padding: 0 5px
}

.parcels-box:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: -1;
    opacity: .2
}

.parcels-box {
    min-height: 250px
}

table.dims-table th {
    font-size: 20px;
    font-weight: 300;
    width: 50%
}

    table.dims-table th sub {
        margin: 0 0 0 5px;
        font-size: .6em;
        opacity: .8;
        font-family: arial,sans-serif
    }

.parcel-float h1 {
    font-size: 20px;
    line-height: 1;
    margin: 0 0 2px 5px;
    text-align: left;
    color: #fff;
    font-family: rambla,arial,sans-serif
}

.parcel-float h2 {
    font-size: .9em;
    text-transform: capitalize
}

ul.parcel-dots {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
    text-align: center
}

    ul.parcel-dots > li {
        display: inline-block;
        margin: 0 5px
    }

        ul.parcel-dots > li > button {
            width: 24px;
            height: 24px;
            color: #fff;
            background-color: transparent;
            display: inline-block;
            vertical-align: top;
            border: 2px solid #fff;
            line-height: 20px
        }

        ul.parcel-dots > li.slick-active > button {
            color: #fff;
            background-color: #fea803;
            border: 2px solid #fea803
        }

input.error, select.error {
    background-color: #ffcbcb;
    box-shadow: inset 0 1px 3px 0 #a50f0f;
    color: #b40101
}

input.parcel-input.error {
    background-color: #ffcbcb !important
}

.radio-switch.error {
    border-color: #ffcbcb;
    box-shadow: inset 0 1px 3px 0 #a50f0f
}

.slick-slide:focus {
    outline: 0 !important
}

@keyframes shake {
    0%,100% {
        right: 0;
        left: 0
    }

    30% {
        right: -30px;
        left: 30px
    }

    70% {
        right: 30px;
        left: -30px
    }
}

.shakeIt {
    animation: .5s shake
}

.page-scbanner {
    background-image: url(../images/SC_banner_1.png);
    width: 100%
}

    .page-scbanner .page-title {
        position: absolute !important;
        bottom: 0
    }

        .page-banner .page-title > h1, .page-scbanner .page-title > h1 {
            font-family: GothamLight,Gotham,arial,sans-serif;
            font-size: 48px;
            font-weight: 100
        }

.page-content p.blurb, .trackStep .trackHeader {
    font-family: GothamBook,Gotham,arial,sans-serif
}

.page-banner .page-title > h2, .page-scbanner .page-title > h2 {
    font-family: GothamBook,Gotham,arial,sans-serif;
    font-size: 22px
}

.page-banner {
    background-image: url(../images/banner_1.jpg);
    width: 100%
}

    .page-banner .page-title {
        position: absolute;
        bottom: 0
    }

.page-container {
    display: flex;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff
}

.page-sidebar {
    width: 20%;
    background-color: #eee;
    border-right: 1px solid #909090;
    vertical-align: top
}

    .page-sidebar > ul {
        padding: 15px 20px
    }

        .page-sidebar > ul > li {
            display: block;
            padding: 12px 15px;
            color: #666366;
            font-family: GothamBook,Gotham,Arial,sans-serif;
            line-height: 18px;
            font-size: 15px
        }

            .page-sidebar > ul > li.current {
                background: #fbb600;
                color: #fff;
                position: relative;
                z-index: 20
            }

            .page-sidebar > ul > li a:hover {
                text-decoration: none;
                color: #000
            }

            .page-sidebar > ul > li.current a:hover, table.service-table td.hover .cell-content, tr.price-row td.hover h1 {
                color: #fff
            }

            .page-sidebar > ul > li.current:after {
                content: '';
                position: absolute;
                left: 100%;
                top: 0;
                height: 100%;
                width: 21px;
                background-image: url('../images/sidebar_selector.png');
                background-size: 100% 100%;
                background-repeat: no-repeat;
                background-position: right
            }

h1.content-title {
    color: #d42e12;
    font-weight: 700;
    font-family: GothamBold,Gotham,arial,sans-serif;
    padding: 10px 0;
    margin: 0 0 20px
}

    h1.content-title:before {
        content: '';
        display: block;
        background-color: #d42e12;
        position: absolute;
        top: 100%;
        left: 0;
        height: 3px;
        width: 50px;
        max-width: 60%
    }

.content-container {
    max-width: 1350px;
    margin: auto
}

.page-content.sidebar > .content-container {
    max-width: 1000px;
    margin: 0 auto 0 0
}

.page-content {
    padding: 32px 44px 44px
}

    .page-content.sidebar {
        width: 80%
    }

    .page-content p, ul.ram-list {
        font-family: GothamBook,Gotham,Arial,sans-serif;
        color: #919191;
        line-height: 1.8;
        font-size: 1em
    }

a.ram-btn, button.ram-btn, form.tracking-box > h2, h1.parcel-title, input.ram-btn {
    font-family: GothamBold,Gotham,arial,sans-serif
}

.page-content h2, h2.page-content-head, ul.ram-list h2 {
    color: #575757;
    font-size: 1.1em;
    margin: 0 0 4px;
    font-weight: 700
}

.page-content p.blurb {
    font-size: 1.2em;
    font-style: italic;
    line-height: 1.6;
    padding-bottom: 20px;
    color: #000
}

ul.ram-list, ul.tick-list {
    list-style: none;
    padding-left: 32px
}

    ul.ram-list > li {
        position: relative;
        margin-bottom: .5em
    }

        ul.ram-list > li:before, ul.tick-list > li:before {
            content: '';
            width: 32px;
            display: inline-block;
            position: absolute;
            left: -32px;
            top: .1em;
            height: 1.5em;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url(../images/bullet_hand.png)
        }

ul.tick-list {
    list-style: none;
    padding-left: 24px;
    font-size: .9em
}

    ul.tick-list > li {
        position: relative;
        margin-bottom: .3em
    }

        ul.tick-list > li:before {
            width: 12px;
            height: 12px;
            left: -22px;
            top: .4em;
            background-image: url(../images/ramtick.png)
        }

form.tracking-box > h2 {
    margin: 0 0 10px;
    font-size: 16px;
    color: #423f3f
}

.ram-input-btn {
    width: 100%;
    display: inline-block;
    position: relative
}

span.ram-input {
    float: left;
    width: 100%;
    padding-right: 110px
}

    span.ram-input > input {
        width: 100%;
        border: 1px solid #e1e1e1;
        border-right: none;
        padding: 10px 15px;
        font-family: GothamBook,arial,sans-serif;
        font-size: 14px;
        height: 46px
    }

a.ram-btn, button.ram-btn, input.ram-btn {
    height: 46px;
    background-color: #d42e12;
    color: #fff;
    border: none;
    padding: 10px 15px;
    position: absolute;
    width: 110px;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 15px;
    right: 0;
    top: 0;
    cursor: pointer;
    text-decoration: none
}

.ram-btn.lime {
    background-color: #97d700
}

    .ram-btn.lime:hover {
        background-color: #a7e610
    }

a.ram-btn, input.ram-btn {
    position: static
}

a.ram-btn {
    display: block;
    margin: 30px auto;
    width: 200px;
    text-align: center;
    height: auto
}

.grey-body, .stat-band, .tracking-icon, h1.noparcels {
    display: inline-block
}

form.tracking-box {
    padding: 5px 0
}

.trackStep {
    margin: 10px 0;
    background-color: #fff
}

    .trackStep .trackHeader {
        background-color: #a7a7ac;
        color: #fff;
        font-weight: 700;
        padding: 14px 24px;
        display: inline-block;
        width: 100%
    }

        .trackStep .trackHeader .trackDate {
            font-size: 100%
        }

        .trackStep .trackHeader .trackID {
            float: right;
            font-size: 80%;
            font-weight: 200
        }

    .trackStep > table {
        width: 100%;
        border: 1px solid #c5c5c7;
        color: #acacac
    }

        .trackStep > table tr:nth-child(2n) {
            background: #f7f7f7
        }

        .trackStep > table td {
            font-family: GothamBook,Gotham,Arial,sans-serif;
            font-size: 12px;
            font-weight: 900;
            padding: 14px 24px
        }

            .trackStep > table td:first-child {
                width: 200px;
                border-right: 1px solid #c5c5c7;
                vertical-align: middle;
                max-width: 30%
            }

.grey-body {
    background-color: #efefef;
    width: 100%;
    padding: 20px 0
}

.page-banner.tracking {
    background-image: url(../images/banner_2.jpg);
    height: 412px;
    background-position: center
}

.tracking-title {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 40px;
    height: 120px;
    text-align: center;
    margin: auto
}

.tracking-icon {
    background-image: url(../images/track_header_icon.png);
    width: 49px;
    height: 67px;
    background-size: contain;
    background-repeat: no-repeat
}

.parcel-card {
    background-color: #fff;
    padding: 15px 25px;
    margin-bottom: 10px;
    height: 100%
}

h1.parcel-title {
    font-size: 30px;
    margin: 0 0 5px
}

h2.parcel-title {
    color: #ffa800;
    font-family: GothamBold,gotham,arial,sans-serif;
    font-size: 16px;
    margin: 5px 0
}

.parcel-title i {
    color: #666;
    font-weight: 300;
    font-size: 12px;
    float: right;
    text-align: right
}

span.parcel-ico {
    float: left;
    width: 32px;
    height: 32px;
    margin: 0 5px 0 0;
    background-image: url(../images/house.png);
    background-position: center;
    background-size: contain
}

.text-right span.parcel-ico {
    float: right;
    margin: 0 0 0 5px
}

span.parcel-ico.Business, span.parcel-ico.OfficePark {
    background-image: url(../images/building.png)
}

span.parcel-ico.Hotel, span.parcel-ico.School, span.parcel-ico.ShoppingCentre {
    background-image: url(../images/school.png)
}

span.parcel-ico.Mine {
    background-image: url(../images/mine.png)
}

span.parcel-ico.Farm {
    background-image: url(../images/farm.png)
}

span.parcel-ico.Hospital {
    background-image: url(../images/hospital.png)
}

.parcel-btns {
    text-align: right;
    color: #fff
}

h1.noparcels {
    width: 100%;
    padding: 40px 20px;
    background-color: #fff;
    margin: 20px 0 0;
    color: #333;
    font-family: 'Gotham Book',Gotham,arial,sans-serif;
    font-size: 23px;
    text-align: center
}

.stat-band {
    background-color: #f7b512;
    color: #fff;
    text-align: center;
    border-radius: 100px;
    padding: 0;
    margin: 0 10px 0 0
}

    .stat-band h2 {
        float: left;
        margin: 0;
        font-size: 2.5em;
        line-height: 1.5em;
        background-color: #a97900;
        padding: 0 .3em;
        border-radius: 100px;
        height: 1.5em;
        min-width: 1.5em;
        text-align: center;
        color: #f7b512
    }

    .stat-band p {
        float: left;
        margin: 12px 30px 0 10px;
        line-height: 1;
        text-align: left;
        color: #fff
    }

h1.red-head {
    color: #d42e12;
    font-weight: 700;
    font-size: 28px
}

.single-shipment {
    border: 1px solid #eee;
    padding: 10px 20px
}

input.parcel-input {
    padding: 10px 16px;
    line-height: 1;
    width: 100%;
    margin: 5px 0 15px;
    border: 2px solid #aaa
}

span.liline {
    display: block;
    width: 40px;
    height: 2px;
    background: #999;
    margin: 12px 0
}

.destination-list, .mobile-nav ul.nav-list {
    list-style: none;
    padding: 0
}

    .destination-list label, .ram-wire-btn, a.ram-wire-btn {
        display: inline-block;
        color: #d42e12;
        border: 3px solid #d42e12;
        font-family: GothamBold,Gotham,arial,sans-serif;
        padding: 8px 15px;
        text-transform: uppercase;
        font-size: 12px;
        cursor: pointer;
        float: left;
        margin: 3px;
        background: 0 0
    }

.mobile-nav ul li a, select.ram-dropdown {
    font-family: GothamBook,Gotham,Arial,sans-serif;
    font-weight: 700
}

.destination-list input:checked + label, .ram-wire-btn:active, a.ram-wire-btn:hover {
    background-color: #d42e12;
    color: #fff;
    text-decoration: none
}

select.ram-dropdown {
    font-size: 18px;
    width: 100%;
    border: 3px solid #666366;
    padding: 8px 12px
}

.parcel-card p {
    font-size: 14px;
    color: #878787;
    margin: 0 0 5px
}

.destination-details .parcel-input {
    margin: 2px 0;
    padding: 8px 13px;
    font-size: 14px
}

div.map-box {
    margin: 0 0 10px;
    height: 368px;
    background-color: #e4e3df
}

.col-md-6.gap {
    padding: 0 6px 0 0
}

textarea.parcel-input {
    padding: 10px 16px;
    line-height: 1;
    width: 100%;
    margin: 5px 0;
    border: 1px solid #d0d0d0;
    resize: none
}

input.parcel-input.geo-deliminator {
    float: right;
    width: 40px;
    line-height: 5px;
    vertical-align: text-bottom;
    display: inline-block;
    margin: 0;
    padding: 10px 0;
    text-align: center
}

.flash-start {
    transition: .2s
}

.flash {
    color: #ddd;
    background-color: #ddd
}

.mobi-btn {
    height: 25px;
    width: 25px;
    float: right;
    margin: 10px;
    position: fixed;
    right: 24px;
    top: 17px;
    z-index: 1000;
    display: block
}

    .mobi-btn .lines {
        position: relative;
        z-index: 100;
        cursor: pointer;
        transform: scale(.9,.9);
        transition: .2s
    }

        .mobi-btn .lines:hover, .pay-modal.show {
            transform: scale(1,1)
        }

        .mobi-btn .lines > div {
            height: 4px;
            background: #fff;
            width: 100%;
            margin: 5px 0;
            border-radius: 2px;
            position: relative;
            transition: .3s
        }

            .mobi-btn .lines > div:first-child {
                top: 0
            }

            .mobi-btn .lines > div:nth-child(2) {
                top: 0;
                bottom: 0
            }

            .mobi-btn .lines > div:nth-child(3) {
                bottom: 0
            }

    .mobi-btn:before {
        content: '';
        position: fixed;
        width: 0%;
        height: 0%;
        left: 0;
        top: 0;
        background: #000;
        z-index: -1;
        opacity: 0;
        transition: width,height,opacity .5s
    }

    .mobi-btn.open:before {
        width: 100%;
        height: 100%;
        opacity: .5
    }

@media(max-width:1550px) {
    .mobile-nav {
        overflow: hidden
    }

    .mobi-btn {
        display: block
    }

    .main-nav {
        display: none
    }

    .user-nav {
        margin-right: 80px
    }

    .header.solid .header-logo {
        width: 180px
    }

    .header.solid .user-nav a.wbtn {
        text-decoration: none;
        background-color: #d42e12;
        border-color: #d42e12;
        font-size: 13px
    }

    .header.solid .user-nav {
        background-color: #d42e12 !important;
        margin: 20px 80px 0 0;
        padding: 0 60px 0 20px;
        position: relative;
        font-size: 15px;
        border-radius: 25px
    }

        .header.solid .user-nav > ul > li > a > b {
            font-size: 15px
        }
}

.profile-pic:before, .tool-tip .tt-image:before {
    padding-bottom: 100%;
    vertical-align: top;
    content: ''
}

.mobi-btn .red {
    content: '';
    background-color: #d42e12;
    border-radius: 100000px;
    position: absolute;
    width: 150%;
    height: 150%;
    top: -10%;
    right: -25%;
    z-index: 10;
    transition: .3s
}

.mobi-btn.open .red {
    width: 2100%;
    height: 2800%;
    top: -1200%;
    right: -1200%
}

.mobile-menu {
    position: fixed;
    right: 20px;
    top: 50px;
    z-index: 1000;
    text-align: right;
    height: 0;
    opacity: 0;
    transition: height,opacity .5s,margin .5s
}

.open + .mobile-menu {
    height: auto;
    opacity: 1;
    margin-top: 25px
}

.mobi-btn.open > .lines > div:first-child {
    transform-origin: left;
    transform: rotate(45deg)
}

.mobi-btn.open > .lines > div:nth-child(2) {
    transform: scale(.5,.5);
    opacity: 0
}

.mobi-btn.open > .lines > div:nth-child(3) {
    transform-origin: left;
    transform: rotate(-45deg)
}

.mobile-nav ul li a {
    display: block;
    padding: 5px
}

.login-modal {
    background-color: #fff;
    position: absolute;
    top: 0;
    width: 34px;
    right: 0;
    border-radius: 20px;
    padding: 10px 20px 20px;
    box-shadow: 0 3px 15px -4px #000;
    transition: .6s 0.1s,opacity .3s 0.1s;
    opacity: 0;
    visibility: hidden;
    height: 20px;
    z-index: 0
}

    .login-modal input {
        width: 100%;
        margin: 5px 0;
        border: none;
        background-color: #e9e9e9;
        color: #606060;
        font-family: GothamBook,gotham,arial,sans-serif;
        font-size: 12px;
        padding: 10px;
        font-weight: 700
    }

.login .login-modal {
    opacity: 1;
    visibility: visible;
    z-index: 10;
    height: 294px;
    width: 340px
}

.login-modal button.ram-btn {
    position: static;
    width: 100%;
    margin: 5px 0
}

#close-login, #close-login-mob {
    background-image: url(../images/black_close.png);
    height: 24px;
    width: 24px;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 5px;
    cursor: pointer
}

.login #login-btn {
    color: #000;
    position: relative;
    z-index: 1000;
    font-family: GothamBold,Gotham,arial,sans-serif
}

    .login #login-btn:hover {
        background-color: #fff;
        border-color: transparent
    }

.profile-pic {
    width: 100%;
    border-radius: 100px;
    position: relative
}

    .profile-pic:before {
        display: inline-block;
        width: 100%
    }

    .profile-pic > img {
        width: 100%;
        position: absolute;
        left: 0
    }

.people {
    border: 2px solid #c9c9c9;
    padding: 15px;
    margin: 30px 0
}

    .people h1 {
        font-size: 40px;
        font-family: GothamBook,Gotham,arial,sans-serif;
        margin: 0 0 0 -3px
    }

    .comment-line, .people p {
        font-size: 14px
    }

    .people h2 {
        color: #fc0000;
        margin: 0 0 10px
    }

.page-banner.send-parcel {
    height: 160px;
    background-image: url(../images/banner_2.jpg);
    background-size: cover;
    background-position: bottom
}

.send-parcel-header {
    margin: 0 0 15px
}

    .send-parcel-header > h2 {
        color: #868686;
        font-family: Gotham,Arial,sans-serif;
        font-size: 18px;
        margin: 0
    }

    .send-parcel-header > h1 {
        color: #666366;
        font-family: GothamBook,Gotham,Arial,sans-serif;
        margin: 0
    }

        .send-parcel-header > h1 > sub {
            color: #868686;
            font-style: italic;
            bottom: -3px;
            font-size: .7em
        }

.progress-cnt {
    width: 100%;
    min-height: 50px;
    position: relative;
    margin: 0 auto
}

.progress-wrap {
    padding: 5px 12px 15px;
    background: #fff;
    border: 1px solid #d3d3d3;
    display: block;
    width: 100%;
    margin-bottom: 12px
}

.steps-progress {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 10px 0
}

    .steps-progress > .step {
        width: 20%;
        float: left;
        position: relative;
        text-align: center;
        cursor: default
    }

        .steps-progress > .step > .step-no {
            width: 2.7em;
            height: 2.7em;
            color: #8b8b8b;
            background-color: #d3d3d3;
            text-align: center;
            font-family: GothamBold,GOtham,Arial,sans-serif;
            font-size: 14px;
            line-height: 2.7em;
            border-radius: 50%;
            margin: auto;
            cursor: no-drop
        }

        .charge-amount, .comment-line, .steps-progress > .step > .step-title, button#cheap-btn, h4#eftx-subtitle, table.service-table {
            font-family: GothamBook,Gotham,Arial,sans-serif
        }

    .steps-progress > a.step > .step-no, .steps-progress > a.step > .step-title {
        cursor: pointer
    }

    .steps-progress > .step.done > .step-no {
        background-color: #279989;
        color: #fff;
        transition: .1s
    }

    .steps-progress > a.step.done > .step-no:hover {
        transform: scale(1.05,1.05)
    }

    .steps-progress > a.step.current > .step-no {
        background-color: #f7b512;
        color: #fff
    }

    .steps-progress > .step > .step-title {
        position: absolute;
        top: 80%;
        margin-top: 10px;
        left: 0;
        right: 0;
        font-size: .8em;
        cursor: default
    }

    .steps-progress > .step.current > .step-title {
        font-family: GothamBold,Gotham,Arial,sans-serif
    }

.steps-progress-bar {
    position: absolute;
    width: 100%;
    height: 6px;
    top: 0;
    bottom: 0;
    margin: auto;
    background-color: #d3d3d3;
    border-radius: 2px;
    overflow: hidden
}

    .steps-progress-bar > div {
        background-color: #f7b512;
        height: 100%;
        float: left
    }

        .contact-form button.teal, .steps-progress-bar > div.done-steps, .submit-btn.go, .submit-btn.teal, button.ram-btn.green, button.ram-btn.teal, form.parcel-login button.teal, table.service-table tr.last-row button:hover {
            background-color: #279989
        }

.comment-line-wrap {
    background: #fff;
    border: 1px solid #d3d3d3;
    display: block;
    padding: 15px 18px;
    position: relative
}

.tick, .wpwl-brand-card {
    background-size: 100% auto
}

.confirm-mid-line:after, .tick, .tool-tip .tt-image, .wpwl-brand-card, ul.file-list li:before {
    background-repeat: no-repeat
}

.comment-line {
    border-left: 3px solid #d32e12;
    color: #6a6a6a;
    padding: 5px 0 5px 14px;
    margin: 0;
    cursor: pointer
}

table.service-table {
    max-width: 100%;
    font-size: 12px;
    margin: 30px 0
}

    table.service-table.cheap tr td:nth-child(n+3) {
        visibility: hidden;
        border: 0
    }

button#cheap-btn {
    visibility: visible;
    background-color: #3e3e3e;
    border: none;
    color: #fff;
    position: absolute;
    top: 15px;
    bottom: 0;
    left: 30px;
    right: 0;
    width: 170px;
    height: 50px;
    border-radius: 5px;
    cursor: pointer;
    font-weight: 700;
    font-size: 15px;
    box-shadow: 0 4px 10px -6px #000;
    display: none
}

    button#cheap-btn:hover, table.service-table > tbody > tr:nth-child(odd) > td.hover > div.red {
        background-color: #c32b11
    }

div#coll-day, div#del-day {
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    margin: 5px 0;
    font-size: 26px
}

h4#coll-date, h4#del-date {
    font-size: 20px;
    line-height: 1
}

.blackout.show, table.service-table.cheap button#cheap-btn {
    display: block
}

table.service-table > tbody > tr.top-row > th {
    height: 88px;
    border-bottom: 2px solid #0c0c0c;
    background: linear-gradient(#515151,#505050,#4c4c4c,#474747,#414141);
    border-top: 2px solid #515151
}

table.service-table > tbody > tr > td {
    background-color: #fff;
    text-align: center;
    position: relative
}

    table.service-table > tbody > tr > td > div.red {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        z-index: 0;
        background-color: inherit;
        box-shadow: 0 0 10px -3px transparent
    }

    table.service-table > tbody > tr > td.hover > div.red {
        opacity: 1;
        right: -10px;
        left: -10px;
        background-color: #d32e12;
        box-shadow: 0 14px 30px -3px #000;
        z-index: 5;
        transition: .3s,background-color,bottom,border
    }

table.service-table > tbody > tr:nth-child(odd) > td {
    background-color: #efefef
}

table.service-table > tbody > tr > th {
    height: 70px;
    width: 240px;
    background-color: #424242;
    color: #d5d5d5;
    padding: 0 30px
}

table.service-table > tbody > tr:nth-child(odd) > th {
    background-color: #3d3d3d
}

table.service-table > tbody > tr.top-row > td {
    border-bottom: 2px solid #969696;
    border-top: 2px solid #969696
}

table.service-table > tbody > tr.price-row > td {
    border-bottom: 2px solid #969696
}

table.service-table > tbody > tr.price-row > th {
    border-bottom: 2px solid #424242
}

table.service-table > tbody > tr.top-row + tr > th {
    box-shadow: inset 0 1px 0 #595959
}

table.service-table > tbody > tr.top-row + tr > td {
    box-shadow: inset 0 1px 0 #e1e1e1
}

table.service-table > tbody > tr > td {
    border-right: 2px solid #969696;
    width: 170px;
    padding: 10px
}

table.service-table tr.last-row td, table.service-table tr.last-row th {
    background-color: transparent;
    opacity: 0;
    border-bottom: none;
    border-left: none;
    border-right: none;
    height: 53px
}

table.service-table tr.top-row p {
    margin: 0;
    color: #929292;
    line-height: 1
}

table.service-table tr.top-row h1, tr.price-row h1 {
    color: #d32e12;
    font-family: GothamBold,Gotham,Arial,sans-serif
}

table.service-table tr.top-row h1 {
    font-size: 1.2em;
    margin: 0 0 5px;
    line-height: 18px
}

table.service-table .cell-content {
    position: relative;
    z-index: 10
}

td.hover {
    z-index: 85
}

tr.price-row h1 {
    font-size: 2em;
    margin: 0
}

tr.price-row td .charge {
    font-family: Gotham,Arial,sans-serif;
    font-size: 1em;
    position: relative;
    cursor: default
}

table.service-table tr.top-row td.hover p, tr.price-row td.hover .charge {
    color: #ffba00
}

table.service-table tr.top-row td.hover h1 {
    color: #fff;
    font-size: 1.3em;
    margin: 0 -5px 5px
}

table.service-table tr.top-row td > div.red {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

table.service-table tr.top-row td.hover > div.red {
    border-bottom: 2px solid #a4240e;
    top: -18px;
    bottom: -2px
}

table.service-table tr.last-row td .red {
    top: -2px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}

table.service-table tr.last-row button {
    background-color: #279989;
    color: #fff;
    border: none;
    border-radius: 100px;
    padding: 10px 30px;
    font-size: 1.2em;
    font-family: GothamBold,Gotham,Arial,sans-serif;
    cursor: pointer
}

table.service-table tr.last-row td.hover > div.red {
    box-shadow: #000 0 3px 11px -3px
}

.top-row .cell-content {
    height: 55px
}

.tick {
    display: inline-block;
    width: 4em;
    height: 4em;
    background-image: url(../images/circle_tick.png);
    background-position: top;
    vertical-align: top
}

.hover .tick, .wpwl-brand-VISA {
    background-position: bottom
}

input[readonly] {
    background-color: #f4f4f4;
    cursor: no-drop !important
}

.charge-details {
    position: absolute;
    bottom: 100%;
    opacity: 0;
    visibility: hidden;
    background-color: #fff;
    width: 200px;
    left: -90px;
    right: -100px;
    margin: 0 auto;
    border-radius: 5px;
    padding: 5px;
    box-shadow: 0 7px 24px -7px #000;
    transition: .3s
}

    .charge-details > table {
        color: #000;
        font-family: arial,sans-serif;
        text-align: left;
        width: 100%
    }

.charge:hover .charge-details {
    margin-bottom: 10px;
    visibility: visible;
    opacity: 1
}

.charge-details th {
    font-size: 1em;
    color: #161616;
    font-family: arial,sans-serif;
    font-weight: 400
}

.charge-details td {
    padding-left: 5px
}

.charge-details th > span {
    color: #c32b11;
    font-size: .8em;
    margin-left: 5px
}

.charge-details tr {
    border-top: 1px solid #eee
}

    .charge-details tr:first-child {
        border-top: none
    }

.charge-amount {
    line-height: 1;
    font-size: 1.1em;
    float: right;
    margin: 0 0 -1px;
    font-weight: 700;
    color: #474747
}

span.tooltip-ico {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 20px;
    text-align: center;
    color: #fff;
    line-height: 16px;
    font-family: GothamBook;
    font-size: 13px;
    border: 1px solid #fff;
    position: absolute;
    right: -9px;
    top: 0;
    bottom: 4px;
    margin: auto
}

.form-block h3, .form-block > h1, .tool-tip .tt-head, h1.form-header.lined {
    font-family: GothamBold,Gotham,Arial,sans-serif
}

.tool-tip {
    margin: 50px 0 26px
}

    .tool-tip .tt-head {
        font-size: 20px;
        margin: 0 0 10px
    }

        .tool-tip .tt-head h2 {
            font-size: .7em;
            color: red;
            margin: 0
        }

        .tool-tip .tt-head h1 {
            font-size: 1em;
            margin: 0
        }

    .tool-tip p {
        font-size: 12px;
        color: #444
    }

    .tool-tip .tt-image {
        width: 100%;
        background-color: #fff;
        border-radius: 500px;
        background-image: url(../images/printer.png);
        background-position: center;
        background-size: 45% auto
    }

        .tool-tip .tt-image:before {
            width: 100%;
            display: inline-block
        }

.form-block {
    background-color: #fff;
    border-left: 4px solid #fff;
    padding: 20px 25px;
    margin-bottom: 20px
}

    .form-block > h1, h1.form-header.lined {
        font-size: 27px
    }

    .form-block h3 {
        font-size: 18px;
        color: #212529;
        margin: 0 0 15px
    }

a.eftx-cancel-transaction, button.eftx-bank, button.eftx-submit {
    font-family: Rambla,Arial,sans-serif
}

.form-block.line {
    border-left: 4px solid #d32e12
}

.payblock {
    background-color: #f4f4f4;
    padding: 20px 0;
    box-shadow: 0 2px 10px -5px #000;
    border-left: 4px solid #279989
}

form.parcel-login input, iframe.wpwl-control, input.wpwl-control, select.form-dropdown, select.wpwl-control {
    width: 100%;
    padding: 9px 13px;
    font-size: 14px;
    line-height: 1;
    margin-bottom: 7px;
    border: 1px solid #d0d0d0
}

iframe.wpwl-control {
    height: 36px;
    padding: 8px 13px
}

.wpwl-group {
    width: 100%;
    position: relative
}

.wpwl-wrapper-brand {
    margin-right: 120px
}

.wpwl-brand-card {
    display: inline-block;
    width: 70px;
    position: absolute;
    bottom: 5px;
    right: 0;
    background-image: url(../images/card_types.png);
    background-position: top -5% center
}

.confirm-modal, .pay-modal {
    position: fixed;
    z-index: 100;
    opacity: 0;
    top: 0;
    left: 0;
    right: 0;
    visibility: hidden
}

.wpwl-brand-card:before {
    content: '';
    display: inline-block;
    padding-bottom: 65%;
    width: 100%;
    vertical-align: top
}

.pay-modal {
    bottom: 0;
    background: #fff;
    width: 640px;
    height: 440px;
    max-height: 100%;
    margin: auto;
    padding: 20px 30px;
    box-shadow: 0 30px 25px -33px #000;
    transform: scale(.8,.8)
}

    .pay-modal.show {
        opacity: 1;
        visibility: visible
    }

h4#eftx-subtitle {
    font-size: 18px
}

.pay-modal.eft-pay.show {
    height: 380px
}

button.eftx-bank {
    width: 30%;
    float: left;
    margin: 1.5%;
    height: 56px;
    border: none;
    background-position: center !important;
    background-size: cover;
    cursor: pointer;
    border-radius: 2px;
    box-shadow: 0 2px 15px -7px #000;
    color: transparent
}

.clock, .confirm-mid-line:after, span.adobe-ico, ul.file-list li:before {
    background-size: contain
}

a.eftx-cancel-transaction {
    background-color: #d42e12;
    color: #fff;
    padding: 10px 20px;
    display: block;
    margin: 10px auto;
    width: 200px;
    text-align: center;
    font-weight: 700;
    border: none;
    float: right
}

button.eftx-absa.eftx-bank.eftx-submit {
    background: url(../images/absa2.jpg)
}

button.eftx-standard.eftx-bank.eftx-submit {
    background: url(../images/standard_bank.jpg)
}

button.eftx-fnb.eftx-bank.eftx-submit {
    background: url(../images/fnb.jpg)
}

button.eftx-nedbank.eftx-bank.eftx-submit {
    background: url(../images/nedbank.jpg)
}

button.eftx-capitec.eftx-bank.eftx-submit {
    background: url(../images/capitec.jpg)
}

button.eftx-investec.eftx-bank.eftx-submit {
    background: url(../images/investec.jpg)
}

button.eftx-submit {
    background-color: #279989;
    float: left;
    border: none;
    padding: 10px 60px;
    color: #fff;
    font-weight: 700;
    margin: 10px 0 0
}

    button.eftx-submit[name=bank] {
        color: transparent !important
    }

form#eftx-form input {
    width: 100%;
    border: 1px solid #999;
    margin: 0 0 5px;
    padding: 5px 10px
}

img.card-image {
    position: absolute;
    top: -30px;
    right: -30px;
    width: 100px
}

.contact-form button, .submit-btn, a.submit-btn, form.parcel-login button {
    width: 100%;
    border: none;
    background-color: #f7b512;
    padding: 10px 8px;
    color: #fff;
    font-family: GothamBold,Gotham,Arial,sans-serif;
    cursor: pointer;
    display: block;
    text-align: center
}

button p, table.charge-table th {
    font-family: Gotham,Arial,sans-serif
}

.submit-btn:hover, form.parcel-login button:hover {
    background-color: #ffa91d;
    text-decoration: none
}

.submit-btn.grey {
    background-color: #d3d3d3;
    color: #000
}

    .submit-btn.grey:hover {
        color: #279989;
        background-color: #d3d3d3
    }

.submit-btn.red:hover, a.ram-btn:hover, form.parcel-login button.red:hover {
    background-color: #ef3a1c
}

.contact-form button.teal:hover, .submit-btn.teal:hover, form.parcel-login button.teal:hover {
    background-color: #26a896
}

.submit-btn.white {
    background-color: #fff;
    color: #333;
    box-shadow: inset 0 0 1px #999
}

span.adobe-ico {
    background-image: url(../images/adobe.png);
    background-position: center;
    width: 1.2em;
    height: 1.2em;
    margin: 0 .4em 0 0;
    display: inline-block;
    vertical-align: sub
}

img.no-results {
    margin: 30px auto 10px;
    text-align: center;
    display: block
}

h2.red-head {
    color: #d52e12;
    text-align: center;
    margin: 0 0 40px
}

label.input-label {
    margin: 1px 0 3px;
    line-height: 1;
    font-size: 14px;
    display: block;
    color: #333
}

button p {
    margin: 0;
    font-size: .8em;
    font-weight: 400;
    line-height: 1
}

.small-btn {
    background-color: #279989;
    color: #fff;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 12px
}

span.ram-radio {
    display: inline-block;
    vertical-align: middle
}

    span.ram-radio > label {
        display: inline-block;
        width: 1em;
        height: 1em;
        padding: 7px;
        border: 1px solid #d0d0d0;
        box-sizing: content-box;
        position: relative;
        margin: 0 10px 0 0
    }

        span.ram-radio > label > span {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(0,1px)
        }

            span.ram-radio > label > span:after, span.ram-radio > label > span:before {
                content: '';
                height: 4px;
                display: inline-block;
                background-color: #279989;
                position: absolute;
                transform-origin: left top;
                transition: width .2s
            }

            span.ram-radio > label > span:before {
                width: 0;
                bottom: 0;
                left: 0;
                transform: translate(-5px,1px) rotate(40deg);
                transform-origin: left top
            }

            span.ram-radio > label > span:after {
                width: 0;
                bottom: 0;
                left: 0;
                transform: translate(-3px,7.2px) rotate(-50deg)
            }

    span.ram-radio input:checked + label > span:before {
        width: 9px
    }

    span.ram-radio input:checked + label > span:after {
        width: 15px;
        transition-delay: 0.2s
    }

.row.line {
    margin-bottom: 10px
}

.row.same-height > div, form.reg-form {
    padding-bottom: 20px
}

.confirm-modal {
    margin-top: 7% !important;
    width: 700px;
    max-width: 90%;
    margin: auto;
    background-color: #fff;
    box-shadow: 0 0 40px -10px #000;
    border-radius: 4px;
    transition: .3s;
    border: 4px solid #4c4c4c;
    transform: scale(.9,.9)
}

.clock, h3.lined {
    position: relative
}

.map-preview, .stick-bottom, .table-scroll {
    max-width: 100%
}

.addressWebComponent-modal.show, .confirm-modal.show {
    opacity: 1;
    transform: scale(1,1);
    visibility: visible
}

.addressWebComponent-modal .row > div, .confirm-modal .row > div {
    padding: 0 40px 20px
}

.addressWebComponent-modal .row.lined > div:first-child, .confirm-modal .row.lined > div:first-child {
    border-right: 1px solid #ddd
}

.addressWebComponent-modal > .modal-head, .awc-modal-header, .confirm-modal > .modal-head {
    background-color: #4c4c4c;
    display: block;
    color: #fff;
    padding: 10px;
    text-align: center;
    border-bottom: 2px solid #4c4c4c;
    margin: 0 0 15px
}

    .addressWebComponent-modal > .modal-head > h1, .awc-modal-header > h1, .confirm-modal > .modal-head > h1 {
        color: #fff;
        margin: 0;
        font-family: Gotham,Gotham,arial,sans-serif;
        font-size: 20px
    }

.address-info p, .address-info > h1, p.subhead {
    font-family: GothamBook,Gotham,Arial,sans-serif
}

.addressWebComponent-modal > .modal-head > h2, .confirm-modal > .modal-head > h2 {
    color: #fff;
    margin: 0;
    font-size: 26px
}

.addressWebComponent-modal h3, .confirm-modal h3 {
    color: grey;
    margin: 0;
    font-size: 1.2em
}

.addressWebComponent-modal > p, .confirm-modal > p {
    text-align: center;
    margin: 0;
    font-size: 14px;
    color: #888
}

#btnAWCClose, .addressWebComponent-modal .addressComponentclose-btn, .addressWebComponent-modal .close-btn, .confirm-modal .close-btn {
    position: absolute;
    top: 0;
    right: 0;
    height: 32px;
    width: 32px;
    border-radius: 20px;
    color: #fff;
    font-family: monospace;
    font-size: 20px;
    line-height: 32px;
    text-align: center;
    cursor: pointer
}

#myCookieConsent, #myCookieConsent2 {
    font-family: OpenSans,arial,"sans-serif"
}

.by-this-time {
    float: right;
    width: 55%;
    text-align: left;
    font-size: 17px;
    font-family: GothamBookm,Gotham,Arial,sans-serif;
    line-height: 1;
    margin: 20px 0 0;
    color: #666
}

    .by-this-time > div {
        margin-left: 5px
    }

    .by-this-time > h2 {
        margin: 0;
        font-size: 1.4em;
        color: #000
    }

.clock {
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    background-image: url(../images/clock.png);
    box-shadow: 0 1px 10px -4px #000
}

    .clock .clock-h, .clock .clock-m {
        height: 4%;
        background-color: #414141;
        display: inline-block;
        position: absolute;
        top: 48%;
        left: 38%
    }

    .clock .clock-m {
        width: 58%;
        transform-origin: 21% 50%;
        transform: rotate(-90deg)
    }

    .clock .clock-h {
        width: 41.5%;
        transform-origin: 29% 50%;
        transform: rotate(-28deg)
    }

    .clock .clock-s > span {
        background-color: #d83223;
        position: absolute;
        right: 0;
        top: -160%;
        width: 18%;
        height: 380%;
        border-radius: 100px
    }

    .clock.t17 > .clock-h {
        transform: rotate(59deg)
    }

    .clock.t11 > .clock-h {
        transform: rotate(-120deg)
    }

@keyframes ticker {
    0% {
        transform: rotate(-90deg)
    }

    1.67% {
        transform: rotate(-84deg)
    }

    3.33% {
        transform: rotate(-78deg)
    }

    5% {
        transform: rotate(-72deg)
    }

    6.67% {
        transform: rotate(-66deg)
    }

    8.33% {
        transform: rotate(-60deg)
    }

    10% {
        transform: rotate(-54deg)
    }

    11.67% {
        transform: rotate(-48deg)
    }

    13.33% {
        transform: rotate(-42deg)
    }

    15% {
        transform: rotate(-36deg)
    }

    16.67% {
        transform: rotate(-30deg)
    }

    18.33% {
        transform: rotate(-24deg)
    }

    20% {
        transform: rotate(-18deg)
    }

    21.67% {
        transform: rotate(-12deg)
    }

    23.33% {
        transform: rotate(-6deg)
    }

    25% {
        transform: rotate(0)
    }

    26.67% {
        transform: rotate(6deg)
    }

    28.33% {
        transform: rotate(12deg)
    }

    30% {
        transform: rotate(18deg)
    }

    31.67% {
        transform: rotate(24deg)
    }

    33.33% {
        transform: rotate(30deg)
    }

    35% {
        transform: rotate(36deg)
    }

    36.67% {
        transform: rotate(42deg)
    }

    38.33% {
        transform: rotate(48deg)
    }

    40% {
        transform: rotate(54deg)
    }

    41.67% {
        transform: rotate(60deg)
    }

    43.33% {
        transform: rotate(66deg)
    }

    45% {
        transform: rotate(72deg)
    }

    46.67% {
        transform: rotate(78deg)
    }

    48.33% {
        transform: rotate(84deg)
    }

    50% {
        transform: rotate(90deg)
    }

    51.67% {
        transform: rotate(96deg)
    }

    53.33% {
        transform: rotate(102deg)
    }

    55% {
        transform: rotate(108deg)
    }

    56.67% {
        transform: rotate(114deg)
    }

    58.33% {
        transform: rotate(120deg)
    }

    60% {
        transform: rotate(126deg)
    }

    61.67% {
        transform: rotate(132deg)
    }

    63.33% {
        transform: rotate(138deg)
    }

    65% {
        transform: rotate(144deg)
    }

    66.67% {
        transform: rotate(150deg)
    }

    68.33% {
        transform: rotate(156deg)
    }

    70% {
        transform: rotate(162deg)
    }

    71.67% {
        transform: rotate(168deg)
    }

    73.33% {
        transform: rotate(174deg)
    }

    75% {
        transform: rotate(180deg)
    }

    76.67% {
        transform: rotate(186deg)
    }

    78.33% {
        transform: rotate(192deg)
    }

    80% {
        transform: rotate(198deg)
    }

    81.67% {
        transform: rotate(204deg)
    }

    83.33% {
        transform: rotate(210deg)
    }

    85% {
        transform: rotate(216deg)
    }

    86.67% {
        transform: rotate(222deg)
    }

    88.33% {
        transform: rotate(228deg)
    }

    90% {
        transform: rotate(234deg)
    }

    91.67% {
        transform: rotate(240deg)
    }

    93.33% {
        transform: rotate(246deg)
    }

    95% {
        transform: rotate(252deg)
    }

    96.67% {
        transform: rotate(258deg)
    }

    98.33% {
        transform: rotate(264deg)
    }

    100% {
        transform: rotate(270deg)
    }
}

.confirm-modal button.ram-btn {
    position: static;
    margin: 15px 0 10px;
    width: 43% !important;
    border-radius: 2px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    padding: 8px !important;
    height: 34px !important
}

.tickforaddress span.ram-radio > label > span:after, .tickforaddress span.ram-radio > label > span:before, button.ram-btn.yellow, table.terms_table.restricted th {
    background-color: #f7b512
}

form#quick-login-form button, form#quick-login-form input {
    border-radius: 3px
}

.blackout {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 90;
    opacity: .4;
    display: none
}

.material_terms, table.charge-table tr:nth-child(odd) {
    background-color: #fafafa
}

.tickforaddress > label {
    font-weight: 700;
    vertical-align: middle;
    color: #575757
}

.address-info > h1 {
    font-size: 16px;
    color: #666366;
    font-weight: 700
}

.address-info p {
    color: #878787;
    font-size: 12px
}

h3.lined {
    padding-bottom: 15px
}

    h3.lined:before {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 34px;
        height: 3px;
        background-color: #9d9d9d
    }

.confirm-mid-line {
    border-right: 2px solid #9d9d9d
}

    .confirm-mid-line:after {
        content: '';
        display: inline-block;
        width: 38px;
        height: 38px;
        position: absolute;
        right: -20px;
        top: 0;
        bottom: 0;
        margin: auto;
        background-image: url(../images/confirm_arrow.png);
        background-position: center
    }

.col-md-6.extra-pad:first-child {
    padding-right: 30px
}

.col-md-6.extra-pad:nth-child(2) {
    padding-left: 30px
}

.stick-bottom {
    position: absolute;
    bottom: 0;
    left: 10px
}

.invisible-pad {
    height: 40px
}

form.parcel-login .row.notification input {
    padding: 6px 12px 4px !important;
    border: 1px solid #d0d0d0;
    font-size: 14px;
    width: 100%
}

    form.parcel-login .row.notification input[readonly] {
        cursor: pointer !important
    }

p.subhead {
    margin-top: -10px;
    line-height: 1.2;
    color: #282828;
    font-size: 12px
}

table.charge-table {
    font-size: 12px;
    margin-bottom: 10px
}

    table.charge-table th {
        width: 100%;
        padding: 9px 13px;
        font-weight: 300
    }

    table.charge-table td {
        text-align: right;
        padding: 9px 7px;
        font-size: 1.2em;
        line-height: 1
    }

.row.same-height .form-block {
    height: 100%;
    padding-bottom: 0
}

.terms-scroll {
    height: 500px;
    overflow: auto;
    border: 1px solid #ddd;
    margin-bottom: 20px
}

.material_terms {
    padding: 20px 20px 30px
}

    .material_terms > h1 {
        font-family: GothamBold,Gotham,arial;
        font-size: 20px;
        text-align: center;
        margin-bottom: 20px;
        padding-bottom: 10px;
        border-bottom: 2px solid #cfcfcf
    }

    .material_terms h2 {
        font-size: 16px;
        font-family: GothamBold,Gotham,Arial,sans-serif;
        color: #414141;
        margin: 0 0 5px
    }

    .material_terms p, .material_terms ul, table.terms_table td ul {
        color: inherit;
        font-family: inherit;
        line-height: 1.2;
        font-size: 14px
    }

    .material_terms p, .material_terms ul {
        margin: 0 0 10px
    }

.terms_section {
    border-bottom: 1px dashed #dfdfdf;
    margin-bottom: 20px
}

table.terms_table {
    border-bottom: 1px solid #cecece
}

    table.terms_table td {
        border-left: 1px solid #cecece;
        border-right: 1px solid #cecece;
        background-color: #fff;
        padding: 5px
    }

    table.terms_table tr:nth-child(2n) td {
        background-color: #f6f6f6
    }

    table.terms_table td p {
        margin: 0;
        line-height: 1.2;
        font-size: 14px;
        padding: 5px 0 5px 10px
    }

    table.terms_table td ul {
        margin: 0;
        padding: 5px 0 5px 36px
    }

        .material_terms ul li, table.terms_table td ul li {
            padding-top: 3px
        }

    table.terms_table th {
        background-color: #666;
        color: #fff;
        padding: 10px;
        line-height: 1;
        font-family: GothamBold,Gotham,arial,sans-serif;
        font-size: 17px
    }

        table.terms_table th span {
            font-size: 80%;
            font-family: Gothamlight;
            display: block
        }

.rp-icon {
    background-image: url(../images/prohibited_restricted.png);
    width: 59px;
    height: 59px;
    display: inline-block
}

.prohibited-1 {
    background-position: 0 0
}

.prohibited-2 {
    background-position: 0 -64px
}

.prohibited-3 {
    background-position: 0 -128px
}

.prohibited-4 {
    background-position: 0 -192px
}

.prohibited-5 {
    background-position: 0 -256px
}

.prohibited-6 {
    background-position: 0 -320px
}

.prohibited-7 {
    background-position: 0 -384px
}

.prohibited-8 {
    background-position: 0 -448px
}

.prohibited-9 {
    background-position: 0 -512px
}

.prohibited-10 {
    background-position: 0 -576px
}

.prohibited-11 {
    background-position: 0 -640px
}

.prohibited-12 {
    background-position: 0 -704px
}

.prohibited-13 {
    background-position: 0 -768px
}

.prohibited-14 {
    background-position: 0 -832px
}

.restricted-1 {
    background-position: 0 -896px
}

.restricted-2 {
    background-position: 0 -960px
}

.restricted-3 {
    background-position: 0 -1024px
}

.restricted-4 {
    background-position: 0 -1088px
}

.restricted-5 {
    background-position: 0 -1152px
}

.restricted-6 {
    background-position: 0 -1216px
}

.restricted-7 {
    background-position: 0 -1280px
}

.restricted-8 {
    background-position: 0 -1344px
}

.restricted-9 {
    background-position: 0 -1408px
}

.restricted-10 {
    background-position: 0 -1472px
}

.restricted-11 {
    background-position: 0 -1536px
}

.restricted-12 {
    background-position: 0 -1600px
}

.restricted-13 {
    background-position: 0 -1664px
}

.terms_chbx {
    position: relative;
    padding-left: 2.8em
}

    .terms_chbx > .ram-radio {
        position: absolute;
        left: 0;
        top: 0
    }

    .terms_chbx > label {
        line-height: 1;
        font-size: 14px;
        font-family: GothamBook,Gotham,Arial,sans-serif;
        padding: 2px 0 0;
        color: #5a5a5a
    }

.loading-block h2, .loading-block p, span.close-btn {
    font-family: Rambla,Arial,sans-serif
}

.paytype-desc {
    font-size: 12px;
    color: #2b2b2b;
    line-height: 1.2;
    margin: 0
}

table.charge-table .bold {
    color: #279989;
    font-weight: 700;
    font-size: 1.3em;
    padding: 0 5px 0 0
}

.page-content p b, ul.ram-list b {
    font-family: GothamBold,Gotham,Arial,sans-serif;
    color: #7d7d7d;
    font-size: 1em
}

.smart-textarea {
    position: relative;
    width: 100%
}

    .smart-textarea textarea {
        padding: 20px 17px
    }

    .smart-textarea span.remaining {
        position: absolute;
        top: 2px;
        right: 5px;
        font-size: .8em;
        color: #5f5f5f
    }

a.forgot-link {
    line-height: 1;
    font-size: .8em;
    float: right;
    color: #666
}

.error-block {
    background-color: #d42e12;
    margin: 10px -14px 0;
    padding: 10px;
    color: #fff;
    border-radius: 5px;
    box-shadow: 0 9px 10px -10px #000;
    display: none
}

.acc-head, .loading-block, ul.parcels li {
    background-color: #fff
}

.error-block p {
    margin: 0;
    color: #fff
}

.error-block b {
    color: #fff !important
}

.loading-block {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    box-shadow: inset 0 -10px 150px #ccc;
    text-align: center;
    padding: 100px;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s
}

    .loading-block.show {
        visibility: visible;
        opacity: 1
    }

.addressWebComponent-modal, .home-banner:after {
    left: 0;
    right: 0;
    transition: .3s;
    opacity: 0;
    visibility: hidden
}

.loading-block h2 {
    font-weight: 700;
    font-size: 40px;
    margin-bottom: 0
}

.loading-block p {
    font-size: 16px
}

.loading-ani {
    display: inline-block;
    width: 100px;
    perspective-origin: center center;
    perspective: 1000px;
    position: relative;
    height: 100px;
    margin-bottom: 20px
}

.acc-box, .row.gun-row {
    margin: 0 0 10px
}

.loading-ani img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0
}

    .loading-ani img:first-child {
        animation: 5s linear infinite spin;
        z-index: 10
    }

    .loading-ani img:nth-child(2) {
        animation: 5s linear infinite spinshadow
    }

@keyframes spin {
    0% {
        transform: translate(0,0) rotate3d(1,0,0,5deg) rotate(0)
    }

    50% {
        transform: translate(0,-30px) rotate3d(1,0,0,45deg) rotate(180deg)
    }

    100% {
        transform: translate(0,0) rotate3d(1,0,0,5deg) rotate(360deg)
    }
}

@keyframes spinshadow {
    0% {
        opacity: 0;
        transform: scale(1,1) rotate3d(1,0,0,5deg) rotate(0)
    }

    50% {
        opacity: .1;
        transform: scale(1.2,1.2) rotate3d(1,0,0,45deg) rotate(180deg)
    }

    100% {
        opacity: 0;
        transform: scale(1,1) rotate3d(1,0,0,5deg) rotate(360deg)
    }
}

.form-block.line.firearm-block {
    font-size: 14px;
    color: #444;
    font-family: GothamLight,Gotham,arial,sans-serif;
    font-weight: 300;
    line-height: 1.3
}

    .form-block.line.firearm-block > h1 {
        color: #000
    }

    .form-block.line.firearm-block ul {
        padding-left: 20px
    }

.row.gun-row {
    background-color: #f8f8f8;
    padding: 10px
}

    .row.gun-row > div {
        padding: 0 5px
    }

form.parcel-login .gun-btns > button {
    float: right;
    width: auto !important;
    display: inline-block;
    padding: 8px 18px;
    margin: 0 0 10px 10px;
    min-width: 90px;
    font-size: .9em
}

div#guns input, div#guns select {
    font-size: .8em;
    padding: 7px 9px;
    margin: 3px 0
}

.form-block p > i {
    font-family: GothamLight,Gotham,Arial,Sans-serif;
    font-size: .9em
}

.table-scroll {
    overflow: auto;
    display: inline-block
}

    .table-scroll > table {
        margin-right: 30px
    }

span.info-bubble {
    position: relative;
    width: 1px;
    margin: 0 0 0 6px;
    opacity: .5
}

    span.info-bubble:after {
        vertical-align: top;
        content: 'i';
        height: 12px;
        width: 12px;
        text-align: center;
        line-height: 12px;
        border-radius: 10px;
        background-color: #fff;
        color: #424242;
        font-weight: 700;
        font-size: 10px;
        padding: 0;
        cursor: pointer;
        position: absolute;
        top: -2px;
        left: -4px
    }

.acc-cont, .acc-head {
    padding: 10px;
    border: 1px solid #ddd
}

button.wpwl-button.wpwl-button-pay {
    width: 100%;
    border: none;
    background-color: #279989;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    padding: 7px 10px;
    font-size: 23px
}

.wpwl-group-cvv, .wpwl-group-expiry {
    width: 48%;
    display: inline-block;
    height: 90px
}

.pay-modal.card-pay h3 {
    margin: 0 0 10px;
    font-size: 25px;
    padding: 0 0 5px;
    font-weight: 700
}

ul.file-list {
    margin: 20px 0 30px;
    padding: 0 0 0 20px;
    color: #444;
    font-size: .9em
}

    ul.file-list li {
        position: relative;
        margin: 0 0 7px;
        line-height: 1.1
    }

        ul.file-list li:before {
            content: '';
            position: absolute;
            left: -20px;
            top: 0;
            bottom: 0;
            display: inline-block;
            width: 16px;
            height: 16px;
            background-image: url(../images/ico_file.png);
            background-position: center
        }

.acc-head {
    cursor: pointer;
    transition: .3s
}

    .acc-head.open {
        background-color: #d32e12;
        border: 1px solid #d32e12;
        color: #fff
    }

    .acc-head h2 {
        margin: 0;
        color: inherit
    }

#myCookieConsent, #myCookieConsent2, span.close-btn {
    color: #fff;
    text-align: center
}

.acc-cont {
    display: none;
    border-top: 0
}

@media (max-width:948px) and (min-width:788px) {
    .quick-tools > h1 {
        font-size: 50px
    }

    .tool-list .qtool {
        padding: 13px 14px;
        min-width: 230px
    }

    .title h2 {
        font-size: 16px
    }

    .frosted-block {
        max-width: 740px
    }

    .ico-box, .ico-document, .ico-gun {
        margin: 0 3px 2px 0
    }
}

@media (max-width:788px) {
    .quick-tools > h1 {
        font-size: 40px;
        margin: 0
    }

    .user-nav {
        margin-top: 16%
    }

    .login .login-modal {
        height: 295px;
        width: 309px
    }

    .login-modal {
        margin-top: 13%;
        margin-right: 12%
    }

    .tool-list .qtool {
        margin: 10px 30px
    }

    .quick-tools {
        position: relative;
        margin-top: 50%;
        margin-bottom: 160px;
        height: auto
    }

    .frosted-block {
        width: 92%
    }

    .row-num {
        width: 36px;
        height: 36px;
        line-height: 34px;
        font-size: 10px;
        margin: 4px 12px 4px 0
    }

    .form-row {
        padding: 0;
        margin: 0 0 6px
    }

    .radio-box label {
        padding: 7px 6px;
        height: 40px
    }

    .radio-box, .radio-switch {
        height: 40px
    }

    .contact-form input, .contact-form select, .contact-form textarea, .form-input-box > input, .form-input-box > select {
        height: 40px;
        padding: 7px 13px
    }
}

@media (max-height:670px) and (max-width:1370px) {
    .send-parcel-header h1 {
        font-size: 36px
    }

    .steps-progress > .step > .step-no {
        font-size: 20px
    }
}

span.close-btn {
    position: absolute;
    top: -13px;
    right: -13px;
    background-color: #d32e13;
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 100px;
    font-size: 16px;
    cursor: pointer
}

.mid-line, .mid-line h2, .parcels-box {
    position: relative
}

ul.parcels {
    padding: 0;
    list-style: none;
    background: #eee;
    display: inline-block;
    width: 100%;
    max-width: 600px
}

#myCookieConsent a, .mid-line h2 {
    padding: 0 10px;
    display: inline-block
}

ul.parcels li {
    margin: 10px;
    padding: 10px 15px;
    border-radius: 3px;
    box-shadow: 0 1px 10px -5px #000
}

    ul.parcels li + li {
        margin: 0 10px 10px
    }

    ul.parcels li hr {
        margin: 10px 0
    }

.parcel-title {
    font-size: 18px;
    font-family: Gotham
}

.parcel-status {
    color: #03a9f4;
    font-size: 16px
}

.parcel-location {
    line-height: 1;
    font-size: 14px;
    margin-top: 2px
}

.mid-line {
    color: #d42e12;
    text-align: center;
    margin: 20px 0
}

    .mid-line h2 {
        z-index: 10;
        background-color: #efefef;
        margin: 0;
        line-height: 1
    }

    .mid-line:before {
        content: '';
        border-bottom: 2px solid;
        position: absolute;
        top: 0;
        bottom: 50%;
        left: 0;
        right: 0
    }

.home-banner:after {
    content: '';
    background-color: #000;
    position: absolute;
    top: 0;
    bottom: 20px
}

.home-banner.send-parcel:after {
    visibility: visible;
    opacity: .6
}

div#parcel-header-slider {
    text-align: center;
    margin: 0 27px 8px
}

.parcels-box {
    display: inline-block;
    width: 100%;
    padding: 5px
}

.slide-arrow {
    position: absolute;
    top: 5px;
    z-index: 20;
    margin: 0;
    padding: 0;
    display: block;
    width: 20px;
    height: 20px;
    background: #fff;
    border: none;
    cursor: pointer
}

    .slide-arrow.prev-arrow {
        left: -20px;
        z-index: 20
    }

    .slide-arrow.next-arrow {
        right: -22px;
        z-index: 20
    }

div#parcel-header-slider h1 {
    margin: 0;
    padding: 0;
    font-family: Gotham;
    font-size: 14px;
    font-weight: 700
}

div#parcel-header-slider .slick-slide {
    margin: 0 4px;
    white-space: nowrap;
    text-align: center;
    color: #3f3f3f;
    padding: 6px 0
}

    div#parcel-header-slider .slick-slide.slick-current.slick-active {
        margin: 0 4px;
        white-space: nowrap;
        text-align: center;
        background: #e4e4e4;
        color: #3f3f3f;
        border-radius: 12px;
        padding: 6px 0
    }

#myCookieConsent {
    z-index: 999;
    padding: 15px 0;
    background: rgb(4 4 4 / 91%);
    overflow: hidden;
    position: fixed;
    bottom: 0;
    right: 0;
    display: none;
    left: 0;
    font-size: 15px;
    font-weight: 700
}

    #myCookieConsent div, #myCookieConsent2 div {
        padding: 5px 0 0
    }

    #myCookieConsent a {
        color: #ffba55
    }

        #myCookieConsent a:hover {
            color: #fda016
        }

        #myCookieConsent a#cookieButton {
            display: inline-block;
            color: #000;
            font-size: 1.1em;
            background: #ffba55;
            text-decoration: none;
            cursor: pointer;
            padding: 2px 20px;
            float: right;
            border-radius: 20px
        }

            #myCookieConsent a#cookieButton:hover {
                background: #fda016;
                color: #000
            }

#myCookieConsent2 {
    padding: 15px 35px;
    background: #d42e12;
    position: relative;
    font-size: 16px;
    font-weight: 700;
    margin: 0 auto
}

    #myCookieConsent2 a {
        text-decoration: underline
    }

.popup {
    position: relative;
    cursor: pointer
}

    .popup .popuptext {
        visibility: hidden;
        width: 46%;
        background-color: #fff;
        color: #000;
        text-align: justify;
        border-radius: 6px;
        padding: 8px;
        position: absolute;
        z-index: 1;
        top: -15px;
        left: 6%;
        margin-left: 490px;
        font-family: GothamLight,arial,sans-serif;
        font-size: 13px;
        border: groove
    }

        .popup .popuptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent
        }

    .popup .show {
        visibility: visible;
        -webkit-animation: 1s fadeIn;
        animation: 1s fadeIn
    }

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.ui-autocomplete-loading {
    background: url(../images/loading.gif) right center no-repeat
}

.addressWebComponent-modal {
    position: fixed;
    z-index: 100;
    top: 0;
    width: 80%;
    max-width: 90%;
    margin: 7% auto auto;
    background-color: #fff;
    box-shadow: 0 0 40px -10px #000;
    border-radius: 4px;
    overflow: hidden;
    border: 4px solid #4c4c4c;
    transform: scale(.9,.9)
}

.divAWParent {
    padding: 2%;
    max-height: 430px;
    height: 430px;
    overflow-y: auto
}

.btnEditAddress {
    background-color: #979182 !important
}

@media (max-width:1899px) {
    #advt-h1 {
        margin-bottom: 12px;
        margin-top: -55px
    }

    #advt-banner {
        max-width: 310px;
        width: 100%;
        cursor: pointer;
        border-radius: 10px
    }

    .header.solid .user-nav {
        background-color: #d42e12 !important;
        margin: 20px 80px 0 0;
        padding: 0 60px 0 20px;
        position: relative;
        font-size: 15px;
        border-radius: 25px
    }
}

@media (min-width:1900px) {
    #advt-h1 {
        margin-bottom: 0;
        margin-top: -160px
    }

    #advt-banner {
        max-width: 330px;
        width: 100%;
        cursor: pointer;
        border-radius: 10px
    }

    #banner-h1 {
        margin-bottom: 100px;
        margin-top: 100px
    }
}

@media (min-width:600px) {
    .prom-div1 {
        font-size: 19px;
        padding: 5px 32px
    }

    .prom-inner-div2 {
        margin-top: 70px
    }

    .a-sendparcel-desktop {
        display: contents
    }

    .a-sendparcel-mobile {
        display: none
    }
}

@media only screen and (max-width:600px) {
    .prom-div1 {
        font-size: 15px;
        padding: 0
    }

        .a-sendparcel-desktop, .prom-div1 p br {
            display: none
        }

    .prom-inner-div2 {
        margin-top: 20px;
        margin-bottom: 20px
    }

    .a-sendparcel-mobile {
        display: contents
    }
}

.alignbetween {
    display: flex;
    justify-content: space-between;
    padding: 5px
}

.alignsolution-icon {
    display: flex;
    flex-wrap: wrap;
    gap: 45px
}

.button-drawer {
    background: #d42e12;
    width: 32px;
    height: 32px;
    border-radius: 4px;
    margin-left: -20px
}

@media only screen and (max-width:1024px) {
    span.label-text {
        font-size: .9em
    }

    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 30px
    }
}

@media only screen and (max-width:912px) {
    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 30px
    }

    button#send-backBtn, button#send-next {
        margin: 0
    }

    .alignsolution-icon {
        gap: 7px
    }

    .progress-wrap {
        padding: 5px 12px 30px
    }

    span.label-text {
        font-size: .5em
    }
}

@media only screen and (max-width:768px) {
    .header {
        position: relative
    }

    .tAndCClass {
        margin-top: 0 !important
    }

    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 30px
    }

    button#send-backBtn, button#send-next {
        margin: 0
    }

    span.label-text {
        font-size: .7em
    }

    .progress-wrap {
        padding: 5px 12px 30px
    }

    .alignsolution-icon {
        gap: 30px;
        align-items: center;
        justify-content: center
    }

    .solutions {
        top: -225px !important
    }

    .page-content.sidebar {
        width: 100%
    }

    .page-sidebar {
        width: 0%;
        display: none
    }
}

@media (min-width:481px) and (max-width:540px) {
    .header {
        position: relative
    }

    .tAndCClass {
        margin-top: 0 !important
    }

    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 15px
    }

    .mobi-btn.open .red {
        height: 3230%
    }

    .confirm-mid-line:after, .user-nav {
        display: none
    }

    .confirm-mid-line {
        border-right: none
    }

    button#send-backBtn, button#send-next {
        margin: 0
    }

    .parcel-3d {
        position: inherit
    }

    span.label-text {
        font-size: .6em
    }

    .progress-wrap {
        padding: 5px 12px 55px
    }

    .home-banner {
        height: 1000px !important
    }

    .solutions {
        top: -236px !important
    }

    .alignbetween {
        flex-direction: column;
        gap: 10px;
        align-items: center
    }

    .solutions .solutions-icons, .solutions .solutions-text {
        margin-left: 0 !important
    }

    .alignsolution-icon {
        align-items: center;
        justify-content: center;
        gap: 10px
    }

    .header-logo {
        width: 160px
    }

    .video-center {
        align-items: center;
        justify-content: center
    }

    .footer-bottom ul > li + li {
        border-left: none !important
    }

    h1.content-title {
        font-size: 1.5rem
    }
}

@media (min-width:280px) and (max-width:480px) {
    .header {
        position: relative
    }

    .tAndCClass {
        margin-top: 0 !important
    }

    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 15px
    }

    .mobi-btn.open .red {
        height: 3230%
    }

    .confirm-mid-line:after, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-mid-line {
        border-right: none
    }

    .page-banner.send-parcel {
        height: 194px
    }

    .frost-tabs > label {
        font-size: 15px
    }

    .steps-progress > .step > .step-title {
        font-size: .7em
    }

    button #send-next, button#send-backBtn {
        margin: 0
    }

    .parcel-3d {
        position: inherit
    }

    span.label-text {
        font-size: .5em
    }

    .progress-wrap {
        padding: 5px 12px 55px
    }

    .home-banner {
        height: 1000px !important
    }

    .alignbetween {
        flex-direction: column;
        gap: 10px;
        align-items: center
    }

    .solutions .solutions-icons, .solutions .solutions-text {
        margin-left: 0 !important
    }

    .solutions {
        top: -236px !important
    }

    h1.home-head {
        margin: 35px 20px 26px
    }

    .alignsolution-icon {
        align-items: center;
        justify-content: center;
        gap: 10px
    }

    .header-logo {
        width: 160px
    }

    .video-center {
        align-items: center;
        justify-content: center
    }

    .footer-bottom ul > li + li {
        border-left: none !important
    }

    h1.content-title {
        font-size: 1.5rem
    }

    .addressWebComponent-modal {
        margin-top: 50%
    }
}

@media (min-width:375px) and (-webkit-device-pixel-ratio :2) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 40%;
        font-size: 70%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 420px;
        width: 1025px;
        margin-top: 49%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 70%;
            font-size: 15px
        }
}

@media (min-width:414px) and (-webkit-device-pixel-ratio :2) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 40%;
        font-size: 70%
    }

    .confirm-firearm {
        height: 55% !important;
        width: 1025px;
        margin-top: 49%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 77%;
            font-size: 21px
        }
}

@media (min-width:390px) and (-webkit-device-pixel-ratio :3) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        font-size: 75%;
        margin-top: 39%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 55% !important;
        width: 1025px;
        margin-top: 45% !important
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 77%;
            font-size: 20px
        }
}

@media (min-width:393px) and (-webkit-device-pixel-ratio :2.75) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        font-size: 75%;
        margin-top: 40%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 55% !important;
        width: 1025px;
        margin-top: 45%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 77%;
            font-size: 20px
        }
}

@media (min-width:360px) and (-webkit-device-pixel-ratio :4) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 53%;
        font-size: 80%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .user-nav {
        margin-top: 16%;
        width: 77%
    }

    .login .login-modal {
        height: 290px;
        width: 300px
    }

    .login-modal {
        margin-top: 20%;
        margin-right: 10%
    }

    .quick-tools {
        margin-top: 57%;
        margin-bottom: 160px;
        height: auto
    }

        .quick-tools > h1 {
            margin: 0 0 -14px
        }

    .confirm-firearm {
        height: 55% !important;
        width: 1025px;
        margin-top: 55%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 77%;
            font-size: 15px
        }
}

@media (min-width:412px) and (-webkit-device-pixel-ratio :3.5) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 35%;
        font-size: 80%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 55% !important;
        width: 1025px;
        margin-top: 45%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 77%;
            font-size: 20px
        }
}

@media (min-width:768px) and (-webkit-device-pixel-ratio :2) {
    .confirm-modal {
        margin-top: 23%
    }

    .user-nav {
        margin-top: 3%
    }

    .login-modal {
        margin-top: 0
    }

    .quick-tools {
        margin-top: 45%
    }

    .confirm-firearm {
        height: 30% !important;
        margin-top: 23%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media (min-width:820px) and (-webkit-device-pixel-ratio :2) {
    .confirm-modal {
        margin-top: 23%
    }

    .confirm-firearm {
        height: 30% !important;
        margin-top: 23%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media (min-width:540px) and (-webkit-device-pixel-ratio :2.5) {
    .confirm-modal {
        margin-top: 22%
    }

    .mobi-btn.open .red {
        height: 3230%
    }

    .user-nav-h {
        display: block
    }

    .user-nav {
        margin-top: 3%;
        margin-left: 29%
    }

    .quick-tools {
        margin-top: 35%
    }

    .confirm-firearm {
        height: 62% !important;
        margin-top: 22%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media (min-width:412px) and (-webkit-device-pixel-ratio :2.625) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        font-size: 80%;
        margin-top: 37%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .user-nav {
        margin-top: 15%
    }

    .quick-tools {
        margin-top: 50%
    }

    .login-modal {
        margin-top: 26%;
        margin-right: 10%
    }

    .confirm-firearm {
        height: 64% !important;
        margin-top: 40%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 79%;
            font-size: 21px
        }
}

@media only screen and (min-device-width:375px) and (max-device-width:812px) and (-webkit-device-pixel-ratio:3) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        font-size: 80%;
        margin-top: 42%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 62% !important;
        margin-top: 22%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media only screen and (min-device-width:360px) and (max-device-width:740px) and (-webkit-device-pixel-ratio:3) {
    .login-modal {
        margin-top: 20%;
        margin-right: 10%
    }

    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        font-size: 80%;
        margin-top: 52%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 62% !important;
        margin-top: 55%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media only screen and (min-device-width:375px) and (max-device-width:768px) and (-webkit-device-pixel-ratio:2.62) {
    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 42%;
        font-size: 80%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 62% !important;
        margin-top: 22%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

@media only screen and (min-width:601px) and (max-width:991px) {
    .col-md-6.extra-pad:nth-child(2) {
        padding-left: 30px
    }

    .mobi-btn.open .red {
        height: 3230%
    }

    .display, .user-nav {
        display: none
    }

    .user-nav-h {
        display: block
    }

    .confirm-modal {
        margin-top: 42%;
        font-size: 80%
    }

        .confirm-modal > .modal-head > h2 {
            font-size: 20px
        }

    .confirm-firearm {
        height: 62% !important;
        margin-top: 22%
    }

        .confirm-firearm > .lined {
            overflow-y: scroll;
            max-height: 69%;
            font-size: 20px
        }
}

.acknowledgement {
    padding-left: 17px;
    padding-right: 35px
}

.disabledbutton {
    pointer-events: none;
    opacity: .4
}

.awc-modal-content {
    height: 640px
}

.awc-modal-dialog {
    max-width: 90%;
    margin: 1.75rem auto;
    max-height: 77%
}

.awc-modal-body {
    overflow-y: auto !important
}


.video-placeholder {
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.video-thumb {
    border-radius: 8px;
    transition: transform 0.2s ease;
}

.video-placeholder:hover .video-thumb {
    transform: scale(1.03);
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 48px;
    color: white;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
    pointer-events: none;
}