/* ******* MOBILE ******* */

/* HEADER */


.header {
    text-align: center;
    padding-top: 30px;
    padding-bottom: 25px;
}
.header .logo{
    display: inline-block;
    width: 70%;
    max-width: 140px;
}
.header .logo a,
.header .logo a img{
    display: block;
    width: 100%;
    max-width: none;
}
.header .sponsor{
    width: 220px;
    margin-top: 20px;
}

.header .nav {
    margin-top: 20px;
    padding-left: 0px;
}
.header .nav .menu li a{
    color: #009933;
}


/* INFORMATION */

.article .content li:before {
    background-color: #009933;
}



/* BOX */

.box .heading{
    background-color: #ff6600;
}


/* EVENT TITLE */

.event-title{
    background-color: #ff6600;
    text-align: center;
}
.event-title .kicker,
.event-title .title,
.event-title .caption{
    color: #fff;
}
.event-title .title{
    font-weight: 700;
    font-size: 2.8em;
}
.event-title .caption{
    font-size: 1.9em;
}


/* FORM */

#form{
    background-color: #009933;
}
#form .heading{
    background-color: #009933;
}


/* HELP */

#help{
    background-color: #009933;
}

#help .heading{
    background-color: #009933;
}



/* ********************** de Mobile a TABLET ********************** */

@media (min-width: 768px) {
    
    .main-wrapper{
        padding-top: 20px;
    }
    /* HEADER */

    .header{
        text-align: left;
        position: relative;
        padding: 20px 0;
    }
    .header .logo {
        display: inline-block;
        vertical-align: middle;
        width: 144px;
        max-width: none;
    }
    .header .sponsor {
        display: inline-block;
        vertical-align: middle;
        position: static;
        margin-top: 0;
        margin-left: 35px;
        
        -webkit-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
    .header .nav {
        text-align: right;
        position: absolute;
        right: 0;
        top: 50%;
        margin: 0;

        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }


    /* EVENT TITLE */

    .event-title .title{
        font-size: 3em;
    }
    .event-title .caption{
        font-size: 1.8em;
        text-transform: uppercase;
        margin-top: 13px;
    }
    


    /* FORM / HELP */

    .article .main-cols.green .col:before{
        background-color: #009933;
    }

}



/* ********************** de TABLET a DESKTOP  ********************** */

@media (min-width: 980px) {

    /* HEADER */
    
    .header{
        padding: 15px 0;
    }
    .header .logo{
        width: 180px;
    }
    .header .sponsor{
        width: 280px;
        margin-left: 45px;
    }


    /* EVENT TITLE */

    .event-title .title{
        font-size: 3.2em;
    }

}