/* TYPOGRAPHY */
.h5-underline
{
    border-bottom: 2px solid lightgray;
}
.h4-underline
{
    background-color: whitesmoke;
    border-bottom: 2px solid black;
}
.p-underline {
    border-bottom: 2px solid lightgray;
}
/* BUTTONS */
.btn-rounded
{
    border-radius: 20px;
}
.btn-rounded:hover{
    color: #007BFF !important;
    background-color: aliceblue !important;
}
.btn-change-rounded
{
    font-weight: 400;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 15px !important;
    border-bottom-right-radius: 15px !important;
}
.btn-change-rounded:hover{
    color: #007BFF !important;
    background-color: aliceblue !important;
}
.input_group_profile {
    border-top-right-radius: 15px !important;
    border-bottom-right-radius: 15px !important;
}
.btn-trasparent {
    border: none;
    background-color: transparent;
    color: cornflowerblue;
    font-weight: 600;
    padding: 0px 0px;
    font-size: 12px;
}
/* MEDIA BORDER */
.border-profile {
    border: 2px solid cornflowerblue !important;
}
/* BADGE */
.badge-device {
    border: 2px solid cornflowerblue;
    display: block;
    font-weight: 200;
}
/* MODAL */
.modal .modal-top {
    position: absolute;
    margin: 0;
    width: 100%;
    max-width: 100%;
    border-radius: 0px !important;
}
.modal-header-top {
    justify-content: center;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    background-color: #3F729B;
    color: white;
    /* border-bottom: 2px solid black; */
    border-bottom: none;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.modal-header-outline {
    border: 1px solid #007BFF ; 
    /* background-color: #59698D !important; */
    color: #007BFF ;
    /* background-color: aliceblue ; */
    background-image: linear-gradient(to bottom right,aliceblue, whitesmoke);
    /* background-image: linear-gradient(to bottom right,aliceblue, #3F729B);
    color: white; */
    /* background-image: radial-gradient(aliceblue, whitesmoke, #3F729B); */
    margin: -1rem 1rem 1rem 1rem;
    /* border-bottom-left-radius: 30px; */
    /* border-top-left-radius: 30px; */
    /* border-bottom-right-radius: 30px; */
    /* border-top-right-radius: 30px; */
}

@media screen and (max-width: 960px) {
    /* .container {
        padding-right: 0px !important;
        padding-left: 0px !important;
    } */
    .col-8 {
        max-width: 83% !important;
        flex: 1 0 66.666667%;
    }
    .col-6 {
        padding-right: 4px;
        padding-left: 4px;
    }
    .jumbotron {
        padding: 4rem 0rem;
    }
    .navbar {
        display: inline;
    }
    #img_login {
        width: 340px;
        height: 250px;
    }
    .modal-lg {
        max-width: 730px;
    }
    #btn_logout {
        font-size: 9px;
        margin-left: 30%;
    }
}
@media screen and (max-width: 767px) {
    /* .container {
        padding-right: 0px !important;
        padding-left: 0px !important;
    } */
    .col-8 {
        max-width: 83% !important;
        flex: 1 0 66.666667%;
    }
    .col-6 {
        padding-right: 4px;
        padding-left: 4px;
    }
    .jumbotron {
        padding: 4rem 0rem;
    }
    .navbar {
        display: inline;
    }
    #img_login {
        width: 340px;
        height: 250px;
    }
    .modal-lg {
        max-width: 730px;
    }
    #btn_logout {
        font-size: 9px;
        margin-left: 4px;
    }
    .navbar-brand {
        display: none;
    }
    .h4, h4 {
        font-size: 0.8rem;
    }
    .badge {
        display: inline-block;
        padding: 0.52em .9em;
        font-size: 50%;
    }
    .col-5 {
        margin-left: 0px !important;
        margin-top: 0px !important;
    }
    .display-3 {
        font-size: 2.5rem;
    }
    .pl-5, .px-5 {
        padding-left: 4px !important;
    }
    .pr-5, .px-5 {
        padding-right: 4px !important;
    }
    #img_user {
        display: none !important;
    }
    #img_user {
        display: none !important;
    }
    #email_user_account {
        display: none !important;
    }
    .h6, h6 {
        font-size: 0.6rem;
    }
    .btn-group-sm > .btn, .btn-sm {
        padding: .10rem .3em;
        font-size: .575rem;
        line-height: 1.0;
        font-weight: 400 !important;
        text-align: left;
    }
    .input-group-text {
        padding: .20rem .4rem !important;
        line-height: 10px !important;
        width: 100% !important;
    }
    .font-weight-bold {
        font-weight: 600 !important;
    }
    button, input {
        line-height: 10px !important;
    }
    .input-group > .input-group-append > .btn, .input-group > .input-group-append  {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0px !important;
    }
    .w-50 {
        margin-left: 0px !important;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        width: 100% !important;
    }
}