@media only screen and (max-width: 800px) {
    #otherCon {
        margin-left: 3%;
    }
    .clickable-row {
        cursor: pointer;
        position: initial;
        border: 1px solid #09487C;
        border-radius: 4px;
        background-color: #FFF;
    }
    #submitBtn {
        min-width: 53%;
    }
    .clickable-row::before {
        border: none;
        display: none;
    }
    .cell{
        font-size: x-small;
    }
    .thead{
        font-size: xx-small;
    }
    .dekstopTable{
        display: none !important;
    }
    .mobileTable{
        display:block !important;
        min-width: 103%;
    }
    .checkboxW{
        width: 15px;
        height: 15px;
    }
    .time-input{
        max-height: 35px;
    }
    .timeSheetInput {
        background-color: #75B0AC5C !important;
        width: 100%;
        padding: 0px !important;
        max-height: 21px;
        max-width: 35%;
        font-size: medium;
        border-radius: 4px;
    }
    .timeSheetTotal{
        background-color: white !important;
        width: 100%;
        text-align: center;
        font-family: 'Roboto';
        color:#09487C;
        max-height: 20px;
        max-width: 25%;
    }
    .tr:first-child {
        display: none;
    }
    .rh > span {
        color: white;
        font-weight: 500;
        display: block;
        position: relative;
    }
    .th,
    .rh > span {
        background: #09487c;
        border: none !important;
    }
    .rhTotal{
        background: white !important;
        color: #09487C !important;
        border: 1px solid #09487C;
        border-radius: 4px;
        font-weight: 600 !important;
    }
    .rhTotal:before{
        border-top-color: #09487C !important;
        border-bottom-color: white !important;
    }
    .rhTotal.active:before{
        border-bottom-color: #09487C;
    }
    .table .rh > span:before {
        content: "";
        display: block;
        position: absolute;
        z-index: 2;
        top: 4px;
        border: 1px solid #09487C !important;
        border-radius: 30px;
        width: 20px;
        height: 20px;
        flex-shrink: 0;
        background-color: white;
        background-image: url("../img/arrow.png");
        background-size: 10px;
        background-position: center;
        background-repeat: no-repeat;
        transform: rotate(180deg);
        transition: transform 0.3s ease;
    }
    
    .table .rh.active > span:before {
        transform: none;
    }
    
    .table .rh.rhTotal > span:before {
        background-color: #09487C;
        background-image: url("../img/whitearrow.png")
    }
    
    .table .rh.rhTotal.active > span:before {
        transform: none;
    }
    
    body {
        font-family: 'Roboto';
    }
    .table>:not(caption)>*>* {
        padding: 0px;
    }
    .td:before {
        content: attr(data-header);
        float: left;
        padding-left: 0.5em;
        color: white;
        text-align: start;
        text-align-last: start;
        background-color: #09487c;
        min-width: 50%;
    }
    .tdTotal:before {
        content: attr(data-header);
        float: left;
        padding-left: 0.5em;
        color: white;
        text-align: start;
        background: #09487C;
        text-align-last: start;
        min-width: 50%;
    }
    .tdTotalDiv{
        background-color: #09487c !important;
        color: white !important;
    }
    .rh{
        border: 1px solid #09487c;
        border-radius: 4px;
        margin-top: 2%;
    }
    .rh > span {
        padding: 3px 13px;
        font-size: 1em;
    }
    .tr{
        line-height: 25px;
        border: 1px solid #09487c;
        margin: 15px 0 0 0;
        border-radius: 4px;
    }
    .trTotal{
        line-height: 25px;
        border: 1px solid #09487c;
        margin: 0;
        border-radius: 4px;
        margin-top: -1%;
    }
    .simpleFont {
        font-size: medium !important;
    }

    .h3Font {
        font-size: x-large !important;
    }

    .form-check-input[type="radio"] {
        width: 10px;
        height: 10px;
        border: 2px solid #09487c !important;
    }

    .form-control {
        max-height: 32px;
        font-size: small;
        outline: none !important;
    }

    .mainContainerD{
        width: 80% !important;
      }
     .mainContainerPS{
        flex: 0 0 auto !important;
        width: 66.66666667% !important;
    }
    .imgArchive {
        display: none !important;
    }

    .textBlock {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }
    #honorar {
        font-size: small !important;
        text-align: end;
        place-self: center;
    }
    #username {
        font-size: small !important;
        text-align: start;
        place-self: center;
    }
    #firstText {
        padding-right: 0px;
        padding-left: 0px;
        width: 33.33%;
        text-align: start;
    }
    #declaration{
        display: none;
    }

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

    #secondText {
        padding-right: 0px;
        text-align: start;
        font-size: small !important;
    }

    #thirdText {
        padding-left: 0px;
        text-align: start;
    }

    #fourthText {
        padding-right: 0px;
        padding-left: 0px;
        text-align: start;
    }

    #lastText {
        padding-left: 0px;
        text-align: center;
        width: 16%;
    }

    .radioB {
        padding-right: 0px;
        padding-left: 0px;
        text-align: start;
        width: 25%;
    }

    #noPadding {
        padding-left: 0px;
    }

    .mainFont {
        font-size: medium !important;
    }
    
    #star {
        width: 85% !important;
    }

    .form-group {
        width: 100% !important;
        padding: 0px !important;
        margin: 0px !important;
    }
    .errorM{
        font-size:medium !important;
    }
    #nextBtn {
        width: 70% !important;
    }

    .form-group {
        width: 100% !important;
        padding: 0px !important;
        margin: 0px !important;
        /*padding-left: 3% !important;*/
    }

    .h2Font {
        font-size: 1.25rem !important;
        padding: 0px !important;
        width: 34% !important;
    }

    .h4Font {
        font-size: 1.25rem !important;
        padding: 0px !important;
        width: 59% !important;
    }

    .h4Font2 {
        font-size: 1.25rem !important;
        width: 45% !important;
        padding-left: 1.7rem !important;
    }

    /* .saveButton {
        width: 35%;
    } */

    .imageProfile {
        width: 30px;
        height: 30px;
    }

    /*.container {
        overflow-y: hidden !important;
        width: fit-content !important;
        padding: 3px;
        max-width: 300px;
    }*/

    .llarge {
        font-size: x-large !important;
    }

    .lllarge {
        font-size: xx-large !important;
    }
    .btable{
        padding: 0px;
    }
    .bdata{
        padding: 0px !important;
    }

    th {
        font-size: x-small !important;
    }

    td {
        font-size: x-small !important;
    }

    .tableScroll {
        overflow-x: scroll;
        overflow-y: hidden;
        min-width: 370px;
    }

    table {
        overflow-x: scroll;
        overflow-y: hidden !important;
        min-width: 500px;
    }
}

@media only screen and (max-width: 1400px) {
    .mainContainerD {
        width: 85%;
    }
}

@media only screen and (max-width: 1210px) {
    .mainContainerD {
        width: 95%;
    }
}
@media only screen and (min-width: 730px) and (max-width: 1000px) {
    .col-md-3 {
        width: 55% !important;
    }
}
@media only screen and (max-width: 995px) {
    .mainContainerD {
        width: 100%;
    }

    .container {
        max-width: 930px;
    }
}