body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #555;
	margin: 0;
	padding: 0;
	background-color: #e0e0e0;
}
#page {
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
	background-color: #ffffff;
	box-shadow: 0px 0px 3px #999;
}
/* Text */

h1 {
	margin: 0 0 1em 0;
	padding: 20px 0 10px 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 2em;
	color: #000000;
}
p {
	margin: 0;
	padding: 0;
}
a {
	color: #9a0000;
	text-decoration: none;
}
a:visited {
	color: #b50c21;
}
a:hover {
	text-decoration: underline;
}
/*page*/
#page {
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	background-color: #fff;
	box-shadow: 0px 0px 3px #999;
}
#page:after {
	clear: both;
	content: "";
	display: block;
}
/* Header*/
header {
	background: #fff;
	position: relative; /*padding-top:50px; for using fixed top bar*/
}
header a.centrallogo {
	position: absolute;
	display: block;
	width: 350px;
	height: 150px; /* links are normally inline elements*/
	background: url(../images/centralAxislargelogo.gif) no-repeat 0 0;
	background-size: contain; /*this ensures the logo is scaled to fit the width and height properties*/
	top: 15px; /*65px if use fixed top bar*/
	left: 20px;
}
header a.centrallogo span { /*this is here to hide the words Central Recruitment*/
	display: none;
	background-color: #ffffff;
}
nav {
	font-weight: 600;
}
/*Main menu*/
#topNavigation {
	background-color: #FFFFFF;
	top: 0px;
	left: 0px;
	right: 0px;
	padding: 80px 0 0 0;
	width: 100%;
	height: 50px;
}
#topNavigation::after {
	content: '';
	display: block;
	clear: both;
}
a.mobile_menu {
	width: 32px;
	height: 32px;
	background: url(../images/icon_menu.svg) no-repeat 0 0;
	background-size: contain;
	display: none;
}
#hamburger_menu {
	height: 32px;
	background-color: #9DAcbf;
	display: none;
	padding-left: 92%;
	color: #fff;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-bottom: 0px;
}
#secondNavigation, #secondNavigationLogin {
	background-color: #9DAcbf;
	top: 0px;
	left: 0px;
	padding: 0px 0 0 0;
	width: 100%;
	position: relative;
	z-index: 2;
	font-weight: normal;
}
#secondNavigationLogin {
	height: 35px;
}
#secondNavigation::after, #secondNavigationLogin::after {
	content: '';
	display: block;
	clear: both;
}
#secondNavigation ul, #secondNavigationLogin ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#secondNavigation > ul, #secondNavigationLogin > ul {
	padding-left: 0px;
}
#secondNavigation > ul > li, #secondNavigationLogin > ul > li {
	float: left;
}
#secondNavigation ul li a {
	display: inline-block; /*will behave like graphics*/
	color: #fff;
	padding: 10px 20px;
	text-decoration: none;
	width: 100px;
	text-align: center;
}
#secondNavigation ul:first-child > li:first-child a {
	width: 20px;
}
#secondNavigation li {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
}
#secondNavigation ul li:hover {
	background-color: #52769a; /*top menu when moved off*/
}
#secondNavigation ul li:hover > ul {
	display: block;
}
#secondNavigation ul li a:visited {
	color: #fff;
}
#secondNavigation ul li a:hover {
	background-color: #ccc; /*top menu hover over back colour*/
}
#secondNavigation ul ul {
	position: absolute;
	top: 100%;
	background-color: rgba(6,6,6,.65); /*dropdown menu back colour*/
	display: none;
	color: #fff;
}
#secondNavigation ul ul li {
	position: relative;
	width: 200px; /*second navigation width*/
}
#secondNavigation ul ul li a {
	font-size: 1em;
	font-weight: 500;
	color: #fff;
	border-left: 1px solid #d4d4d4;
	border-bottom: 1px solid #fff;
	/*border-top:1px solid #fff;*/
	width: 180px; /*underline?*/
	padding: 10px 0px 15px 20px;
	text-align: left;
}
#secondNavigation ul ul li a:hover {
	width: 180px; /*underline when hovering*/
	background-color: #024166; /*#b50c21;*/
	color: #fff;
}
#secondNavigation ul ul ul {
	left: 100%;
	top: 0px;
}
#secondNavigation > li > a {
	width: auto;
	padding: 10px 20px 15px 20px;
}
#secondNavigation ul.sub {
	position: absolute;
	z-index: 3;
	padding: 0px;
	border-bottom: 1px solid #000;
}
#secondNavigation ul.sub li a {
	padding: 10px 20px;
	text-align: left;
	width: 100%;
	min-width: 200px;
	color: #000;
	background-color: #fff;
	border-left: 1px solid #666;
}
#secondNavigation ul.sub li a:hover {
	color: #fff;
	background-color: #52769a;
	/*#024166;
                 #52769a;*/
	border-left: 1px solid #000;
	padding: 0px 20px;
	text-align: left;
	width: 100%;
}
#secondNavigation ul.sub li:hover {
	background: #52769a;
}
/*individual page css*/
#breadcrumbs p {
	margin: 0;
	padding: 15px 0 15px 5%;
	color: #555;
	background-color: #efefef;
}
#breadcrumbs a {
	text-decoration: none;
	color: #555;
}
#breadcrumbs a:hover {
	color: #024166;
	text-shadow: 1px 1px #ccc;
}
#breadcrumbs .logindetails {
	float: right;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: inline;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
}
#breadcrumbs .logindetails a /*signout*/ {
	text-decoration: none;
	font-weight: bold;
	color: #9DAcbf;
}
#mainContent {
	width: 100%;
	margin: 0;
	padding: 0;
	padding-bottom: 20px;
}
#mainContent h1 {
	border-top: none;
	font-size: 1.6em;
	margin-top: 15px;
	padding-bottom: 0px;
	margin-left: 5%;
}
#mainContent h2 {
	color: #666;
	font-size: 1.25em;
	padding: 20px 0 0 10px;
	margin-bottom: 5px;
}
#mainContent h3 {
	color: #9a0000;
	font-size: 1.15em;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-left: 10px;
}
#mainContent h4 {
	margin: 30px 0 10px 10px;
	font-size: 1em;
	color: #9a0000;
}
#mainContent p {
	margin: 0px 35px 15px 10px;
	padding: 0;
}
#mainContent p {
	margin: 0px 35px 15px 5%;
}
footer {
	clear: both;
	padding: 0px;
	height: 73px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	width: 100%;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666666;
	background-color: #FFFFFF;
}
footer p {
	/**font-family: Verdana, Arial, Helvetica, sans-serif;**/
        /**font-size: 1em;**/
	font-weight: normal;
	/**color: #666666;**/
	margin: 0px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 40px;
	background-color: #FFFFFF;
	font-size: 100%;
}
footer a {
	text-decoration: underline;
	color: #666666;
}
footer .leftalign {
	/**font-family: Verdana, Arial, Helvetica, sans-serif;**/
	font-size: .75em;
	color: #999;
	float: right;
	text-decoration: none;
	padding-right: 30px;
}
/*Login*/
#Login {
	border-top: 1px #eaeaea solid;
	border-bottom: 1px #cccccc solid;
	border-left: 2px #eaeaea solid;
	border-right: 1px #eaeaea solid;
	background-color: #F5F5F5;
	width: 40%;
	margin: 50px auto 0 auto;
}
#Login p {
	padding-left: 20px;
	padding-top: 5px;
}
.title {
	color: #fff;
	font-size: 150%;
	font-weight: bold;
	display: block;
	padding: 15px 0px 15px 20px;
	margin: 0px 0px 0px 0px;
	border-top: 5px #9DAcbf solid;
	border-bottom: 2px #ccc solid;
	background-color: #9DAcbf;
}
.loginLabel {
	padding-right: 10px;
	padding-top: 5px;
	margin: 0;
	text-align: center;
	border: 1px solid #ccc;
	border-radius: 5px 0 0 5px;
	background-color: #d4d4d4;
	height: 20px;
	vertical-align: top;
}
#signInButton {
	border-top: 1px #999 solid;
	padding: 15px 0px 0px 0px;
	margin: 30px 20px 0px 20px;
}
#signInButton p {
	margin: 0px 0px 20px 0px;
}
.loginBoxes {
	margin-left: 5%;
}
.asptextboxLogin {
	width: 240px;
	border: 1px solid #ccc;
	height: 25px;
	border-radius: 0 5px 5px 0;
	padding: 0;
	margin: 0;
	margin-bottom: 5px;
	padding-left: 10px;
}
.aspvalidator, #litNoAccount {
	color: #b50c21;
	font-weight: normal;
	background-color: #efefef;
	margin-bottom: 10px;
	margin-right: 10px;
	padding: 0px;
	font-size: .95em;
}
#Selection1000 {
	width: 90%;
	background-color: #efefef;
	border: 1px solid #cccccc;
	padding: 20px 0px 0px 0px;
	margin: 0px auto 0px auto;
	overflow: hidden;
}
#Selection1000 p {
	margin: 10px 0px 20px 25px;
}
.submitButton, .createButton, .deleteButton, .printButton {/*login page, create timesheet page*/
	font-family: 'Open sans', sans-serif;
	background-color: #9DAcbf;
	font-size: 1em;
	color: #fff;
	font-weight: bold;
	padding: 10px 20px;
	border: none;
	display: block;
	margin: 15px 0px 20px 25px;
	transition: background-color .5s ease;
}
.createButton, .deleteButton, .printButton {
	margin-left: 0px;
	margin-bottom: 0px;
}
.deleteButton, .printButton {
	display: inline-block;
	margin-top: 20px;
}
.submitButton:hover, .createButton:hover, .deleteButton:hover, .printButton:hover {
	cursor: pointer; /*box-shadow: 0 4px 8px 0 rgba(181, 12, 33, 0.2), 0 6px 20px 0 rgba(181, 12, 33, 0.19);**/
	background-color: #024166;
	text-decoration: none;
}
.asplabel {
	text-align: left;
	padding-bottom: 10px;
	padding-right: 5px;
	margin-left: 25px;
	width: 140px;
	display: inline-block;
}
.asplabelTsht {
	text-align: left;
	width: 140px;
	display: inline-block;
}
.asplabelTshtNo, .asplabelTshtDetails {
	text-align: left;
	width: 250px;
	display: inline-block;
	margin-top: 20px;
	font-weight: bold;
}
.asplabelTshtDetails {
	margin-top: 5px;
	font-weight: normal;
}
.asplabelTshtNo {
    margin-bottom:20px;
    margin-left:25px;
}
#Information {
    margin-bottom:20px;
}
.nobullet {
	list-style-type: none;
    margin-left:25px;   
    padding-left:0px;
}
.day {
	font-weight: bold;
}
.asptextbox, .asptextboxTsht {
	font-family: 'Open Sans', sans-serif;
	font-size: 100%;
	color: #333333;
	margin-bottom: 5px;
	margin-right: 10px;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	padding: 0px;
	height: 25px;
}
.aspdropdown {
	font-family: 'Open Sans', sans-serif;
	font-size: 95%;
	color: #333333;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	padding: 0px;
}
#gridViewSpacer {
	margin-bottom: 250px;
}
#gridViewSpacerTshts {
	margin-bottom: 50px;
}
#gridViewDiv { /*to create a scroll bar for mobile mode*/
	width: 93%;
	overflow: auto;
	padding: 0px;
	margin: 0px auto 0px auto;
}
#gridViewDivTst { /*to create a scroll bar for mobile mode*/
	width: 100%;
	overflow: auto;
	padding: 0px;
	margin: 0px auto 0px auto;
}
/*gridview styling*/
.gridViews {
	width: 100%;
	font-size: 90%;
	border: 1px solid #d4d4d4;
	margin: 0px auto 20px auto;
	padding: 20px 0px 10px 20px;
}
.gridViewsB {
	width: 95%;
	font-size: 90%;
	border: 1px solid #d4d4d4;
	margin-left: 15px;
}
.gridViewsHeaderStyle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 95%;
	color: #ffffff;
	background-color: #9DAcbf; /*#999*/
	text-align: left;
}
.gridViewsAlternatingRowStyle {
	background-color: #eaeaea;
	border-style: solid;
	border-color: #cccccc;
	border-width: 1px;
}
.gridViewsPagerStyle {
	color: #b50c21;
	background-color: #fff;
	text-align: center;
}
.gridViewsRowStyle {
	text-align: Left;
}
.gridViewsFooterStyle {
	font-weight: bold;
	background-color: #fff;
	text-align: center;
}
#MainContent_gvTimesheets a {
	color: #b50c21;
}

@media screen and (max-width: 970px) {
#Login {
	width: 60%; /*50% of width of page*/
}
}

@media screen and (max-width: 700px) { /*this media query is mainly for the footer that breaks down at thsi size*/
header a.centrallogo {
	height: 100px;
}
#Login {
	width: 80%; /*50% of width of page*/
}

}

@media screen and (max-width: 600px) { /*this media query is mainly for the footer that breaks down at thsi size*/
    #mainContent {
        width: 100%;
    }

        #mainContent p {
            width: 90%;
            margin-left: 20px;
        }

        #mainContent h1, h2, ul {
            margin-left: 20px;
        }

        #mainContent ul {
            margin-left: 50px;
        }

    #secondNavigation {
        padding: 0px;
        background-color: #9DAcbf;
        height: 0px;
        overflow: hidden;
    }

    header a.centrallogo {
        height: 100px;
    }

    a.mobile_menu {
        display: block;
    }

    #hamburger_menu {
        display: block;
    }

    #secondNavigation ul, #secondNavigation ul ul {
        display: block;
        position: static;
    }

    #secondNavigation > ul {
        padding: 0;
    }

        #secondNavigation > ul > li {
            float: none;
            margin-top: 0px;
        }

    #secondNavigation ul li:hover {
        background: none;
    }

    #secondNavigation ul li a {
        width: auto;
        display: block;
        margin: 4px 10px;
        padding: 6px 15px 6px 12px;
        border-bottom: 1px solid rgba(255,255,255, .25);
        text-align: left;
        background-color: #52769a;
    }

        #secondNavigation ul li a:hover {
            background-color: rgba(255,255,255, .2);
        }

    #secondNavigation ul ul {
        background: none;
    }

        #secondNavigation ul ul li a {
            margin-left: 30px;
        }

        #secondNavigation ul ul ul li a {
            margin-left: 60px;
        }

    #secondNavigation ul:first-child > li:first-child a, #secondNavigation ul:first-child > li:last-child a, #secondNavigation ul:first-child > li:last-child > ul > li a { /* home button not as wide as others*/
        width: auto;
    }

    #secondNavigation li {
        border: 0px;
    }

    #secondNavigation ul ul li { /* width of dropdown menus*/
        position: relative;
        width: auto;
    }

        #secondNavigation ul ul li a {
            font-size: .95em;
            color: #fff;
            width: auto;
            padding: 10px;
            text-align: left;
            border: 1px solid rgba(255,255,255, .25);
            background-color: #024166;
        }

            #secondNavigation ul ul li a:hover {
                width: auto;
                background-color: rgba(6,6,6,.65);
                color: #fff;
                border-right: 1px solid #fff;
            }

    #secondNavigation ul ul ul {
        border-top: none;
    }

        #secondNavigation ul ul ul li a:hover {
            background-color: #b50c21;
        }

    #breadcrumbs p {
        padding-left: 20px;
    }

    #breadcrumbs .logindetails {
        display: block;
        float: none;
        padding: 0px;
        margin: 10px 0px 0px 0px;
    }

    .asptextbox, .aspvalidator {
        display: inline-block;
        margin-left: 25px;
    }

    .aspvalidator {
        margin-left: 0px;
    }

    .submitButton {
        margin-top: 0px;
    }

    #mainContent ul.nobullet {
        margin-left: 25px;
        padding-left: 0px;
    }
}

@media screen and (max-width: 520px) {
header a.centrallogo {
	width: 100%; /*set so that the logo takes up the entire width of the header*/
	background-position: center;
	left: 0px;
}
#login {
	float: none;
}
#login a {
	border-right: 1px solid #e0e0e0;
	border-left: none;
}
#topNavigation ul {
	list-style: none;
	margin: 0 0 15px 0;
	padding: 0;
	text-align: center;
	float: none;
	padding-top: 20px;
}
#topNavigation ul li {
	display: inline-block;
	float: none;
	margin: 10px 0 0px 0;
	height: 100%;
}
#hamburger_menu {
	padding-left: 90%;
}
.footerAddress p {
	text-align: center;
	padding-left: 0px;
	margin-left: 0px;
}
.asptextboxLogin {
	width: 175px;
}
#Login {
	width: 95%; /*50% of width of page*/
}
}