main {
  color: white;
}

#center_text {
  text-align: center;
  font-size: 30px;
  margin: 0px 20% 30px 20%;
  display: flex;
  flex-direction: column;
  max-width: calc(100vw - 20px);
}

#center_text > iframe{
  max-width: 100%;
  margin: auto;
}

h4 {
  text-decoration: underline;
}

.panel_box {
  display: flex;
  width: 100%;
}

.panel {
  text-align: center;
  color: white;
  background: #6E0D0D;
  width: 33.3333%;
  height: 350px;
  transition: background 0.5s;
  opacity: 1;
}

.panel-image {
  width: 50%;
  height: 100%;
  object-fit: cover;
}

.panel_information {
  width: 50%;
}

.panel_information p {
  margin: 10px;
}

.right {
  float: right;
}

.left {
  float: left;
}

.panel:hover {
  background: #991313;
}

.parallax {
  /* The image used */
  background-image: url("../images/bg.jpg");
  background-color: white;
  height: 100%;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.parallax_inner_box {
  background: rgba(0,0,0,0.6);
  height: 100%;
  padding: 20px 0px 100px 0px;
}

a {
  color: white;
}

a:hover {
  color: white;
}

/*

STYLING FOR MOBILE

*/

@media only screen and (max-width: 800px)  {
  
  .panel_box {
    flex-wrap: wrap;
  }
  
  .panel {
    width: 100%;
  }
  
  #center_text {
    margin: 0px 15px 50px 15px;
  }

  .parallax_inner_box {
    padding: 50px 0px 250px 0px;
  }

  .odd {
    float: left;
  }

  .flip-right-on {
    float: right;
  }

}