@media only screen and (max-width: 768px) {
    /* General */
        .desktop{ display: none !important; }
        .mobile{ display: block !important; }

    /* Texts */
        .title{ font-size: 14px; line-height: 20px; }
        .title.extra_large{ font-size: 24px; line-height: 32px; }
        .title.large{ font-size: 20px; line-height: 28px; }
        .title.small{ font-size: 12px; line-height: 16px; }

    /* Header */
        .header_menu .menu_button{ display: inline-block; width: 32px; height: 32px; border-radius: 4px; background: var(--secondary-color); position: relative; z-index: 99; }
        .header_menu .menu_button span{ background: url('../img/hamburger.svg'); width: 16px; height: 10px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
        .header_menu .menu_button.active span{ background: url('../img/close.svg'); width: 16px; height: 16px; }

    
        .mobile_menu.active{ background-color: #fff; padding: 20px; padding-top: 64px; position: absolute; top: 0px; right: 0px; width: 260px; z-index: 50; display: block; box-shadow: -8px 0px 16px #00000042; }
        
        .mobile_menu .menu{ display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
        .header_menu .menu li{ width: 100%;  }
        .header_menu .menu > li:not(:last-child){ border-bottom: 1px solid var(--primary-color); }
        .header_menu .menu > li.active{ border-bottom: none !important;  }
        .mobile_menu .menu a{ font-weight: 600; text-decoration: none; color: var(--secondary-color); position: relative; }
        .mobile_menu .menu a.active{ color: var(--primary-color); }
        .mobile_menu .menu a.with_arrow::after{ content: ''; width: 5px; height: 9px; background-image: url('../img/arrow_right.svg'); background-size: 5px 9px; position: absolute; right: 10px; top: 9px; }
        .mobile_menu .menu > li.active > a.with_arrow::after{ transform: rotate(90deg); }

        .header_menu .menu .sub_menu{ position: unset; border: unset; border: 1px solid var(--primary-color); }
        .header_menu .menu .sub_menu a{ padding: 10px 0 !important; text-align: center; }
        
        .mobile_menu .profile{ display: flex; gap: 10px; position: relative; }
        .mobile_menu .profile::after{ content: ''; width: 5px; height: 9px; background: url('../img/arrow_right.svg'); background-size: 5px 9px; position: absolute; right: 10px; top: 24px; }
        .mobile_menu .profile.active{ background: #F5F5F5; border-radius: 12px; }
        .mobile_menu .profile.active::after{ transform: rotate(90deg); }
        .mobile_menu .profile .avatar,
        .mobile_menu .profile img{ width: 44px; height: 44px; border-radius: 5px; }
        .mobile_menu .profile .data{ display: flex; flex-direction: column; justify-content: space-around; }
       
        .mobile_menu .profile_menu.active{ display: block; position: relative; top: -17px;margin-top:10px; }
               
        .mobile_menu .button{ width: calc(100% - 40px); }




    /* Agenda */
        .agenda_days li{ padding: 5px; }

    /* Participants */
        .open_participant .participant .avatar{ width: 100px; height: 100px; min-width: 100px; }
        .open_participant .participant .avatar img{ width: 100px; height: 100px; }
        .open_participant .participant .name{ font-size: 28px; }
}