/*
Conor 
Gumpo
conor@gumpo.co.uk
*/
/* 
    Created on : 12-Dec-2014, 09:29:39
    Author     : conor at gumpo.co.uk>
*/


/****************************************
                   Search Bar & Flags
****************************************/

/* Hide Search Bar & Flags by Default */
@media all and (max-width: 480px) {

    body #main {
        padding-bottom: 8px;
    }

    /* Flags */
    body #main ul.flags {
        display: none;
    }

    /* Search Bar Container*/
    #main #navForm {
        width: 100%;
    }

    /* Search Bar */
    body #main input[type="text"] {
        width: 85%;
    }

    /* Submit Button */
    body #main .submit {
        width: 15%;
        min-width: 0;
    }

    #main img[src*="logo.png"]{
        padding: 0;
        margin-left: 15px;
    }
    .player {
        height: 33px;
        margin: 0 0 10px 0;
    }
    #mainContent .content aside {
        margin: 20px 0 0 0;
    }
}


/****************************************
                    Customize Table
****************************************/

@media all and (max-width: 480px) {
    #customiseTable {
        width: 88%;
        margin: 0 6% 32px 6%;
    }

    #customiseTable p {
        width: 100%;
        display: block;
        float: left;
        margin-bottom: 16px;
    }

    #customiseTable p:nth-of-type(1),
    #customiseTable p:nth-of-type(2) {
        min-width: 100%;
        max-width: 100%;
        width: 100%;
    }

    #customiseTable p:nth-of-type(1) input,
    #customiseTable p:nth-of-type(2) input {
        display: block;
        min-width: 100%;
        max-width: 100%;
        width: 100%;
        margin-top: 8px;
    }

    #customiseTable p:nth-of-type(3),
    #customiseTable p:nth-of-type(4) {
        display: inline-block;
        float: left;
        min-width: 50%;
        max-width: 50%;
        width: 50%;
    }

    #customiseTable p:nth-of-type(3) select,
    #customiseTable p:nth-of-type(4) select {
        min-width: 60px;
        max-width: 60px;
        width: 60px;
    }

    /* Buttons */ 
    #customiseTable p:nth-of-type(5),
    #customiseTable p:nth-of-type(6) {
        text-align: center;
    }

    #customiseTable #submit_custom, 
    #customiseTable #reset {
        min-width: 100%;
        max-width: 100%;
        width: 100%;
        margin: 0;
    }
}

/****************************************
           League Table (Mobile Menu)
****************************************/

@media all and (max-width: 700px) {
    .nonMob {
        display: none;
    }
}

@media all and (min-width: 700px) {
    .all, 
    .sub {
        display: none !important;
    }
}

.sub > td {
    padding: 0 !important;
}

/* Shrink More Button */
@media all and (max-width: 400px) {
    .table .showMob {
        min-width: 45px;
    }
}


/****************************************
                          Table Fixes
****************************************/

/* Removes Fixed height */
.table caption {
    height: auto;
    min-height: 32px;
}

/****************************************
         Upcoming Matches Table
****************************************/

@media all and (max-width: 800px) {

    /* Main Container */
    .upcomingMatchesCon .matchLineup {
        background-color: #E8E8E8;
    }

    /* Match Teams & Match VS */
    body .upcomingMatchesCon .matchLineup li .matchTeam,
    body .upcomingMatchesCon .matchLineup li .matchVs {
        width: 90%;
        float: right;
    }

    /* Match Time & Match Statistics Link*/
    body .upcomingMatchesCon .matchLineup li .matchTime,
    body .upcomingMatchesCon .matchLineup li .matchStatLink {
        width: 50%;
        background-color: #F0F0F0;
    }

    /* Match VS */
    .upcomingMatchesCon .matchLineup li .matchVs p {
        text-indent: 57px;
    }

    /* Sub Table Stats (Forms ect) */
    .upcomingMatchesCon .matchLineup li .lineupStats ul {
        width: 100%;
    }

    .upcomingMatchesCon .matchLineup li .lineupStats ul li {
        height: auto;
    }

}


/****************************************
                                Footer
****************************************/

@media all and (max-width: 480px) {
    footer {
        text-align: center;
    }
}