@charset "UTF-8";
@import url("/assets/fonts/roboto/font-roboto.css");
@import url("/assets/fonts/roboto/font-roboto.css");
@media only screen and (min-width: 1200px) {
  .container {
    min-width: 80%; } }

/******* RESPONSIVE ********/
/****Màn hình máy tính thông thường****/
/****Màn hình ipad hiển thị theo chiều ngang (Landscape)****/
/****Màn hình desktop loại bé****/
/****Màn hình ipad loại bé hiển thị theo chiều ngang (Landscape)****/
/****Màn hình ipad hiển thị theo chiều dọc (Portrait)****/
/****Màn hình ipad loại bé hiển thị theo chiều dọc (Portrait)****/
/****Màn hình điện thoại hiển thị theo chiều ngang (Landscape)****/
/****Màn hình điện thoại Iphone Plus****/
/****Màn hình điện thoại Iphone****/
/****Màn hình điện thoại loại bé****/
/*@mixin mobile {
    @media(max-width: 767px) {
        @content
    }
}


@mixin ipad {
    @media(min-width: 768px) and (max-width:1024px) {
        @content
    }
}
@mixin tablet {
    @media only screen and (max-width: 1200px) {
        @content
    }
}

@mixin ipad {
    @media only screen and (max-width:1024px) {
        @content
    }
}

@mixin ipad-port {
    @media only screen and (max-width:992px) {
        @content
    }
}

@mixin mobile {
    @media only screen and (max-width:769px) {
        @content
    }
}

@mixin ipadSmPort {
    @media only screen and (max-width:600px) {
        @content
    }
}

@mixin mobile-small {
    @media only screen and (max-width: 577px) {
        @content
    }
}

@mixin iphonePlus {
    @media only screen and (max-width: 415px) {
        @content
    }
}

@mixin iphone {
    @media only screen and (max-width: 376px) {
        @content
    }
}

@mixin mobileSm {
    @media only screen and (max-width: 376px) {
        @content
    }
}

@mixin onlyTablet {
    @media (min-width: 1025px) and (max-width: 1200px) {
        @content
    }
}

@mixin onlyIpad {
    @media (min-width: 992px) and (max-width:1024px) {
        @content
    }
}

@mixin onlyIpad-port {
    @media (min-width: 769px) and (max-width:992px) {
        @content
    }
}

@mixin onlyMobile {
    @media (min-width: 577px) and (max-width:769px) {
        @content
    }
}

@mixin onlyMobile-small {
    @media (max-width: 577px) {
        @content
    }
}
@mixin mobile {
    @media (max-width: 600px) {
        @content;
    }
}



@mixin desktop {
    @media (min-width:768px) and (max-width: 1024px) {
        @content;
    }
}

@mixin desktop-up {
    @media (min-width: 1800px) {
        @content;
    }
}*/
ul, li {
  list-style: none; }

body {
  font-family: Manrope, Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px; }

p {
  margin: 0 auto; }

a:hover {
  text-decoration: none; }

#leftpanel {
  height: calc(100vh - 129px);
  width: 35%;
  background: #fff; }
  #leftpanel .sLayers {
    background: #fff;
    width: 100%;
    float: left;
    border-top: 1px solid #ccc;
    border-radius: 4px 4px 0 0;
    height: calc(100vh - 185px); }

#listCanhBao .fBox {
  width: 100%;
  padding: 10px; }
  #listCanhBao .fBox .UI-DROP {
    display: flex;
    height: 36px;
    margin-top: 5px; }
    #listCanhBao .fBox .UI-DROP .ui-tieude {
      display: inline-block;
      width: 200px; }
    #listCanhBao .fBox .UI-DROP .UI-DDL {
      width: 100%;
      border: 1px solid #f1f1f1;
      border-radius: 4px;
      padding: 6px 5px; }
      #listCanhBao .fBox .UI-DROP .UI-DDL .ui-nhan {
        padding: 5px; }

#listCanhBao .content {
  height: calc(100vh - 325px);
  position: relative; }
  #listCanhBao .content .icon-action {
    display: flex; }
    #listCanhBao .content .icon-action i {
      padding: 3px;
      cursor: pointer;
      color: #657FAD; }
      #listCanhBao .content .icon-action i.noPosition {
        cursor: default;
        color: darkgray; }

#tblCanhBao {
  max-height: 100%;
  overflow-y: auto; }
  #tblCanhBao thead {
    position: sticky;
    top: 0; }

#chartBox {
  display: none; }

#viewDataCanhBao {
  position: absolute;
  top: 150px;
  left: 30%;
  max-width: 700px;
  background: #fff;
  border-radius: 5px;
  z-index: 99;
  height: calc(100vh - 200px);
  display: none; }
  #viewDataCanhBao .header {
    padding: 18px;
    text-align: center; }
  #viewDataCanhBao #imodal {
    display: flex; }
  #viewDataCanhBao #lstChart {
    position: relative;
    height: 100%; }

#mdEmail {
  height: calc(100vh - 50px); }
  #mdEmail .modal-content {
    height: calc(100vh - 100px); }
  #mdEmail .modal-body {
    height: calc(100vh - 300px); }
  #mdEmail #listUser {
    width: 100%; }
  #mdEmail .title {
    font-weight: 600;
    font-size: 1.2em;
    padding: 5px; }
  #mdEmail .tblListCanhBao {
    position: relative; }
    #mdEmail .tblListCanhBao table thead {
      position: sticky;
      top: 0; }

.view2Chart {
  padding-right: 5px; }

@media screen and (max-width: 992px) {
  #listCanhBao .fBox .UI-DROP {
    display: block; }
  .ha-inline {
    margin-bottom: 25px; } }