.scroller {
height: 100vh;
}

/* .orange {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100vh;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #753500;
} */

/* .text {
color: #fff;
} */

.black {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100vh;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
/* background-color: #070707; */
color: #070707 !important;
}

.blue {
height: 100vh;
/* background-color: #00026d; */
}


.text-wrap {
position: relative;
overflow: hidden;
width: 650px;
height: 50vh;
}

.panel-text {
position: absolute;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 1;
width: 100%;
height: 100%;
font-size: 40px;
text-transform: uppercase;
font-weight: 900;
text-align:center;
transform:translateY(100%);
opacity: 0;
}

.panel-text p{
  color: #070707 !important;
  font-size: 17px !important;
  text-transform: none;
  font-weight: 400 !important;
  margin-bottom: 20px !important;
  text-align: start;
}

.panel-text h3{
  color: #093b45;
  text-align: start;
}
.panel-text h2{
  font-size: 32px !important;
  text-align: start;
}

.panel-text ul{
  text-transform: none;
  list-style: decimal;
  color: black;
  font-size: 18px;
  text-align: start;
  margin-top: 20px;
}

.p-wrap {
position: relative;
overflow: hidden;
width: 600px;
height: 45vh;
}

.panel {
position: absolute;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 1;
width: 100%;
height: 100%;
background-position: 50% 50%;
background-size: cover;
background-repeat: no-repeat;
}

.panel._2 {
z-index: 1;
}

.panel.blue {
z-index: auto;
background-image: url("../images/jpg/hh20.jpg");
}

.panel.red {
z-index: auto;
background-image: url("../images/jpg/film-banner.webp");
}

.panel.orange {
z-index: auto;
background-image: url("../images/jpg/hh22.jpg");
}

.panel.purple {
z-index: auto;
background-image: url("../images/jpg/hh23.jpg");
}
.panel.yellow {
z-index: auto;
background-image: url("../images/jpg/hh24.jpg");
}
.panel.black {
z-index: auto;
background-image: url("../images/jpg/hh25.jpg");
}
.panel.green {
z-index: auto;
background-image: url("../images/jpg/hh26.jpg");
}
