﻿.gift-for-good-details {
    padding: 150px 15px;
    background: var(--cbf-purple-1000) url('/portals/0/gift-for-good-bg.png') center;
    background-size: contain;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.gift-for-good-details {
    max-width: 1920px;
    margin: 0 auto;
}

.gift-for-good-details .gift-details {
    background: var(--cbf-white-1000);
    padding: 30px;
    max-width: 1360px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
    box-shadow: var(--cbf-box-shadow);
    border-radius: var(--cbf-border-radius);
}

.gift-for-good-details .gift-details .gift-media {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.gift-for-good-details .gift-details .gift-media .gift-image-slider {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.gift-for-good-details .gift-details .gift-media:not(:has(.slick-slide)),
.gift-for-good-details .gift-details .gift-media:has(.slick-slide:only-child) .gift-image-slider {
    display: none !important;
}

.gift-for-good-details .gift-details .gift-media .gift-image-slider button {
    background: white !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.gift-for-good-details .gift-details .gift-media .gift-image .video a {
    position: relative;
}

.gift-for-good-details .gift-details .gift-media .gift-image .video a:before {
    content: '';
    background-image: url('/Portals/_default/Skins/CB/Images/play.png');
    width: 80px;
    height: 80px;
    position: absolute;
    inset: 0;
    margin: auto;
}

.gift-for-good-details .gift-details .gift-media .gift-image-slider p {
    margin: 0 !important;
    overflow: hidden;
    color: var(--cbf-tertiary-blue-1000);
    text-overflow: ellipsis;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}

.gift-for-good-details .gift-details .gift-media .gift-share {

}

.gift-for-good-details .gift-details .gift-media .gift-share ul {
    margin: 0px !important;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.gift-for-good-details .gift-details .gift-media .gift-share ul li {
    display: flex;
    justify-content: center;
    align-items: center;
}

.gift-for-good-details .gift-details .gift-information {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 750px;
}

.gift-for-good-details .gift-details .gift-information .gift-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.gift-for-good-details .gift-details .gift-information .gift-header p {
    overflow: hidden;
    color: var(--cbf-tertiary-blue-1000) !important;
    text-overflow: ellipsis !important;
    font-family: Roboto !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-header a {
    height: 50px;
    padding: 0 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--cbf-border-radius);
    border: 3px solid var(--cbf-gold-1000);
    color: var(--cbf-gold-1000) !important;
    text-align: center !important;
    font-family: "Roboto Condensed" !important;
    font-size: 23px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-title {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.gift-for-good-details .gift-details .gift-information .gift-title h3 {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-title h2 {
    color: var(--cbf-purple-1000) !important;
    font-family: Montserrat !important;
    font-size: 38px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: 47px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-description p {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-quote {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.gift-for-good-details .gift-details .gift-information .gift-quote h3 {
    color: var(--cbf-purple-1000) !important;
    font-family: Kalam !important;
    font-size: 30px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 45px !important;
    letter-spacing: -0.3px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-quote h5 {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 20px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information hr {
    border: 1px solid var(--cbf-purple-1000);
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-donation {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.gift-for-good-details .gift-details .gift-information .gift-donation h3 {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-donation .donation-radio-buttons {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

.gift-for-good-details .gift-details .gift-information .gift-donation .donation-radio-buttons label {
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--cbf-border-radius);
    background: var(--cbf-purple-200);
    color: var(--cbf-black-1000) !important;
    text-align: center !important;
    font-family: "Roboto Condensed" !important;
    font-size: 23px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    min-width: 100px;
}

.gift-for-good-details .gift-details .gift-information .gift-donation .donation-radio-buttons label:has(input[type=radio]:is(:checked)) {
    background: var(--cbf-gold-1000) !important;
}

.gift-for-good-details .gift-details .gift-information .gift-donation .donation-radio-buttons label input {
    display: none;
}

.gift-for-good-details .gift-details .gift-information .gift-quantity {
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: center;
}

.gift-for-good-details .gift-details .gift-information .gift-quantity h3 {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-quantity .counter {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.gift-for-good-details .gift-details .gift-information .gift-quantity button {
    background: white !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-quantity #txtQuantity {
    width: 103px;
    height: 68px;
    padding: 10px 0 11px 0;
    text-align: center;
    border-radius: var(--cbf-border-radius);
    border: 1px solid #CCCCCC;
    background: var(--cbf-white-1000);
    scroll-margin-top: 180px;
}

.gift-for-good-details .gift-details .gift-information .gift-type {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.gift-for-good-details .gift-details .gift-information .gift-type h3 {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .gift-type .gift-type-radio-buttons {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.gift-for-good-details .gift-details .gift-information .gift-type .gift-type-radio-buttons .gift-type-radio-button {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
}

.gift-for-good-details .gift-details .gift-information .gift-type .gift-type-radio-buttons .gift-type-radio-button input {

}

.gift-for-good-details .gift-details .gift-information .gift-type .gift-type-radio-buttons .gift-type-radio-button label {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 20px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    margin: 0 !important;
}

.gift-for-good-details .gift-details .gift-information .actions .btn.btn-primary {
    width: 100%;
    color: var(--cbf-black-1000);
}

.gift-for-good-details .gift-details .gift-information .actions .btn-submit {
    display: none;
}


.gift-for-good-details #myModal .modal-dialog {
    width: auto !important;
    max-width: 1233px;
}

@media (min-width: 768px) and (max-width: 1250px) {

    .gift-for-good-details #myModal .modal-dialog {
        margin-inline: 10px !important;
    }

}

.gift-for-good-details #myModal .modal-content {
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.gift-for-good-details #myModal .modal-content .modal-header {
    padding: 0px;
}

.gift-for-good-details #myModal .modal-content .modal-header {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border: 0px;
}

.gift-for-good-details #myModal .modal-content .modal-header p {
    margin: 0px;
    overflow: hidden;
    color: var(--cbf-tertiary-blue-1000) !important;
    text-overflow: ellipsis !important;
    font-family: Roboto !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
}

.gift-for-good-details #myModal .modal-content .modal-header .close {
    display: block;
    float: none;
    margin: 0 0 0 auto;
    height: 50px;
    padding: 0 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--cbf-border-radius);
    border: 3px solid var(--cbf-gold-1000);
    color: var(--cbf-gold-1000) !important;
    text-align: center !important;
    font-family: "Roboto Condensed" !important;
    font-size: 23px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
    opacity: 1;
}


.gift-for-good-details #myModal .modal-content .modal-body {
    padding: 0;
}

.gift-for-good-details #myModal .modal-content .modal-body .card-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 29px;
    align-self: stretch;
    border-bottom: 1px solid var(--cbf-black-1000);
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .header-checkbox {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .header-checkbox .card-checkbox {
    width: 36px;
    height: 36px;
    border: 1px solid black;
    border-radius: 50%;
    position: relative;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .header-checkbox .card-checkbox:has(input[type=checkbox]:checked) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='38' viewBox='0 0 38 38' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.2289 37.8219C21.6705 37.8219 24.0882 37.341 26.344 36.4066C28.5997 35.4722 30.6493 34.1027 32.3758 32.3763C34.1022 30.6498 35.4718 28.6002 36.4061 26.3444C37.3405 24.0887 37.8214 21.671 37.8214 19.2294C37.8214 16.7878 37.3405 14.3701 36.4061 12.1144C35.4718 9.85865 34.1022 7.80904 32.3758 6.08257C30.6493 4.3561 28.5997 2.98659 26.344 2.05223C24.0882 1.11787 21.6705 0.636963 19.2289 0.636963C14.2979 0.636963 9.56884 2.5958 6.08208 6.08257C2.59532 9.56933 0.636475 14.2984 0.636475 19.2294C0.636475 24.1604 2.59532 28.8895 6.08208 32.3763C9.56884 35.863 14.2979 37.8219 19.2289 37.8219ZM18.7497 26.749L29.0788 14.3541L25.9057 11.7098L17.0226 22.3674L12.4262 17.7689L9.50508 20.69L15.7026 26.8874L17.3015 28.4864L18.7497 26.749Z' fill='%2332B081'/%3E%3C/svg%3E");
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .header-checkbox .card-checkbox input[type=checkbox] {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card h3 {
    margin: 0px;
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details {
    display: flex;
    flex-direction: row;
    padding: 10px 0px 20px 0px;
    align-items: flex-start;
    gap: 43px;
    align-self: stretch;
}


.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__image-list {
    height: 690px;
    width: 500px !important;
    overflow: hidden;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__image-list .slick-list .slick-track {
    display: flex;
    flex-direction: row;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header img {
    display: flex;
    height: 690px;
    max-width: 500px !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    flex-shrink: 0;
    object-fit: cover;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__actions button {
    background: var(--cbf-white-1000) !important;
    border: 0px !important;
    margin: 0px !important;
    padding: 0px !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__actions button svg {
    display: inline-block !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header .gift-card-details-header__actions p {
    margin: 0 !important;
    overflow: hidden;
    color: var(--cbf-tertiary-blue-1000) !important;
    text-overflow: ellipsis !important;
    font-family: Roboto !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 30px !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .gift-card-details-form__header {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .gift-card-details-form__header h3 {
    color: var(--cbf-black-1000);
    font-family: Roboto !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .gift-card-details-form__header h2 {
    color: var(--cbf-purple-1000) !important;
    font-family: Montserrat !important;
    font-size: 38px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: 47px !important;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group {
    display: flex;
    flex-direction: column;
    min-width: 280px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group label {
    color: var(--cbf-black-1000) !important;
    font-family: Roboto !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 38px !important;
    margin: 0px;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group label:has(+.form-control[required]):after {
    content: '*';
    color: var(--cbf-black-1000);
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group input,
.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group textarea {
    border-radius: var(--cbf-border-radius);
    border: 1px solid #808080;
}

.gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form .form-group textarea {
    min-height: 261px;
}

.form-control.has-error {
    border: 1px solid red !important;
}

.other-gifts .header {
    padding: 50px 15px;
    background: var(--cbf-gold-1000);
    margin: 0px !important;
}

.other-gifts .header h2 {
    margin: 0 !important;
    text-align: center;
}

.other-gifts .gift-list {
    padding: 50px 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 48px;
}

.gift-list .gift {
    border-radius: var(--cbf-border-radius);
    background: #F7F7F7;
    box-shadow: var(--cbf-box-shadow);
    padding: 15px;
    max-width: 485px;
}

.gift-list .gift > .row {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.gift-list .gift .image-description {
    position: relative;
}

.gift-list .gift img {
    width: 100%;
    /*height: 100%;*/
    border-radius: var(--cbf-border-radius);
    position: relative;
    max-width: 455px;
    height: 451px;
}

.gift-list .gift .gift-description {
    padding: 30px;
    background: linear-gradient(0deg, rgba(152, 68, 186, 0.90) 0%, rgba(152, 68, 186, 0.90) 100%);
    color: var(--cbf-white-1000);
    border-radius: 10px;
    position: absolute;
    inset: 0;
    opacity: 0;
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
}

.gift-list .gift .image-description:hover .gift-description,
.gift-list .gift .image-description.hover .gift-description {
    opacity: 1;
}

.gift-list .gift .card-details {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.gift-list .gift .card-details .gift-category {
    color: var(--cbf-tertiary-blue-1000);
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}

.gift-list .gift .card-details .gift-category:empty {
    height: 30px;
}

.gift-list .gift .card-details .gift-title {
    color: var(--cbf-black-1000);
    font-family: Roboto;
    font-size: 27px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.gift-list .gift .card-details .gift-title:empty {
    height: 30px;
}

.gift-list .gift .card-details .gift-amount {
    color: var(--cbf-purple-1000);
    font-family: Montserrat;
    font-size: 38px;
    font-style: normal;
    font-weight: 800;
    line-height: 47px;
}

.gift-list .gift .card-details .gift-description-link {
    color: #333;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    text-decoration: underline;
    cursor: pointer;
}

.gift-list .gift .card-details .gift-links {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    align-items: flex-start;
}

.gift-list .gift .card-details .gift-links > * {
    flex-basis: 50%;
    flex-grow: 0;
}

.gift-list .gift .card-details .gift-links a {
    display: inline-block;
    margin-top: 10px;
}

.gift-list .gift .card-details .gift-links .btnAdd {
    padding: 15px 30px;
    text-align: center;
    color: var(--cbf-black-1000);
    font-family: 'Roboto Condensed';
    font-size: 23px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    border-radius: var(--cbf-border-radius);
    background: var(--cbf-gold-1000);
    outline: none;
    border: 0px;
}

.gift-list .gift .card-details .gift-links .btnAdd:hover {
    background: var(--cbf-gold-800);
}

.gift-list .gift .card-details .gift-links .btnAdd:active {
    background: var(--cbf-gold-1200);
}

.gift-list .gift .card-details .gift-links .btnLearnMore {
    border-radius: 10px;
    color: var(--cbf-gold-1000) !important;
    font-family: 'Roboto Condensed';
    font-size: 23px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-decoration: underline;
    text-align: center;
    padding: 10px 5px;
}

.gift-list .gift .card-details .gift-links .btnLearnMore:hover,
.gift-list .gift .card-details .gift-links .btnLearnMode:active {
    color: var(--cbf-gold-1200) !important;
}

@media (max-width: 1100px) {

    .gift-for-good-details .gift-details .gift-media .gift-image {
        max-width: 500px !important;
        max-height: 1000px !important;
        overflow: hidden;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image .slick-list .slick-track {
        display: flex;
        flex-direction: row;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image img {
        max-width: 500px !important;
        height: 1000px !important;
        object-fit: cover;
    }

    .gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details {
        flex-direction: column;
    }

    .gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-header {
        margin: 0 auto;
    }

    .gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form {
        width: 100%;
    }

}

@media (min-width: 1100px) { 
    
    .gift-for-good-details {
        padding: 150px 50px;
    }

    .gift-for-good-details .gift-details {
        flex-direction: row;
        align-items: stretch;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image {
        max-width: 500px !important;
        max-height: 1000px !important;
        overflow: hidden;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image .slick-list .slick-track {
        display: flex;
        flex-direction: row;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image img {
        max-width: 500px !important;
        height: 1000px !important;
        object-fit: cover;
    }


    .gift-for-good-details #myModal .modal-content .modal-body .gift-card .gift-card-details .gift-card-details-form {
        flex-grow: 1;
    }

    .other-gifts .gift-list {
        display: grid;
        grid-template-columns: repeat(3, max-content);
        justify-content: center;
        align-items: center;
        gap: 48px 42px;
    }

}

@media (max-width: 600px)
{
    .gift-for-good-details .gift-details .gift-information .gift-quantity #txtQuantity
    {
        width:45px;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image
    {
        max-width:280px!important;
        height:auto!important;
    }

    .gift-for-good-details .gift-details .gift-media .gift-image img
    {
        max-width: 280px !important;
        height: auto !important;
    }
}

.gift-for-good-details .modal .modal-dialog {
    width: auto !important;
}

.gift-for-good-details .modal .modal-content {
    width: 100%;
    /*height: 716px;*/
}

.gift-for-good-details .modal.in .modal-content .modal-footer {
    display: flex !important;
    flex-direction: column;
}

.gift-for-good-details .modal .modal-footer .actions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    background-color: var(--cbf-black-1000);
    padding: 15px 30px !important;
}

.gift-for-good-details .modal .modal-footer .video-description {
    background: var(--cbf-white-1000);
    padding: 32px;
    max-height: 200px;
    overflow-y: scroll;
}

.gift-for-good-details .modal .modal-footer .video-description div {
    max-width: 600px;
    text-align: left;
}

@media (min-width: 1000px) {

    .gift-for-good-details .modal .modal-content {
        width: 1122px;
        /*height: 716px;*/
        margin: 0 auto;
    }

}