.agenda_con{
    position:relative;
    width:100%;
    height:100%;
    display:flex;
    flex-direction: column;
}

.month_title{
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    font-size:80px;
}
.current_month{
    grid-column: 2;
    display: flex;
    justify-content: center;
    align-items: center;
}
.current_year{
    justify-self:right;
    grid-column: 3;
    margin-right:10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.arrow {
    border: solid black    !important;
    border-width: 0 5px 5px 0!important;
    display: inline-block    !important;
    height:20px              !important;
    width:20px               !important;
    grid-row:2               !important;
    position: relative !important;
    border-radius: 0 !important; 
    background-color: transparent !important;
}
.arrow:hover{
    border-color:rgb(210, 210, 210);
}
.next {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    grid-column: 3;
}
.previous {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    grid-column: 1;
}
select{
    border:none;
    border-radius:50px;
    font-size:80px;
    width:min-content;
    box-sizing:border-box;
    outline:none;
    padding:5px;
}

.month_con{
    display:grid;
    height:100%;
    grid-template-columns: repeat(7 , 1fr);
    grid-row:2;
    grid-column:2;
    background-color: white;
    box-sizing: border-box;
    font-size: 25px;
    grid-template-rows: min-content;
}

.month_con label{
    border-left:
    solid 1px;
    border-right:
    solid 1px;
    border-color:
    rgb(235, 235, 235);
    text-align: center;
    height:
    min-content;
    border-bottom: solid 2px;
    padding-top: 10px;
}

.day_con{
    border:solid 1px rgb(204, 204, 204);
    border-radius:2px;
    background-color: rgb(255, 255, 255);
    padding:1px;
    display: flex;
    flex-direction: column;
    position:relative;
}
.day_con:hover{
    background-color: whitesmoke;
    border:solid 2px grey;
    color:darkgrey;
    padding:0px;
}
/*.day_con:hover .dayPopUp{
    display:flex;
    color:white;
}*/
.today{
    border:solid 2px blue;
    padding:0px;  
}

.day_number{
    border:none !important;
    font-size: large;
    text-align: left !important;
}

.dayEvent{
    border:none !important;
    justify-self: center;
    align-self: center;
}
.NoDisponible{
    background-color: #d9d9d9;
    color:white;
    font-size: large;
}
.dayPopUp{
    position:absolute;
    display:none;
    flex-direction:column;
    padding:15px;
    border:solid 2px white;
    border-radius:10px;
    z-index:20;
}
.dayPopUp label{
    text-align: left;
    border:none;
}
.dayPopUpTitle{
    text-transform: capitalize;
    color:white;
    border:none;
    padding-bottom: 5px !important;
    margin-bottom:15px;
    border-bottom:solid 2px white !important;
}
.dayPopUp button{
    outline:none;
    border:none;
    background-color: white;
    color:blue;
    border-radius:10px;
    padding:15px;
    margin-top:15px;
}
.dayPopUp input{
    outline:none;
    border:none;
    padding:5px;
    min-width: 90%;
}
.dayPopUp input[type=radio]{
    min-width:auto !important;
}


@media (max-width: 790px) {
    .arrow{
        width:14px;
        height:14px;
    }
    #month{
        font-size: 40px;
    }
    .month_con{
        overflow: hidden;
    }
    #month_con{
        margin:0;
    }
    .month_con label{
        font-size: xx-small;
        overflow: hidden;
        display: flex;
        flex-wrap: wrap;
        overflow: hidden;
        max-width: 100%;
    }
    .day_con{
        max-width: calc(100vw / 7);
    }
    .mobileColumn{
        flex-direction: column !important;
    }
}