/************************************************************************
* 
* Body and Column format
*
************************************************************************/
/* body refers is the background of the whole page, including master page, margins, and footer */
body {
    margin-left: 70px;
    margin-right: 70px;
    width: auto;
    /*position: relative;*/
    color: teal; /*text colour*/
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: medium;
    top: 0px;
    left: 0px;
    background-color: whitesmoke;
}


/************************************************************************
* 
* Poster and footer format
*
************************************************************************/
/*The Poster picture is at the top of the .body div
    An image that falls in the margins however is in the .body division
    For some reason the name poster h2 blocks out the image 
    so h2 is renamed h4  and the image reappears behind the text!
    If poster is a background image occupying full screen width then make poster approx 1206 px wide.
    Theoretically it should be 70 + 1023 + 70 px wide = 1163px but this shows a narrow right margin.
    By trial and error 1206 is good. Make height = 180px.
    If the pixel number is greater than this then only part of the image is displayed.
    I have observed that on uploading to the website the new poster image and text can take a few hours to appear.

 */


#poster {
    background: url(images/poster_deckImages7.jpg);
    background-repeat: no-repeat;
    height: 200px;
    background-color: purple;
}


.posterH1 {
    font-size: xx-large;
    font-weight: bold;
    color: green;
}

.posterH2 {
    color: green;
}

#footer {
    width: 100%; /*ensures the horizontal line spans 'body'*/
    color: #C89F3D;
    float: left; /* ensures the horizontal line is visible*/
    text-align: center;
    font-size: small;
}





/*  *****************************
 *  column display
 *   *****************************/


.col10 {
    float: left;
    width: 10%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col20 {
    float: left;
    width: 20%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col30 {
    float: left;
    width: 30%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col40 {
    float: left;
    width: 40%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}


.col50 {
    float: left;
    width: 50%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col60 {
    float: left;
    width: 60%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col70 {
    float: left;
    width: 70%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col80 {
    float: left;
    width: 80%;
    position: relative;
    /*background-color: whitesmoke;*/
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col90 {
    float: left;
    width: 90%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

.col100 {
    float: left;
    width: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto; /*displays scroll bars if height and width exceeded*/
    padding: 1%;
}

.posterCol30 { /*posterCol30 does not revert to width100% in phone or tablet*/
    float: left;
    width: 30%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
    /*background-color: lightcoral;*/
}

.posterCol70 { /*posterCol70 does not revert to width100% in phone or tablet*/
    float: left;
    width: 70%;
    position: relative;
    top: 0px;
    left: 0px;
    overflow: auto;
    padding: 1%;
}

/************************************************************************
* 
* Body Heading format
*
************************************************************************/

h1 {
    font-size: large;
    margin: 5px 0 5px 0;
    color: white;
    height: 30px;
    /* background-color:teal;    */
}

h2 {
    font-family: Handlee;
    font-size: x-large;
    color: darkviolet
    /*font-size: inherit;
    font-style: normal;
    margin: 5px 0 5px 0;
    color: yellow;*/
    /* background-color:teal; */
    /*height: 50px;
    background: url(images/headerBackground.jpg) repeat-x;
    background-size: cover;*/
}

h3 {
    font-size: inherit;
    color: slateblue;
    /*text-decoration: none;*/
}

h4 {
    color: blue;
}

h5 {
    background-color: aquamarine;
    margin: auto auto auto auto;
}

.contrastingText {
    color: purple; /*text colour*/
    background-color: #e2f8f8;
}




.clear2column /*prevents other Divs appearing to the right or left 
    but only below the command */ {
    margin: 0;
    padding: 0;
    line-height: 0;
    font-size: 0px;
    height: 0px;
    clear: both;
}

.rightAlignSmall {
    text-align: right;
    /*color:gold;*/
    font-size: small;
}

/************************************************************************
* 
* BOM weather details format
*
************************************************************************/

.minTemp {
    font-size: larger;
    font-weight: bold;
    color: blue;
    /*background-color:lightblue;*/
    text-align: center;
}

.maxTemp {
    font-size: larger;
    font-weight: bold;
    color: red;
    /*background-co lor:orangered;*/
    text-align: center;
}

.ajaxTabHeader {
    font-size: larger;
    font-weight: bold;
}

/************************************************************************
* 
* Hyperlink colours
*
************************************************************************/

a {
    text-decoration: none;
}

    a:link {
        color: #8A3700; /* background:#123456 */
    }

    a:visited {
        color: #542100;
    }

    a:hover {
        /*text-decoration: underline;*/
        text-decoration: none;
    }

    a:active {
        text-decoration: none;
        color: #000000;
    }
/*hyperlink image for facebook on default.aspx*/
.hyperlinkimage img {
    width: 80px;
    height: 25px;
}
/************************************************************************
* 
* Row styles
*
************************************************************************/

.alternatingRowStyle {
    background-color: #ccccff;
}

.defaultRowStyle {
    background-color: #CCFF99;
}

.selectedRowStyle {
    background-color: yellow;
}

.editRowStyle {
    background-color: lightgoldenrodyellow;
}



/************************************************************************
* 
* Table format (used by tables, DataList)
*
************************************************************************/
table {
    border-collapse: collapse;
    border-spacing: 5px 5px;
    border-style: none;
    
}
td {
    vertical-align: top;
    text-align: left;
    padding-left: 1%;
    padding-right: 1%;
}

th {
    font-size: medium;
    font-weight: normal;
    color: blue;
    text-align: center;
}
.RoomAvailabilityFormat {
    padding-left: 0px;
    padding-right: 0px;
    /*font-size:smaller;*/
    border: none;
    border-spacing: 0px 0px 0px 0px;
}

    .RoomAvailabilityFormat th {
        font-size: smaller;
        padding-left: 0px;
        padding-right: 0px;
    }

    .RoomAvailabilityFormat td {
        font-size: smaller;
        padding-left: 0px;
        padding-right: 0px;
       
    }


/************************************************************************
* 
* Table in panels format, where panel content is entered on a web page, eg Fees and Charges
* where cell borders are displayed.
*
************************************************************************/
.panelTable {
    border: 1px solid teal;
    margin-bottom: 10px;
    border-collapse: collapse;
}

    .panelTable th {
        /*font-weight: bold;*/
        /*font-size: larger;*/
        /*color: teal;*/
        vertical-align: middle;
        text-align: center;
        border: 1px solid teal;
    }

    .panelTable td {
        /*font-weight: normal;*/
        /*color: teal;*/
        vertical-align: middle; /*this does not work*/
        text-align: center;
        border: 1px solid teal;
        /*color:red;*/
    }

/************************************************************************
* 
* Error message and Information message format
*
************************************************************************/

.errorMsg {
    /*font-size: inherit;*/
    font-weight: normal;
    color: red;
    background-color: gainsboro;
}

.infoMsg {
    font-weight: normal;
    color: purple;
    background-color: gainsboro;
}


/************************************************************************
* 
* Input text boxes, buttons, checkboxes, lines, selected item
*
************************************************************************/

input[type="text"] {
    color: purple; /*text colour*/
    background-color: #e2f8f8;
    font-size: 100%;
}
input[type=checkbox] {
    transform: scale(1.0);
}


input[type=submit] { /* button */
    color:brown;
}
.NextPageButton {
    color: green;
}

.GoBackButton {
    color: blue;
}

.CancelChangesButton {
    color: red;
}
select { /*Selected row in a drop down list */
    font-size: 100%;
    color: purple; /*text colour*/
    background-color: #e2f8f8;
}
hr {
    border-color: blue;
}



/************************************************************************
* 
* Gridview formatting for committee reports
*
************************************************************************/

/*.GridView {
    width: 100%;
    background-color: #fff;
    padding-left: 1%;
    padding-right: 1%;
    border: solid 1px #525252;
    border-collapse: collapse;
    text-align: center;
}*/
    /* tf is table footer */
/*.GridView tf {
        /*padding-left: 1%;
        padding-right: 1%;
        color: #fff;
        background: #424242 url(grd_head.png) repeat-x top;
        border-left: solid 1px #525252;
        font-weight: bold;
    }*/

    /*.GridView td { 
        padding-left: 1%;
        padding-right: 1%;
        border: solid 1px #c1c1c1;
        color: #717171;
    }*/

    /*.GridView th {
        padding-left: 1%;
        padding-right: 1%;
        color: #fff;
        background: #424242 url(grd_head.png) repeat-x top;
        border-left: solid 1px #525252;
        font-weight: bold;
    }*/

    /*.GridView .alt {
        background: #fcfcfc url(grd_alt.png) repeat-x top;
    }*/

    /*.GridView .pgr {
        background: #424242 url(grd_pgr.png) repeat-x top;
    }

        .GridView .pgr table {
            margin: 5px 0;
        }

        .GridView .pgr td {
            padding-left: 1%;
            padding-right: 1%;
            border-left: solid 1px #666;
            font-weight: bold;
            color: #fff;
            line-height: 12px;
        }

        .GridView .pgr a {
            color: #666;
            text-decoration: none;
        }

            .GridView .pgr a:hover {
                color: #000;
                text-decoration: none;
            }

.gridViewButton input {
    font-size: 100%;
}*/

/************************************************************************
* 
* DataList 
*
************************************************************************/

/*.DataList {
    width: 100%;
    background-color: #fff;
    margin: 5px 0 10px 0;
    border: solid 1px #525252;
    border-collapse: collapse;
    text-align: left;
    font-size: 12px;
}

    .DataList tf {
        padding: 4px 2px;
        color: #fff;
        background: #424242 url(grd_head.png) repeat-x top;
        border-left: solid 1px #525252;
        font-size: 12px;
        font-weight: bold;
    }

    .DataList td {
        padding: 2px;
        border: solid 1px #c1c1c1;
        color: #717171;
    }

    .DataList th {
        padding: 4px 2px;
        color: #fff;
        background: #424242 url(grd_head.png) repeat-x top;
        border-left: solid 1px #525252;
        font-size: 12px;
        font-weight: bold;
    }

    .DataList .alt {
        background: #fcfcfc url(grd_alt.png) repeat-x top;
    }

    .DataList .pgr {
        background: #424242 url(grd_pgr.png) repeat-x top;
    }

        .DataList .pgr table {
            margin: 5px 0;
        }

        .DataList .pgr td {
            border-width: 0;
            padding: 0 6px;
            border-left: solid 1px #666;
            font-weight: bold;
            color: #fff;
            line-height: 12px;
        }

        .DataList .pgr a {
            color: #666;
            text-decoration: none;
        }

            .DataList .pgr a:hover {
                color: #000;
                text-decoration: none;
            }*/