:root {
    --space-unit: 1em;
    --space-xxxxs: calc(0.125*var(--space-unit));
    --space-xxxs: calc(0.25*var(--space-unit));
    --space-xxs: calc(0.375*var(--space-unit));
    --space-xs: calc(0.5*var(--space-unit));
    --space-sm: calc(0.75*var(--space-unit));
    --space-md: calc(1.25*var(--space-unit));
    --space-lg: calc(2*var(--space-unit));
    --space-xl: calc(3.25*var(--space-unit));
    --space-xxl: calc(5.25*var(--space-unit));
    --space-xxxl: calc(8.5*var(--space-unit));
    --space-xxxxl: calc(13.75*var(--space-unit));
    --component-padding: var(--space-md)
}

:root {
    --max-width-xxs: 32rem;
    --max-width-xs: 38rem;
    --max-width-sm: 48rem;
    --max-width-md: 64rem;
    --max-width-lg: 80rem;
    --max-width-xl: 90rem;
    --max-width-xxl: 120rem
}


:root {
    --radius-sm: calc(var(--radius, 0.25em)/2);
    --radius-md: var(--radius, 0.25em);
    --radius-lg: calc(var(--radius, 0.25em)*2);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .085), 0 1px 8px rgba(0, 0, 0, .1);
    --shadow-md: 0 1px 8px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .15);
    --shadow-lg: 0 1px 8px rgba(0, 0, 0, .1), 0 16px 48px rgba(0, 0, 0, .1), 0 24px 60px rgba(0, 0, 0, .1);
    --bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    --ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
    --ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    --ease-out: cubic-bezier(0.215, 0.61, 0.355, 1)
}

:root {
    --body-line-height: 1.4;
    --heading-line-height: 1.2
}


:root {
    --icon-xxs: 12px;
    --icon-xs: 16px;
    --icon-sm: 24px;
    --icon-md: 32px;
    --icon-lg: 48px;
    --icon-xl: 64px;
    --icon-xxl: 128px
}

.icon {
    display: inline-block;
    color: inherit;
    fill: currentColor;
    height: 1em;
    width: 1em;
    line-height: 1;
    -ms-flex-negative: 0;
    flex-shrink: 0
}
.svgico {
    display: inline-block;
    width: 1em;
    height: 1em;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
}
.nav-header .svgico {
    fill: #006a49;
}
.icon--xxs {
    font-size: 12px;
    font-size: var(--icon-xxs)
}

.icon--xs {
    font-size: 16px;
    font-size: var(--icon-xs)
}

.icon--sm {
    font-size: 24px;
    font-size: var(--icon-sm)
}

.icon--md {
    font-size: 32px;
    font-size: var(--icon-md)
}

.icon--lg {
    font-size: 48px;
    font-size: var(--icon-lg)
}

.icon--xl {
    font-size: 64px;
    font-size: var(--icon-xl)
}

.icon--xxl {
    font-size: 128px;
    font-size: var(--icon-xxl)
}

.icon--is-spinning {
    -webkit-animation: icon-spin 1s infinite linear;
    animation: icon-spin 1s infinite linear
}

@-webkit-keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.icon use {
    color: inherit;
    fill: currentColor
}


.text-replace {
    overflow: hidden;
    color: transparent !important;
    text-indent: 100%;
    white-space: nowrap
}

.text-center {
    text-align: center
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}


.color-inherit {
    color: inherit
}

@supports (--css: variables) {
    @media (min-width: 64rem) {
        :root {
            --space-unit: 1.25em
        }
    }
}

:root {
    --radius: 0.25em
}

:root {
    --font-primary: sans-serif;
    --text-base-size: 1em;
    --text-scale-ratio: 1.2;
    --text-xs: calc(1em/var(--text-scale-ratio)/var(--text-scale-ratio));
    --text-sm: calc(var(--text-xs)*var(--text-scale-ratio));
    --text-md: calc(var(--text-sm)*var(--text-scale-ratio)*var(--text-scale-ratio));
    --text-lg: calc(var(--text-md)*var(--text-scale-ratio));
    --text-xl: calc(var(--text-lg)*var(--text-scale-ratio));
    --text-xxl: calc(var(--text-xl)*var(--text-scale-ratio));
    --text-xxxl: calc(var(--text-xxl)*var(--text-scale-ratio));
    --body-line-height: 1.4;
    --heading-line-height: 1.2;
    --font-primary-capital-letter: 1
}

@supports (--css: variables) {
    @media (min-width: 64rem) {
        :root {
            --text-base-size: 1.25em;
            --text-scale-ratio: 1.25
        }
    }
}


:root {
    --btn-font-size: 1em;
    --btn-font-size-sm: calc(var(--btn-font-size) - 0.2em);
    --btn-font-size-md: calc(var(--btn-font-size) + 0.2em);
    --btn-font-size-lg: calc(var(--btn-font-size) + 0.4em);
    --btn-radius: 0.25em;
    --btn-padding-x: var(--space-sm);
    --btn-padding-y: var(--space-xs)
}


:root {
    --cd-color-1: hsl(210, 31%, 24%);
    --cd-color-1-h: 210;
    --cd-color-1-s: 31%;
    --cd-color-1-l: 24%;
    --cd-color-2: hsl(204, 73%, 52%);
    --cd-color-2-h: 204;
    --cd-color-2-s: 73%;
    --cd-color-2-l: 52%;
    --cd-color-3: hsl(0, 0%, 100%);
    --cd-color-3-h: 0;
    --cd-color-3-s: 0%;
    --cd-color-3-l: 100%;
    --cd-color-4: hsl(192, 15%, 94%);
    --cd-color-4-h: 192;
    --cd-color-4-s: 15%;
    --cd-color-4-l: 94%;
    --cd-color-5: hsl(7, 80%, 56%);
    --cd-color-5-h: 7;
    --cd-color-5-s: 80%;
    --cd-color-5-l: 56%;
    --font-primary: 'Source Sans Pro', sans-serif
}

.cd-cart::before {
    content: '';
    position: fixed;
    z-index: 1;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s, visibility .4s
}

.cd-cart--open::before {
    opacity: 1;
    visibility: visible
}

.cd-cart__trigger, .cd-cart__content {
    position: absolute;
    top:.75rem;
    /* bottom: 20px;*/
    right: 1rem;
    background:#fff;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius:6px;
}

/*.cd-cart--empty .cd-cart__trigger, .cd-cart--empty .cd-cart__content {
    -webkit-transform: translateY(150px);
    -ms-transform: translateY(150px);
    transform: translateY(150px)
}*/

@media (min-width: 80rem) {
    .cd-cart__trigger, .cd-cart__content {
        /*bottom: 40px*/
    }
}

.cd-cart__trigger {
    z-index: 3;
    height: 36px;
    width: 36px;
    overflow: visible
}

.cd-cart__trigger::after, .cd-cart__trigger::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    height: 100%;
    width: 100%;
    background: url(img/cd-icons-cart-close.svg) no-repeat 0 0;
    transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, transform .2s;
    transition: opacity .2s, transform .2s, -webkit-transform .2s;
    background-size: cover;
}

.cd-cart__trigger::after {
    background-position: -72px 0;
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(90deg);
    -ms-transform: translateX(-50%) translateY(-50%) rotate(90deg);
    transform: translateX(-50%) translateY(-50%) rotate(90deg)
}

.cd-cart--open .cd-cart__trigger::before {
    opacity: 0
}

.cd-cart--open .cd-cart__trigger::after {
    opacity: 1;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.cd-cart__trigger:hover + .cd-cart__content .cd-cart__layout {
    box-shadow: 0 6px 40px rgba(0,0,0,0.3)
}

.cd-cart--open .cd-cart__trigger:hover + .cd-cart__content .cd-cart__layout {
    box-shadow: 0 4px 30px rgba(0,0,0,0.17)
}

.cd-cart__count {
    position: absolute;
    top: -5px;
    right: -5px;
    height: 18px;
    width: 18px;
    background: #006a49;
    color: hsl(0, 0%, 100%);
    color: var(--cd-color-3);
    font-size: 0.83333em;
    font-size: var(--text-xs);
    font-weight: bold;
    border-radius: 50%;
    text-indent: 0;
    transition: -webkit-transform .2s .5s;
    transition: transform .2s .5s;
    transition: transform .2s .5s, -webkit-transform .2s .5s;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.cd-cart__count li {
    position: absolute;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: .15s;
    animation-duration: .15s;
    list-style:none;
}

.cd-cart__count li:last-of-type {
    visibility: hidden
}

.cd-cart__count--update li:last-of-type {
    -webkit-animation-name: cd-qty-enter;
    animation-name: cd-qty-enter
}

.cd-cart__count--update li:first-of-type {
    -webkit-animation-name: cd-qty-leave;
    animation-name: cd-qty-leave
}

.cd-cart--open .cd-cart__count {
    transition: -webkit-transform .2s 0s;
    transition: transform .2s 0s;
    transition: transform .2s 0s, -webkit-transform .2s 0s;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}

.cd-cart--empty .cd-cart__count {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}
.remove-from-cart,
.show-blueprint,
.add-to-cart {
    background-color: #006a49;
    border-color: #006a49;
    color: #fff !important;
    font-size: 14px;
    border-radius: 4px;
    padding: 7px 10px 5px;
    font-weight: normal;
    float: right;
    cursor: pointer;
}
    .add-to-cart .enabled {
        pointer-events: auto;
        opacity: unset;
    }
    .add-to-cart .disabled {
        pointer-events: none;
        opacity: 0.5;
    } 
.login-link {
      cursor:pointer;  
}
.show-blueprint{
    background-color: #173049;
    border-color: #173049;
}
input.mini-input {
    padding: 5px 5px;
    line-height: 1;
    border: 1px solid #585e5d;
    border: 1px solid rgba(0, 106, 73, .5);
    border-radius: 0;
    font-size: 0.9rem;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    font-family: "Arvo", sans-serif;
    font-family: "Avenir LT W01_65 Medium1475532", sans-serif;
    background-color: #fff;
    background: #fff!important;
    color: #585e5d!important;
 max-width: 100px;
    width: 100%;
}

    input.mini-input.invalid {
        border-color: red; 
    }

#cart_content {
    top: -.25rem;
    max-height: 0px;
    transition: opacity ease-in-out 150ms;
    overflow: hidden;
    background: #efefef;
    position: absolute;
    right: 4rem;
    z-index:33;
    opacity:0;
    border-radius:1rem;
}
.popup_add_sign {
    color: #006a49;
    font-weight: bold;
}

a:hover + #cart_content {
    max-height: 400px;
    padding: 1rem;
    margin:1rem 0 1rem;
    opacity:1;
    /* position:absolute;
    display:block;
    top:10px;
    z-index:10;
    right:75px;
  
       */
}
#item-add-popup {
    transition: opacity ease-in-out 150ms;
    background: #efefef;
    z-index: 20;
    position: absolute;
    top: 0.4rem;
    right: 4rem;
    padding: 0.8rem;
    border-radius: 1rem;
    border: 2px solid #006a49;
}
.cart-container {
    padding: 2rem 0;
    position: relative;
    min-height: 300px;
}
.portal_product__table {

}
.th-general {
    background: #006a49;
    color: #fff;
    border-top: 1px solid #006a49;
    border-bottom: 1px solid #006a49;
}
    .portal_product__table th,
    .portal_product__table td {
        font-size: 85%;
        font-size: .85em;
        padding:5px;
    }
    .cellwood-form-wrapper .padding {
    width:100%;
    padding:1rem;
    margin:auto;
    }
    .cellwood-form-wrapper .padding-left {
        width: 100%;
        padding-left: 0.25rem;
        margin: auto;
    }
.responsive-table-wrapper {
        overflow-x: auto;
    display: block;
    
}
@media all and (min-width: 1024px) {
    .checkoutpage .col-left {
        width: 25%;
    }

    .checkoutpage .col-right {
        width: 75%;
    }
    .cellwood-form-wrapper .padding {
    width:100%;
      padding:1rem .25rem;
    margin:auto;
}
}

    .cellwood-form-wrapper textarea {
        padding: 5px 5px;
        line-height: 1;
        border: 1px solid #585e5d;
        border: 1px solid rgba(0, 106, 73, .5);
        border-radius: 0;
        font-size: 0.9rem;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear;
        font-family: "Arvo", sans-serif;
        font-family: "Avenir LT W01_65 Medium1475532", sans-serif;
        background-color: #fff;
        background: #fff !important;
        color: #585e5d !important;
        width:100%;
        min-height:150px;
    }
    .cellwood-form-wrapper select {
        padding: 5px 5px;
        line-height: 1;
        border: 1px solid #585e5d;
        border: 1px solid rgba(0, 106, 73, .5);
        border-radius: 0;
        font-size: 0.9rem;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear;
        font-family: "Arvo", sans-serif;
        font-family: "Avenir LT W01_65 Medium1475532", sans-serif;
        background-color: #fff;
        background: #fff !important;
        color: #585e5d !important;
        min-width:100%;
    }
    .cellwood-form-wrapper hr {
        border:none;
        border-bottom: 1px solid rgba(0, 106, 73, .5);
    }
.article-table-nav {
    text-align:left;
}
    .article-table-nav a,
    .article-table-nav span {
        display:inline-block;
        font-weight: normal;
        padding: 5px 5px 5px 0;
    }
