@charset "utf-8";
.jumbotron { margin-top: 20px; }

html, body {
    height: 100%;
    /* The html and body elements cannot have any padding or margin. */
}

.form-group.required .control-label:after { 
    content: "*"; 
    color: red;
}

#show_products {
    height: 360px;
    overflow-y: scroll;
}
#list_products ul {
    height: 360px;
    overflow-y: scroll;
    border: 1px solid #ddd;
    margin: 0;
    list-style-type: none;
}
#products { 
    margin-top: 20px !important;
    height: 310px !important;
    overflow-y: scroll; 
}
#list_products a:hover {
    text-decoration: none;
    background: #ccc;
}
#list_products a:active {
    text-decoration: none;
    background: #ccc !important;
}

.check {
    background: url(../images/check1.png) no-repeat 2% center;
    padding-left: 30px;
}
.checked_style {
    background: url(../images/checked2.png) no-repeat 2% center;
    color: #11a5f2;
    padding-left: 30px;
}
.check2 {
    background: url(../images/check1.png) no-repeat center;
}
.product_selected {
    color: #11a5f2;
}
.product_selected_style {
    background: url(../images/checked2.png) no-repeat center;
}

#prod_choose_history li { list-style-type: none; display: inline-block; width: 25%; float: left; }

.select2-container .select2-selection--single { 
    height: 36px;
}    

.select2 {
    width:100%!important;
}

.custom-control-label::before, 
.custom-control-label::after {
    top: .8rem;
    width: 1.25rem;
    height: 1.25rem;
}

.ias-noneleft { text-align: left !important; padding: 20px 0 0 10px; color: #ccc; }

#pswd_info {
    position:relative;
    width:300px;
    padding:15px;
    margin-top: 10px;
    background:#fefefe;
    font-size:14px;
    border-radius:5px;
    box-shadow:0 1px 3px #ccc;
    border:1px solid #ddd;
    display:none;
}
#pswd_info h4 {
    font-size: 14px;
    margin:0 0 10px 0;
    padding:0;
    font-weight:normal;
}
#pswd_info::before {
    content: "\25B2";
    position:absolute;
    top:-12px;
    left:45%;
    font-size:14px;
    line-height:14px;
    color:#ddd;
    text-shadow:none;
    display:block;
}
.pswd_invalid {
    padding-left:22px;
    line-height:24px;
    color:#ec3f41;
}
.pswd_valid {
    padding-left:22px;
    line-height:24px;
    color:#3a7d34;
}

/* highlight results */
.ui-autocomplete span.hl_results {
    color: #CC0000;
}

.ui-state-active, .ui-menu-item a:hover { background: transparent !important; border: 0 !important; color: #6c757d !important; }

/* loading - the AJAX indicator */
.ui-autocomplete-loading {
    background: white url('../images/ui-anim_basic_16x16.gif') right center no-repeat;
}

/* scroll results */
.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding for vertical scrollbar */
    padding-right: 5px;
}

.ui-autocomplete li {
    font-size: 16px;
}

/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 250px;
}

label:not(.form-check-label):not(.custom-file-label), .form-check-label {
    padding-top: 6px;
} 

.form-check-label {
    font-weight: 700;
    padding-top: 6px;
} 

.form-check-input {
    padding-top: 6px !important;
    margin-right: 6px;
    position: relative;
} 

.avatar-upload {
    position: relative;
    margin-bottom: 15px;
}    
.avatar-edit {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    margin: 0;
    border: 1px solid #ccc;
}
.avatar-edit input {
    display: none;
}        
.avatar-edit label {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin-top: 0;
    margin-bottom: 0;
    background: none;
    border: 1px solid transparent;
    /*box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);*/
    cursor: pointer;
    font-weight: normal;
    transition: all .2s ease-in-out;
    text-align: center;
    font-size: 26px;
}
.avatar-edit label span {
    position: absolute; 
    top: 35%;
    left: 30%;
}
.avatar-preview {
    width: 100%;
    height: 192px;
    position: relative;
    /*border-radius: 100%;*/ 
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}    
.avatar-preview > div {
    width: 100%;
    height: 100%;
    /*border-radius: 100%;*/
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.form-inline > .input-group { margin-right: 5px; }
