label {
    font-weight:600 !important;
}

div.content.container {
    background-color: #fff !important;
    position:relative;
}

.psycalc-title {
    font-weight: bold;
    color: #00aeef; /*#2e86c5;*/
}

#div-col-about {
    max-width: 380px;
}


.image-div {
    margin-left: -1.2rem;
    height: calc(7vw);
    padding-right:0px;
}

    .image-div img {
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
    }

li.nav-item {
    margin-right:0.6rem !important;
    margin-left:0.6rem !important;
}

li.nav-item a i {
    margin-right:0.3rem !important;
}

div.input-group {
    width:100%;
    padding-top:1rem !important;
    padding-bottom:1rem !important;
}
div.input-group label {
    font-weight:600;
    width:100%;
}

.div-errors {
    width:100%;
}

.div-errors span {
    padding:3px;
    font-size:0.8rem;
}

span.required {
    color:red;
    padding-left:3px;
}

div.input-group[data-haserror='1'] input,
div.input-group[data-haserror='1'] textarea
{
    border-color: red !important;
    background-color: #ffe9ec !important;
}

div.input-group[data-haserror='0'] *[data-error='1'] {
    display:none !important;
}
div.input-group[data-haserror='1'] *[data-error='1'] {
    display: block !important;
}

#div-card-mainform {
    max-width: 480px;
    margin: 0 auto;
    box-shadow:-3px 4px 30px #888;
}


#div-col-mobiledevices {
    max-width: 340px;
    margin:0 auto;
}


.activity-page-title {
    margin-top:1rem;
}
    .activity-page-title i {
        margin-right: 0.5rem;
        font-size: 1.5rem;
    }



    #div-col-mobiledevices .row .col {
        background: #efefef;
        border: 1px solid #e1e1e1;
        height: auto;
        margin:0 auto;
        padding:1rem;
        border-radius:1em;
    }

#img-hand-phone {
    width: 150px;
    height: auto;
    position: absolute;
    left: 0px;
    top: 0px;
}
#img-psychroapp {
    width: 96px;
    height: auto;
    position: absolute;
    right: 10px;
    top: 0px;
}

#div-mobiledevices-images {
    position: relative;
    margin: 30px auto;
    height: 250px;
}

#googleplay-img {
    width: 130px;
    height: 53px;
}

#apple-img {
    width: 110px;
    margin-top: 7px;
    margin-right: 5px;
}

#mobile-devices-apps-div {
    width: 100%;
    margin: auto;
    text-align: center;
    display: flex;
    justify-content: space-between;
}

#div-col-form {
    margin-left:3rem;
}


#btn-download {
    padding: 1rem;
    font-size: 1.3rem;
    margin:0 auto;
}

    #btn-download i {
        margin-right: 0.8rem;

    }


/* ***************************** */
/* -------- HISTORY ------------ */
/* ***************************** */
.version-history-log {
    padding:2rem;
    background:#f1f1f1;
    margin-bottom:5rem;
    border:1px solid #c7c7c7;
    border-radius:0.5rem;
}
.version-history-log h2 {
    margin-bottom:0px;
}

#version-history-body .log-date {
    font-size: 0.8rem;
    font-style: italic;
}

.version-history-log p {
    margin-top:2rem;
}

#version-history-body hr {
    margin-bottom:4rem;
}




/* ************************************ */
/* -------------- HELP ---------------- */
/* ************************************ */
#help-sidebar .nav-link i {
    margin-right:0.2rem;
}


.help-page-title {
    font-size:2rem;
    width:100%;
}
.help-page-title i {
    font-size:1.8rem;
    margin-right:0.5rem;
}

#help-main-area hr {
    margin-bottom:0px !important;
}


.help-brief-description {
    font-size:1rem;
    font-weight:300;
    letter-spacing:-0.015rem;
}
.help-images {
    width:100%;
    margin-top:1rem;
    margin-bottom:2rem;
}

.help-image {
    display:none;
    margin:0 auto;
    max-width:100%;
}
.help-image.active {
    display:block;
}

.help-sections {
    padding:0.5rem;
    height:calc(100vh - 450px);
    overflow-y:scroll;
}

section.help-section {
    width: 100%;
    background: #f1f1f1;
    padding: 1.2rem;
    border-radius: 0.5rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    cursor: pointer;
    border:1px solid #cfcfcf;
}
.help-section:hover {
    box-shadow: -2px -2px 10px #888;
}

.help-section-title {
    font-weight: 600;
    color: #0480af;
}
.help-section-more {
    display:none;
}
.help-section-more-ol {
    font-size:0.8rem;
}
.help-section-more-ol strong {
    opacity:0.8 !important;
}
.help-section.active {
    background-color: #cbecf7 !important;
}

.help-li-img-click {
    margin-bottom:0.8rem;
    width:100%;
    min-height:38px;
}

.troubleshoot-section,
.troubleshoot-section.active {
    background: #ffe4e8 !important;
}

.troubleshoot-section .help-section-title {
    color:#990000 !important;
}

.help-section .highlighted {
    color: #0480af;
}
.troubleshoot-section .highlighted {
    color: #990000 !important
}

#main-search-area {
    width:100%;
    height:calc(100vh - 500px);
    overflow-y:scroll;
}


.search-item-page {
    width: 100%;
    margin: 1rem;
    padding: 0.5rem 0.5rem 1rem 1rem;
    border-bottom: 1px dotted #bbb;
    cursor: pointer;
}

.search-item-page a {
    text-decoration:none;
}

#main-search-area .search-item-page:first-child {
    border-top: 1px dotted #bbb;
    padding-top: 1rem;
}

.search-item-page a {
    color:#333;
}
.search-item-title {
    margin-bottom:5px;
}

.search-item-title i {
    font-size:1.5rem;
}


.search-item-page:hover {
    background-color: rgba(12,131,255, 0.1);
    color: rgb(12,131,255);
    box-shadow: -2px -1px 10px #888;
}
    .search-item-page:hover a {
        color: rgb(12,131,255);
    }


/* **************************************************** */
/* ---------------------- TERMS ----------------------- */
/* **************************************************** */
.term-item {
    width:100%;
    padding:2rem;
    margin:1rem 2rem;
    border-bottom:1px dotted #bbb;
}

.term-item-title {
    width: 100%;
    font-weight:600;
    font-size:1.1rem;
}
.term-item-body {
    width:100%;
    font-weight:400;
}

.term-item-screens {
    width:100%;
    display:flex;
    margin-top:1rem;
}

    .term-item-screens span {
        margin: 0rem 0.3rem;
        background-color: rgba(12,131,255, 0.1);
        font-size: 0.7rem;
        padding: 1px 6px;
        color: rgb(12,131,255);
    }

.term-item-screens span i {
    font-size:1.15rem;
    margin-right:0.2rem;
}




.btn-export-csv,
.btn-export-csv-remote {
    background:green;
    color:#fff;
}
    .btn-export-csv:hover,
    .btn-export-csv-remote:hover {
        background-color: #78ad78;
        color: #fff;
    }

.btn-excel {
    background:transparent !important;
    color:green;
    border:none !important;
}


.mr-2 {
    margin-right:0.3rem;
}
.mr-1 {
    margin-right:0.18rem;
}
.ml-2 {
    margin-left: 0.3rem;
}

.ml-1 {
    margin-left: 0.18rem;
}

/* **************************************************** */
@media only screen and (max-width:1400px) {
    #div-col-form {
        margin-left: 0rem;
    }
}

@media only screen and (max-width:990px) {
    #div-col-mobiledevices {

        margin:3rem auto;
    }
    #div-col-form {
        margin-left: 0rem;
    }
    #btn-download {
        margin-top:3rem;
        font-size:1rem;
    }

}

@media only screen and (max-width:767px) {
    #div-col-about {
        max-width: 380px;
        margin: 0 auto;
    }

    #div-col-form {
        margin: 3rem auto;
    }
    #btn-download {
        font-size: 1rem;
    }
}

@media only screen and (max-width:575px) {
    #div-col-about {
        max-width: 380px;
        margin: 0 auto;
    }

    li.nav-item {
        transform:scale(0.8);
        margin-right:0.1rem !important;
        margin-left:0.1rem !important;
    }
    #btn-download {
        font-size: 1rem;
    }

    #div-col-form {
        width: 100%;
        margin: 4rem auto 2rem auto;
    }
    #div-col-mobiledevices {
        margin: 1.5rem auto;
    }
}


#modal-activity-login label {
    font-weight:bold;
    width:100%;
}

#modal-activity-login .input-group {
    
}

#modal-activity-login .label-checkbox {
    width: 100%;
    display: flex;
}

#modal-activity-login .label-checkbox input {
    margin-right:5px;
}

#error-login-block {
    display:none;
}

#error-login-block div {
    font-weight:bold;
    width:100%;
}

.btn-info-popover {
    transform:scale(0.7) !important;
    padding:0px !important;
}