@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700');
/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 50px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    font-family: 'Source Sans Pro', sans-serif;
}

/* Modal Content */
.modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.close {
    color: #0e0e0e;
    float: right;
    font-size: 60px;
    font-weight: bold;
    display: block;
    /* width: 100%; */
    text-align: right;
    position: absolute;
    right: 24px;
    top:0;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

._filtered_images{
  width: 100%;
  overflow-x: scroll;
  /* background: #ccc; */
  white-space: nowrap;
  position: relative;
  padding: 0;
}

._arrow_left{
    position:absolute;
    left:0;
    top:50%;
    z-index: 999999;
}

._arrow_right{
  position:absolute;
  right:0;
  top:50%;
  z-index: 999999;
}


ul._filtered_images li{
    width:auto;
    display: inline-block;
}
ul._main_filters li span.badge-light:hover{
background-color: #5194dc;
color:#fff!important;
}

.badge-light {
  color: #212529;
  background-color: #e8e6e6;
  border: 1px solid #ddd;
  padding: 5px!important;
}
._res_json{
  margin-bottom:10px;
  margin-top:10px;  
  padding:15px;
  max-height: 650px;
}

._res_json img{
padding: 10px;
display: block;
max-width: 100%;
/* margin-bottom: 10px; */
margin: 1px auto;
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.1);
  box-shadow: 0 0 5px rgba(0,0,0,.1);
  border: 3px solid #fff;
  margin-bottom: 5px;
  height: 350px;
}

.childnodes{
    text-transform: capitalize;
}

.img_placeholder{
max-width: 330px;
height: 352px;
text-align: center;
}

._button_pos{
  position: absolute;
  top: 332px;
  left: 34px;
}

._img_preview{
  border:1px solid #ddd;
  border-radius: 20px;
  margin-bottom:10px;
}

._in_middle{
  position: absolute;
  top: 43%;
  width: 79%;
  height: 19px;
  opacity: 0.8;
}
._filters_head,._sub_head{
    font-size:16px;
}
ul._main_filters {
    padding: 0;
}

.modal-content p{
    padding:0;
    margin:0;
}

/* width */
::-webkit-scrollbar {
  height:5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}


.visual_dialog{
    font-weight:500!important;
    margin:0!important;
    font-size:30px;
}

._arrow_left,._arrow_right{
    font-size: 20px;
}

.btn_plugin.btn-dark {
    color: #fff;
    background-color: #343a40;
    border-color: #343a40;
}

.btn_plugin.btn-reset{
    display: inline-block;
    height: 25px;
    padding: 3px;
    font-size: 12px;
    margin-left: 1%;

    color: #fff;
    background-color: #FF5722;
    border-color: #FF5722;
}

.btn_plugin {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}