:root {
  --font-family-inter: 'Inter', sans-serif;
  --text-black: rgba(0, 0, 0, 1);
  --text-rgb-0-116-181: rgba(0, 116, 181, 1);
}

.text-black {
  color: var(--text-black);
}

.text-rgb-0-116-181 {
  color: var(--text-rgb-0-116-181);
}


/* CSS Reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.rectangle-88-28 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: rgb(0, 0, 0);
}

body {
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

.rectangle-135-4 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: rgba(217, 217, 217, 1);
}

.vector-7 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.home-6 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-8 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 12px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.home-5 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.vector-12 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border: 1.5px solid rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.vector-13 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.group-11 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.shorts-10 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-14 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 12px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.shorts-9 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-16 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 12px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.subs-15 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-18 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 12px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.ellipse-51-20 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(199, 190, 190, 1);
  border: none;
  outline: none;
}

.text-21 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 12px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.you-19 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.you-17 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.ellipse-53-23 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(199, 190, 190, 1);
  border: none;
  outline: none;
}

.vector-25 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.ic-outline-plus-24 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.plus-22 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.component-27-3 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.vector-27 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.subscription-26 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.component-34-2 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-31 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: 700;
  font-size: 20px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.rectangle-104-32 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 10px;
  width: 600px;
  height: 300px;
}

.polygon-20-33 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.videos-1-30 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 11px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-35 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 16px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-rgb-0-116-181);
}

.rectangle-103-36 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 10px;
  width: 600px;
  height: 300px;
}

.polygon-19-37 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.videos-2-34 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 13px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.videos-29 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 30px;
  padding: 20px 30px 20px 30px;
  margin: 30px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 100%;
  height: auto;
}


.text-40 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: 700;
  font-size: 20px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.rectangle-102-41 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 10px;
  width: 600px;
  height: 300px;
}

.polygon-18-42 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.shorts-1-39 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 11px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-44 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 16px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-rgb-0-116-181);
}

.rectangle-99-45 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 10px;
  width: 600px;
  height: 300px;
}

.polygon-17-46 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.shorts-2-43 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 14px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.shorts-38 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 30px;
  padding: 20px 30px 20px 30px;
  margin: 30px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 100%;
  height: auto;
}


.rectangle-94-47 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: rgba(217, 217, 217, 1);
  opacity: 0.550000011920929;
}

.text-50 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 24px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.button-1-49 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 11px 52px 11px 52px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 75.5807471264367817%;
  background-color: rgba(217, 217, 217, 1);
  border-radius: 10px;
}

.text-52 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: normal;
  font-size: 24px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.button-2-51 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 11px 83px 11px 83px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 75.57471264367817%;
  background-color: rgba(217, 217, 217, 1);
  border-radius: 10px;
}

.node-48 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
  padding: 31px 38px 31px 38px;
  margin: 20px 30px 20px 30px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 85%;
  background-color: rgba(82, 82, 82, 1);
  border-radius: 20px;
}

.vector-55 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.node-54 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.text-56 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-inter);
  font-weight: 700;
  font-size: 24px;
  text-decoration: none;
  text-transform: none;
  color: var(--text-black);
}

.library-hiistory-53 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 25px;
  padding: 25px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.rectangle-134-58 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border: none;
  outline: none;
}

.rectangle-60 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border: 1px solid rgba(0, 0, 0, 1);
  border-radius: 2.6666667461395264px;
  opacity: 0.3499999940395355;
  border: none;
  outline: none;
}

.combined-shape-61 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  opacity: 0.4000000059604645;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.rectangle-62 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 1.3333333730697632px;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.battery-59 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.wifi-63 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

.mobile-signal-64 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
}

/* .9-41-66 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  fill: rgba(0, 0, 0, 1);
  border: none;
  outline: none;
} */

.time-65 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  border-radius: 32px;
}

.top-nav-bar-57 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}
.library-history-container {
@media (max-width: 1440px) {
  .library-history-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}

@media (max-width: 768px) {
  .library-history-container {
    padding-left: 16px;
    padding-right: 16px;
  }
}
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: rgba(255, 255, 255, 1);
}