/* Semantic UI has these classes, however they're only applicable to*/


/* grids, containers, rows and columns.*/


/* plus, there isn't any `mobile hidden`, `X hidden` class.*/


/* this snippet is using the same class names and same approach*/


/* plus a bit more but to all elements.*/


/* see https://github.com/Semantic-Org/Semantic-UI/issues/1114*/


/* Mobile */

@media only screen and (max-width: 767px) {
  [class*="mobile hidden"],
  [class*="tablet only"]:not(.mobile),
  [class*="computer only"]:not(.mobile),
  [class*="large screen only"]:not(.mobile),
  [class*="widescreen only"]:not(.mobile),
  [class*="or lower hidden"] {
    display: none !important;
  }
}


/* Tablet / iPad Portrait */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  [class*="mobile only"]:not(.tablet),
  [class*="tablet hidden"],
  [class*="computer only"]:not(.tablet),
  [class*="large screen only"]:not(.tablet),
  [class*="widescreen only"]:not(.tablet),
  [class*="or lower hidden"]:not(.mobile) {
    display: none !important;
  }
}


/* Computer / Desktop / iPad Landscape */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  [class*="mobile only"]:not(.computer),
  [class*="tablet only"]:not(.computer),
  [class*="computer hidden"],
  [class*="large screen only"]:not(.computer),
  [class*="widescreen only"]:not(.computer),
  [class*="or lower hidden"]:not(.tablet):not(.mobile) {
    display: none !important;
  }
}


/* Large Monitor */

@media only screen and (min-width: 1200px) and (max-width: 1919px) {
  [class*="mobile only"]:not([class*="large screen"]),
  [class*="tablet only"]:not([class*="large screen"]),
  [class*="computer only"]:not([class*="large screen"]),
  [class*="large screen hidden"],
  [class*="widescreen only"]:not([class*="large screen"]),
  [class*="or lower hidden"]:not(.computer):not(.tablet):not(.mobile) {
    display: none !important;
  }
}


/* Widescreen Monitor */

@media only screen and (min-width: 1920px) {
  [class*="mobile only"]:not([class*="widescreen"]),
  [class*="tablet only"]:not([class*="widescreen"]),
  [class*="computer only"]:not([class*="widescreen"]),
  [class*="large screen only"]:not([class*="widescreen"]),
  [class*="widescreen hidden"],
  [class*="widescreen or lower hidden"] {
    display: none !important;
  }
}


/*fonts lato*/

@font-face {
  font-family: 'lato';
  src: url('../fonts/Lato-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'lato';
  src: url('../fonts/Lato-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'lato';
  src: url('../fonts/Lato-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'lato';
  src: url('../fonts/Lato-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}


/* global classes */

.clearfix {
  clear: both;
  float: none;
}

.pull-right {
  float: right;
}

.ui.grid {
  margin-right: 0px !important;
}

.text-white {
  color: #FFF;
}

.border0 {
  border: none !important;
}

.vertical-middle {
  align-items: center;
}

.text-right {
  text-align: right !important;
}

.text-left {
  text-align: left !important;
}

.text-center {
  text-align: center !important;
}


/* margins */

.mt-0 {
  margin-top: 0px !important;
}

.mt-1em {
  margin-top: 1em;
}

.mb-1em {
  margin-bottom: 1em;
}


/* padding */

.padding0 {
  padding: 0px !important;
}


/* header */

.logo {
  margin-left: 15px;
}

.main-body {
  min-height: calc(100vh - 140px);
  padding-top: 20px;
  padding-bottom: 20px;
  box-sizing: border-box;
}

.logo img {
  width: 150px;
}

.toggle_button {
  /* padding:0px  20px; */
  transition: all 0.2s linear;
  display: flex;
  align-items: center;
}

#toggle-btn {
  display: block;
}

input[readonly],
textarea[readonly] {
  background: rgba(243, 226, 203, 0.7) !important;
}

table .read-only {
  background: rgba(243, 226, 203, 0.7) !important;
  color: #FFF;
}

table .read-only input {
  background: transparent !important;
}

.ui.left {
  transition: width 0.2s linear;
}

.labeled.icon {
  width: 84px !important;
}

.pusher.push {
  transform: translate3d(84px, 0, 0) !important;
}

.header-space {
  min-height: 35px;
}
td.light-orange {
  background: #f6eadb !important;
}
td.light-orange input {
  background: rgba(0, 0, 0, 0) !important;
}
td.read-only-fields {
  pointer-events: none;
  background: #f6eadb !important;
}
td.read-only-fields input {
  background: rgba(0, 0, 0, 0) !important;
}
td.read-only-fields select {
  background: rgba(0, 0, 0, 0) !important;
}
/*test css*/

.demo-box {
  width: 100%;
  background: red;
  height: 200px;
}

.table-overflow-auto {
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 10px;
}

td.focused {
  box-shadow: 0px 0px 0px 1px #85b7d9;
}

.main__heading {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 2px solid rgba(34, 36, 38, 0.15);
}

.hide {
  display: none !important;
}
/*side menu style start here*/
@media only screen and (min-width: 991px) {
  .side__menu.one.wide.column .item:not(.toggle-btn) .side-menu-text {
    display: none;
  }
  .side__menu.one.wide.column .item:not(.toggle-btn):hover .side-menu-text {
    display: flex ;
    font-size: 12px;
    position: absolute;
    left: 100%;
    background: #f7f7f7;
    height: 100%;
    z-index: 1;
    top: 0;
    align-items: center;
    justify-content: center;
    padding: 0 30px;
    max-width: 200px;
    white-space: nowrap;
    box-shadow: 3px 1px 8px 0px rgba(0, 0, 0, 0.3);
  }
}
@media only screen and (max-width: 991px) {
  .side__menu.very.thin .item:not(.toggle-btn) .side-menu-text {
    display: none;
  }
  .side__menu.very.thin .item:not(.toggle-btn):hover .side-menu-text {
    display: flex ;
    font-size: 12px;
    position: absolute;
    left: 100%;
    background: #f7f7f7;
    height: 100%;
    z-index: 1;
    top: 0;
    align-items: center;
    justify-content: center;
    padding: 0 30px;
    max-width: 200px;
    white-space: nowrap;
    box-shadow: 3px 1px 8px 0px rgba(0, 0, 0, 0.3);
  }
  .side__menu .item {
    display: flex !important;
    flex-direction: row-reverse;
    justify-content: space-between;
  }
  .side__menu .item .icon {
    margin: 0 !important;
  }
}
/*side menu style end here */
/* custom search message */
.ui.search > .results > .custom-message {
  padding: 1em 1em;
}
.ui.search > .results > .custom-message .header {
  font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.87);
}
.ui.search > .results > .custom-message .description {
  margin-top: 0.25rem;
  font-size: 1em;
  color: rgba(0, 0, 0, 0.87);
}

.percent_sign {
  width: 90px !important;
}

.help-text {
  font-size: 0.5em !important;
  color: #fff;
  background: #7e7e7e;
  width: 15px !important;
  height: 15px !important;
  border-radius: 10px !important;
  line-height: 14px;
  margin-left: 5px !important;
}

.help-text:hover {
  color: #000;
}

.help-text-corner {
  font-size: 0.5em !important;
}

/* Css By Yusuf*/
.docupload {
  padding: 30px 15px;
}

.docname {
  background: #f9fafb;
}

.doc_format {
  margin-top: 8px;
  display: inline-block;
  color: #777;
}

.image.outline.icon {
  vertical-align: initial !important ;
}



.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  padding: 12px 16px;
  z-index: 1;
}
.dropdown-content .docs-list {
  max-height: 250px;
  overflow: auto;
  margin: 10px 0;
}
.dropdown-content .docs-list a {
  padding: 10px 0;
  display: block;
}

.dropdown:hover .dropdown-content {
  display: block;
}
/*for new window open in child */
.loaderBlock--new {
  display: none;
}
@media screen and (max-height: 110px) {
  body .ui.menu.fixed {
    display: none;
    opacity: 0;
    overflow: hidden;
  }
  .loaderBlock--new {
    display: flex !important;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 1;
    justify-content: center;
    align-items: center;
  }
  .loaderBlock--new .lds-message {
    width: 100%;
  }
}
/* css end By Yusuf*/
/* responsive */

@media only screen and (min-width: 769px) {
  .side__menu {
    padding-right: 0px !important;
    min-height: calc(100vh - 100px) !important;
  }
  .main__heading > .right-box > * {
    margin-right: 5px;
    display: inline-block;
  }
}

@media only screen and (max-width: 768px) {
  .main__heading > .right-box > * {
    margin-bottom: 10px;
  }
}

.editable-fields {
  border-bottom: 1px solid #96c93d;
}

.ui.table td.error,
.ui.table tr.error {
  border-bottom: 1px solid #9e3937;
  border-collapse: separate;
}
.status-col .button {
  padding: 6px;
}
.status-col .button i {
  margin: 0 !important
    ;
}
.status_action {
  cursor: pointer;
}

/** Custom CSS **/

.data1{width:130px;margin-right: 10px;}
.input1{width:120px;margin-right: 10px !important;color: #000;}
.input1:hover{cursor: pointer;}
.input1::selection{color: #000;}
.input1::-moz-placeholder{color: #000;}
/* input.input1[type="date"]::-webkit-calendar-picker-indicator {
  background: transparent;
  bottom: 0;
  color: transparent;
  cursor: pointer;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
} */
.ui.action.input:not([class*="left action"])>input.input1{border:1px solid #7e7e7e !important;border-radius: 4px !important;}
.data2{width:150px;margin-right: 10px !important;}
.input3{width:150px;}
button.search_btn{margin-right: 10px !important;border-radius: 4px !important;}


input.input1[type="date"]::before {
	color: #999999;
	content: attr(placeholder);
}
input.input1[type="date"] {
	color: #ffffff;
}
input.input1[type="date"]:focus,
input.input1[type="date"]:valid {
	color: #666666;
}
input.input1[type="date"]:focus::before,
input.input1[type="date"]:valid::before {
	content: "" !important;
}

.datatypemainbox p{margin-bottom: 10px;font-weight: bold;}

.datatypebox{width: 100%;padding: 0;background-color: #FFF;border-radius: 4px;text-align: left;position: relative;cursor: pointer;height:40px;line-height: 40px;padding-left: 10px;border: 1px solid #aaa;border-radius: 4px;box-shadow: 0 1px 3px rgb(0 0 0 / 20%);}
.datatypebox p{margin-bottom: 0;font-weight: 400;}
.datatypebox:after{content:'';background: url(arrow.png) no-repeat;width: 15px;height: 15px;background-size: contain;display: inline-block;position: absolute;right: 5px;top: 13px;}
.datatypeboxshow{width: 100%;background-color: aliceblue;margin-top: 10px;border-radius: 4px;display: none;}
.datatypeboxshow ul{padding-left: 0;margin-bottom: 0;}
.datatypeboxshow ul li{list-style: none;display: block;padding: 5px;}
.datatypeboxshow ul li:hover{background-color: antiquewhite;}
.datatypeboxshow ul li a{text-decoration: none;color: #000;display: block;}

.multiselecter{width: 100%;}
.multiselecter:after{content:'';background: url(arrow.png) no-repeat;width: 15px;height: 15px;background-size: contain;display: inline-block;position: absolute;right: 5px;top: 10px;}
.multiselecter .select2-container{width: 100%;padding: 5px;background-color: aliceblue;border-radius: 4px;text-align: center;position: relative;cursor: pointer;}

.dateinputbox input{width: 100%;height:40px;line-height: 40px;font-size: 12px;background-color: #fff;border: 1px solid #aaa;border-radius: 4px;box-shadow: 0 1px 3px rgb(0 0 0 / 20%);padding: 2px;width: 100%;padding-left: 5px;}
.dateinputbox .col-md-5{padding: 0 5px;}
.dateinputbox .col-md-2{padding:0 5px;}
.dateinputbox button{height:40px;background-color: #fff;border: 1px solid #aaa;border-radius: 4px;box-shadow: 0 1px 3px rgb(0 0 0 / 20%);padding: 2px;width: 100%;}

.multi-select-container{margin-right: 10px;position: relative;}
.multi-select-menu {position: absolute;left: 0;top: 30px;float: left;width:150px;max-width: 150px;background: #fff;margin: 1em 0;padding: 0.4em;border: 1px solid #aaa;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);display: none;border-radius: 4px;height: 200px;}
.multi-select-menu label{display: block;}
.multi-select-menu input {margin-right: 0.3em;vertical-align: -0.05em;}
.multi-select-button {display: inline-block;font-size: 16px;padding: 0 0.6em;max-width: 160px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;vertical-align: -0.5em;background-color: #fff;border: 1px solid #aaa;border-radius: 4px;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);cursor: default;width: 160px;height:40px;line-height: 40px;}            
/* .multi-select-button:after {content: "";display: inline-block;width: 0;height: 0;border-style: solid;border-width: 0.4em 0.4em 0 0.4em;border-color: #999 transparent transparent transparent;margin-left: 0.4em;float: right;margin-top: 15px;} */
.multi-select-container--open .multi-select-menu {display: block;overflow-y: scroll;}
.multi-select-container--open .multi-select-button:after {border-width: 0 0.4em 0.4em 0.4em;border-color: transparent transparent #999 transparent;}
@media only screen and (min-width:1300px){

  .data1{width:130px;}

}

.active_select{width:90px;}
.add_new_btn{padding: 0.8em !important;}

.ui.dropdown>.text{white-space: nowrap;width: 90px;overflow: hidden;text-overflow: inherit;}

.currency-wrap{
  position:relative;
}

.currency-code{
  position:absolute;
  right:12px;
  top:10px;
}

.text-currency{
  padding:10px 20px;
  border:solid 1px #ccc;
  border-radius:5px;
}