body.login h2 {font-size: 2.5rem}
body.login .form-control {height: 3.5rem; font-size: 1.6rem}
body.login .btn {font-size: 1.6rem}
body.login .login-box {margin: 4rem 0}
body.login .login-box .form-group {margin-bottom: 1em}

.form-group.field-gtin .input-group {max-width: 23em}
.form-group.field-gtin .input-group-btn button {height: 4.5rem; font-size: 1.6rem}

.header-top {
    display: block !important;
    background-color: white !important;
}

.toolkit .logo1 {
    margin: 5px 0 !important;
}

.logo1 span {
    display: inline-block;
}

.toolkit .logo img {
    height: 43px;
}

.toolkit .header-bottom {
    background-color: #02AC49;
}

.thead-color {
    background-color: var(--gs1-grass);
}

.mobile-table tr {
    display: inline-flex;
}

.mobile-table tbody tr {
    display: flex;
    flex-shrink: 0;
}

.mobile-table tbody td {
    min-width: 33.33%;
}

.mobile-table tbody tr:last-child td {
    border-bottom: none !important;
}

.thead-color th {
    color: white !important;
    font-weight: 500 !important;
}

.jumbotron {
  padding: 0 4rem;
  margin-bottom: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.jumbotron h1, .jumbotron p {color: #fff; text-align: center; text-shadow: 0 0 1rem rgba(0, 0, 0, .5)}
.jumbotron h1 {font-weight: 600; margin: 8.5rem 0 4rem}
.jumbotron p {font-size: 2.2rem}

.content-module-wrapper.search {border-top-color: var(--gs1-grass)}
.search .content-module {padding: 4rem}
.search .content-module h3 {border: none}
.search .content-module .bullets {padding-top: 2.2rem; font-weight: normal}
.search .content-module .bullets .fa {font-size: 2.4rem}
.search .content-module .bullets p {font-size: 2rem; line-height: 2.25}

.result form {margin: 4rem 0 3rem}
/*.result .backlink {margin-bottom: 4.5rem}
.result .backlink p {font-size: 1.7rem; font-weight: normal; letter-spacing: -0.38px; line-height: 2.7rem}
.result .backlink p a {font-weight: normal; text-decoration: none}*/

.result .alert {padding: 2rem; margin: 0 -2rem 3rem}
.result .alert img {float: left}
.result .alert span {font-size: 2.4rem; float: left; margin-top: 1px; position: relative}
.result .alert.complete {min-height: 5.1rem}
.result .alert .content {margin-left: 4rem}
.result .alert.complete .content {margin-left: 6.7rem}
.result .alert .content p {color: var(--gs1-dark-gray); font-size: 2rem; margin: 0}
.result .alert.complete .content p {color: var(--gs1-blue); font-weight: bold}
.result .alert .content p.small {font-size: 1.6rem; margin-top: 0.6rem}
.result .alert.complete .content p.small {color: var(--gs1-dark-gray); font-size: 1.8rem; font-weight: normal; margin-top: 0.5rem}

.product-info .content-module-wrapper {margin-bottom: 1.8rem; border-top-color: var(--gs1-grass)}
.product-info .content-module .img {margin-bottom: 1rem}
.product-info .content-module .img img {margin: auto; vertical-align: middle}
.product-info .img-responsive {object-fit: contain}
.product-info .img img {cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s}
.product-info .img img:hover {opacity: .75}

.product-info .data {margin: 0; table-layout: fixed}
.product-info .data tr {border-bottom: 1px solid var(--gs1-light-gray-shade)}
.product-info .data tr:last-of-type {border-bottom: none}
.product-info .data th, .product-info .data td {display: block; font-size: 1.4rem; border: none; line-height: 1.25}
.product-info .data th {color: var(--gs1-dark-gray); font-weight: normal; padding: 0.5rem 0.5rem 0.25rem}
.product-info .data td {padding: 0.5rem}
.product-info .data td, .product-info .data td a {color: var(--gs1-blue); font-weight: bold}
.product-info .data td a:hover {color: var(--gs1-link)}
.product-info .data td.image-url .i18n-item {white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
.product-info .data td .unknown {color: var(--gs1-dark-medium-gray); font-weight: normal}
.product-info .data td li {border-bottom: none; line-height: 1.2}
.product-info .data td ul li:first-child {padding-top: 0}

.target-markets li {margin-left: 2rem}
.target-markets img {margin-left: -2rem}

.footnote {font-size: 1.2rem; line-height: 1.4}

.img-modal .modal-dialog {width: 95vh}
.img-modal .modal-content {background: transparent; -webkit-box-shadow: none; box-shadow: none; border: none}
.img-modal .modal-body {padding: 0}
.img-modal img {cursor: default; margin: auto; max-height: 100vh}
.modal-backdrop.in {opacity: 0.85}

code {background: none; color: #999}
p.text-muted {color: #999 !important}

.errorlist li {font-size: 1.2rem; color: var(--gs1-error)}

.logo1 span {font-weight: 500; color: #f26334;}

a.example {cursor: pointer}

.package-table {
    position: relative;
}

.package-table td, .package-table th {text-align: center}

.spinner {
    width: 48px;
    height: 48px;
    border: 5px solid #002c6c;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

.package-table-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    visibility: hidden;
}

/* Spinner animation */
@keyframes rotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.blur {
    filter: blur(5px);
    transition: filter 0.3s ease;
}


/* XS - S */
@media (max-width: 767.98px) {
    .only-desktop {
      display: none !important;
    }

    .jumbotron {
        height: 37rem;
    }

    .jumbotron-compact {
        height: 20rem;
    }

    .jumbotron h1 {
        font-size: 4rem;
    }

    .query .jumbotron {
        background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)), url("../img/home_banner_mobile.0a3418b8f52e.jpg");
    }

    .result .jumbotron {
        background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)), url("../img/product_banner_mobile.c24f728c1a85.jpg");
    }

    .content-module-wrapper.search {
        margin-top: -2rem;
    }

    .search .content-module {
        padding: 2rem;
    }

    .package-table thead tr {
        display: inline-flex;
        column-gap: 10px;
    }
}

/* M - L - XL - XXL */
@media only screen and (min-width: 768px) {
    .only-mobile {
        display: none !important;
    }

    .toolkit .logo1 {
        margin-top: 0;
        padding-bottom: 20px;
        padding-top: 20px;
    }
    .header-bottom {display: none}
    .toolkit .logo img {
        padding-right: 16px;
        margin-right: 16px;
        border-right: 1px solid #b1b3b3;
    }


    .product-info .data th, .product-info .data td {display: table-cell; line-height: 1.6rem; padding: 1rem 0}
    .product-info .data :not(.package-table) th {width: 22rem; padding-left: 2rem; padding-right: 2rem;}
    /*.product-info .no-img th {max-width: 30rem; width: 30%}*/

    .jumbotron {
        height: 55rem;
    }

    .jumbotron-compact {
        height: 20rem;
    }

    .jumbotron h1 {
        font-size: 5rem;
    }

    .query .jumbotron {
        background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)), url("../img/home_banner.84d77401672f.jpg");
    }

    .result .jumbotron {
        background-image: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, 0)), url("../img/product_banner.f11f70cfa91a.jpg");
    }

    .content-module-wrapper.search {
        margin-top: -10rem;
    }

    .search .content-module {
        padding: 4rem;
    }
}

@media (orientation: portrait) {
  .img-modal .modal-dialog {width: 95vw}
}