/*variables*/
:root {
    --m-base: 2px;
    --m-2: calc(var(--m-base)*2);
    --m-3: calc(var(--m-base)*3);
    --m-4: calc(var(--m-base)*4);
    --h-base: 2px;
    --h-10: calc(var(--h-base)*10);
    --h-20: calc(var(--h-base)*20);
    --h-30: calc(var(--h-base)*30);
}

/*margins*/
/*base*/
.error{
    color:red;
}

.m-tb-base {
    margin-top: var(--m-base);
    margin-bottom: var(--m-base);
}

.m-tb-2 {
    margin-top: var(--m-2);
    margin-bottom: var(--m-2);
}

.m-lr-2 {
    margin-left: var(--m-2);
    margin-right: var(--m-2);
}

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

.m-tb-3 {
    margin-top: var(--m-3);
    margin-bottom: var(--m-3);
}

.m-tb-4 {
    margin-top: var(--m-4);
    margin-bottom: var(--m-4);
}

.m-t-20 {
    margin-top: 20px;
}
/*#region paddings*/
.p-t-3{
    padding-top:3px;
}

.p-t-5 {
    padding-top: 5px;
}

.p-t-10 {
    padding-top: 10px;
}

.p-t-12 {
    padding-top: 12px;
}

.p-t-13 {
    padding-top: 13px;
}

.p-l-5 {
    padding-left: 5px;
}

.p-l-10{
    padding-left:10px;
}
/*#endregion*/
/*heights*/
/*fijos*/
.h-20, .H20px {
    height: 20px;
    min-height: 20px;
    max-height: 20px;
}

.h-30 {
    height: 30px;
    min-height: 30px;
    max-height: 30px;
}

.h-44 {
    height: 44px;
    min-height: 44px;
    max-height: 44px;
}


.h-46 {
    height: 46px;
    min-height: 46px;
    max-height: 46px;
}

.H60px, .h-60 {
    height: 60px;
}

.h-72{
    height:72px;
}

.H100px,.h-100 {
    height: 100px;
}

.W100p {
    width: 100%;
}

/*#region calc*/
.h-vh-50px {
    height: calc(100vh - 50px);
}

.h-vh-150px {
    height: calc(100vh - 150px);
}
/*#endregion
*/

.W30px {
    width: 30px;
}

.W150px {
    width: 150px;
}

/*base*/
.h20px {
    height: var(--h-20);
}


.imgBtn18 {
    max-height: 18px;
    max-width: 18px;
    cursor: pointer;
}

.W20px {
    width: 20px;
    min-width: 20px;
    max-width: 20px;
}

.W30px {
    width: 30px;
    min-width: 30px;
    max-width: 30px;
}

.W50px {
    width: 50px;
    min-width: 50px;
    max-width: 50px;
}

.W100px {
    min-width: 100px;
    width: 100px;
    max-width: 100px;
}

.W120px {
    min-width: 120px;
    width: 120px;
    max-width: 120px;
}

.W125px {
    min-width: 125px;
    width: 125px;
    max-width: 125px;
}

.W150px {
    min-width: 150px;
    width: 150px;
    max-width: 150px;
}

.W300px {
    min-width: 300px;
    width: 300px;
    max-width: 300px;
}

.W200px {
    min-width: 200px;
    width: 200px;
    max-width: 200px;
}

.W250px {
    min-width: 250px;
    width: 250px;
    max-width: 250px;
}



.tMid {
    text-align: center !important;
    margin: 0px;
    padding: 0px;
}

.vh100-140px {
    height: calc(100vh - 140px);
}

.vh100-150px {
    height: calc(100vh - 150px);
}

.overflow-hidden{
    overflow:hidden;
}

.overflow-x{
    overflow-x:auto;
}