@font-face {
    font-family: 'font1';
    src: url('Montserrat-Regular.ttf') format('opentype');
}

@font-face {
    font-family: 'font2';
    src: url('Montserrat Ultra Light.otf') format('opentype');
}

@font-face {
    font-family: 'font3';
    src: url('Montserrat-Light.otf') format('opentype');
}

html,
body {
    margin: 0px;
    outline: 0px;
    padding: 0px;
    width: 100%;
    /* comentado para funcionar evento onscroll
    height: 100%;
    font-family: Arial, Helvetica, sans-serif;
    color: #0f0f0f;
    overflow-x: hidden;
    overflow-y: hidden; */
}

#msg {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    max-width: 200px;
    min-height: 50px;
    padding: 5px 7px 5px 7px;
    text-align: center;
    border-radius: 5px;
    background-color: white;
    border: 1px solid gainsboro;
}

.pointer:hover {
    cursor: pointer;
}

.pointer_text:hover {
    cursor: text;
}

.opacity:hover {
    opacity: 0.6;
}

.expand {
    max-width: 100%;
    box-sizing: border-box;
}

.grow {
    transition: all .2s ease-in-out;
}

.grow:hover {
    transform: scale(1.1);
}

.hover_gray:hover {
    background-color: #e9e9e9;
}

.hover_green:hover {
    background-color: #dbead5;
}

.hover_red:hover {
    background-color: #ffcaca;
}

.form_field {
    box-shadow: inset 2px 2px 2px 2px #e5e5e5;
    /* font-family: 'font2', sans-serif; */
    font-family: sans-serif, Arial;
    /* transform: scaleX(1.3); */
    /* letter-spacing: 0.7px; */
    /* box-sizing: border-box; */
    padding: 10px 15px 10px 15px;
    border-radius: 5px;
    border: 1px solid black;
}

.dots {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

input[type=checkbox] {
    cursor: pointer;
    width: 18px;
    height: 18px;
}

input[type=radio] {
    cursor: pointer;
    width: 18px;
    height: 18px;
}

.column_center_center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.column_center_start {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.column_start_start {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.column_start_center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.column_start_end {
    display: flex;
    flex-direction: column;
    align-items: end;
    justify-content: start;
}

.column_end_center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
}

.column_evenly {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.column_between {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.row_center_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.row_start_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
}

.row_center_start {
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: center;
}

.row_end_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}

.row_start_wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.row_end {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}

.row_evenly_start {
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: space-evenly;
}

.row_evenly_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
}

.row_around_start {
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: space-around;
}

.row_around_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}

.row_between {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.row_between_start {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

.row_between_center {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.row_between_nowrap {
    display: flex;
    flex-direction: row;
    /* flex-wrap: nowrap; */
    /* flex-grow: 1,2; */
    align-items: center;
    justify-content: space-between;
}

.box_shadow {
    /* box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px; */
    box-shadow:
        0px 0px 0px 2px rgba(95, 95, 95, 0.5),
        0px 2px 4px rgba(95, 95, 95, 0.5),
        0px 4px 8px rgba(95, 95, 95, 0.5),
        0px 2px 6px rgba(95, 95, 95, 0.5);
}

.box_shadow1 {
    box-shadow:
        rgba(0, 0, 0, 0.07) 0px 1px 1px,
        rgba(0, 0, 0, 0.07) 0px 2px 2px,
        rgba(0, 0, 0, 0.07) 0px 4px 4px,
        rgba(0, 0, 0, 0.07) 0px 8px 8px,
        rgba(0, 0, 0, 0.07) 0px 16px 16px;
}

.box_shadow2 {
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; */
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}

.box_shadow3 {
    box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.box_shadow4 {
    box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;
}

.box_shadow_button {
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}


.inner_shadow {
    /* box-shadow: inset -10px -10px 15px rgba(255, 255, 255, 0.5), 
   inset 10px 10px 15px rgba(70, 70, 70, 0.12); */
    /* box-shadow: inset 0px 2px 5px 1px rgba(47, 47, 47, 0.25); */
    box-shadow: inset 2px 2px 2px 2px #e5e5e5;
    /* box-shadow: inset 0 0 10px #bcbcbc; */
}

.inner_shadow2 {
    box-shadow: #752407 0px 30px 60px -12px inset, #752407 0px 18px 36px -18px inset;
}

.text_shadow {
    /* text-shadow: 2px 7px 5px rgba(0,0,0,0.3), 0px -4px 10px rgba(255,255,255,0.3); */
    text-shadow: 3px 4px 7px rgba(81, 67, 21, 0.8);
}

.text_border {
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

.button_close {
    background: #ff4d4d;
    color: white;
    font-size: 16px;
    font-weight: bold;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

.button_confirm {
    background: #28a745;
    color: white;
    font-size: 16px;
    font-weight: bold;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: all 0.2s ease;
}

.glassmorphism {
    background-color: transparent;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    background-image: linear-gradient(120deg, rgba(255, 255, 255, 0.3), rgba(0, 0, 0, 0.2));
}

.msg_show_ani {
    animation: msg_show_ani 0.7s forwards;
}

@keyframes msg_show_ani {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.msg_hide_ani {
    animation: msg_hide_ani 0.7s forwards;
}

@keyframes msg_hide_ani {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.appear {
    animation: appear 0.2s forwards;
}

@keyframes appear {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.disappear {
    animation: disappear 0.2s forwards;
}

@keyframes disappear {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.increase {
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    height: auto;
    max-height: 125px;
    /* max-height: auto; */
    opacity: 1;
}

.increase.decrease {
    max-height: 0;
    opacity: 0;
}

.loading {
    animation: is-rotating 1s infinite;
    border: 20px solid #e5e5e5;
    border-radius: 50%;
    border-top-color: #9db5b6;
    height: 50px;
    width: 50px;
    /*visibility: true;*/
}

@keyframes is-rotating {
    to {
        transform: rotate(1turn);
    }
}

.phone-input {
    /* width: 200px; */
    padding: 10px;
    border: 2px solid #4d4d4d;
    border-radius: 5px;
    font-size: 16px;
    font-family: Arial, sans-serif;
    /* margin-bottom: 10px; */
    letter-spacing: 2px;
}

.phone-input:focus {
    outline: none;
    border-color: #4CAF50;
}

.phone-input:empty:before {
    content: attr(data-placeholder);
    color: #585858;
}