/* defaults */

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url("/Fonts/MaterialIcons-Regular.eot"); /* For IE6-8 */
    src: local('Material Icons'), local('MaterialIcons-Regular'), url("/Fonts/MaterialIcons-Regular.woff2") format('woff2'), url("/Fonts/MaterialIcons-Regular.woff") format('woff'), url("/Fonts/MaterialIcons-Regular.ttf") format('truetype');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px; /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
}

.clear {
    clear: both;
    height: 0px;
}

html, body {
    border: 0px;
    padding: 0px;
    margin: 0px;
}

sup, sub {
    font-size: 0.5em;
}

a img {
    border: none;
}

h1 {
    color: #00aeef;
}

h2, #fancybox-title-inside {
    padding-top: 0;
}

h2 {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    color: inherit;
    display: block;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    font-size: 24px;
    font-weight: 300;
    line-height: normal;
    overflow: hidden;
    -webkit-transform-origin: 149px 48px;
    -ms-transform-origin: 149px 48px;
    transform-origin: 149px 48px;
    margin-top: 16px;
}

/* Overrides */

/* Login Box */

.mdl-card-login {
    -webkit-box-shadow: 15px 15px 15px 0px rgba(0,0,0,0.38);
    -moz-box-shadow: 15px 15px 15px 0px rgba(0,0,0,0.38);
    box-shadow: 15px 15px 15px 0px rgba(0,0,0,0.38);
}

    .mdl-card-login .mdl-card__title {
        background-color: #00aeef;
    }

/* Fix for weird formatting bug that seems to only effect my copy of Edge*/
.mdl-cell {
    margin: 7px;
}

.youtube-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.youtube-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 98%;
    height: 98%;
    margin: 1%;
}

a {
    color: #00aeef;
}

@media screen and (min-width: 1025px) {
    .mdl-layout__header-row {
        padding-left: 20px;
        margin-right: -20px;
    }
}

.mdl-button--raised.mdl-button--colored {
    background-color: #00aeef !important;
}

.mdl-layout__header-row .mdl-navigation__link {
    color: rgb(0,0,0);
}

#Menu2_menu_container .mdl-button {
    color: rgba(255,255,255, 0.87);
}

#Menu2_menu_container ul, #Menu2_menu_container ul li {
    padding: 0px;
    line-height: 30px;
}

#Menu2_menu_container .mdl-menu a {
    color: rgb(0,0,0);
    text-decoration: none;
    display: block;
    padding: 10px;
}

.mdl-textfield__input {
    padding: 2px;
}

select {
    background-color: #dddddd;
    padding: 2px;
}

.mdl-layout__header {
    background-color: #00aeef;
}

.mdl-card-login span.heading, header span.heading {
    color: #ffffff !important;
    font-size: large;
}

    header span.heading a {
        color: #ffffff !important;
        font-size: large;
        text-decoration: none;
    }

.mdl-layout__drawer {
    border-right: 1px solid #333333;
}

    .mdl-layout__drawer .mdl-layout-title {
        padding: 16px;
        background-color: #333333;
        color: #ddd;
    }



    .mdl-layout__drawer .mdl-navigation {
        padding-top: 0px;
    }

    .mdl-layout__drawer .mdl-navigation {
        background-color: #666;
        color: #000;
    }


        .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
            color: #eeeeee;
        }

            .mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
                background-color: #555555;
            }

.mdl-data-table {
    position: static;
}
/* Fixes bug in chrome based brwosers versions */

.mdl-menu__item a {
    padding-top: 20px;
}

.mdl-menu__item {
    line-height: none;
    height: none;
}

body.mdl-color--grey-100 .mdl-layout .mdl-cell .mdl-card .mdl-card__supporting-text .fake-label {
    color: #00aeef !important;
    font-size: 12px;
    left: 4px;
}


/* Logo */

a.logo {
    width: 270px;
    height: 54px;
    background-image: url(../Images/logo.png);
    position: relative;
    background-repeat: no-repeat;
    z-index: 500;
    background-size: 100% 100%;
    display: block;
    text-indent: -9999px;
}


/* Front Page */

.message-card .mdl-card__supporting-text {
    min-height: 8em;
}

.leftcolumn .mdl-card .message-tabs p {
    margin-top: 16px;
}


.master-banner {
    width: 106%;
    height: 30vw;
    overflow: hidden;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    margin: -8px;
    margin-bottom: 0px;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    display: block;
}

    .master-banner:after {
        content: "";
    }

    .master-banner .banner-video:poster {
        width: 106%;
        height: 30vw;
        background-size: cover;
        background-repeat: no-repeat;
    }

#banner-video {
    object-fit: cover;
    width: 100% !important;
    height: auto !important;
}


@media screen and (max-width: 1024px) {
    h1 {
        font-size: 40px;
        line-height: 1.2;
    }
}


.mdl-layout {
    overflow: hidden;
    overflow-y: hidden;
}

.message-card {
    float: right;
    width: 30%;
    margin-top: 2%;
}

/* error message styles */

#divMessage {
    color: red;
    text-align: center;
    font-size: 1.4em;
}

.mdl-textfield select#to {
    border-bottom: 1px solid red;
}



/* column styles */

.leftcolumn {
    margin-top: 3em;
}

    .leftcolumn .mdl-card__title, .leftcolumn h2 {
        color: #fff;
        margin-bottom: 0px;
        background-color: #aaa;
    }

    .leftcolumn .mdl-card__supporting-text {
        padding-left: 0px;
        padding-right: 0px;
        width: 100%;
        padding-bottom: 0px;
        padding-top: 0px;
    }

        .leftcolumn .mdl-card__supporting-text > * {
            padding-left: 16px;
            padding-right: 16px;
            margin-top: 0px;
        }

        .leftcolumn .mdl-card__supporting-text > p {
            margin-top: 16px;
        }


        .leftcolumn .mdl-card__supporting-text h2 {
            margin-bottom: 0px;
            margin-top: 0px;
            background-color: #aaa;
            padding: 16px;
            color: #fff;
            display: block;
        }

    .leftcolumn .mdl-card__title h2 {
        background-color: transparent;
    }

    .leftcolumn ul, .mdl-card__supporting-text ul {
        list-style-type: none;
        margin-left: -16px;
        margin-right: -16px;
        margin-top: 0px !important;
        margin-bottom: 0px;
        padding: 0px;
        background-color: #ddd;
    }

    .leftcolumn ul, div.newslist {
        margin-top: 0px !important;
    }

        .leftcolumn ul li {
            overflow: auto;
            padding: .5em;
            font-weight: bold;
        }

            .leftcolumn ul li a {
                color: #00aeef;
                text-decoration: none;
                font-weight: bold;
            }

            .leftcolumn ul li:nth-child(even) {
                background-color: #eee;
            }



@media (max-width: 840px) {
    .message-card {
        margin-top: 0px;
    }
}


@media (max-width: 479px) {
    .leftcolumn {
        margin-top: 0em;
    }
}


h1, h2, h3, h4 {
    /* clear:both;    */
}

/* end left column styles */


/* News Styles */

.news_title {
    margin-bottom: 0px;
}

.news_image {
    float: left;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-top: 1em;
}

.news_video {
    float: left;
    padding-right: 10px;
    padding-top: 10px;
    padding-left: 200px;
}

.news_date {
    margin-top: 0px;
    font-weight: bold;
}


/* Fixture Styles */


.fixturescontent {
    height: 210px;
    overflow: auto;
}

.fixtureitem {
    padding-bottom: 10px;
}


.fixtureitem_description {
    font-weight: bold;
    color: #00aeef;
}

.fixtureitem_time {
    font-weight: bold;
}

.fixtures-table {
    width: 96%;
    margin: 0 auto;
}


/* Session3 Styles */

#session3container {
    height: 280px;
}

    #session3container h2 {
        height: 20px;
        padding-bottom: 10px;
        color: #00aeef;
        border-bottom: 2px #00aeef solid;
    }

#sessions h4 {
    color: #333333;
    font-weight: bold;
    padding: 10px;
    margin: 0px;
    border-bottom: 1px dotted #555555;
}

#sessions #today {
    margin-right: 10px;
}

#sessions #today, #sessions #tomorrow {
    float: left;
    width: 328px;
    border: 1px dotted #555555;
}

.sessionscontent {
    height: 170px;
    overflow: auto;
    padding: 10px;
}


.sessionitem_description {
    font-weight: bold;
    color: #00aeef;
}

.sessionitem {
    margin-bottom: 4px;
}

/**/

#bbc {
    background: url(../Images/bbc.jpg) no-repeat left 0;
    height: 30px;
}






/* End News List Styles */

.noborders, .noborders td, .noborders tr, .noborders th {
    border: none;
}

.highlight {
    background-color: #FF9D9D;
    border-bottom: #F30 1px solid;
    border-top: #F30 1px solid;
    padding: 4px 10px
}


#fp_bbcnews .rssRow img {
    float: left;
    border: 2px solid #00aeef;
    padding: 1px;
    margin-right: 4px;
    height: 55px;
    margin-top: 4px;
}

#fp_bbcnews .rssBody li {
    background: none;
    list-style: none;
    /*height:210px;*/
    overflow: auto;
}

#fp_bbcnews .rssBody ul {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    background: none;
    list-style: none;
}

#fp_bbcnews .rssBody .fp_item_date {
}

#fp_bbcnews .rssBody h4 {
    color: #00aeef;
    margin-top: 0px;
    padding-top: 0px;
}

/* Resturant Menu Styles */

ul.listholder {
    list-style-type: none;
    list-style-position: outside;
    margin: 0px;
    padding: 0px;
    margin-bottom: 10px;
    float: left;
    margin-right: 10px;
    min-height: 220px;
    background-color: #F2F2F2;
}

    ul.listholder li {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
        width: 310px;
        /*background-color:#DEDEDC;*/
        background-color: #F2F2F2;
        padding: 4px;
    }

        ul.listholder li.alt {
            background-color: #F2F2F2;
        }

        ul.listholder li.title {
            font-weight: bold;
            padding-bottom: 4px;
            margin-bottom: 10px;
            border-bottom: 1px solid #555555;
        }

        ul.listholder li div.name {
            margin: 0px;
            width: 150px;
            float: left;
        }

        ul.listholder li div.price {
            margin: 0px;
            width: 50px;
            float: right;
            text-align: right;
        }

        ul.listholder li .box {
            width: 200px;
            height: 170px;
            display: none;
        }

        ul.listholder li .green {
            background-color: #0C0;
        }

        ul.listholder li .orange {
            background-color: #F93;
        }

        ul.listholder li .red {
            background-color: #F00;
        }

        ul.listholder li .box .title {
            font-weight: bold;
            width: 120px;
            color: #000;
            padding: 3px;
            border: 1px solid #333;
            margin: 5px;
            float: left;
            text-indent: 8px;
        }

        ul.listholder li .box .amount {
            font-weight: bold;
            text-indent: 5px;
            width: 45px;
            color: #000;
            padding: 3px;
            border: 1px solid #333;
            margin-top: 5px;
            margin-left: 2px;
            margin-bottom: 5px;
            margin-right: 5px;
            float: right;
        }

        ul.listholder li .box .legend {
            width: 188px;
            height: 20px;
            margin: 5px;
            border: 1px solid #333;
        }

            ul.listholder li .box .legend p {
                float: left;
                margin-top: 2px
            }

        ul.listholder li .square {
            width: 10px;
            height: 10px;
            float: left;
            margin: 5px;
        }

/* calendar styles */

.calwrap div {
    padding-left: 0px !important;
    padding-right: 0px !important;
    width: 100%;
}

.calendar {
    width: 100.1%;
    margin: 0px;
    border-spacing: 0px;
    border-collapse: collapse;
    padding: 0px;
    overflow: hidden;
}

    .calendar table {
        border: none;
        padding: 0px;
        margin: 0px;
        border-collapse: collapse;
        background-color: #00aeef;
    }

        .calendar table td {
            background-color: #00aeef;
            font-size: 1em;
            color: #fff;
        }

            .calendar table td a {
                color: #fff;
            }

    .calendar tr {
        background-color: #F2F2F2;
        padding: 0px;
        margin: 0px
    }

    .calendar td {
        padding: 4px;
        margin: 0px;
        border: none;
        font-size: 0.9em;
        text-align: center;
    }

    .calendar th {
        padding: 4px;
        margin: 0px;
        background-color: #DEDEDC;
        border: none;
        font-size: 0.9em;
        color: #00aeef;
        text-align: center;
    }



.networkimg {
    text-align: center;
    float: left;
}

.staffimg {
    text-align: center;
    float: left;
    width: 110px;
}

.teacherimg {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    float: left;
    width: 25%;
}

.teachergallerythumb {
    text-align: center;
    width: auto;
    padding: 0px;
    margin: 0px;
    min-height: 200px;
}

.headteacherimg {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: auto;
    height: auto;
    min-height: 200px;
}

.teacherimg {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    float: left;
    width: 25%;
}

.teachergallerythumb {
    text-align: center;
    width: auto;
    padding: 0px;
    margin: 0px;
}

.headteacherimg {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: auto;
    height: auto;
}

.gallerythumb {
    text-align: center;
    float: left;
    width: 150px;
    padding: 0px;
    margin: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background-color: #00aeef;
    color: #fff;
    float: left;
}

    .gallerythumb img {
        width: 100%;
        height: auto;
        color: #fff;
    }

    .gallerythumb a {
        text-decoration: none;
        color: #fff;
    }

        .gallerythumb a span {
            padding: 4px;
        }


/* contact form styles */

.contactform. .reserveform {
}

.contactform .row, .reserveform .row {
    width: 660px;
    padding: 10px;
    height: 20px;
}

    .contactform .row .label, .reserveform .row .label {
        width: 150px;
        float: left;
        font-weight: bold;
    }

    .contactform .row .input, .reserveform .row .input {
        width: 490px;
        float: left;
    }

        .contactform .row .input input, .contactform .row .input textarea {
            width: 100%;
        }

        .reserveform .row .input input, .reserveform .row .input textarea {
            width: 100%;
        }

        .contactform .row .input textarea {
            height: 100%;
        }

    .contactform .row .button, .reserveform .row .button {
        width: 100px;
        float: right;
        padding-right: 12px;
        padding-top: 10px;
    }

#divVideo {
    width: 100%;
    padding: 0px;
    margin: 0 auto;
    margin-top: 20px;
    z-index: 0;
}

#html5vid {
    z-index: 3;
}

#fancybox-content {
}

.sitemap_container {
    float: left;
    width: 25%;
}

#flashmap {
    background-image: url(/Uploads/images/pages/map.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    width: 800px;
    height: 600px;
}

#flashtraffic {
    background-image: url(/Uploads/images/pages/traffic.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    width: 670px;
    height: 540px;
}

#content img {
    margin-bottom: 10px;
}

.memo {
    background-color: #00aeef;
    color: #ffffff;
    padding: 4px;
}

/* No Script Menu */

#noscriptmenu {
    padding: 10px;
    padding-top: 4px;
    margin: 0px;
    background-color: #00aeef;
    height: 22em;
    line-height: 1.6em;
}


    #noscriptmenu ul { /* all lists */
        list-style: none;
        padding: 0px;
        margin: 0px;
        color: #ffffff;
        float: left;
        list-style-type: none;
    }

        #noscriptmenu ul li {
            float: left;
            padding-left: 1px;
            padding-right: 4px;
            font-weight: bold;
            list-style-type: none;
        }

            #noscriptmenu ul li a {
                color: #ffffff;
                padding: 2px;
                padding-left: 4px;
                padding-right: 4px;
            }

                #noscriptmenu ul li a.current {
                    background-color: #555555;
                }


            #noscriptmenu ul li ul { /* all lists */
                float: none;
                list-style: none;
                padding: 0px;
                padding-bottom: 10px;
                margin: 0px;
                border-top: 1px dotted #999999;
                padding-top: 2px;
            }

                #noscriptmenu ul li ul li {
                    float: none;
                    border: none;
                    font-weight: normal;
                }

                    #noscriptmenu ul li ul li ul li {
                    }


/* PT Star Student Styles */

.ptstarstudentcontainer {
    padding: 10px;
    border: 1px solid #00aeef;
    position: relative;
}

    .ptstarstudentcontainer .prevbutton {
        display: none;
        margin: 0px;
        padding: 0px;
        background-color: #00aeef;
        color: #ffffff;
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        width: 10%;
        cursor: pointer;
        height: 50%;
        font-weight: bold;
    }

    .ptstarstudentcontainer .nextbutton {
        display: none;
        margin: 0px;
        padding: 0px;
        background-color: #00aeef;
        color: #ffffff;
        position: absolute;
        top: 50%;
        right: 0px;
        bottom: 0px;
        width: 10%;
        cursor: pointer;
        height: 50%;
        font-weight: bold;
    }

        .ptstarstudentcontainer .nextbutton span, .ptstarstudentcontainer .prevbutton span {
            position: absolute;
            top: 35%;
            padding: 0px;
            padding-left: 4px;
            margin: 0 auto;
            width: 20px;
        }

    .ptstarstudentcontainer ul {
        overflow: hidden;
        list-style: none;
        margin: 0px;
        padding: 0px;
        width: 100%;
    }

        .ptstarstudentcontainer ul li {
            list-style: none;
            margin: 0px;
            padding: 0px;
            display: none;
        }

            .ptstarstudentcontainer ul li.visible {
                display: block;
            }

            .ptstarstudentcontainer ul li p {
                padding: 0px;
                margin: 0px;
            }

            .ptstarstudentcontainer ul li .student {
                display: block;
                text-align: left;
                font-weight: bold;
                margin-bottom: 4px;
            }

            .ptstarstudentcontainer ul li .comment {
                display: block;
                text-align: center;
                font-style: italic;
                margin-bottom: 4px;
            }

            .ptstarstudentcontainer ul li .teacher {
                display: block;
                text-align: right;
            }

ul.jobslist {
    list-style: none;
    padding: 0px;
    margin: 0px;
    padding-bottom: 10px;
}

    ul.jobslist li {
        list-style: none;
        padding: 0px;
        margin: 0px;
        margin-bottom: 10px;
    }

        ul.jobslist li div {
            width: 100%;
        }

.tweet_list {
    padding: 0px;
    margin-bottom: 10px !important;
}

.tweet {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.leftcolumn .twitterfeed {
    margin-left: -16px;
    margin-right: -16px;
}

/* Fixture Results Styles */

.results-container {
    width: 950px;
    padding: 0;
}

    .results-container .result {
        width: 440px;
        padding: 10px;
        margin-bottom: 10px;
        margin-right: 10px;
        float: left;
        border: 1px dotted #555555;
        height: 180px;
    }

    .results-container .left-col {
        background-color: #00aeef;
        height: 100%;
        width: 120px;
        float: left;
        overflow: hidden;
        color: #ffffff;
    }

    .results-container .right-col {
        float: left;
        width: 310px;
        padding-left: 10px;
        overflow: auto;
    }

    .results-container .left-col .image, .results-container .left-col .image img {
        width: 120px;
        height: 80px;
    }

    .results-container .right-col .desc {
        font-weight: bold;
        color: #00aeef;
    }

    .results-container .left-col .date, .results-container .left-col .time, .results-container .left-col .years, .results-container .left-col .staff {
        padding-left: 10px;
        padding-right: 10px;
    }

.bigtwitterlink a {
    line-height: 100%;
    text-align: right;
}

/* Snow Fall Styles */
.collectonme {
    margin: 80px auto;
    background: red;
    width: 80%;
    text-align: center;
    color: #fff;
}

/* Poll Styles */

.poll .options input {
    float: left;
}

.poll ul {
    list-style: none;
}

    .poll ul li {
        list-style: none;
        float: left;
        width: 400px;
        padding: 10px;
        border: 1px solid #00aeef;
        margin: 10px;
        position: relative;
    }

        .poll ul li input {
            float: left;
            padding: 0px;
            width: 20px;
            margin: 0px;
        }

        .poll ul li label {
            float: right;
        }

.pollrow {
    width: 370px;
    height: 180px;
    float: left
}


    .pollrow img {
        width: 120px;
        height: 180px;
        float: left;
        padding-right: 10px;
    }

.poll .votes {
    color: #ffffff;
    background-color: #00aeef;
    width: 6em;
    height: 1.6em;
    bottom: 0px;
    position: absolute;
    right: 0px;
    padding: 2px;
    text-align: center;
}

.sportssceneitem_image, .curriculumnewsitem_image, .newsitem_image, .starstudentitem_image {
    border: 2px solid #00aeef;
}

/* Crappy Home Screen Box - Rob's Idea */

.robsbox {
    border: 2px solid #00aeef;
}

/* Alt News Styles */

.alt_itemlist {
    font-size: small;
}

.alt_itemlist {
    background-color: #ffffff;
    font-size: small;
    height: 156px;
}

#alt_newscontainer {
    text-align: justify;
    margin-bottom: 10px;
    border-bottom: 1px dotted #555555;
}


.alt_newsitem_content {
    float: right;
    width: 450px;
    height: 130px;
}

.alt_newsitem_body {
    clear: both;
}

.alt_newsitem_canvas {
    padding-left: 10px;
    width: 205px;
    height: 156px;
    image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;
}

.alt_newsitem_image {
    margin-left: 0px;
    width: 195px;
    height: 131px;
    float: left;
    padding-bottom: 10px;
}

.alt_newsitem_header {
    float: left;
    font-weight: bold;
    color: #333333;
    width: 320px;
    padding-bottom: 10px;
}

.alt_newsitem_date {
    float: right;
    font-weight: bold;
    color: #555555;
}

.alt_newsitem_footer {
    padding-top: 10px;
    text-align: right;
    margin-bottom: 20px;
    clear: both;
}

.severeweather {
    color: #fff;
    text-align: center;
    background-color: #00aeef;
    padding: 20px;
    font-size: 1.6em;
    line-height: 1.2em;
}

    .severeweather h2 {
        border-color: #fff !important;
        color: #fff !important;
    }

.weatherpad {
    padding: 10px;
}

/* Career Calendar Styles */

#careercal table {
    border: 1px solid #00aeef;
    border-collapse: collapse;
    width: 100%
}

    #careercal table td {
        vertical-align: top;
    }

    #careercal table td {
        font-weight: bold;
        color: #fff;
        background: #600;
        border: 1px solid #00aeef;
        padding: 0px;
    }

        #careercal table td a {
            display: block;
            width: 98%;
            background-color: Silver;
            color: #600;
            margin: 1px;
            text-align: left;
        }

        #careercal table td div.booked {
            display: block;
            width: 98%;
            background-color: Silver;
            color: #000;
            margin: 1px;
            text-align: left;
        }

        #careercal table td div.old {
            display: block;
            width: 98%;
            background-color: Silver;
            color: #fff;
            margin: 1px;
            text-align: left;
        }

    #careercal table table td a {
        display: block;
        width: 100%;
        background-color: #600;
        color: #fff !important;
        margin: 0px;
    }

    #careercal table th {
        font-weight: bold;
        color: #fff;
        background: #600;
        border: 1px solid #00aeef;
    }

    #careercal table tr {
        background-color: #00aeef;
    }

#careercal .daycontent {
    width: 100%;
    color: #00CCFF;
    background-color: #fff;
    vertical-align: top;
    height: 100px;
    overflow: auto;
}

.careercalday {
    background-color: #DEDEDC !important;
    color: #600 !important;
}

.careercaltop tr td a {
    text-align: center !important;
}


.calendaritemcontent div {
    margin-bottom: 10px !important;
}


/* faux buttons */

.fauxbutton {
    padding: 10px;
    color: #fff !important;
    background-color: #00aeef;
    margin-top: 0px;
    margin-bottom: 8px;
    display: block;
    text-align: right;
    font-weight: bold;
}

.fauxcontainer {
    width: 672px;
    padding-top: 4px;
    padding-bottom: 4px;
}

    .fauxcontainer .fauxbutton {
        display: block;
        float: right;
        width: 290px;
        padding: 5px;
        background-color: #00aeef;
        color: #fff;
        text-align: center;
        font-weight: bold;
    }

    .fauxcontainer .fauxlabel {
        float: left;
        width: 360px;
        padding: 5px;
        background-color: #eedddd;
        color: #333;
        text-align: left;
        font-weight: bold;
    }

/* Weather Warning Styles */

a.weather, div.weather {
    display: block;
    line-height: 1.6em;
    color: #fff;
    padding: 0px;
    background-image: url(/Uploads/images/pages/excalmation.png);
    background-repeat: no-repeat;
    font-size: 1.4em;
    text-align: center;
    margin-bottom: 10px;
    position: relative;
}

a.green, div.green {
    background-color: #00FF00;
    background-image: url(/Uploads/images/pages/thumbs-up.png);
}

a.amber, div.amber {
    background-color: #FF9900;
}

a.red, div.red {
    background-color: #FF0000;
}

.weatherdate {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    font-size: 1em;
    text-align: center;
    background-color: rgba(0,0,0,0.3);
}

#divWeatherPopUp .weatherdate {
    font-size: 0.8em;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.teacherthumb {
    border: solid;
    border-width: 1px;
    border-color: white;
    width: 120px;
    height: 120px;
}

.headteacherthumb {
    border: solid;
    border-width: 1px;
    border-color: white;
    width: 120px;
    height: 120px;
}

.lightboximg {
    Width: 250px;
    float: left;
    padding-right: 20px;
}

.lightboxsize {
    width: 750px;
    height: auto;
    overflow: auto;
}

.doctable {
    border: 1px;
    width: 100%;
    vertical-align: middle;
}

.tblcol1 {
    width: 50%;
}

.tblcol2 {
    width: 30%;
    vertical-align: top;
}

.tblcol3 {
    width: 20%;
    vertical-align: top;
    text-align: right;
}


.toggle {
    color: rgb(204, 102, 0);
}

.toggle_hide {
    margin: 2px;
    margin-top: 4px;
    background-color: rgba(0,0,0,0.1);
    padding: 10px;
    width: auto;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.close_toggle {
    display: block;
    float: right;
    padding-right: 2px;
}

/* Page Tabs (fixtures, front page) */

.pagetabs ul {
    list-style: none;
    margin: 10px 0px 0px 0px;
    padding: 0px;
}

    .pagetabs ul li {
        list-style: none;
        margin: 0px;
        padding: 0px 0px 0px 0px;
        float: left;
    }

        .pagetabs ul li a {
            list-style: none;
            margin: 0px;
            padding: 10px 20px 10px 20px;
            float: left;
            border: 1px solid #dddddd;
            border-bottom: none;
            color: #999999;
        }

        .pagetabs ul li:first-child a {
            -webkit-border-top-left-radius: 4px;
            -moz-border-radius-topleft: 4px;
            border-top-left-radius: 4px;
        }

        .pagetabs ul li:last-child a {
            -webkit-border-top-right-radius: 4px;
            -moz-border-radius-topright: 4px;
            border-top-right-radius: 4px;
        }


        .pagetabs ul li a.selected {
            background-color: #dddddd;
            color: #000000;
        }

        .pagetabs ul li a:hover {
            background-color: #eeeeee;
        }

        .pagetabs ul li a.selected:hover {
            background-color: #dddddd;
        }

.pagetabs .pagetabscontent {
    border: 1px solid #dddddd;
    padding: 0px;
    overflow: hidden;
    -webkit-border-radius: 4px;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius: 4px;
    -moz-border-radius-topleft: 0;
    border-radius: 4px;
    border-top-left-radius: 0;
}

    .pagetabs .pagetabscontent .fixturescontent {
        overflow-x: hidden !important;
    }

    .pagetabs .pagetabscontent #fixtures #today, .pagetabs .pagetabscontent #fixtures #tomorrow, .pagetabs .pagetabscontent #fixtures #results {
        width: 206px !important;
        overflow-x: hidden !important;
    }

    .pagetabs .pagetabscontent .pagetab {
        height: 330px;
    }

        .pagetabs .pagetabscontent .pagetab#tab_session3 div.inner {
            font-size: 0.8em;
        }

            .pagetabs .pagetabscontent .pagetab#tab_session3 div.inner ul {
                padding-left: 10px;
            }

                .pagetabs .pagetabscontent .pagetab#tab_session3 div.inner ul li {
                    padding-left: 10px;
                    list-style: disc outside;
                    float: none;
                }

    .pagetabs .pagetabscontent #tab_session3.pagetab div.inner table td {
        vertical-align: top;
    }

        .pagetabs .pagetabscontent #tab_session3.pagetab div.inner table td p {
            padding: 0px;
            margin: 0px;
        }

#tab_session3 {
    overflow-y: auto;
}

.dayname {
    background-color: #cccccc;
    color: #000000;
}

/* required field */

.required {
    background-color: lightpink;
}


/* table fix */

.mdl-data-table {
    white-space: normal;
}

    .mdl-data-table td {
        white-space: normal;
    }

/*social toolbar*/

.social {
    position: fixed;
    top: 90px;
    right: 24px;
    z-index: 2;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

    .social a {
        display: block;
    }

/* Admin */

#ContentPlaceHolder1_txtSearch {
    margin: 16px;
}

/* News */

.news-card-square.mdl-card {
    width: 100%;
    height: 300px;
}

.news-card-square > .mdl-card__title {
    background-color: #00aeef;
}

.blog-card-square.mdl-card {
    width: 100%;
    height: 300px;
}

.blog-card-square > .mdl-card__title {
    background-color: #00aeef;
}

.bro-card-square.mdl-card {
    width: 100%;
}

.bro-card-square > .mdl-card__supporting-text {
    height: 360px;
    overflow: auto;
}

.bro-card-square > .mdl-card__title {
    background-color: #00aeef;
    color: #fff;
}

.cun-card-square.mdl-card {
    width: 100%;
    height: 300px;
}

.cun-card-square > .mdl-card__title {
    background-color: #00aeef;
}

.sts-card-square.mdl-card {
    width: 100%;
    height: 300px;
}

.sts-card-square > .mdl-card__title {
    background-color: #00aeef;
}

.sps-card-square.mdl-card {
    width: 100%;
    height: 300px;
}

.sps-card-square > .mdl-card__title {
    background-color: #00aeef;
}