@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;600;700&display=swap');

/* global */
body {
  font-family: 'Poppins', sans-serif;
  /* for fixed nav */
  min-height: 75rem;
  padding-top: 4.5rem;
}

h1, h2, h3, h4{
  font-weight: 700;
  text-transform: uppercase;
}
.blue{
  color: #326783;
}

.orange{
  color: #BA5656;
}

.brown{
  color: #ad695c;
}

.grey{
  color: #707071;
}

.white{
  color: #fff;
}

.bold{
  font-weight: 700;
}

.caps{
  text-transform: uppercase;
}

.right{
  float: right;
}

.contbody{
  padding-top: 5rem;
}

/* navbar */

.navbar {
  background:#BA5656;
  color: #fff;
  box-shadow: 0px 3px 26px #00000029;
}

.navbar-brand{
  font-weight: 800;
  font-size: 1.7rem; 
}

.nav-link{
  font-weight: 600;
  font-size: .75rem;
  text-transform: uppercase; 
  margin-right: 2rem;
}

.navbar a{
  color: #fff;
}

.navbar a:hover{
  color: #fff8da;
}

.navbar a:active{
  color: #ffce94;
}
.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: #fff;
  border-width: .15rem;
} 

/* hero*/

.hero-image{
  padding-top: 3rem;
  height:45rem;
}

.hero-bg{
  background: transparent linear-gradient(270deg, #FDEAE7 0%, #FFFFFF 51%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
  opacity: 1;
  margin-top: -1rem;
  height: 100%;
  vertical-align: bottom;
}

.hero-title{
  width: 25.5rem;
  line-height: 2.5rem;
  margin-top: 8rem;
  margin-right:auto;
  margin-left:auto;
}
.large-tx{
  font-size: 5rem;
}

.hero-win{
  line-height: 6rem; 
  padding-left: 5rem;
}

.hero-hash{
  margin:auto;
}

.hero-sub{
  width: 18rem;
  text-align: center;
  margin:auto;
}

.hero-sub a{
  color: #707071;
  text-decoration: none;
}

.med-tx{
  font-size: 2.5rem;
}


/* blue body */

.blue-bg{
  background: transparent linear-gradient(180deg, #E2F1F8 0%, #FFFFFF 51%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
  opacity: 1;
}

/* the contest */

.contest-box{
  text-align: center;
  font-weight: 700;
  color: #fff;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center; 
}

.contest-box img{
  width: 15rem;
  height: auto;
  margin: auto;
  padding-top: .5rem;
}

.contest-title{
  font-size: 2rem;
  text-transform: uppercase;
}

.contest-info {
font-size: 1.25rem;
}

/* the details */

.detail-box{
  border-top: solid 1px #707070;
  padding-top: 3rem;
  margin-top: 3rem;
}


.detail-title{
  font-size: 1.75rem;
  text-transform: uppercase;

}

.btn-details{
  border: 1px solid #33627C;
  opacity: 1;
  border-radius: 0;
  font-weight: 700;
  color:#33627C;
  padding: .8rem 1.5rem;
}

/* modal */

.modal-dialog {
  max-width: 45rem;
  margin: 1.75rem auto;
}
.modal-header{
  background-color: #33627C;
  color: #fff;
  border-radius: 0;
}

.modal-headers{
  font-size: 1.25rem;
}

.modal-content{
  border-radius: 0;
  box-shadow: 0 0 5rem rgba(0, 0, 0, .5);
  
}

.modal-body{
  padding: 2rem;
}

.close {
  color: #fff; 
  opacity: 1;
}

ol, ul {
  padding-left: 1rem;
}

/* important dates*/

.white-box{
  height: 6rem;
  margin: auto;
  box-shadow: 0 0 1.5rem rgba(0, 0, 0, .15);
  margin-top: 1.5rem;
  padding-top: 1.5rem ;
  color:#3B4350;
}

.white-box img{
  width: 1.5rem;
  height: auto;
  float: left;
  margin-top: .5rem;
  margin-right: 1.5rem;
  margin-left: 1rem;
  word-break: break-word;
}

.full-list{
  margin-top: 3rem;
  text-align: center;
}

.full-list a{
  margin-top: 3rem;
  text-align: center;
  color:#3B4350;
}

/* logo */
.logo{
  margin-bottom: 1rem;
  margin-top: 1rem;
}

/*footer*/
.footer-content{
  background-color: #33627C;
  color: #fff;
  text-align: center;
  margin-top: 2rem;
  padding-top:1.5rem;
  height: 4rem;
}

/* winner page */

.winner-box {
  background: transparent linear-gradient(220deg, #FDF4E7 0%, #FFFFFF 82%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
  margin-top: -1rem;
}

.win-bg {
  background-size: contain;
  background-repeat: no-repeat;
  padding-top: 4rem;
  padding-bottom: 3rem;
  height: auto;
}

.win-bg-left{
  background-position: center;
  background-image: url('../images/hero_bg_left.svg');
}

.win-bg-middle{
  background-position: center;
  background-image: url('../images/hero_bg_middle.svg');
}
.win-bg-right{
  background-position: center;
  background-image: url('../images/hero_bg_right.svg');
}



.neg-bg{
  margin-right: -.04rem;
  margin-top: -.04rem;
}

.winner-header{
  margin-top: 3rem;
  margin-bottom: 1.5rem;
  font-size: 3rem;
}

.winner-text{
  font-weight: 700;
  color: #fff;
  padding-top: 1rem;
  text-align: left;
  margin-left: 3rem;
}

.winner-sub{
  font-size: 1.25rem;
  text-transform:uppercase;
}

.med-smaller{
  font-size: 1.75rem;
}

.white-border{
  border: solid .25rem #fff;
  box-shadow: 0px 3px 36px #00000029;
}

.win-image{
  height: 15rem;
  width: auto;
  margin-top: 4rem;
}

.side-icon{
  width: 2rem;
  height: auto;
  margin-right: 1.5rem;
  margin-left: 1rem;
  margin-bottom: 1rem;
  word-break: break-word;
}

.red-bg{
  background: transparent linear-gradient(270deg, #FFE2E2 0%, #FFFFFF 82%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
  padding-top: 3rem;
}

.lightblue-bg{
  background: transparent linear-gradient(90deg, #CDE0EA 0%, #FFFFFF 82%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
  padding-top: 3rem;
}

.runner-up{
  border-bottom: solid 1px #707071;
  width: 20rem;
  padding-bottom: 1rem;
  text-transform: uppercase;
  font-weight: 700;
  margin:auto;
  margin-bottom: 2rem;
}


.runner-box{
  font-weight: 700;
  color: #fff;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 5rem;
  padding-left: 6rem;
  padding-right: 6rem;
  padding-bottom: 3rem;
  height: auto;
  margin: auto;
  margin-bottom: 3rem; 
}

.runner-art{
  height: 15rem;
  width: auto;
  box-shadow: 0px 3px 36px #00000029;
}

.runners-art{
  height: 8rem;
  width: auto;
  box-shadow: 0px 3px 36px #00000029;
}

.runner-icon{
  width: 2rem;
  height: auto;
  margin-right: .5rem;
  margin-top: .5rem;
  margin-bottom: 2rem;
  word-break: break-word;
  float: left;

}

.runner-text{
  text-align: left !important;
  margin-left: 2rem;
  width: 25rem;
}

.runners-text-orange{
  font-weight: 700;
  color: #BA5656;
  padding-top: .75rem;
  text-align: left;
  margin-bottom: 2.5rem;
}

.runners-text-blue{
  font-weight: 700;
  color: #33627C;
  padding-top: .75rem;
  text-align: left;
  margin-bottom: 2.5rem;
}

.side-icons{
  width: 2rem;
  height: auto;
  margin-right: .5rem;
  margin-left: .5rem;
  margin-bottom: 1rem;
  word-break: break-word;
}


/* Mobile Fixes */

@media (max-width: 768px) { 
.white-box{
  width: 90%;
}

.detail-box{
  padding-left: .75rem;
  padding-right: .75rem;
}
 
 .modal.show .modal-dialog{
   max-width: 80%;
 }

 .hero-title{
   width: 100%;
 }
 .med-tx {
  font-size: 2rem;
}

.white-box img{
  width: 1.5rem;
  height: auto;
  float: left;
  margin-top: .5rem;
  margin-right: .75rem;
  margin-left: 1rem;
  word-break: break-word;
}

.winner-text{
  font-weight: 700;
  color: #fff;
  padding-top: 1rem;
  text-align: left;
  margin-left: 2rem;
}


}

@media (max-width: 991.98px) { 
  .win-bg {

    background-size: cover;
    background-repeat: no-repeat;
    /*padding-top: 3rem;
    padding-bottom: 1rem; */
    height: auto;
    text-align: center;
  }

  .win-image{
    height: 12rem !important;
    width: auto;
    margin-top: 3rem;
  }
    
  .winner-header{
    font-size: 2.5rem;
  }

  .winner-text{
    font-weight: 700;
    color: #fff;
    padding-top: 1rem;
    text-align: left;
    margin-left: 2rem;
  }

  .win-bg-left {
  background-position: bottom !important;
  background-image: url('../images/hero_bg_left_small.svg') !important;
  }

  .win-bg-middle{
    background-position: bottom;
    background-image: url('../images/hero_bg_middle_small.svg')!important;
  }

  .win-bg-right {
  background-position: bottom !important;
  background-image: url('../images/hero_bg_right_small.svg') !important;
  }
  .justify-winners {
    justify-content: center !important;
  }

  .side-icon {
    width: 2rem;
    height: auto;
    margin-right: 1rem;
    margin-left: 0rem;
    margin-bottom: 1rem;
    word-break: break-word;
}

  .right{
    float: none;
  }

 }

@media (max-width: 1200px) { 
  .hero-image {
    padding-top: 3rem;
    height: 35rem;
}

.contest-box img {
  width: 8rem;
  height: auto;
  margin: auto;
  padding-top: .5rem;
}

.contest-info {
  font-size: 1rem;
}

.winner-text{
  font-weight: 700;
  color: #fff;
  padding-top: 1rem;
  text-align: left;
  margin-left: 1.5rem;
}

.win-bg {

  background-size: contain;
  background-repeat: no-repeat;
  /*margin-top: -2rem;
  padding-top: 2rem;
  padding-bottom: 4rem;*/
  height: auto;
}

.win-bg-left{
  background-position: top right;
  background-image: url('../images/hero_bg_left_mobile.svg');
}

.win-bg-middle{
  background-position: top center;
  background-image: url('../images/hero_bg_middle_mobile.svg');
}

.win-bg-right{
  background-position: top left;
  background-image: url('../images/hero_bg_right_mobile.svg');
}

.win-image{
  height: 15rem;
  width: auto;
  margin-top: 3rem;
}

.runner-art{
  height: 12rem;
  width: auto;
  box-shadow: 0px 3px 36px #00000029;
}

.runners-art{
  height: 12rem;
  width: auto;
  box-shadow: 0px 3px 36px #00000029;
}

.runner-box{
  font-weight: 700;
  color: #fff;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 4em;
  padding-left: 0rem;
  padding-right: 0rem;
  padding-bottom: 2rem;
  height: auto;
  margin: auto;
  margin-bottom: 3rem; 
}


 }