*{margin: 0;
padding: 0;
font-family: "Josefin Sans", sans-serif;}

ul, ol{list-style-type: none;}

a{text-decoration: none;}

h1,h2,h3,h4,h5,h6,p{margin: 0;
padding: 0;
line-height: 0.8;}

.container{width: 1140px;
margin: 0 auto;}

body{
background: linear-gradient(0deg,rgba(46, 3, 3, 1) 0%, rgba(8, 5, 0, 1) 100%);
}

/* head part */

.headerpart{background: #450d1a;
background: linear-gradient(90deg,rgb(31, 1, 1) 0%, rgb(80, 7, 25) 50%, rgb(12, 0, 0) 100%);}

.headerpart ul{display: flex;
justify-content: center;}

.headerpart ul li{line-height: 25px;
padding: 0 15px;}

.headerpart ul li a{color: white;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    transition: all linear .4s;
}

.headerpart ul li a:hover{color:rgb(255, 216, 73);}

/* end of head part */

#bannerbg{ background: url(../images/rows-red-seats-theater_53876-64710.avif);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
padding: 250px 0px;}


.banner h3{ color: rgb(255, 216, 73);
    font-size: 30px;
    font-weight: 600;
    line-height: 35px;
    

}

.banner h1{ color:rgb(236, 191, 26);
    font-size: 50px;
    font-weight: 700;
    line-height: 60px;
    

}

.banner p{ color:rgb(255, 216, 73);
    font-size: 20px;
    font-weight: 600;
    line-height: 20px;
    
}
.butns{display: flex;
align-items: center;}


.buybutton a{color: beige;
background-color:rgb(89, 6, 6);
padding:15px;
width:100px;
line-height: 5;
margin-right: 30px;
transition: .3s;}

.schedule a{color: beige;
background-color:rgb(89, 6, 6);
padding:15px;
width:100px;
line-height: 5;
transition: .3s;}

.buybutton a:hover{ color: rgb(89, 6, 6);
background-color:rgb(236, 191, 26);
font-size: 20px; }

.schedule a:hover{ color: rgb(89, 6, 6);
background-color:rgb(236, 191, 26); 
font-size: 20px;}

/* about me */

#menumiddle{padding: 85px 0;}

.about{ background: rgb(89, 6, 6);
    padding-top: 80px;
    padding-bottom: 80px;
}

.about h1{color: rgb(233, 188, 52);
text-align: center;
font-size: 25px;
font-weight: 700;
padding-bottom: 30px;}

.about p{color: rgb(241, 204, 93);
padding-left: 100px;
padding-right: 100px;
padding-bottom: 20px;
font-size: 15px;
font-weight: 400;
line-height: 20px;}

.info ul{display: flex;
justify-content: space-evenly;}

.info ul li{line-height: 15px;
    padding-top: 20px;
    padding-bottom: 5px;
padding-right: 20px;}

.info ul li a{color: rgb(246, 207, 79);
font-size: 15px;
font-weight: 650;}

/* about me */

/* start of the boxes */

#eventoptions{padding: 15px 0;}

.moreinfo{ color: rgb(233, 188, 52);
 text-align: center;
font-size: 30px;
font-weight: 700;
padding-bottom: 30px;
}

.boxes{display: flex; 
justify-content: space-evenly;
}

.boxone{ background: rgb(89, 6, 6);
    padding: 15px 15px;
    width: 200px;
    box-shadow: 0px 6px 50px rgba(0, 0, 0, 0.497);
    border-radius: 5px;
}

.boxone img{ margin-top: 10px;
    margin-bottom: 13px;
    height: 50px;
    width: 75px;
}


.per{ color: rgb(233, 188, 52);
    font-size: 20px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 20px;
    text-align: center;
}

.perparagraph{ color: rgb(241, 204, 93);
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 20px;
}



.boxtwo{background: rgb(89, 6, 6);
    padding: 15px 15px;
    width: 200px;
    box-shadow: 0px 6px 50px rgba(0, 0, 0, 0.497);
    border-radius: 5px;}

.boxtwo img{
    height: 75px;
    width: 75px;
}


.story{ color: rgb(233, 188, 52);
    font-size: 20px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 20px;
    text-align: center;
}

.storyp{ color: rgb(241, 204, 93);
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 20px;
}

.boxthree{background: rgb(89, 6, 6);
    padding: 15px 15px;
    width: 200px;
    box-shadow: 0px 6px 50px rgba(0, 0, 0, 0.497);
    border-radius: 5px;}


.boxthree img{
    height: 80px;
    width: 70px;
}


.stage{ color: rgb(233, 188, 52);
    font-size: 20px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 20px;
    text-align: center;
}

.stagep{ color: rgb(241, 204, 93);
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 20px;
}

.boxfour{background: rgb(89, 6, 6);
    padding: 15px 15px;
    width: 200px;
    box-shadow: 0px 6px 50px rgba(0, 0, 0, 0.497);
    border-radius: 5px;}

.boxfour img{ 
    margin-top: 13px;
    margin-bottom: 17px;
    height: 50px;
    width: 75px;
}


.exp{ color: rgb(233, 188, 52);
    font-size: 20px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 20px;
    text-align: center;
}

.expp{ color: rgb(241, 204, 93);
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 20px;
}