 html,
 body {
     overflow-x: hidden;
 }

 /*navbar section */

 .navbar-section {
     overflow: hidden;
     background-color: rgb(255, 77, 169);
     position: fixed;
     top: 0;
     width: 100%;
     z-index: 1;
 }

 a {
     text-decoration: none;
     color: white;
 }

 a:hover {
     color: black;
 }

 ul {
     list-style: none;
     text-decoration: none;
 }

 li {
     padding: 10px;
 }

 .logo {
     font-size: 30px;
     font-family: "Dancing Script", cursive;
 }

 .logo-text {
     color: white;
 }

 /*styling home section*/
 .home {
     height: 800px;
 }

 .home-section {
     width: 100%;
     height: 900px;
     margin-top: 60px;
     margin: 0 auto;
     background-image: url(https://s3.amazonaws.com/shecodesio-production/uploads/files/000/097/117/original/hiB.png?1694727809),
         url(https://s3.amazonaws.com/shecodesio-production/uploads/files/000/097/171/original/5466917.jpg?1694737127);
     background-repeat: no-repeat;
     background-position: right;
     background-attachment: fixed;
     background-color: rgb(243, 147, 197);
 }

 .home .home-content {
     width: 90%;
     height: 100%;
     margin: auto;
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding-left: 0 auto;
 }

 .heading-1 {
     font-size: 40px;
     color: #ff4dab;
     letter-spacing: 2px;
     text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
 }

 .heading-2 {
     font-size: 75px;
     color: #ff4dab;
     font-family: "Dancing Script", cursive;
     letter-spacing: 3px;
     text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
 }

 h3 {
     color: #ff4dab;
     font-size: 35px;
     font-style: italic;
 }

 .h3-title {
     font-family: "Dancing Script", cursive;
     color: #ff4dab;
 }

 p {
     font-size: 24px;
     color: white;
     letter-spacing: 1px;
     line-height: 1.5;
 }

 button {
     font-family: "Dancing Script", cursive;
     padding: 20px 30px;
     margin-top: 30px;
     background-color: rgb(255, 77, 169);
     border: transparent;
     border-radius: 35px;
     color: white;
     font-size: 20px;
     transition: background-color 0.3s ease, color 0.3s ease;
 }

 button:hover {
     background-color: white;
     color: rgb(255, 77, 169);
 }

 marquee {
     background-color: rgb(255, 77, 169);
     color: white;
     font-family: "Dancing Script", cursive;
     font-weight: bold;
     font-size: 30px;
 }

 audio {
     background-color: #ff4dab;
     border: 1px solid #ccc;
     border-radius: 5px;
     padding: 10px;
 }

 /*about*/

 .about-section {
     background-color: #facee6;
 }

 .about-heading {
     text-align: center;
     font-size: 45px;
 }

 .about-title {
     font-family: "Dancing Script", cursive;
 }

 .about-text {
     background: linear-gradient(to top,
             #fdcbf1 0%,
             #fdcbf1 1%,
             #e6dee9 100%);
     width: 600px;
     height: auto;
     margin: 0 auto;
     box-shadow: 2px 2px 4px #f132b8;
     border-radius: 90px;
     padding: 50px;
     margin-bottom: 20px;
     margin-top: 20px;
 }

 .barbie-ken {
     background-image: url(https://s3.amazonaws.com/shecodesio-production/uploads/files/000/097/121/original/bndken.png?1694727899);
     background-size: cover;
     height: 750px;
     width: 400px;
     margin-left: 10px;
     margin-top: 10px;
     padding-bottom: 30px;
 }

 .h1-top {
     margin-top: 70px;
     font-size: 45px;
     font-family: "Dancing Script", cursive;
 }

 .h1-bottom {
     margin-top: 580px;
     font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
     font-size: 40px;
 }

 /* gallery styling*/

 .gallery-heading {
     text-align: center;
     font-size: 48px;
     color: #ff4dab;
 }

 .gallery-title {
     font-family: "Dancing Script", cursive;
     color: #ff4dab;
 }

 .gallery-section {
     width: 100%;
     height: 700px;
     padding-top: 20px;
     padding-bottom: 20px;
     background-color: #f7e2f1;
 }

 #main-image {
     display: block;
     margin: 0 auto;
 }

 .thumbnails {
     text-align: center;
     border: solid 3px #ff4dab;
     border-radius: 20px;
     padding: 5px;
 }

 .gallery-text {
     text-align: center;
     color: white;
     font-style: oblique;
     font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande",
         "Lucida Sans", Arial, sans-serif;
 }

 .thumbnail.selected {
     border: 2px solid #ff4dab;
     border-radius: 80px;
 }

 /*trailer*/

 #trailer {
     background-color: rgb(243, 147, 197);
     background-image: url("");
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
 }

 .trailer-heading {
     text-align: center;
     font-size: 48px;
 }

 .trailer-vid {
     text-align: center;
 }

 iframe {
     border: 2px #ff4dab;
     border-radius: 50px;
 }

 .trailer-title {
     font-family: "Dancing Script", cursive;
 }

 /*quote*/

 .quote-heading {
     text-align: center;
     font-size: 48px;
     color: #ff4dab;
 }

 .quote-title {
     font-family: "Dancing Script", cursive;
     color: #ff4dab;
 }

 .skills {
     padding: 20px;
 }

 .container-skills {
     border: solid 3px #ff4dab;
     border-radius: 20px;
 }

 .card {
     margin: 15px;
     background-color: #facee6;
     padding: 20px;
 }

 h2 {
     color: white;
     font-size: 20px;
     font-family: Verdana, Geneva, Tahoma, sans-serif;
 }

 /*cast*/
 .cast {
     background-color: rgb(238, 86, 193);
 }

 .card h2 {
     text-align: center;
 }

 h1 {
     color: white;
 }

 .container-cast {
     border: solid 3px white;
     border-radius: 20px;
 }

 .coded-by {
     text-align: center;
     background-color: #f7c3eb;
     color: #f6329b;
 }

 .coded-by a {
     color: #f62a97;
 }

 .coded-by a:hover {
     color: #f7c3eb;
 }