@charset "utf-8";
 body {
     background:#000000 url(/templates/midnightdating/265/images/hdbnr.png) top center no-repeat;
     font-size:30px;
     font-family: 'Lato', sans-serif;
     font-weight: 400;
     color:#999999;
}
 a, a:visited, a:link, a:active {
     color:#ffffff;
     text-decoration:none;
     outline:none 
}
 a:hover {
    color: #ff004f;
     text-decoration:none
}
 .container{
    max-width: 1058px;
}
 .p-6 {
    padding: 2.5rem 4.5rem !important;
}
 .form-select{
     background-image: url(/templates/midnightdating/265/images/arrow-dwn.png)!important;
     background-size: 23px 13px;
}
 header{
     background: transparent;
     padding: .5rem 0;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
}
 .navbar-brand, .logo-ftr{
     font-size: 33px;
     font-weight: 300;
     padding-left: .5rem;
     color: #fff;
}
 .navbar-brand img, .logo-ftr img{
     width: auto;
     height: 60px;
}
 .navbar-brand strong, .logo-ftr strong{
    color: #ffc600;
}
 .nav-item{
     font-size: 18px;
     text-transform: uppercase;
     padding: 0 5px;
}
 .nav-link{
     padding: 3px 15px!important;
     font-weight: 700;
     font-size: 18px;
     text-transform: uppercase;
}
 .nav-link:hover{
    color: #00f2eb;
}
 .nav-link.yellow-btn{
     margin-left: 10px;
     font-size: 18px;
}
 img{
     max-width: 100%;
     height: auto;
}
 p{
     font-size: 20px;
     line-height: 30px;
}
 .py-5 {
     padding-top: 5rem !important;
     padding-bottom: 5rem !important;
}
 .mt-14{
    margin-top: 14em
}
 .yellow-btn{
     border-radius: 100px;
     background: #ff004f;
     color: #000000!important;
     font-size: 35px;
     font-weight: 700;
     text-transform: uppercase;
     border: 0;
     padding: 10px 50px;
}
 .yellow-btn:hover{
     background: #00f2eb;
}
 .join-box{
     background: rgba(0,0,0,0.57);
     padding: 20px;
}
 .join-box hr{
     border: 0;
     border-bottom: 1px solid #ff004f;
     margin: 0 auto 15px;
}
 .join-box h2{
     color: #00f2eb;
     font-size: 35px;
     text-transform: uppercase;
     font-weight: 700;
}
 .join-box label{
     display: inline-block;
     width: 185px;
     font-size: 25px;
     color: #ffffff;
     text-transform: uppercase;
     text-align: right;
     padding-right: 10px;
}
 .join-box select{
     display: inline-block;
     width: calc(100% - 205px);
     border-radius: 0;
     font-size: 25px;
     padding-top: .2em;
     padding-bottom: .2em;
}
 .join-box .yellow-btn{
     font-size: 25px;
}
 .top-txt h3{
     font-size: 40px;
     font-weight: 700;
     color: #ff004f;
}
 .big-title{
     font-size: 50px;
     color: #ff004f;
     font-weight: 700;
}
 .sub-title{
     font-size: 36px;
     color: #ffffff;
}
 ul.list-img{
     font-size: 0;
     list-style: none;
     margin: 40px 0 0;
     padding: 0;
}
 .list-img li{
     display: inline-block;
     width: 33.333%;
     padding: 10px;
}
 .list-img li img{
     width: 100%;
     height: auto;
}
 .yellow-box{
     background: #00f2eb;
     color: #000000;
     padding: 20px 2.2em;
     font-weight: 700;
}
 .yellow-box h4{
     font-size: 40px;
     color: #ffffff;
     font-weight: 700;
     text-transform: uppercase;
}
 .player video{
     width: 100%;
     height: auto 
}
 .ftr-menu{
     font-size: 18px;
}
 .ftr-menu a{
     margin: 0 5px;
     font-weight: 700;
}
 footer p{
    font-size: 18px
}
 footer p br{
    display: none;
}
 .logo-ftr{
    padding-left: 0;
}
 @media screen and (max-width:1280px) {
     body {
        background:#000000 url(/templates/midnightdating/265/images/hdbnr-1028.png) top center no-repeat;
        background-size: 100%
    }
}
 @media screen and (max-width:992px) {
     .navbar-collapse{
        background: rgba(0,0,0,.8);
        padding: 20px;
        border-radius: 10px;
    }
     .mt-14{
        margin-top: 10em
    }
     .nav-link{
        text-align: center!important;
    }
     .join-box, .yellow-box{
        margin-bottom: 30px;
    }
     .list-img li{
        width: 50%;
    }
     @media screen and (max-width:680px) {
         body {
            font-size: 5vw;
        }
         .mt-14{
            margin-top: 6em
        }
         .navbar-brand, .username{
            font-size: 6vw
        }
         p{
            font-size: 6vw;
            line-height: 8vw;
        }
         .join-box h2{
            font-size: 6vw
        }
         .join-box label{
            width: 100%;
            text-align: left;
            font-size: 5vw;
            margin-bottom: 5px;
        }
         .join-box select{
            width: 100%;
            font-size: 5vw;
        }
         .join-box .yellow-btn{
            font-size: 6vw;
            padding: 5px 15px;
        }
         .top-txt h3, .yellow-box h4{
            font-size: 8vw
        }
         .big-title{
            font-size: 9vw;
            line-height: 11vw;
        }
         .sub-title{
            font-size: 7.5vw;
            line-height: 9vw;
        }
         .yellow-box{
            padding: 15px 20px
        }
         .yellow-btn{
            font-size: 6vw;
            padding: 7px 20px;
        }
         .ftr-menu, footer p{
            font-size: 4vw;
            line-height: 6vw;
        }
         footer p br{
            display: block
        }
    }
     

input[type=text], select, textarea {
  padding: 12px; 
  border: 1px solid #ccc; 
  border-radius: 4px;
  box-sizing: border-box; 
  margin-top: 6px; 
  margin-bottom: 16px; 
  resize: vertical 
}


input[type=submit] {
  background-color: #04AA6D;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
 
}

input[type=submit]:hover {
  background-color: #45a049;
}