/* source-sans-pro-200 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 200;
    src: url('../webfonts/source-sans-pro-v21-latin-200.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-200.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-200.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-200italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 200;
    src: url('../webfonts/source-sans-pro-v21-latin-200italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-200italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-200italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-200italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-200italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-200italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-300 - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: url('../webfonts/source-sans-pro-v21-latin-300.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-300.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-300italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 300;
    src: url('../webfonts/source-sans-pro-v21-latin-300italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-300italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-300italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-regular - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: url('../webfonts/source-sans-pro-v21-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 400;
    src: url('../webfonts/source-sans-pro-v21-latin-italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-600 - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: url('../webfonts/source-sans-pro-v21-latin-600.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-600.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-600.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-600italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 600;
    src: url('../webfonts/source-sans-pro-v21-latin-600italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-600italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-600italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-700 - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 700;
    src: url('../webfonts/source-sans-pro-v21-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-700.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-700.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-700italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 700;
    src: url('../webfonts/source-sans-pro-v21-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-700italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-700italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-900 - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 900;
    src: url('../webfonts/source-sans-pro-v21-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-900.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-900.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-900italic - latin */
  @font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 900;
    src: url('../webfonts/source-sans-pro-v21-latin-900italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../webfonts/source-sans-pro-v21-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../webfonts/source-sans-pro-v21-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-900italic.woff') format('woff'), /* Modern Browsers */
         url('../webfonts/source-sans-pro-v21-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../webfonts/source-sans-pro-v21-latin-900italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }

*{
    font-family: 'Source Sans Pro', sans-serif;
 }
:root {
    --main-red: #E3302B;
    --main-red-2: #FCEAE9;
    --main-orange: #E28200;
    --main-blue: #013C88;
    --main-blue-2: #E5EBF3;
    --main-green: #679F00;

    --border-radius: 4px;
}

form{ margin: 0!important;}

#user-bar {
    position: fixed;
    width: 25vw;
    height: 100vh;
    background-color: var(--main-blue-2);
    display: flex;
    flex-direction: column;
    justify-content: left;
    padding: 2.5rem calc(25vw/6);
}

#user-bar p.salutacion {
    font-size: 28px;
    font-weight: 500;
    color: var(--main-blue);
    margin-bottom: 0.25rem;
}

#user-bar p.user {
    font-size: 28px;
    font-weight: 700;
    color: var(--main-blue);
    margin-bottom: 0rem;
}

#user-bar p.bienvenido {
    font-size: 20px;
    font-weight: 500;
    color: var(--main-blue);
    margin-bottom: 0.25rem;
}

#user-bar a.edit-perfil {
    color: var(--main-blue);
    font-size: 18px;
    font-weight: 300;
    text-decoration: none;
    display: flex;
    flex-direction: row;
}

#user-bar a.edit-perfil i {
    font-size: 14px;
    line-height: 30px
}

#user-bar a.edit-perfil i:nth-child(odd) {
    color: var(--main-blue);
    margin-right: 0.5rem
}

#user-bar a.edit-perfil i:nth-child(even) {
    color: var(--main-red);
    margin-left: 0.5rem
}

@media(max-width:992px) {

    #user-bar p.salutacion,
    #user-bar p.user,
    #user-bar p.bienvenido {
        color: #ffffff;
        font-size: 20px;
    }

    #user-bar a.edit-perfil {
        font-size: 16px;
        font-weight: 400;
        color: #ffffff;
    }

    #user-bar a.edit-perfil i {
        color: #ffffff !important;
    }
}


button#close-perfil {
    display: none;
}

@media(max-width:992px) {
    #user-bar {
        width: 95vw;
        height: 100vh;
        z-index: 1000;
        transition: 0.3s ease-in-out;
        background-color: var(--main-red);
        left: 100vw;
        padding: 5rem 3rem;
    }

    #user-bar.opened {
        z-index: 1001;
        left: 5vw;
    }

    #user-bar img {
        display: none;
    }

    button#close-perfil {
        display: flex;
        position: absolute;
        font-size: 16px;
        border: 0px solid transparent;
        color: #ffffff;
        transition: 0.3s ease-in-out;
        top: 2rem;
        right: 2rem;
        background: transparent
    }
}

#user-bar .decoration {
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 30%;
    width: 100%;
}

#user-bar .decoration img {
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    position: absolute;
    width: 100%;
} 

#user-bar img.logo {
    max-width: 60%;
    height: auto;
    width: auto;
    margin-bottom: 2rem
}

#mobil-menu {
    display: none
}

@media(max-width:992px) {
    #mobil-menu {
        display: flex;
        width: 100vw;
        padding: 1.5rem 0;
    }
}

.btn-controler-mobile {
    display: flex;
    flex-direction: row;
    margin: auto 0 auto auto;
    justify-content: end
}

button#open-menu-mobil,
button#open-user {
    border: 0px solid transparent;
    background-color: transparent;
    transition: 0.3s ease-in-out;
    padding: 0.5rem;
    margin: auto 0;
}

.all-father-container {
    display:flex;
    flex-direction: column;
    margin-left: 25vw;
    background-color: #FFF;
    width: 75vw;
    min-height: 100vh;
    /* border:1px solid red; */
}

@media(max-width:992px) {
    .all-father-container {
        margin-left: 0vw;
        width: 100vw;
        /* border:1px solid red; */
    }
}

header {
    padding: 2rem 0;
}

@media(max-width:992px) {
    header {
        padding: 0
    }
}

header nav a.new-document {
    border-radius: var(--border-radius);
    background-color: var(--main-red);
    color: #ffffff;
    padding: 0.5rem 0.75rem;
    font-size: 18px;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    border: 0px solid transparent;
    justify-content: center;
    margin-left: 2rem;
}

header nav a.new-document img {
    margin-right: 0.5rem;
    width: 100%;
    width: auto;
    display: block
}

header nav {
    padding: 1rem;
    justify-content: right;
}

header nav,
header nav ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: auto 0;
}

header nav ul li:hover,
header nav ul li.active {
    border-bottom: 2px solid var(--main-red);
}
header nav ul li {
    border: 0px solid transparent;
    border-bottom: 1px solid transparent;
    transition: 0.3s ease-in-out;
    margin-left: 2rem;
    height: fit-content;
}

header nav ul li a span.number {
    background-color: var(--main-red);
    border-radius: 500px;
    padding: 0.15rem 0.5rem;
    color: #ffffff;
    font-size: 14px;
    line-height: 14px;
    margin: auto 0;
}


header nav ul li a {
    font-size: 18px;
    color: #000000;
    text-decoration: none;
}

button#close-menu-mobil,
button#open-menu-mobil {
    display: none;
}

@media(max-width:992px) {
    header nav {
        padding: 5rem 3rem;
        position: fixed;
        top: 0;
        left: 100vw;
        width: 95vw;
        height: 100vh;
        background-color: var(--main-blue);
        transition: 0.3s ease-in-out;
        display: flex;
        flex-direction: column;
        z-index: 1001;
    }

    button#close-menu-mobil {
        position: absolute;
        display: flex;
        background-color: transparent;
        color: #ffffff;
        border: 0px solid transparent;
        top: 2rem;
        right: 2rem;
        font-size: 16px;
        z-index: 1002
    }

    header nav ul {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 0;
    }

    header nav ul li {
        padding: 0.25rem 0;
        width: fit-content;
        margin-bottom: 0.75rem;
    }

    header nav ul li a {
        font-size: 16px;
        color: #ffffff;
        text-decoration: none;
        display: block;
        width: fit-content;
    }

    header nav.opened {
        left: 5vw;
    }

    button#close-menu-mobil,
    button#open-menu-mobil {
        display: flex;
    }

    header nav a.new-document {
        text-align: center;
        font-size: 16px;
        margin-top: 3rem;
    }
}

#login {
    width: 100vw;
    min-height: 100vh;
    display: flex;
    flex-direction: row
}

#login .img {
    height: 100vh;
    overflow: hidden;
    width: 60%;
    background-image: url(../img/login-img.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover
}

#login .login-form {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    margin: auto 0;
    width: 40%;
}

#login img.logo {
    height: auto;
    display: block;
    margin: 0 auto 1rem 0;
    width: 50%;
}

#login .login-form {
    padding: 0 3rem;
    display: flex;
    flex-direction: column;
}

#login .login-form p.info {
    font-size: 24px;
    font-weight: 400;
    color: #000000;
    margin: 0;
}

#login .login-form hr {
    margin: 1.5rem 0;
    display: block;
    opacity: 1;
    width: 70px;
    height: 0;
    border-top: 3px solid var(--main-blue);
}

#login .login-form p.wrong-info {
    background-color: var(--main-red-2);
    padding: 0.5rem;
    color: var(--main-red);
    font-size: 14px;
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: row
}

#login .login-form .wrong-info span {
    /* width: 25px;
    height: 25px; */
    height: fit-content;
    width: fit-content;
    padding: 8px 8px;
    border-radius: 500px;
    border: 2px solid var(--main-red);
    position: relative;
    display: block;
    margin-right: 0.5rem;
}

#login .login-form .wrong-info i {
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 10px;
}

#login .login-form form {
    display: flex;
    flex-direction: column;
}

#login .login-form form .form-group {
    margin-top:0;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
}

#login .login-form form label {
    font-size: 16px;
    color: #000000;
    font-weight: 500;
}

#login .login-form form input {
    width: 100%;
    border-radius: var(--border-radius);
    border: 1px solid #707070;
}

#login .login-form form input.is-invalid,
#tabody1 form input.is-invalid,
#tabody3 form input.is-invalid {
    border-color: #dc3545;
}

#login .login-form form button[type="submit"] {
    border-radius: var(--border-radius);
    background-color: var(--main-blue);
    color: var(--main-blue-2);
    padding: 0.5rem 0.75rem;
    font-size: 18px;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    border: 0px solid transparent;
}

#login .login-form p.lost-pasword {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight: 400;
    color: #000000;
}

#login .login-form p.lost-pasword a {
    font-size: 16px;
    font-weight: 400;
    color: var(--main-blue);
    text-decoration: underline;
}

@media(max-width:992px) {
    #login {
        display: flex;
        flex-direction: column;
    }

    #login .login-form {
        padding: 0 2rem 4rem 2rem;
        display: flex;
        flex-direction: column;
        margin: 2rem 0 0 0;
        width: 100%
    }

    #login .img {
        height: 28vh;
        width: 100%;
        margin-bottom: 0rem;
    }

}

section#home {
    padding: 2rem 0;
    margin-top: 2rem;
}

.card-home {
    display: flex;
    flex-direction: column;
    padding: 1rem;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    transition: 0.3s ease-in-out;
}

section#home .card-home .img-content {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    position: relative;
    margin-top: 1rem;
}

section#home .card-home .img-content .graphiccontroler{
    width: calc(100% - 8rem);
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%);
    bottom: 5%;

}

section#home .card-home .img-content img:first-of-type {
    margin-top: auto;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: auto;
    width: 2.5rem;
}

section#home .card-home .last-months {
    font-size: 16px;
    color: #707070;
    font-weight: 400;
    text-align: center;
}

@media(min-width:992px) {
    section#home .card-home .last-months {
        display: none;
    }
}

section#home .card-home .number {
    font-size: 80px;
    line-height: 96px;
    font-weight: 900;
    text-align: center;
    color: var(--main-red);
}

section#home .card-home .number.succes-num {
    color: var(--main-green);
}

section#home .card-home .title-card {
    font-size: 24px;
    color: #333333;
    text-align: center;
    margin-bottom: 2rem;
    margin: 0 auto 3rem auto;
    max-width: 70%;
}

section#home .card-home a {
    transition: 0.3s ease-in-out;
    display: flex;
    flex-direction: row;
    justify-content: center;
    background-color: var(--main-blue);
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    border-radius: var(--border-radius);
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    margin: auto 0 1rem 0;
}

section#home .card-home a img {
    margin-right: 0.5rem;
    display: block;
    height: 100%;
    width: auto;
    margin: auto 0.5rem auto 0;
}

section#home .card-home .mobile-divider {
    display: flex;
    flex-direction: column;
}

@media(max-width:992px) {
    section#home .card-home .title-card {
        text-align: left;
    }

    section#home .card-home .mobile-divider {
        display: flex;
        flex-direction: row;
    }

    section#home .card-home p.last-months,
    section#home .card-home .img-content {
        display: none
    }

    section#home .card-home p.number {
        margin-right: 1rem;
        font-size: 70px;
        line-height: 70px;
    }

    section#home .card-home p.title-card {
        font-size: 25px;
        max-width: 100%;
    }
}

#nuevo-doc .title-section {
    font-size: 24px;
    font-weight: 500;
    color: #333333;
    margin: 1rem 0;
    display: inline-flex;
    width: 100%;
}

#nuevo-doc .title-section span {
    background-color: var(--main-blue);
    min-width: 30px;
    border-radius: 500px;
    text-align: center;
    padding: 0.15rem 0.5rem;
    color: #ffffff;
    font-size: 14px;
    line-height: 14px;
    margin: auto 0;
    display: inline-block;
    margin: auto 0;
    margin-right: 0.5rem;
}

@media(max-width:992px) {
    #nuevo-doc .title-section {
        font-size: 20px;
        line-height: 21px;
    }
}

#nuevo-doc .form-check {
    padding: 0;
    margin: 0;
}

#nuevo-doc input:checked+label.card-home {
    background-color: var(--main-red)
}

#nuevo-doc input:checked+label.card-home p {
    color: #ffffff;
}

#nuevo-doc input:checked+label.card-home p.btn-select {
    visibility: hidden;
}

#nuevo-doc .form-check input {
    visibility: hidden;

}

.check-visible{
    visibility:visible;
}

#nuevo-doc label small,
#nuevo-doc .title-section small {
    font-size: 14px;
    color: #999999;
    float: inline-end;
    margin: auto 0 auto auto;
    font-style: italic;
}

label.notshow {
    position: absolute;
    top: 10000000px;
    left: -10000000px;
}

form .form-group {
    display: flex;
    flex-direction: column;
    margin: 0 0 1rem 0;
}

form input:disabled {
    cursor: not-allowed!important;
    background-color: #E5E5E5!important;
    border: 1px solid #707070!important;
    width: 100%!important;
    border-radius: var(--border-radius)!important;
    padding: 0.5rem!important;
}

form textarea {
    min-height: 150px;
    border: 1px solid #707070;
    background-color: #ffffff;
    color: #666666;
    border-radius: var(--border-radius);
    padding: 0.5rem;
    font-size: 16px;
}

form .select2 textarea {
    min-height: 25px;
    font-size: 12px;
}

.select2-selection__choice__display{
    font-size: 12px;
}

@media(max-width:992px) {
    #nuevo-doc .title-section small {
        display: none
    }
}

#nuevo-doc .card-home .title-contrato {
    font-size: 20px;
    color: #333333;
    font-weight: 600;
    margin-bottom: 0.5rem;
    transition: 0.3s ease-in-out;
}

#nuevo-doc .card-home .des-contrato {
    font-size: 16px;
    color: #666666;
    margin-bottom: 1.5rem;
    transition: 0.3s ease-in-out;
}

#nuevo-doc .card-home .btn-select {
    background-color: var(--main-blue);
    color: #ffffff;
    font-size: 16px;
    border-radius: 500px;
    padding: 0.5rem 0.75rem;
    display: block;
    width: fit-content;
    text-align: center;
    visibility: hidden;
    margin-bottom: 0.5rem;
    transition: 0.3s ease-in-out;
}

#nuevo-doc .card-home:hover .btn-select {
    visibility: visible;
}

@media(max-width:992px) {
    #nuevo-doc .card-home .btn-select {
        width: 100%;
        text-align: center;
    }
}

form#nuevo-doc button[type="submit"] img {
    height: 100%;
    width: auto;
    margin-right: 0.5rem;
    display: block;
    margin-top: auto;
    margin-bottom: auto;
}

form#nuevo-doc button[type="submit"] {
    margin-top: 1.5rem;
    background-color: var(--main-blue);
    border-radius: var(--border-radius);
    background-color: var(--main-blue);
    border: 0px solid transparent;
    color: #ffffff;
    padding: 0.5rem 0.75rem;
    width: fit-content;
    display: flex;
    flex-direction: row;
}

@media(max-width:992px) {
    form#nuevo-doc button[type="submit"] {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}

h1 {
    font-size: 36px;
    color: var(--main-blue);
    margin-bottom: 1rem;
    font-weight: 500;
}
@media(max-width:992px) {
    h1 {
        font-size: 30px;
    }
}

.steps {
    display: flex;
    flex-direction: row;
}
@media(max-width:992px) {
    .steps div span{
        display: none;
    }
}


.steps div {
    width: 33%;
    background-color: #F5F5F5;
    border: #E5E5E5;
    padding: 0.5rem 0.75rem;
    text-align: center;
    border: 1px solid #E5E5E5;
}

.steps div.pendiente p,
.steps div.active p {
    color: #ffffff;
}

.steps div.pendiente {
    border: 1px solid var(--main-orange);
    background-color: var(--main-orange);
}
.steps div.active {
    border: 1px solid var(--main-blue);
    background-color: var(--main-blue);
}

.steps div p i{
    margin-right: 0.5rem;
    font-size: 12px;
    line-height:18px
}
.steps div p span{
    padding-left: 0.25rem;
}
.steps div p {
    display: flex;
    flex-direction: row;
    color: #666666;
    text-align: center;
    transition: 0.3s ease-in-out;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    height: fit-content;
    width: fit-content;
    transition: 0.3s ease-in-out;
    margin: auto;
}
@media(max-width: 992px){
    .steps div p i,
    .steps div p {
        font-size: 14px;
    }
}

button#timeline-btn img {
    margin: auto 0.5rem auto 0;
    display: block;
    height: 100%;
    width: auto;

}

button#timeline-btn {
    background-color: transparent;
    border: 0px;
    color: var(--main-blue);
    display: flex;
    flex-direction: row;
    margin: auto 0 auto auto;
}

#timeline {
    position: relative;
    transition: 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    width: 25vw;
    height: 100vh;
    background-color: var(--main-blue-2);
    position: fixed;
    top: 0;
    left: 100vw;
    padding: 3rem 0 3rem 3rem;
}

#timeline p.headTimeLine {
    font-size: 28px;
    margin-bottom: 1.5rem;
    color: #000000;
    font-weight: 500;
}

#timeline ul li p.date {
    font-size: 18px;
    color: #000000;
    font-weight: 400;
    line-height: 18px;
}

#timeline ul li p.user {
    font-size: 14px;
    color: #666666;
    line-height: 14px
}

#timeline ul li p.action {
    font-size: 20px;
    color: #000000;
    font-weight: 600;
    line-height: 26px;
}

#timeline ul li p {
    margin: 0;
}

#timeline ul li {
    border-bottom: 1px solid #A0B6D3;
    padding: 0 0 0.75rem 0;
    display: flex;
    flex-direction: column;
    margin-bottom: 1.5rem;
}

#timeline ul {
    padding: 0;
}

#close-timeline-btn {
    background-color: transparent;
    border-color: transparent;
    color: #000000;
    position: absolute;
    top: 3rem;
    right: 2rem;
    font-size: 18px;
}

#timeline.opened {
    left: 75vw;
    overflow-y: auto;
    z-index: 1;
}

@media(max-width:992px) {
    #timeline.opened {
        left: 5vw;
    }

    #timeline {
        transition: 0.3s ease-in-out;
        display: flex;
        flex-direction: column;
        width: 95vw;
        height: 100vh;
        background-color: var(--main-blue-2);
        position: fixed;
        top: 0;
        left: 130vh;
        padding: 3rem 0 3rem 3rem;
        z-index: 1001;
    }

    #timeline p.headTimeLine {
        font-size: 24px;
        margin-bottom: 1rem;
    }

    #timeline ul li {
        margin-bottom: 0.75rem;
    }

    #timeline ul li p.date {
        font-size: 14px;
    }

    #timeline ul li p.user {
        font-size: 13px;
    }

    #timeline ul li p.action {
        font-size: 16px;
    }
}

ul.steps-formulario li.active span {
    background-color: var(--main-blue);
    color: #ffffff;
}
ul.steps-formulario li.complet span{
    background-color: var(--main-green);
    color: #ffffff;
}

ul.steps-formulario li span i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

ul.steps-formulario li span {
    position: relative;
    background-color: #E5E5E5;
    color: #333333;
    border-radius: 500px;
    width: 15px;
    height: 15px;
    padding: 17px;
    text-align: center;
    margin-bottom: 0.5rem;
}

ul.steps-formulario li p {
    font-size: 16px;
    color: #333333;
    margin: 0;
}

@media(max-width:992px) {
    ul.steps-formulario li p {
        display: none;
    }
}

ul.steps-formulario li {
    display: flex;
    flex-direction: column;
}

ul.steps-formulario {
    margin: 0;
    padding: 1.5rem 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-top: 1px solid #E5E5E5;
    margin-top: 1rem;
}

p.idConrato {
    margin-top: 1.5rem;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

p.perfillContrato {
    display: flex;
    flex-direction: row;
    font-size: 12px;
    color: #A0B6D3;
    line-height: 34px
}

p.perfillContrato strong {
    display: flex;
    flex-direction: row;
    font-size: 12px;
    color: #333333;
    margin-left: 0.5rem;
}

p.perfillContrato .plantilla {
    background-color: var(--main-blue-2);
    padding: 0.5rem;
    border-radius: var(--border-radius);
    color: #333333;
    margin: auto 0.75rem auto 0;
    font-size: 12px;
    height: fit-content;
    line-height: initial;
}

p.descripcion {
    font-size: 14px;
    color: #666666;
    margin-bottom: 0;
}

.row-contrato p a,
.row-contrato p {
    font-size: 18px;
    color: #666666;
}
.row-contrato p i.fa-circle{
    color: var(--main-red);
    font-size: 10px;
    margin-left:0.5rem
}
.row-contrato p i.fa-check{
    color: var(--main-green);
    font-size: 10px;
    margin-left:0.5rem
}


.row-contrato p.title-row-contrato {
    font-size: 14px;
    color: #666666;
    margin-top: 1rem;
    margin-bottom: 0rem;
}


form .row-form-group {
    display: flex;
    flex-direction: row;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    padding: 1rem 0;
    border-bottom: 1px solid #E5E5E5;
}
form .row-form-group p{
    width: 75% !important;
    color: #707070;
    font-size: 14px;
    padding: 0.5rem  0.5rem  0.5rem  1rem ;
    margin: 0;
}
form .row-form-group .selection{
    width: 100%;
}

form .form-group input,
form .row-form-group input {
    width: 100%;
    border-radius: var(--border-radius);
    border: 1px solid #707070;
    background-color: #fff;
    color: #707070;
    font-size: 14px;
    padding: 0.5rem;
}

form .row-form-group .input-group input {
    width: calc(100% - 46px);
}
form .row-form-group .input-group {
    flex-wrap: nowrap;
}
form .form-group input{
    margin-left: 0;
    width: 100%!important;
}

.all-father-container .select2-container span.selection{
    width: 100%;
}
.all-father-container .select2-container {
    display: flex;
    border-radius: var(--border-radius);
    border: 1px solid #707070;
    width: 75% !important;
    margin-left: 1rem !important;
    padding: 0.5rem;
}

.all-father-container .form-group .select2-container{
    width: 100%!important;
    margin-left:0!important;
    margin-top:0.5rem;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
    background-color: var(--main-blue-2);
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
    background-color: var(--main-blue)!important;
}

.select2-container--default .select2-selection--single {
    border: 0px solid transparent !important;
    height: auto !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 14px !important;
    font-size: 14px !important;
    width:100%;
    padding: 0 !important;
}

form .form-group label,
form .row-form-group label {
    width: 25%;
    font-size: 14px;
    padding: 0.5rem 0;
    text-align: right;
}
form .form-group label{
    width: 100%;
    text-align: left;
}

form#nuevo-doc fieldset{
    padding: 1rem 0;
}

form#nuevo-doc fieldset button.back i::after{
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}
form#nuevo-doc fieldset button.back i{
    margin-right: 0.75rem;
    line-height:28px

}
form#nuevo-doc fieldset button.back{
    font-size:18px;
    color: var(--main-blue);
    margin: 2rem auto 2rem 0;
    background-color: transparent;
    border-radius: var(--border-radius);
    border: 0px solid transparent;
    padding: 0.5rem 0.75rem;
    width: fit-content;
    display: flex;
    flex-direction: row;
    text-align: center;
}

form#nuevo-doc fieldset button.addrow i{
    margin-right:0.5rem;
    line-height:21px;
}
form#nuevo-doc fieldset button.addrow{
    font-size: 16px;
    background-color: var(--main-blue);
    border-radius: var(--border-radius);
    background-color: var(--main-blue);
    border: 0px solid transparent;
    color: #ffffff;
    padding: 0.5rem 0.75rem;
    width: fit-content;
    display: flex;
    flex-direction: row;
    margin-bottom: 1.5rem;
}
form#nuevo-doc button[type="submit"] {
    margin: 2rem 0 2rem auto;
    padding: 0.5rem 1rem;
    width: 100%!important;
    text-align: center;
    justify-content:center
}

form#nuevo-doc fieldset legend{
    font-size:30px;
    color:#333333;
    font-weight: 500;
    margin: 0 0 0.5rem 0;
}
form#nuevo-doc fieldset legend.alternative i::before{
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    position: absolute;
}
form#nuevo-doc fieldset legend.alternative i{
    font-size:10px;
    border-radius: 500px;
    border: 2px solid #666666;
    color: #666666;
    height: 24px;
    width: 24px;
    position: relative;

    margin-left: 0.25rem;
}
form#nuevo-doc fieldset legend.alternative{
    font-size:24px;
    line-height:24px;
    color:#333333;
    font-weight: 500;
    margin: 0 0 0.5rem 0;
}

 p.formtable {
    display:none
}
 div.formtable{
    width:100%;
    padding:0 0 2rem 0;
}

div.formtable table button{
    border: 0px solid transparent;
    background-color:transparent;
    padding: 0.25rem;
    color: var(--main-red);
}

div.formtable table > *{
    white-space: nowrap;
    font-size: 16px;
}
div.formtable .table>:not(:first-child){
    border-top:transparent 0px solid ;
}
div.formtable .table.table-inputs tr th,
div.formtable .table.table-inputs tr td{
    padding: 1rem 0.5rem;
}
div.formtable .table thead tr th{
    font-weight: 600;
}
div.formtable .table tbody tr th{
    font-weight: 600;
}
@media(max-width:992px){
    div.formtable table > *{
        font-size: 12px;
    }
    div.formtable{
        width:100%;
        overflow:scroll;
    }
    p.formtable i{
        float:right;
        line-height:20px
    }
   p.formtable {
        display:flex;
        font-size: 14px;
        font-weight: 500;
        background-color:var(--main-blue-2);
        color: var(--main-blue);
        border-radius: var(--border-radius);
        width:100%;
        display:block;
        margin-top: 2rem;
        margin-bottom:0.5rem;
        padding: 0.5rem 0.75rem;
    }
}

@media (max-width: 992px) {
    form#nuevo-doc fieldset button.back{
        margin: auto;
        margin-top: 0.75rem;
        margin-bottom: 0.75rem;
        width:100%;
        background-color: var(--main-blue-2);
        justify-content:center;
    }
    form#nuevo-doc fieldset button[type="submit"] {
        margin: auto;
        margin-bottom: 3rem;
        width:100%;
    }
    form .form-group label,
    form .row-form-group label{
        width:fit-content;
        margin-bottom: 0.25rem;
        padding: 0 ;
        text-align: left;
    }
    form .form-group label span{
        display:none;
    }
    form .row-form-group p{
        width: 100% !important;
        margin: 0!important;
        padding: 0;
    }
    form .row-form-group input,
    .all-father-container .select2-container {
        width: 100% !important;
        margin: 0!important;
    }
}

.table-form p.head-table{
    margin-top: auto;
    margin-bottom: 1.5rem;
    font-size:18px;
    font-weight:400;
}

.title-row-contrato{
    font-size: 28px;
    color: #333333;
    margin-bottom: 0;
    font-weight: 500;
}
.subtitle-row-contrato{
    font-size: 20px;
    color: #333333;
    margin-bottom: 0;
    font-weight: 500;
}
a.edit-form{
    margin: 0 0 0 auto;
    width:fit-content;
    display:block;
    color:var(--main-blue);
    font-size:18px;
    font-weight:500;
    text-decoration:none
}


.resumen-datos{
    display:flex;
    flex-direction:row;
    padding: 0.0rem 0;
    margin-bottom: 0.5rem;
    justify-content:left;
    border-bottom: 1px solid #E5E5E5;
}

.resumen-datos p.label,
.resumen-datos p.resumen{
    font-weight: 400;
    font-size: 18px;
    color: #333333;
    min-width:25%;
    max-width:25%;
    margin: 0;
}
.resumen-datos p.resumen{
    font-weight: 600;
    margin-left: 0.75rem;
    min-width:75%;
    max-width:75%;
}

#send-mail {
    margin-top:auto;
    margin-bottom:0;
}
#send-mail p.send-mail{
    font-size: 40px;
    font-weight:500;
    color: #000000;
    line-height:40px;
}
#send-mail a{
    background-color:var(--main-blue);
    color: #ffffff;
    border-radius:var(--border-radius);
    text-decoration: none;
    font-size: 18px;
    font-weight: 400;
    padding: 0.75rem;
    margin-top: 1.5rem;
    display:block;
    width: fit-content;
}
#send-mail figure {
    position: relative;
    width: 100%;
    height: 400px;
    margin-top:auto;
    margin-bottom:0;
}
@media(max-width:992px) {
    #send-mail figure {
        width: 50%;
        height: 200px;
    }
    #send-mail a{
        margin-bottom:4rem;
        width:100%
    }
    #send-mail p.send-mail{
        margin-top: 1rem;
        display:block;
    }
}
#send-mail figure img{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80%;
    height: auto;
}

body.firmaCheck{
    display:flex;
    width:100vw;
    height: 100vh;
}
#firmaCheck{
    display: block;
    height: fit-content;
    width: 100vw;
    margin: 4rem 0;
}

#firmaCheck img{
    width: 50%;
    display:block;
    height: auto;
    margin: 0 auto 3rem auto;
}
#firmaCheck p{
    text-align: center;
    font-size: 16px;
    color: #999999;
}
#firmaCheck p.head-mail{
    font-weight: 500;
    color: #000000;
    font-size: 40px;
    line-height:40px;
    margin-bottom: 1.5rem;
}
#firmaCheck a{
    background-color:var(--main-blue);
    color: #ffffff;
    border-radius:var(--border-radius);
    text-decoration: none;
    font-size: 16px;
    font-weight: 400;
    padding: 0.5rem 3rem;
    margin-top: 1.5rem;
    display:block;
    width: fit-content;
    margin: 2rem auto 0 auto;
}
@media (max-width: 768px){
    #firmaCheck{
        margin-top:2rem
    }
    #firmaCheck p.head-mail{
        font-size: 25px;
    }
    #firmaCheck a{
        width:100%;
        text-align:center;
    }
}

#firmasrealize p.user-firma{
    font-size: 16px;
    color: #333333;
    line-height:14px;
    margin-bottom: 0.25rem;
}
#firmasrealize p.user-firma i.fa-check{
    background-color: var(--main-green);
}
#firmasrealize p.user-firma i.fa-times{
    background-color: var(--main-red);
}
#firmasrealize p.user-firma i.fa-clock {
    background-color: gray;
}
#firmasrealize p.user-firma i{
    padding:0.15rem 0.5rem;
    border-radius: var(--border-radius);
    margin-right: 0.5rem;
    font-size:12px;
    width: 28px;
    text-align: center;
    color: #ffffff;

}
#firmasrealize p.frimas-head{
    font-size: 14px;
    color: #666666;
    margin-bottom:0.5rem;
}
#firmasrealize .row{
    border-top:2px solid #E5E5E5;
    border-bottom:2px solid #E5E5E5;
    padding: 1rem 0;
    margin-top: 2rem ;
    margin-bottom: 1rem ;
}

.doc-resumen{
    padding: 1rem 0;
}

.doc-resumen a{
    color: var(--main-blue);
    font-size: 14px;
    text-decoration: none;
}

.doc-resumen a.disabled i{
    border-bottom:2px solid var(--main-blue);
    opacity: 0.75;
}
.doc-resumen a.disabled{
    color: var(--main-blue);
    opacity: 0.5;
    cursor: not-allowed;
}
.doc-resumen a i {
    margin-right: 0.5rem;
}
.doc-resumen .col-md-6 i{
     border-bottom:2px solid var(--main-blue);
}
.doc-resumen .col-md-6{
    text-align: end;
}
.doc-resumen .col-md-6:nth-last-of-type(2n) i{
    /* border-bottom:2px solid var(--main-blue); */
    border: 0px solid transparent;
}
.doc-resumen .col-md-6:nth-last-of-type(2n){
    text-align: left;
}

@media(max-width:992px){
    .doc-resumen .col-md-6{
        text-align: left;
        margin-bottom:0.5rem
    }
}

#resum-new-doc {
    padding: 2rem 0;
}

#resum-new-doc a i {
    margin-right:0.5rem;
}
#resum-new-doc a{
    color: var(--main-red);
    font-size:16px;
    font-weight: 400;
    text-decoration: none;
}

#resum-new-doc .caption-new-doc .head-new-doc{
    font-size:24px;
}
#resum-new-doc .caption-new-doc p.core-doc{
    font-size: 19px;
    line-height:19px;
    font-weight: 400;
    color: #000000;
    margin-bottom: 1rem;
}
#resum-new-doc .caption-new-doc p.head-doc{
    font-size: 16px;
    line-height:16px;
    font-weight: 400;
    color: #999999;
    margin-bottom: 0;
}
@media(max-width:992px){
    #resum-new-doc .caption-new-doc p.core-doc{
        font-size: 17px;
        line-height:17px;

    }
    #resum-new-doc .caption-new-doc p.head-doc{
        font-size: 14px;
        line-height:14px;
    }
}
#resum-new-doc .caption-new-doc{
    display:flex;
    flex-direction:column;
    padding: 0.5rem 0 0.5rem 1.5rem;
    border-left: 4px solid var(--main-blue-2);
}

#resum-new-doc a.go-form img{
    height: 100%;
    width: auto;
    margin-right:0.5rem;
    display:block
}
#resum-new-doc p.extra-info-important{
    font-size: 15px;
    font-weight:400;
    font-style: italic;
    color: #333333;
    margin-top: 1.5rem;
}
#resum-new-doc a.go-form{
    margin-top: 2rem;
    display:flex;
    flex-direction: row;
    border-radius: var(--border-radius);
    padding:0.5rem 1rem;
    background-color: var(--main-blue);
    color: #ffffff;
    font-size: 16px;
    font-weight:500;
    width:fit-content;
}
@media(max-width:992px){
    #resum-new-doc a.go-form{
        width: 100%;
        justify-content:center;
        text-align:center;
    }
}

#docs-tabs h2{
    font-size:22px;
    color:var(--main-blue);
    font-size: 20px;
    font-weight: 500;
    margin-bottom:0;
}
@media(max-width:992px){
    #docs-tabs h2{
        margin-top: 1.5rem;
    }
}
#docs-tabs{
    padding:2rem 0;
}

#docs-tabs ul.nav-tabs-docs{
    display:flex;
    flex-direction: row;
    padding:0;
    margin: 0 0 2rem 0;
}
@media(max-width:992px) {
    #docs-tabs ul.nav-tabs-docs li{
        width: 100%;
    }
    #docs-tabs ul.nav-tabs-docs{
        display:flex;
        flex-direction: column;
        margin-bottom: 0.5rem;
    }
}

#docs-tabs ul.nav-tabs-docs li{
    margin: 0 1.25rem 0 0;
}

#docs-tabs ul.nav-tabs-docs li button span{
    background-color: var(--main-red);
    border-radius: 500px;
    padding: 0.15rem 0.5rem;
    color: #ffffff;
    font-size: 14px;
    line-height: 14px;
    margin: auto 0 auto 0.5rem;
}
#docs-tabs ul.nav-tabs-docs li button.active{
    border-bottom: 3px solid var(--main-red);
}
#docs-tabs ul.nav-tabs-docs li button{
    display: flex;
    flex-direction: row;
    padding: 0.25rem 0;
    border:0px solid transparent;
    border-bottom: 3px solid transparent;
    transition: 0.3s ease-in-out;
    color: #333333;
    background-color: transparent;
    font-size: 18px;
    font-weight:500;
    white-space: nowrap
}
@media(max-width:992px) {
    #docs-tabs ul.nav-tabs-docs li button{
        width:100%;
    }
    #docs-tabs ul.nav-tabs-docs li button span{
        margin: auto 0 auto auto;
    }
}

#tabody1,
#tabody2,
#tabody3,
#tabody4 {
    display:none;
    flex-direction:column;
}

.card-tab{
    border: 2px solid var(--main-blue-2);
    border-radius: var(--border-radius);
    display:flex;
    flex-direction: column;
    padding:1rem 1.75rem;
    width: 100%;
    margin-bottom:1rem;
}

.card-tab .card-tab{
    background-color:#F5F5F5;
    border-color: #E5E5E5;
}
.card-tab .card-tab:last-of-type{
    margin-bottom:0;
}

.card-tab .card-tab-flexer{
    display: flex;
    flex-direction:row;
    margin: auto 0 auto auto;
}
.card-tab button{
    margin: 0 0 0 auto;
}
.card-tab button,
.card-tab .card-tab-flexer button{
    border-radius: var(--border-radius);
    background-color: #ffffff;
    border: 1px solid var(--main-blue-2);
    padding: 0.5rem 0.75rem;
    font-size: 14px;
    height: 37px;
}
.card-tab .dropdown-menu,
.card-tab .card-tab-flexer .dropdown-menu {
    padding:0 1rem 0.5rem 1rem;
}
.card-tab .dropdown-menu li.fallapart,
.card-tab .card-tab-flexer .dropdown-menu li.fallapart{
    border-bottom: 2px solid var(--main-blue-2);
    padding-bottom: 1rem;
}
.card-tab .dropdown-menu li,
.card-tab .card-tab-flexer .dropdown-menu li{
    padding-top:0.5rem;
    width: 100%;
}
.card-tab .dropdown-menu li:hover a,
.card-tab .card-tab-flexer .dropdown-menu li:hover a{
    background-color:var(--main-blue);
    color: #ffffff;
}
.card-tab .dropdown-menu li a.disabled,
.card-tab .card-tab-flexer .dropdown-menu li a.disabled{
    background-color:transparent!important;
    color: #999999!important;
}
.card-tab .dropdown-menu li a,
.card-tab .card-tab-flexer .dropdown-menu li a{
    padding: 0.5rem;
    font-size:16px;
    font-weight: 400;
    color: #000000;
    width: 100%;
    display:block;
    text-decoration:none;
    transition: 0.3s ease-in-out;
    border-radius: var(--border-radius);
    background-color: transparent;
}
.card-tab a.completform,
.card-tab .card-tab-flexer a.completform{
    border-radius: var(--border-radius);
    background-color:var(--main-blue);
    color:#ffffff;
    display:flex;
    flex-direction:row;
    width: fit-content;
    font-size: 14px;
    text-decoration: none;
    margin-right: 0.5rem;
    padding: 0.5rem 0.75rem;
}
@media(max-width:992px){
    .card-tab .card-tab-flexer{
        margin-top: 0.5rem;
        width: 100%;
    }
    .card-tab .card-tab-flexer a.completform{
        width: calc(100% - 32px);
        justify-content:center;
        text-align: center;
    }
}
.card-tab .head{
    font-size: 20px;
    font-weight:500;
    color: #000000;
    line-height:20px;
    margin: 0;
}
.card-tab .cliente span{
    font-size: 14px;
    font-weight:300;
    color: #000000;
}
.card-tab p.contrato strong{
    font-weight:500;
    margin-left: 0.35rem;
}
.card-tab p.contrato{
    display: flex;
    flex-direction: row;
    font-size: 12px;
    line-height:34px;
    color: #000000;
    font-weight: 300;
    margin-bottom: 0;
    margin-top: 0.5rem;
}
.card-tab p.contrato span{
    text-transform: uppercase;
    background-color: var(--main-blue-2);
    padding: 0.5rem;
    border-radius: var(--border-radius);
    color: #333333;
    margin: auto 0.5rem auto 0;
    font-size: 12px;
    height: fit-content;
    line-height: initial;
}
.card-tab p.contrato span.albaran{
    background-color: #E1CCE7
}
.card-tab p.contrato span.presupuesto{
    background-color: #E7D8CC
}
.card-tab .cliente{
    font-size: 14px;
    font-weight:500;
    color: #000000;
    margin-bottom: 0rem;
    line-height:14px
}


@media(max-width:992px) {
    .card-tab p.contrato,
    .card-tab p.contrato span{
        font-size: 12px;
    }
}

#tabody1.active,
#tabody2.active,
#tabody3.active,
#tabody4.active{
    display:flex;
}
button#newCliente i,
button#openSearcher i{
    margin-right: 0.5rem;
    font-size:14px;
    line-height:22px;
}
@media(max-width:992px){
    button#newCliente,
    button#openSearcher {
        margin-bottom: 0.5rem;
    }
}
button#openSearcher{
    display:flex;
    flex-direction: row;
    justify-content:center;
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius);
    background-color: var(--main-blue-2);
    color: #333333;
    border: 0px solid transparent;
    font-size: 16px;
    width: 100%;
}
button#newCliente{
    display:flex;
    flex-direction: row;
    justify-content:center;
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius);
    background-color: var(--main-red);
    color: #ffffff;
    border: 0px solid transparent;
    font-size: 16px;
    width: 100%;
}

@media(max-width:992px){
    button#openSearcher{
        margin-bottom:0.75rem
    }
}

#panel-buscador{
    position: fixed;
    top: 0;
    right:-30vw;
    height: 100vh;
    width:30vw;
    transition: all 0.3s ease-in-out;
    background-color: var(--main-blue-2);
    padding: 2rem;
    z-index: 1002;
}
#panel-buscador.opened{
    right: 0vw;
}

#panel-buscador p.head button{
    margin: auto 0 auto auto;
    font-size:24px;
    color:#000000;
    text-decoration: none;
    font-weight: 900;
    line-height:30px;
    background-color:transparent;
    border: 0px solid transparent;
}
#panel-buscador p.head{
    width:100%;
    display:flex;
    flex-direction: row;
    font-size: 30px;
    font-weight:500;
    color: #000000;
}
#panel-buscador form{
    display: flex;
    flex-direction: column;
}

@media(max-width:992px){
    #panel-buscador{
        width: 95vw;
        left: 100vw;
        right: inherit¡;
    }
    #panel-buscador.opened{
        left: 5vw;
    }
    #panel-buscador p.head button,
    #panel-buscador p.head{
        font-size:26px;
    }
}

#panel-buscador form .search-group{
    display:flex;
    flex-direction:column;
    justify-content:left;
    margin:0.25rem 0;

}
#panel-buscador form .search-group label{
    font-size:18px;
    font-weight:500;
    color: #000000;
    margin-bottom:0.25rem ;
}
#panel-buscador form .search-group input{
    border-radius: var(--border-radius);
    background-color:#ffffff;
    color:#333333;
    border: 1px solid #333333;
    padding: 0.25rem;
    width: 100%;
    font-size: 14px;
}

.all-father-container #panel-buscador .select2-container{
    background-color:#ffffff!important;
    margin-left: 0!important;
    width:100%!important;
}
#panel-buscador form button[type="submit"] i{
    margin-right:0.25rem;
}
#panel-buscador form button[type="submit"]{
    background-color:var(--main-blue);
    color: #ffffff;
    font-size: 16px;
    width: 100%;
    border: 0px solid transparent;
    border-radius: var(--border-radius);
    padding: 0.25rem 0.5rem;
    margin-top: 1rem;
}
#searchtab .search-results{
    display:flex;
    flex-direction:column;

}

#searchtab .search-results p.head-search{
    font-size:24px;
    font-weight:500;
    color: #000000;
    margin-bottom:0.5rem;
}
#searchtab .search-results ul{
    display:flex;
    flex-direction:row;
    padding: 0;
    margin: 0 0 1rem 0;
    flex-wrap: wrap;
}
#searchtab .search-results li{
    padding: 0.25rem 0.25rem 0.5rem 0;
}
#searchtab .search-results li a i{
    margin-left: 1.5rem;
    line-height:22px;
    font-size:18px;
}
#searchtab .search-results li a{
    background-color: #f5f5f5;
    color: #000000;
    font-size: 16px;
    text-decoration:none;
    display:flex;
    flex-direction:row;
    padding: 0.5rem 0.75rem;
    border-radius: var(--border-radius);
}

.collapse-help{
    border: #E5E5E5 2px solid;
    border-radius: calc(var(--border-radius)*2);
    margin-bottom:0.75rem;
}

.collapse-help button i.fa-chevron-down:before{
    transform: translate(-50%, -50%) rotate(0deg);
    transition: 0.3s ease-in-out;
    top: 50%;
    left: 50%;
    position: absolute;
}
.collapse-help button.opened i.fa-chevron-down:before{
    transform: translate(-50%, -50%) rotate(180deg);
}
.collapse-help button i{
    width:20px;
    height:18px;
    margin-left:1rem;
    right: 1rem;
    top:1rem;
    position:absolute;
    /* border:1px solid red; */
}
.collapse-help button{
    font-size:20px;
    width: 100%;
    display:block;
    font-weight:400;
    color: #000000;
    border:0px solid transparent;
    background-color:transparent;
    padding:1rem;
    margin: 0 auto;
    position: relative;
    text-align: left;
}
.collapse-help button.fatherCat.opened{
    background-color:var(--main-blue-2);
}
.collapse-help .collapse-inside button{
    padding: 0.5rem 1rem 0.5rem 2rem;

}
.collapse-help .collapse-inside button.opened{
    background-color: #f5f5f5;
}
.collapse-help .collapse-inside{
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--main-blue-2);
}
.collapse-help .collapse-inside:last-of-type{
    border-bottom:0px solid transparent;
}
.collapse-help p{
    padding: 0 1rem 0 2rem;
    font-size:16px;
    font-weight:400;
    color: #666666;
    margin: 0;
}
.collapse-help a {
    padding: 0 1rem 0 2rem;
    text-decoration: underline;
    color: var(--main-blue);
    font-size: 18px;
}
.collapse-help img {
    width: 100%;
}

@media(max-width:992px){
    .collapse-help button{
        font-size:16px;
    }
    .collapse-help  p{
        font-size:14px
    }
}

#help p.headAyuda{
    font-size: 18px;
    font-weight: 400;
    color: #333333;
}
#help p.headAyuda a{
    text-decoration: underline;
    color: var(--main-blue);
}

#contacta form button[type="submit"]{
    background-color:var(--main-blue);
    color: #ffffff;
    font-size: 16px;
    width: 50%;
    border: 0px solid transparent;
    border-radius: var(--border-radius);
    padding: 0.25rem 0.5rem;
    margin-top: 1rem;
}
@media (max-width: 768px) {
    #contacta form button[type="submit"]{
        width:100%;
    }
}
#contacta .contacta-head a{
    text-decoration: underline;
    color: var(--main-blue);
}
#contacta .contacta-head{
    font-size: 18px;
    font-weight: 400;
    color: #333333;
}

#contacta-ok .headOk h1{
    font-weight: 400;
    display:flex;
    flex-direction: column;
    justify-content: left;
    color: var(--main-green);
}
@media(max-width:992px){
    #contacta-ok .headOk h1{
        font-size: 24px;
    }
}
#contacta-ok .headOk hr{
    height: fit-content;
    margin:0;
    margin-top: 1rem;
    border-top:2px solid var(--main-red);
    opacity:1;
    width: 100px;
}
#contacta-ok .headOk{
    margin-bottom: 4rem;
    display: flex;
    flex-direction: column;
}

#contacta-ok .bodyOk{
    display: flex;
    flex-direction: column;
}

#contacta-ok .bodyOk p.head{
    font-size:24px;
    font-weight: 500;
    color:var(--main-blue);
    margin-bottom:0rem;
}
#contacta-ok .bodyOk p.label{
    font-size: 16px;
    color: #999999;
    font-weight: 400;
    margin-top: 0.5rem;
    margin-bottom: 0;
}
#contacta-ok .bodyOk p.userInfo{
    font-size: 18px;
    color: #000000;
    font-weight: 400;
    margin-top:0;
    margin-bottom: 0.5rem;
}

#docs-tabs form button[type="submit"]{
    border-radius: var(--border-radius);
    background-color: var(--main-blue);
    color: #ffffff;
    font-weight: 400;
    font-size: 16px;
    padding: 0.5rem 0.75rem;
    border: 0px solid transparent;
    width:50%;
    margin-top:1rem;
    margin-bottom:2rem;
}
@media(max-width:992px){
    #docs-tabs form button[type="submit"]{
        width:100%;
    }
}

#docs-tabs .config{
    display:flex;
    flex-direction:row;
    width: 100%;
    border-bottom: 2px solid #e5e5e5;
}

#docs-tabs .config p{
    font-size:16px;
    font-weight:400;
    width: 60%;
    color: #666666;
}
@media(max-width:992px){
    #docs-tabs .config p{width: 80%;}
}
#docs-tabs .config button.toggler-button.opened{
    background-color: var(--main-green);
}
#docs-tabs .config button.toggler-button.opened::after{
    left:calc(100% - 16px);
}
#docs-tabs .config button.toggler-button::after{
    position:absolute;
    transform: translate(-50%, -50%);
    content:"";
    background-color: #ffffff;
    height: 15px;
    width: 15px;
    border-radius: 500px;
    top: 50%;
    left:calc(0% + 16px);
    transition: 0.3s ease-in-out;
}
#docs-tabs .config button.toggler-button{
    background-color: #E5E5E5;
    border-radius: 500px;
    border: 0px solid transparent;
    position:relative;
    width: 55px;
    height: 30px;
    transition: 0.3s ease-in-out;
    margin: 0 0.5rem auto auto;
}

.card-tab .nameClient{
    position:relative;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 0rem;
    line-height:18px;
}
.card-tab.complet .nameClient::after{
    display:none;
}
.card-tab .nameClient::after{
    top: 50%;
    left: -10px;
    position: absolute;
    transform: translate(-50%,-50%);
    content:"";
    width: 10px;
    height: 10px;
    border-radius: 500px;
    background-color:var(--main-red);
}

.card-tab p.secClient{
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    font-size: 14px;
    font-weight: 400;
    color:#666666;
    text-transform: uppercase;
}

#backCliente i{
    margin-right:0.5rem;
    line-height:24px;
    font-size:16px;
}
#backCliente{
    text-align: center;
    height: fit-content;
    justify-content: center;
    margin: 0 0 2rem auto;
    font-size: 16px;
    border-radius:var(--border-radius);
    color: #333333;
    background-color:#E5E5E5;
    padding: 0.5rem 0.75rem;
    width: fit-content;
    border:0px solid transparent;
    display:flex;
    flex-direction: row;
}

@media(max-width:992px){
    #backCliente{
        width: 100%;
    }
}

.sercher2 .select2 .select2-selection__arrow b{
    display: none;
}
.sercher2 .select2.select2-container.select2-container--default{
    position:relative;
}
.sercher2 .select2.select2-container.select2-container--default::before{
    content: "\f002";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size:14px;
    position:absolute;
    top: 50%;
    right: 0.5rem;
    z-index:2;
    transform:translate(-50%,-50%);
}

 div.info-responsable{
    display:flex;
    flex-direction:row;
    margin-top: 0.5rem;
 }
 @media (max-width:992px){
    div.info-responsable{
        flex-direction:column;
    }
 }
 p.info-responsable{
    font-size: 12px;
    color: #333333;
    margin-right: 0.5rem;
    margin-bottom: 0;
 }

button.new-col i{
    margin-right:0.5rem;
    line-height:26px;
    font-size: 12px;
}
button.new-col{
    background-color: transparent;
    color: var(--main-blue);
    font-size: 18px;
    font-weight:500;
    display:flex;
    flex-direction: row;
    justify-content: left;
    border:0px solid transparent;
    padding-bottom:0.75rem;
}

#newRes{
    border-radius: calc(var(--border-radius)*3);
    border: 2px solid #E5E5E5;
    background-color:#F5F5F5;
    padding:1.5rem;
    position:relative;
    z-index: 1;
}
#newRes::after{
    content:"";
    transform:translate(-50%, -50%) rotate(45deg);
    border-radius: 1px;
    height: 14px;
    width: 14px;
    position: absolute;
    top: 0;
    left: 2rem;
    background-color: #f5f5f5;
    border: 2px solid #e5e5e5;
    z-index: 0;
    transition: 0.3s ease-in-out;
}
#newRes::before{
    content: "";
    border-radius: 3px;
    height: 18px;
    width: 32px;
    position: absolute;
    top: 0;
    left: 1rem;
    background-color: #f5f5f5;
    z-index: 2;
    transition: 0.3s ease-in-out;
}

#newRes form{
    width: 60%;
}
@media (max-width: 992px) {
    #newRes form{
        width: 100%;
    }
}
#newRes .headNewRes {
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    margin-bottom: 1rem;
}
#newRes .headNewRes button{
    margin: 0;
    font-size: 18px;
    color: #000000;
    background-color: transparent;
    border: 0px solid transparent;
}
#newRes .headNewRes p{
    margin: 0;
    line-height:18px;
    font-size: 22px;
    color: #000000;

}

.has-error .select2-selection {
    border-color: #ea5455 !important;
}

.snow-wrapper.has-error {
    border: 1px solid #ea5455 !important;
}

small.error-message {
    color: #ea5455 !important;
}

/* Quill editor */
.snow-wrapper .editor {min-height: 200px;}

/* css doble drop down */

.collapse-inside{

}

ul.pagination .page-item{
    margin-left: 1rem;
}

.page-item .page-link{
    background-color: #fff;
    transition: 0.3s ease-in-out;
    color: var(--main-blue);
    border-radius:4px!important;
}

.page-item .page-link:hover, 
.page-item.active .page-link{
    background-color: var(--main-blue);
    color: #ffffff;
}

/* Graficos home */
.graphiccontroler{
    position: relative;
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    width:calc(100% - 8rem);
    height: 60px;
}
.graphiccontroler span{
    display:flex;
    margin: auto 0 0 0;
    background-color: #E5EBF3;
    border-radius: 5px;
    width: 12%;
  }
  #envio.graphiccontroler span:last-of-type,
  #firma.graphiccontroler span:last-of-type{
    background-color: var(--main-red);
  }

  #completado.graphiccontroler span:last-of-type{
    background-color:  var(--main-green);
  }

/* Language selector */
header{
    padding-top: 0;
}
header nav{
    padding-top:1rem;
}

#language-selector{
   
    width: 100%;
    height:auto;
    padding: 0.25rem 0;
    background-color: #E5EBF350;
}

#language-selector ul{
    display:flex;
    flex-direction: row;
    justify-content: end;
    margin: 0;
}

#language-selector ul li {
    padding-left: 0.5rem;
}
#language-selector ul li a{
    padding: 0.5rem;
    text-decoration: none;
    color: var(--main-blue);
    opacity: 0.5;
}
#language-selector ul li a.active{
opacity: 1;
}

/* .vs__selected {
    line-height: 100%!important;
}
input.vs__search {
    position: absolute!important;
    top: 0!important;
    left: 0!important;
}
.vs__selected-options {
    min-height: 33px!important;
} */

#descargarExcel {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius);
    background-color: var(--main-blue-2);
    color: #333333;
    border: 0px solid transparent;
    font-size: 16px;
    width: 100%;
    text-decoration: none;
}

#descargarExcel i {
    margin-right: 0.5rem;
    font-size: 14px;
    line-height: 22px;
}

#botonesDocusign {
    display: flex;
    flex-direction: row;
}

#botonesDocusign a {
    padding: 0.5rem 1rem;
    background-color: var(--main-blue-2);
    color: #333333;
    border: 0px solid transparent;
    font-size: 16px;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 33%;
    text-decoration: none;
    transition: 0.3s ease-in-out;
    text-align: center;
}

#botonesDocusign a:first-of-type {
    border-top-left-radius: var(--border-radius);
    border-bottom-left-radius: var(--border-radius);
}

#botonesDocusign a:last-of-type {
    border-top-right-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
}

#botonesDocusign a:hover, #botonesDocusign a.active {
    background-color: var(--main-blue);
    color: white;
}

@media(max-width:767px) {
    #botonesDocusign {
        display: flex;
        flex-direction: column;
        margin-bottom: 1rem;
    }
    #botonesDocusign a {
        width: 100%;
    }
    #botonesDocusign a:first-of-type {        
        border-radius: 0;
        border-top-left-radius: var(--border-radius);
        border-top-right-radius: var(--border-radius);
    }
    
    #botonesDocusign a:last-of-type {
        border-radius: 0;
        border-bottom-left-radius: var(--border-radius);
        border-bottom-right-radius: var(--border-radius);
    }
}

@media(max-width:992px) {
    #descargarExcel span {
        display: none;
    }
}

#descargarExcel.downloadingExcelButton {
    pointer-events: none;
}

#descargarExcel .spinner-border {
    width: 1.2rem;
    height: 1.2rem;
}

#docs-tabs span.distributorName {
    font-size: small;
}