#background{margin-bottom:50px}.problems_grid{display:grid;gap:20px;grid-template-columns:1fr 1fr 1fr;margin:40px 0 50px}.pg_problem{align-items:start;background-color:var(--dark-blue);border-radius:10px;display:flex;padding:30px}.period_wrapper{margin-top:75px;overflow:hidden;padding:50px 0;position:relative;width:100%}.slider{display:flex;gap:120px;height:360px;padding:0 60px}.slider img{border-radius:10px;flex-grow:1;height:360px;max-width:600px;min-width:300px;object-fit:cover;opacity:0;transition:1s ease}.slider img.active{opacity:1}.period_camera{height:100%;overflow:hidden;position:relative}.period_slider{display:flex;flex-direction:column;height:300%;transform:translateY(0);transition:1s ease}.period_gradient{background:linear-gradient(90deg,#fdfdfb,#a8e6d8,#6bd7b7,#419cb6,#419cb6,#2275b0,#1969ab,#1969ab,#064595,#09236c);height:100%;left:0;position:absolute;top:0;transform:translateX(0);transition:.9s linear;width:400vw;z-index:-1}.period{display:flex;flex-direction:column;height:100%;justify-content:center;opacity:0;transition:.4s ease;width:100%}.period.active{opacity:1;transition:.9s ease .2s}.period .years{margin-bottom:-5px}.period h3{margin-bottom:5px}.period .subtitle{max-width:45ch}.timeline_buttons{bottom:20px;display:flex;gap:10px;position:absolute;right:60px}.micro_camera{height:300px;max-width:100vw;overflow:hidden;position:relative}.micro_wrapper{display:flex;height:300px;left:0;margin-top:50px;padding-left:510px;position:absolute;transform:translateX(0);transition:.7s ease}.date{min-width:450px;padding-left:0;position:relative;transform:scale(1);transition:.8s ease}.date.active{margin-top:5px;padding:0 5px 0 20px;transform:scale(1.1);transition:.6s ease 100}.date_upper{align-items:start;display:flex;gap:50px}.badge{align-items:center;background-color:#fff;border:1px solid #000;border-radius:5px;display:flex;gap:10px;opacity:.4;padding:8px 12px;transition:.8s}.date.active .badge{opacity:1;transition:.6s ease 100}.badge img{height:25px}.badge p.num{line-height:1;margin-bottom:0}.badge p:not(.num){font-size:.75rem;line-height:1;margin-bottom:3px}.date_month{line-height:1;margin-bottom:-5px}.date_heading{margin-bottom:5px}.date_heading,.date_month{opacity:.4;transition:.8s ease}.date.active .date_heading,.date.active .date_month{opacity:1;transition:.6s ease 100}.marker{align-items:center;display:flex;padding-right:5px;transition:.6s ease}.date.active .marker{padding-right:20px;transition:.6s ease 100}.dot{background-color:transparent;border:1px solid #000;border-radius:50%;height:15px;transition:.6s ease;width:15px}.date.active .dot,.dot.past{background-color:#000;transition:.6s ease 100}.date_body{opacity:.4;padding:0 25px 0 20px;transition:.6s ease}.date.active .date_body{opacity:1;transition:.6s ease 100}.line{background-color:#000;height:1px;width:100%}@media (max-width:1100px){.slider{gap:30px}.micro_wrapper{padding-left:400px}}@media (max-width:900px){.slider{display:flex;gap:120px;height:300px;padding:0 60px}.period_wrapper{margin-top:50px;padding:20px 0}.timeline_buttons{display:flex;gap:10px;justify-content:end;padding-right:60px;position:static;width:100%}.slider img{display:none}.period .subtitle{max-width:60ch}.micro_wrapper{padding-left:40px}}@media (max-width:768px){.problems_grid{display:flex;flex-direction:column;margin:30px auto 50px;max-width:400px}.slider{height:300px;padding:0 40px}}@media (max-width:500px){.slider{display:flex;gap:120px;height:250px}.period h3{font-size:1.75rem;line-height:2rem}.period .subtitle{font-size:.875rem;line-height:1.25rem}.micro_wrapper{padding-left:0}.date{max-width:90vw;min-width:90vw;position:relative;transform:scale(1);transition:.8s ease}.date.active{margin-top:0;padding-left:40px;transform:scale(1);transition:.6s ease 100}.date_upper{gap:10px;justify-content:space-between;padding-right:10px}.badge{display:flex;gap:5px;padding:5px 10px}.badge img{height:25px}.badge p.num{font-size:.75rem}.badge p:not(.num){font-size:.5rem;line-height:1;text-align:left}.date.active .marker{padding-right:5px}}