/* Reset */
h1, h2, p {
   margin: 0;
}

/* General */
.hide {
   display: none;
}

/* Button */
.button {
   background: #D5006E !important;
   border-color: #D5006E !important;
}

.button a {
   text-decoration: none !important;
   color: #fff !important;
   font-weight: 500 !important;
}

.button:active,
.button:focus {
   background: #D5006E !important;
   border-color: #D5006E !important;
}

.button:focus,
.button:focus-visible {
   background-color: #D5006E !important;
   outline: 4px solid #D5006E !important;
   outline-offset: -4px !important;
}

.button:hover {
   background: #d43386 !important;
}


/* Header */
.header {
   background-color: #D5006E;
   padding-top: 25px;
   padding-bottom: 20px;
   display: flex;
   justify-content: center;
}

.header .content {
   text-align: center;
}

.header .title {
   color: #fff;
   font-size: 32px;
   font-family: 'Playfair Display', serif;
}

.header .subtitle {
   color: #fff;
   font-size: 16px;
   font-family: 'Montserrat', sans-serif;
   letter-spacing: 5px;
}

/* Escolha do modelo */
.model-choice {
   padding: 25px;
}

.model-choice .title {
   color: #4E4E4E;
   font-weight: 600;
   text-align: center;
   margin-bottom: 10px;
}

.model-choice .title .highlight {
   color: #D5006E;
}

.model-choice .images-preview {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
}

.model-choice .reliquary-image {
   border-radius: 8px;
   margin-right: 10px;
   margin-top: 10px;
   cursor: pointer;
   border: 2px solid transparent;
}

.model-choice .reliquary-image:hover {
   border-color: #D5006E;
}

/* Modelo escolhido */
.chosen-model {
   display: flex;
   justify-content: center;
   text-align: center;
}

.chosen-model .title {
   font-weight: 600;
   color: #D5006E;
   margin-bottom: 25px;
   display: none;
}

.chosen-model .chosen-reliquary-image {
   border-radius: 8px;
   margin-right: 10px;
   margin-bottom: 25px;
   display: none;
}

/* Formulário */
.form {
   margin-left: 50px;
   margin-right: 50px;
}

.form label {
   color: #fff;
}

.form .container {
   background-color: #D5006E;
   padding-top: 20px;
   padding-bottom: 20px;
   border-radius: 12px;
}

.form .container .title {
   color: #fff;
   font-size: 24px;
   font-weight: 600;
   margin-bottom: 16px;
   text-align: center;
}

/* Contato */
.contact {
   margin-top: 25px;
   margin-bottom: 25px;
}

.contact p {
   text-align: center;
   font-weight: 600;
}

/* Submit */
.submit {
   display: flex;
   justify-content: center;
   margin-bottom: 25px;
}

/* Selecione foto */
.picture {
   margin-top: 50px;
   display: flex;
   justify-content: center;
   padding-left: 50px;
   padding-right: 50px;
}

.picture .selection {
   text-align: center;
}

.picture .selection .title {
   color: #D5006E;
   font-weight: 600;
   margin-bottom: 15px;
}

.picture .warning {
   padding: 16px;
   background-color: #D5006E;
   border-radius: 8px;
   margin-top: 25px;
   margin-bottom: 25px;
}

.picture .warning p {
   color: #fff;
   font-size: 14px;
   font-weight: 600;
}

.image {
   width: 150px;
   height: 150px;
   background-color: #f2f5f7;
   position: absolute;
   right: 267px;
   top: 118px;
   z-index: -1;
   position: absolute;
   bottom: 480px;
   right: 573px;
   z-index: -1;
}

.crop-actions {
   margin-top: 15px;
   display: flex;
   justify-content: center;
}

.upload-icon {
   cursor: pointer;
}

.upload-button label {
   margin-bottom: 0;
}

input[type="file"] {
   display: none;
}

.preview {
   margin-bottom: 25px;
}

.input-label {
   display: flex;
   align-items: center;
   padding-bottom: 5px;
}

.input-label span {
   font-size: 14px;
   margin-right: 5px;
}

.outter-mask {
   position: relative;
}

.mask {
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
   width: 150px;
   height: 150px;
   background-color: #f2f5f7;
   position: absolute;
   z-index: -1;
}


/* Sucesso */
.feeback .message {
   background-color: #D5006E;
   padding: 16px;
   border-radius: 8px;
   margin-top: 25px;
   margin-bottom: 25px;
   margin-left: 100px;
   margin-right: 100px;
   font-size: 14px;
   color: #fff;
   font-weight: 600;
   text-align: center;
}

.feeback .message .title {
   margin-bottom: 10px;
   font-size: 16px;
}

.feeback .request {
   background-color: #D5006E;
   padding: 10px;
   text-align: center;
   width: 200px;
   border-radius: 8px;
   margin: auto;
}

.feeback .request p {
   font-size: 16px;
   color: #fff;
   font-weight: 600;
}