h1 {
 
    font-size:3rem;
    font-weight:600;
    font-family: "proxima-nova", sans-serif;
    line-height:1;
    color:#333333;
   }
   
   h2 {
    
    font-size:2.5rem !important;
    font-weight:400 !important;
    font-family: "proxima-nova", sans-serif;
    line-height:1.5 !important;
    text-align: center;
    margin-bottom: 0;
    margin-top:8rem;
    color:#333333;
    
   }
   
   
   h3 {
    font-size:2.40rem !important;
    font-weight:600 !important;
    font-family: "proxima-nova", sans-serif;
    line-height:1.1 !important;
    color:#333333;
   }
   
   h4 {
    
    font-size:1.5rem;
    font-weight:600;
    font-family: "proxima-nova", sans-serif;
    line-height:1.2;
    margin:0.25rem 2.7rem -0.5rem;
    color:#500778;
   
   }
   
   
   h5 {
    
    font-size:1.25rem;
    font-weight:300;
    font-family: "proxima-nova", sans-serif;
    line-height:1.5;
    margin:0.25rem 2.7rem -0.5rem;
    color:#333333;
   
   }
   
   
   
   h6 {
    
    font-size:1rem;
    font-weight:600;
    font-family: "proxima-nova", sans-serif;
    line-height:1rem;
    margin:0 0 1rem;
    color:#333333;
    text-transform: capitalize;
    
   }
   
   
   hr {
   
    border-top: 1px solid #c6c6c6;
    border-bottom:0;
   }
   
   .large {
    
    font-size:1.25rem;
   }
   
   
   .small {
    
    font-size:0.7rem;
   }
   
   .subhead {
    
    
     font-size:1.2rem;
    font-weight:400;
    font-family: "proxima-nova", sans-serif;
    line-height:1.5;
    text-align:center;
    margin:0 auto 2rem auto;
    text-transform: uppercase;
    
   }
   
   
   speaker {
    font-size:1.33rem;
    font-weight:400;
    font-family: "proxima-nova", sans-serif;
    line-height:1.5;
    text-align:left;
    margin:0.25rem auto 2rem 0;
    color:#333333;
   }

 speakers {
    font-size:1.3rem;
    font-weight:600;
    font-family: "proxima-nova", sans-serif;
    line-height:0;
    text-align:left;
    margin:0.25rem auto 2rem 0;
    color:#333333;
   }

 titles {
    font-size:1.1rem;
    font-weight:400;
    font-family: "proxima-nova", sans-serif;
    line-height:1.2;
    text-align:left;
 font-style: italic;
    margin:0.25rem auto 2rem 0;
    color:#333333;
   }
   
   
   p , ul {
    
    font-size:1rem;
    font-weight:400;
    font-family: "proxima-nova", sans-serif;
    line-height:1.3;
    color:#333333;
   }
   
   ul {
    
    margin:0;
   }


   
   a {
    
    color:#ffffff;
    text-decoration:underline;
   }

h7 {
 font-size:1rem;
    font-weight:400;
    font-family: "proxima-nova", sans-serif;
    line-height:1.3;
    color:#ffffff;
}

.logo {
 width: 90%;
 }

.register-button {
 padding: 25px;
}
   
   
   /* Video Modal*/
   
   .modal{
    display: flex;
    flex-direction: column;
     position: fixed;
     top: 5%;
     left: 20%;
     max-width: 800px;
     width: 100%;
    height: 450px;
     background: rgba(0,0,0,0);
     z-index: 100;
     visibility: hidden;
     opacity: 0;
     transition: 0.5s ease-out;
     transform: translateY(45px);
   }

 .modal-content{
     max-width: 800px;
     width: 100%;
    height: 450px;
 
   }

 iframe {
  border-radius: none;
   max-width: 800px;
     width: 100%;
  height: 450px;
    
}

 .noscroll {
 overflow: hidden;
}
   
   /* Class Active */
   

  .mask{
    position: fixed;
    top: 0;
    left: 0;
  width: 100%;
    height: 100%;
    background: #000000;
    z-index: 50;
    visibility: hidden;
    opacity: 0;
    transition: 0.7s;
  }


.active{
     visibility: visible;
     opacity: .85;
   }
   
   /* When active class is added, that affects the modal class*/
   
   .active + .modal{
     visibility: visible;
     opacity: 1;
     transform: translateY(0);
   }

 .close {
    justify-content: center;
     display: flex;
     align-self: flex-end;
     border: none;
     width: 20px;
     height: 20px;
     padding: 20px;
     border-radius: 20px;
     margin-bottom: 30px;
     font-size: 20px;
     color: #000000;
     line-height: 0px;
     background-color: #ffffff;
     transition: 0.3s;
     cursor: pointer;
  }

 .close:hover {
   color: #ffffff;
  background-color: #500778;
}


   
  /* button Orange */
.orange-btn {
  text-decoration:none;
  border: 2px solid #D44B00;
  padding:10px 20px 10px 20px;
  font-family: "proxima-nova", sans-serif;
  font-weight: 500;
  border-radius:none;
  color:#D44B00;
  margin:5px;
}
.orange-btn:hover {
  color:#FFFFFF;
  background-color:#D44B00;
}

  /* button Orange Color */
 .orange-btn-coloured {
  text-decoration:none;
  background:#D44B00;
  border: 0px solid #D44B00;
  padding:10px 20px 10px 20px;
  border-radius:none;
  color:#FFFFFF;
  margin:5px;
}

.orange-btn-coloured:hover {
  color:#FFFFFF;
  background-color:#000000;
}


  /* button Purple */
.purple-btn {
  text-decoration:none;
  border: 2px solid #500778;
  padding:10px 20px 10px 20px;
  font-family: "proxima-nova", sans-serif;
  font-weight: 500;
  border-radius:none;
  color:#500778;
  margin:5px;
}


.purple-btn:hover {
  color:#FFFFFF;
  background-color:#500778;
}

  /* button Purple Color */
 .purple-btn-coloured {
  text-decoration:none;
  background:#500778;
  border: 0px solid #500778;
  padding:10px 20px 10px 20px;
  border-radius:none;
  color:#FFFFFF;
  margin:5px;
}

.purple-btn-coloured:hover {
  color:#FFFFFF;
  background-color:#000000;
}

@media only screen and (max-width: 800px) {

.mobile-hidden{

 display: none;
 
}

}

@media only screen and (max-width: 1024px) {

.modal{
 left: 10%;
 
}

}

@media only screen and (max-width: 768px) {

iframe {
  border-radius: 0px; 
}

.modal{
 left: 0%;
 top: 0%;
}

}