*,html{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: "segoe Ui", sans-serif;
	scroll-behavior: smooth;


}
.nav {
	position: fixed;
	right: 0;
	left: 0;
	display:flex;
	flex: row;
	top:0; 
	justify-content: space-between;
	z-index: 1;
	animation: fadeSlideIn 1s ease-in forwards;
    opacity: 0;
    transform: translateY(20px);
}
.nav {
	background: #0b2844;
	


}
nav ul {
	list-style: none;
	gap: 4rem;
	margin-right: 1rem;
	padding-left: 15px;
	display: flex;
	align-items: center;
	font-weight: bold;
	letter-spacing: 1px;

}

.nav ul li {
	position: relative;
}
.nav ul a {
	text-decoration: none;
	color: white;
	text-shadow: #534e74 3PX 2PX 5PX;
	text-transform: uppercase;

}
.nav ul a:hover{
	color:rgb(86, 141, 163);
	transition: 0.3s;
}
.nav ul img {
	width: 20px;
	height: 20px;
}

.nav ul img:hover {
	width: 20px;
	height: 20px;
	background-color: #dfdee7a1;
	border-radius: 10px;
	transition: 0.2s;
}

.imgnav {
	width: 190px;
	height: 90px;
	margin-left: -30px;
	
}
@keyframes fadeSlideIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.upper {
	right: 0;
	left: 0;
	display: flex;
	flex: row;
	top:0; 
	justify-content: space-between;
}
.upper ul {
	list-style: none;
	gap: 1rem;
	display: flex;
	align-items: center;
	font-size: 10px;
	font-weight: bold;
	position: absolute;

}
.upper ul img {
	width: 30px;
	height: 30px;
}
.nft{
	font-weight: bold;

}

.akun1{
	display: flex;
	flex: row;
	background-image: linear-gradient(220deg,#FFA500 0%, #ffd803 20%,	#FFFFE0 120%) ;
	padding: 5px;
	margin-right: 5rem;
	margin-left: 1rem;
	font-size: 15px;
	border-radius: 15px;
	color:#2d334a;
}

.akun1:hover{
	display: flex;
	flex: row;
	background-image: linear-gradient(220deg,#805402 0%, #867303 20%,	#FFFFE0 120%) ;
	padding: 5px;
	margin-right: 5rem;
	margin-left: 1rem;
	font-size: 15px;
	border-radius: 15px;
	color:#2d334a;
	transition: 0.8s;
}

.akun li {
	padding: 5px;
	padding-left: 40px;
	padding-right: 40px;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 0px;
	color:#0b2844;
	text-shadow: none;
}
.akun a:hover {
	color: #2d334a;
}


.slider {
	display: flex;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
  }

  .slide {
	flex: 0 0 100%;
	scroll-snap-align: start;
  }

  .slide img {
	width: 100%;
	height: 90%;
  }

  .slider {
	scrollbar-width: none;
	bottom: 20px;
  }

  .cpr {
	background-color: #0b2844;
	color: aliceblue;
	padding: 10px;
	text-transform: capitalize;
  }
.imgcpr	{
	width: 190px;
	height: 110px;
	padding: 5px;
	padding-bottom: 15px;
	cursor: pointer;
}

.cpr2 {
	background-color: #11395f;
	font-size: 11px;
	padding: 10px;
	color: white;
}
#kota {
	font-weight: 600;
	padding: 10px;
	border: none;
	font-size: 16px;
	margin-top: -200px;
  }
  #kota:hover{
	border: none;
  }
.now-showing ul {
	display: flex;
	list-style: none;
	gap: 0;
	margin: 15px;
}
.now-showing img {
	width: 300px;
	height: 450px;
	border-radius: 30px;
	transition: inherit;
}
.now-showing ul li {
  transition: transform 0.3s ease;
  transform: scale(0.9);

}

.now-showing ul li:hover {
  transform: scale(1);

  transition: trasform, 0.3s ease;
}

.dot ul {
	display: flex;
	justify-content: center;
	gap: 5px;
	list-style: none;

}
.posthunder img{
	position: absolute;
	width: 200px;
	height: 300px;
	margin: 75px;
	border-radius: 30px;
	float: left;
	box-shadow: rgb(0, 0, 0) 10px 10px 10px;
}
.hn img{
	position: absolute;
	width: 200px;
	height: 300px;
	margin: 75px;
	border-radius: 30px;
	float: left;
	box-shadow: rgb(0, 0, 0) 10px 10px 10px;
}

.jthunder{
	margin-top: 170px;
	margin-left: 300px;
	text-shadow: black 2px 2px 10px;
}
.hntext{
	margin-top: 70px;
	margin-left: 300px;
	text-shadow: black 2px 2px 10px;
}
.sinthunder{
	margin-right: 300px;
	
}
.XXI a{
	text-decoration: none;
	color: rgb(255, 255, 255);
}
.XXI{
	
	font-weight: 600;
	justify-content: center;
	border: none;
	padding: 3px;
	padding-left:7px;
	padding-right: 7px;
	border-radius: 5px;
	margin: auto;
	background-image: linear-gradient(45deg,#FFFF 0%, #9e8702 30%, #553c16 100%) ;
	margin-bottom: 5px;
	
}
.bg {
	background-image: url(rthMuZfFv4fqEU4JVbgSW9wQ8rs.jpg);
	background-size: cover;
	padding-bottom: 100px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg1 {
	background-image: url(backgroundjumbo.jpg);
	background-size: cover;
	padding-bottom: 100px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg2 {
	background-image: url(backduri.webp);
	background-size: cover;
	padding-bottom: 100px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg3 {
	background-image: url(https://asset.tix.id/wp-content/uploads/2025/05/6wxlSWRWGDzrfrk5JHsF2Pbrv8b.jpg);
	background-size: cover;
	padding-bottom: 85px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg4 {
	background-image: url(https://asset.tix.id/wp-content/uploads/2025/05/eT9MOIfAhvZR9qJYOFznFoFa63Y.jpg);
	background-size: cover;
	padding-bottom: 50px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg5 {
	background-image: url(gstback.jpeg);
	background-size: cover;
	padding-bottom: 60px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg6 {
	background-image: url(https://asset.tix.id/wp-content/uploads/2025/05/A5HZKrMHXWaCRIYXMkqtFzD748u.jpg);
	background-size: cover;
	padding-bottom: 60px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.bg7 {
	background-image: url(backhn.jpg);
	background-size: cover;
	padding-bottom: 60px;
	color: white;
	position: absolute;
	left: 0;
	right: 0;
}
.time {
	opacity: 80%;
	color: rgb(224, 219, 219);
}
.nav-kota {
	position: absolute;
	top: 540px;
	margin-left: 15px;
	font-weight: 600;
}
.kota-all{
	text-align: center;
	margin-top: 20px;
}
.point li{
	list-style: none;
}
.point{
	display: flex;
	justify-content: center;
}
.point img{
	width: 20px;
	height: 20px;
}
.timeaeon {
	margin-top: 20px;
	background-color: rgb(241, 241, 241);
	border-radius: 8px;
	
}
.timeobp {
	margin-top: 20px;
	background-color: rgb(241, 241, 241);
	border-radius: 8px;
}
.text-movie {
	padding: 20px;
}
.container {
  margin-top: 10px;
  display: grid;
  grid-gap: 10px;
  padding: 15px;
grid-template-columns: 0fr 0fr 0fr 0fr 0fr;
display: flex;
 
}
.container div {
  align-items: center;
  grid-template-columns: 0fr 0fr 0fr 0fr 0fr;
  justify-content: center;
  font-weight: bold;
  padding: 1px;
  border-radius: 15px;
}

.top-left {
	width: 70px;
	height: 40px;

}
.nowfilm {
	padding-left: 40px;
}
.beli {
	background-color: #0b2844;
	position: fixed;
	right: 0;
	left: 0;
	width: 100%;
	bottom: 0;
	text-align: center;
	padding: 4px;
}
.buy-button button{
	border: none;
	font-weight: bold;
	background-color: #FFA500;
	padding: 5px;
	color: #081c30;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	border-radius: 5px;
}
 .jam-wrapper {
	display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .jam-container {
    gap: 1rem;
	padding: 15px;
    flex-wrap: wrap;
  }

  .time-all input[type="radio"] {
    display: none;
  }

  .jam-label {
    padding: 12px 20px;
    background-color: lightgray;
    border: 2px solid #ccc;
    border-radius: 8px;
    cursor: pointer;
    font-weight: bold;
    transition: 0.3s;
  }

  input[type="radio"]:checked + .jam-label {
    background-color: #002b80;
    color: white;
    border-color: #002b80;
  }

.buy-button .beli-btn {
    background-color: gray;
    color: white;
    padding: 12px 24px;
    border: none;
    opacity: 0.6;
    pointer-events: none;
    font-weight: bold;
    transition: 0.3s;
	width: 100%;
  }
.buy-button{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;

}
.bgtimer{
	background-color: rgb(241, 241, 241);
	border-radius: 15px;
	padding:10px;
	padding-bottom: 50px;
	padding-left: 20px;
	padding-right: 30px;
}
.time-all{
	padding-top: 30px;
	display: flex;
	gap: 1rem;
	display: grid;
	grid-template-columns: 0fr 0fr 0fr 0fr 0fr;
}
  .jam-wrapper:has(input:checked) .beli-btn {
    background-color: #002b80;
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
	justify-content: center;
  }
  .beli-btn a {
	text-decoration: none;
	color: white;
  }
  .log-all{
	background-color: white;
	box-shadow: black 0px 0px 10px;
	justify-items: center;
	position: relative;
	margin: 100px auto;
	width: 500px;
	padding: 100px;
	border-radius: 15px;
}
.login{
	background-image: url(backlogin.jpg) ;
}
.price {
	list-style: none;
	display: flex;
	justify-content: space-between;
}
.harga{
	color: rgb(73, 73, 73);
}
.all-bg{
	list-style: none;
	display: flex;
	gap: 8rem;
}
.all-bg-jkt{
	list-style: none;
	display: flex;
	gap: 8rem;
}
.all-bg-jkt li{
	padding-left: 20px;
}
/*login*/

input[type="text"], input[type="password"]{
	padding-top: 50px;
	width: 450px;
	padding: 15px;
	border-radius: 5px;
	border: none;
	background-color: rgb(236, 236, 236);
	margin: 15px;
	box-shadow: black 0px 0px 5px;
}
.log-all button{
	background-color: rgb(28, 143, 189);
	color: white;
	width: 450px;
	padding: 15px;
	border-radius: 5px;
	border: none;
	font-size: 15px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}
.button-login{
	padding-top: 50px;
}
.login-header{
	position: absolute;
	top: 0;
	margin: auto;
	padding-top: 35px;
	padding-left: 30px;
}
/*pembayaran*/

.paid ul {
	list-style: none;
	background-color: #272343;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	z-index: 1;

}

.alamat-time{
	list-style: none;
	display: flex;
	background-color: #f3f2f2;
	margin: 20px;
	padding: 60px;
	border-radius: 15px;
	position: absolute;
	padding-right: 680px;

}
.alamat-time h3{
	margin-right: 6px;
}
.ket-harga{
	margin: 20px;
	padding: 60px;
	border-radius: 15px;
	background-color: #f3f2f2;
	position: absolute;
	margin-top: 180px;
}
.ket-harga .total li{
	list-style: none;
	display: flex;
}
.ket-harga .tiket-jumlah{
	list-style: none;
	display: flex;
	justify-content: space-between;
}
.button-bayar button{
	display: flex;
	width: 865px;
	justify-content: center;
	padding: 15px;
	border-radius: 8px;
	border: none;
	background-color: #002b80;
	color: white;
	margin-top: 45px;

}
.button-bayar a  {
	text-decoration: none;
}
.all-info{
	display: flex;
	list-style: none;
	justify-content: space-between;
}
.metode-pembayaran{
	background-color: #f3f1f1;
	padding: 15px;
	margin: 15px;
	border-radius: 15px;
	position: absolute;
	right: 0;

}
.method-paid{
	list-style: none;
}
.method-paid input{
	justify-content: space-between;
}
.radio-type{
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 3rem;
}

.bg-paid{
	background-color: #ccc;
	box-shadow: black 0px 0px 5px;
	margin: 10px;
	padding: 15px;
	border-radius: 15px;

}
.method-paid img{
	width: 40px;
	height: 40px;
	border-radius: 15px;
	box-shadow: black 0px 0px 5px;
	margin: 5px;
}
/*balik ke home*/
.news {
	display: flex;
}
.news img{
	width: 230px;
	height: 150px;
	border-radius: 15px;
	margin: 15px;
	margin-left: 30px;
}
.text-news{
	padding-top: 30px;
}
.text-news p{
	width: 700px;
}

.news1 {
	display: flex;
	margin-top: 30px;
}
.news1 img{
	width: 250px;
	height: 150px;
	border-radius: 15px;
	margin: 15px;
	margin-left: 30px;
}
.text-news1{
	padding-top: 20px;
}
.text-news1 p{
	width: 700px;
}

.news2 {
	display: flex;
	margin-top: 30px;
}
.news2 img{
	width: 250px;
	height: 150px;
	border-radius: 15px;
	margin: 15px;
	margin-left: 30px;
}
.text-news2{
	padding-top: 20px;
}
.text-news2 p{
	width: 700px;
}