tmx-multi-select {
  margin-left: 12px;

  margin-top: 15px;
  margin-right: 10px;
}
tmx-multi-select .tmx-multi-select label {
    color: #9e9e9e;
    height:16px;
    font-size: 14px;
    font-weight: 400;
    margin:0px 0px 8px 0px;
}
tmx-multi-select .tmx-multi-select span.md-select-icon {
    color: #757575;
    height:16px;
    font-size: 14px;
    font-weight: 400;
    margin:0px 0px 8px 0px;
}

tmx-multi-select .tmx-multi-select md-input-container  span {

}

tmx-multi-select .tmx-multi-select md-input-container .md-input.ng-invalid.ng-dirty,
tmx-multi-select .tmx-multi-select md-input-container.md-input-focused .md-input{
    padding:0px 0px -2px 0px;
    color: red;
}



tmx-multi-select[required] .tmx-multi-select md-input-container label::after{
    content:"*";
    color:Red;
    padding-left: 2px;
}


tmx-multi-select .tmx-multi-select md-select-value span:first-child {
  /*color: #9e9e9e;*/
  height:16px;
  font-size: 14px;
  font-weight: 400;
  margin:0px 0px 8px 0px;
}

tmx-multi-select .tmx-multi-select md-select-value {
  overflow: hidden !important;

}

tmx-multi-select .tmx-multi-select md-input-container.md-input-invalid md-select{
    border-bottom: 1px solid red;

}
tmx-multi-select .tmx-multi-select md-input-container.md-input-invalid md-select-value{
    border-bottom: 1px solid red;

}
tmx-multi-select[disabled="true"] .tmx-multi-select md-input-container md-select-value span {
  color: #9E9E9E !important;
}
tmx-multi-select .tmx-multi-select md-input-container span {
  width: 0px;
  word-wrap: break-word;
  margin-top: 4px !important;

}

tmx-multi-select .tmx-multi-select md-input-container.md-input-invalid span {
    color:red;
    padding:0px 0px 0px 0px;
    height:16px;
    font-size: 14px;
    font-weight: 400;
    margin:0px 0px 8px 0px;
}


tmx-multi-select .tmx-multi-select md-input-container.md-input-invalid span::after{
    color: #757575 !important;

}

md-select[disabled] md-select-value .md-select-icon{
  display: none;
}

tmx-warehouse-card {

}

tmx-warehouse-card .card-title-container {

  height: 55px;
  background-color: rgb(94, 53, 177);
}
tmx-warehouse-card .card-title-container-body {

  height: 55px;
  background-color: white;
}

tmx-warehouse-card .add-container {
  height: 166px; /* A pixel is added to cater the shadow*/
  background-color: rgb(250, 250, 250);

}

tmx-warehouse-card .add-warehouse {
  cursor: pointer;
  width: 45px;
  height: 45px;

}

tmx-warehouse-card .no-stock-container {

  height: 110px;

}
/*
tmx-warehouse-card .add-warehouse:hover {
  width: 50px;
  height: 50px;
}*/

/* MAIN app css stylesheet */
/*Applied to Private screens of home/Register/Login/Forgot/Reset Password*/

/*//////////////////////////////////   BACKGROUND IMAGE PUBLIC   /////////////////////////////////////////////////////////*/

.prov .Public_background {
    background-image: url("../images/BG_shopkeeper.jpg");
    margin-left: auto;
    margin-right: auto;
    /*background-color: aliceblue;*/
    background-position: right top;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    /*height:100%;*/

    height: 100vh;
    position: relative;
    max-width: 100%;
    max-height: 100%;
}
/*//////////////////////////////////   BACKGROUND IMAGE PUBLIC   /////////////////////////////////////////////////////////*/

.prov div .md-warn {
    font-size: 10pt !important;
    text-align: center;
    color: red;
    margin-bottom: 8px;
}
.prov div .success_msg{
    font-size: 10pt !important;
    text-align: center;
    color: #0091EA;
    margin-bottom: 8px;
}
/*//////////////////////////////////   TENANT REGISTER IMAGE PUBLIC  ////////////////////////////////////////////////////*/

.prov .tenant_image {
    position: relative;
    float: left;
}
.prov .circularImage {
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 50%;
    width: 100px;
    height: 110px;
    float: left;
}
.prov .imgText {
    position: absolute;
    top: 55px;
    padding-top: 5px;
    padding-left: 7.7px;
    left: 0;
    width: 90px;
    height: 50px;
    color: white;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    font-size: 10px;
}
.prov .imgText:hover {
    background-color: rgba(54, 25, 25, .4);
    font-size: 14px !important;
}
.prov .UploadText {
    float: left;
    display: none;
    font-size: 12px;
    margin-left: 5px;
    margin-top: 1px;
    font-weight: bold;
}
.prov .imgText:hover .UploadText {
    display: block;
}
.prov .imgText:hover .camera-icon {
    display: block;
    font-size: 14px;
    margin-left: 8px;
    text-shadow: none;
    opacity: 1;
}
.prov .camera-icon {
    text-shadow: 2px 2px 2px black;
    font-size: 20px;
    margin-left: 10px;
    margin-top: 14px;
    opacity: 0.5;
    color: white;
    transition: margin .5s;
}
/*//////////////////////////////////   TENANT REGISTER IMAGE PUBLIC  ////////////////////////////////////////////////////*/
/*////////////////////////////////////    HyperLinks  ///////////////////////////////////////////////////////////////*/
/* unvisited link */

.prov a {
    color: #0091EA;
}
/* visited link */

.prov a:visited {
    color: #3F51B5;
}
/* mouse over link */

.prov a:hover {
    color: #F44336;
}
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

.prov .home_heading {
    font-weight: 700;
    font-size: 24px;
    color: #FFFFFF;
}
/*//////////////////////////////////   BUTTONS START   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   PRIMARY/DEFAULT BUTTON   /////////////////////////////////////////////////////////*/

.prov .md-button.btn_primary,
md-dialog .md-actions .md-button.btn_primary ,
md-dialog md-dialog-actions .md-button.btn_primary {
    background-color: #0091EA;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: 140px;
    min-width: 64px;
    margin: 6px 8px 6px 8px;
    /*padding: 6px 8px 6px 8px;*/
}
.prov .btn_primary:not([disabled]),
md-dialog .md-actions .md-button.btn_primary:not([disabled]) ,
md-dialog md-dialog-actions .md-button.btn_primary:not([disabled])
{
    background-color: #0091EA;
    Color: #FFFFFF;
}
.prov .btn_primary:not([disabled]) span.ng-scope,
.prov .btn_primary[disabled] span.ng-scope{

}

.prov .btn_primary[disabled],
.prov .md-button .md-raised[disabled],
.prov .md-button[disabled],
md-dialog .md-actions .md-button.btn_primary[disabled],
md-dialog md-dialog-actions .md-button.btn_primary[disabled]
{
    background-color: #E0E0E0;
    Color: #9E9E9E;
}
.prov .btn_primary:not([disabled]):hover,
md-dialog .md-actions .md-button.btn_primary:not([disabled]):hover ,
md-dialog md-dialog-actions .md-button.btn_primary:not([disabled]):hover
{
    background-color: #0091EA !important;
    color: #FFFFFF;
}
.prov .btn_primary:not([disabled]):focus {
    background-color: #0091EA !important;
    color: white;
}
/*//////////////////////////////////   PRIMARY/DEFAULT  BUTTON   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   SECONDARY/SUCCESS BUTTON   /////////////////////////////////////////////////////////*/

.prov .btn_secondary,
md-dialog .md-actions .md-button.btn_secondary ,
md-dialog md-dialog-actions .md-button.btn_secondary
{
    background-color: #4CAF50;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: 140px;
    min-width: 64px;
    margin: 6px 8px 6px 8px;
    /*padding: 6px 8px 6px 8px;*/
}
.prov .btn_secondary[disabled],
md-dialog .md-actions .md-button.btn_secondary[disabled] ,
md-dialog md-dialog-actions .md-button.btn_secondary[disabled]
{
    background-color: #E0E0E0;
    Color: #757575;
}
/*//////////////////////////////////   SECONDARY/SUCCESS BUTTON   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   WARNING BUTTON   /////////////////////////////////////////////////////////*/

.prov .btn_warning,
md-dialog .md-actions .md-button.btn_warning ,
md-dialog md-dialog-actions .md-button.btn_warning
{
    background-color: #D84315;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: 140px;
    min-width: 64px;
    margin: 6px 8px 6px 8px;
    /*padding: 6px 8px 6px 8px;*/
}
.prov .btn_warning[disabled],
md-dialog .md-actions .md-button.btn_warning[disabled] ,
md-dialog md-dialog-actions .md-button.btn_warning[disabled]
{
    background-color: #E0E0E0;
    Color: #757575;
}
/*//////////////////////////////////   WARNING BUTTON   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   DISABLED BUTTON   /////////////////////////////////////////////////////////*/

.prov .btn_gray {
    background-color: #9E9E9E;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: 140px;
    min-width: 64px;
    margin: 6px 8px 6px 8px;
    /*padding: 6px 8px 6px 8px;*/
}
.prov .btn_gray[disabled] {
    background-color: #E0E0E0;
    Color: #757575;
}
/*//////////////////////////////////  DISABLED BUTTON   /////////////////////////////////////////////////////////*/


/*//////////////////////////////////   BUTTONS WITH ICONS START   /////////////////////////////////////////////////////////*/
/* md-button outer container for the icon */

.prov .md-button .icon {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: auto;
    margin: 6px 8px 6px 8px;
}
.prov .md-button:not([disabled]) .icon,
.prov .md-button[disabled] .icon {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    height: 36px;
    width: auto;
    margin: 6px 8px 6px 8px;
    padding: 0px 0px 0px 0px;
}
/*  MD ICON and TEXT WITHIN THE BUTTON */

.prov .md-button:not([disabled]) ng-md-icon,
.prov .md-button[disabled] ng-md-icon {
    /*margin:0px 8px 0px 8px;*/

    vertical-align: middle;
    padding: 0px 0px 0px 0px;
}
.prov .md-button:not([disabled]) .ng-scope,
.prov .md-button[disabled] .ng-scope {
    /*margin: 6px 8px 6px 8px;*/
}
/* CUSTOM ICON BUTTON LOGIN PAGE */

.prov .facebookbtn {
    background-color: #2b4170;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #3b5998, #2b4170);
    background: -ms-linear-gradient(top, #3b5998, #2b4170);
    background: -webkit-linear-gradient(top, #3b5998, #2b4170);
    border: 1px solid #2b4170;
    text-shadow: 0 -1px -1px #1f2f52;
    color: white;
}
.prov .facebookbtn:hover {
    background-color: #3b5998;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #2b4170, #3b5998);
    background: -ms-linear-gradient(top, #2b4170, #3b5998);
    background: -webkit-linear-gradient(top, #2b4170, #3b5998);
}
.prov .googleplus {
    background-color: #c33219;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #e64522, #c33219);
    background: -ms-linear-gradient(top, #e64522, #c33219);
    background: -webkit-linear-gradient(top, #e64522, #c33219);
    border: 1px solid #c33219;
    color: white !important;
    text-shadow: 0 -1px -1px #972412;
}
.prov .googleplus:hover {
    background-color: #e64522;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #c33219, #e64522);
    background: -ms-linear-gradient(top, #c33219, #e64522);
    background: -webkit-linear-gradient(top, #c33219, #e64522);
}
.prov .btnTwitter {
    background-color: #0081ce;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #00aced, #0081ce);
    background: -ms-linear-gradient(top, #00aced, #0081ce);
    background: -webkit-linear-gradient(top, #00aced, #0081ce);
    border: 1px solid #0081ce;
    text-shadow: 0 -1px -1px #005ea3;
    color: white;
}
.prov .btnTwitter:hover {
    background-color: #00aced;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #0081ce, #00aced);
    background: -ms-linear-gradient(top, #0081ce, #00aced);
    background: -webkit-linear-gradient(top, #0081ce, #00aced);
}
.prov .facebookbtn:disabled,
.prov .googleplus:disabled {
    background-color: #E0E0E0;
    /* fallback color */
    min-width:70%
background: -moz-linear-gradient(top, #E0E0E0, #E0E0E0);
    background: -ms-linear-gradient(top, #E0E0E0, #E0E0E0);
    background: -webkit-linear-gradient(top, #E0E0E0, #E0E0E0);
    border: 1px solid #E0E0E0;
    text-shadow: 0 -1px -1px #757575;
    color: #757575;
    font-size: 14px;
    font-weight: 400;
}
/* CUSTOM ICON BUTTON LOGIN PAGE */
/*//////////////////////////////////   BUTTONS WITH ICONS END   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   BUTTONS END   /////////////////////////////////////////////////////////*/
/*//////////////////////////////////   REGISTER LOGO  /////////////////////////////////////////////////////////*/

.prov .logo_register {
    padding-top: 20px !important;
    margin-bottom:16px;
    margin-left: auto;
    margin-right: auto;
    width: 180px !important;
    height: 80px;
    position: relative;
}
/*////////////////////////////////////////  TMX TEXTBOX ///////////////////////////////////////////////////////////////*/
.prov form tmx-textbox .tmx-textbox md-input-container{
    margin:0px 16px;
}
.prov .md-input-has-value label:first-child{
    margin-bottom:16px;
}
.prov form tmx-textbox .tmx-textbox md-input-container .md-input-focused label:not(.md-no-float){
    margin-bottom:16px;
}
.prov form tmx-textbox {
    padding: 0;
}
/*////////////////////////////////////////LABEL DEFAUlT///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container label,
.prov md-input-container label
{
    font-size: 14px;
    font-weight: 400;
    Color: #0091EA;
    height: 7px;
    margin: 0px 0px 16px 0px;
    /*margin-bottom:8px;*/
}
/*////////////////////////////////////////LABEL DISABLED///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container label.disable_label,
    /*.prov md-input-container .md-input[disabled],*/
    /*.prov form tmx-textbox div md-input-container .md-input[disabled]*/
{
    font-size: 14px;
    font-weight: 400;
    Color: #9E9E9E;
    height: 16px;
    padding: 0px 0px 8px 0px;
}
/*////////////////////////////////////////LABEL ERROR///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container label.error_label,
.prov md-input-container label.error_label,
.prov tmx-textbox md-input-container .md-input-invalid.md-input-focused label{
    font-size: 14px;
    font-weight: 400;
    Color: red;
    height: 7px;
    padding: 0px 0px 8px 0px;
    width: auto;
}
/*////////////////////////////////////////LABEL END//////////////// ////////////////////////////////////////////*/
/*//////////////////////////////////////// INPUT TEXT FIELD DEFAULT///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container .md-input:not([disabled]),
.prov md-input-container .md-input:not([disabled]) {
    font-size: 14px;
    font-weight: 400;
    Color: #9E9E9E;
    /*height: 26px;*/
    border-bottom-color: #9E9E9E;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    /*margin:0px 0px 8px 0px;*/

    padding: 0;
}
/*//////////////////////////////////////// INPUT TEXT FIELD DISABLED///////// ////////////////////////////////////////////*/
.prov form tmx-textbox div md-input-container .md-input[disabled],
.prov md-input-container .md-input[disabled] {
    font-size: 14px;
    font-weight: 400;
    Color: #9E9E9E;
    height: 26px;
    padding: 0;
    /*border-bottom: dotted #9E9E9E 2px;*/
}


/*//////////////////////////////////////// INPUT TEXT FIELD FOCUS///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container .md-input:focus,
.prov md-input-container .md-input:focus,
.prov form tmx-textbox div md-input-container.md-input-focused .md-input,
.prov md-input-container.md-input-focused .md-input{
    font-size: 14px;
    font-weight: 400;
    Color: black;
    height: 26px;
    border-bottom-color: #0091EA;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    /*margin:0px 0px 8px 0px;*/

    padding: 0;
}
/*form tmx-textbox md-input-container .md-input.error_input{*/
/*font-size: 12px;*/
/*font-weight: 300;*/
/*Color: black;*/
/*height:26px;*/
/*border-bottom-color: #D84315;*/
/*border-bottom-style: solid;*/
/*border-bottom-width: 2px;*/
/*/!*margin:0px 0px 8px 0px;*!/*/
/*padding: 0px 0px 8px 0px;*/
/*}*/
/*////////////////////////////////////////INVALID FORM START//////////////// ////////////////////////////////////////////*/
/*////////////////////////////////////////INVALID INPUT TEXT FIELD///////// ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container.md-input-invalid .md-input,
.prov md-input-container.md-input-invalid .md-input,
.prov form tmx-textbox div md-input-container .md-input.ng-invalid.ng-dirty,
.prov md-input-container .md-input.ng-invalid.ng-dirty
{
    font-size: 14px;
    font-weight: 400;
    Color: black;
    height: 26px;
    border-bottom-color: #D84315;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    /*margin:0px 0px 8px 0px;*/

    padding: 0;
}
/*////////////////////////////////////////ERROR VALIDATION MESSAGES ////////////////////////////////////////////*/

.prov form tmx-textbox div md-input-container.md-input-invalid error-msg div[ng-message],
.prov md-input-container.md-input-invalid error-msg div[ng-message],
.prov form tmx-textbox div md-input-container error-msg div ng-messages,
.prov md-input-container error-msg div ng-messages,
.prov form tmx-textbox div md-input-container error-msg div[ng-messages],
.prov md-input-container error-msg div[ng-messages]{
    font-size: 14px;
    font-weight: 400;
    Color: red;
    padding: 0;
    display: inline-block;

}
/*////////////////////////////////////////INVALID FORM END//////////////// ////////////////////////////////////////////*/
/*////////////////////////////////////////  TMXTEXTBOX CSS END ////////////////////////////////////////////////////////*/
/*//////////////////////////////////////// CHECKBOX IN FORM ///////////// ////////////////////////////////////////////*/

.prov md-checkbox,
.prov form md-checkbox {
    padding: 0;
    font-weight: 400;
    font-size: 14px;
    color: #414141;
    float: left;
    margin:0px;
}
.prov md-checkbox .md-container {
    position: absolute;
    left: -24px;
    width: 48px;
    height: 48px;
    padding: 12px 12px 12px 12px;
    /*margin-right: 12px;*/
}
/*DEFAULT  MD CHECKBOX ICON*/

.prov md-checkbox .md-icon {
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
    background-color: white;
}
/*CHECKED BOX DEFAULT*/
.prov md-checkbox .md-label{
    margin-left:16px;
}
.prov md-checkbox.md-checked .md-icon {
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
    background-color: #0091EA;
}
/*CHECKED BOX WITH CENTERED CHECK IN MD ICON*/

.prov md-checkbox.md-checked .md-icon:after {
    width: 6px;
    height: 15px;
    top: 3px;
    left: 9px;
}
/*//////////////////////////////////////DISABLED CHECKBOX////////////////////////////*/

.prov md-checkbox[disabled] .md-label .ng-scope {
    color: #9E9E9E;
}
/*DISABLED CHECKED CHECK BOX*/

.prov md-checkbox.md-checked[disabled] .md-icon {
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
    background-color: #9E9E9E;
;
}
.prov md-checkbox.md-checked[disabled] .md-icon:after {
    width: 6px;
    height: 15px;
    top: 3px;
    left: 9px;
    background-color: #9E9E9E;
}
/*DISABLED CHECKED CHECK BOXES*/
/*DISABLED UNCHECKED CHECKBOX*/

.prov md-checkbox[disabled] .md-icon {
    width: 24px;
    height: 24px;
    top: 12px;
    left: 12px;
    background-color: white;
}
/*DISABLED UNCHECKED CHECKBOX*/
/*//////////////////////////////////////DISABLED CHECKBOX////////////////////////////*/

.prov md-checkbox .md-label .ng-scope {
    white-space: nowrap;
    /*padding-left: 12px;*/
    padding: 0px 0px 0px 8px;
    color: #414141;
}
/*//////////////////////////////////////// CHECKBOX IN FORM ///////////// ////////////////////////////////////////////*/
/*/////////////////////////////////////////////MD DIALOG//////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////MD DIALOG//////////////////////////////////////////////////////*/
/*////////////////////////////////////////CUSTOM STYLES  for various elements///////////// /////////////////////////////*/
/*Login Screen policy checkbox error validation message*/

.prov .policy_error div[ng-message] {
    text-align: center;
    padding: 0px 0px 0px 0px;
    margin-top:-10px;
}
.prov .md-toolbar-tools > button {
    min-width: 0px;
}
/*////////////////////////////////////////CUSTOM STYLES  for various elements///////////// /////////////////////////////*/

.prov .menu {
    list-style: none;
    border-bottom: 0.1em solid black;
    margin-bottom: 2em;
    padding: 0 0 0.5em;
}
.prov .menu:before {
    content: "[";
}
.prov .menu:after {
    content: "]";
}
.prov .menu > li {
    display: inline;
}
.prov .menu > li:before {
    content: "|";
    padding-right: 0.3em;
}
.prov .menu > li:nth-child(1):before {
    content: "";
    padding: 0;
}
.prov .inputdemoErrors .inputErrorsApp {
    min-height: 48px;
}
.prov .font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-size: 17px;
    src: local('Roboto Regular'), local('Roboto-Regular'), url(http://themes.googleusercontent.com/static/fonts/roboto/v11/2UX7WLTfW3W8TclTUvlFyQ.woff) format('woff');
}
/*.k-pdf-export .k-grid-toolbar,
        .k-pdf-export .k-pager-wrap
        {
            display: none;
        }

.fabToolbardemoBasicUsage md-fab-toolbar.md-right md-fab-trigger.align-with-text {
  left: 7px; }


  md-toast.md-success-theme {
    background-color: green;
    position: fixed;
}
md-toast.md-error-theme {
    background-color: red;
    position: fixed;
}
.md-fab.blue{
    color: blue;
}
*/
html, body, input, select, textarea, button {
    font-family: 'Lato', Arial, sans-serif;
}

body {
    color: #424242;
    font-size: 14px;
	font-weight: 400;
    overflow-y:hidden;

}

/*#full-list-grid table {
  margin-left: 0px !important;
}

#added-list-grid table {
  margin-left: 0px !important;
}*/
.usernamePasswordForLogin.flex.ng-animate.md-input-invalid.md-input-focused>label{
    padding-top: 15px !important;
}
.usernamePasswordForLogin.flex.md-input-focused>label{
    padding-top: 15px !important;
}
.sub-header-min {
    width: 100%;
    height: 37px;
    background-color: #F5F5F5 !important;
    border-bottom: solid 1px #E0E0E0;
    border-top: solid 1px #E0E0E0;
    padding-left: 24px;
}

.md-open-menu-container md-menu-content>*{
    margin:0px;
}
/*////Used in Role Management privilege dialog ////*/
.md-divider{
    border-bottom:solid rgba(0,0,0,0.12) 1px;
    margin:16px 0px;
}
.dividerMarginBottom{
    margin-bottom:0px;
}

md-checkbox.md-checked.green .md-icon {
    background-color: #4CAF50;


}
/*////////////////////////////*/
/*body,
.topbar-fixed {
    min-width: 1262px;
}*/

/* Fixed Topar */

.topbar-fixed {
    width: 100%;
    min-width: 1280px;
    height: 72px;

    position: fixed;
    top:0;
    left:0;
    z-index:0;
}

.breadcrumb-fixed {
    width: 100%;
    min-width: 1280px;
    height: 72px;

    position: fixed;
    z-index:99;
}

.error-div {
    width: 100%;
    margin-bottom: 4px;
    height: 72px;
    display:table-cell; /*for firefox correct spacing*/
}

.company_logo {
    width: 324px;
    height: 72px;
    /*border-right: 1px solid #e0e0e0;*/
    padding: 16px 24px 16px 16px;
}

.logo-area{
    padding-left: 8px
}

.tmxlogo{
    display: block;
    cursor: pointer;
    outline:none;
}

.leftnav-burger .md-button.md-icon-button{
    margin: 0 8px 0 0px;
}

/* Topbar right actions (username, settings, notifications, gravatar) */

.topbar-actions {
    padding: 16px;
}

.globalsearch-container{
    padding: 0 24px 0 8px;
}

.global-actions {
    padding: 0px 0px 0px 16px;
}

.global-actions .welcome-user {
    padding: 0 16px;
}

.welcome-role{
    font-size: 14px;
    color:#4CAF50;
}


/* Layout changes */

.app-content {
    margin: 133px 0 0 324px;
}




.md-autocomplete-suggestions-container li:hover{
    background-color: #E0E0E0;
}
.md-autocomplete-suggestions-container li:focus{
    background-color: #E0E0E0;
}
.md-autocomplete-suggestions-container li:visited{
    background-color: #E0E0E0;
}
.md-autocomplete-suggestions-container li:active{
    background-color: #E0E0E0;
}
.md-autocomplete-suggestions-container li.selected{
    background-color: #E0E0E0;
}
.md-button{
    font-size: 14px;
    font-weight: 400;
    min-width: 64px;
}

.tmx-button {
    font-size: 20px;
    height:20px;
    width:20px;
    padding-right:4px;
}
.top-bar{
    background-color: #ffffff !important;
    min-height:73px;
    border-bottom:#E0E0E0 1px solid;
}

.border-bottom{
    border-bottom:#E0E0E0 1px solid;
}

.padding-none{
    padding:0 !important;
}
.margin-none{
    margin:0  !important;
}
.box-shadow-none{
    box-shadow:none;

}
.margin-top-bottom-32{
    margin-top:32px;
    margin-bottom:32px;
}
.margin-top-80{
    margin-top:80px  !important;
}
.margin-right-8{
    margin-right:8px  !important;
}
.margin-left-8{
    margin-left:8px  !important;
}
.margin-bottom-4{
    margin-bottom:4px  !important;
}
.margin-bottom-8{
    margin-bottom:8px  !important;
}
.margin-bottom-24{
    margin-bottom:24px  !important;
}
.margin-bottom-70{
    margin-bottom:70px  !important;
}
.margin-bottom-34{
    margin-bottom:34px  !important;
}
.padding-bottom-4{
    padding-bottom:4px  !important;
}
.margin-top-8{
    margin-top:8px  !important;
}
.padding-top-8{
    padding-top:8px  !important;
}

.padding-top-18{
    padding-top:18px  !important;
}
.padding-left-8{
    padding-left:8px  !important;
}
.margin-top-16{
    margin-top:16px  !important;
}

.margin-top-28-minus{
    margin-top: -28px !important;
}

.margin-left-right-10{
    margin-left: 10px;
    margin-right: 10px;
}

.margin-top-10{
    margin-top:10px  !important;
}
.margin-right-16{
    margin-right:16px  !important;
}
.margin-left-16{
    margin-left:16px  !important;
}
.padding-right-16{
    padding-right:16px  !important;
}
.padding-left-16{
    padding-left:16px  !important;
}
.padding-24{
    padding:24px;
}

.padding-24-no-right{
    padding:24px 0px 24px 24px;
}

.padding-left-24{
    padding-left: 24px !important;
}

.padding-left-right-24{
    padding:0px 24px 0px 24px;
}

.padding-left-right-12{
    padding:0px 12px 0px 12px;

}
.padding-24-no-top{
    padding:0px 24px 24px 24px;
}

.padding-24-no-top-no-right{
    padding:0px 0px 24px 24px;
}

.margin-top-29{
    margin-top:29px  !important;
}

.margin-top-14{
    margin-top:14px  !important;
}

.margin-top-44{
    margin-top:44px  !important;
}
.margin-top-2{
    margin-top:2px  !important;
}
.margin-top-45{
    margin-top:45px  !important;
}
.margin-top-40{
    margin-top:40px  !important;
}
.margin-top-20{
    margin-top:20px  !important;
}
.padding-bottom-16{
    padding-bottom:16px  !important;
}
.margin-right-24{
    margin-right:24px  !important;
}
.margin-left-24{
    margin-left:24px  !important;
}
.padding-right-24{
    padding-right:24px  !important;
}
.margin-left-32{
    margin-left:32px  !important;
}
.padding-left-32{
    padding-left:32px  !important;
}
.margin-left-64{
    margin-left:64px  !important;
}
.no-padding{
    padding: 0  !important;
}

.padding-16{
    padding:16px  !important;
}

.padding-18-no-top-bottom{
    padding:0px 18px 0px 18px  !important;
}

.padding-18-no-bottom{
    padding:18px 18px 0px 18px  !important;
}


.padding-18-10-Left-no-bottom{
    padding:18px 18px 0px 10px  !important;
}
.padding-8{
    padding:8px  !important;
}
.padding-10{
    padding:10px  !important;
}
.menu-list-item{
    color:#757575 !important;
}
.menu-list-item.Active-row-icon{
    color:#4CAF50 !important;
}
.menu-list-item.active{
    color:#4CAF50 !important;
}
i.menu-list-item{
    font-size:24px;

}

.menu-list-item-grid{
    padding-left:10px;
    right:-10px;
    padding-top:4px;
    padding-bottom:0px;
}

/* For fixing the breadcrumb header to scroll*/
.breadcrumbs{
    background-color: rgb(245,245,245);
    padding: 8px 16px;
    position: fixed;
    top: 72px;
    left: 324px;
    right: 0;
    z-index: 64;
    height: 60px;
}

.page-title .md-fab.md-button{
    margin: 0 8px;
}

.pagetitle-actions .md-button {
    width: 36px;
    height: 36px;
    margin: 8px 0 0 8px;
    min-width: auto;
}

.pagetitle-actions .md-button .fa {
    font-size: 24px;
    line-height: 1;
}

md-content.layout-fill {
    /*top: 53px;
    65px;
    padding: 8px 0px 60px 0px;*/
}
/*md-content{
    overflow-x:hidden;
}*/

.layout-fill {
    margin: 0;
    width: 100%;
    min-height: 0;
    height: 100%;
}

md-content {
    position:relative;
    -webkit-overflow-scrolling: touch;
    overflow-x:hidden;
}

.md-sidenav-right {
    left: 100%;
    top: 141px;
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}

md-switch .md-bar {
    background-color: #e6e6e6; /* set not selected bar color */
}

/* For fixing the breadcrumb header to scroll*/
.dialogIcon{
    height: 16px;
    font-size: 16px;
}


md-menu-content.md-menu-add-content{
    background-color:#4CAF50;
    color:white;
    padding:0;
    border-radius:5px;
}

md-menu.md-menu-add{
    color:white;
    padding:0;
}

.md-menu-add .md-fab{
    background-color:#4CAF50 !important;
}
.md-menu-add .md-fab :hover{
    background-color:#4CAF50 !important;
}
/*////////////////DISABLED ADD FAB ON BREADCRUMBS IN EVERY SCREEN (ng-class) applies whever the add privilege is unchecked for that entity///////////*/
.md-menu-add .md-button.md-fab.disabledAddFab,
.md-menu-add  .md-fab:hover .disabledAddFab
{
    background-color:#757575 !important;
}
/*md-input-container label{*/
/*color:#9E9E9E !important;*/
/*}*/
.cancel-button,.cancel-button :hover{
    background-color:#D84315 !important;
    color:white;
}
.save-button,.save-button :hover{
    background-color:#4CAF50 !important;
    color:white;
}

.save-button-disabled {
  color: white !important;
  background-color: #757575 !important;

}
.save-button-disabled md-icon {
  color: white !important;

}
/*/////////////////////////////////////PRIMARY BUTTON///////////////////////////////////////////////////////////////////*/

.primary-button:not([disabled]),
.primary-button:not([disabled]):hover{
    background-color:#0091EA !important;
    color:white;
    text-align:center;
}
.primary-button[disabled],
.md-button .md-raised[disabled],
.md-button[disabled] {
    color: #757575;
}
.primary-button:not([disabled]):hover {
    background-color: #01579b !important;
    color: white;
}
.primary-button:not([disabled]):focus {
    background-color: #0091EA !important;
    color: white;
}
/*/////////////////////////////////////PRIMARY BUTTON///////////////////////////////////////////////////////////////////*/

/*Kendo row height*/

.k-grid {
    border: none;
}

.k-grid td{
    padding: 1px 0 1px 18px !important;
    border-style: solid none !important;
    text-align: left;
    color: #424242;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 14px;
}

.ng-scope.flex.md-input-has-value.md-input-focused>label{
    padding-bottom: 5px;
}
.k-grid-header th.k-header, .k-filter-row th {
    border-bottom: 2px solid #e0e0e0;
    border-style: solid none !important;
    padding-top:20px !important;
    padding-bottom:20px !important;
    line-height: 40px;
}

.k-grid-header th.k-header {
    margin: 0 !important;
    text-align: left;
    color: #a8a8a8;
    background-color: white;
}
.k-grid-header th.k-header > .k-link {
    line-height: 20px;
    color: #9e9e9e;
    font-weight:700;
    font-size:1em;
}
/*grid footer display*/
div .NoGridItems{
    color:red;

}
.margin-12.ng-isolate-scope.ng-animate.md-input-invalid>label{
    padding-right: 10px !important;
    padding-bottom:24px !important;
    padding-left: 0px !important;
}
.margin-12.ng-isolate-scope.ng-animate.md-input-invalid.md-input-focused>label{
    padding-bottom:14px !important;
    padding-left: 0px !important;
}
.k-pager-info{
    float:initial;
}

.k-pager-refresh{
    float: initial !important;
    margin-left: 9px !important;
    margin-right: 9px !important;
}
/*
.k-grid-content>table>tbody>tr
{
    background:black;
}
*/
md-tabs.privilege-tabs md-tabs-canvas{
    background-color: #4CAF50 ;
    /*margin-right:24px;*/
}

.k-state-selected td{
    background-color: white !important;
    border-color: #E0E0E0 !important;
    color:#444 !important;
}

.k-primary-column{
    color:#4CAF50;
    padding-left:5px;
}

.k-status{
    background-color: #f5f5f5!important;
}

.k-i-clock {
    display: none;
}

.deleted-row{
    background-color: #E7E7E8!important;
}

.tmxMin{
    min-width: 30px;
    padding: 0;
    margin: 0;
}
.k-grid td.k-col-width{
    min-width: 140px;
    text-align:left;
}
.k-grid td.GridDisabled{
    background-color: #E0E0E0;
}

md-input-container .k-datepicker.k-header
{
    /*padding: 10px !important;*/
    /*background-color: inherit !important;*/
    height: 100%
}

/*.k-picker-wrap.k-state-default{
    box-shadow: none !important;
	background-color: inherit !important;
}*/

.k-datepicker.k-header{
    padding:10px !important;
    margin-bottom:0 !important;
    border-width: 0 !important;
    background-color: white!important;
    box-shadow: none !important;
}

.k-picker-wrap.k-state-default{
    background-color: white!important;
    box-shadow: none !important;
}

.k-picker-wrap.k-state-default.k-state-hover{
    background-color: white!important;
    box-shadow: none !important;
}

/*.full-width{*/
/*width: 400px !important;*/
/*}*/


/* SELECTED TEXT OR HYPERLINK*/
.tmx-primary-text {
    color: #4CAF50;
    text-transform: none;
    min-width:10px !important;
    margin-left: -7px;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    min-width: 64px;
    padding: 6px 8px;
    cursor:pointer;
}
.tmx-selected-bg {
    background-color: Lavender!important;
}
/*MD TOAST*/
md-toast.md-success-theme .md-toast-content {
    background-color: #4CAF50;
}
md-toast.md-error-theme .md-toast-content,md-toast.md-default-theme .md-toast-content{
    background-color: #D84315;
}


.my-message {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    font-size: 12px !important;
}

.loader{
    position:absolute;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
    z-index:1000;
    background-color:grey;
    opacity: .8;
}

.loader-repeat{
    position:absolute;
    left:0;
    width:100vw;
    height:100vh;
    z-index:1000;
    background-color:grey;
    opacity: .8;
}
.status-Pending{
    color:#0091EA !important;
}

.status-Active{
    color:#4CAF50 !important;
}
.filter-active{
    color:#4CAF50 !important;
}
.filter-active>i{
    color:#4CAF50 !important;
    font-size: 18px
}

.status-Inactive{
    color:red !important;
}
.tmx-hidden{
    display:none !important;
}

.row-heading{
    line-height: 40px;
    border-top: #E0E0E0 1px solid;
    border-bottom: #E0E0E0 1px solid;
    background-color: #F5F5F5;
    width:100%;
}

.row-heading>b{
    margin-left:15px;
}

/*//////////////////////////////////   TENANT REGISTER IMAGE PUBLIC  ////////////////////////////////////////////////////*/
.circularImageUser {
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    float: left;
}
.tenant_image {
    position: relative;
    float: left;
}
.circularImage {
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 50%;
    width: 120px; /*100px;*/
    height: 120px;
    float: left;
}
.profilelinkImage{
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 50%;
    width: 200px;
    height: 200px;
}
.profilelinkImageText{
    background-color:transparent;
    background-repeat: no-repeat;
    background-image: url(../images/profile-linkImage.png);
    text-align:center;
    color:#E0E0E0;
    vertical-align:middle;
    line-height:17px;
    font-size:12px;
    padding:8px 0px;
}
.profilelinkAccount{
    background-color:#26A69A;
    background-repeat: no-repeat;
    background-position:top center;
    background-image: url(../images/profilelinkAccountCard.png);
    padding:8px 0px;
    border-radius:3px 3px 3px 3px;
    border-width:0px 0px 0px 0px;
    border-style:solid;
    border-color:#404040;
}
.profilelinkDevice{
    background-color:#42A5F5;
    background-repeat: no-repeat;
    background-position:top center;
    background-image: url(../images/profilelinkDeviceCard.png);
    padding:8px 0px;
    border-radius:3px 3px 3px 3px;
    border-width:0px 0px 0px 0px;
    border-style:solid;
    border-color:#404040;
}
.profilelinkEmployment{
    background-color:#AB47BC;
    background-repeat: no-repeat;
    background-position:top center;
    background-image: url(../images/profile-linkEmploymentCard.png);
    padding:8px 0px;
    border-radius:3px 3px 3px 3px;
    border-width:0px 0px 0px 0px;
    border-style:solid;
    border-color:#404040;
}
.profilelinkAddress{
    background-color:#8D6E63;
    background-repeat: no-repeat;
    background-position:top center;
    background-image: url(../images/profile-linkAddressCard.png);
    padding:8px 0px;
    border-radius:3px 3px 3px 3px;
    border-width:0px 0px 0px 0px;
    border-style:solid;
    border-color:#404040;
}
.imgText {
    position: absolute;
    top: 55px;
    padding-top: 5px;
    padding-left: 8px;
    left: 0;
    width: 90px;
    height: 50px;
    color: white;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    font-size: 10px;
}
.imgText:hover {
    background-color: rgba(54, 25, 25, .4);
    font-size: 14px !important;
}
.UploadText {
    float: left;
    display: none;
    font-size: 12px;
    margin-left: 5px;
    margin-top: 1px;
    font-weight: bold;
}
.imgText:hover .UploadText {
    display: block;
}
.imgText:hover .camera-icon {
    display: block;
    font-size: 14px;
    margin-left: 8px;
    text-shadow: none;
    opacity: 1;
}
.camera-icon {
    text-shadow: 2px 2px 2px black;
    font-size: 20px;
    margin-left: 10px;
    margin-top: 14px;
    opacity: 0.5;
    color: white;
    transition: margin .5s;
}
/*//////////////////////////////////   TENANT REGISTER IMAGE PUBLIC  ////////////////////////////////////////////////////*/

/*//////////////////////////////////  Text Color for AutoComplete List of Users////////////////////////////////////////////////////*/
.md-autocomplete-suggestions-container.md-default-theme li, .md-autocomplete-suggestions-container li{
    color: black;
}
md-autocomplete md-input-container label{
    padding: 0;
}

md-autocomplete[md-floating-label] md-input-container{
    /*padding: 5px 0 0 0;*/
    /*margin: 15px 0 0 0;*/
}
.md-virtual-repeat-container.md-autocomplete-suggestions-container{
    min-height:50px;

}
.md-virtual-repeat-container.md-autocomplete-suggestions-container li{
    font-size: 14px;
    font-weight: 400;
    color:#9e9e9e;
    /*border-bottom: 1px solid #ccc;*/
}
/*////////////////////////////////// MD_TABS ////////////////////////////////////////////////////*/

/*////////////////////////////////// CROSS FOR TAB 3 IN ROLE MANAGEMENT : ADD A ROLE////////////////////////////////////////////////////*/
.md-button.md-fab.md-mini{
    line-height: 10px;
    background-color: #F5F5F5;
    box-shadow: 0
}

.md-button.md-fab.md-mini:hover{
    line-height: 10px;
    background-color: #F5F5F5;
    box-shadow: 0;
}
.md-fab.md-mini.md-button.md-ink-ripple.styling{
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.26);
}
/*//////////////////////////////////  MD FAB STYLE    ////////////////////////////////////////////////////*/

/*md-tabs {
    background-color: #4caf50;
    border-color: #404040;
    border-style: solid;
    border-width: 0;
    box-shadow: none;
    font-family: Roboto-Regular, Arial;
    font-size: 10pt;
}*/

md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-bar {
    color: #4CAF50;
}



/*//////////////////////////////////  Profile Dialog   ////////////////////////////////////////////////////*/
.md-toolbar-tools{
    background-color: #4CAF50;
    color: white;
}
.profileDialogImg{
    height: 150px;
    border-radius: 100px;
}
.view-profile-img{
    width: 100px;
    height: 100px;
    -webkit-border-radius:100px ;
    -moz-border-radius:100px ;
    border-radius:50px ;

}

/*/Icon used in location tree/*/
.k-grid .k-icon {
    opacity: .45;
    margin-left: 8px;
}

/*
 tmxkendofooter
*/
.tmx-kendo-footer-icons img{
    float:right;
    width:20px;
    height:20px;
    padding:3px;
}

/*Formatting of forms*/

tmx-textbox .tmx-textbox md-input-container.md-input-invalid .md-input, tmx-textbox .tmx-textbox md-input-container.md-input-invalid .md-input, tmx-textbox .tmx-textbox md-input-container .md-input.ng-invalid.ng-dirty, tmx-textbox .tmx-textbox md-input-container .md-input.ng-invalid.ng-dirty {
    font-size: 14px !important;
    font-weight: normal;
    Color: #9E9E9E;
    border-bottom-color: red ;
    border-bottom-style: solid;
    border-bottom-width: 2px;
}


tmx-textbox .tmx-textbox md-input-container {
    /*margin: 10px 10px 0 10px ;*/
}

md-input-container{
    margin:0px;
}
/*.tmx-datepicker tmx-datepicker {*/
/*margin: 10px 10px 0 10px ;*/
/*}*/


.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 0.75;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

/*
/!* Md dailog displayed on action button*!/
.md-dialog-container {
    background-color: #000000;
    opacity: 0.8;
}

md-backdrop.md-opaque {
    opacity: 0.31;
}

md-dialog {
    background-color: #ffffff;
    height: 250px;
    left: 465px;
    position: absolute;
    top: 80px;
    width: 350px;
}*/

/*md-tabs-wrapper {
    color: white !important;
    background-color: #4CAF50 !important;
}*/
md-tabs.PrivilegeTabs md-tabs-canvas{
    background-color: #4CAF50 ;
    /*margin-right:24px;*/
}

.md-tab{text-transform: initial !important;}

md-tabs.md-default-theme .md-tab, md-tabs .md-tab {
    color: white ;
    background-color: #4CAF50 ;/* color: rgba(0,0,0,0.54); */
}
md-tabs.md-default-theme .md-tab.md-active, md-tabs .md-tab.md-active, md-tabs.md-default-theme .md-tab.md-active md-icon, md-tabs .md-tab.md-active md-icon, md-tabs.md-default-theme .md-tab.md-focused, md-tabs .md-tab.md-focused, md-tabs.md-default-theme .md-tab.md-focused md-icon, md-tabs .md-tab.md-focused md-icon {
    color: #4CAF50 ;
    background-color: white ;
}
md-tabs[md-border-bottom] .md-tabs-wrapper {
    border-style: none;
}
.md-tabs-wrapper .md-next-button .md-icon {
    color: white;
}

.md-tabs-wrapper .md-next-button md-icon, .md-tabs-wrapper .md-prev-button md-icon {
    color: white;
}
.md-next-button, .md-prev-button{
    background-color: #4CAF50 !important;
}
/*///////////////////// MD CARD TITLE/////////////////*/
md-card .md-card-title .md-card-title-text:only-child .md-subhead,
md-card .md-card-title .md-card-title-text .md-subhead{
    color: #424242;
    font-size: 14px;
    font-weight: 400;
}


.md-sidenav-right{
    position:fixed;
    top: 130px;
}

.sidenav-search-element{
    height:74px !important;
}

.loanApplicationMenuMainItem :hover{
    background-color:#E0E0E0;
    cursor:pointer;
}

.highlight{
    color:#00ACF1 !important;
}

.highlighted-row {
    background-color: #fafafa !important;
}

.checkbox-label{
    font-size: large;
    opacity: 0.6;
}
.required-astrek{
    font-size: large;
    color: red;
}

multi-line .md-label{
    font-size: 14px;
    font-weight: 400;
    Color: #9E9E9E;
    height: 7px;
    padding: 0px 0px 0px 0px;
    margin:0px 0px 15px 0px;
}

multi-line.roleDescription md-input-container{
    width:97%;
}
multi-line.roleDescription md-input-container .md-input{
   margin-top:-1px;
}
.multilinediv {
    z-index: 21;
    background-color: white;
    position: absolute;
    margin-top: 20px;
    width: 60%;
}
md-input-container textarea {
    resize: none;
    overflow: auto;
}
.multilinelabel{
    transform: translate3d(0, -15px, 0) scale(.80) !important;
}
.md-input.customarea{
    height: 100px !important;
    overflow-y: auto !important;
    min-height: 26px;
    resize: none;
    white-space: pre-wrap !important;
}

.zeroeverything > span {
    font-size: 15px;
}
.multilinesavebutton{
    color: green;
}

tmx-dynamic-grid .k-icon{
    width: 10px;
}


/*//////////////////////////MD INPUT CONTAINER/////////////////////////////////////////////////////////////////////////*/
md-input-container input[ng-required]  label::after,
md-input-container input[required]  label::after{
    content:"*";
    color:Red;
}
.md-input-has-value:not(.md-input-invalid) label:first-child {
    color: #0091EA !important;
}
md-input-container label
{
    color:#9e9e9e;
}

/*//////////////////////////////////  ERROR MSG DIRECTIVE DIRECTLY USED IN FORM  /////////////////*/
md-input-container [ng-messages] :not(.md-char-counter) {
    color: red;
    padding:8px 0px 0px 0px;
    min-height:16px;
    margin:0px;
    font-weight: 400;
    font-size:12px;
}

/*md-input-container.md-default-theme.md-input-invalid .md-input, */
/*md-input-container.md-input-invalid .md-input{*/
/*border-color: red !important;*/
/*}*/


md-input-container .md-errors-spacer {
    float: right;
    min-height: 16px;
    min-width: 1px;
}

md-input-container .md-placeholder{
    margin-bottom: 8px;
    padding-bottom:0px;
}

md-input-container.md-default-theme.md-input-invalid .md-input, md-input-container.md-input-invalid .md-input {
    border-bottom-color: red;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding:8px 0px;
}

md-input-container {
    width:100%;
    display: inline-block;
    position: relative;
    padding: 0px 0px 0px 0px;

    vertical-align: middle;
}
md-content tmx-datepicker[disabled] .tmx-datepicker label
{
    color:#fafafa;
    font-size:14px;
    padding: 0px 0px 8px 0px;
    font-weight:400;
}
md-content label
{
    font-size: 14px;
    font-weight: 400;
    Color: #0091EA;
    height: 7px;
}

.md-content-label
{
    font-size: 18px;
    font-weight: 400;
    Color: #0091EA;
    height: 7px;
}

.tmx-datepicker-label
{
    Color: #0091EA;
    font-size:14px;
    height: 0px;
    font-weight:400;
    padding: 0px 0px 0px 0px !important;
}


md-input-container:not(.md-input-invalid) label,
md-input-container:not(.md-input-invalid) label:not(.md-no-float):not(.md-container-ignore)
{
    color:#9e9e9e;
    /*margin-bottom: -16px;*/
    padding:0px 0px 0px 0px;
    /*height:16px;*/
}
md-input-container:not(.md-input-invalid) md-input:focus label,
md-input-container:not(.md-input-invalid) md-input:focus label:not(.md-no-float):not(.md-container-ignore)
{

    /*margin-bottom: -16px;*/
    padding:0px 0px 16px 0px;
}
md-input-container.md-input-invalid.md-input-focused label,
md-input-container.md-input-invalid label{


    font-weight: 400;
    Color:  red;
    height: 0px;
    width: auto;
    padding:0px 0px 0px 0px;
}
tmx-select .tmx-select md-input-container:not(.md-input-invalid).md-input-has-value label:first-child,
tmx-select .tmx-select md-input-container:not(.md-input-invalid).md-input-has-value label{


}
md-input-container:not(.md-input-invalid).md-input-has-value label:first-child,
md-input-container:not(.md-input-invalid).md-input-has-value label
    /*.md-input-has-value label:first-child {*/
{
    color: #0091EA !important;
    font-size :  14px;
    font-weight: 400;
    padding:0px 0px 0px 0px;
    height:7px;
}
md-input-container:not(.md-input-invalid).md-input-has-value label:first-child.locationLabel,
md-input-container:not(.md-input-invalid).md-input-has-value label.locationLabel{
    padding:0px;
    margin-bottom:-4px;
}

md-input-container[required].md-input-invalid.md-input-has-value label:first-child,
md-input-container[required].md-input-invalid.md-input-has-value label
{
    color: red !important;
    margin-bottom: -11px;
    padding:0px 0px 8px 0px;


}

md-input-container input[type=text],
md-input-container .md-input,
md-input-container .md-input.ng-invalid.ng-dirty,
md-input-container.md-input-focused .md-input{
    padding:0px;
    color: rgb(66, 66, 66);
    cursor: auto;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Lato', Arial, sans-serif;
    display: block;
    float: left;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
md-input-container  label.md-content-label
{
    font-size: 14px;
    font-weight: 400;
    Color: #0091EA;
    height: 7px;
    margin-bottom:-4px;
    top:-14px;
}
md-input-container.md-input-invalid.md-input-focused label.md-content-label,
md-input-container.md-input-invalid label.md-content-label
{
    font-size: 14px;
    font-weight: 400;
    Color: red;
    height: 7px;
    margin-bottom:0px;
    padding-left:0px;
}

/*/////////////////////////////////////////////////////////////////////////////////*/

tmx-dynamic-grid .k-header.k-grid-toolbar{
    background-color: #4caf50;
    border-color: #4caf50;
}

tmx-dynamic-grid .checkbox-label{
    opacity: 1;
    padding-top: 5px;
    padding-right: 10px;
    color: white;
}

tmx-dynamic-grid .k-grid .k-header .k-button{
    background-color:  rgba(0,0,0,0.54)!important;
    border: none!important;
    transition: all 0.5s;
}
tmx-dynamic-grid .k-grid .k-header .k-button:hover{
    background-color:  rgba(0,0,0,0.80)!important;
    border: none!important;
    transition: all 0.5s;
}
/*//////////////////////////////////////Chip Select ///////////////////////////////////////////*/
.custom-md-chip{

    font-size: 14px;
    font-weight: 400;
    font-family: 'Lato', Arial, sans-serif;
    display: block;
    float: left;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #E0E0E0;
    color: #424242;
    cursor: default;
    border-radius: 16px;
    line-height: 32px;
    height:32px;
    padding: 0 12px;
    box-sizing: border-box;
    position: relative;

}

.md-chips {
    display: block;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Lato', Arial, sans-serif;
    padding: 0 0 8px 3px;
    vertical-align: middle;
}

md-chips.md-default-theme .md-chip.md-focused, md-chips .md-chip.md-focused{
    background: #E0E0E0;
    color: #424242;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Lato', Arial, sans-serif;
}
.disable_label_input_container{
    color: #9e9e9e;
    font-size: 16px;
    font-weight: 400;
    height: 16px;
}
.md-input-container-error{
    position:absolute;
    top:37%
}

md-card .md-actions, md-card md-card-actions {
    margin: 8px 0px 8px 0px;
}

md-backdrop.md-opaque {
    background-color: transparent;
}

tmx-checkbox div md-input-container{
    margin-right: 0px;
}
tmx-checkbox .checkbox-label{
    cursor: pointer;
}

tmx-checkbox img{
    height:200px;
    width:200px;
}

tmx-checkbox .cancel{
    cursor: pointer;
}

md-chips .md-default-theme .md-chips, md-chips .md-chips
{
    box-shadow: 0 1px #e1e1e1 ;
}

.md-chip-error
{
    font-size: 12px;
    top: -12px;
    position: relative;
    color: red;

}


.md-chip.placeholder::-webkit-input-placeholder {
    color: red;
}

.md-chip.placeholder:-moz-placeholder { /* Firefox 18- */
    color: red;
}

.md-chip.placeholder::-moz-placeholder {  /* Firefox 19+ */
    color: red;
}

.md-chip.placeholder:-ms-input-placeholder {
    color: red;
}

.k-grid td.k-state-selected{
    background-color: white;
    color:black;
}
.question{
    font-size: larger;
    font-weight: bold;
}
.score{
    font-size: larger;
    font-weight: bold;
}

.k-grid-header th.k-header:first-child, .k-grid tbody td:first-child, .k-grid tfoot td:first-child, .k-filter-row>th:first-child {
/*     width: 20px; wrong way to solve your problem- comitted by Ahsan*/
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.k-tooltip{
    position: relative;
}
.custom-iframe{
    width: 900px;
    height: 1200px;
}

tmx-dynamic-grid{
    width: 100%;
}
tmx-question{
    width: 100%;
}

.cardContent {
    height: 398px;
    background-color: #F5F5F5;
}

.cardLayout {
    margin-top: 20px;
    margin-left: 8px;
    background-color: #f5f5f5;
}

.white-icon{
    color: white;
}

.cardLayoutOtherCards {
    margin-top: 20px;
    margin-left: 8px;
    /* background-color: white;*/
}

.blue-text-CC {
    color: #0091EA;
    font-size: small;
}


#my-div {
    background-color: cornflowerblue;
    /* pour l'ex, on met une hauteur au div, pour qu'il soit suffisament
    haut pour le voir bien... */
    height: 200px;
}
/*
Pour dire en CSS3 ce qui devra être animé :
Angular ajoute dynamiquement des classes CSS.
La transition se fait soit entre ng-enter et ng-enter-active
ou entre ng-leave et ng-leave-active.
*/
.animate-bottom.ng-enter, .animate-bottom.ng-leave {
    -webkit-transition: 300ms linear all;
    -moz-transition: 300ms linear all;
    -ms-transition: 300ms linear all;
    -o-transition: 300ms linear all;
    transition: 300ms linear all;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
/* du début de l'entrée */
.animate-bottom.ng-enter {
    max-height: 0;
    /*opacity: 0;*/
    overflow: hidden;
}
/* à la fin de l'entrée */
.animate-bottom.ng-enter.ng-enter-active {
    max-height: 400px;
    /*opacity:1;*/
    overflow: hidden;
}
/* du début de la sortie */
.animate-bottom.ng-leave {
    max-height: 400px;
    /*opacity:1;*/
    overflow: hidden;
}
/* à la fin de la sortie */
.animate-bottom.ng-leave.ng-leave-active {
    max-height: 0;
    /*opacity:1;*/
    overflow: hidden;
}

/* du début de l'entrée */
.animate-top.ng-enter {
    max-height: 0;
    /*opacity: 0;*/
    overflow: hidden;
}
/* à la fin de l'entrée */
.animate-top.ng-enter.ng-enter-active {
    max-height: 400px;
    /*opacity:1;*/
    overflow: hidden;
}
/* du début de la sortie */
.animate-top.ng-leave {
    max-height: 400px;
    /*opacity:1;*/
    overflow: hidden;
}
/* à la fin de la sortie */
.animate-top.ng-leave.ng-leave-active {
    max-height: 0;
    /*opacity:1;*/
    overflow: hidden;
}

#addressCardDiv md-input-container{
margin-right: 0;
}

.margin-12{
    margin:12px;
}

.margin-0{
    margin: 0;
}

.k-pager-wrap.k-grid-pager.k-widget.k-floatwrap{
    padding-left: 15px;
}

.form-row-height{
    height:78px;
}

.blue-icon{
    color: rgb(0,145,234);
}
md-input-container [ng-message]{
   transition:  all 0s cubic-bezier(.55,0,.55,.2);
}


.error-notification {
    color: #D84315;
}

.success-notification {
    color: #4CAF50 !important;
}

.notification-popup{
    z-index: 0 !important;
}

.slideDownNotification{
    display: block;
    -webkit-transition: height 1s ease;
    -moz-transition: ease-in 2s none;
    -ms-transition: ease-in  2s none;
    -o-transition: ease-in  2s none;
    transition: ease-in  2s none;
}

.white-background{
    background-color: white;
    padding:10px 10px 10px 10px;
    border-radius: 4px;
    opacity: 0.75;
}

.notification-error {
    background-color: #FBE9E7;
    color: #D84315;
}

.notification-warning {
    background-color: #FFF3E0;
    color: #FB8C00;
}

.notification-success {
    background-color: #E8F5E9;
    color: #4CAF50;
}

.notification-info {
    background-color: #E1F5FE;
    color: #0091ea;
}
.Notification {
    padding-left: 24px;
    box-shadow: 0px 1px 5px #888888;
    margin-bottom: 4px;
}

.k-loading-image{
    background-image: url('../images/load3.gif');
    background-size: 50px 50px;
    margin: 0px auto;

}
.k-loading {
  background-image: url('../images/load3.gif');
  background-size: contain;
}

.animate-notification.ng-show, .animate-notification.ng-hide {
    -webkit-transition: 0.2s ease-in all;
    -moz-transition: 0.2s ease-in all;
    -ms-transition: 0.2s ease-in all;
    -o-transition: 0.2s ease-in all;
    transition: 0.2s ease-in all;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
/* du début de l'entrée */
.animate-notification.ng-show {
    max-height: 0;
    opacity: 0;
    /*overflow: hidden;*/
}
/* à la fin de l'entrée */
.animate-notification.ng-show.ng-show-active {
    /*max-height: 400px;*/
    opacity:1;
    overflow: hidden;
}
/* du début de la sortie */
.animate-notification.ng-hide {
    /*max-height: 400px;*/
    opacity:1;
    overflow: hidden;
    overflow: hidden;
}
/* à la fin de la sortie */
.animate-notification.ng-hide.ng-hide-active {
    /*max-height: 0;*/
    opacity:0;
    overflow: hidden;
}

/* The starting CSS styles for the enter animation */
.fade.ng-hide {
    transition:0.5s linear all;
    opacity:0;
}

.fade.ng-show {
    transition:0.5s linear all;
    opacity:0;
}
.padding-12{
    padding-left:12px;
    padding-right: 12px
}

.tmx-select-disable{
    border-bottom: 1px solid;
    color: #e8e8e8;
    position: relative;
    top: -15px;
}

.tmx-select-info-div{
    position: relative;
    top:-4px;
}
.tmx-select-info-msg{
    font-size: 14px!important;
    padding-left: 5px;
}
.tmx-select-warn-msg{
    color: red;
    padding: 8px 0px 0px 0px;
    min-height: 16px;
    margin: 0px;
    font-weight: 400;
    font-size: 12px;
    top: -12px;
    left: 2px;
    position: relative;
}

.tmx-select-info-icon{
    font-size: 20px!important;
    height: 20px !important;
    width: 20px !important;;
}
.grey-icon{
color: grey !important;

}

.grid-col:focus {
    outline: none;

}


.export-side-nav{
    display:inline-block;
    cursor: pointer;
    outline:none;
}


/*Tree view buttons  */

.k-grid .k-icon{
    opacity: 1 !important;
    margin-left: 8px;
    margin-right: 8px;
    cursor: pointer; 
}
.k-icon .k-i-collapse {
    opacity: 1;
    padding-left: 8px;
    padding-right: 4px;
}
.k-icon .k-i-expand {
    opacity: 1;
    padding-left: 8px;
    padding-right: 4px;
}
/* CSS added to remove the header speace of scroll bar in the Kendo Tree Input*/
#tree-grid .k-grid-header {

  padding-right: 0px !important;

}

#tree-grid {

  overflow-x: hidden;
}
/*.k-grid table {
    margin: 0px 0px 0px 6px;
}*/
.selected-day{
    background-color: #4caf50 !important;
}

.not-selected-day{

}

.md-scene.md-icon-float>label{
   height:25px !important;
    padding-left: 0px;
}
.md-scene.md-icon-float.md-input-has-value
{

}
.md-scene.md-icon-float.ng-animate.md-input-invalid>label{
     padding-left: 0px !important;
 }
.md-scene.md-icon-float.md-input-has-value.ng-animate.md-input-invalid.md-input-focused>label {
    bottom: 33px !important;
    font-size: small;
    padding-left: 0px;
    padding-bottom: 0px;
}
.md-scene.md-icon-float.md-input-has-value.ng-animate.md-input-invalid>label {
    bottom: 14.7px !important;
    font-size: 19px;
    padding-left: 0px !important;
    padding-bottom: 4px;
}
.md-scene.md-icon-float.md-input-has-value>label{
    bottom: 33px !important;
    font-size: small;
    padding-left: 0px;
    padding-bottom: 4px;
}
.md-scene.md-icon-float.ng-animate.md-input-invalid.md-input-has-value{
    bottom: 17px !important;
    top: 0px;
    font-size: large;
    padding-left: 0px;
    padding-bottom: 4px;
}
.md-scene.md-icon-float.md-input-focused>label{
    bottom: 33px !important;
    font-size: small;
    padding-left: 0px;
    padding-bottom: 0px;
}
.md-input-container-error.layout-row.flex-100{
    margin-top: 5px;

}

.md-userscene.md-icon-float>label{
    height:25px !important;
    padding-left: 0px;
}

.md-userscene.md-icon-float.ng-animate.md-input-invalid>label{
    padding-left: 0px !important;
    margin-bottom: -9px;
    padding-bottom: 4px;
}
.md-userscene.md-icon-float.md-input-has-value.ng-animate.md-input-invalid.md-input-focused>label {
    font-size: small;
    padding-left: 0px;
    margin-bottom: -9px;

}
.md-userscene.md-icon-float.md-input-has-value.ng-animate.md-input-invalid>label {
    font-size: large;
    padding-left: 0px;
    margin-bottom: -23px;

}

.md-userscene.md-icon-float.md-input-has-value>label{
    font-size: small;
    padding-left: 0px;
    margin-bottom: -9px;

}
.md-userscene.md-icon-float.ng-animate.md-input-invalid.md-input-has-value{
    font-size: large;
    padding-left: 0px;
    margin-bottom: -5px;
    padding-bottom: 0px;

}
.md-userscene.md-icon-float.md-input-focused>label{
    font-size: small;
    padding-left: 0px;
    margin-bottom: -9px;

}
.dashCardContent {
    height: 800px;
    background-color: #b5b5b5;
}
/*.ng-pristine.md-input.ng-invalid.ng-invalid-required.ng-valid-mask.ng-touched{*/

/*}*/

.grid-header-action-button{
    top: 20px;
    left: 10px;
    position: relative;
}/*}*/

.phoennumberincontact.md-scene.md-icon-float:not(.md-input-has-value)>label{
    bottom: 41px !important;
    opacity: 0;
}
.phoennumberincontact.md-scene.md-icon-float.md-input-focused>label{
    bottom: 41px !important;
    opacity: 1;
}
.phoennumberinuser.md-userscene.md-icon-float:not(.md-input-has-value)>label{
    bottom: 41px !important;
    opacity: 0;
}
.phoennumberinuser.md-userscene.md-icon-float.md-input-focused>label{
    bottom: 41px !important;
    opacity: 1;
}
.warning-text{
    color: red;
    padding: 8px 0px 0px 0px;
    min-height: 16px;
    margin: 0px;
    font-weight: 400;
    font-size: 12px;
}

.cursor-default{
    cursor: default !important;
}

.cursor-pointer{
    cursor: pointer !important;
}

md-progress-linear.top-progress{
    z-index: 10;
    height: 3px;
    position: fixed;
    top: 0;
    left: 0;
}

md-progress-linear.top-progress .md-container{
    background-color: initial;
    height: 3px;
}

.removeMargin{
    margin: 133px 0 0 0px;
    border-left: none;
}

.removeMargin .breadcrumbs{
    left: 0;
}

md-checkbox.md-checked .md-icon
{
    background-color: #4caf50;
}

.input-red-true{
    border-color: red;
}

.menu-level-2{
    position: relative;
    left: -20px;
}

.duration-and-type-date-align{
    position: relative;
    top: -10px;
}


/* Terms And Condition Button CSS */

.tmx-file-input .k-filename {
    cursor: pointer;
}

.tnc-view-button{
    background-color:#4CAF50 !important;
    color:white;
}

.tnc-view-button-disabled {
  background-color:#4CAF50 !important;
}

.tnc-view-button-disabled ::hover {
    color: #757575;
}

.tnc-view-button-disabled md-icon {
  color: white !important;

}

tmx-datepicker#dateForGeoLocation {
    width: 100% !important;
    padding-right: 0px !important;
    padding-bottom: 80px !important;
}

button.md-greenery {
    color: green;
}

.location-input input{
    cursor: pointer !important;
}

.dateInUserReplacement {
    padding-top: 0px !important;
    padding-right: 0px !important;
    margin: 12px;
    width: 100%;
}

.md-user.md-icon-float.ng-animate.md-input-invalid>label{
    margin-bottom:10px;
}
.md-block.md-user.md-icon-float.ng-animate.md-input-invalid>label{
    margin-bottom:1px;
}
.md-block.md-user.md-icon-float.md-input-has-value>label{
    margin-bottom: 1px;
    padding-left: 0px;
    top: 0px;

}
.md-content-label.disable_label_input_container.ng-scope{
    margin-bottom: 0px;
    top: -0.3px;
    opacity: 100;

}
.k-icon.k-i-arrow-n{
    color: #000;
    opacity:1;
}
.k-icon.k-i-arrow-s{
    color: #000;
    opacity:1;
}

#order-line-grid .k-grid-header {

  padding-right: 0px !important;

}

#order-line-grid .k-grid-header-wrap, .k-grid-footer-wrap {

    border: none !important;
}

#order-line-grid .k-grid-content {

    overflow-x: hidden !important;
}

md-select-menu[multiple] md-option {
    padding-left: 44px;
}

md-select-menu[multiple] md-option:before {
    transition: 240ms;
    position: absolute;
    top: 16px;
    left: 17px;
    width: 14px;
    height: 14px;
    border: 2px solid;
    border-radius: 2px;
    content: ' ';
    border-color: rgba(0, 0, 0, 0.54);
    z-index: 1;
}

md-select-menu[multiple] md-option[selected]:before {
    background-color: rgba(30, 136, 229, 0.87);
    border-color: rgba(30, 136, 229, 0.87);
}

md-select-menu[multiple] md-option[selected]:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 16px;
    left: 22px;
    display: table;
    width: 6px;
    height: 12px;
    border: 2px solid;
    border-top: 0;
    border-left: 0;
    content: ' ';
    z-index: 2;
    border-color: #ffffff;
}

.md-select-value{
    padding: 0;
}

.angular-google-map-container { height: 400px; }

.Is-Privalge-Active{
    color:grey;
}
.Day-Text-Alignment{
    margin: auto;
    width: 15px;
    padding: 10px;
}
.Day-Box:hover{
    background-color: grey;
}

.Selected-true{
    background-color:#4caf50;
    border:none !important;
}
.Day-Box{
    height: 40px;
    cursor:pointer;
 }
.Grid-Inactive{
    background-color:grey ;
}
#order-line-grid .grid-col-edit {
    background-color: #fafafa;
}

#order-line-grid .grid-col-edit:hover {
    /* background-color: #d1d1d1; */
    /* border: 1px solid white; */
    cursor: text;
    
}

.Inactive-row-icon {
    color:#D84315 !important;
}

.Inactive-row-icon-danger {
    color:orange !important;
}

.Inactive-row-icon::before{
    content: "error";
}

.tmx-textbox-icon-password {
    cursor: pointer;
}

.tmx-textbox-icon-password :hover {
    color:#4CAF50 !important;
    
}

#doorbell-button {

    position: absolute;
    left: 0px;

}

.Active-row-icon {
    color:#4CAF50 !important;
}

.Active-row-icon::before{
    /* Material icon name */
    content: "check_circle";
}

.verified-row-icon{
    color:#4CAF50 !important;
}

.imei-status-icon {
    margin-top: 10px;
}

.white-bg-tab md-ink-bar{
    background-color: #4CAF50;
}

md-tabs.white-bg-tab .md-tab{
    color: #4CAF50;
    background-color: white; 
}

.Pending-row-icon {
    color:#FFC107 !important;
}

.Pending-row-icon::before{
    content: "error";
}

.transfer-Dialog-col-L{
    width: 48%;
    height: 60px;
    border-left: solid 1px #E0E0E0;
    border-bottom: solid 1px #E0E0E0;
    border-top: solid 1px #E0E0E0;
    background-color: white !important;
    padding-left: 16px;
    margin-bottom: 6px;
}
.transfer-Dialog-col-R{
    width: 48%;
    height: 60px;
    text-align: end;
    border-right: solid 1px #E0E0E0;
    background-color: white !important;
    border-bottom: solid 1px #E0E0E0;
    border-top: solid 1px #E0E0E0;
    padding-right: 16px;
    margin-bottom: 6px;
}


.selected-true{
    background-color: #f5f5f5!important;
}

.stock-transfer{
    background-color: white!important;
    height:150px!important;

}
.stock-shadow{
    box-shadow: 0px 3px 3px #888888;
}

.blue-color{
    color:#0019EA !important;
}
.order-lines .text-item {
    padding: 4px 0;
    padding-right: 8px;
}

.order-lines .field-item {
    padding-right: 8px;
}
.trial{
    visibility: hidden !important;
}

/* For page sizes */
.k-dropdown {
    width: 100px !important;
}

/* For Reports */
.trv-report-viewer .k-state-selected td{
    background-color: #00b0ff !important;
    color: white !important;
}

#ParametersArea .k-grid-header {
    display: none;
}

/* Hide this section for IMEI reports */
div#imei-logs-file-upload-container > .k-widget {
    display: none !important;
};

div#imei-logs-file-upload-container > .k-upload{
    display: none !important;
}

div#imei-logs-file-upload-container > .k-header {
    display: none !important;
}
div#imei-logs-file-upload-container > .k-upload-sync{
    display: none !important;
}
div#imei-logs-file-upload-container > .k-upload-empty {
    display: none !important;
}

/* Hide this section for Transfer reports */
div#stock-adjustment-file-upload-container > .k-widget {
    display: none !important;
};

div#stock-adjustment-file-upload-container > .k-upload{
    display: none !important;
}

div#stock-adjustment-file-upload-container > .k-header {
    display: none !important;
}
div#stock-adjustment-file-upload-container > .k-upload-sync{
    display: none !important;
}
div#stock-adjustment-file-upload-container > .k-upload-empty {
    display: none !important;
}

.survey-section-card
{
padding:10px;

}
.survery-section-button
{
height:60px;
}
.survery-question-text
{
    padding-left: 12px;
}

.survery-question-select
{
  margin-top:12px;
}
.survery-question-delete
{
margin-top:  15px;
}
.survery-answer-sample
{
margin: 0px 12px;
}
.survery-textbox-answer
{
height:56px;
}

.answer-options-widget-md-button-remove
{
    margin-left: -9px !important;
    margin-right: 0px;
    padding-right: 0px;
}

.answer-options-widget-md-button-add
{
   float: right !important;
   margin-right: 0px;
   padding-right: 0px;
   margin-left: 0px;
   padding-left: 0px;
}

.answer-options-widget .button-container
{
    margin-left: 6px

}

.private-ui-view .main-content
{
    width: -webkit-fill-available;
}

.private-ui-view
{
width:-webkit-fill-available;
height: 50px;
min-height: -webkit-fill-available;
overflow: auto;
}
.padding-top-22{
    padding-top: 22px;
}
.font-bold{
    font-weight: bold;
}
.report-filter{
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}
.report-filter-header{
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid;
}
.flex-content-center{
    display: flex;
    align-items: center;
    justify-content: center;
}
.button-closeup{
    width: 30px !important;
    padding: 0 I !important;
    margin: 0 !important;
}
.md-prev-button, .md-next-button {
    background-color: #3f51b5; /* Match the theme color (blue by default) */
    color: white;
    border: none;
    padding: 8px 16px;
    font-size: 14px;
    cursor: pointer;
    text-transform: uppercase;
    border-radius: 4px;
    transition: background-color 0.3s ease;
    margin: 10px;
}

.md-prev-button:hover, .md-next-button:hover {
    background-color: #303f9f; /* Slightly darker on hover */
}

.md-prev-button:disabled, .md-next-button:disabled {
    background-color: #9e9e9e; /* Disabled buttons should be grey */
    cursor: not-allowed;
}

.tab-navigation-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}
.tab-content {
    width: 100%; 
    max-width: 1200px; 
}


.fill-height{
  display: flex;
  flex: 1;
  min-height: 100%;
}

.fill-height > div{
  min-height: 100%;
  display: flex;
}

.side-menu{
  /*background: #F5F5F5;*/
}

.side-menu, .side-menu ul {
  list-style: none;
  padding: 0px;
  margin-top: 0;
}

.side-menu .md-button.active {
  color: #17670F;
  font-weight: 400;
}
.side-menu .md-button:hover{
  background-color: #e0e0e0;
}

.side-menu .menu-toggle-list a.md-button {
  display: block;
  padding: 0 16px 0 32px;
  text-transform: none;
  text-rendering: optimizeLegibility;
  font-weight: 400;
  background:#ffffff;
}

.side-menu .menu-toggle-list .md-button {
  display: block;
  padding: 0 16px 0 32px;
  text-transform: none;
}

.side-menu > li > ul{
  background: #FFFFFF;

}

.md-button-toggle .md-toggle-icon.toggled {
  transform: rotateZ(90deg);
  -webkit-transform: rotateZ(90deg);
}

.side-menu .md-button-toggle .md-toggle-icon {
  background-size: 100% auto;
  display: inline-block;
  margin: auto 0 auto auto;
  width: 15px;
  color: darkgray;
  transition: transform .3s ease-in-out;
  -webkit-transition: -webkit-transform .3s ease-in-out;
}

.menu-toggle-list.ng-hide {
  max-height: 0;
}

.side-menu .md-button {
  border-radius: 0;
  cursor: pointer;
  line-height: 40px;
  margin: 0;
  max-height: 48px;
  overflow: hidden;
  text-align: left;
  text-decoration: none;
  white-space: normal;
  width: 100%;
  text-transform: none;
  font-size: 12pt;
  padding: 0 16px 0 16px;
}

.menu-toggle-list {
  background: #fff;
  max-height: 1300px;
  overflow: hidden;
  position: relative;
  z-index: 1;
  -webkit-transition: 0.75s cubic-bezier(0.35, 0, 0.25, 1);
  -webkit-transition-property: max-height;
  -moz-transition: 0.75s cubic-bezier(0.35, 0, 0.25, 1);
  -moz-transition-property: max-height;
  transition: 0.75s cubic-bezier(0.35, 0, 0.25, 1);
  transition-property: max-height;
}


.side-menu menu-toggle span{
  padding-top: 12px;
  padding-bottom: 12px;
}

.side-menu md-icon{
  /*margin-right: 12px;*/
}

.pull-right{
  float:right;
    padding-top:12px;
}
md-menu-content {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /*padding: 13px 0 0px;*/
  max-height: 304px;
  overflow-y: auto;
}




tmx-topbar md-toolbar{
  background-color: #ffffff !important;
}




tmx-topbar md-toolbar{
	background-color: #ffffff !important;
}
tmx-leftbar.leftbar-fixed{
	width: 323px;
	position:fixed;
	top: 72px;
	left: 0;
	bottom: 0;
	/* z-index: 80; */
	z-index: 1 !important;
	overflow: auto;
}

tmx-leftbar.leftbar-fixed .md-sidenav-left {
	width: 100%;
	border-right: 1px solid #e0e0e0;
}

tmx-leftbar.leftbar-fixed .md-sidenav-left md-content {
	background-color: #f5f5f5
}

/*.side-menu .md-button.active {
	color: #17670F;
	font-weight: 400;
}*/

tmx-leftbar .active{
	color: #4caf50 !important;
}
tmx-leftbar md-sidenav{
	z-index:65;
}

/*#site-leftnav{
    width:304px;
}*/
tmx-searchbar {
  background: #F5F5F5;
  border-radius: 3px;
  height: 36px;
}

/* Search icon as placeholder */

tmx-searchbar .search-icon {
	color: #757575;
	padding: 0px 8px;
}

/* Search field (autocomplete) */

tmx-searchbar .search-field {
	width: 100%;
	margin: 0 -40px;
}

tmx-searchbar .md-whiteframe-1dp,
tmx-searchbar .md-whiteframe-z1 {
	box-shadow: none;
}
tmx-searchbar md-autocomplete .md-default-theme,
tmx-searchbar md-autocomplete,
tmx-searchbar md-autocomplete md-autocomplete-wrap,
tmx-searchbar md-autocomplete input:not(.md-input) {
	background: none;
  	height: 36px;
}

tmx-searchbar md-autocomplete input:not(.md-input) {
	line-height: 36px;
	padding: 0 48px;
}

/* Placeholder color */

tmx-searchbar md-autocomplete input::-webkit-input-placeholder {
    color: #757575;
}
tmx-searchbar md-autocomplete input:-moz-placeholder {
    color: #757575;
}
tmx-searchbar md-autocomplete input::-moz-placeholder {
    color: #757575;
}
tmx-searchbar md-autocomplete input:-ms-input-placeholder {
    color: #757575;
}


/* Advance Search Button */

tmx-searchbar .advancesearch-button {
	width: 36px;
	height: 36px;
	z-index: 1;
}

tmx-searchbar .advancesearch-button .md-icon-button {
	margin: 0;
	padding: 4px;
	height: 36px;
	width: 36px;
}
breadcrumbs .md-button {
	margin: 0;
	padding: 0 8px;
	min-width: auto;
	font-weight: 700;
	text-transform: none;
	font-size: 18px;
}


breadcrumbs .breadcrumb-separator {
	font-size: 24px;
	color: #757575
}
tmx-textbox{
    /*padding:16px 0px;*/
}
tmx-textbox .tmx-textbox{
   position:relative;
   /*max-height:50px;*/

   /*margin-bottom:20px;*/
}
tmx-textbox .tmx-textbox .tmx-textbox-icon-clear{
  position:absolute;
  top:24px;
  right:10px;
  cursor: pointer;
}
tmx-textbox .tmx-textbox .tmx-textbox-icon-clear>md-icon{
  color:red;
  margin: -38px 13px 0px 2px;
}
tmx-textbox .tmx-textbox md-input-container {
/*margin:12px;*/
  padding:0px;
}

/*////////////////////////////////////////  TMX TEXTBOX ///////////////////////////////////////////////////////////////*/
/*form tmx-textbox {*/
    /*padding: 0px 0px 0px 0px;*/
/*}*/
/*////////////////////////////////////////LABEL DEFAUlT///////// ////////////////////////////////////////////*/

tmx-textbox .tmx-textbox md-input-container label
{
            font-size: 14px;
            font-weight: 400;
            height: 16px;
            padding: 0px 0px 8px 0px;
            margin:0px 0px 8px 0px;
}
tmx-textbox .tmx-textbox md-input-container.md-input-has-value label{
    /*margin:0px 0px 8px 0px;*/
}
tmx-textbox .tmx-textbox md-input-container.md-input-invalid.md-input-focused label{
    font-size: 14px;
    font-weight: 400;
    height: 16px;
    padding: 0px 0px 8px 0px;
    margin:0px 0px 8px 0px;
}
tmx-textbox .tmx-textbox md-input-container.md-input-invalid label

{
    font-size: 14px;
    font-weight: 400;
    height: 16px;
    padding: 0px 0px 8px 0px;
    margin:0px 0px 8px 0px;
}
/*////////////////////////////////////////LABEL DISABLED///////// ////////////////////////////////////////////*/

tmx-textbox .tmx-textbox md-input-container label .disable_label {
    font-size: 14px;
    font-weight: 400;
    Color: #9E9E9E;
    height: 16px;
    padding: 0px 0px 8px 0px;
    margin:0px 0px 8px 0px;
}
/*////////////////////////////////////////LABEL ERROR///////// ////////////////////////////////////////////*/
tmx-textbox .tmx-textbox md-input-container [ng-messages] :not(.md-char-counter) {
    color: red;
    padding:8px 0px 0px 0px;
    margin:0px;
}
tmx-textbox .tmx-textbox md-input-container.md-input-invalid.md-input-focused label,
tmx-textbox .tmx-textbox md-input-container.md-input-invalid label{
    font-size: 14px;
    font-weight: 400;
    Color:  red;
    height: 16px;
    width: auto;
    padding:0px 0px 0px 0px;

}
/*////////////////////////////////////////LABEL END//////////////// ////////////////////////////////////////////*/
/*//////////////////////////////////////// INPUT TEXT FIELD DEFAULT///////// ////////////////////////////////////////////*/

tmx-textbox .tmx-textbox md-input-container .md-input:not([disabled]),
{

    Color: #9E9E9E;
    border-bottom-color: #9E9E9E;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}
tmx-textbox .tmx-textbox md-input-container .md-input[disabled]{

    Color: #9E9E9E;
    /*border-bottom-color: #9E9E9E;*/
    /*border-bottom-style: dotted;*/
    /*border-bottom-width: 1px;*/
}

tmx-textbox .tmx-textbox md-input-container.md-input-has-value.md-input-invalid label{
    /*Color: #0091EA;*/
    margin-bottom:8px;
    height:7px;
}
/*//////////////////////////////////////// INPUT TEXT FIELD FOCUS///////// ////////////////////////////////////////////*/

/* When field is clicked and its in focus */
/*{*/
    /*font-size: 14px;*/
    /*font-weight: 400;*/
    /*Color: #000000;*/
    /*padding:0px 0px 0px 0px;*/
    /*/!*height: 26px;*!/*/
    /*border-bottom-color: #0091EA;*/
    /*border-bottom-style: solid;*/
    /*border-bottom-width: 2px;*/
/*}*/
tmx-textbox .tmx-textbox md-input-container.md-input-focused .md-input,
tmx-textbox .tmx-textbox md-input-container .md-input:focus
{
    font-size: 14px;

    Color: #000000;
}
tmx-textbox .tmx-textbox  md-input-container.md-input-focused label:not(.md-no-float){
    margin-bottom:8px;
    height:7px;
}
/*////////////////////////////////////////INVALID FORM START//////////////// ////////////////////////////////////////////*/
/*////////////////////////////////////////INVALID INPUT TEXT FIELD///////// ////////////////////////////////////////////*/

tmx-textbox .tmx-textbox md-input-container.md-input-invalid .md-input,
tmx-textbox .tmx-textbox md-input-container.md-input-invalid .md-input,
tmx-textbox .tmx-textbox md-input-container .md-input.ng-invalid.ng-dirty,
tmx-textbox .tmx-textbox md-input-container .md-input.ng-invalid.ng-dirty
{
    font-size: 14px;
    font-weight: 400;
    Color: #424242;
    /*height: 26px;*/
    border-bottom-color: red;
    border-bottom-style: solid;
    border-bottom-width: 2px;

}
/*////////////////////////////////////////ERROR VALIDATION MESSAGES ////////////////////////////////////////////*/

tmx-textbox .tmx-textbox div md-input-container.md-input-invalid error-msg div[ng-message],
tmx-textbox .tmx-textbox div md-input-container error-msg div ng-messages,
tmx-textbox .tmx-textbox div md-input-container error-msg div[ng-messages],

{
    font-size: 12px;
    font-weight: 400;
    Color: red;

}
md-input-container.md-input-invalid error-msg div[ng-message],
md-input-container [ng-messages],
md-input-container error-msg div ng-messages,
md-input-container error-msg div[ng-messages]{
    font-size: 12px;
    font-weight: 400;
    Color: red;
}

/*////////////////////////////////////////INVALID FORM END//////////////// ////////////////////////////////////////////*/
/*////////////////////////////////////////  TMXTEXTBOX CSS END ////////////////////////////////////////////////////////*/



/*Loan application fixes*/
.dynamic-form tmx-datepicker{
    padding-right: 24px;
    padding-top: 0px;
}
.dynamic-form .tmx-datepicker-div {
    margin: 0px 0px 0px 8px;
    width: 100%;
}
.dynamic-form tmx-datepicker .k-picker-wrap .k-input, tmx-datepicker input.k-input {
    /*padding: 7.5px 0px 6px 1px;*/
}


/*////Following two classes are used in search navigation textbox and selectbox to prevent the input from overlapping the cross button///*/
.padding50right {
    padding: 0px 50px 0px 0px !important;
}

md-autocomplete > md-autocomplete-wrap > md-input-container > input{
    padding: 0px 50px 0px 0px !important;

}
tmx-select{
    /*padding:0px 24px 3px 0px;*/
    /*margin-top:5px;*/

}
tmx-select .tmx-select{
  position:relative;
    /*margin-top:-7px;*/
}
tmx-select .tmx-select md-autocomplete md-autocomplete-wrap md-input-container{
    margin-top:0;
    margin-right:0px;
  /*min-width:10px;*/
}
tmx-select[required] .tmx-select md-autocomplete label::after{
    content:"*";
    color:Red;
    padding-left: 2px;
}

tmx-select .tmx-select .tmx-select-icon{
  position:absolute;
  top:10px;
  right:0px;
  cursor: pointer;
}

tmx-select[disabled="true"] .tmx-select .tmx-select-icon{
    display: none;
}

tmx-select .tmx-select .tmx-select-icon-clear{
  position:absolute;
  top:10px;
  right:24px;
  cursor: pointer;
}
tmx-select .tmx-select .tmx-select-icon-clear>md-icon{
  color:red;
  margin: -3px 0px 0px 0px;
}
tmx-select .tmx-select md-input-container {
  padding:0px;
  /*margin-top:2px;*/
    /*margin:-4px 24px 0px 0px;*/
}
tmx-select .tmx-select md-input-container input{
    /*padding:14px 0px 8px 0px;*/
    /*height:16px;*/
}
tmx-select .tmx-select label{
    Color: #9e9e9e;
    height:16px;
    font-size: 14px;
    font-weight: 400;
    margin:0px 0px 8px 0px;
}
.md-select-has-value label:first-child {
  color: #0091EA !important;
}
tmx-select .tmx-select md-input-container .md-input.ng-invalid.ng-dirty,
tmx-select .tmx-select md-input-container.md-input-focused .md-input{
    padding:0px 0px -2px 0px;
}

tmx-select .tmx-select md-input-container.md-input-invalid label{
    color:red;
    padding:0px 0px 0px 0px;
    height:16px;
    font-size: 14px;
    font-weight: 400;
    margin:0px 0px 8px 0px;
}
tmx-select .tmx-select md-input-container.md-input-invalid.md-input-focused label{
    font-size: 14px;
    font-weight: 400;
    color:red;
    padding:0px 0px 0px 0px;
    margin:0px 0px 8px 0px;
    height:7px;
}
.ng-scope.flex.md-input-has-value.ng-animate.md-input-invalid:not(.md-input-focused) label{

    height:6px !important;
    color: red !important;
}

.ng-scope.flex.md-input-focused:not(.md-input-has-value) label{

    height:6px !important;
}


tmx-select.tmx-select-required label::after{
    content: "*";
    color: Red;
    padding-left: 2px;
}

tmx-select .tmx-select md-input-container.md-input-focused label {
margin:0px;
}

tmx-select .tmx-select md-input-container.md-input-focused label {
    margin-bottom:8px;
}

md-input-container.md-default-theme .md-input[disabled], md-input-container .md-input[disabled], md-input-container.md-default-theme .md-input [disabled], md-input-container .md-input [disabled] {

    color: #9E9E9E !important;
}
.label-position{
    top: -20px;
}
.icon-position{
    margin:0px !important;
}
tmx-datepicker .tmx-datepicker label{
    color:#0091EA;
    font-size:14px;
    padding: 0px 0px 8px 0px;
    font-weight:400;

}

tmx-datepicker span.k-datetimepicker{
   width:100%;
    padding:0px;
    border-width:0px;
}
tmx-datepicker .k-picker-wrap.k-state-default{
     border:none;
    padding:0px 0px 0px 0px;


}
tmx-datepicker span.k-datetimepicker .k-select,
tmx-datepicker span.k-datetimepicker .k-select+.k-select{
    left:0px;
}

.datepicker_format
{
    color:#9E9E9E;
    font-size:12px;
    padding-top:10px;
}

tmx-datepicker .k-picker-wrap.k-state-default>.k-select,
tmx-datepicker .k-datetimepicker .k-select{
    border:none;
    width:0px;
    /*border-right:solid #f0f0f0 1px;*/
    height:48px;
    /*width:48px;*/

}
tmx-datepicker .k-datetimepicker .k-picker-wrap .k-icon{
    width:18px;
    margin: 9px 0px 0px 0px;
    display:none;
    /*margin:16px;*/
    /*width:24px;*/
    /*height:24px;*/
}

tmx-datepicker .k-picker-wrap .k-input,
tmx-datepicker  .k-picker-wrap.k-state-hover .k-input,
tmx-datepicker input.k-input{
    padding: 12px 0px 6px 1px;
    max-width: 100%;
    /* border: none; */
    text-indent: 0px;
    line-height: 2px;
    border-bottom: solid #E1E1E1 2px !important;
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
    width: 100%;

}

.search4{
    height: 150px;
    width: 260px;
}

tmx-datepicker md-input-container .k-state-disabled input.k-input {
   border:none;

}
tmx-datepicker input.k-input.DateInvalid {
    border-bottom:solid red 2px;

}

tmx-datepicker input.k-input[placeholder]{
    line-height: initial;
    box-shadow: none;
}
tmx-datepicker .date-arrow{
    margin: 0px 0px 0px 270px;
    position:absolute;
    top:115%;

}
tmx-datepicker md-icon:focus{
   border:none;
    outline:none;
}
tmx-datepicker .k-picker-wrap.k-state-disabled{
   background-color:#FFFFFF;
    /*color:#BDBDBD;*/
    padding:0px 0px 0px 0px;
    border:none;
}

tmx-datepicker .calenderIcon{
    font-size:32px;
    padding-right:8px;
    margin:24px 8px 0px -5px;
}

.tmx-datepicker-div
{
    margin: 3px 0px 0px 8px;
    width:100%
}

tmx-datepicker  .k-picker-wrap.k-state-focused .k-input{
    padding: 10px 0px 8px 1px;
}

/*//////////////CALENDER POPUP CSS//////////////*/

.k-calendar .k-content,
.k-calendar .k-content th{
    padding:8px;
    text-align:center;

}
.k-calendar .k-link.k-state-hover{
    background-color:#0091EA;
}

.k-calendar .k-header,
.k-calendar .k-state-selected>.k-link
{
    background-color:#0091EA;
}
.k-calendar .k-header .k-link.k-nav-prev,
.k-calendar .k-header .k-link.k-nav-next{
    border-radius: 100%;
}
.k-calendar .k-link{
    border-radius:100%;
}

/*.k-calendar table.k-content thead tr{*/
    /*height:48px;*/
/*}*/
.k-calendar .k-header .k-link{
    font-weight:700;
    font-size: 16px;
}


tmx-datepicker md-input-container label:not(.md-no-float):not(.md-container-ignore).tmx-datepicker-label{
    margin-bottom:8px;
}
tmx-datepicker md-input-container.md-input-has-value:not(.md-input-invalid) label:first-child{
    margin-bottom:0px;
}


.datepicker-clear-wrap{
    position: absolute;
    margin: auto;
    right: 0;
    bottom: 0;
}
.datepicker-clear-icon
{
    color:red !important;
    margin:0px 8px 0px 2px;
    cursor: pointer;
}
.textarea md-input-container label{
    font-size: 14px;
    font-weight: 400;
    height: 16px;
    margin: 0px 0px 16px 0px;
}

.textarea md-input-container.md-input-invalid.md-input-focused label,
.textarea md-input-container.md-input-invalid label{
    font-size: 14px;
    font-weight: 400;
    Color: red;
    height: 16px;
    width: auto;
    padding: 0px 0px 0px 0px;
}

.textarea md-input-container.md-input-invalid.md-input-focused label{
    font-size: 14px;
    font-weight: 400;
    height: 16px;
    padding: 0px 0px 8px 0px;
    margin: 0px 0px 16px 0px;
}

.addressValidity{

    color:red;
    font-weight: 400;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 12px;
    opacity: 1;

}
tmx-search-bar {

}

tmx-search-bar .md-has-icon {
    padding-left: 0px !important;
}


tmx-search-bar .search-suggestions-container {

    margin-left: 25px;
    background-color: white;
    overflow-y: scroll;
    border-bottom: 1px solid rgb(245, 245, 245);
    border-left: 1px solid rgb(245, 245, 245);
    border-right: 1px solid rgb(245, 245, 245);
    z-index: 1000;
    max-height: 250px;
}

tmx-search-bar #no-search-suggestion-item {
    max-height: 30px;
}

tmx-search-bar #search-suggestion-text {
    color: rgb(0, 145, 234);
}

tmx-search-bar .search-suggestions md-checkbox {
    margin-bottom: 10px !important;
}

tmx-search-bar .search-suggestions {
  
    margin-left: 10px;
    padding-top: 10px;
    
}

#preview img{height:100px; width:100px; }