/*!
 * Base CSS
 */
 @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');
 body {font-family: 'Roboto', sans-serif;background:url(../images/background.jpg) no-repeat; background-attachment: fixed; background-size:100% 100%;}
 html {position: relative; min-height: 100%;}
 body {margin: 0 0 0px; height: 100%}
 a { outline: none; }
 a:active, a:focus{text-decoration: none;}
 :focus{outline: 0;}
 
 @keyframes blink{
0%{opacity: 0;}
50%{opacity: .5;}
100%{opacity: 1;}
}
 
 /* Custome Common Alignemnt */
 button i{margin-right: 5px;}
 .col-center{ float: none; margin: 0 auto; }
 .green_button_filter{background:rgba(51,248,7,0.9); border-radius:3px; font-size: 14px; border: none; color:#000;}
 .green_button_filter:hover:enabled{ border: none; outline: none; background:rgba(51,248,7,1);}
 .green_button_filter:focus:enabled{border: none; background:rgba(51,248,7,1); box-shadow: 0 0 5px rgb(255, 255, 255);}
 .green_button_plot{background:rgba(51,248,7,0.9); padding:6px 20px 4px 20px; border-radius:5px; font-size: 16px; border: none; color:#000;}
 .green_button_plot:hover:enabled{ border: none; outline: none; background:rgba(51,248,7,1);}
 .green_button_plot:focus:enabled{border: none; background:rgba(51,248,7,1); box-shadow: 0 0 5px rgb(255, 255, 255);}
 .green_button{background:rgba(51,248,7,0.9); padding:6px 20px 4px 20px; border-radius:5px; font-size: 16px; border: none; text-transform: uppercase; color:#000;}
 .green_button:hover:enabled{ border: none; outline: none; background:rgba(51,248,7,1);}
 .green_button:focus:enabled{border: none; background:rgba(51,248,7,1); box-shadow: 0 0 5px rgb(255, 255, 255);}
 .Litgreen_button{background:rgba(51,248,7,1); padding:6px 12px; border-radius:4px; font-size: 13px; border: none; text-transform: uppercase; color:#000;}
 .Litgreen_button:hover:enabled{background:#33f807; border: none; outline: none;}
 .Litgreen_button:focus:enabled{border: none; box-shadow: 0 0 5px rgb(255, 255, 255);}
 .Red_button{background:#c9302c; padding:5px 12px; border-radius:5px; font-size: 16px; border: none; text-transform: uppercase; color:#F2F2F2;}
 .Red_button:hover{ border: none; outline: none; opacity: 0.8;}
 .Red_button:focus{border: none; box-shadow: 0 0 5px rgb(255, 255, 255);}
 .Gray_button, .modal-dialog button.Gray_button{background:#555; padding:6px 20px 4px 20px; border-radius:5px; font-size: 16px; border: none; text-transform: uppercase; color:#fff;}
 .Gray_button:hover, .modal-dialog button.Gray_button:hover{ border: none; outline: none; opacity: 0.8;}
 .Gray_button:focus, .modal-dialog button.Gray_button:focus{border: none; box-shadow: 0 0 5px rgb(255, 255, 255);}
 .error{color:#da4c4c; font-size: 12px; position: relative; top: 5px;}
 .required_legend{color: #33F807; font-size: 10px; display: inline-block; position: relative; text-align: left;}
 body .mt-5{margin-top: 5px;} body .mt-10{margin-top: 10px;} body .mt-15{margin-top: 15px;} body .mt-20{margin-top: 20px;}
 body .mb-5{margin-bottom: 5px;} body .mb-10{margin-bottom: 10px;} .mb-15{margin-bottom: 15px;} .mb-20{margin-bottom: 20px;}
 body .mr-5{margin-right: 5px;} .mr-10{margin-right: 10px;} .mr-15{margin-right: 15px;} .mr-20{margin-right: 20px;}
 body .ml-5{margin-left: 5px;} .ml-10{margin-left: 10px;} .ml-15{margin-left: 15px;} .ml-20{margin-left: 20px;}
 .loading{text-align:center; width: 100%; color:#fff; font-size: 12px; position: absolute; top:25%;}
 .group_btn button{ margin-right: 10px; }
 .DatePicker{position: relative;}
 input.TitleDatePicker.form-control{color:#AAAAAA; border:none; width: 185px;}
 input:-webkit-autofill {background-color: transparent !important;}
 .DatePicker::after{content: "\f073" ;font-family:"FontAwesome"; color:#33F807; position: absolute; right: 15px; top: 5px;}
  body input:disabled, body button:disabled{opacity: 0.4; cursor: not-allowed;}
  body input:disabled:hover, body button:disabled:hover{opacity:0.4;}
 
 select {-webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer; padding-right: 25px;  font-family: 'Roboto', sans-serif; color: #AAAAAA; }
 select option{color:#e2e2e2; font-size: 13px; background-color: #232323;}
 .SelectWrap{position: relative;}
 .SelectWrap:after {content:"\f0dd"; font-family: "FontAwesome"; position: absolute; color:#33F807; right:8px; top:2px;}
 .SelectWrap select{position: relative; z-index: 5; padding-right: 22px;}
 select::-ms-expand {display: none;}
 
 .SelectWrap select[disabled]{background: rgba(0,0,0,0.8); opacity: 0.5;} 
 
 .checkbox_wrap { display: block; position: relative; padding-left: 20px; margin-bottom: 5px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height:20px; width:100%; color: #999999; font-size: 12px; font-weight: 200; text-transform: uppercase; line-height: 15px;}
 .checkbox_wrap input, .checkbox_wrap input[disabled],.checkbox_wrap input[disabled]:hover {position: absolute; opacity: 0;}
 .checkbox_wrap input[disabled] ~ .checkmark { cursor: not-allowed; opacity: 0.3;}
 .checkbox_wrap:hover input[disabled] ~ .checkmark{ background-color: #999;}
 .checkmark {position: absolute; top: 0; left: 0; height: 14px; width: 13px; background-color: #999; }
 .checkbox_wrap:hover input ~ .checkmark { background-color: #ccc;}
 .checkbox_wrap input:checked ~ .checkmark { background-color: #33f807;}
 .checkmark:after { content: ""; position: absolute; display: none; }
 .checkbox_wrap input:checked ~ .checkmark:after {display: block; }
 .checkbox_wrap .checkmark:after { left: 4px; top: 1px; width: 6px; height: 10px; border: solid #1c1c1c; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
 
 .page_alert{position:fixed; height:100%; width:100%; top:0; bottom:0; text-align:center; background:rgba(0,0,0,0.8); z-index:10000;}
 .alert_wrap{width:20%; background:#2f2f2f; top:40%; position:relative; margin:0 auto; padding:20px 10px; border-radius:5px; color:#fff;}
 .alert-btn{padding:2px 20px; margin-top:15px}
 .popup_alert{position:fixed; height:100%; width:100%; top:0; bottom:0; text-align:center; background:rgba(0,0,0,0.8); z-index:10000;}
 .popup_alert_wrap{height:60%; width:60%; background:white; top:20%; position:relative;  padding:20px 10px; border-radius:5px; color:#fff;}
 .card{background:#181818;}
 .card-header{color:#00FE00; font-size: 15px; padding:10px 15px; border-bottom: 1px solid #000000;}
 .card-body{color:#AAAAAA; font-size: 13px; padding:10px 20px;}
 .card-list{margin:0; padding:0; list-style: none;}
 .card-list li{ padding-bottom: 3px; display: inline-block; width: 100%;}
 .card-list li + li{ padding-top: 8px; border-top:1px solid #252525;}
 .card-list li:last-child{padding-bottom:0;}
 .plot-list{margin:0; padding:0; list-style: none;}
 .plot-list tr td{ padding-bottom: 3px; display: inline-block; width: 100%;}
 .plot-list tr + td{ padding-top: 8px; border-top:1px solid #252525;}
 .plot-list tr td :last-child{padding-bottom:0;}
 
 .LeftPanel{position: fixed; top: 0; left: 0; margin:0; padding:0; bottom:0; display: flex; overflow-x: hidden; overflow-y: auto;-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; background:#000000;}
 .LeftPanel li{list-style: none; width: 200px;  cursor: pointer;}
 .LeftPanel li a{padding: 15px 15px; display: inline-block; width: 100%; color:#ffffff;     font-size: 14px;}
 .LeftPanel li + li{border-top: 1px solid #333333; }
 .LeftPanel li a:hover{background:#141414; text-decoration: none;}
 .LeftPanel li.active a{color:#33F807; background:#141414;}
 .LeftPanel li.BrandLogo{text-align: center; padding: 0px 0 11px 0; border:none;}
 .LeftPanel li.BrandLogo img{width: 140px;}
 .LeftPanel li.BrandLogo a:hover{background:none;}
 .LeftPanel>li.dropdown>a::after { float: right; content: '\f107'; font-family: 'FontAwesome'; color:#33F807;}
 .LeftPanel>li.dropdown>a.collapsed::after {content: '\f105'; color:#AAAAAA;}
 ul.subDropdown{font-size: 13px; padding: 0}
 ul.subDropdown>li>a{padding-left: 40px;}
 
 .main_header{padding-left: 200px; position: fixed; width: 100%; height: 40px; background: #0f0f0f; z-index: 10; border-bottom: 2px solid #1c1c1c;}
 .main-sidebars{z-index: 11; position: relative;}
 
 .top_notify_panel .dropdown-menu{background:#4be14a; top:33px;     margin-right: -5px; padding:7px;  text-align:center; min-width:200px;  border-radius: 5px !important;  }
 
 .full_wrapper{width: 100%; display: inline-block; height: 100%; background:#232323; margin:0 auto; position: relative;}
 
 .fixed_top{position: fixed; top: 0; right: 0; left: 0; z-index: 1030; padding: .5rem 1rem; background:#101010;}
 .top_bar{  overflow: hidden; height: 40px; padding:0 15px 0 260px; z-index: 5; width: 100%; right: 0; overflow: visible;}
 .top_notify_panel{list-style: none; margin-top: 10px; padding: 0;}
 .top_notify_panel li{margin:0 10px;}
 #NoficationDrop, #SettingDrop{font-size: 18px; color:#33F807;     text-decoration: none;     cursor: pointer;}
 #TopUserName{ color:#fff; font-style: italic; font-size:12px; padding:0; margin:0; display: inline-block;}
 #TopUserName:hover{text-decoration: none;}
 #TopUserName div{display: inline-block; overflow: hidden;}
 #TopUserName div.UserName{ color: #33F807;display: inline-block;padding: 0 7px 0 3px;max-width: 110px;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
 #TopUserName i{vertical-align: top;
    position: relative;
    top: 2px;
    right: 2px;
    cursor: pointer;
    color: #4BE14B;
    font-size: 16px;}
 .Search{     margin-top: -40px;    z-index: 99;    position: relative; }
 .Search input{ background:none; border:none; color: #AAAAAA; font-size:12px; padding: 10px; width: 45%;     float: left;     font-family: FontAwesome, 'Roboto', sans-serif;}
 .Search select{ background:none; border:none; color: #AAAAAA; font-size:12px; padding: 10px; width: 40%;     float: left;}
 .Search input:placeholder{color:#AAAAAA; font-style: italic;}
 .Search button{background:none; border:none; color:#33F807;  padding: 0;     margin: 4px 0 0 0; float:left; font-weight: normal; font-size: 17px;}
 .Search button:hover{opacity: 0.8;}
 .SearchBar{ height: 0;     float: left;}
 .SearchBar, .RitTxt{width: 50%; display: inline-block; padding: 0 15px;}
 .RitTxt{width: 55%;}
 
 .content_wrapper{ margin: 40px 0 40px 200px; transition: 0.5s ease all; }
 .Content{ display: inline-block; width: 100%; padding: 20px 25px 13px 25px; background:#232323;}
 .TitleBar{background:#1c1c1c; padding:0 15px 0 25px; height: 40px; width:100%; display: inline-block; }
 h2.PageTitle{font-size: 15px; color: #fff; margin: 11px 0; width: 45%; display: inline-block; vertical-align: top;  transition: 0.5s ease all;}
 .plotTitle{font-size: 13px; color: #fff; margin: 11px 0; width: 45%; display: inline-block; vertical-align: top;  transition: 0.5s ease all;}
 .TitleRit{width: 54%; display: inline-block;  transition: 0.5s ease all;}
 .Bulk_upp{line-height: 18px; margin-top: 3px;}
  
 #navbarResponsiveBtn{display: none;}
 
 .DummyContent{width: 100%; height: 400px; text-align: center; color:#fff; font-size: 13px; padding-top: 15%;}
 
 /* Boostrap Override classes */
 .form-group{margin-bottom: 30px;}
 .control-label{color:#e8e8e8; font-size: 14px; font-weight: 200;  margin-bottom: 0;}
 .control-label-new{color:#e8e8e8; font-size: 14px; font-weight: 200;   }
 .form-control{border: none; border-bottom: 0.8px solid #33f807; color: #fff;     font-family: arial; font-size: 14px;  background: transparent; border-radius: 0; padding:0; -webkit-transition : border 500ms ease-out; transition : border 500ms ease-out;box-shadow: none;}
 .form-control:focus{ box-shadow: none;  border-bottom: 1px solid #a94911;    background-color:transparent;   }
 .form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */color: #757575;}
 .form-control::-moz-placeholder { /* Firefox 19+ */color: #757575;}
 .form-control:-ms-input-placeholder { /* IE 10+ */ color: #757575;}
 .form-control:-moz-placeholder { /* Firefox 18- */ color: #757575;}
 .selectPlaceholder{ color: #757575;}
 .form-group.required label:after{ content:'*'; color:#33F807; padding-left: 5px; font-size: 10px; }
 
 
 .login-page{width:100%; position: absolute; display: inline-block; text-align: center; height: 100%;}
 .login-logo{position: relative; height: 70px;     top: 36%; width: 100%; display: inline-block;}
 .login-wrapper{background:#232323; width:80%; position:relative; display: inline-block; top:15%; -webkit-box-shadow: 0px 0px 7px 4px rgba(15,15,15,1); -moz-box-shadow: 0px 0px 7px 4px rgba(15,15,15,1); box-shadow: 0px 0px 7px 4px rgba(15,15,15,1); text-align: left;}
 .login-left{background:url(../images/login_background.jpg) bottom right no-repeat #000000; width:30%; display: inline-block; text-align:center; font-weight: 300;      height: 100%;   position: absolute;}
 .login-welcome-note{ font-size: 13px; color:#AAAAAA; margin-top: 25px; display: inline-block; width: 100%; padding:0 15px;}
 .login-welcome-note h1{ font-size: 20px; color:#BBBBBB; font-weight: 300; margin-bottom: 15px;}
 .login-right{width: 69%;     min-height: 325px; display: inline-block; vertical-align: top; padding: 20px 0;     margin-left: 30%; position: relative;  overflow: hidden;}
 .SignupSection, .LoginSection{ width: 100%; position: absolute; padding:0 20px; display:none;}
 .SignupSection{right: -100%;}
 .LoginSection{left: -100%;}
 .SignupSection.LSActive{ right: 0; display: inline-block; position: relative;} 
 .LoginSection.LSActive{left: 0; top: 0; position: relative; display: inline-block;}
 
 .ScreenTitle{width: atuo; padding:0; color:#BBBBBB; font-size: 20px; font-weight: 300; margin-top: 7px; line-height: 10px; text-transform: uppercase; display: inline-block;}
 .ScreenTitle span{width: 80%; display: inline-block; border-top: 1px solid #000000;}
 .Link_LoginSignup{color:#4D4D4D; text-decoration: none; text-transform: uppercase; font-size: 12px; cursor: pointer;}
 .Link_LoginSignup.active{color: #33F807;}
 .Link_LoginSignup.active:hover{text-decoration: none;}
 .Link_LoginSignup:hover, .Link_LoginSignup:focus{text-decoration: underline; color: #33F807;}
 .Login_form{ margin-top: 6%; }
 .login_buttons{position: relative;}
 
 .buttonInLink{background:none; border: none;}
 .forgot_pwd_link{color:#999999; cursor: pointer; position: relative; top: 11px; font-size: 11px; text-transform: uppercase; float: right; margin-bottom: 20px;}
 .forgot_pwd_link:hover, .forgot_pwd_link:focus{color:#4BE14B; }
 .ForgotPwd.ForgotPwdActive{bottom: -120%; position: absolute; display: none; transition:0.7s ease all;}
 .ForgotPwd{ padding: 0 20px; bottom:0; position: relative;  transition:0.7s ease all; display: inline-block; width: 100%;}
 .LoginSection.LSActive.ForgotPwdActive{top: -150%; position: absolute; display: none; }
 .Forgotpwdwraper{margin-top: 8%; }
 #reg-form{margin-top: 3%;}
 
 .ThankMsg{ text-align: center; }
 .ThakWrap{display: inline-block; font-size:13px; color:#999999; margin-top: 80px;}
 .ThakWrap i{font-size: 45px; color:#999999;}
 .ThakWrap h2{font-size: 15px; color:#33F807;}
 .ThakWrap p span{color:#33F807; display: inline-block;}
 
 /*Dashboard css */
 .row-hit-180 .card-body{height:180px; overflow: auto;}
 .row-hit-230 .card-body{height:230px; overflow: auto;}
 .TxtWithEllips{width:63%; display:inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
 .SignatureStatus{display:inline-block; float:right; font-size: 12px; font-style: italic;}
 .SignatureStatus.Available{color:#33F807;}
 .SignatureStatus.InProgress{color:#AAAAAA;}
 .SignatureStatus.InsuffData{color:#C1272D;}
 .ProductHeading{ color:#AAAAAA; font-size: 13px; font-weight: 600; margin:4px 0 2px 0; padding: 0;}
 .ProductRating{color:#33F807; font-weight:600;}
 .ScandProd{color:#808080; display: inline-block; margin-bottom: 3px;}
 .ProductIdicator{ color:#F2F2F2; font-size: 11px; padding: 2px 10px; display: inline-block; float: right; border-radius: 4px; margin-top: 8px;}
 #product_genuine .ProductIdicator{background:#39B54A;}
 #product_counterfeit .ProductIdicator{background:#C1272D;}
 #product_genuine .ProductGenuine{color:#39B54A;}
 #product_counterfeit .ProductGenuine{color:#C1272D;}
 
 /*Table Grid View */
 .Custom_Grid.table-striped>tbody>tr>td.Checkbox_td{padding: 3px 0 0 5px;}
 .Custom_Grid.table-striped>tbody>tr>td.Checkbox_td .checkbox_wrap{padding: 0; margin:0; display: inline-block; width: 12px; height: 12px;}
 .Custom_Grid.table-striped>tbody>tr>td.Checkbox_td .checkbox_wrap .checkmark{width:12px; height: 12px;}
 .Custom_Grid.table-striped>tbody>tr>td.Checkbox_td .checkbox_wrap .checkmark:after{left: 3px; top: 0px; width: 6px; height: 10px;}
 .Custom_Grid th, .Custom_Grid th a{color:#858585;}
 .Custom_Grid th a:hover{text-decoration: none; color:#48d84b;}
 .Custom_Grid.table-striped>thead>tr>th{padding-left: 0;}
 .Custom_Grid.table-striped>tbody>tr{background-color: #0f0f0f; color:#fff; font-size: 13;}
 .Custom_Grid.table-striped>tbody>tr:nth-of-type(odd){background-color: #191919;}
 .Custom_Grid.table-striped>tbody>tr>td{border-top: 2px solid #222222;     padding: 10px 5px 8px 5px; vertical-align: middle;}
 .Custom_Grid.table>tfoot>tr>td{border:none; padding: 0;}
 .Custom_Grid.table>tfoot>tr>td.PagniationInfo{text-align: right; font-size: 12px; color: #656565; padding: 20px 0 10px 0;}
 .Custom_Grid.table>tfoot>tr>td ul.pagination{margin: 15px 0 10px 0;}
 .Custom_Grid.table>tfoot>tr>td ul.pagination li + li{margin-left: 10px; display: inline-block;}
 .Custom_Grid.table>tfoot>tr>td ul.pagination li a{background:none; color:#bebebe; font-size: 12px; border:none; padding: 4px 11px;}
 .Custom_Grid.table>tfoot>tr>td ul.pagination li.active a, .Custom_Grid.table>tfoot>tr>td ul.pagination li.active a:hover{background:#4be14a; color:#000;}
 .Custom_Grid.table>tfoot>tr>td ul.pagination li a:hover{background:#46c345; color:#000;}
 .Custom_Grid.table-striped>tbody>tr>td select.form-control{}
 button.btn-edit{border:none; background:none; color:#4ae14b; font-size: 16px; float:right; margin-top:4px;     padding: 1px 3px;}
 button.btn-edit:hover{color:#33F807;}
 button.btn-delete{border:none; background:none; color:#de1515; font-size: 18px;  float:right; margin-top:2px;     padding: 1px 3px;}
 button.btn-delete:hover{color:#ff0000;}
 .MsgNotify{ display: inline-block; float: left; color: #c32323; font-size: 13px;}
 .MsgNotify1{ display: inline-block; float: left; color: #33F807; font-size: 13px;}
 .success_msg { display: inline-block; float: left; color: #33F807; font-size: 13px;}
 .Custom_Grid .oak_datepicker .mydp .selectiongroup .selection{border: none; width: 0;}
 .Custom_Grid .oak_datepicker{width:auto; display: inline-block; margin-right: 3px; float:right;}
 .Custom_Grid .oak_datepicker .mydp .btnpicker{margin-top: 0;}

 .Custom_Grid .oak_datepicker1 .mydp .selectiongroup .selection{border: none; width: 0;}
 .Custom_Grid .oak_datepicker1{width:50%; display: inline-block; margin-right: 3px; float:right;}
 .Custom_Grid .oak_datepicker1 .mydp .btnpicker{margin-top: 0;}

 .profile_img{width: 100%; display: inline-block; border:1px solid #33f807; text-align: center; padding:28px 0;}
 .profile_img img{ height: 140px; margin-bottom: 5px; cursor: pointer; width: 100%;}
 .profile_img span{color: #fff; text-decoration: none; font-size: 12px; cursor: pointer;}
 
 .row .APStatus{width:19%;}
 .row .APDate{width:31%;}
 .row .APDate .mydp .icon-mydpcalendar, .row .APDate .mydp .icon-mydpremove{font-size: 14px;}
 .FActionBtn{margin-top: 15px; display: inline-block; float: right;}
 
 a.otp_resend{ margin:6px 0 0 0; padding: 0; display: inline-block; color:#c9302c; text-decoration:none; cursor: pointer; float: left;}
 a.otp_resend:hover{text-decoration: underline;}
#myModal-new-role .vertical_center .modal-dialog{width:400px; }

.modal-title{color:#b0b0b0; font-size: 16px;}
.modal-header{ border-bottom: 1px solid #040404; padding: 11px 15px;}
.modal-footer{padding:15px; border: none; text-align: left;}

.RoleMangTab{margin:20px 0;}
.RoleMangTab .nav {float: left; width: 22%; height: 465px; padding-top: 32px; overflow-y: auto;}
.RoleMangTab .nav li{ margin: 10px 0; }
.RoleMangTab .nav li a{color:#aaaaaa; text-decoration: none; cursor: pointer; padding:15px 15px; text-transform: uppercase; font-size: 13px;}
.RoleMangTab .nav li a:hover{background-color:#131313;}
.RoleMangTab .nav li.active a{background-color:#131313; color:#4be04b;}
.RoleMangTab .tabcontent { float: left; padding: 0px; width: 78%; border-left: none; height: 470px; display: none; background: #131313; color:#fff;}
.RoleMangTab .tabcontent.active{display: inline-block;}
.RoleMangTab .tabcontent  h3{font-size: 15px; color: #AAAAAA; margin: 0; display: inline-block; padding: 13px 30px; border-bottom: 1px solid #000;}
.RoleContents{padding: 20px 100px; height: 410px; width:100%; overflow-y: auto;}
.ProductContents{padding: 20px 100px; height: 210px; width:100%; overflow-y: auto;}
ul.RoleSection{ margin: 0; padding:0; }
ul.RoleSection li{ list-style: none; margin: 0; padding: 10px 0; }
ul.RoleSection li + li{border-top:1px solid #000;}
ul.RoleSection li .checkbox_wrap{margin-bottom:0; display: inline-block; height: 15px; position: relative; left: -20px; font-weight: 500;}
.tab-content .Red_button{ margin: 10px; float:right}
.role-level{font-size: 14px; color: #aaaaaa; margin: 10px 0;}

.modal-dialog{width: 20%;}
.modal-content{background: #2f2f2f; top: 30%; color: #fff; position: relative;}
.vertical_center .modal-dialog{vertical-align: middle;pointer-events:none; width:210px; max-width:inherit; height:inherit; margin: 0 auto; pointer-events: all;}
.modal-dialog .center{ text-align: center;}
/*.modal-dialog .btn-danger, .modal-dialog  button,  .modal-dialog .btn-danger:focus, .modal-dialog  button:focus{    background: rgba(51,248,7,0.9);padding: 5px 20px;border-radius: 5px;font-size: 16px;border: none;text-transform: uppercase;margin: 0 10px;color: #000;}*/
.modal-dialog .center-icon{text-align: center;}
.modal-dialog .center-icon i{font-size: 45px; margin: 0 0 8px 0;}
/*.modal-dialog .btn-danger:hover, .modal-dialog  button:hover{background: rgba(51,248,7,0.9) !important; color: #000;}*/
.modal {text-align: center; padding: 0!important;}
.modal:before {content: '';display: inline-block;height: 100%;vertical-align: middle;margin-right: -4px;}
.vertical_center {display: inline-block;text-align: left;vertical-align: middle;}


 footer{padding:12px 20px 0 20px; text-align: right; display: inline-block; width: 100%; color: #AAAAAA; font-size: 12px; position: absolute; bottom: 0; height: 40px;}
 footer p{padding: 0; margin:0;}
 
 @media only screen and (max-width:1023px) and (min-width:990px){ 
     .TxtWithEllips{width: 60%;}
     #product_scanned .ProductHeading{margin: 6px 0 2px 0;}
 }
 
 @media only screen and (max-width:991px){ 
     /* tablet, landscape iPad, lo-res laptops ands desktops */ 
     .login-wrapper{height: auto;}
     .login-left{height: auto; width: 100%}
     .login-logo{margin-top: 2%;}
     .login-right{width: 100%; height: auto;}
     .login-welcome-note{margin-top: 0;}
     .SignupSection, .LoginSection{height: auto;}
 
     .Login_form{margin-top: 4%;}
     .SignupSection.LSActive{ right: 0; position: relative;}
     .LoginSection.LSActive{left: 0; position: relative; top: 0;}
     .Forgotpwdwraper{margin-top: 20px;}
     .Search input{width: 90%;}
 
     .row-hit-230 .card-body{height: auto; }
     .row-hit-180 .card-body{height: auto; }
     .ProductIdicator{margin-top: -30px;}
 
     .row .APStatus{width:100%;}
     .row .APDate{width:100%;}
 
     .table-responsive{border:0px}
     .table-responsive .table{min-width: 750px;}
 }
 @media only screen and (max-width:768px){ 
     .main_header{    padding-left: 0px;
     display: inline-block;
     position: static;
     height: auto;}
     /* portrait tablets, portrait iPad */ 
     .TitleBar{ height: auto;padding: 0 25px 0 25px;}
     h2.PageTitle{ width: 100%; text-align:center; border-bottom: 1px solid #000; padding:10px 0; margin: 0}
     .TitleRit{ width: 100%; text-align:center; padding:5px 0;}
     .content_wrapper{ margin-left: 0; }
     #navbarResponsiveBtn{display: inline-block; width: 100%; height: 50px;}
     .NavResponsiveImg, .NavResponsiveMnu{width: 48%; display: inline-block; }
     .NavResponsiveImg{    padding: 3px 0 0 20px;}
     .NavResponsiveMnu{text-align: right;}
     .NavResponsiveMnu button{background:none; border:none; color: #33F807; font-size: 20px; padding-top: 9px;}
     .content_wrapper{margin-top: 0px;}
     .top_bar{padding: 0; height: auto; background: #000; overflow: hidden;}
     .LeftPanel{position: relative;}
     .LeftPanel li.BrandLogo{display: none;}
     .LeftPanel li{width: 100%;}
     .fixed_top{padding-bottom: 10px;}
     .SearchBar{ width: 100%; border-bottom: 1px solid #333333;}
     .RitTxt { width: 100%; }
     .top_notify_panel{ width: 100%; margin: 0; text-align: left;}
     .top_notify_panel li{ margin: 5px 20px; display: inline-block; vertical-align: top;}
     .top_notify_panel li:last-child{float:right;}
     .top_notify_panel.navbar-nav .open .dropdown-menu{width: 20px;}

     .RoleContents{padding: 20px 39px;}
     .ProductContents{padding: 20px 39px;}
     
     .RoleMangTab .tabcontent{width: 65%;}
     .RoleMangTab .nav{width:35%;}
     
 }
 @media only screen and (max-width:481px){ 
     /* portrait Kindle, smaller tablets */ 
 }
 @media only screen and (max-width:320px){ 
     /* smartphones, iPhone, portrait phones */ 
 }
 .tool-tip1 {
     color: #3fc821;
     background-color: rgba(0, 0, 0, 0.95);
     text-shadow: none;
     font-size: 12px;
     visibility: hidden;
     -webkit-border-radius: 7px;
     -moz-border-radius: 7px;
     -o-border-radius: 7px;
     border-radius: 7px;
     text-align: center;
     opacity: 0;
     z-index: 999;
     padding: 3px 8px;
     position: absolute;
     cursor: default;
     -webkit-transition: all 240ms ease-in-out;
     -moz-transition: all 240ms ease-in-out;
     -ms-transition: all 240ms ease-in-out;
     -o-transition: all 240ms ease-in-out;
     transition: all 240ms ease-in-out;
 }
 .tool-tip1,
 .tool-tip1.top {
     top: auto;
     bottom: 114%;
     left: 15%;
 }
 .tool-tip1.top:after,
 .tool-tip1:after {
     position: absolute;
     bottom: -12px;
     left: 50%;
     margin-left: -7px;
     content: ' ';
     height: 0px;
     width: 0px;
     border: 6px solid transparent;
     border-top-color: rgba(0, 0, 0, 0.95);
 }
 /* default heights, width and margin w/o Javscript */
 .tool-tip1,
 .tool-tip1.top {
     padding: 5px;
 }
 .on-focus {
     position: relative;
 }
 /* on hover of element containing tooltip default*/
 *:not(.on-focus):hover > .tool-tip1,
 .on-focus input:focus + .tool-tip1 {
     visibility: visible;
     opacity: 1;
     -webkit-transition: all 240ms ease-in-out;
     -moz-transition: all 240ms ease-in-out;
     -ms-transition: all 240ms ease-in-out;
     -o-transition: all 240ms ease-in-out;
     transition: all 240ms ease-in-out;
 }
 /* top slideIn */
 *:not(.on-focus) > .tool-tip1.slideIn,
 *:not(.on-focus) > .tool-tip1.slideIn.top,
 .on-focus > .tool-tip1.slideIn,
 .on-focus > .tool-tip1.slideIn.top {
     bottom: 50%;
 }
 *:not(.on-focus):hover > .tool-tip1.slideIn,
 *:not(.on-focus):hover > .tool-tip1.slideIn.top,
 .on-focus > input:focus + .tool-tip1.slideIn,
 .on-focus > input:focus + .tool-tip1.slideIn.top {
     bottom: 110%;
 }
 .oak_datepicker .mydp{border:none;}
 .oak_datepicker .mydp .selectiongroup{background: transparent}
 .oak_datepicker .mydp .selectiongroup .selection{font-size: 14px !important;background: transparent;border-bottom: 0.8px solid #33f807;    color: #ffffff;    padding: 0px;}
 .oak_datepicker .mydp, .oak_datepicker .mydp .headertodaybtn, .oak_datepicker .mydp .selection, .oak_datepicker .mydp .selectiongroup, .oak_datepicker .mydp .selector{border-radius:0px}
 .oak_datepicker .mydp .selbtngroup{height:30px !important}
 .oak_datepicker .mydp .btnclear, .oak_datepicker .mydp .btndecrease, .oak_datepicker .mydp .btnincrease, .oak_datepicker .mydp .btnpicker, .oak_datepicker .mydp .headertodaybtn{background: transparent;}
 .oak_datepicker .mydp .btnclearenabled:hover, .oak_datepicker .mydp .btndecreaseenabled:hover, .oak_datepicker .mydp .btnincreaseenabled:hover, .oak_datepicker .mydp .btnpickerenabled:hover, .oak_datepicker .mydp .headertodaybtnenabled:hover{background: transparent;}
 .oak_datepicker .mydp .btnpicker{color:#33f807}
 .dragndrop{    border: 1px solid #33f807;
     padding: 50px 0px;width:100%;text-align: center;cursor: pointer;
     display: inline-block;
     margin-bottom: 20px;color:#616060}
 
 textarea.custom_height{height:182px;}
 textarea.fssai_custom_height{height:118px}
 textarea.addproducttype_custom_height{height:118px}
 
 .Custom_Grid .SelectWrap.dropdown_green select.form-control{    border: 1px solid #33f807;
     border-radius: 20px; color:#000; min-width: 70px;    padding: 0px 17px 0 10px;color:#fff;margin-top:5px;height:25px}
 .Custom_Grid .SelectWrap.dropdown_green:after{color:#33f807;top:6px}
 .Custom_Grid .SelectWrap.dropdown_orange select.form-control{    border: 1px solid #a56617;
     border-radius: 20px;
     padding: 0px 10px;color:#fff;margin-top:5px;height:25px}
 .Custom_Grid .SelectWrap.dropdown_orange:after{color:#a56617;top:5px}
 .Custom_Grid .SelectWrap.dropdown_red select.form-control{    border: 1px solid #91141c;
     border-radius: 20px;
     padding: 0px 10px;color:#fff;margin-top:5px;height:25px}
 .Custom_Grid .SelectWrap.dropdown_red:after{color:#91141c;top:5px}
 .Custom_Grid .mydp .selectorarrow{    right: 0px;}
 .Custom_Grid .mydp .selectorarrowleft:after, .mydp .selectorarrowleft:before {
        left: 235px !important;
 }
  .mydp .icon-mydpremove{color: #ccc;
     font-size: 12px;}
     .margin_top10{margin-top:10px;}
     .SelectBod{border-bottom: 1px solid #33f807;   }
     .HideSelectBod{ border-bottom: none; }
     .HideSelectBod:focus{ border-bottom: none; width: 95%; }
 
 



 .BtnFloatRight{float:right;}
 .mydp .icon-mydpcalendar:before{font-size: 15px;}
 .table-striped.Custom_Grid > tbody > tr > td.Checkbox_td label{display:inline;}
 
 
 .SearchSelect:after {
    content: "\f0dd";
    font-family: "FontAwesome";
    position: relative;
    color: #33F807;
    right: 8px;
    top: 4px;
	z-index: -1;
    float: left;}
.table-responsive{    overflow-x: inherit;}
a.dropdown-item{     float: left;
    margin-top: 7px;
    color: #000;
    border-bottom: 1px solid #1cbd1b;
    width: 100%;
    padding-bottom: 7px;
    text-align: left}
a.dropdown-item span.text-muted{    color: #016100;}
a.NoteLinkTxt{    text-align: center;    color: #31e309;}
.Notedropdown-arrow{display:none; width: 0px;
    height: 0px;
	z-index:9999;
	    position: relative;
	 margin: 5px 0 0 5px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #4be14a;}
.open>.Notedropdown-arrow {    display: block;}

.control-WhiteTxt{color: #fff; font-size: 13px; margin: 0; }
.notifyBgTxt{top: -4px;
    float: right;
    position: absolute;
    right: -11px;
    background: #d64d4d;}

    .NoMsgTxt{ color: #000; font-size: 16px; text-align: center; padding: 10px;}
	
	.NewRedTxt{     color: #ff0000;
    font-size: 11px;
    font-weight: bold; animation: blink 1s linear infinite;}

    .oak_datepicker .mydp .selectiongroup .selection:focus {
        box-shadow: none;
        border-bottom: 1px solid #a94911;
        background-color: transparent;
    }
    
    .logoutTxt{ font-size: 14px; color: #000;  }
    .top_notify_panel .DropLogout{min-width:120px;}
    .LogoutArrow {
        margin: 1px 0 0 0;
        right: 0;
        position: absolute;
    }
    .logoutTxt:hover{ color: #000; text-decoration: underline;}

    .NoDataTxt{    color: #696969;
        font-size: 18px;
        text-align: center;
        padding: 50px 0!important;}



.reports-center{text-align: center; padding: 10px 0;}
.card-body section{display: inline-block;       margin-top: 27px;  width: 24%; }
.circle-chart__circle {
  animation: circle-chart-fill 2s reverse; /* 1 */ 

  transform-origin: center; /* 4 */
}


.circle-chart__circle--negative {
  transform: rotate(-90deg) scale(1,-1); /* 1, 2, 3 */
}

.circle-chart__info {
  animation: circle-chart-appear 6s forwards;
  opacity: 0;


}

@keyframes circle-chart-fill {
  to { stroke-dasharray: 0 100; }
}

@keyframes circle-chart-appear {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
#Seeded_Products .ProductGenuine {
    color: #f8931f;
}
#Seeded_Products .ProductIdicator {
    background: #f8931f;
    color: #000;
}
    .sebm-google-map-container {
        height: 560px;
      }
      .ProductSearch .SearchBar{
        width: 55%;
    }  
    
.ProductSearch .mydp .headerlabelbtn{
    color: #000;
}  
    .dateContent{
        float:left;
        width:22%;
        border:none;
        margin:0 20px;
    }    
    .dateContent button{
        float:none;
    }
    
    .dateError{
        color: #da4c4c;
        font-size: 13px;
        position: relative;
        top:5px;
        left: 27px;
        margin: 15px 0;
    }
    
.DropNotify{
    height: 336px;
    overflow-y:auto;
}

.loading .page_alert{
    background:rgba(0,0,0,0.6);
}
.loading .alert_wrap{
    background-color: transparent;
}
.wrap_content{
    width:20%;
    background: #2f2f2f;
    position: relative;
    top: 40%;
    margin:0 auto;
    border-radius: 5px;
    color: #FFF;
    display: block;
}

.wrap_header{
    border-bottom: 1px solid #040404;
    padding: 11px 15px;
}

.wrap_title{
    color: #b0b0b0;
    font-size: 16px;
    text-align: left;
    margin:0px;
}

.wrap_body{
    position: relative;
    padding: 15px;
    text-align: left;
}

.wrap_footer{
    padding: 15px;
    text-align: left;
}

.device-drop{
    min-width:150px;
    width: 90%;
}
.resetPassAlert{ width: 35%;}
.resetPassAlert .alert-btn {    padding: 6px 25px 4px 25px;     margin-top: 5px;}
.resetPass-txt{ color: #33e50b;     font-size: 22px;text-align: center;}
.resetPass-txt1{ color: #fff; text-align: center; font-size: 14 px;     margin: 0;}

.contactLink a{    color: #ffffff; font-size: 13px;      margin-top: 5px;    display: inline-block;}
.contactLink i{    font-size: 20px;    color: #00fd00;    margin-right: 5px;}
.contact-label{margin-bottom: 6px;}