/* Custom Styles Visual Badge*/

@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');

*,
::before,
::after {
    box-sizing: border-box !important;
}

body {
    font-family: 'Raleway', sans-serif !important;
    background-color: white !important;
    font-size: 14px !important;
    line-height: 1.5em !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

input,
select {
    font-family: 'Raleway', sans-serif !important;
}

#build_disclaimer,
#cb_disclaimer,
#collar_disclaimer,
#cbh_disclaimer {
    color: rgb(45, 45, 45) !important;
    font-size: 14px !important;
    line-height: 20px !important;
    margin-bottom: 16px !important;
}

#build_left #build_left_intro {
    margin-bottom: 40px !important;
    margin-top: 20px !important;
}

#build_left #build_left_intro span {
    font-size: 20px !important;
    line-height: 30px !important;
    color: rgb(9 67 105) !important;
}

#build_left #build_left_intro span:first-of-type {
    font-weight: bold !important;
}

#build_left #build_left_intro span:nth-of-type(2) {
    font-size: 14px !important;
    line-height: 20px !important;
}

#build_left {
    background-color: rgb(241 241 241) !important;
    padding: 20px !important;
    text-align: left;
    max-width: 100% !important;
}

#build_left > div,
#build_line_wrap > div {
    margin-bottom: 16px !important;
}

[type='text'],
[type='email'],
[type='url'],
[type='password'],
[type='number'],
[type='date'],
[type='datetime-local'],
[type='month'],
[type='search'],
[type='tel'],
[type='time'],
[type='week'],
[multiple],
textarea,
select {
    background-color: #fff !important;
    border: 2px solid rgb(218 188 121) !important;
    border-radius: 0px !important;
    padding-top: 8px !important;
    padding-right: 12px !important;
    padding-bottom: 8px !important;
    padding-left: 12px !important;
    font-size: 14px !important;
    line-height: 1.5em !important;
    transition-property: color, background-color, border-color, fill, stroke,
    -webkit-text-decoration-color !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, -webkit-text-decoration-color !important;
    transition-duration: 150ms !important;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
    height: 44px !important;
    text-transform: none !important;
    color: rgb(45, 45, 45) !important;
}

textarea {
    height: auto !important;
}

[type='text']:focus,
[type='email']:focus,
[type='url']:focus,
[type='password']:focus,
[type='number']:focus,
[type='date']:focus,
[type='datetime-local']:focus,
[type='month']:focus,
[type='search']:focus,
[type='tel']:focus,
[type='time']:focus,
[type='week']:focus,
[multiple]:focus,
textarea:focus,
select:focus {
    border-color: rgb(9 67 105) !important;
    box-shadow: none !important;
}

select {
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact !important;
    font-weight: 700 !important;
    color: rgb(9 67 105) !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23094369' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e") !important;
    background-position: right 0.5rem center !important;
    background-repeat: no-repeat;
    position: relative;
    background-size: 1.5em 1.5em !important;
}

select:focus-visible {
    outline: none !important;
}

#build_model span,
#build_finish_ddl span,
#build_qty span,
#build_font span,
#build_enameltype span,
#build_color span,
#build_attachment span,
#build_attachment_O span,
#build_attachment_FB span,
#build_back span,
#build_shape span,
.build_line span,
#build_seal span,
#build_model_O span:first-child,
#build_model_FB span:first-child,
#build_model_PK span:first-child,
#build_model_M span:first-child,
#build_attachment_M span:first-child,
#build_model_BL span:first-child,
#build_model_BE span:first-child,
#build_textsep > span,
#build_specins span,
#build_leatherimprint > span {
    margin-bottom: 0 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    color: rgb(9 67 105) !important;
    margin-right: 12px !important;
}

#build_line_wrap {
    margin: 24px 0 0 !important;
    border-top: 2px dotted rgb(208 208 208) !important;
    padding-top: 16px !important;
}

#build_left span.lettering {
    font-size: 18px !important;
    line-height: 24px !important;
    color: rgb(9 67 105) !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    width: auto !important;
    display: inline-block !important;
    margin-bottom: 16px !important;
}

#build_left span.lettering + .build_help {
    margin-top: 0 !important;
}

.build_line input {
    width: 248px !important;
}

#build_btnChangeSeal,
#build_btnChangeBadge,
#build_btnChangeLeather,
.actionbutton {
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    transition-property: color, background-color, border-color, fill, stroke,
    -webkit-text-decoration-color !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, -webkit-text-decoration-color !important;
    transition-duration: 150ms !important;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-height: 44px !important;
    padding-top: 0.75em !important;
    padding-bottom: 0.75em !important;
    padding-left: 1em !important;
    padding-right: 1em !important;
    font-size: 14px !important;
    line-height: 23px !important;
    color: rgb(255 255 255) !important;
    border-radius: 0 !important;
    width: auto !important;
    box-shadow: none !important;
    border: none !important;
    background-color: rgb(218 188 121) !important;
    color: white !important;
    max-width: none !important;
    margin: 0 !important;
}

#build_btnChangeSeal:hover,
#build_btnChangeBadge:hover,
#build_btnChangeLeathe:hover,
.actionbutton:hover {
    background-color: rgb(185 160 104) !important;
}

#build_btnChangeSeal {
    width: 170px !important;
}

#ddlColor {
    width: 248px !important;
}

.btnAddToCart.actionbutton {
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    transition-property: color, background-color, border-color, fill, stroke,
    -webkit-text-decoration-color !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke !important;
    transition-property: color, background-color, border-color,
    text-decoration-color, fill, stroke, -webkit-text-decoration-color !important;
    transition-duration: 150ms !important;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-height: 44px !important;
    padding-top: 0.75em !important;
    padding-bottom: 0.75em !important;
    padding-left: 1em !important;
    padding-right: 1em !important;
    font-size: 14px !important;
    line-height: 23px !important;
    border-radius: 0 !important;
    width: auto !important;
    box-shadow: none !important;
    border: none !important;
    background-color: rgb(19 137 193) !important;
    color: rgb(255 255 255) !important;
}

.btnAddToCart.actionbutton:hover {
    background-color: rgb(17 113 158) !important;
}

#vb_top {
    height: auto !important;
    box-shadow: none !important;
    padding: 24px 20px !important;
    background-color: white !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-bottom: 2px solid rgb(218 188 121) !important;
}

#build_preview_summary {
    margin-top: 0 !important;
    line-height: 35px !important;
    color: rgb(9 67 105) !important;
    font-size: 24px !important;
    font-weight: 600;
    margin-bottom: 16px !important;
}

#build_wrap {
    color: rgb(9 67 105) !important;
    line-height: normal !important;
    margin-top: 0 !important;
    box-shadow: none !important;
}

#build_wrap input[type='radio'] + label,
#collar_wrap input[type='radio'] + label,
#cb_wrap input[type='radio'] + label {
    color: rgb(9 67 105) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 14px !important;
    min-width: 90px;
    display: inline-block;
    margin-right: 12px !important;
}

#divBEDefaults {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
    line-height: 20px !important;
    font-size: 14px !important;
    border-top: 2px solid rgb(218 188 121) !important;
    border-bottom: 2px dotted rgb(208 208 208) !important;
}

#divBEDefaults > strong:first-child {
    font-size: 18px !important;
    display: block !important;
}

#build_price_details span {
    color: rgb(9 67 105) !important;
    margin-left: 0 !important;
    font-size: 18px !important;
    font-weight: bold !important;
    margin-bottom: 16px !important;
}

#build_price {
    position: relative;
    margin-top: 32px !important;
    margin-bottom: 16px !important;
    max-width: none !important;
}

#build_price_summary {
    width: auto !important;
    height: auto !important ;
    line-height: 30px !important;
    position: absolute;
    right: 0px;
    top: 0 !important;
    text-align: center;
    font-size: 24px !important;
    font-weight: bold !important;
    color: rgb(218 188 121) !important;
}

#build_tblPrice {
    color: rgb(45, 45, 45) !important;
    background-color: white !important;
    border: none !important;
    padding: 12px !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 20px !important;
    border-collapse: collapse;
    background-color: rgb(241, 241, 241) !important;
}

#build_tblPrice th {
    padding: 8px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 20px !important;
}

#build_tblPrice td {
    padding: 8px !important;
}

.build_help {
    background-image: none !important;
    width: 28px !important;
    height: 28px !important;
    text-decoration: none !important;
    margin-top: 9px !important;
}

.build_help:after {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    display: flex !important;
    background: rgb(9 67 105) !important;
    content: '?' !important;
    font-weight: bold !important;
    align-items: center;
    justify-content: center;
    color: white !important;
    text-decoration: none !important;
}

#build_textsep,
#build_back,
#build_shape {
    min-height: 56px !important;
}

#build_textsep > span,
#build_back > span,
#build_shape > span {
    display: block !important;
    margin-bottom: 8px !important;
    width: auto !important;
    max-width: none !important;
}

#build_textsep .build_help,
#build_back .build_help,
#build_shape .build_help {
    margin-top: -27px !important;
}

#build_shape {
    border-bottom: none !important;
}

#vb_footer {
    padding-bottom: 0 !important;
}

#build_model_O span:first-child,
#build_model_FB span:first-child,
#build_model_PK span:first-child,
#build_model_M span:first-child,
#build_model_BL span:first-child,
#build_model_BE span:first-child {
    width: auto !important;
    display: block !important;
    margin-bottom: 4px !important;
}

.dd-select {
    border: 2px solid rgb(218 188 121) !important;
    background-color: white !important;
    border-radius: 0 !important;
    width: 352px !important;
}

.dd-options,
.dd-container {
    width: 352px !important;
}

#build_font {
    border-top: 2px dotted rgb(208 208 208) !important;
    padding-top: 16px !important;
}

#build_font .build_help {
    margin-top: 0 !important;
}

#build_right {
    padding: 135px 20px 20px !important;
    background-size: 200px !important;
    background-position: center 50px !important;
}

#build_addtocart.actionbutton {
    height: 72px !important;
    width: auto !important;
    font-size: 16px !important;
    line-height: 48px !important;
    grid-column: 1 / 3 !important;
}

@media screen and (min-width: 768px) {
    #build_right {
        padding: 165px 20px 20px !important;
    }
}

#build_buttons {
    margin: 0 auto !important;
    max-width: 320px !important;
    display: grid !important;
    gap: 12px !important;
    grid-template-columns: 1fr 1fr !important;
}

#build_buttons #build_vb_logo {
    grid-column: 1 / 3 !important;
    margin-top: 40px !important;
}

#build_buttons #build_disclaimer {
    grid-column: 1 / 3 !important;
    margin-top: 0 !important;
    max-width: none !important;
}

#build_buttons #build_catalogimg {
    justify-self: center;
    grid-column: 1/ 3;
    margin-top: 20px !important;
}

#build_acrylic {
    padding-top: 16px !important;
    border-top: 2px dotted rgb(208 208 208) !important;
}

#build_acrylic span.acr_title {
    font-size: 18px !important;
    line-height: 24px !important;
    color: rgb(9 67 105) !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    width: auto !important;
    display: inline-block !important;
    margin-bottom: 16px !important;
}

.acrylic_StepHeader > span {
    margin-bottom: 0 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    color: rgb(9 67 105) !important;
    display: inline-block !important;
    width: 100px !important;
    max-width: 28% !important;
}

#build_wrap input[type="radio"]:checked + label span,
#collar_wrap input[type="radio"]:checked + label span,
#cb_wrap input[type="radio"]:checked + label span {
    background-color: rgb(218 188 121) !important;
    width: 16px !important;
    height: 16px !important;
    border: 1px solid rgba(112,112,112,0.25) !important;
}


#build_wrap input[type="radio"] + label span,
#collar_wrap input[type="radio"] + label span,
#cb_wrap input[type="radio"] + label span {
    width: 16px !important;
    height: 16px !important;
    margin: -3px 4px 0 0 !important;
}

#build_acrylic .acrylic_StepHeader {
    padding-bottom: 16px !important;
}

/* Category page */

.categ_title {
    color: rgb(9, 67, 105) !important;
}

.categ_title:hover {
    color: rgb(9, 67, 105) !important;
    text-decoration: underline !important;
}

.onebadge-inner-wrap {
    background-color: white !important;
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1) !important;
    padding: 12px !important;
}

.badge_bottom {
    left: 0 !important;
    bottom: 12px !important;
    padding: 0 12px !important;
}

#build_right {
    background-image: none !important;
    padding-top: 20px !important;
}

#vb_top,
#vb_navigation,
#build_vb_logo {
    display: none !important;
}