/* Added by Sunil Patel on date of 26-07-2021 for global style sheet */

/* Custome Checkbox for Grid Data to show Active or InActive */
/* The container */
.visible { display : block; }
.hidden { display : none; }
.hideCol { display:none; }

.container-checkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.container-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.container-checkbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 15px;
    width: 15px;
    background-color: #eee;
    border-radius : 20%;
}

/* On mouse-over, add a grey background color */
.container-checkbox:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container-checkbox input:checked ~ .checkmark {
    background-color: #007bff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.container-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container-checkbox input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.container-checkbox .checkmark:after {
    left: 6px;
    top: 3px;
    width: 4px;
    height: 8px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/* The container */
.container-radio {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.container-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.container-radio .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container-radio:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container-radio input:checked ~ .checkmark {
    background-color: #007bff;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.container-radio .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.container-radio input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.container-radio .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

/* for datatable */
.table thead tr th { background: #6c757d !important; color: white !important; min-width:50px;  }
.left-col { float: left; width: 70%; } 
.right-col { float: right; width: 30%; }


/* select 2 css for all dropdown */
 
.select2-container{
    width:100%!important;
}
   
.form-filter-width {
    width: 100%!important;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    outline: none;
    border-color: #1A92CF;
}
.select2-selection__rendered{
    height:38px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered:focus,
.select2-container--default .select2-selection--single:focus{
    outline: none;
    border:1px solid #1a92cf;
}

/*Media Query*/
@media (max-width:1439px)
{
    .select2-container--default .select2-selection--single .select2-selection__rendered,
    .tabs-animated .nav-link,.inquire-btn{ font-size: 12px; }     
}

.flex {
    display: contents;
    flex-wrap: wrap;
    /*justify-content: center;
    align-items: center;*/
}

#loadMore {
    width: 200px;
    color: #fff;
    display: block;
    text-align: center;
    margin: 20px auto;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid transparent;
    background-color: var(--mdc-theme-primary);
    transition: .3s;
}

    #loadMore:hover {
        color: var(--mdc-theme-primary);
        background-color: #fff;
        border: 1px solid var(--mdc-theme-primary);
        text-decoration: none;
    }

.noContent {
    color: #000 !important;
    background-color: transparent !important;
    pointer-events: none;
}

/*.content {*/
    /*text-align: center;
    font-size: 1.5em;
    color: #fff;
    letter-spacing: 2px;
    font-weight: 700;
    text-transform: uppercase;*/
    /*animation: blur .7s ease-out;
    text-shadow: 0px 0px 5px #fff, 0px 0px 7px #fff;
}*/

.content {
    /*height: 100px;
    width: 45%;
    color: #fff;
    font-size: 24px;
    line-height: 100px;  centering text just for view 
    text-align: center;
    background-color: grey;
    margin: 5px;
    border: 1px solid lightgrey; -*/
    /*display: none;*/
}