@font-face {
font-family: "GeorgeTown";
font-style: normal;
src: url(https://arkin.mx/wp-content/themes/arkin/assets/css/assets/fonts/GeorgeTown-SemiBold.ttf);
}
@font-face {
font-family: "GeorgeLiht";
font-style: normal;
src: url(https://arkin.mx/wp-content/themes/arkin/assets/css/assets/fonts/GeorgeTown-Light.ttf);
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 600;
src: url(https://arkin.mx/wp-content/themes/arkin/assets/css/assets/fonts/Inter-600.ttf);
}
@font-face {
font-family: Inter2;
font-style: normal;
font-weight: 500;
src: url(https://arkin.mx/wp-content/themes/arkin/assets/css/assets/fonts/Inter-500.ttf);
}
* {
font-family: Inter;
font-weight: normal;
}
.arkin label,
.arkin p,
.arkin a,
.arkin button,
.arkin input {
font-family: Inter;
font-size: 12px;
font-weight: normal;
}
.arkin h2 {
font-family: "GeorgeLiht";
}
.header-desk,
#custom_loginform {
display: none;
}
.login .form_cont {
max-width: 45%;
}
.bg-gray {
background-color: #eeeeee;
}
.content-form {
border-top: 1.2px solid;
padding: 1rem;
}
@media (max-width: 1100px){
.content-form{
padding: 6rem 1rem;
}
}
.login #login h1 a {
background-image: url(//arkin.mx/wp-content/themes/arkin/public/img/logo_arkin_new.png);
background-size: contain;
height: 5rem;
width: 14rem;
} .privacy-policy-page-link,
.language-switcher {
display: none;
}
#login {
padding: 0;
}
.login a,
.login input:focus,
.login textarea:focus,
.login select:focus {
box-shadow: none;
outline: none;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 30px white inset !important;
}
button.btn.btn-login {
background-color: #141923;
border: 1.8px solid #0a56f966;
color: white;
text-align: center;
width: 100%;
}
.errors-div {
border: 2px solid red;
margin: auto;
padding: 1rem 0;
width: 20rem;
} div#login {
width: 40%;
}
@media (max-width: 1000px) {
div#login {
width: 90%;
}
}
div#login form {
border: none;
}
#login label {
color: #141923;
font-size: 12px;
}
#login input[type="text"],
#login input[type="password"] {
border: none;
border-bottom: 2px solid #141923 !important;
border-radius: 0;
}
#login div#pass-strength-result {
border-radius: 5px;
margin: 0.5rem 0;
}
#login span.dashicons.dashicons-hidden::before {
color: #0a56f966;
}
#login button.button.wp-generate-pw.hide-if-no-js.skip-aria-expanded {
background-color: #0a56f966;
border: 1.8px solid #141923;
color: black;
}
#login input#wp-submit {
background-color: #141923;
border: 1.8px solid #141923;
}
#login .notice.notice-info.message.reset-pass {
border-left: 4px solid #141923;
}
#eye {
cursor: pointer;
position: absolute;
right: 1rem;
top: 30%;
}
@media (max-width: 900px) {
.links-login-mobile {
align-items: center;
flex-direction: column;
}
}
body.login.js.login-action-checkemail.wp-core-ui.locale-es-mx #login h1 {
background: #eeeeee;
border-bottom: 2px solid #141923;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
body.login.js.login-action-checkemail.wp-core-ui.locale-es-mx
div#login-message {
margin: 8rem 0;
}
body.login.js.login-action-checkemail.wp-core-ui.locale-es-mx .message,
body.login.js.login-action-checkemail.wp-core-ui.locale-es-mx .notice,
body.login.js.login-action-checkemail.wp-core-ui.locale-es-mx .success {
border-left: 4px solid #141923;
}
p.instructions-register {
font-size: 11px;
margin-top: -1.5rem;
}
@media (min-width: 1100px) {
p.instructions-register {
padding-left: 1.4rem;
}
}
.user-registration.ur-frontend-form{
border: none;
}
.ur-message{
align-items: center;
display: flex !important;
}.form_cont {
margin: auto;
max-width: 100%;
padding: 0px 40px 10px 40px;
width: 40%;
}
@media (max-width: 600px){
.form_cont{
width: 100%;
}
}
@media (max-width: 900px){
.form_cont{
width: 80%;
}
}
.form_cont.container {
position: inherit;
}
@media only screen and (max-width: 700px) {
.form_cont {
max-width: 100%;
}
}
.form_cont .login form {
border: none;
}
.form_cont .text {
background: -webkit-linear-gradient(
right,
#141923,
#e34f18,
#141923,
#e34f18
);
-webkit-background-clip: text;
font-size: 20px;
font-weight: 600;
text-align: center;
-webkit-text-fill-color: transparent;
}
.form_cont form {
border: none;
padding: 0;
}
.form_cont form .form-row {
display: flex;
flex-wrap: nowrap;
justify-content: end;
margin: 32px 0;
}
form .form-row .input-data {
height: 40px;
margin: 0 20px;
position: relative;
width: 100%;
}
form .form-row .textarea {
height: 70px;
}
.form-row {
margin: 1.5rem 0;
}
.input-data input,
.textarea textarea {
border: none;
border-bottom: 1.2px solid rgba(0, 0, 0, 0.12);
display: block;
font-size: 13px;
height: 100%;
width: 100%;
}
.input-data input[type="file"] {
border: none;
height: 120%;
}
.input-data .text-inp-file.filled,
input:-webkit-autofill .text-inp-file.filled {
border-color: #141923;
color: #141923;
}
.textarea textarea {
min-height: 70px;
}
.input-data input:focus ~ label,
.textarea textarea:focus ~ label,
.input-data input.filled ~ label,
.textarea textarea.filled ~ label,
input:-webkit-autofill ~ label {
color: #141923;
font-size: 12px;
transform: translateY(-2rem);
}
.input-data select ~ .underline {
background: #d9d9d9;
bottom: -4px;
}
.input-data select.filled ~ .underline,
input:-webkit-autofill ~ .underline {
background-color: #141923;
}
.input-data input[type="file"]::file-selector-button {
background: #141923;
border: none;
border-radius: 10px;
color: #fff;
cursor: pointer;
margin-right: 20px;
padding: 10px 20px;
transition: background 0.2s ease-in-out;
}
.input-data input[type="file"]::file-selector-button:hover {
background: #e34f18;
}
.input-data p {
border-bottom: 2px solid rgba(0, 0, 0, 0.12);
color: gray;
font-size: 12px;
}
.textarea textarea {
padding-top: 10px;
resize: none;
}
.input-data label {
bottom: 0px;
color: gray;
font-size: 14px;
font-weight: inherit;
pointer-events: none;
position: absolute;
text-transform: none;
transition: all 0.3s ease;
}
.textarea label {
background: #fff;
bottom: 40px;
width: 100%;
}
.input-data .underline {
bottom: 0;
height: 1.2px;
position: absolute;
width: 100%;
}
.input-data .underline:before {
background: #141923;
content: "";
height: 1.2px;
position: absolute;
transform: scaleX(0);
transform-origin: center;
transition: transform 0.3s ease;
width: 100%;
}
.input-data select ~ .underline {
background: #d9d9d9;
bottom: -4px;
}
.input-data input.error ~ .underline:before {
background: red;
transform: scale(1);
}
.input-data input.error ~ label {
color: red;
}
.input-data input.filled ~ .underline:before,
.input-data input:focus ~ .underline:before,
.input-data select:focus ~ .underline:before,
.textarea textarea:focus ~ .underline:before,
.textarea textarea.filled ~ .underline:before,
input:-webkit-autofill ~ .underline:before {
transform: scale(1);
}
body .input-data input:focus,
body .input-data textarea:focus {
border: none !important;
outline: none !important;
}
.submit-btn .input-data {
height: 45px !important;
overflow: hidden;
}
.submit-btn .input-data .inner {
background: -webkit-linear-gradient(
right,
#141923,
#7e2c0d,
#141923,
#7e2c0d
);
height: 100%;
left: -100%;
position: absolute;
transition: all 0.4s;
width: 300%;
}
.submit-btn .input-data:hover .inner {
left: 0;
}
.submit-btn .input-data input {
background: none;
border: none;
color: #fff;
cursor: pointer;
font-size: 13px;
font-weight: 500;
letter-spacing: 1px;
position: relative;
text-transform: uppercase;
z-index: 2;
}
@media (max-width: 700px) {
.form_cont .text {
font-size: 15px;
}
.form_cont form {
padding: 10px 0 0 0;
}
.form_cont form .form-row {
display: block;
}
form .form-row .input-data {
margin: 35px 0 !important;
}
.submit-btn .input-data {
width: 40% !important;
}
}
.input-data select {
border: none;
color: gray;
cursor: pointer;
font-size: 13px;
height: 3.8rem;
padding: 0;
vertical-align: middle;
width: 100%;
}
.input-data input.filled,
.input-data select:focus,
.input-data select.filled,
input:-webkit-autofill {
border: none;
color: black;
outline: none;
}
.input-data input[type="date"]::-webkit-datetime-edit {
color: transparent;
}
.input-data input[type="date"]:focus::-webkit-datetime-edit {
color: gray;
}
.input-data input[type="date"].filled::-webkit-datetime-edit,
input:-webkit-autofill::-webkit-datetime-edit {
color: black;
}
.text-inp-file.empty_input,
.input-data .empty_input,
.input-data .empty_input ~ label,
.input-data .empty_input::-webkit-datetime-edit {
border-color: red;
color: red;
}
.input-data select.empty_input ~ .underline {
background-color: red;
}
.inp_tool {
display: flex;
position: relative;
} ul.progressbar {
counter-reset: step;
list-style: none;
padding: 0;
position: relative;
}
ul.progressbar li {
position: relative;
}
ul.progressbar li:before {
background-color: #d9d9d9;
border-radius: 50%;
color: #d9d9d9;
content: counter(step);
counter-increment: step;
display: block;
height: 23px;
margin: 0 auto;
position: inherit;
text-align: center;
-webkit-transition: background-color 0.5s ease-out;
-ms-transition: background-color 0.5s ease-out;
transition: background-color 0.5s ease-out;
width: 23px;
z-index: 2;
}
ul.progressbar li:not(:first-child):after {
background: #d9d9d9;
content: "";
height: 2px;
left: -51%;
position: absolute;
top: 15%;
-webkit-transition: background-color 500ms ease-out;
-ms-transition: background-color 500ms ease-out;
transition: background-color 500ms ease-out;
width: 100%;
z-index: 1;
}
ul.progressbar li.active:before,
ul.progressbar li.previous_active:before {
background-color: #0a56f9;
color: #0a56f9;
-webkit-transition: background-color 500ms ease-in;
-ms-transition: background-color 500ms ease-in;
transition: background-color 500ms ease-in;
}
ul.progressbar li.active:not(:first-child):after,
ul.progressbar li.previous_active:not(:first-child):after {
background-color: #0a56f9;
-webkit-transition: background-color 500ms ease-in;
-ms-transition: background-color 500ms ease-in;
transition: background-color 500ms ease-in;
}
ul.progressbar span {
display: block;
height: 7rem;
margin: -5rem auto 0;
text-align: center;
width: 8rem;
}
.error-msg {
color: red;
font-size: 12px;
} .hide,
.ur-form-row,
.form-row.validate-required.hide_show_password{
opacity: 0;
height: 0;
}
.ur-button-container {
position: relative;
}
button.btn.button.ur-submit-button.hide span {
position: absolute;
right: 0;
}
button.btn.button.ur-submit-button.hide {
margin: 0;
width: 0;
position: absolute;
right: 0;
z-index: -1;
color: transparent;
}
.user-registration.ur-frontend-form {
width: 40%;
margin: auto;
margin-top: -5%;
}
@media (max-width: 700px){
.user-registration.ur-frontend-form {
width: 90%;
margin: auto;
margin-top: -20%;
}
}