.user-data-box{ display: flex; flex-direction: column; margin: 30px 0; padding: 20px 100px 20px 40px; background: linear-gradient(135deg, #161616, #fff); border-radius: 47px; color: white; font-weight: bold; } .overview-list{ background: linear-gradient(115deg, #161616, #fff); border-radius: 47px; } .overview-item{ margin: 20px; font-size: 20px; } .change-info-button{ display: inline-block; margin: 10px 0 0 0; padding: 20px; background-color: #303030; border: none; border-radius: 20px; color: white; font-weight: bold; font-size: 24px; } .admin-button{ display: inline-block; margin: 10px 0 0 0; padding: 5px; background-color: #303030; border: none; border-radius: 20px; color: white; font-weight: bold; font-size: 16px; } .admin-button a{ text-decoration: none; color: white; } .add-link { display: block; margin: 20px; text-align: center; font-size: 20px; text-decoration: none; color: black; } .add-block{ margin: 30px 0; } .user-name{ margin: 0 0 20px 0; text-align: center; font-size: 30px; font-weight: bold; } .add-block .image-container{ display: block; border-radius: 32px; overflow: hidden; } .image-container img{ width: 100%; } .title-h3{ font-weight: bold; font-size: 36px; } .film-box .image-container{ display: block; border-radius: 27px; overflow: hidden; } .button-more{ margin: 0 0 15px 0; padding: 15px 0; background-color: transparent; border: none; font-size: 24px; font-weight: bold; } @media (max-width: 1200px) { } @media (max-width: 992px) { .add-block{ display: none; } .film-box{ margin: 20px 0 0 0; } } @media (max-width: 768px) { .user-data-box{ padding: 20px 40px; } .overview-list{ padding: 0; margin: 0; } .overview-item{ font-size: 14px; } .change-info-button{ padding: 7px; font-size: 14px; } .title-h3{ font-size: 24px; } .button-more{ font-size: 20px; } } @media (max-width: 576px) { } @media (max-width: 398px) { .title-h3{ font-size: 24px; } .button-more{ font-size: 16px; } }