.content{width: 85%;max-width: 1700px;margin-top: 50px;background: linear-gradient(180deg, #010314 0%, rgba(1, 3, 20, 0) 100%), radial-gradient(ellipse 85.05% 65.08% at 50.00% 50.00%, #DBD172 0%, #D92570 51%, black 100%);display: flex;flex-direction: column;align-items: center;padding: 40px 0;border-radius: 45px;border: 1px solid #1C1C1C;min-height: 500px;z-index: 1;position: relative;}

.page-name{width: 90%;color: white;text-transform: uppercase; word-wrap: break-word;font-family: 'Days One';font-size: 30px;max-width: 1600px;}

.broadcasts-menu{width: 90%;margin-top: 40px;display: flex;}
.menu-scroller{width: 100%;display: flex;flex-wrap: none;justify-content: space-between;}
.broadcasts-menu-btn{text-decoration: none;padding: 5px 30px;color: white;font-weight: 700;font-family: 'Montserrat';font-weight: 400;background: rgba(255,255,255,0.1);font-size: 18px;border-radius: 50px;}
.broadcasts-menu-btn.active{font-weight: 800;background: #D92570;}

.broadcasts-grid{width: 90%;margin-top: 40px;max-width: 1600px;display: grid;grid-template-columns: repeat(3, 1fr);gap: 40px 11px;}

.broadcast-card{display: flex;flex-direction: column;align-items: center;cursor: pointer;}
.broadcast-board{width: 100%;aspect-ratio: 325/200;background: black;border-radius: 10px;position: relative;}
.broadcast-date{position: absolute;bottom: 8%;left: 5%;color: white;font-family: 'Montserrat';font-weight: 400;font-size: 10px;background: #D92570;padding: 5px 5px;border-radius: 5px;}
.broadcast-title{width: 90%;margin-top: 10px;color: white;font-weight: 700;font-family: 'Montserrat';font-size: 18px;}
.broadcast-description{width: 90%;margin-top: 10px;color: #878787;font-weight: 700;font-family: 'Montserrat';font-size: 14px;}

.background{width: 100%;position: fixed;z-index: 0;top: 0;left: 0;background: transparent;min-height: 100vh;overflow: hidden;}
.cirle-one{width: 357px; height: 361px; background: rgba(217, 37, 112, 0.70); box-shadow: 500px 500px 500px; border-radius: 9999px; filter: blur(50px);position: absolute;top: 0;left: 0;transform: translate(-50%, -50%);}
.cirle-two{width: 465px; height: 504px; background: rgba(217, 37, 112, 0.50); box-shadow: 300px 300px 300px; border-radius: 9999px; filter: blur(50px);position: absolute;bottom: 0;right: 0;transform: translate(50%, -30%);}


@media(max-width: 1440px){
    .page-name{font-size: 25px;}
    .broadcasts-menu-btn{font-size: 15px;}
    .broadcast-date{font-size: 8px;}
    .broadcast-title{font-size: 15px;}
    .broadcast-description{font-size: 12px;}
    .menu-scroller{flex-wrap: wrap; justify-content: start; gap: 10px 20px;}
}

@media(max-width: 1200px){
    .broadcasts-grid {grid-template-columns: repeat(2, 1fr);gap: 40px 11px;}
}

@media(max-width: 768px){
    .content{width: calc(100vw - 2px); max-width: 500px;}
    .menu{display: none;}
    .broadcasts-grid {grid-template-columns: repeat(1, 1fr);}
    .broadcasts-menu{overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
    .broadcasts-menu-btn{white-space: nowrap;}
    .menu-scroller{flex-wrap: nowrap;}
    .broadcasts-menu::-webkit-scrollbar {height: 0;width: 0;background: transparent;}
    .cirle-one{transform: translate(-50%,-50%); left:50%; width: 500px;}
}

