@import url("/files/customsite/CS_487/ID_592/css/base.css");

#competition {
    background-color: #070101;
    color: #fff;
    background-image: url(/files/customsite/CS_509/ID_617/img/top.jpg?3);
    background-size: 120% auto;
    background-position: 15% 0%;
    background-repeat: no-repeat;
    max-width: 100%;
}

#top {
    padding: 25vw 0 8vw;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column nowrap;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

#logo {
    width: 15%;
    display: block;
    position: absolute;
    right: 1em;
    top: 1em;
}

#logo>img {
    max-width: 100%;
    display: block;
}


#top {
    text-align: center;
}

#top>.inner {
    max-width: 42em;
}

#contact {
    margin: 0 auto;
}

#contact h2 {
    font-size: 125%;
    margin: 2em 0 .5em 0;
}

#slides {
    overflow: hidden;
}

#slides>.inner {
    white-space: nowrap;
    transition: .2s ease-out;
    font-size: 0;
}

#slides>.inner>.slide {
    white-space: normal;
    width: 100%;
    display: inline-block;
    font-size: 16px;
    opacity: 0;
    transition: .5s ease-out;
    vertical-align: top;
}

.slide>.slide-inner {
    max-width: 42em;
    margin: 0 auto;
    padding: 2em 4em;
}

.slide span.button {
    display: inline-block;
    width: auto;
    background-color: #eb0029;
}


.slide input.largish {
    padding: .5em;
}

.slide .largish {
    font-size: 120%;
}

.slide .largish>label {
    padding: 1em;
}

#info .inner .copy {
    margin-right: 50%;
}


section.sbsform textarea, section.sbsform input[type="email"], section.sbsform input[type="text"],textarea, input[type="email"], input[type="text"] {
    border: 2px solid white;
    color: #fff;
    background: transparent;
}

section.sbsform textarea:focus, section.sbsform input[type="email"]:focus, section.sbsform input[type="text"]:focus,textarea:focus, input[type="email"]:focus, input[type="text"]:focus {
    background: transparent;
    border-color: #dbbe58;
    -webkit-animation: pulseRound 1s ease-out alternate infinite;
    -ms-animation: pulseRound 1s ease-out alternate infinite;
    -moz-animation: pulseRound 1s ease-out alternate infinite;
    animation: pulseRound 1s ease-out alternate infinite;
}

label.check input + span:before,
label.check input:checked + span:before {
    border: 0;
    background: white;
    color: #000;
    font-size: 120%;
    font-weight: bold;
}

section.sbsform input[type="submit"], section.sbsform .form-sendbutton {
    background-color: #eb0029;
    border: 0;
}

section.sbsform input[type="submit"]:hover, section.sbsform .form-sendbutton:hover {
}

.choices label {
    display: block;
    padding: .5em 0;
}

.other input[type="text"] {
    display: none;
}

.other.revealed input[type="text"] {
    display: inline-block;
}

.part2 #slides {
    margin-top: 2em;
}

.part2 #top .inner {
    font-size: 120%;
}

#competition h1 span {
    display: inline-block;
}

@-webkit-keyframes pulseRound {
    to {
        box-shadow: 0 0 60px #9a3f1c;
    }
}
@-ms-keyframes pulseRound {
    to {
        box-shadow: 0 0 60px #9a3f1c;
    }
}
@-moz-keyframes pulseRound {
    to {
        box-shadow: 0 0 60px #9a3f1c;
    }
}
@keyframes pulseRound {
    to {
        box-shadow: 0 0 60px #9a3f1c;
    }
}

@media screen and (max-width: 600px){
    
    #competition {
        background-size: 200% auto;
    }
    
    #top {
        max-width: 100%;
        padding-top: 65vw;
    }
    #slides>.inner>.slide {
        display: block;
        opacity: 1;
    }
    #slides .next.button {
        display: none;
    }
    .slide>.slide-inner {
        max-width: 100%;
        padding: 2em;
    }
    #logo {
        width: 33.33%;
    }
}