@charset "UTF-8";

/* BLEXSELL ARTESRED CSS Document */

/* FONTS */
@font-face {
    font-family: 'Raleway';
    src: url('../assets/fonts/Raleway-Bold.eot');
    src: url('../assets/fonts/Raleway-Bold.eot?#iefix') format('embedded-opentype'),
        url('../assets/fonts/Raleway-Bold.woff2') format('woff2'),
        url('../assets/fonts/Raleway-Bold.woff') format('woff'),
        url('../assets/fonts/Raleway-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Raleway';
    src: url('../assets/fonts/Raleway-Medium.eot');
    src: url('../assets/fonts/Raleway-Medium.eot?#iefix') format('embedded-opentype'),
        url('../assets/fonts/Raleway-Medium.woff2') format('woff2'),
        url('../assets/fonts/Raleway-Medium.woff') format('woff'),
        url('../assets/fonts/Raleway-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Raleway';
    src: url('../assets/fonts/Raleway-Regular.eot');
    src: url('../assets/fonts/Raleway-Regular.eot?#iefix') format('embedded-opentype'),
        url('../assets/fonts/Raleway-Regular.woff2') format('woff2'),
        url('../assets/fonts/Raleway-Regular.woff') format('woff'),
        url('../assets/fonts/Raleway-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Raleway';
    src: url('../assets/fonts/Raleway-Thin.eot');
    src: url('../assets/fonts/Raleway-Thin.eot?#iefix') format('embedded-opentype'),
        url('../assets/fonts/Raleway-Thin.woff2') format('woff2'),
        url('../assets/fonts/Raleway-Thin.woff') format('woff'),
        url('../assets/fonts/Raleway-Thin.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


/* GENERAL */
h1 {
    font-weight: 700;
    font-size: 2.1rem;
    text-transform: uppercase;
}

h2 {
    font-weight: 700;
    font-size: 1.7rem;
}

h3 {
    font-weight: 500;
    font-size: 1.5rem;
}

h4 {
    font-weight: 500;
    font-size: 1.3rem;
}

h5 {
    font-weight: 500;
    font-size: 1.15rem;
}

h6 {
    font-weight: 500;
    font-size: .85rem;
}

b, strong {
    font-weight: 700;
}

big {
    font-size: 1.2rem;
}
.regular{
    font-size: 1rem;
}

small {
    font-size: .75rem;
    font-weight: 300;
}

.text-muted {
    color: #8b8b8b !important;
}
.bold{
    font-weight: 700;
}

.btn {
    font-weight: 500;
    font-size: .9rem;
    line-height: 1rem;
    text-transform: uppercase;
    min-width: 10rem;
    border-radius: 1.25rem;
    padding: .75rem .5rem;
    cursor: pointer;
}
.btn:focus
{
    outline: none; 
    border: none; 
    box-shadow: none !important; 
}

.btn-img {
    padding-left: .5rem;
}

.btn-img figure {
    margin: 0;
}
.btn-outline-secondary , .btn-secondary, .btn-outline-white  ,.btn-primary, .btn-login{
    font-size: 11px;
}
.btn-outline-white:hover{
    color:var(--bs-primary) !important;
}
.btn-login{
    background-color: black;
    color:#fff;
}
.btn-login:hover{
    background-color: black;
    color:var(--bs-primary);
}
.auth-wrapper .auth-box{
    background-color: var(--bs-primary);
    box-shadow: none;
}
.btn svg,
.btn img {
    display: inline-block;
    vertical-align: middle;
    margin-right: .5rem;
    margin-top: -.25rem;
    width: auto;
    height: 1.4rem;
    transition: all ease .5s;
}
.btn-outline-secondary:hover{
    color:#ffffff;
}

.btn span {
    line-height: 1rem;
}
input[type="checkbox"]:checked+label svg polyline,
input[type="radio"]:checked+label svg polyline {
	stroke: var(--bs-white) !important;
}

.form-check-input:checked {
	/*background-color: var(--bs-light-primary);*/
	/*background-image: none !important;*/
	color: var(--bs-primary);
}

.form-switch .form-check-input:focus:not(:checked) {
	/* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23e3151b'/%3e%3c/svg%3e"); */
}

.form-check-input:focus {
	border-color: var(--bs-light-primary);
	box-shadow: 0 0 0 0;
}

.form-check-input{
	margin-top: 0.25rem !important;
	border-color: var(--bs-dark) !important;
}

.pantalla-full {
    background-color: var(--bs-primary);
    min-height: 100vh !important;
}

/* HEADER */
.navbar-brand svg {
    width: 150px !important;  
    height: auto !important;  
}
header.topbar {
    background-color:var(--bs-primary);
    color: #fff;
    border-bottom-left-radius: 1.25rem;
    border-bottom-right-radius: 1.25rem;
    height: 90px;
}

.topbar .top-navbar{
    min-height: 90px;
}

.topbar .navbar-collapse{
    padding: 0px;
}
figure.adjust-h, figure.adjust-h>a {
    height: 105%;
}


header.scrolling {
    padding: 0 !important;
}

header .logo {
    width: 75px;
    color: var(--bs-white);
    z-index: 83
}
header figure > svg {
    color: var(--bs-white);
    fill: var(--bs-white);
}

.topbar .top-navbar .navbar-header .navbar-brand{
    padding: 0rem ;
    padding-left: 0.5rem ;
}
.topbar .top-navbar .navbar-nav>.nav-item>.nav-link{
    padding: 0rem;
}
.topbar .nav-item.user-panel .bg-secondary{
    background-color: var(--bs-primary) !important;
}
.bg-secondary{
    background-color: var(--bs-primary) !important;
}
.text-secondary{
    color:#001057 !important;
}
.avatar-mobile-icon svg path {
    stroke: #fff;
    fill: #fff; 
}

.wrapper_langs {
    position: absolute;
    top: 1rem;
    right: 2rem;
    width: 24px;
    z-index: 2;
}

.wrapper_langs .dropdown img,
.wrapper_langs .dropdown svg {
    width: 24px;
    height: 24px;
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
}

.wrapper_langs .dropdown-toggle svg {
    margin-top: 10px
}

.wrapper_langs .dropdown-toggle::after {
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    border-top: 6px solid var(--bs-white);
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    margin-left: 0.5rem;
    vertical-align: 0.1em;
    width: 11px;
    height: 8px;
}

.wrapper_langs .dropdown-menu {
    min-width: 30px;
    background-color: #000;
    color: var(--bs-white);
    left: -.7rem !important;
}

.wrapper_langs .dropdown-item {
    padding: .5rem .7rem .4rem;
}

.wrapper_langs .dropdown-item:focus,
.wrapper_langs .dropdown-item:hover {
    background-color: #333;
}


/* FOOTER */
:root {
    --header-height: 64px;
    --footer-height: 127px;
}

main {
    min-height: calc(100vh - (var(--footer-height) + var(--header-height)));
}

/* FOOTER */
:root {
    --header-height: 64px;
    --footer-height: 127px;
}

main {
    min-height: calc(100vh - (var(--footer-height) + var(--header-height)));
}

footer {
    height: auto;
    font-size: .9rem;
    text-align: center;
    background-color:var(--bs-primary);;
    padding: 0 !important;

}

footer .logo {
    max-width: 200px;
    margin: 0;
}

footer ul,
footer ol {
    margin: 0;
    padding: 0;
}

footer li {
    list-style: none;
    text-transform: uppercase;
}

footer li:not(:last-child) {
    margin-bottom: .5rem;
}

footer p {
    margin: 0;
}

.powered {
    text-align: center;
    padding: 2rem 0 !important;
}

.powered small {
    vertical-align: top;
}

.rounded{
    border-radius: 1rem !important;
}

.bg-light{
    background-color: #f5f5f7 !important;
}

/* CONTENT */
.social a img,
.social a svg {
    width: 20px;
    height: 20px;
}


/* LOGIN */
.login-page {
    height: 100%;
}

.login-page form {
    max-width: 250px;
    margin: 0 auto;
}

.login-page input,
.login-page button {
    width: 100%;
}

.logo-large {
    margin: 2rem auto;
}

.logo-large svg {
    width: 80%;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.registro {
    text-align: center;
}

.registro h2,
.registro p {
    margin-left: auto;
    margin-right: auto;
}

.registro h2 {
    font-size: 1.8rem;
    max-width: 30ch;
    text-align: center;
}

.registro p {
    max-width: 60ch;
}

.registro form {
    text-align: left;
}

#loginform .form-floating,
#recoverform .form-floating {
    margin-bottom: .8rem;
}

#loginform .form-control,
#recoverform .form-control {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #fff; 
    color: #fff; 
    font-size: 16px;
    box-shadow: none; 
    border-radius: 0 !important;
}

#loginform .form-control::placeholder,
#recoverform .form-control::placeholder {
    color: rgba(255, 255, 255, 0.6) ; 
}

#loginform .input.password:before {
    background-image: url(../img/icons/ver.svg);
}

#loginform .input.password:after {
    background-image: url(../img/icons/no-ver.svg);
}

#loginform .form-control.is-invalid,
#loginform .form-control:invalid,
#recoverform .form-control.is-invalid,
#recoverform .form-control:invalid {
    color: #fff;
    box-shadow: none;
}

#loginform .form-check-input:checked
#loginform .form-check-input:checked {
    background-color: #000; 
    border-color: #000; 
}

#loginform .form-check.mb-3, 
#loginform .form-check.form-switch {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

#loginform a {
    color: #fff; 
    text-decoration: underline; 
}

#loginform .invalid-feedback {
    color: #fff;
}

#loginform .form-floating .form-control~.invalid-feedback:nth-of-type(2) {
    padding-right: 2ch;
}

#loginform .form-control.is-valid,.was-validated .form-control:valid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

#loginform .form-select.is-valid:not([multiple]):not([size]),
#loginform .form-select.is-valid:not([multiple])[size="1"],
#loginform .was-validated .form-select:valid:not([multiple]):not([size]),
#loginform .was-validated .form-select:valid:not([multiple])[size="1"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

#loginform .form-control.is-invalid,
#loginform .was-validated .form-control:invalid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffffff'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffffff' stroke='none'/%3e%3c/svg%3e");
}

#loginform .form-select.is-invalid:not([multiple]):not([size]),.form-select.is-invalid:not([multiple])[size="1"],.was-validated .form-select:invalid:not([multiple]):not([size]),.was-validated .form-select:invalid:not([multiple])[size="1"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffffff'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffffff' stroke='none'/%3e%3c/svg%3e");
}

#loginform .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #fff transparent transparent transparent;
}

#loginform .select2-container--classic .select2-selection--single,
#loginform .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single,
#loginform .select2-container--default .select2-selection--single .select2-selection__arrow,
#loginform .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff;
}

input[required]+*:after,
select[required]+label:after,
select[required]+*+label:after,
textarea[required]+*:after {
    color: #fff;
}

.alert {
    margin-bottom: 0;
}

input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,
textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,
select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{
	-webkit-text-fill-color:#fff;transition:background-color 5000s ease-in-out 0s
}


/* REGISTRO */
#registro-agente .container {
    background-color: var(--bs-primary);
    background-image: url('../img/mapamundi_registro.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: 100vh;
}
.form-check-input {
    width: 16px; 
    height: 16px; 
    border-radius: 0; 
    margin-left: 0; 
    margin-right: 8px; 
}
.fomr-check{
    padding-left:0rem !important;
}

input[type="checkbox"].regular,
input[type="checkbox"].form-check-input {
    -webkit-appearance: none; 
    -moz-appearance: none;    
    appearance: none;         
    width: 18px;              
    height: 18px;             
    border: 1px solid #fff !important; 
    background: none !important;      
    cursor: pointer;
    outline: none;           
    display: inline-block;
    vertical-align: middle;
    border-radius: 0 !important; 
    box-sizing: border-box;   
    margin: 0 !important;    
    padding: 0;               
    position: relative;
}


input[type="checkbox"].regular:checked,
input[type="checkbox"].form-check-input:checked {
    background-color: #000 !important; 
    border: 1px solid var(--bs-white) !important; 
    background-image: none !important; 
}


input[type="checkbox"].regular:checked::after,
input[type="checkbox"].form-check-input:checked::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--bs-primary);
    background-image: url('../img/icons/checked.svg');
    background-size: contain;
    background-repeat: no-repeat;
}


input[type="checkbox"].regular:hover,
input[type="checkbox"].form-check-input:hover {
    border-color: #ccc !important; 
}


label[for="remember-me"],
label[for="condiciones"] {
    margin-left: 8px;        
    color: #fff;             
    font-weight: normal;      
    vertical-align: middle;
}
.form-control.is-valid, .was-validated .form-control:valid {
    border-color: #ffffff;
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3e%3cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}
.mail-detail-content.noI18n {
    padding: 0 !important;
}




/* MEDIA QUERIES **/
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    h1 { font-size: 4rem }
    h2 { font-size: 2rem }
    h3 { font-size: 2rem }
    h4 { font-size: 1.375rem }
    .btn { width: auto; padding-top: .5rem; padding-bottom: .5rem }
    .wrapper_langs { right: 0 }
    .logo-large { margin-bottom: 6rem }
}
/* Medium devices (tablets, 768px and up) */
@media (max-width: 576px) {
    #registro-agente .container {
        height: fit-content;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    
}

/* Extra extra large devices (large desktops, 1400px and up) */
@media (min-width: 1400px) {
    
}

