@media only screen and (max-width: 800px) {

    .modal-content {
        background-color: #fefefe !important;
        margin: 10% auto !important;
        padding: 20px !important;
        border: 1px solid #888 !important;
        width: 95% !important;
    }

    .modal {
        position: fixed !important;
        z-index: 5 !important;
        left: 0 !important;
        top: 35px !important;
        width: 100% !important;
        height: 100% !important;
        overflow: auto !important;
        background-color: rgba(0, 0, 0, 0.4) !important;
    }

    .modal-content {
        display: block !important;
    }

    .first-content {
        width: 100% !important;
    }

    .second-content {
        width: 100% !important;
    }

    .button-confirmar {
        width: 100% !important;
        display: flex;
        border: 1px solid #141F59;
        background-color: #141F59;
        color: white;
        font-size: 1em;
        padding: 0.5em;
        border-radius: 9px;
        margin-bottom: 1em;
        font-family: inherit;
        cursor: pointer;
        transition: 0.5s;
        text-align: center;
        justify-content: center;
    }
}


:root {
    --color-light: white;
    --color-dark: #212121;
    --color-signal: #141F59;
    --color-background: var(--color-light);
    --color-text: var(--color-dark);
    --color-accent: var(--color-signal);
    --size-bezel: .5rem;
    --size-radius: 4px;
    line-height: 1.4;
    font-family: "Inter", sans-serif;
    font-size: calc(.6rem + .4vw);
    color: var(--color-text);
    font-weight: 300;
    padding: 0;
}

@font-face {
    font-family: 'SFPRODISPLAYMEDIUM';
    src: url('../../fonts/SFPRODISPLAYMEDIUM.OTF');
}

input {
    background-color: #f4f4fc;
}

table {
    border-collapse: collapse;
    width: 100%;
    /*max-width: 200px;*/
    margin: 0 auto;
    background: white;
    /*border-radius: 0px 0px 5px 5px;
    box-shadow: 0px 6px 4px 0px #c0c0c0c0;*/
}

th {
    /*padding: 10px;*/
    text-align: center;
    width: 14.28%;
    font-family: 'SFPRODISPLAYMEDIUM';
}

td {
    text-align: center;
    width: 14.28%;
}

th {
    background-color: white;
}

td:hover {
    background-color: #f5f5f5;
}

.today {
    background-color: #e6e6e6;
    font-weight: bold;
}

.selected {
    background-color: #007bff;
    color: #fff;
}

#calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: white;
    border-radius: 15px 15px 0px 0px
}

#calendar-title {
    font-size: 24px;
    font-weight: bold;
}

#calendar-nav {
    display: flex;
    justify-content: center;
    align-items: center;
}

    #calendar-nav button {
        background-color: transparent;
        border: none;
        cursor: pointer;
        font-size: 18px;
        margin: 0 5px;
    }

        #calendar-nav button:hover {
            color: #007bff;
        }

.botao-datas {
    width: 20%;
    font-size: 10px;
    border: 0px;
    margin: 2px;
    height: 48px;
    border-radius: 15px;
    background-color: white;
}

    .botao-datas:hover {
        background-color: #f5f5f5;
    }

/*body {
    display: flex;
    align-items: center;
    justify-content: center;*/
/*min-height: 100vh;*/
/*padding: 4rem 0;
    font-family: -system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}*/

.scheduleContainer {
    display: grid;
    grid-gap: 0.2rem;
    font-family: "SFPRODISPLAYMEDIUM";
    grid-template-columns: 5rem repeat(200, 1fr);
    /*grid-template-rows: repeat(32, 1fr);*/
    grid-template-areas: "time800 stage stage stage stage" "time830 stage stage stage stage" "time900 stage stage stage stage" "time930 stage stage stage stage" "time1000 stage stage stage stage" "time1030 stage stage stage stage" "time1100 stage stage stage stage" "time1130 stage stage stage stage" "time1200 stage stage stage stage" "time1230 stage stage stage stage" "time1300 stage stage stage stage" "time1330 stage stage stage stage" "time1400 stage stage stage stage" "time1430 stage stage stage stage" "time1500 stage stage stage stage" "time1530 stage stage stage stage" "time1600 stage stage stage stage" "time1630 stage stage stage stage" "time1700 stage stage stage stage" "time1730 stage stage stage stage" "time1800 stage stage stage stage" "time1830 stage stage stage stage" "time1900 stage stage stage stage" "time1930 stage stage stage stage" "time2000 stage stage stage stage" "time2030 stage stage stage stage" "time2100 stage stage stage stage" "time2130 stage stage stage stage" "time2200 stage stage stage stage" "time2230 stage stage stage stage" "time2300 stage stage stage stage" "time2330 stage stage stage stage";
}
/**
 * Time
 */
.time {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-top: thin dotted #ccc;
    height: 100%;
    padding: 0 0.5rem;
    width: 5em;
}

    .time.start-800 {
        grid-area: time800;
    }

    .time.start-830 {
        grid-area: time830;
    }

    .time.start-900 {
        grid-area: time900;
    }

    .time.start-930 {
        grid-area: time930;
    }

    .time.start-1000 {
        grid-area: time1000;
    }

    .time.start-1030 {
        grid-area: time1030;
    }

    .time.start-1100 {
        grid-area: time1100;
    }

    .time.start-1130 {
        grid-area: time1130;
    }

    .time.start-1200 {
        grid-area: time1200;
    }

    .time.start-1230 {
        grid-area: time1230;
    }

    .time.start-1300 {
        grid-area: time1300;
    }

    .time.start-1330 {
        grid-area: time1330;
    }

    .time.start-1400 {
        grid-area: time1400;
    }

    .time.start-1430 {
        grid-area: time1430;
    }

    .time.start-1500 {
        grid-area: time1500;
    }

    .time.start-1530 {
        grid-area: time1530;
    }

    .time.start-1600 {
        grid-area: time1600;
    }

    .time.start-1630 {
        grid-area: time1630;
    }

    .time.start-1700 {
        grid-area: time1700;
    }

    .time.start-1730 {
        grid-area: time1730;
    }

    .time.start-1800 {
        grid-area: time1800;
    }

    .time.start-1830 {
        grid-area: time1830;
    }

    .time.start-1900 {
        grid-area: time1900;
    }

    .time.start-1930 {
        grid-area: time1930;
    }

    .time.start-2000 {
        grid-area: time2000;
    }

    .time.start-2030 {
        grid-area: time2030;
    }

    .time.start-2100 {
        grid-area: time2100;
    }

    .time.start-2130 {
        grid-area: time2130;
    }

    .time.start-2200 {
        grid-area: time2200;
    }

    .time.start-2230 {
        grid-area: time2230;
    }

    .time.start-2300 {
        grid-area: time2300;
    }

    .time.start-2330 {
        grid-area: time2330;
    }


    .time[class*="30"]:not(.start-1300):not(.start-2300) {
        font-size: 0.8rem;
        color: #ccc;
    }

/**
 * Event
 */
.event {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0.5rem 1rem;
    background-color: orange;
    border-radius: 0.2rem;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.4;
    font-family: "SFPRODISPLAYMEDIUM", sans-serif;
}

    .event span {
        display: block;
        width: 100%;
        font-size: 1em;
        font-weight: normal;
    }

    .event.start-800 {
        grid-row-start: time800;
    }

    .event.start-830 {
        grid-row-start: time830;
    }

    .event.start-900 {
        grid-row-start: time900;
    }

    .event.start-930 {
        grid-row-start: time930;
    }

    .event.start-1000 {
        grid-row-start: time1000;
    }

    .event.start-1030 {
        grid-row-start: time1030;
    }

    .event.start-1100 {
        grid-row-start: time1100;
    }

    .event.start-1130 {
        grid-row-start: time1130;
    }

    .event.start-1200 {
        grid-row-start: time1200;
    }

    .event.start-1230 {
        grid-row-start: time1230;
    }

    .event.start-1300 {
        grid-row-start: time1300;
    }

    .event.start-1330 {
        grid-row-start: time1330;
    }

    .event.start-1400 {
        grid-row-start: time1400;
    }

    .event.start-1430 {
        grid-row-start: time1430;
    }

    .event.start-1500 {
        grid-row-start: time1500;
    }

    .event.start-1530 {
        grid-row-start: time1530;
    }

    .event.start-1600 {
        grid-row-start: time1600;
    }

    .event.start-1630 {
        grid-row-start: time1630;
    }

    .event.start-1700 {
        grid-row-start: time1700;
    }

    .event.start-1730 {
        grid-row-start: time1730;
    }

    .event.start-1800 {
        grid-row-start: time1800;
    }

    .event.start-1830 {
        grid-row-start: time1830;
    }

    .event.start-1900 {
        grid-row-start: time1900;
    }

    .event.start-1930 {
        grid-row-start: time1930;
    }

    .event.start-2000 {
        grid-row-start: time2000;
    }

    .event.start-2030 {
        grid-row-start: time2030;
    }

    .event.start-2100 {
        grid-row-start: time2100;
    }

    .event.start-2130 {
        grid-row-start: time2130;
    }

    .event.start-2200 {
        grid-row-start: time2200;
    }

    .event.start-2230 {
        grid-row-start: time2230;
    }

    .event.start-2300 {
        grid-row-start: time2300;
    }

    .event.start-2330 {
        grid-row-start: time2330;
    }

    .event.end-800 {
        grid-row-end: time800;
    }

    .event.end-830 {
        grid-row-end: time830;
    }

    .event.end-900 {
        grid-row-end: time900;
    }

    .event.end-930 {
        grid-row-end: time930;
    }

    .event.end-1000 {
        grid-row-end: time1000;
    }

    .event.end-1030 {
        grid-row-end: time1030;
    }

    .event.end-1100 {
        grid-row-end: time1100;
    }

    .event.end-1130 {
        grid-row-end: time1130;
    }

    .event.end-1200 {
        grid-row-end: time1200;
    }

    .event.end-1230 {
        grid-row-end: time1230;
    }

    .event.end-1300 {
        grid-row-end: time1300;
    }

    .event.end-1330 {
        grid-row-end: time1330;
    }

    .event.end-1400 {
        grid-row-end: time1400;
    }

    .event.end-1430 {
        grid-row-end: time1430;
    }

    .event.end-1500 {
        grid-row-end: time1500;
    }

    .event.end-1530 {
        grid-row-end: time1530;
    }

    .event.end-1600 {
        grid-row-end: time1600;
    }

    .event.end-1630 {
        grid-row-end: time1630;
    }

    .event.end-1700 {
        grid-row-end: time1700;
    }

    .event.end-1730 {
        grid-row-end: time1730;
    }

    .event.end-1800 {
        grid-row-end: time1800;
    }

    .event.end-1830 {
        grid-row-end: time1830;
    }

    .event.end-1900 {
        grid-row-end: time1900;
    }

    .event.end-1930 {
        grid-row-end: time1930;
    }

    .event.end-2000 {
        grid-row-end: time2000;
    }

    .event.end-2030 {
        grid-row-end: time2030;
    }

    .event.end-2100 {
        grid-row-end: time2100;
    }

    .event.end-2130 {
        grid-row-end: time2130;
    }

    .event.end-2200 {
        grid-row-end: time2200;
    }

    .event.end-2230 {
        grid-row-end: time2230;
    }

    .event.end-2300 {
        grid-row-end: time2300;
    }

    .event.end-2330 {
        grid-row-end: time2330;
    }

    .event.length-1 {
        grid-column-end: span 1;
    }

    .event.length-2 {
        grid-column-end: span 2;
    }

    .event.length-3 {
        grid-column-end: span 3;
    }

    .event.length-4 {
        grid-column-end: span 4;
    }

    .event.length-5 {
        grid-column-end: span 5;
    }

    .event.length-6 {
        grid-column-end: span 6;
    }

    .event.length-7 {
        grid-column-end: span 7;
    }

    .event.length-8 {
        grid-column-end: span 8;
    }

    .event.length-9 {
        grid-column-end: span 9;
    }

    .event.length-10 {
        grid-column-end: span 10;
    }

    .event.length-11 {
        grid-column-end: span 11;
    }

    .event.length-12 {
        grid-column-end: span 12;
    }

    .event.length-13 {
        grid-column-end: span 13;
    }

    .event.length-14 {
        grid-column-end: span 14;
    }

    .event.length-15 {
        grid-column-end: span 15;
    }

    .event.length-16 {
        grid-column-end: span 16;
    }

    .event.length-17 {
        grid-column-end: span 17;
    }

    .event.length-18 {
        grid-column-end: span 18;
    }

    .event.length-19 {
        grid-column-end: span 19;
    }

    .event.length-20 {
        grid-column-end: span 20;
    }

    .event.length-21 {
        grid-column-end: span 21;
    }

    .event.length-22 {
        grid-column-end: span 22;
    }

    .event.length-23 {
        grid-column-end: span 23;
    }

    .event.length-24 {
        grid-column-end: span 24;
    }

    .event.length-25 {
        grid-column-end: span 25;
    }

    .event.length-26 {
        grid-column-end: span 26;
    }

    .event.length-27 {
        grid-column-end: span 27;
    }

    .event.length-28 {
        grid-column-end: span 28;
    }

    .event.length-29 {
        grid-column-end: span 29;
    }

    .event.length-30 {
        grid-column-end: span 30;
    }

    .event.length-31 {
        grid-column-end: span 31;
    }

    .event.length-32 {
        grid-column-end: span 32;
    }

    .event.length-33 {
        grid-column-end: span 33;
    }

    .event.length-34 {
        grid-column-end: span 34;
    }

    .event.length-35 {
        grid-column-end: span 35;
    }

    .event.length-36 {
        grid-column-end: span 36;
    }

    .event.length-37 {
        grid-column-end: span 37;
    }

    .event.length-38 {
        grid-column-end: span 38;
    }

    .event.length-39 {
        grid-column-end: span 39;
    }

    .event.length-40 {
        grid-column-end: span 40;
    }

    .event.length-41 {
        grid-column-end: span 41;
    }

    .event.length-42 {
        grid-column-end: span 42;
    }

    .event.length-43 {
        grid-column-end: span 43;
    }

    .event.length-44 {
        grid-column-end: span 44;
    }

    .event.length-45 {
        grid-column-end: span 45;
    }

    .event.length-46 {
        grid-column-end: span 46;
    }

    .event.length-47 {
        grid-column-end: span 47;
    }

    .event.length-48 {
        grid-column-end: span 48;
    }

    .event.length-49 {
        grid-column-end: span 49;
    }

    .event.length-50 {
        grid-column-end: span 50;
    }

    .event.length-51 {
        grid-column-end: span 51;
    }

    .event.length-52 {
        grid-column-end: span 52;
    }

    .event.length-53 {
        grid-column-end: span 53;
    }

    .event.length-54 {
        grid-column-end: span 54;
    }

    .event.length-55 {
        grid-column-end: span 55;
    }

    .event.length-56 {
        grid-column-end: span 56;
    }

    .event.length-57 {
        grid-column-end: span 57;
    }

    .event.length-58 {
        grid-column-end: span 58;
    }

    .event.length-59 {
        grid-column-end: span 59;
    }

    .event.length-60 {
        grid-column-end: span 60;
    }

    .event.length-61 {
        grid-column-end: span 61;
    }

    .event.length-62 {
        grid-column-end: span 62;
    }

    .event.length-63 {
        grid-column-end: span 63;
    }

    .event.length-64 {
        grid-column-end: span 64;
    }

    .event.length-65 {
        grid-column-end: span 65;
    }

    .event.length-66 {
        grid-column-end: span 66;
    }

    .event.length-67 {
        grid-column-end: span 67;
    }

    .event.length-68 {
        grid-column-end: span 68;
    }

    .event.length-69 {
        grid-column-end: span 69;
    }

    .event.length-70 {
        grid-column-end: span 70;
    }

    .event.length-71 {
        grid-column-end: span 71;
    }

    .event.length-72 {
        grid-column-end: span 72;
    }

    .event.length-73 {
        grid-column-end: span 73;
    }

    .event.length-74 {
        grid-column-end: span 74;
    }

    .event.length-75 {
        grid-column-end: span 75;
    }

    .event.length-76 {
        grid-column-end: span 76;
    }

    .event.length-77 {
        grid-column-end: span 77;
    }

    .event.length-78 {
        grid-column-end: span 78;
    }

    .event.length-79 {
        grid-column-end: span 79;
    }

    .event.length-80 {
        grid-column-end: span 80;
    }

    .event.length-81 {
        grid-column-end: span 81;
    }

    .event.length-82 {
        grid-column-end: span 82;
    }

    .event.length-83 {
        grid-column-end: span 83;
    }

    .event.length-84 {
        grid-column-end: span 84;
    }

    .event.length-85 {
        grid-column-end: span 85;
    }

    .event.length-86 {
        grid-column-end: span 86;
    }

    .event.length-87 {
        grid-column-end: span 87;
    }

    .event.length-88 {
        grid-column-end: span 88;
    }

    .event.length-89 {
        grid-column-end: span 89;
    }

    .event.length-90 {
        grid-column-end: span 90;
    }

    .event.length-91 {
        grid-column-end: span 91;
    }

    .event.length-92 {
        grid-column-end: span 92;
    }

    .event.length-93 {
        grid-column-end: span 93;
    }

    .event.length-94 {
        grid-column-end: span 94;
    }

    .event.length-95 {
        grid-column-end: span 95;
    }

    .event.length-96 {
        grid-column-end: span 96;
    }

    .event.length-97 {
        grid-column-end: span 97;
    }

    .event.length-98 {
        grid-column-end: span 98;
    }

    .event.length-99 {
        grid-column-end: span 99;
    }

    .event.length-100 {
        grid-column-end: span 100;
    }

    .event.length-101 {
        grid-column-end: span 101;
    }

    .event.length-102 {
        grid-column-end: span 102;
    }

    .event.length-103 {
        grid-column-end: span 103;
    }

    .event.length-104 {
        grid-column-end: span 104;
    }

    .event.length-105 {
        grid-column-end: span 105;
    }

    .event.length-106 {
        grid-column-end: span 106;
    }

    .event.length-107 {
        grid-column-end: span 107;
    }

    .event.length-108 {
        grid-column-end: span 108;
    }

    .event.length-109 {
        grid-column-end: span 109;
    }

    .event.length-110 {
        grid-column-end: span 110;
    }

    .event.length-111 {
        grid-column-end: span 111;
    }

    .event.length-112 {
        grid-column-end: span 112;
    }

    .event.length-113 {
        grid-column-end: span 113;
    }

    .event.length-114 {
        grid-column-end: span 114;
    }

    .event.length-115 {
        grid-column-end: span 115;
    }

    .event.length-116 {
        grid-column-end: span 116;
    }

    .event.length-117 {
        grid-column-end: span 117;
    }

    .event.length-118 {
        grid-column-end: span 118;
    }

    .event.length-119 {
        grid-column-end: span 119;
    }

    .event.length-120 {
        grid-column-end: span 120;
    }

    .event.length-121 {
        grid-column-end: span 121;
    }

    .event.length-122 {
        grid-column-end: span 122;
    }

    .event.length-123 {
        grid-column-end: span 123;
    }

    .event.length-124 {
        grid-column-end: span 124;
    }

    .event.length-125 {
        grid-column-end: span 125;
    }

    .event.length-126 {
        grid-column-end: span 126;
    }

    .event.length-127 {
        grid-column-end: span 127;
    }

    .event.length-128 {
        grid-column-end: span 128;
    }

    .event.length-129 {
        grid-column-end: span 129;
    }

    .event.length-130 {
        grid-column-end: span 130;
    }

    .event.length-131 {
        grid-column-end: span 131;
    }

    .event.length-132 {
        grid-column-end: span 132;
    }

    .event.length-133 {
        grid-column-end: span 133;
    }

    .event.length-134 {
        grid-column-end: span 134;
    }

    .event.length-135 {
        grid-column-end: span 135;
    }

    .event.length-136 {
        grid-column-end: span 136;
    }

    .event.length-137 {
        grid-column-end: span 137;
    }

    .event.length-138 {
        grid-column-end: span 138;
    }

    .event.length-139 {
        grid-column-end: span 139;
    }

    .event.length-140 {
        grid-column-end: span 140;
    }

    .event.length-141 {
        grid-column-end: span 141;
    }

    .event.length-142 {
        grid-column-end: span 142;
    }

    .event.length-143 {
        grid-column-end: span 143;
    }

    .event.length-144 {
        grid-column-end: span 144;
    }

    .event.length-145 {
        grid-column-end: span 145;
    }

    .event.length-146 {
        grid-column-end: span 146;
    }

    .event.length-147 {
        grid-column-end: span 147;
    }

    .event.length-148 {
        grid-column-end: span 148;
    }

    .event.length-149 {
        grid-column-end: span 149;
    }

    .event.length-150 {
        grid-column-end: span 150;
    }

    .event.length-151 {
        grid-column-end: span 151;
    }

    .event.length-152 {
        grid-column-end: span 152;
    }

    .event.length-153 {
        grid-column-end: span 153;
    }

    .event.length-154 {
        grid-column-end: span 154;
    }

    .event.length-155 {
        grid-column-end: span 155;
    }

    .event.length-156 {
        grid-column-end: span 156;
    }

    .event.length-157 {
        grid-column-end: span 157;
    }

    .event.length-158 {
        grid-column-end: span 158;
    }

    .event.length-159 {
        grid-column-end: span 159;
    }

    .event.length-160 {
        grid-column-end: span 160;
    }

    .event.length-161 {
        grid-column-end: span 161;
    }

    .event.length-162 {
        grid-column-end: span 162;
    }

    .event.length-163 {
        grid-column-end: span 163;
    }

    .event.length-164 {
        grid-column-end: span 164;
    }

    .event.length-165 {
        grid-column-end: span 165;
    }

    .event.length-166 {
        grid-column-end: span 166;
    }

    .event.length-167 {
        grid-column-end: span 167;
    }

    .event.length-168 {
        grid-column-end: span 168;
    }

    .event.length-169 {
        grid-column-end: span 169;
    }

    .event.length-170 {
        grid-column-end: span 170;
    }

    .event.length-171 {
        grid-column-end: span 171;
    }

    .event.length-172 {
        grid-column-end: span 172;
    }

    .event.length-173 {
        grid-column-end: span 173;
    }

    .event.length-174 {
        grid-column-end: span 174;
    }

    .event.length-175 {
        grid-column-end: span 175;
    }

    .event.length-176 {
        grid-column-end: span 176;
    }

    .event.length-177 {
        grid-column-end: span 177;
    }

    .event.length-178 {
        grid-column-end: span 178;
    }

    .event.length-179 {
        grid-column-end: span 179;
    }

    .event.length-180 {
        grid-column-end: span 180;
    }

    .event.length-181 {
        grid-column-end: span 181;
    }

    .event.length-182 {
        grid-column-end: span 182;
    }

    .event.length-183 {
        grid-column-end: span 183;
    }

    .event.length-184 {
        grid-column-end: span 184;
    }

    .event.length-185 {
        grid-column-end: span 185;
    }

    .event.length-186 {
        grid-column-end: span 186;
    }

    .event.length-187 {
        grid-column-end: span 187;
    }

    .event.length-188 {
        grid-column-end: span 188;
    }

    .event.length-189 {
        grid-column-end: span 189;
    }

    .event.length-190 {
        grid-column-end: span 190;
    }

    .event.length-191 {
        grid-column-end: span 191;
    }

    .event.length-192 {
        grid-column-end: span 192;
    }

    .event.length-193 {
        grid-column-end: span 193;
    }

    .event.length-194 {
        grid-column-end: span 194;
    }

    .event.length-195 {
        grid-column-end: span 195;
    }

    .event.length-196 {
        grid-column-end: span 196;
    }

    .event.length-197 {
        grid-column-end: span 197;
    }

    .event.length-198 {
        grid-column-end: span 198;
    }

    .event.length-199 {
        grid-column-end: span 199;
    }

    .event.length-200 {
        grid-column-end: span 200;
    }

    .event.stage-earth {
        background-color: #FFA726;
    }

    .event.stage-mercury {
        background-color: #9CCC65;
    }

    .event.stage-venus {
        background-color: #FF8A65;
    }

    .event.stage-mars {
        background-color: #B3E5FC;
    }

    .event.stage-jupiter {
        background-color: #81D4FA;
    }

    .event.stage-saturn {
        background-color: #26C6DA;
    }

.adicionar-button {
    width: 100%;
    font-size: 14px;
    /* margin-bottom: 0.5em; */
    background-color: #076DF2;
    border: none;
    border-radius: 1em;
    color: white;
    height: 2em;
    font-family: 'SFPRODISPLAYMEDIUM';
    height: 3em;
}

.adicionar-button2 {
    width: 200px;
    font-size: 14px;
    margin-bottom: 0.5em;
    background-color: #77bbf5;
    border: none;
    border-radius: 1em;
    color: white;
    height: 3em;
    font-family: 'SFPRODISPLAYMEDIUM';
}

.contain-filter-form {
    background-color: #f1f1fc;
    width: 100%;
    border-radius: 15px 15px 0px 0px;
    box-shadow: 0px 8px 8px 0px #e1e1f3;
    border-left: 3px solid #77bbf5;
    padding: 2em 0em 2em 0em;
}

.titleh3-form {
    background-color: #f1f1fc;
    padding: 2em;
    width: 100%;
    border-radius: 15px 15px 0px 0px;
    box-shadow: 0px 8px 8px 0px #e1e1f3;
    border-left: 2px solid #fff;
    border-right: 2px solid #fff;
}

:root {
    --input-color: #99A3BA;
    --input-border: #CDD9ED;
    --input-background: #fff;
    --input-placeholder: #CBD1DC;
    --input-border-focus: #275EFE;
    --group-color: var(--input-color);
    --group-border: var(--input-border);
    --group-background: #EEF4FF;
    --group-color-focus: #fff;
    --group-border-focus: var(--input-border-focus);
    --group-background-focus: #678EFE;
}

.form-field {
    display: block;
    width: 100%;
    padding: 8px 16px;
    line-height: 25px;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    border-radius: 6px;
    -webkit-appearance: none;
    color: black;
    border: 1px solid #77bbf5;
    background: var(--input-background);
    transition: border 0.3s ease;
    font-family: "SFPRODISPLAYMEDIUM"
}

    .form-field::-moz-placeholder {
        color: var(--input-placeholder);
    }

    .form-field:-ms-input-placeholder {
        color: var(--input-placeholder);
    }

    .form-field::placeholder {
        color: var(--input-placeholder);
    }

    .form-field:focus {
        outline: none;
        border-color: var(--input-border-focus);
    }

.form-group {
    position: relative;
    display: flex;
    width: 100%;
}

    .form-group > span,
    .form-group .form-field {
        white-space: nowrap;
        display: block;
    }

        .form-group > span:not(:first-child):not(:last-child),
        .form-group .form-field:not(:first-child):not(:last-child) {
            border-radius: 0;
        }

        .form-group > span:first-child,
        .form-group .form-field:first-child {
            border-radius: 6px 0 0 6px;
        }

        .form-group > span:last-child,
        .form-group .form-field:last-child {
            border-radius: 0 6px 6px 0;
        }

        .form-group > span:not(:first-child),
        .form-group .form-field:not(:first-child) {
            margin-left: -1px;
        }

    .form-group .form-field {
        position: relative;
        flex: 1 1 auto;
        width: 1%;
        margin-top: 0;
        margin-bottom: 0;
    }

    .form-group > span {
        text-align: center;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 25px;
        color: var(--group-color);
        background: var(--group-background);
        border: 1px solid var(--group-border);
        transition: background 0.3s ease, border 0.3s ease, color 0.3s ease;
    }

    .form-group:focus-within > span {
        color: var(--group-color-focus);
        background: var(--group-background-focus);
        border-color: var(--group-border-focus);
    }

select {
    font-family: "SFPRODISPLAYMEDIUM"
}

.select-group {
    border-radius: 6px 0px 0px 6px;
    border: 1px solid #076DF2;
    color: #141F59;
    transition: 0.3s;
    padding-left: 0.5em;
}

    .select-group:focus {
        background-color: #f5f5f5;
        color: #141F59;
        border-color: #141F59;
        font-family: 'SFPRODISPLAYMEDIUM'
    }

h2, h3, h4 {
    color: #076DF2;
    font-family: 'SFPRODISPLAYMEDIUM', sans-serif;
    font-weight: bold;
}

.radio {
    font-family: 'SFPRODISPLAYMEDIUM'
}

#texto-dia-semana {
    width: 200px;
    border-radius: 15px;
    height: 23px;
    justify-content: center;
    display: flex;
    align-items: center;
    background-color: #141f59;
    color: white;
}

#div-texto-dia-semana {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

label {
    font-family: 'SFPRODISPLAYMEDIUM', sans-serif;
    color: black;
}

.input {
    position: relative;
    display: block;
    margin-top: 15px;
}

.input__label {
    position: absolute;
    left: 0;
    top: 0;
    padding: calc(var(--size-bezel) * 0.75) calc(var(--size-bezel) * .5);
    margin: calc(var(--size-bezel) * 0.75 + 3px) calc(var(--size-bezel) * .5);
    background: pink;
    white-space: nowrap;
    transform: translate(0, 0);
    transform-origin: 0 0;
    background: var(--color-background);
    transition: transform 120ms ease-in;
    font-weight: bold;
    line-height: 1.2;
    color: gray;
}

.input__field {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border: 3px solid #e1e1f3;
    padding: calc(var(--size-bezel) * 1.5) var(--size-bezel);
    color: currentColor;
    background: transparent;
    border-radius: var(--size-radius);
    font-weight: 100;
    font-family: "SFPRODISPLAYMEDIUM";
    height: 4em;
    /*min-width: 300px;*/
}

    .input__field:focus {
        border: 3px solid #141F59;
        outline: none;
    }

    .input__field:not(:-moz-placeholder-shown) + .input__label {
        transform: translate(0.25rem, -65%) scale(0.8);
        color: var(--color-accent);
    }

    .input__field:not(:-ms-input-placeholder) + .input__label {
        transform: translate(0.25rem, -65%) scale(0.8);
        color: var(--color-accent);
    }

    .input__field:focus + .input__label, .input__field:not(:placeholder-shown) + .input__label {
        transform: translate(0.25rem, -65%) scale(1);
        color: var(--color-accent);
        font-family: 'SFPRODISPLAYMEDIUM';
        font-weight: 800
    }

.input {
    flex-basis: calc(33.33%);
}

.buttonsubmitcreate {
    font-size: 18px;

}

    .buttonsubmitcreate span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

        .buttonsubmitcreate span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
        }

    .buttonsubmitcreate:hover span {
        padding-right: 20px;
    }

        .buttonsubmitcreate:hover span:after {
            opacity: 1;
            right: 0;
        }

.atualizar-button-procedimento {
    color: white;
    background-color: green;
    border: 1px solid ivory;
    text-transform: uppercase;
    letter-spacing: 4px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 5px;
    height: 50px;
    width: 100%;
    padding: calc(var(--size-bezel) * 1.5) var(--size-bezel);
    max-width: 280px;
}

.alert-success-return {
    display: flex;
    align-items: center;
    position: fixed;
    top: 60px;
    background-color: #2aab81;
    padding: 10px;
    border-radius: 10px;
    color: white;
}

.alert-danger-return {
    display: flex;
    align-items: center;
    position: fixed;
    top: 80px;
    background-color: #ff3b52;
    padding: 10px;
    border-radius: 10px;
    color: white;
}

.alert-return-button {
    width: 18px;
    height: 18px;
    color: red;
    background-color: white;
    cursor: pointer;
    margin: 0px 5px 0px 5px;
    border: 1px solid white;
    border-radius: 50%;
    padding: 0;
}

.div-content-agenda {
    overflow-y: auto;
    height: 100%;
}

    .div-content-agenda::-webkit-scrollbar {
        background-color: #f2f2f2;
        border-radius: 2px;
        width: 5px;
        height: 5px;
    }

    .div-content-agenda::-webkit-scrollbar-thumb {
        background-color: #ccc;
        border-radius: 2px;
        height: 5px;
        width: 5px;
    }

div-content-agenda span {
    font-size: 12px;
}

.header-agendamento {
    display: flex;
    padding-right: 1px;
}

.agenda-background {
    width: 2em;
    height: 2em;
    background-color: white;
    border-radius: 25%;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    border: 1px solid #f5f5f5;
}

.second-content {
    width: 30%;
}

.btn-chamar {
    justify-content: center;
    display: flex;
    align-items: center;
    width: 100%;
    gap: 15px;
}

p {
    font-family: "SFPRODISPLAYMEDIUM", sans-serif;
}

.container-checkbox-doutores {
    display: none;
}

.container-checkbox-alunos {
    display: none;
}

.name-doutores {
    font-family: 'SFPRODISPLAYMEDIUM', sans-serif;
    font-size: 12px;
    width: auto;
    margin-left: 5px;
    margin-top: 10px;
}

.name-alunos {
    font-family: 'SFPRODISPLAYMEDIUM', sans-serif;
    font-size: 12px;
    width: auto;
    margin-left: 5px;
    margin-top: 10px;
}

.title-curso {
    display: none;
}

.checkbox-doutores {
    width: 1em;
}

.checkbox-alunos {
    width: 1em;
}

.minimize-colaboradores {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    align-items: center;
    margin-left: 1em;
    margin-right: 1em;
    border: 1px solid #141F59;
    background-color: white;
    color: #141F59;
    transition: .2s ease-in-out;
    justify-content: center;
}

    .minimize-colaboradores:hover, svg {
        transform: scale(1.10);
    }

.minimize-alunos {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    align-items: center;
    margin-left: 1em;
    margin-right: 1em;
    border: 1px solid #141F59;
    background-color: white;
    color: #141F59;
    transition: .2s ease-in-out;
    justify-content: center;
}

    .minimize-alunos:hover, svg {
        transform: scale(1.10);
    }

.minimize-cursos {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    align-items: center;
    margin-left: 1em;
    margin-right: 1em;
    border: 1px solid #141F59;
    background-color: white;
    color: #141F59;
    transition: .2s ease-in-out;
    display: none;
    justify-content: center;
}

    .minimize-cursos:hover, svg {
        transform: scale(1.10);
    }

.select-date {
    border: 2px solid #e1e1e1;
    border-radius: var(--size-radius);
    display: flex;
    gap: 10px;
    height: 4em;
}

@media only screen and (max-width: 600px) {
    .input {
        flex-basis: 100% !important;
    }
}