/*
    Website developed by Aayush Joglekar for CodeRed | Aparoksha'18. www.github.com/aayushjoglekar
*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
}

html {
    font-family: 'Lato', sans-serif;
    font-size: 20px;
    font-weight: 300;
    color: white;
}

.row {
    width: 90%;
    margin: 0 auto;
    
}

nav{
    height:auto;
    width:100%;
    position:absolute;
    top:0;
    padding:40px 0;
   
    font-size:80%;
    
}

.logo{
    width:auto;
    margin-top:14px;
    float: left;
}

.apk-logo{
   
    height:18px;
    padding:0 20px;
    margin-right: 20px;
    display: inline-block;
    border-right:1px solid white;
}



nav h3{
    font-weight:300;
    display: inline-block;

}

nav a:link,
nav a:visited{
    color:white;
}

ul{
    float: right;
    text-decoration: none;
}

ul li{
    display: inline-block;
    padding:10px 10px;
    border-radius:100px;
    margin:5px;
    font-weight:500;
    cursor: pointer;
    animation-duration: 0.2s;
   
    
}

.btn-ghost{
    color:#DC281E;
    border:2px solid #DC281E;
}

.btn-ghost a:link,
.btn-ghost a:visited{
    color:#DC281E;
}

.btn-full{
    background-color:#DC281E;
    border:2px solid #DC281E;
    color:white;
}


section {
    padding: 80px 0;
    position: relative;
}

header {
    height: 100vh;
    width: 100%;
    position: relative;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("images/header-wallpaper.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    overflow: hidden;
}

.intext {
    display: inline-block;
    height: 20px;
    width: auto;
}

.title {
    height: auto;
    width: 750px;
    text-align: center;
    position: absolute;
    top: 55%;
    left: 49.5%;
    transform: translate(-50%, -50%);
}

.title img {
    width: 80%;
}

.title-underline {
    height: 2px;
    width: 60%;
    margin: 0 auto;
    margin-top: 20px;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
}

.title .row {
    margin: 0 auto;
    margin-top: 20px;
}

/*
    Website developed by Aayush Joglekar for CodeRed | Aparoksha'18. www.github.com/aayushjoglekar
*/

.tagline {
    text-transform: uppercase;
    color: white;
    font-weight: 300;
    font-size: 125%;
    margin: 0 auto;
    letter-spacing: 2px;
    visibility: hidden;
}

.bar {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 6px;
    background: #F00000;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #DC281E, #F00000);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #DC281E, #F00000);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.top {
    top: 0;
}

.bottom {
    bottom: 0;
}

h2 {
    font-size: 200%;
    font-weight: 300;
    color: white;
    cursor: auto;
}

h2:after {
    content: '';
    display: block;
    margin: 0 auto;
    height: 2px;
    width: 20%;
    margin-top: 10px;
    background-image: linear-gradient(to right, rgba(240, 0, 0, 0.1), rgba(240, 0, 0, 0.9), rgba(240, 0, 0, 0.1));
}


/* SECTION-DETAILS  */

.section-details {
    width: 100%;
    background-color: black;
    padding: 50px 0 60px 0;
    text-align: center;
}

.description {
    width: 80%;
    margin: 0 auto;
    padding: 40px 0;
    font-size: 125%;
}

.round-desc {
    font-size: 130%;
}

.round{
    width:100%;
    text-align: center;
}

.round:first-of-type{
    margin-bottom: 50px;
}
.rounds i {
    font-size: 300%;
    color: #F00000;
}

.rounds.row {
    padding: 30px 0 40px 0;
}

.invite {
    width: 70%;
    margin: 0 auto;
    
    font-size: 125%;
    color: white;
}

.date{
    margin:20px 0;
}

a:link,
a:visited {
    text-decoration: none;
    color: white;
}


.section-contact {
    background: #F00000;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #DC281E, #F00000);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #DC281E, #F00000);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    text-align: center;
    padding: 40px 0;
    
}

.section-contact h2{
    color:white;
}

.section-contact h2:after {
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.1));
}

.section-contact i {
    margin: 0 20px;
    font-size: 120%;
}

.contact-item:link,
.contact-item:visited {
    padding: 20px 0 0 0;
    font-weight: 500;
    color: white;
    display: inline-block;
    cursor:pointer;
}

.sponsorship a:link,
.sponsorship a:visited{
    color:#DC281E;
}

.section-details .date{
    font-weight: 500;
}

.section-details .btn-full{
    padding:10px;
    font-size:80%;
    color:white;
    font-family: 'Lato';
    font-weight: 500;
    border-radius:300px;
    
    display: inline-block;
    width:auto;

}

/*SECTION-RULES*/

.section-rules{
    width: 100%;
    background-color: black;
    padding: 50px 0 60px 0;
    text-align: center;
    border-top:solid 5px #F00000;
}

.section-rules h2:after {
    content: '';
    display: block;
    margin: 0 auto;
    height: 2px;
    width: 25%;
    margin-top: 10px;
    margin-bottom:30px;
    background-image: linear-gradient(to right, rgba(240, 0, 0, 0.1), rgba(240, 0, 0, 0.9), rgba(240, 0, 0, 0.1));
}

.section-rules .row.rules{
    width:65%;
    
}

.section-rules .rule{
    text-align:left;
    margin:30px 0;
    
}

.attention{
    color:#F00000;
    font-style: italic;
    font-weight:400;

}

.section-rules i{
    font-size:80%;
    color:white;
}

.title .btn-full{
    padding:10px;
    font-size:80%;
    color:white;
    font-family: 'Lato';
    font-weight: 500;
    border-radius:300px;
    
    
    display: none;
    width:auto;

}

/*FOOTER*/

footer {
    width: 100%;
    background-color: black;
    text-transform: uppercase;
    font-size: 80%;
    font-weight: 300;
    letter-spacing: 1px;
    border-top: 2px solid #F00000;
    text-align: center;
    padding: 40px 0;
}

footer .intext {
    height: 10px;
}


/* ANIMATION */

.title img {
    opacity: 0;
    animation-duration: 1.2s;
}


.title img,
.title .btn-full{
    opacity: 0;
    animation-duration: 1.2s;
}

.title-underline {
    opacity: 0;
    animation-duration: 2s;
}

.title img.animated,
.title-underline.animated,
.title .btn-full.animated{
    opacity: 1;
}

/*
    Website developed by Aayush Joglekar for CodeRed | Aparoksha'18. www.github.com/aayushjoglekar
*/