/* CSS Reset */
* { margin:0; padding:0;}
html, body
{
    margin:0;
	padding:0;
    background-color: #FFFFFF; /*#cbd1d7;*/
    color: #292c35;
    font-family: Tahoma, Arial, Helvetica, sans-serif, Perpetua;
    height:100%;
    font-size: 12pt;
    -webkit-text-size-adjust:none;
}

td, tr, table, a, span, label, div, body {
        font-family: Tahoma, Arial, Helvetica, sans-serif!important;
    } 
    
span
{
    font-size: 10pt;
    font-weight: bold;
}

strong
{
    font-weight: normal;
}
    
h1
{
    font-size: 20pt;
    font-weight: normal;
}
h1 strong
{
    font-weight: normal;
}

.h1large
{
    font-size: 20pt;
}
.h1large strong
{
    font-weight: bold;
}

h2
{
    font-size: 16pt;
    font-weight: normal;
}
h2 strong
{
    font-weight: normal;
}
h3
{
    font-size: 12pt;
    padding: 3px 0 3px 0;
}
h3 strong
{
    font-weight: bold;
}

.h3small
{
    font-size: 10pt;
    /*border-bottom: 2px dashed #dddddd;*/
}

.h3smallgrey
{
    font-size: 10pt;
    color: #555555;
    /*border-bottom: 2px dashed #dddddd;*/
}

h4
{
    color: #555555;
    font-size: 10pt;
}

.h5larger
{
    font-size: 10pt;
}
.h5large
{
    font-size: 10pt;
}
.h5largegrey
{
    font-size: 10pt;
    color: #555555;
}
.h5grey
{
    font-size: 8pt;
    color: #555555;
    margin: 5px 0 3px 0;
}

.divider
{
    border-top: 1px solid #aaaaaa;
    width: 100%;
    margin: 10px 0 10px 0;
}
    
.topbar
{
    width: 100%;
    height: 114px;
    background-color: #000000;
    border-bottom: 1px solid #4a4a52;
}
.topbarmiddle
{
    width: 980px;
    margin: 0 auto;
}

.topbar2
{
    width: 100%;
    height: 40px;
    background-color: #292c35;
}
.topbar2menucontainer
{
    width: 940px;
    margin: 0 auto;
}

.sportsclubbookinglogo
{
    float: left;
    margin: 10px 0 0 20px;
    width: 450px;
    height: 90px;
    background: url('../Images/probookingslogolarge.jpg') no-repeat 0 0;
}
.bannertitletext
{
    float: right; 
    color: #ffffff;
    font-size: 20pt;
    font-weight: normal;
    margin: 40px 20px 0 0;
    font-family: Segoe UI, Segoe UI Light;
}

.middlecontent
{
    width: 100%;
    min-height: 500px;
    background: #ffffff url('../Images/bg.jpg') repeat-x 0 0;
    padding-top: 20px;
}

.maincontent
{
    width: 980px;
    margin: 0 auto;
    min-height: 460px;
    border: 1px solid #aaaaaa;
    background-color: #ffffff;
}

.pagecontent
{
    padding: 20px;
}

.footer
{
    width: 940px;
    margin: 0 auto;
    padding: 10px 20px 0 20px;
    height: 40px;
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    background-color: #292c35;
    color: #ffffff;
}

.footer a, .footer a:visited
{
    color: #ffffff;
    font-size: 10pt;
    text-decoration: none;
}
.footer a:hover
{
    text-decoration: underline;
}

.loginboxcontainer
{
    margin: 0 auto;
    margin-top: 20px;
    border: 2px solid #e2e2e2;
    width: 400px;
}
.loginbox
{
    padding: 10px;
    border: 1px solid #dddddd;
}

.contactformheader
{
    margin: 0 auto;
    width: 460px;
    padding:5px;
    background-color: #eeeeee;
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    border-top: 1px solid #aaaaaa;
}
.contactform
{
    margin: 0 auto;
    width: 460px;
    /*height: 405px;*/
    padding:5px 5px 10px 5px;
    background-color: #f8f9fc;
    border: 1px solid #aaaaaa;
}
.contactformcontainer
{
    padding:15px;
}
.contactformmessagesent
{
    padding: 30px;
    color: #35a607;
    font-size: 16pt;
}

.aboutusimage
{
    margin: 20px 0 0 200px;
}

.onlinebookingimage
{
    float: right;   
    border: 3px solid #aaaaaa;
    margin-top: 20px;
}

.onlinebookingtext
{
    width: 500px;   
}

.howitworksbox
{
    width: 100%;
    min-height: 500px;
    background: url('../Images/cloud.jpg') no-repeat 0 0;
}

.howitworkstext
{
    float: left;
    width: 450px;
    margin: 50px 0 0 460px;
}

/* ###############################################################
                            HOMEPAGE
############################################################### */

.homeimage
{
    margin: 20px 0 0 100px;
}

.findoutmorelink
{
    color: #4BC31F;
    font-size: 12pt;
    text-decoration: none;
}
.findoutmorelink:hover
{
    color: #3FB214;
    text-decoration: underline;
}
.findoutmorelink:visited
{
    color: #4BC31F;
}

.findoutmorebutton
{
    color: #ffffff;
    background-color: #4BC31F;
    display: block;
    width: 180px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #33A808;
    text-decoration: none;
    padding: 10px 0 0 0;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.findoutmorebutton:visited
{
    color: #ffffff;
    background-color: #4BC31F;
    border: 1px solid #33A808;
    text-decoration: none;
}
.findoutmorebutton:hover
{
    color: #ffffff;
    background-color: #3FB214;
    border: 1px solid #33A808;
    text-decoration: none;
}

.homepagetopbanner
{
    width: 100%;
    padding-bottom: 20px;
    background-color: #f8f9fc;
    border-bottom: 1px solid #aaaaaa;
}
.homepagetopbannerleft
{
    float: left;
    width: 450px;
    padding: 30px 0 0 30px;
}
.homepagetopbannerleft h1
{
    font-size: 20pt;
    font-weight: 200;
}
.homepagetopbannerleft p
{
    font-size: 16pt;
    font-weight: 200;
    color: #586C88;
}
.homepagetopbannerright
{
    float: left;
}

.threeboxcontainer
{
    
}

.threeboxheaderlinkgreen
{
    color: #ffffff;
    background-color: #4BC31F;
    display: block;
    width: 298px;
    height: 28px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #33A808;
    text-decoration: none;
    padding: 10px 0 0 0;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.threeboxheaderlinkgreen:visited
{
    color: #ffffff;
    background-color: #4BC31F;
    border: 1px solid #33A808;
    text-decoration: none;
}
.threeboxheaderlinkgreen:hover
{
    color: #ffffff;
    background-color: #3FB214;
    border: 1px solid #33A808;
    text-decoration: none;
}

.threeboxheaderblue
{
    color: #ffffff;
    background-color: #1F51C3;
    display: block;
    width: 298px;
    height: 28px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #082EA8;
    text-decoration: none;
    padding: 10px 0 0 0;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.reservationloginlink
{
    color: #222222;
    background-color: #efefef;
    display: block;
    width: 278px;
    height: 28px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #1F51C3;
    text-decoration: none;
    padding: 7px 0 0 0;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.reservationloginlink:hover
{
    color: #222222;
    background-color: #e2e2e2;
}

.reservationloginlink:visited
{
    color: #222222
}

.threeboxcontents
{
    height: 374px;
    width: 278px;
    padding: 10px;
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
}

.threeboxleftbox
{
    float: left;
    width: 300px;
    height: 445px;
    background-color: #f8f9fc;
}

.threeboxmiddlebox
{
    float: left;
    width: 300px;
    height: 445px;
    margin: 0 20px 0 20px;
    background-color: #f8f9fc;
}
.threeboxrightbox
{
    float: left;
    width: 300px;
    height: 445px;
    background-color: #f8f9fc;
}

.demobox
{
    
}
.demoboxheader
{
    color: #ffffff;
    background-color: #1F51C3;
    display: block;
    height: 28px;
    vertical-align: middle;
    border: 1px solid #082EA8;
    text-decoration: none;
    padding: 10px 0 0 30px;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;   
}
.demoboxheader h2
{
    padding: 0;
    margin: 0;
    font-size: 12pt;
    font-weight: bold;
}
.demoboxcontent
{
    height: 109px;
    padding: 20px 10px 10px 10px;
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
}

.arrangedemobutton
{
    color: #ffffff;
    background-color: #4BC31F;
    display: block;
    width: 250px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #33A808;
    text-decoration: none;
    padding: 10px 0 0 0;
    font-size: 12pt;
    font-weight: bold;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.arrangedemobutton:visited
{
    color: #ffffff;
    background-color: #4BC31F;
    border: 1px solid #33A808;
    text-decoration: none;
}
.arrangedemobutton:hover
{
    color: #ffffff;
    background-color: #3FB214;
    border: 1px solid #33A808;
    text-decoration: none;
}

/* ###############################################################
                            END HOMEPAGE
############################################################### */

/* ###############################################################
                            ERROR PAGE
############################################################### */

.errorpagemainbox
{
    margin: 0 auto;
    margin-top: 50px;
    padding: 170px 0 0 50px;
    width: 550px;
    height: 230px;
    background: url(../Images/probookingserrorbg.png) no-repeat 0 0;
    color: #FFFFFF;
    font-family: Tahoma, Arial, Helvetica, sans-serif!important;
}

.errorpagemainboxtext
{
    width: 500px;
    text-align: center;
    font-size: 10pt;
}
.errorpagemainboxtext a
{
    color: #FFFFFF;
    font-size: 14pt;
}
.errorpagemainboxtext a:hover
{
    color: #FFFFFF;
}
.errorpagemainboxtext a:visited
{
    color: #FFFFFF;
}

.errorpagemainboxtext h1
{
    color: #ffffff;
    font-size: 16pt;
    font-weight: bold;
}

/* ###############################################################
                            ERROR PAGE END
############################################################### */