.mcard,.mcard-st-alone{
    background-color: white;
    border-radius: .1rem;
    box-shadow: 0 2px 8px #00000029;
    padding: 80px 60px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.m-card{
    margin-top: 20px;
}

.mcard-full{
    width:35%;
}

.mcard > h3, .mcard-st-alone > h3 {
    color : var(--color-text);
    margin-top: 0;
    margin-bottom: 30px;
    text-align: left;
    width: 100%;
}

.semicardcontainer{
    display: inline-flex;
    justify-content: space-between;
    align-items: flex-end;
    margin: 0px 0px 30px 0px;
    width: 100%;
}

.info-card-item-ap {
    padding: 10px 0px;
    text-align: left;
    width: -webkit-fill-available;
    margin-bottom: 0;
    margin-top: 0;
  }

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-internal-autofill-selected{
    background-color: white !important;
    transition: background-color 5000s ease-in 0s;
}

.placeholder{
    color: var(--color-text-semi);
    font-weight: 200;
    text-align: left;
    width: 100%;
}

.h-text{
    color: var(--color-text);
    font-weight: 600;
}

.formlink, .formlink-inline{
    display: block;
    margin: 15px 0px;
    text-decoration: none;
    color: var(--color-text-link);
    transition: all .3s;
    text-align: left;
    width: 100%;
}

.formlink:hover{
    color: var(--color-text-link-hover);
}

.formlink-inline{
    margin: 0;
    color: var(--color-btn-sec-action);
    width: fit-content;
}

.formlink-inline:hover{
    color: var(--color-btn-sec-action-hover);
}

.disabledlink{
    pointer-events: none;
    color: #bdbdbd !important;
  }

.minput-group{
    display: flex;
    text-align: center;
    width: 100%;
    border-bottom: 3px solid #bdbdbd;
    border-radius: .1rem;
    transition: all .3s;
    animation-duration: .3s;
    margin: 0px 0px 30px 0px;
  }

  .minput-group-semi{
    margin: 0 !important;
    width: 100px;
  }

  .minput-group-searchbar{
    border-bottom: 3px solid var(--company-color);
    display: inline-flex;
    flex-direction: row;
    min-width: 300px;
  }

.minput-group-searchbar button{
    width: 60px !important;
 }

 .minput-group-semi{
    display: flex;
    text-align: center;
    border-bottom: 3px solid #bdbdbd;
    border-radius: .1rem;
    transition: all .3s;
    animation-duration: .3s;
    align-items: center;
  }

  .minput-group-semi span{
    box-sizing: border-box;
    padding-right: 5px;
    font-weight: 300;
  }

  .minput-group > img{
    width: 20px;
    height: 24px;
  }

input[type=text] ,input[type=password],input[type=email],input[type=search]{
    appearance: none;
    border: none;
    width: 100%;
    outline: none;
    padding: 5px 0px;
    font-size: 16px;
    transition: all .3s;
    background-color: transparent;
}

.minput-group-semi .inputtime{
    width: 80px;
}

textarea{
    resize: none;
    margin-top: 5px;
    border: 3px solid #bdbdbd;
    outline: none;
    border-radius: .1rem;
    width: 100%;
    margin: 0px 0px 30px 0px;
    box-sizing: border-box;
}

input[type=date]{
    appearance: none;
    border: none;
    outline: none;
    padding: 5px 0px;
    font-size: 16px;
    transition: all .3s;
    background-color: transparent;
    border-bottom: 3px solid #bdbdbd;
}

select{
    border: none;
    outline: none;
    padding: 5px;
    font-size: 16px;
    transition: all .3s;
    cursor: pointer;
    background-color: transparent;
    border-bottom: 3px solid #bdbdbd;
    min-width: 240px;
}

input[type=checkbox] {
    appearance: none;
    height: 20px;
    width: 20px;
    outline: none;
    border: 2px solid black;
    border-radius: .1rem;
    cursor: pointer;
    margin: 0px 5px;
    transition: all .3s;
    background-color: white;
}

input[type=checkbox]:checked{
    background-image: url("../icons/check.svg");
    background-repeat: no-repeat;
    background-color: #E0F2F1;
    background-size: contain;
}

input[type=range]{
    appearance: none;
    width: 240px;
    cursor: pointer;
    height: 6px;
    background-color: #E0F2F1;
    border-radius: .1rem;
    display: flex;
    align-items: center;
}

.range-area{
    display: flex;
    align-items: center;
}

.range-area span{
    box-sizing: border-box;
    margin-right: 15px;
}

.btn-form-area{
    width: 100% !important;
    text-align: center;
    margin-top: 55px !important;
}

.btn{
    position: relative;
    width: 260px;
    height: 55px;
    border: none;
    font-size: 20px;
    font-weight: 700;
    transition: all .3s;
    border-radius: .1rem;
    overflow: hidden;
    cursor: pointer;
    box-sizing: border-box;
}

.btn-float{
    display: none;
    position: fixed;
    bottom: 60px;
    right: 40px;
    z-index: 100;
    height: 45px;
    width: 45px;
    outline: none;
    border: none;
    border-radius: 50%;
    background-color: var(--color-text-hover);
    align-items: center;
    justify-content: center;
    z-index: 200;
}

.btn-float img{
  width: 75%;
}

.btn-act{
    background-color: var(--color-btn-action);
    color:white;
}

.btn-act:hover{
    background-color: var(--color-btn-action-hover);
}

.btn-dlt{
    background-color: var(--color-btn-dlt);
    color:white;
}

.btn-dlt:hover{
    background-color: var(--color-btn-dlt-hover);
}

.btn-act-b{
    background-color: var(--color-btn-sec-action);
    color:white;
}

.btn-act-b:hover{
    background-color: var(--color-btn-sec-action-hover);
}

.btn-no-act{
    background-color: var(--color-btn-dlt);
    color:white;
}

.btn-no-act:hover{
    background-color: var(--color-btn-dlt-hover);
}

.btn-google{
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
    background-repeat: no-repeat;
    background-position: 18px 50%;
    color: var(--color-text-semi);
    background-size: 24px;
    padding-left: 24px;
}

.btn-google:hover{
  color: var(--color-text);
}

.buttonloader::before{
    content: '';
    position: absolute;
    border: none;
    top: 0;
    left: 0;
    width: 150%;
    height: 100%;
    background: var(--button-loading-efect);
    animation: load .2s infinite linear;
  }

  .info-div{
    display: flex;
    color: var(--color-btn-sec-action);
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }

  .info-div-full{
    width: 100%;
    display: flex;
    color: var(--color-btn-sec-action);
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .info-div-input{
    display: flex;
    color: var(--color-btn-sec-action);
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    margin-bottom: 5px;
    margin-top: -5px;
  }

  .info-div-input > .mtooltiptext > span{
    display: block;
    padding: 5px;
    font-size: 16px;
  }

   .info-div-input > .mtooltiptext > ul{
    font-size: 14px;
  }

  .info-div .placeholder, .info-div-full .placeholder{
    padding-right: 15px;
    width: unset;
  }
  
  .info-img{
    width: 26px;
    margin-bottom: -10px;
  }

  .info-img:hover{
    cursor: help;
  }
  
  .mtooltiptext {
    visibility: hidden;
    background-color: black;
    color: #fff;
    width: 340px;
    text-align: left;
    border-radius: .1rem;
    border: var(--color-text-hover) solid 2px;
    font-size: 18px;
    position: absolute;
    z-index: 1;
    top: 25%;
    left: -340px;
    right: 0%;
    margin-top: 25px;
  }
  .mtooltiptext ul{
    padding-right: 15px;
  }
  
  .info-img:hover ~ .mtooltiptext {
    visibility: visible;
  }

  .download-options-area{
    position: relative;
  }

  .download-options{
    visibility: hidden;
    position: absolute;
    z-index: 1;
    background-color: white;
    min-width: 160px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 6px;
    text-align: left;
    transition: all .3s;
  }

  .download-options-full{
    visibility: hidden;
    position: absolute;
    z-index: 1;
    background-color: white;
    min-width: 160px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 6px;
    text-align: left;
    transition: all .3s;
    right: 10px;
  }

  .download-options a,.download-options-full a{
    color: var(--color-text);
    padding: 12px 16px;
    font-size: 16px !important;
    text-decoration: none;
    display: block;
  }

  .download-options a:hover ,.download-options-full a:hover{
    background-color: #f1f1f1;
  }

  .download-options-area:hover .download-options, .download-options-area:hover .download-options-full {
    visibility: visible;
  }

  .tb-act-checkbox, .tb-act-loader{
    display: inline-flex;
    flex-direction: row;
    align-items: center;
  }

  .tb-act-loader{
    margin-right: 15px;
    box-sizing: border-box;
  }

  .m-top{
    margin-top: 30px !important;
  }

  .m-top-50{
  margin-top: 50px !important;
}

  .fix-d-input{
    display: inline-flex;
  }

  .req-in{
    color: #F44336;
    box-sizing: content-box;
    margin-left: 10px;
    font-size: 25px;
    line-height: 10px;
  }

  .typewrite{
    color: var(--company-color);
    border-right: 2px solid var(--color-text-hover);
    font-weight: 600;
  }

  .ligth-txt-h{
    font-weight: 300;
  }

  .super-h{margin-top: 50px !important;
    font-size: 76px;
    padding: 30px 0px;
    color: var(--color-text-hover);
  }

  a{
    color: var(--color-btn-sec-action);
    transition: all .3s;
    font-weight: 500;
  }

  a:hover{
    color: var(--color-btn-sec-action-hover);
  }

  .actions-container-review button{
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    box-sizing: border-box;
    margin: 0px 0px 0px 5px;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    transition: all .3s;
  }

  .actions-container-review button:hover{
    background: #ECEFF1;
    cursor: pointer;
  }

  .actions-container-review button img{
    width: 25px;
  }

  .margin-top-30{
    margin-top: 30px !important;
  }

  .subcard-escalation-btn{
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    box-sizing: border-box;
    margin: 0px 0px 0px 5px;
    border-radius: 50%;
    transition: all .3s;
  }

  .subcard-escalation-btn img{
    width: 35px;
    cursor: pointer;
  }

  .subcard-escalation span{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 60px;
  }

  #bk-status-span{
    padding: 5px 10px;
    margin-left: 5px;
    border-radius: .1rem;
    color: white;
  }

@media only screen and (max-width:2200px) {
    .mcard-full{
        width:50%;
    }
}


@media only screen and (max-width:1650px) {
    .mcard-full{
        width:60%;
    }
}

@media only screen and (max-width:1300px) {
    .minput-group-semi .inputtime {
        width: 50px;
    }
    .mcard{
        width: 80%;
        padding: 80px 30px;
    }
    .mcard-st-alone{
        padding: 80px 30px;
    }
}

@media only screen and (max-width:992px) {
    .btn-float{
        display: flex;
    }
    .m-top-m{
        margin-top: 30px !important;
    }
}
@media only screen and (max-width:768px) {
  .minput-group-searchbar{
    min-width: 200px;
  }
}
@media only screen and (max-width:576px) {
    .mcard{
        padding: 80px 20px;
    }
    .mcard-full{
        width:95%;
    }
    .btn{
        position: relative;
        width: 200px;
        height: 45px;
        font-size: 18px;
    }
    .mcard-st-alone{
        padding: 80px 20px;
    }
}