/* CSS */
.newWhite{
  color: #f7f3f5ff !important;
}

.newTan{
  color: #ddb8a6ff !important;
}

.newGreen{
  color: #6d7973ff !important;
}

.newPurple{
  color: #180c1dff !important;
}

.newOrange{
  color: #fd3542ff !important;
}

.bg-newWhite{
  background-color: #f7f3f5ff !important;
}

.bg-newTan{
  background-color: #ddb8a6ff !important;
}

.bg-newGreen{
  background-color: #6d7973ff !important;
}

.bg-newPurple{
  background-color: #180c1dff !important;
}

.bg-newOrange{
  background-color: #fd3542ff !important;
}

.bg-darkTan{
  background-color: #be866a !important;
}

.border-newWhite{
  border-style: solid;
  border-width: 2px;
  border-color: #f7f3f5ff !important;
}

.border-newTan{
  border-style: solid;
  border-width: 2px;
  border-color: #ddb8a6ff !important;
}

.border-newGreen{
  border-style: solid;
  border-width: 2px;
  border-color: #6d7973ff !important;
}

.border-newPurple{
  border-style: solid;
  border-width: 2px;
  border-color: #180c1dff !important;
}

.border-newOrange{
  border-style: solid;
  border-width: 2px;
  border-color: #fd3542ff !important;
}

.border-rn{
  border-right-style: none;
}

.border-ln{
  border-left-style: none;
}


/*
--snow: hsla(330, 2%, 97%, 1);
--desert-sand: hsla(20, 25%, 87%, 1);
--xanadu: hsla(150, 10%, 47%, 1);
--xiketic: hsla(282, 59%, 11%, 1);
--red-salsa: hsla(356, 79%, 99%, 1);
*/

/* SCSS HSL */
/*
$snow: hsla(330, 2%, 97%, 1);
$desert-sand: hsla(20, 25%, 87%, 1);
$xanadu: hsla(150, 10%, 47%, 1);
$xiketic: hsla(282, 59%, 11%, 1);
$red-salsa: hsla(356, 79%, 99%, 1);
/*

/* SCSS RGB */
/*
$snow: rgba(247, 243, 245, 1);
$desert-sand: rgba(221, 184, 166, 1);
$xanadu: rgba(109, 121, 115, 1);
$xiketic: rgba(24, 12, 29, 1);
$red-salsa: rgba(253, 53, 66, 1);
*/

/* SCSS Gradient */
/*
$gradient-top: linear-gradient(0deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-right: linear-gradient(90deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-bottom: linear-gradient(180deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-left: linear-gradient(270deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-top-right: linear-gradient(45deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-bottom-right: linear-gradient(135deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-top-left: linear-gradient(225deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-bottom-left: linear-gradient(315deg, #f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
$gradient-radial: radial-gradient(#f7f3f5ff, #ddb8a6ff, #6d7973ff, #180c1dff, #fd3542ff);
*/

.video {
  /* override other styles to make responsive */
  width: 100%    !important;
  height: auto   !important;
  overflow-x: hidden;
  position: relative;
}

.openingText{
  position: absolute;
  left: 10%;
  top: 10%;
}

.openingNav{
  position: absolute;
  left: 10%;
  top: 10%;
}

.opening{
  position: absolute;
  bottom: 0;
}

.bigFont{
  font-size: 7vw;
}

.smallFont{
  font-size: 2vw;
}

.xsmallFont{
  font-size: 1.25vw;
}

.interstateFont{
  font-family: interstate, sans-serif;
  font-weight: 398;
  font-style: normal;
}

.cursiveFont{
  font-family: gloss-drop,cursive;
  font-weight: 400;
  font-size: 300%;
  font-style: normal;
}

.py-05 {
  padding-top: 0.15rem !important;
  padding-bottom: 0.15rem !important;
}

@media (max-width: 430px){
  .smallScreen{
    position: relative;
    z-index: -1;
  }

}

.grad{
  background-image: linear-gradient(#ddb8a6ff, #6d7973ff);
}
.absolute {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 0;
}

.relative {
  position: relative;
}

.box1 {
  position: absolute;
  right: 0;
  top: 8vw;
  width: 93%;
}

.box1b {
  position: absolute;
  right:0;
  top: 11vw;
  width: 98%;
}

.remove{
  list-style-type: none;
}

.box2 {
  position: absolute;
  left: 0;
  top: 3vw;
  width: 93%
}

.box2b {
  position: absolute;
  left: 0;
  top: 6vw;
}

.groupPic{
  position: absolute;
  left: -1.5vw;
  top: -2vw;
  z-index: -1;
}

.box3 {
  position: absolute;
  right: 0;
  top: 32vw;
  width: 93%
}

.box3b {
  position: absolute;
  right: 0;
  top: 35vw;
}

.audition {
  position: absolute;
  top: 29vw;
  left: 2vw;
}

.showcasePractice {
  position: absolute;
  top: 39vw;
  right: -2vw;
  z-index: -1;
}

.shadow {
  filter: drop-shadow(-125px -85px #fd3542ff);
}
.italic {
  font-style: italic;
}

.contain {
  object-fit: contain;
}

footer{
  position: absolute;
  top: 155vw;
  left:0;
}

.specialCenter {
  margin: auto;
}