﻿.form-control-sm{
    display: block;
    width: 100%;
    height: 34px;
    padding: 3px 6px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    border-radius: 2px;
    box-shadow: none;
    border-color: #d2d6de;
}
.PopParentDiv {
    position: fixed;
    display:none;
    /*margin-top: 10%;*/
    overflow: auto;
    font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    background:rgba(0,0,0,0.1);
    padding: 0;
    border: 1px solid #888;
    z-index: 1051; /* Sit on top */ 
    width: 100%;
    height: 100%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}
#myAlert .card {
    background:white;
    color:rgb(0,0,0);
    width:24%;
     border-radius:3px 5px 3px 5px;
    margin:auto;
    margin-top:20%;
   /*// border-radius:3px 5px;*/
}
#myAlert .card-header{
    
    background:rgba(12, 67, 88, 0.99);
    border-radius:3px 5px 0px 0px;
    color:rgba(245, 245, 245, 0.89);
    padding:4px 6px;

}
#myAlert .card-body{
  
  min-height:110px;
  padding:2px 10px;
   border-radius:3px 5px 3px 5px;
}
#myAlert .card-body p{
  
  margin-top:10px;
  padding:2px 10px;
  text-align:left; 
}
#myAlert .card-footer{
  padding:2px 4px;
  text-align:center;
  border-radius:0px 0px 3px 5px;
background-color:rgba(12, 67, 88, 0.99);
}

.PopDiv {
    position: fixed;
    /*margin-top: 10%;*/
    overflow: auto;
    top:8%;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    z-index: 1; /* Sit on top */ 
    width: 80%;
    height: 75%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}

.optionAvi{
    color:rgba(25, 145, 29, 0.84);
}
.optionNAvi{
    color:rgba(255, 106, 0, 0.92);
}

/* The customcheck */
.customcheck {
    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 */
.customcheck input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.customcheck:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.customcheck input:checked ~ .checkmark {
    background-color: #02cf32;
    border-radius: 5px;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.customcheck input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.customcheck .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed;
    z-index: 19; /* Sit on top */
    /*padding-top: 100px; /* Location of the box
    left: 100px;*/
    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 */
}
.modal-content{
    height:98%;
    width:96%;
    margin:auto; 
    /*margin-left:12.5%*/
}
.modal-content_Mobi{
    height:90%;
    width:95%;
    margin:auto; 
}


.MygridS {
font-size: 12px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.myScroll::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	background-color: #F5F5F5;
	border-radius: 10px;
}

.myScroll::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

.myScroll::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: #FFF;
	background-image: -webkit-gradient(linear,
									   40% 0%,
									   75% 84%,
									   from(#4D9C41),
									   to(#19911D),
									   color-stop(.6,#54DE5D))
}
.scrollbar
{
	/*margin-left: 30px;*/
	float: left;
	height:auto;
    max-height:300px;
	width: 65px;
	background: #F5F5F5;
	overflow-y: scroll;
	margin-bottom: 25px;
}



.frmBTN {

}
.frmBTN input{
float:right;
margin:10px 10px 20px 30px;
}
.frmBTN a{
float:right;
margin:10px 10px 20px 30px;
}

.popup {
  background:#ff006e;
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin:auto;
    width:70%;
}

/* The actual popup */
.popup .popuptext {
    visibility: hidden;
    width: 860px;
    height: 500px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: fixed;
    z-index: 1;
    bottom:20%;
    margin:auto;
    left:20%;
}

/* Popup arrow */
.popup .popuptext::after {
    content: "";
    position: absolute;
    /*top: 100%;
    left: 50%;*/
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

/* Toggle this class - hide and show the popup */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}
.custom-select {
 padding:5px 10px;
 width:100%;
 border-radius:3px;
 color:#000;
 min-width:100px;
}
.customselect {

}

table#stickyHeader thead {
 border-top: none;
 border-bottom: none;
 background-color: #FFF;
}

.scrollmenu {

   overflow: auto;
   white-space: nowrap;
}
/*.scrollmenu a {
   display: inline-block;
   color: white;
   text-align: center;
   padding: 14px;
   text-decoration: none;
}

.scrollmenu a:hover {
   background-color: #777;
}*/
.scrollmenu::-webkit-scrollbar-track {
       -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
       background-color: #F5F5F5;
       border-radius: 10px;
   }

 .scrollmenu::-webkit-scrollbar {
       width: 10px;
       background-color: #F5F5F5;
   }

  .scrollmenu::-webkit-scrollbar-thumb {
       border-radius: 10px;
       background-color: #FFF;
       background-image: -webkit-gradient(linear, 40% 0%, 75% 84%, from(rgba(12, 67, 88, 0.99)), to(rgba(12, 67, 88, 0.60)), color-stop(.6,rgba(255, 255, 255, 0.39)));
   }


/*------------------------------------------------------------------*/

  .table-scroll {
 position:relative;

 margin:auto;


}
.table-wrap {
 width:100%;

}
.table-scroll table {
 width:100%;
 margin:auto;
 border-collapse:separate;
 border-spacing:0;
}
.table-scroll th, .table-scroll td {
 padding:5px 10px;
 white-space:nowrap;
 vertical-align:top;
}
.table-scroll thead, .table-scroll tfoot {
 background:#f9f9f9;
}
.clone {
 position:absolute;
 top:0;
 left:0;
 pointer-events:none;
}
.clone th, .clone td {
 visibility:hidden
}
.clone td, .clone th {
 border-color:transparent
}
.clone tbody th {
 visibility:visible;
 color:red;
}
.clone .fixed-side {
 border:1px solid #000;
 background:#eee;
 visibility:visible;
}
.clone thead, .clone tfoot{background:transparent;}


