.first-step-container{
    display: flex;
    width: 100%;
    height: auto;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 56px;
}
.first-step-container .container-step{
    width: 25%;

}
.choose-sub{
    display: flex;
    flex-direction: column;
    border-radius: 24px;
    background: #BFBFBF;
    padding: 16px;
    gap: 16px;
    min-height: 220px;
}
.first-step-container .subs-count{
    width: fit-content;
    place-self: end;
    padding: 8px;
    border-radius: 16px;
    background: #FFF;
    height: fit-content;
}
.first-step-container img{
    place-self: center;
    width: 75px;
    object-fit: cover;
}
.first-step-container .sub-title{
    color: #FFF;
    text-align: center;
    font-family: MacPaw Fixel;
    font-size: 20px;
    font-style: normal;
    font-weight: 900;
    line-height: 120%;
    text-transform: uppercase;
    width: 100%;
}
input[type='radio']{
    visibility: hidden;
}
input[type="radio"]:checked + label {
    background-color: #5F51FF;

}
.hide{
    display: none;
}
.blocks{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    gap: 20px;
}
.block-name{
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center;
    cursor: pointer;
    font-family: 'MacPaw Fixel';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    color: #FFFFFF !important;
    border: none;
    padding: 10px 12px;
    background: #5F51FF;
    border-radius: 8px;
    max-height: 42px;
}
.for-quote{
    gap: 24px;
}
[class*="imagePreviewContainer"]{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 20px;
    width: 100%;
    margin-top: 20px;

}
.imgWrapper{
    display: flex;
    max-width: 200px;


}
.imgWrapper img{
    width: 100%;
    max-height: 150px;
    object-fit: cover;
}
.deleteImageBtn{
    display: flex;
    flex-direction: column;
    place-self: start;
    background: none;
    border: none;
    color: red;
    font-size: 16px;
    font-weight: 600;

}
.input-file-label{
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center;
    cursor: pointer;
    font-family: 'MacPaw Fixel';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    color: #5F51FF ;
    border: none;
    padding: 10px 12px;
    background: #E1E1E1;
    border-radius: 8px;
    max-height: 42px;
}
input[name='gallery-files']{
    display: none;
}
.primary_delete_button {
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center;
    cursor: pointer;
    font-family: 'MacPaw Fixel';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    color: #FFFFFF !important;
    border: none;
    padding: 10px 12px;
    background: #ff2525;
    border-radius: 8px;
    max-height: 42px;
}
.primary_delete_button:hover{
    cursor: pointer;
    background: red;
}
.heading-text-wrapper{
    display: flex;
    flex-wrap: nowrap;
    gap: 24px;

}

.heading-wrapper{
    width: 40%;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.text-wrapper{
    width: 60%;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.imageUpload{
    visibility: hidden;
}
.heading-wrapper:nth-child(2){
    width: 60%;
}
.heading-wrapper .imgWrapper{
    max-width: unset;
    width: 100%;
}
.heading-wrapper div img{
    width: 100%;
    object-fit: cover;
    max-height: 250px;
}
.full-size-photo-wrapper .imgWrapper{
    width: 100%;
    max-width: unset;
}
.full-size-photo-wrapper .imgWrapper img{
    max-height: 400px;
}
.imgWrapper video{
    width: 100%;
}
#memory-blocks{
    display: flex;
    flex-direction: column;
    gap: 24px;
}
#error{
    color: red;
    font-family: MacPaw Fixel;
    font-size: 20px;
    font-style: normal;
}
.second-step-container{
    display: flex;
    flex-direction: column;
    gap: 64px;
    width: 66.6%;

}
.section-container{
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    font-family: 'MacPaw Fixel';

}

.section-header{
    color: #181727;

    font-family: MacPaw Fixel;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    width: 100%;

}
.section-container .file-input-area{
    justify-content: unset;
}
.section-container .file-input-area .add-photo-btn{
    right: unset;
    left: 54px;
}
.form-create{
    width: 100%;
}
.flex-between{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.flex-between button{
    white-space: nowrap;
}
.create-memory-textarea{
    padding: 12px 16px;
    width: 100%;
    background: #F2F2F2;
    border: none;
    border-radius: 8px;
    max-width: 100%;
}
.create-memory-textarea-small{
    height: 60px;
}
.create-memory-textarea-big{
    height: 120px;
}
.create-memory-textarea:focus{
    outline: 1px solid #5F51FF;
}
.create-memory-select{
    padding: 12px 16px;
    justify-content: space-between;
    align-items: center;
    line-height: 1;
    display: flex;
    border-radius: 8px;
    border: 1px solid #BFBFBF;
    background: #F2F2F2;
    width: 33%;
}
.create-memory-select-sex{
    padding: 12px 16px;
    justify-content: space-between;
    align-items: center;
    line-height: 1;
    display: flex;
    border-radius: 8px;
    border: 1px solid #BFBFBF;
    background: #F2F2F2;
    width: 100%;
}
.mbottom-24{
    margin-bottom: 24px;
}
.delete-relative, .delete-edu, .delete-activity, .delete-award, .delete-link, .delete-quote,.delete-rel-quote, .delete-award{
    background: #d71111;
    color: white;
    font-size: 14px;
    padding: 12px 16px;
    font-weight: 600;
    border: none;
    border-radius: 5px;
}
.delete-relative:hover, .delete-edu:hover, .delete-activity:hover, .delete-award:hover, .delete-link:hover,.delete-rel-quote:hover, .delete-quote:hover, .delete-award:hover{
    background: red;
    cursor: pointer;
}
#relative-fields, #edu-fields, #activity-fields, #award-fields, #link-fields, #quote-fields, #awards-fields{
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.edu-field, .activity-field, .award-field, .link-field{
    display: flex;
    justify-content: space-between;
    gap: 24px;
}
