@charset "utf-8";
/* CSS Document */
@font-face {
	src: url("Sunwish Maverick.ttf");
		
}
@font-face {src: url("Pavanam-Regular.ttf");}


.navigation  {
	list-style: none;
	display: flex;
	gap:3%;
	justify-content: center;
	align-content: center;
	padding: 20px 0px;
	font-family:"Sunwish Maverick";	
	font-size: 20px;
}
.navi {
	background:rgba(229,152,53,1.00);
	  overflow: hidden;
  background-color: #333;
  position: fixed;
  top: 0;
  width: 100%;
	
}
.navi a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 3px 18px;
  text-decoration: none;
  font-size: 17px;
}


.navi a:hover {
  background: #ddd;
  color: black;
}
 .songnames a {
  float: left;
  display: block;
  color:rgba(0,0,0,1.00);
  text-align: center;
  padding: 3px 18px;
  text-decoration: none;
  font-size: 17px;
}
.navi a:hover {
  background: #ddd;
  color:rgba(211,146,24,1.00);
	
}
	#about-link {
    text-decoration: none;
  }

.main {
  padding: 16px;
  margin-top: 30px;
  height: 1500px; /* Used in this example to enable scrolling */
}
.Section_top{
  
    
    overflow: hidden;
    position: relative;
    background-image: url("background 3.jpeg");
    background-position: center;
    background-size: cover;
    text-align: center;
    justify-content: center;
    animation: change 10s infinite ease-in-out;
	height:600px;
	margin-top: 60px;
}
.content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-transform: uppercase;

}
.content h1{
    color: #fff;
    font-size: 60px;
	letter-spacing: 5px;
    
}
.content a:hover{
    background: #034e88;
    color: #fff;
}
h1 {
	font-family: "Sunwish Maverick";
	color: white;
}
@keyframes change{
    0%
    {
        background-image: url("background 2.jpeg");
    }
    20%
    {
        background-image: url("background 7.jpg");
    }
    40%
    {
        background-image: url("background.jpg");
    }
    60%
    {
        background-image: url("background 3.jpeg");
    }
    80%
    {
        background-image: url("background 2.jpeg");
    }
    100%
    {
        background-image: url("background 7.jpg");
    }
}
.container {
            display: flex;
           width: 80%;
		padding: 50px;
        }

        .column {
            flex: 1;
            padding: 20px;
        }

        .image-column {
            text-align: center;
			margin-left: 170px;
        }

        img {
            max-width: 100%;
            height: auto;
			padding-left: 20px;
       }
h2 {
	font-family: "Sunwish Maverick";
	font-size: 50px
}
.about {
	font-family:"Pavanam Regular";
}
.popularsongs{
	     text-align: center;
}
.songpictures {
	list-style: none;
	display: flex;
	gap:3%;
	justify-content: center;
	align-content: center;
	padding: 20px 0px;
                  
}

        .songpictures img {
            width: 200px; /* Set the width for all images */
            height: 200px; /* Set the height for all images */
            object-fit: cover; /* Maintain aspect ratio and cover the fixed size */
        }
.songnames {
	list-style: none;
	display: flex;
	gap:12%;
	justify-content: center;
	align-content: center;
	padding: 5px 0px 50px;
	font-family: "Sunwish Maverick";
	font-size: 20px;
	margin-left: 90px;
}
.members {
	text-align: center;
	
}
.carousel-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.carousel-item {
  flex: 1;
	
}

.carousel-image {
  width: 150px;
  height: 150px;
 border-radius: 10px
}

.carousel-caption {
	margin-left: 16px ;
	font-family: "Pavanam Regular";
	font-size: 20px;
}
    
.awards {
	text-align:center;
}
 .box-container {
      display: flex;
      justify-content: space-around;
      align-items: center;
      height: 40vh; /* Adjust the height as needed */
    }

    .box {
      width: 200px;
      height: 200px;
      background-color: black; /* Change the background color as needed */
      color: #fff;
      text-align: center;
      line-height: 50px;
		font-family:"Sunwish Maverick";
		font-size: 30px;
		gap: 30% ;
		border-color:aquamarine;
		border-width: thick;
		padding: 20px;
    }
.contactthem {
	text-align: center;
	margin-top: 100px;
	padding-top: 50px;
	
}

.contacts {
	list-style: none;
	display: flex;
	gap:3%;
	justify-content: center;
	align-content: center;
	padding: 20px 0px;
	
}
.contact {
	background:rgba(199,137,59,1.00);
}

#members {
    text-align: center;
  }

#popularsongs {
    text-align: center;
  }
#awards {
	 text-align: center;
}
#contactthem {
	 text-align: center;
	padding-top: 50px;
}
@media only screen and (max-width: 600px) {
  .navigation {
    font-size: 16px;
  }

  .songpictures img {
    width: 150px;
    height: 150px;
  }

  .carousel-image {
    width: 100px;
    height: 100px;
  }
	.box {
    width: 150px;
    height: 150px;
  }
}
@media only screen and (max-width: 600px) {
  .navigation {
    display: block;
  }

  .songpictures {
    display: block;
  }
}
.carousel-image {
  transition: transform 0.3s; /* Add a smooth transition effect */
}

.carousel-image:hover {
  transform: scale(1.3); /* Increase the scale of the image on hover */
}
@media only screen and (max-width: 600px) {
  .navigation {
    font-size: 16px;
    display: block;
  }

  .navi a {
    float: none;
    padding: 10px 15px;
  }