|
Метки: очистка ручная отмена |
| Строка 1: |
Строка 1: |
| /* Основные стили */
| |
| .species-page {
| |
| padding: 2rem 1rem;
| |
| max-width: 1400px;
| |
| margin: 0 auto;
| |
| background: radial-gradient(circle at top, #0C945622 0%, transparent 30%);
| |
| }
| |
|
| |
|
| /* Заголовок */
| |
| .title-container {
| |
| position: relative;
| |
| margin: 3rem 0;
| |
| padding: 1.5rem;
| |
| background: linear-gradient(45deg, #0C945633, #0a774433);
| |
| border-radius: 16px;
| |
| border: 2px solid #0C945655;
| |
| }
| |
|
| |
| .page-title span {
| |
| background: linear-gradient(45deg, #0C9456, #0a7744);
| |
| -webkit-background-clip: text;
| |
| -webkit-text-fill-color: transparent;
| |
| }
| |
|
| |
| /* Навигация */
| |
| .quick-nav span {
| |
| display: inline-block;
| |
| margin: 0.3rem;
| |
| padding: 0.4rem 1.2rem;
| |
| background: #0C9456;
| |
| border-radius: 25px;
| |
| transition: 0.2s;
| |
| box-shadow: 0 2px 4px rgba(0,0,0,0.3);
| |
| }
| |
|
| |
| .quick-nav span:hover {
| |
| transform: translateY(-2px);
| |
| box-shadow: 0 4px 8px rgba(0,0,0,0.4);
| |
| }
| |
|
| |
| /* Сетка рас */
| |
| .species-card {
| |
| position: relative;
| |
| overflow: hidden;
| |
| border: 2px solid #0C945644;
| |
| }
| |
|
| |
| .species-card::after {
| |
| content: "";
| |
| position: absolute;
| |
| top: 0; left: 0;
| |
| width: 100%; height: 100%;
| |
| background: linear-gradient(45deg, #0C945622, transparent);
| |
| }
| |
|
| |
| .species-image {
| |
| padding: 1.5rem;
| |
| background: #00000033;
| |
| }
| |
|
| |
| /* Аккордеоны */
| |
| .accordion-header {
| |
| position: relative;
| |
| padding-left: 3rem;
| |
| transition: 0.2s;
| |
| }
| |
|
| |
| .accordion-header::before {
| |
| content: "▶";
| |
| position: absolute;
| |
| left: 1rem;
| |
| transition: 0.3s;
| |
| }
| |
|
| |
| .accordion-header.active::before {
| |
| transform: rotate(90deg);
| |
| }
| |
|
| |
| /* Адаптивность */
| |
| @media (max-width: 768px) {
| |
| .species-card {
| |
| grid-column: span 2;
| |
| }
| |
|
| |
| .accordion-header {
| |
| font-size: 0.9rem;
| |
| }
| |
| }
| |
