@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@200;300;600&family=Roboto:ital,wght@0,300;1,300;1,400&display=swap');
 body {
     background: #F6F6F6, 100%;
     font-family: 'Roboto', sans-serif;
     font-style: normal;
     font-weight: normal;
}
 a {
     text-decoration: none;
     color: #FFF;
}
 .bd-placeholder-img {
     font-size: 1.125rem;
     text-anchor: middle;
     -webkit-user-select: none;
     -moz-user-select: none;
     user-select: none;
}
 IMG.displayed {
     object-fit: cover;
     width: 70%;
     height: auto;
     display: block;
     margin-left: auto;
     margin-right: auto;
     margin-bottom: 20px;
}
 @media (min-width: 768px) {
     .bd-placeholder-img-lg {
         font-size: 3.5rem;
    }
}
 .cta {
     width: 100%;
     background: #6FCF97;
     color: #FFF;
     padding: 10px;
     border-radius: 15px;
     font-size: 22px;
     margin-bottom: 10px;
     border: 0px;
}
 .logo {
     padding-top: 3rem!important;
     padding-bottom: 3rem!important;
}
 .titulo {
     width: 252px;
     height: 64.47px;
     font-family: IBM Plex Sans;
     font-style: normal;
     font-weight: 600;
     font-size: 34px;
     line-height: 100%;
     margin: 0 auto;
     margin-bottom: 10px;
     color: #414141;
}
 .subtitulo {
     width: 278px;
     height: 44px;
     margin: 0 auto;
     font-family: IBM Plex Sans;
     font-style: normal;
     font-weight: 600;
     font-size: 15px;
     line-height: 138%;
    /* or 21px */
     display: flex;
     align-items: center;
     text-align: center;
     letter-spacing: 0.0075em;
    /* Grey / 04 */
     color: #818181;
}
 .cor-azul {
     background: #1F62C6;
     padding: 20px;
}
 footer {
     color: #FFF;
     background: #1F62C6;
     padding: 10px;
}
 .subfooter {
     font-family: IBM Plex Sans;
     font-style: normal;
     font-weight: 600;
     font-size: 13.0693px;
     line-height: 138%;
    /* or 18px */
     letter-spacing: 0.0075em;
    /* Gray 6 */
     color: #F2F2F2;
     text-align: center;
}
 .footer {
     font-family: IBM Plex Sans;
     font-style: normal;
     font-weight: 600;
     font-size: 22.6364px;
     line-height: 138%;
}
/* select starting stylings ------------------------------*/
 .select {
     font-family: 'Roboto','Helvetica','Arial',sans-serif;
     position: relative;
     width: 100%;
     margin: 0 auto;
     margin-bottom: 20px;
     padding: 10px;
     border: 1px solid #b9b9b9;
     border-radius: 10px;
}
 .select-text {
     position: relative;
     font-family: inherit;
     color: #818181;
     background-color: transparent;
     width: 100%;
     padding: 10px 10px 6px 10px;
     font-size: 18px;
     border-radius: 0;
     border: none;
}
/* Remove focus */
 .select-text:focus {
     outline: none;
}
/* Use custom arrow */
 .select .select-text {
     appearance: none;
     -webkit-appearance:none 
}
 .select:after {
     position: absolute;
     top: 30px;
     right: 20px;
    /* Styling the down arrow */
     width: 0;
     height: 0;
     padding: 0;
     content: '';
     border-left: 6px solid transparent;
     border-right: 6px solid transparent;
     border-top: 6px solid rgba(0, 0, 0, 0.12);
     pointer-events: none;
}
/* LABEL ======================================= */
 .select-label {
     color: rgba(0,0,0, 0.26);
     font-size: 18px;
     font-weight: normal;
     position: absolute;
     pointer-events: none;
     left: 13px;
     top: 20px;
     transition: 0.2s ease all;
}
/* active state */
 .select-text:focus ~ .select-label, .select-text:valid ~ .select-label {
     color: #2F80ED;
     top: -15px;
     background: #FFF;
     padding: 5px;
     transition: 0.2s ease all;
     font-size: 14px;
}
/* BOTTOM BARS ================================= */
 .select-bar {
     position: relative;
     display: block;
     width: 100%;
}
 .select-bar:before, .select-bar:after {
     content: '';
     height: 2px;
     width: 0;
     bottom: 1px;
     position: absolute;
     background: #2F80ED;
     transition: 0.2s ease all;
}
 .select-bar:before {
     left: 50%;
}
 .select-bar:after {
     right: 50%;
}
/* active state */
 .select-text:focus ~ .select-bar:before, .select-text:focus ~ .select-bar:after {
     width: 50%;
}
/* HIGHLIGHTER ================================== */
 .select-highlight {
     position: absolute;
     height: 60%;
     width: 100px;
     top: 25%;
     left: 0;
     pointer-events: none;
     opacity: 0.5;
}
 .form-control {
     font-family: 'Roboto','Helvetica','Arial',sans-serif;
     position: relative;
     width: 100%;
     margin: 0 auto;
     margin-bottom: 20px;
     padding: 20px;
     border: 1px solid #b9b9b9;
     border-radius: 10px;
     transition: .25s border ease-in-out;
     outline: none !important;
     box-shadow: none !important;
     color: #818181;
}
/* Change the white to any color */
 input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
     -webkit-box-shadow: 0 0 0 50px white inset !important;
}
/*Change text in autofill textbox*/
 input:-webkit-autofill {
}
 .margin-center {
     margin: 0 auto;
}
 .errorMessages {
     margin-top: 50px;
     padding: 25px;
     color: #A94442;
     background: #202020;
     border: 0 !important;
     text-shadow: none !important;
     box-shadow: 0 0 10px #151515;
     text-align: center;
}
 .form-control:not(.touched)+.floater:before {
     display: block;
     position: absolute;
     top: 18px;
     left: 15px;
     color: rgba(0,0,0, 0.26);
     font-size: 18px;
     pointer-events: none;
     transition: .25s all ease-in-out;
}
 .form-control.touched+.floater:before, #tamanho:focus+.floater:before, #tamanho:not(:placeholder-shown)+.floater:before, #password:focus+.floater:before, #password:not(:placeholder-shown)+.floater:before {
     position: absolute;
     top: -14px;
     font-size: 14px;
     background: #FFF;
     padding: 4px;
     color: #2F80ED;
}
 #tamanho+.floater:before, #tamanho:focus+.floater:before {
     content: "Numeração do calçado";
}
 .link, .link:hover {
     color: #CC2C21;
     text-decoration: none;
}
 .shadowui {
     box-shadow: 0px 8px 16px 2px rgba(97, 97, 97, 0.1), 0px 16px 32px 2px rgba(97, 97, 97, 0.1);
     border-radius: 15px;
}
 .img {
     height: 45px;
     width: auto;
     margin-bottom: 0px;
     filter: grayscale(100%) brightness(100);
}