/*************************/
/* main tag */
/*************************/

p, body, .btn {
    font-size: 14px;
    font-family: 'Open Sans', roboto, sans-serif;
}



/*************************/
/* table */
/*************************/

.table-hover.table-yellow-hover > tbody > tr:hover {
    background-color: #ffffc2;
}

.table_bgcolor_1 {
    background-color: #bfb; !important;
}

.table_bgcolor_2 {
    background-color: #fcc; !important;
}

.table.table-hover.table_contact_info {
    width: auto;
    margin-bottom: 10px;
}

.table.table-hover.table_contact_info td, .table.table-hover.table_contact_info th {
    border: none;
    font-size: 14px;
    color: #444;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    padding: 6px;
}

.table_contact_info_bold {
    font-size: 14px !important;
    font-weight: bold;
}

.table_contact_info_td {
    padding-left: 15px !important;
}

.table-no-100 {
    width: auto;
}

.table-auto-pad {
    width: auto;
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.table-min33 {
    width: auto;
    min-width: 33%;
}

.table-no-margin {
    margin: 0px;
}

.table_default_contact_customer {
    margin-bottom: 30px;
    margin-top: 10px;
}

.td-pad-all20 {
    padding: 20px !important;
}

.td-pad-right {
    padding-right: 20px !important;
}

.td-pad-left {
    padding-left: 20px !important;
}

.td-pad-both {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.td-pad-both2 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.lightgray-border {
    border: 2px solid lightgray;
}

.td-no-border {
    border: none !important;
}

.table-toallign-td-first, .table-toallign-td {
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.table-toallign-td {
    padding-left: 5px;
}

.alcentre.lightgray-border.td-with-icon{
    padding: 0px;
    vertical-align: middle;
}

.valign-middle{
    vertical-align: middle !important;
}

.valign-top{
    vertical-align: top !important;
}

.vert-align-sub{
    vertical-align: sub;
}

.vert-align-moz{
    vertical-align: -moz-middle-with-baseline;
}

.vert-align-webk{
    vertical-align: -webkit-baseline-middle;
}

.table-top-margin {
    margin-top: 15px;
}

.xlot-group-margin{
    margin-top: 15px;
    margin-bottom: 5px;
}

.no-padding-left {
    padding-left: 0px !important;
}

.td-pad{
    padding-left: 30px !important;  
    padding-right: 30px !important; 
}

.pad-right-30{ 
    padding-right: 30px !important; 
}

.pad-left-30{ 
    padding-left: 30px !important; 
}

.pad-15 {
    padding: 15px;
}

.pad-20i {
    padding: 20px !important;
}

.tdmax30 {
    max-width: 30px;
}

.tdmax40 {
    max-width: 40px;
}

.tdmax50 {
    max-width: 50px;
}

.tdmax60 {
    max-width: 60px;
}

.tdmax70 {
    max-width: 70px;
}

.tdmax350 {
    max-width: 350px;
}

.td100 {
    min-width: 100px;
}

.td150 {
    min-width: 150px;
}

.td200 {
    min-width: 200px;
}

.td300 {
    min-width: 300px;
}


.tdbold {
    border: none !important;
    font-weight: bold;
    padding-top: 0px !important;
}

.td-padding-left {
    padding-left: 10px;
}

.tr-floralwhite {
    background: floralwhite !important;
}

.td-error {
    background: rgba(255, 35, 33, 0.3);
}

.td-min-content{
    width: min-content;
}

.td-max-content{
    width: max-content;
}

.td-no-side-border {
    border-right-style: none;
    border-left-style: none;
}


/*************************/
/* table column */
/*************************/



.col-order {
    color: #000;
}

.col-order:hover, .col-order:focus {
    #color: crimson;
    color: limegreen;
    text-decoration: none;
}


/*************************/
/* text format */
/*************************/

h1 {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 30px;
    color: steelblue;
}

.bold-red  {
    color: red;
    font-weight: bold;
}

.deleted-lot {
    color: white;
    font-weight: bold;
    margin-bottom: 12px;
    margin-top: 2px;
    padding: 5px;
    background-color: firebrick;
}

.bold-firebrick  {
    color: firebrick;
    font-weight: bold;
}

.bold-green {
    color: green;
    font-weight: bold;
}

.bold-grey  {
    color: grey;
    font-weight: bold;
}

.bold  {
    font-weight: bold;
}

.bold-big  {
    font-weight: bold;
    font-size: 14px;
}

.bold-bigger  {
    font-weight: bold;
    font-size: 16px;
}


.bold700 {
    vertical-align: middle;
    font-weight: 700;
}

.text-small {
    font-size: 12px;
}

.text-smaller {
    font-size: smaller;
}

.alleft {
    text-align: left;
    padding-left: 12px !important;
    padding-left: 12px !important;
    padding-left: 12px !important;
}

.alright {
    text-align: right;
    padding-right: 12px !important;
}

.alcentre {
    text-align: center;
}


.contact-desc {
    font-size: 12px;
    font-family: 'Open Sans', roboto,sans-serif;
}

.container.page-path {
    font-size: 14px;
}

.text_white_bold {
    font-weight: bold;
    /* color: #FFFFFF; */
    font-size: 18px;
}


.text_white_bold a {
    color: white;
}

.text_very_big {
    font-size: 62px;
}

.alignleft, .alignleft2 {
    float: left;
}
.alignright, .alignright2 {
    float: right;
}

.alignleft, .alignright {
    margin-bottom: 0px;
}


.add-item-in-tab {
    font-size: 14px;
}

.add-item-in-tab.nodec:hover {
    text-decoration: none;
    color: #c69
}

.contract-message-header a{
    font-weight: bold;
    color: black;
}

.contract-message-header{
    font-weight: bold;
    color: black;
}

.text_underlined {
    text-decoration: underline;
}


.color_steelblue {
    color: steelblue;
}

.color_red {
    color: red;
}

.color_crimson {
    color: crimson;
}

.font10 {
    font-size: 10px !important;
}

.font11 {
    font-size: 11px !important;
}

.font14 {
    font-size: 14px !important;
}

.font16 {
    font-size: 16px !important;
}

.font18 {
    font-size: 18px;
}

.font20 {
    font-size: 20;
}

.color444 {
    color: #444 !important;
}

.crimson {
    color: crimson;
}

.subcard {
    background-color: bisque;
}

.linkcard, .linkcard:hover {
    color: chocolate !important;
    /*background-color: transparent !important;*/

}

/*
.subcard select option:hover {
    background-color: red; 
    color: green;
}
*/

/*************************/
/* text color */
/*************************/

.text-color-red {
    color: crimson;
}

.text-color-blue {
    color: blue;
}

.text-color-green {
    color: green;
}

.text-color-darkgrey {
    color: dimgrey;
}

.text-color-black {
    color: black;
}


/*************************/
/* hr */
/*************************/

hr.dashed {
  border-top: 1px dashed;
}

hr.dotted {
  border-top: 1px dotted;
}

hr.thick {
  border: 1px solid;
}

hr.thick_steel {
  border: 1px solid steelblue;
}

hr.large_rounded {
  border: 10px solid;
  border-radius: 5px;
} 



/*************************/
/* navbar */
/*************************/


.nav > li > a:focus, .nav > li > a:hover {
    color: steelblue;
}

.navbar-default {
    background-color: steelblue;
    border-color: #bbb;
}

/*.navbar-default .navbar-brand {
    color: #fff;
    / *  color: #5e5e5e; * /
}*/

.navbar {
    margin-bottom: 0px;
    padding-bottom: 2px;
}

.navbar-default .navbar-brand {
    height: 52px;
    /* line-height: 24px; */
    margin-left: -15px;
    font-family: 'Yellowtail', 'Open Sans', 'Oxygen', sans-serif;
    font-size: 34px;

}

.nav-message, .nav-message-new {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.nav-message-new {
    color: greenyellow !important
}

.navbar-default .navbar-brand, .navbar-default .navbar-nav > li > a {
    color: #ffffff;
}

.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover, .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    color: greenyellow;
/*    color: #f0f0f0;*/
    background-color: transparent;
}

.a-nav-path {
    font-weight: bold;
}

.nav-link-area {
    margin-top: 10px;
    margin-bottom: 5px;
    background-color: #f0f0f0;
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: 10px;
}



.imglogo {
    margin-top: 5px;
    margin-bottom: 5px;
    height: 35px;
    /* opacity: 0.8; */
}

.tab-filter, .tab-filter:hover {
    font-weight: bold;
    color: #c69 !important;
}

.tab-main-text {
    font-weight: bold;
}

.container-subtab.tab-18 {
    font-size: 16px;
}

.nav-tabs {
    border-bottom: 1px solid #ddd;
    margin-top: 10px;
}

.env-dev {
    color: greenyellow;
    margin-top: 15px;
    margin-left: 10px !important;
    font-weight: bold;
}

.color-dev {
    color: greenyellow !important;
}

.work-alert {
    background: crimson;
    color: white;
    font-weight: bold;
    padding: 5px;
}

.w25 {
    width: 25%;
}

/*************************/
/* form */
/*************************/

.form-group.col-md-1.col-md1-cust, .form-group.col-md-2.col-md2-cust, .form-group.col-md-3.col-md3-cust, .form-group.col-md-4.col-md4-cust, .form-group.col-md-6.col-md6-cust, .form-group.col-md-8.col-md8-cust, .form-group.col-md-9.col-md9-cust, .form-group.col-md-10.col-md10-cust, .form-group.col-md-11.col-md11-cust, .form-group.col-md-12.col-md12-cust, .col-pad-cust {
    padding-left: 0px;
}

.form-group{
    margin-bottom: 5px;
}

.form-control {
    height: 30px;
}

.form-control.mr-sm-2.input50 {
    width: 50%;
}

.form-bottom-space {
    margin-bottom: 10px;
}

.form-horizontal .control-label {
    text-align: left;
}

.form-control-4 {
    width: 4% !important;
}

.form-control-8 {
    width: 8% !important;
}

.form-control-10 {
    width: 10% !important;
}

.form-control-8, .form-control-4, .form-control-10 {
    padding-left: 6px;
}

.form-control-checkbox {
    display: inline !important;
    height: auto;
    width: auto !important;
    margin-left: 10px !important;
}

.form-control-50 {
    width: 50% !important;
}

.form-valign {
    vertical-align: unset !important;
}

.form-control-25 {
    width: 25%;
}

.form-50 {
    width: 50px !important;
}

.form-60 {
    width: 60px !important;
}

.form-100 {
    width: 100px !important;
}

.form-125 {
    width: 125px !important;
}

.form-150 {
    width: 150px !important;
}

.form-180 {
    width: 180px !important;
}

.form-360 {
    width: 360px !important;
}

.form-row.form-row-bmargin {
    margin-bottom: 10px;
}

.form_message_ref {
    margin-bottom: 10px;
    margin-left: 70px;
}

.ref-text-box {
    width: 85%;
    display: inline;
    font-size: 12px;
    height: 20px;
    padding: 5px;
}

.form-xlot-search {
    display: inline-block;
}

.inline-block {
    display: inline-block;
}

#search_text {
    margin-bottom: 5px;
}

.top4{
    top: 4px !important;
}

label {
    margin-bottom: 1px; 
}


.ro-bg {
    color: #999;
    opacity: 1;
    background-color: #eee;
}

.form-height-100 {
    min-height: 100px;
    resize: vertical;
}


/*************************/
/* btn */
/*************************/

.btn-top {
    margin-top: 10px;
}

.btn-top20 {
    margin-top: 20px;
}

.btn-bottom {
    margin-bottom: 10px;
}

.btn-left {
    margin-left: 5px;
}



.btn-info {
    background-color: steelblue;
    border-color: steelblue;
}

.btn-info:hover {
    color: #fff;
    background-color: cornflowerblue;
    border-color: steelblue;
}

.no100 {
    width: auto;
}


.btn-primary-inv {
    color: #337ab7;
    background-color: #fff;
    border-color: #2e6da4;
}

.btn-primary-inv:hover {
    color: #337ab7;
    background-color: #f5f5f5;
    border-color: #2e6da4;
}

.btn-primary-inv:focus {
    color: #337ab7;
}


.btn-primary-lot-restore {
    color: #ffffff;
    background-color: firebrick;
    border-color: crimson;
}

.btn-primary-lot-restore:hover {
    color: #ffffff;
    background-color: darkred;
    border-color: brown;
}

.btn-primary-lot-restore:focus {
    color: #ffffff;
}


.btn-intable-red, .btn-intable-green, .btn-intable-grey {
    padding: 3px 8px !important;
    color: #fff;
}

.btn-intable-red:hover, .btn-intable-green:hover, .btn-intable-grey:hover, .btn-intable-red:focus, .btn-intable-green:focus, .btn-intable-grey:focus {
    color: #fff;
}

.btn-intable-red {
    background-color: firebrick;
    border-color: darkred;
}

.btn-intable-red:hover {
    background-color: darkred;
    border-color: darkred;
}

.btn-intable-green {
    background-color: green;
    border-color: darkgreen;
}

.btn-intable-green:hover {
    background-color: darkgreen;
    border-color: darkgreen;
}

.btn-intable-grey {
    background-color: grey;
    border-color: darkslategray;
}

.btn-intable-grey:hover {
    background-color: darkslategray;
    border-color: darkslategray;
}


.btn-400 {
    width: 400px;
}

.btn-min-250, .form-min-250 {
    min-width: 250px;
}

.btn-min-360, .form-min-360 {
    min-width: 360px;
}

.btn-min-400, .form-min-400 {
    min-width: 400px;
}

.btn-file-upload {
    padding-left: 0px !important;
    color: #337ab7;
    text-align: left;

}

.btn-red {
    background-color: #f01616;
    border-color: #d20909;
}

.btn-red:hover, .btn-red:active {
    background-color: #b90606;
    border-color: #900303;
}

.btn-red:active:hover, .btn-red:active:focus, .btn-red:focus {
    background-color: #900303;
    border-color: #600000;
}


.btn-green {
    background-color: #191;
    border-color: #181;
}

.btn-green:hover, .btn-green:active {
    background-color: #171;
    border-color: darkgreen;
}

.btn-green:active:hover, .btn-green:active:focus, .btn-green:focus {
    background-color: darkgreen;
    border-color: #050;
}


.btn-green-inv {
    color: #191;
    background-color: #fff;
    border-color: #181;
}

.btn-green-inv:hover {
    color: #191;
    background-color: #f5f5f5;
    border-color: #181;
}

.btn-green-inv:focus {
    color:#191;
}

.btn-green2 {
    background-color: green;
    border-color: #181;
    color: white;
}

.btn-green2:hover, .btn-green2:active {
    background-color: darkgreen;
    border-color: darkgreen;
    color: white;
}

.btn-green2:active:hover, .btn-green2:active:focus, .btn-green2:focus {
    background-color: darkgreen;
    border-color: darkgreen;
    color: white;
}


.btn-prints {
    border-color: forestgreen;
    background-color: white;
    color: forestgreen;
    padding: 15px 0px;
    border-radius: 20px;
    font-weight: bold;
    border-width: 2px;

}

.btn-prints:hover  {
    background-color: forestgreen;
    color: white;
}

.button-list:hover > .btn-prints {
    color: white !important;
    background-color: forestgreen;
}

.button-list {
    width: min-content;
}

.btn-prints:focus  {
    color: forestgreen;
}



.block01 {
    background-color: beige;
}

.block02 {
    background-color: lightblue;
}


.block01, .block02  {
    padding: 10px;
    width: 50%;
}





/*************************/
/* link */
/*************************/

a {
    color: steelblue;
    text-decoration: none;
}

a:hover, a:focus {
    color: forestgreen;
    #color: darkslategrey;
    text-decoration: none;
}


.linkund {
    text-decoration: underline;
}

.link-bottom, .link-bottom:hover, .link-bottom:focus {
    color: #fff;
    text-decoration: none;
}


/*************************/
/* margin */
/*************************/

.vert-spaced {
    margin-top: 10px;
    margin-bottom: 10px;
}


.h-containers-detail {
    margin-top: 20px;
    margin-bottom: 10px;
}


.contact_info {
    margin-top: 10px;
}

.margin_bottom10 {
    margin-bottom: 10px;
}

.margin_bottom20 {
    margin-bottom: 20px;
}

.margin_bottom30 {
    margin-bottom: 30px;
}

.margin_top10 {
    margin-top: 10px;
}

.margin_top15 {
    margin-top: 15px;
}

.margin_top20 {
    margin-top: 20px;
}

.margin_top30 {
    margin-top: 30px;
}

.margin_left10 {
    margin-left: 10px;
}

.margin_left20 {
    margin-left: 20px;
}

.margin_left30 {
    margin-left: 30px;
}

.no-margin-bottom {
    margin-bottom: 0px !important;
}


.add-message-div {
    margin-top: 10px;
    margin-bottom: 10px;
}

.message-head {
    margin-bottom: 15px;
}

.message-head1 {
    margin-bottom: 5px;
}

.contract-message-box{
    margin-bottom: 15px;
    background: #eee;
    padding: 10px;
    font-size: 13px;
}

.container-subtab {
    padding-top: 10px;
}

.padding_top10 {
    padding-top: 10px;
}

.padding_top20 {
    padding-top: 20px;
}

.padding_top30 {
    padding-top: 30px;
}

.line30 {
    line-height: 30px;
}

.top-margin-fpage {
    margin-top: 15px
}

.top-margin-from-menu {
    margin-bottom: 15px;
}


.no-padding {
    padding: 0px !important;
}


.no-padding-only-left {
    padding: 0px 0px 0px 10px !important;
}


.padding-side-10 {
    padding: 0px 10px 0px 10px !important;
}

.padding-btn-side-10 {
    padding: 6px 10px 6px 10px !important;
}

.padding-btn-side-20 {
    padding: 6px 20px 6px 20px !important;
}

.padding-btn-cust1 {
    padding: 2px 5px 5px 5px !important;
}

.vpad20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

/*************************/
/* square */
/*************************/

.square_dash, .square_dash_left, .square_dash_right, .square_dash_rect {
    float:left;
    position: relative;
    width: 24.2%;
    padding-bottom : 24.2%; /* = width for a 1:1 aspect ratio */
    margin:0.5%;
    overflow:hidden;
}

.square_dash_rect {
    padding-bottom : 20%;
}


.square_dash_left{
    margin-left: 0px !important;
}

.square_dash_right{
    margin-right: 0px !important;
}

.square_dash_content {
    position:absolute;
    height:100%; /* = 100% - 2*10% padding */
    width:100%; /* = 100% - 2*5% padding */
    padding: 10% 10%;
    text-align:center
}
.square_dash_table{
    display:table;
    height:100%;
    width:100%;
}
.square_dash_table_cell{
    display:table-cell;
    vertical-align:middle;
    height:100%;
    width:100%;
}



/*************************/
/* background */
/*************************/

.bg_blue {
    background-color: #4C69C4;
}

.bg_green {
    background-color: #519D3C;
}

.bg_cheddar {
    background-color: #FA9400;
}

.bg_mandarin {
    background-color: #FF7800;
}

.bg_tomato {
    background-color: #ED582C;
}

.bg_cherry {
    background-color: #BA2710;
}

.bg_mandarin_l0 {
    background-color: #FF9400;
}

.bg_mandarin_l1 {
    background-color: #FF6200;
}

.bg_mandarin_l2 {
    background-color: #FF4600;
}

.bg_blue_grey {
    background-color: #334466;
}

.bg_cornflowerblue {
    background-color: cornflowerblue;
}

.bg_white {
    background-color: #FFFFFF;
}

.bg_blue_border {
    background-color: #f6f6f6;
    border: steelblue;
    border-style: solid;
}

.bg2 {
    background-color: lightyellow;
}

.bg3 {
    background-color: cornsilk;
}


/*************************/
/* square NEW */
/*************************/


.square-dashboard-container {
  display: flex;
  flex-wrap: wrap;
}

.square-dashboard {
  position: relative;
  flex-basis: calc(20% - 10px);
  margin: 5px;
  border: 1px solid;
  box-sizing: border-box;
}

.square-dashboard25 {
  position: relative;
  flex-basis: calc(25% - 10px);
  margin: 5px;
  border: 1px solid;
  box-sizing: border-box;
}

.square-dashboard-rect {
  position: relative;
  flex-basis: calc(50% - 10px); 
  margin: 5px;
  border: 1px solid;
  box-sizing: border-box;
}

.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus {
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.25;
}


.square-dashboard::before{
  content: '';
  display: block;
  padding-top: 100%;
}

.square-dashboard25::before{
  content: '';
  display: block;
  padding-top: 100%;
}

.square-dashboard-rect::before {
  content: '';
  display: block;
  padding-top: 50%; /* modified to make the tile half as tall as it is wide */
}

.square-dashboard .content-sdb, .square-dashboard25 .content-sdb, .square-dashboard-rect .content-sdb {
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  width: 100%;
  text-align:center;
  display: flex;               /* added for centered text */
  justify-content: center;     /* added for centered text */
  align-items: center;         /* added for centered text */
}

.img-home {
    width: 50%;
    margin-top: 10%;
}

.img-contact-info {
    margin-right: 3px;
}

.no_underline:hover, .no_underline:focus {
    text-decoration: none;
}

.link_square_dash:hover {
    color: white;
    text-decoration: none;
}


/*************************/
/*       dashboard       */
/*************************/


.db_tile_title {
    font-size: 14px;
    font-weight: bold;
    color: cadetblue;
    margin-top: 10px;
}

.db_tile_value {
    font-size: 48px;
    font-weight: bold;
    color: darkblue;
    margin-top: -8px;
}


.db_tile_img {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.db_img {
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    object-fit: fill;
    margin-top: 10px;
}

.db_color_level1 {
    color: red !important;
}

.db_color_level2 {
    color: orange; !important;
}

.db_color_level3 {
    color: dimgrey; !important;
}

.db_color_level4 {
    color: limegreen; !important;
}

.db_color_level5 {
    color: green !important;
}


/*************************/
/* square background */
/*************************/

.content-sdb-db {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.bg_square_home_border {
    background-color: white;
    border: steelblue;
    border-style: solid;
    border-radius: 30px;
    border-width: thin;
}

.bg_square_home_border:hover {
    background-color: steelblue;
    color: white !important;
}

.bg_square_blue_border,  .bg_square_mandarin0_border, .bg_square_mandarin1_border, .bg_square_mandarin2_border, .bg_square_mandarin3_border, .bg_square_green_border, .bg_square_cherry_border, .bg_square_admin_border, .bg_square_blue2_border, .bg_square_gray_border, .bg_square_purple_border, .bg_square_db_border, .bg_square_hidden, .bg_square_chocolate_border {
    background-color: white;
    border-color: steelblue;
    border-width: medium;
    border-radius: 30px;
}

.bg_square_blue_border {
    border-color: steelblue;
}

.bg_square_blue_border:hover {
    background-color: steelblue;
    color: white !important;
}

.bg_square_blue2_border {
    border-color: mediumslateblue;
}

.bg_square_blue2_border:hover {
    background-color: mediumslateblue;
    color: white !important;
}

.bg_square_gray_border {
    border-color: gray;
}

.bg_square_gray_border:hover {
    background-color: gray;
    color: white !important;
}


.bg_square_chocolate_border {
    border-color: chocolate;
}

.bg_square_chocolate_border:hover {
    background-color: chocolate;
    color: white !important;
}


.bg_square_mandarin0_border {
    border-color: #FF9400;
}

.bg_square_db_border {
  border-color: cadetblue;
  border-style: double;
}

.bg_square_hidden {
  border-style: hidden;
}

.bg_square_mandarin0_border:hover {
    background-color: #FF9400;
    color: white !important;
}

.bg_square_mandarin1_border {
    border-color: #FF7800;
}

.bg_square_mandarin1_border:hover {
    background-color: #FF7800;
    color: white !important;
}

.bg_square_mandarin2_border {
    border-color: #FF6200;
}

.bg_square_mandarin2_border:hover {
    background-color: #FF6200;
    color: white !important;
}

.bg_square_mandarin3_border {
    border-color: #FF4600;
}

.bg_square_mandarin3_border:hover {
    background-color: #FF4600;
    color: white !important;
}

.bg_square_green_border {
    border-color: forestgreen;
}

.bg_square_green_border:hover {
    background-color: forestgreen;
    color: white !important;
}

.bg_square_purple_border {
    border-color: purple;
}

.bg_square_purple_border:hover {
    background-color: purple;
    color: white !important;
}

.bg_square_cherry_border {
    border-color: #BA2710;
} 

.bg_square_cherry_border:hover {
    background-color: #BA2710;
    color: white !important;
}

.bg_square_admin_border {
    border-color: indianred;
}

.bg_square_admin_border:hover {
    background-color: indianred;
    color: white !important;
}

.color_sblue, .color_sblue:focus {
    color: steelblue;
}

.color_sblue2, .color_sblue2:focus {
    color: mediumslateblue !important;
}

.color_sgray, .color_sgray:focus {
    color: gray !important;
}


.color_chocolate, .color_chocolate:focus {
    color: chocolate !important;
}

.square-dashboard:hover > .content-sdb > .color_chocolate, .square-dashboard:hover > .content-sdb > .color_cherry, .square-dashboard:hover > .content-sdb > .color_mandarin0, .square-dashboard:hover > .content-sdb > .color_mandarin1, .square-dashboard:hover > .content-sdb > .color_mandarin2, .square-dashboard:hover > .content-sdb > .color_mandarin3, .square-dashboard:hover > .content-sdb > .color_fgreen, .square-dashboard:hover > .content-sdb > .color_sblue2, .square-dashboard:hover > .content-sdb > .color_sgray, .square-dashboard:hover > .content-sdb > .color_admin,  .square-dashboard:hover > .content-sdb > .color_purple, .square-dashboard:hover > .content-sdb > .link_square_dash2 {
    color: white !important;
}

.color_mandarin0, .color_mandarin0:focus {
    color: #FF9400 !important;
}

.color_mandarin1, .color_mandarin1:focus {
    color: #FF7800 !important;
}

.color_mandarin2, .color_mandarin2:focus {
    color: #FF6200 !important;
}

.color_mandarin3, .color_mandarin3:focus {
    color: #FF4600 !important;
}

.color_fgreen, .color_fgreen:focus {
    color: forestgreen !important;
}

.color_purple, .color_purple:focus {
    color: purple !important;
}

.color_cherry, .color_cherry:focus {
    color: #BA2710 !important;;
}

.color_admin, .color_admin:focus {
    color: indianred !important;
}

.link_square_dash2:hover {
    color: white;
}


.link_square_dash2:focus {
    color: steelblue;
}

.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {
    font-size: 20px !important;
}

/*.square-dashboard:hover > .content-sdb > .link_square_dash2 {
    color: white;
}*/

/*.content-sdb:hover > .link_square_dash2 {
    color: white;
}*/


.bg_square_blue {
    background-color: royalblue; 
}



.bg_square_home {
    background-color: steelblue;
    border: darkblue;
    border-style: solid;
}



.bg_square_admin {
    background-color: indianred;
}

.bg_square_mandarin {
    background-color: #FF7800;
}


.bg_square_mandarin_l0 {
    background-color: #FF9400;
}



.bg_square_mandarin_l1 {
    background-color: #FF6200;
}

.bg_square_mandarin_l2 {
    background-color: #FF4600;
}

.bg_square_cherry {
    background-color: #BA2710;
}

.bg_square_green  {
    background-color: forestgreen;
}


.bg_square_home:hover, .bg_square_blue:hover, .bg_square_mandarin:hover, .bg_square_mandarin_l0:hover, .bg_square_mandarin_l1:hover, .bg_square_mandarin_l2:hover, .bg_square_cherry:hover, .bg_square_green:hover,.bg_square_admin:hover  {
    opacity: 75%;
}

.color_transparent {
    color: transparent;
}


/*************************/
/* blink */
/*************************/

.tdblink {
    animation: blinker 2s cubic-bezier(0,.2,.84,.96) infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}



/*************************/
/* dropdown */
/*************************/

.dropdown-menu {
    font-size: 14px;
    /* background: #f6f6f6; */
    background-color: steelblue;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    color: white;
    /* color: #555;
    background: #f6f6f6; */
    background-color: steelblue;
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    color: steelblue;
    text-decoration: none;
    background-color: #f0f0f0;
}


.dropdown-menu > li > a {
    color: white;
}

.dropdown-toggle {
    font-weight: bold;
}

.dropdown-toggle:focus {
    color: white !important;
}

.dropdown-menu > li > a {
    color: white;
}


/*************************/
/* pagination */
/*************************/

.pagination {
    margin-bottom: 20px;
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
}


/*************************/
/* maintenance */
/*************************/

.maintenance-page, .maintenance-page-admin, .error-page { 
    display: block; 
    margin: 0 auto; 
}


.maintenance-page, .maintenance-page-admin { 
    text-align: left;  
}

.error-page { 
    text-align: center;  
}

.maintenance-page-admin { 
    padding: 30px 150px;
}


.maintenance-title, .error-title {
    font-size: 46px;
}

.error-title {
    margin-bottom: 0px;
}

.maintenance-body, .maintenance-body-admin, .error-body {
    font-size: 18px;
}


.maintenance-body-admin{
    margin-top: 20px;
    background: #eee;
    padding: 5px 15px;
    border-radius: 15px;
}

.maintenance-title, .maintenance-body, .maintenance-page, .error-title, .error-body, .error-page {
    color: #333;
    font-family: Helvetica, sans-serif;
}

.maintenance-btn {
    background-color: #999;
    border-color: #aaa;
    color: white;
    border-radius: 15px;
}

.maintenance-btn:hover {
    background-color: #666;
    border-color: #777;
    color: white;
}

.nl3 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-left: 5px !important;
    margin-bottom: 1px !important;
    height: 30px;
}


/*************************/
/* text misc             */
/*************************/


.text-with-bg-1 {
    font-size: 18px;
    margin-top: 20px;
    background: #eee;
    padding: 5px 15px;
    border-radius: 15px;
}


.text-ok-1 {
    color: green;
    font-weight: bold;
}


.text-ko-1, .text-ko-1-link, .text-ko-1-link:hover, .text-ko-1-link:focus {
    color: red;
}

.text-ko-2, .text-ko-2-link, .text-ko-2-link:hover, .text-ko-2-link:focus {
    color: darkorange;
}

.text-ko-1, .text-ko-2, .text-ko-1-link, .text-ko-2-link {
    font-weight: bold;
}

.text-ko-1-link, .text-ko-2-link {
    font-size: 14px;
}

.text-ko-1-link:hover, .text-ko-1-link:focus, .text-ko-2-link:hover, .text-ko-2-link:focus {
    text-decoration: underline;
}


.header-acc-1 {
    margin: 10px 0;
    font-size: larger;
    font-weight: bold;
}






/*************************/
/* switch button */
/*************************/


 /* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
} 



/*************************/
/* rate */
/*************************/

.rate-1, .rate-2, .rate-3, .rate-4, .rate-5 {
    color: white;
    font-weight: bold;
}

.rate-1 {
    background: orangered;
}

.rate-2 {
    background: darkorange;
}

.rate-3 {
    background: gold;
}

.rate-4 {
    background: limegreen;
}

.rate-5 {
    background: green;
}

.dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    display: inline-block;
}

.badge {
    padding: 6px 9px;
    border-radius: 15px;
}



.group-link {
    color: maroon;
}

.alert {
    margin-top: 20px;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-radius: 4px;
}

.alert-error {
    color: firebrick;
    background-color: linen;
    border-color: crimson;
}

.alert-info {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}

.slider_label {
    font-weight: bold;
    vertical-align: middle;
    padding-right: 10px;
}

.glyphicon-big{
    font-size: 14px;
}

.glyphicon-very-big{
    font-size: 16px;
}

.glyphicon-very-big-plus{
    font-size: 18px;
}

.glyphicon-size {
    font-size: 12px;
}

.glyphicon-color {
    color: crimson;
}

#multicheck {
    list-style-type: none;
    margin-left: -40px;
}

.home-info {
    text-align: left !important;
    justify-content: left !important;
    padding-left: 20px;
    align-items: normal !important;
    padding-top: 40px;
    line-height: 2;
}

.upperletter {
    font-size: 24px;
    background: steelblue;
    color: white;
    padding: 0px 5px;
    border-radius: 25%;
}

.upperletterchat {
    color: white;
    font-size: 24px;
    background: steelblue;
    padding: 5px 15px;
    border-radius: 50%;
}

.upperletterchat2 {
    color: white;
    font-size: 22px;
    padding: 4px;
    border-radius: 50%;
    width: 42px;
    display: inline-block;
    height: 42px;
    text-align: center;
    /* font-weight: bold; */
    /* border: 2px solid #666; */
}



.contact-list {
    height: 60px;
}

.td-contact-list {
    padding-top: 14px !important;
}

.direct-chat-messages {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    padding: 10px 0px;
    /*height: 250px;*/
    overflow: auto
}
.direct-chat-messages {
    -webkit-transition: -webkit-transform .5s ease-in-out;
    -moz-transition: -moz-transform .5s ease-in-out;
    -o-transition: -o-transform .5s ease-in-out;
    transition: transform .5s ease-in-out
}

.direct-chat-msg {
    margin-bottom: 5px
}

.direct-chat-msg,
.direct-chat-text {
    display: block
}

.direct-chat-info {
    display: block;
    margin-bottom: 2px;
}

.direct-chat-name{
    font-size: 14px;
    font-weight: bold;
    color: #444;
}

.direct-chat-timestamp {
    color: #666;
    font-size: 11px;
    padding: 4px 3px 0px 0px;
    margin: 0 70px;
}

.direct-chat-img {
    border-radius: 50%;
    float: left;
    width: 40px;
    height: 40px
}

.direct-chat-text, .direct-chat-text-unread {
    border-radius: 5px;
    position: relative;
    padding: 10px;
    border: 1px solid #ccc;
    margin: 0px 70px 0 70px;
    /* margin: 5px 0 0 50px; */
    color: #444;
    font-size: 12px;
}

.direct-chat-text {
    background: lemonchiffon; /* #ffffe6; */
}

.mess-unread {
    /* background: #ffffaa;
    border: 1px solid crimson; 
    background: palegoldenrod;*/
    border: 4px solid steelblue;
}

.direct-chat-text:before {
    border-width: 6px;
    margin-top: -6px
}

.direct-chat-text:after,
.direct-chat-text:before {
    position: absolute;
    right: 100%;
    top: 15px;
    border: solid transparent;
    /*border-right-color: #d2d6de;*/
    content: ' ';
    height: 0;
    width: 0;
    pointer-events: none
}

.direct-chat-text:after {
    border-width: 5px;
    margin-top: -5px;
}


.direct-chat-msg:after {
    clear: both;
}

.direct-chat-msg:after {
    content: "";
    display: table;
}

.right .direct-chat-img {
    float: right;
}

.direct-chat-msg.right {
    margin-left: 70px;
}

.direct-chat-msg.left {
    margin-right: 70px;
}

.right .upperletterchat {
    float: right !important;
}

.right .direct-chat-text, .right .direct-chat-text-unread {
    margin-right: 70px;
    margin-left: 70px
}

.box-body:before,
.box-body:after {
    content: "";
    display: table
}

.direct-chat .box-body {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    position: relative;
    overflow-x: hidden;
    padding: 0
}

.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px 0px;
}

.send-chat-message{
    font-size: 12px !important;
    /*height: 100px !important;*/
}

.send-chat-message .input-sm {
    width: 90%;
}

.btn-group-sm > .btn, .btn-sm {
    padding: 5px 30px;
    /*border-radius: 25%;*/
    margin-left: 2px !important;
}

.bg-purple {
    background: purple
}

.bg-indigo {
    background: indigo
}

.bg-brown {
    background: brown
}

.bg-crimsom {
    background: crimsom
}

.bg-midnightblue {
    background: midnightblue
}

.bg-mediumblue {
    background: mediumblue
}

.bg-darkred {
    background: darkred
}

.bg-firebrick {
    background: firebrick
}

.bg-red {
    background: red
}

.bg-goldenrod {
    background: goldenrod
}

.bg-forestgreen {
    background: forestgreen
}

.bg-darkgreen {
    background: darkgreen
}

.bg-olivedrab {
    background: olivedrab
}

.bg-darkorchid {
    background: darkorchid
}

.bg-royalblue {
    background: royalblue
}

.bg-dodgerblue {
    background: dodgerblue
}

.bg-coral {
    background: coral
}

.bg-grey {
    background: grey
}

.bg-orange {
    background: orange
}

.room-user-row {
    vertical-align: middle !important;
    height: 75px;
}

.envelope-to-read {
    color: #ffeea3 !important;
}

.red-circle {
    width: 10px;
    height: 10px;
    background: red;
    display: inline-block;
    vertical-align: middle;
}

.red {
    color:red;
}

.red-message {
    color:#d11;
}

.nav-user {
    padding-right: 7px !important;
}

.resa-bold {
    font-weight: bold;
}

.resa-alert {
    color: red;
}

.resa-bold, .resa-alert, .resa {
    padding: 3px 0;
}

.btn-form-control {
    -webkit-appearance: button;
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    display: inline-block;
    padding: 6px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    margin: 0;
    font: inherit;

}

.btn-form-control:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
    text-decoration: none;
}

.btn-form-control:focus {
    text-decoration: none;
}

.h30 {
    height: 30px;
}

.h40 {
    height: 40px;
}

.a-space {
    height: 34px;
}

.home-message-number {
    position: absolute;
    bottom: 105px;
    left: 140px;
    font-size: 22px;
    color: white;
    font-weight: bold;
    border-radius: 50px;
    padding: 2px 12px;
    background: #d11;
}


.chat-text-box {
    resize: vertical;
    margin-left: 70px;
    width:  1000px !important;
}

.send-icon2 {
    background: var(--background-url) no-repeat 0px 0px;
    background-color: #337ab7;
    border-color: #2e6da4;
    height: 48px;
    /* width: 20px; */
    padding: 0px 24px;
    border-radius: 19% !important;
    margin-left: 2px !important;
}

.send-icon3 {
    background: var(--background-url2) no-repeat 0px 0px;
    background-color: #337ab7;
    border-color: #2e6da4;
    height: 64px;
    /* width: 20px; */
    padding: 0px 32px !important;
    border-radius: 20% !important;
    margin-left: 3px !important;
}


.toread_in_tab {
    font-weight: bold;
    color: white;
    background: #d11;
    border-radius: 20%;
    padding: 2px 5px 2px 4px;
}

.message_empty_space{
    padding-top: 5px;
    padding-bottom: 6px;
}


table td.td_shrink {
  white-space: nowrap;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

table td.td_expand {
  width: 99%
}

.trhl {
    background-color: greenyellow !important;
}

.change_password {
    color: crimson;
    margin: 15px 0px;
    background-color: #ffa;
    display: inline-block;
    padding: 10px;
}

.auto-width {
    width: auto !important;
}

.btn-limit2 {padding: 6px 12px;}









@media (min-width:0px){.square-dashboard{flex-basis: calc(50% - 10px)}}
@media (min-width:0px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:10px}}
@media (min-width:0px){p, body, .btn{font-size:10px}}
@media (min-width:0px){.form_message_ref {margin-left: 0px}}
@media (min-width:0px){.chat-text-box {resize: vertical;margin-left: 0px;width: 100% !important;}}
@media (min-width:0px){.direct-chat-text, .direct-chat-text-unread{font-size:10px}}
@media (min-width:0px){.send-chat-message {font-size: 10px !important}}
@media (min-width:0px){.direct-chat-name {font-size: 12px}}
@media (min-width:0px){.upperletterchat2 {font-size: 14px;padding: 4px;width: 30px;height: 30px;}}
@media (min-width:0px){.font14 {font-size: 10px;}}
@media (min-width:0px){.font16 {font-size: 12px;}}
@media (min-width:0px){.font18 {font-size: 14px;}}
@media (min-width:0px){.font20 {font-size: 16px;}}
@media (min-width:0px){.direct-chat-timestamp {font-size: 9px}}
@media (min-width:0px){.direct-chat-msg.right {margin-left: 20px;}}
@media (min-width:0px){.direct-chat-msg.left {margin-right: 20px;}}
@media (min-width:0px){.navbar-default .navbar-brand{font-size: 20px; height:auto;}}
@media (min-width:0px){.navbar-brand {padding: 0px 15px;line-height: normal;}}
@media (min-width:0px){.navbar {min-height: auto}}
@media (min-width:0px){.text_very_big {font-size: 30px}}
@media (min-width:0px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:12px !important}}
@media (min-width:0px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:12px}}
@media (min-width:0px){.h30, .nl3 {height:25px}}
@media (min-width:0px){.form-control {height:20px; font-size: 10px; padding: 0px 4px; display: inline-block;}}
@media (min-width:0px){.form-control-lot {height:20px; font-size: 10px}}
@media (min-width:0px){.btn-limit1, .btn {padding: 3px;}}
@media (min-width:0px){.form-control-8, .form-control-4, .form-control-10 {padding-left: 2px;}}
@media (min-width:0px){.form-control-10 {width: 20% !important;}}
@media (min-width:0px){.form-control-8 {width: 20% !important;}}
@media (min-width:0px){.form-control-4 {width: 8% !important;}}
@media (min-width:0px){.hideme {display: none}}

@media (min-width:280px){.navbar-default .navbar-brand{font-size: 22px; height:auto;}}
@media (min-width:280px){.text_very_big {font-size: 34px}}
@media (min-width:280px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:14px !important}}
@media (min-width:280px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:14px}}
@media (min-width:280px){p, body, .btn{font-size:11px}}
@media (min-width:280px){.h30, .nl3 {height:20px}}
@media (min-width:280px){.form-control {height:20px; font-size: 11px; padding: 0px 4px}}
@media (min-width:280px){.form-control-lot {height:20px; font-size: 11px}}

@media (min-width:330px){.navbar-default .navbar-brand{font-size: 24px; height:auto;}}
@media (min-width:330px){.text_very_big {font-size: 38px}}
@media (min-width:330px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:15px !important}}
@media (min-width:330px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:15px}}
@media (min-width:330px){p, body, .btn{font-size:11px}}

@media (min-width:460px){.navbar-default .navbar-brand{font-size: 28px; height:auto;}}
@media (min-width:460px){.square-dashboard{flex-basis: calc(33% - 10px)}}
@media (min-width:460px){.text_very_big {font-size: 42px}}
@media (min-width:460px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:15px !important}}
@media (min-width:460px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:15px}}
@media (min-width:460px){.btn-limit1, .btn {padding: 4px 12px;}}
@media (min-width:460px){.form-control-10 {width: 14% !important;}}
@media (min-width:460px){.form-control-8 {width: 12% !important;}}

@media (min-width:500px){.navbar-default .navbar-brand{font-size: 30px; height:auto;}}
@media (min-width:500px){.text_very_big {font-size: 46px}}
@media (min-width:500px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:15px !important}}
@media (min-width:500px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:15px}}
@media (min-width:500px){p, body, .btn{font-size:12px}}
@media (min-width:500px){.direct-chat-text, .direct-chat-text-unread{font-size:11px}}
@media (min-width:500px){.send-chat-message {font-size: 11px !important}}
@media (min-width:500px){.direct-chat-name {font-size: 13px}}
@media (min-width:500px){.upperletterchat2 {font-size: 16px;padding: 5px;width: 34px;height: 34px;}}
@media (min-width:500px){.font14 {font-size: 11px;}}
@media (min-width:500px){.font16 {font-size: 13px;}}
@media (min-width:500px){.font18 {font-size: 15px;}}
@media (min-width:500px){.font20 {font-size: 17px;}}
@media (min-width:500px){.direct-chat-timestamp {font-size: 10px}}
@media (min-width:500px){.direct-chat-msg.right {margin-left: 30px;}}
@media (min-width:500px){.direct-chat-msg.left {margin-right: 30px;}}
@media (min-width:500px){.h30, .nl3 {height:25px}}
@media (min-width:500px){.form-control {height:25px; font-size: 12px; padding: 0px 4px;}}
@media (min-width:500px){.form-control-lot {height:25px; font-size: 12px}}


@media (min-width:600px){.navbar-default .navbar-brand{font-size: 32px; height:auto;}}
@media (min-width:600px){.navbar-brand {padding: 5px 15px;line-height: normal;}}
@media (min-width:600px){.text_very_big {font-size: 50px}}
@media (min-width:600px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:16px !important}}
@media (min-width:600px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:16px}}
@media (min-width:600px){p, body, .btn{font-size:13px}}
@media (min-width:600px){.h30, .nl3 {height:25px}}
@media (min-width:600px){.form-control {height:25px; font-size: 13px; padding: 0px 4px;}}
@media (min-width:600px){.form-control-lot {height:25px; font-size: 13px}}
@media (min-width:600px){.btn-limit1, .btn {padding: 4px 12px;}}
@media (min-width:600px){.form-control-10 {width: 12% !important;}}
@media (min-width:600px){.form-control-8 {width: 10% !important;}}
@media (min-width:600px){.form-control-4 {width: 6% !important;}}

@media (min-width:768px){.nav-link-area{width:730px}}
@media (min-width:768px){.square-dashboard{flex-basis: calc(25% - 10px)}}
@media (min-width:768px){p, body, .btn{font-size:14px}}
@media (min-width:768px){.anti-nav-collapse{display: none}}
@media (min-width:768px){.direct-chat-text, .direct-chat-text-unread{font-size:12px}}
@media (min-width:768px){.send-chat-message {font-size: 12px !important}}
@media (min-width:768px){.direct-chat-name {font-size: 14px}}
@media (min-width:768px){.upperletterchat2 {font-size: 18px;padding: 6px;width: 38px;height: 38px;}}
@media (min-width:768px){.font14 {font-size: 12px;}}
@media (min-width:768px){.font16 {font-size: 14px;}}
@media (min-width:768px){.font18 {font-size: 16px;}}
@media (min-width:768px){.font20 {font-size: 18px;}}
@media (min-width:768px){.direct-chat-timestamp {font-size: 11px}}
@media (min-width:768px){.direct-chat-msg.right {margin-left: 40px;}}
@media (min-width:768px){.direct-chat-msg.left {margin-right: 40px;}}
@media (min-width:768px){.navbar-default .navbar-brand{font-size: 34px; height:52px;}}
@media (min-width:768px){.navbar-brand {padding: 15px 15px;line-height: 20px;}}
@media (min-width:768px){.navbar {min-height: 50px}}
@media (min-width:768px){.text_very_big {font-size: 54px}}
@media (min-width:768px){.h30, .nl3 {height:25px}}
@media (min-width:768px){.form-control {height:26px; font-size: 14px; padding: 0px 6px;}}
@media (min-width:768px){.form-control-lot {height:25px; font-size: 14px}}
@media (min-width:768px){.btn-limit1, .btn {padding: 4px 12px;}}
@media (min-width:768px){.form-control-8, .form-control-4, .form-control-10 {padding-left: 4px;}}
@media (min-width:768px){.form-control-10 {width: 10% !important;}}
@media (min-width:768px){.form-control-8 {width: 8% !important;}}
@media (min-width:768px){.form-control-4 {width: 4% !important;}}

@media (min-width:992px){.nav-link-area{width:944px}}
@media (min-width:992px){.square-dashboard{flex-basis: calc(20% - 10px)}}
@media (min-width:992px){.text_very_big {font-size: 58px}}
@media (min-width:992px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:17px !important}}
@media (min-width:992px){.link_square_dash2, .link_square_dash2:hover, .link_square_dash2:focus{font-size:16px}}
@media (min-width:992px){p, body, .btn{font-size:14px}}
@media (min-width:992px){.direct-chat-text, .direct-chat-text-unread{font-size:13px}}
@media (min-width:992px){.send-chat-message {font-size: 13px !important}}
@media (min-width:992px){.direct-chat-name {font-size: 15px}}
@media (min-width:992px){.upperletterchat2 {font-size: 20px;padding: 6px;width: 42px;height: 42px;}}
@media (min-width:992px){.font14 {font-size: 13px;}}
@media (min-width:992px){.font16 {font-size: 15px;}}
@media (min-width:992px){.font18 {font-size: 17px;}}
@media (min-width:992px){.font20 {font-size: 19px;}}
@media (min-width:992px){.direct-chat-timestamp {font-size: 12px}}
@media (min-width:992px){.direct-chat-msg.right {margin-left: 50px;}}
@media (min-width:992px){.direct-chat-msg.left {margin-right: 50px;}}
@media (min-width:992px){.h30, .nl3 {height:25px}}
@media (min-width:992px){.form-control {height:28px; font-size: 14px; padding: 0px 8px;}}
@media (min-width:992px){.form-control-lot {height:25px; font-size: 14px}}
@media (min-width:992px){.btn-limit1, .btn {padding: 4px 12px;}}
@media (min-width:992px){.form-control-8, .form-control-4, .form-control-10 {padding-left: 6px;}}
@media (min-width:992px){.hideme {display: inline-block;}}

@media (min-width:1200px){.nav-link-area{width:1140px}}
@media (min-width:1200px){.chat-text-box {resize: vertical;margin-left: 70px;width: 1000px !important;}}
@media (min-width:1200px){.direct-chat-text, .direct-chat-text-unread{font-size:14px}}
@media (min-width:1200px){.send-chat-message {font-size: 14px !important}}
@media (min-width:1200px){.direct-chat-name {font-size: 16px}}
@media (min-width:1200px){.upperletterchat2 {font-size: 22px;padding: 5px;width: 42px;height: 42px;}}
@media (min-width:1200px){.font14 {font-size: 14px;}}
@media (min-width:1200px){.font16 {font-size: 16px;}}
@media (min-width:1200px){.font18 {font-size: 18px;}}
@media (min-width:1200px){.font20 {font-size: 20px;}}
@media (min-width:1200px){.direct-chat-timestamp {font-size: 13px}}
@media (min-width:1200px){.direct-chat-msg.right {margin-left: 70px;}}
@media (min-width:1200px){.direct-chat-msg.left {margin-right: 70px;}}
@media (min-width:1200px){.form_message_ref {margin-left: 70px}}
@media (min-width:1200px){.h30, .nl3 {height:30px}}
@media (min-width:1200px){.form-control {height:32px; font-size: 14px}}
@media (min-width:1200px){.form-control-lot {height:30px; font-size: 14px}}
@media (min-width:1200px){.btn-limit1, .btn {padding: 6px 12px;}}
@media (min-width:1200px){.link_square_dash2plus, .link_square_dash2plus:hover, .link_square_dash2plus:focus {font-size:18px !important}}

@media (min-width:0px){.home-message-number {position: absolute;bottom: 10px;left: 15px;font-size: 12px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 6px;background: #d11;}}
@media (min-width:150px){.home-message-number {position: absolute;bottom: 20px;left: 30px;font-size: 12px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 6px;background: #d11;}}
@media (min-width:230px){.home-message-number {position: absolute;bottom: 40px;left: 60px;font-size: 13px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 7px;background: #d11;}}
@media (min-width:260px){.home-message-number {position: absolute;bottom: 52px;left: 70px;font-size: 13px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 7px;background: #d11;}}
@media (min-width:290px){.home-message-number {position: absolute;bottom: 60px;left: 82px;font-size: 14px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 7px;background: #d11;}}
@media (min-width:330px){.home-message-number {position: absolute;bottom: 66px;left: 86px;font-size: 15px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 8px;background: #d11;}}
@media (min-width:350px){.home-message-number {position: absolute;bottom: 78px;left: 102px;font-size: 15px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 8px;background: #d11;}}
@media (min-width:390px){.home-message-number {position: absolute;bottom: 90px;left: 118px;font-size: 15px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 8px;background: #d11;}}
@media (min-width:430px){.home-message-number {position: absolute;bottom: 102px;left: 130px;font-size: 15px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 8px;background: #d11;}}
@media (min-width:460px){.home-message-number {position: absolute;bottom: 64px;left: 84px;font-size: 16px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 8px;background: #d11;}}
@media (min-width:500px){.home-message-number {position: absolute;bottom: 70px;left: 92px;font-size: 17px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 9px;background: #d11;}}
@media (min-width:550px){.home-message-number {position: absolute;bottom:84px;left: 108px;font-size: 17px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 9px;background: #d11;}}
@media (min-width:600px){.home-message-number {position: absolute;bottom:86px;left: 112px;font-size: 18px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}
@media (min-width:630px){.home-message-number {position: absolute;bottom:98px;left: 128px;font-size: 20px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}
@media (min-width:700px){.home-message-number {position: absolute;bottom: 110px;left: 144px;font-size: 20px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}
@media (min-width:768px){.home-message-number {position: absolute;bottom: 80px;left: 104px;font-size: 20px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}
@media (min-width:992px){.home-message-number {position: absolute;bottom: 84px;left: 112px;font-size: 20px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}
@media (min-width:1200px){.home-message-number {position: absolute;bottom: 105px;left: 140px;font-size: 22px;color: white;font-weight: bold;border-radius: 50px;padding: 2px 10px;background: #d11;}}

@media (min-width:0px){.maintenance-title, .error-title {font-size: 20px}}
@media (min-width:0px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 10px}}
@media (min-width:0px){.maintenance-page { padding: 10px}}
@media (min-width:280px){.maintenance-title, .error-title {font-size: 28px}}
@media (min-width:280px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 12px}}
@media (min-width:280px){.maintenance-page { padding: 20px}}
@media (min-width:320px){.maintenance-title, .error-title {font-size: 32px}}
@media (min-width:460px){.maintenance-title, .error-title {font-size: 40px}}
@media (min-width:460px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 14px}}
@media (min-width:460px){.maintenance-page { padding: 50px}}
@media (min-width:600px){.maintenance-title, .error-title {font-size: 44px}}
@media (min-width:600px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 15px}}
@media (min-width:600px){.maintenance-page { padding: 100px}}
@media (min-width:768px){.maintenance-title, .error-title {font-size: 46px}}
@media (min-width:768px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 16px}}
@media (min-width:768px){.maintenance-page { padding: 130px}}
@media (min-width:992px){.maintenance-title, .error-title {font-size: 50px}}
@media (min-width:992px){.maintenance-body, .maintenance-body-admin, .error-body {font-size: 18px}}
@media (min-width:992px){.maintenance-page { padding: 150px}}


@media (min-width:0px){.td100 {min-width: 0px;}}
@media (min-width:0px){.td200 {min-width: 0px;}}
@media (min-width:0px){.td300 {min-width: 0px;}}
@media (min-width:280px){.td100 {min-width: 25px;}}
@media (min-width:280px){.td200 {min-width: 50px;}}
@media (min-width:280px){.td300 {min-width: 75px;}}
@media (min-width:460px){.td100 {min-width: 50px;}}
@media (min-width:460px){.td200 {min-width: 100px;}}
@media (min-width:460px){.td300 {min-width: 150px;}}
@media (min-width:768px){.td100 {min-width: 70px;}}
@media (min-width:768px){.td200 {min-width: 140px;}}
@media (min-width:768px){.td300 {min-width: 210px;}}
@media (min-width:992px){.td100 {min-width: 100px;}}
@media (min-width:992px){.td200 {min-width: 200px;}}
@media (min-width:992px){.td300 {min-width: 300px;}}