/*

  Colours

    #ffa500   Light orange (h1, h2)
    #ff6400   Dark orange (title, border)
    #0080c0   Dark blue (title)
    #006699   Links
    #15A300   Links-hover, column titles
    #ffffaa   Highlight background


*/

html{ overflow: -moz-scrollbars-vertical; }



body{
	background-image:url(images/bg/global.png);
	background-repeat:repeat-x;
	background-color:#fff;
	/*font-family:Trebuchet MS, Helvetica, sans-serif;*/
	font-family: Verdana, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:12px;
	letter-spacing:0px;
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5{font-family:Arial,Helvetica,Sans-serif; color:#000; }

h1, h2{ color:#FFA500; font-weight:normal; }

h1{ font-size:24pt; }
h2{ font-size:20pt; }
h3{ font-size:16pt; }
h4{ font-size:14pt; }
h5{ font-size:12pt; }
h6{ font-size:10pt; }

img{ border:0; }

.marked{
  background: #b0b0b0 !important;
}

.outer{  
  clear:both;
  margin-left:auto;
  margin-right:auto;
}

@media (min-width: 960px) {
  .outer {
    width:960px;
  }
  .desktopview {
	  display: inline;
  }
  .desktopviewblock {
	  display: block;
  }
  .mobileview {
	  display:none;
  }
  .mobileviewtable {
	  display:none;
  }
  .desktopviewtable {
	  display:table-cell;
  }
}

@media (max-width: 959px) {
  .desktopview {
	  display: none;
  }
  .mobileviewblock {
	  display:block;
  }
  .mobileview {
	  display:inline;
  }
  .mobileviewtable {
	  display:table-cell;
  }
  .desktopviewtable {
	  display:none;
  }
  .booking-cell-user {
	  font-size: xx-small;
  }
  .booking-cell-notes {
	  font-size: xx-small;
  }
}

.header{
  padding-left:0px;
  padding-top:0px;
  padding-right:0px;
}

.nav-box{
  margin-right: 10px;
  width:340px;
  float:right;
  margin-top:20px;
  font-weight:bold;
  color:#006699;
  font-size:12px;
  text-align:right;
}

.nav-box p.normal{
	font-weight:normal;
	font-size:90%;
	color:#000;
	margin:8px 0;
}

.mid-section{
  padding-top:20px;
}

.content_area{
  padding-left:5px;
  padding-right:5px;
  padding-top:12px;
  margin-top:24px;
}

.sub_nav{
  float:left;
  width:180px;
  margin-right:25px;
  margin-top:15px;
}

.noticebox{
  background-color:#FFFFBF;
  border:1px solid #808080;
  padding:5px;
  text-align:center;
}
.noticebox h1{
  border-bottom:1px solid #808080;
  font-size:95%;
}

.small{ font-size:90%; }

.footer{
  text-align:center;
  font-size:12px;
  padding-top:10px;
  clear:both;
}

.footer #footer{
  border-top:1px solid #ff6400;
  margin-top:24px;
  padding-top:10px;
}

a{
  font-style:normal;
  color:#006699;
  text-decoration:none;
}

a:hover{
  font-style:normal;
  color:#55B10A;
  text-decoration:none;
}

a:visited:hover{
  font-style:normal;
  color:#15A300;
  text-decoration:none;
}

.style1{
	font-size:18px;
	font-weight:bold;
	color:#15a300;
}
.style2{
	color:#000000;
	font-weight:bold;
}

.ad_box{
  width:142px;
  height:342px;
  padding-top:5px;
  padding-left:19px;
  padding-right:19px;
  background-image:url(images/side_banner.gif);
  background-repeat:no-repeat;
  text-align:center;
}

.banner{
  font-size:10px;
  padding-left:5px;
  text-align:left;
}

.title{
	font-family:"gill sans mt", verdana, arial;
	font-size:24pt;
	font-weight:bold;
	letter-spacing:-3px;
	color:#006699;
}


.content_area ul li{
	margin:3px 0;
}


p.breadcrumbs{
	font-size:90%;
	font-weight:bold;
	margin:32px 0 0 0;
}





/**
 * Msgbox classes
 */

/* Base class */
p.msgbox{
	background-position:4px 4px;
	background-repeat:no-repeat;
	width:320px;
	color:#000;
	padding:4px 4px 4px 28px;
	border-width:1px;
	border-style:solid;
	font-size:8pt;
	max-width: 100%;
	box-sizing: border-box;
}
p.msgbox.large {
	width: 100%;
	max-width: 100%;
}
/* ERROR */
p.msgbox.error{
	background-image:url(i_error.png);
	background-color:#FBE6F2;
	border-color:#D893A1;
}
/*p.msgbox.error{
  background-image:url(i_error.png);
  color:red;
  border-width:0;
}*/
/* INFORMATION */
p.msgbox.info{
	background-image:url(i_info.png);
	background-color:#E6FBF2;
	border-color:#93D8A1;
}
/* EXCLAMATION */
p.msgbox.exclamation{
	background-image:url(i_exclamation.png);
	background-color:#FBE6F2;
	border-color:#D893A1;
}
/* QUESTION */
p.msgbox.question{
	background-image:url(i_help.png);
	background-color:#E6FBF2;
	border-color:#93D8A1;
}
/* NOTICE */
p.msgbox.notice{
	background-image:url(i_info.png);
	background-color:#ffffd5;
	border-color:#d9d991;
}





span.green, p.green{ color:#15A300; font-weight:bold; font-size:10pt; }

p span, dd span {background: #FFA;}
p span.red{ background:#FBE6F2; }


dl {margin-top: 8px;}
dt {font-size: 14px; font-weight: bold; margin-bottom: 2px;}
dd {margin-bottom: 12px;}

.column dt {color: #55B10A;}
.column dt, .column dd {font-size: 12px; line-height: 1.4; margin:0;}
.column dd {color: #333; font-size: 11px; margin:0 0 12px 0;}



/* Tableless form */
fieldset {border:1px solid #999; margin: 0 0px 24px 0; padding: 8px; }
legend {color: #999; font-size: 14px; font-weight: bold; padding: 0 4px;}




/**
 * Alternating table row colours (zebra tables)
 */
.tr0 td{ background:#F5F4EA; color:#000; }
.tr1 td{ background:#ffffff; color:#000; }

.zebra-table tbody tr:nth-child(odd) td {
	background:#F5F4EA; color:#000;
}
.zebra-table tbody tr:nth-child(even) td {
	background:#ffffff; color:#000;
}





/**
 * Table headings (<TD> tags with class 'h' = a <TH> tag :D)
 */
td.h{ font-weight:bold; border:0px; }
tr.heading td{ background:#D6DFF7; color:#000; }
tr.heading td.n, td.n{ background:#fff; }




/**
 * Icon bar on list pages above & below data
 */
p.iconbar{
	padding:0px 0px 0px 0px;
	margin:16px 0px 16px 5px;
	background:#fff;/*#f5f4ea;*/
	color:#000;
	font-weight:bold;
	font-size:105%;
	/*font-family:arial,helvetica,sans-serif;*/
}





div.column div.c{ margin:0; }
div.column div#c1{margin-right:10px;}
div.column div#c2{margin-left:10px;}

/* Forms */
input,select,textarea,file{
	font-family:Tahoma,verdana,arial,sans-serif;
  padding:0px;
  font-size:10pt;
}

select.list, input.text{
	width:128px;
}

tr.fsubmit td input{ width:64px; font-weight:bold; }

table.form td{ padding:6px; border-bottom:1px solid #c0c0c0; background-color:#f5f4ea; vertical-align:top;}
table.form td+td{ background-color:#fff;font-size:85% }
table.form td label{ font-weight:normal; }
table.form td label.required{ font-weight:bold; }
table.form input[type="checkbox"]{ /*margin:2px 0px;*/ margin-left:0px; vertical-align:middle; }
table.form tr.fsubmit td{background:#fff;color:#000;border:0px}
table.form tr.fsubmit td input{ font-weight:bold; padding:2px 10px }
table.form{ width:75%; min-width:400px; }
/*table.form input[type="text"],textarea,select{ border:1px solid #c0c0c0; padding:1px; }*/

tr.title td{ padding:4px;background:#D6DFF7; color:#000; font-size:10pt; letter-spacing:0; font-family:Tahoma; font-weight:bold; border-bottom:0px;}

.input-focus{ background-color:#F5F4EA; }

.cssform fieldset {
	padding-bottom: 12px;
}

.cssform .fieldset-description {
	margin-bottom: 12px;
}
.cssform .fieldset-description p {
	padding-left: 0;
	border: 0;
	height: auto;
}

.cssform p,
.cssform .input-group {
	/*width: 200px;*/
	clear: left;
	margin: 0;
	padding: 12px 0 0px 0;
	padding-left: 145px; /*width of left column containing the label elements*/
	border-bottom:0px solid #c0c0c0;
	height: 1%;
}

.cssform label{
	font-weight: bold;
	float: left;
	margin-left: -145px; /*width of left column*/
	width: 140px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.cssform label.ni{
	font-weight:normal;
	width:auto;
	margin:0 0 5px 0;
	float:none;
	display: block;
}

.cssform input[type="checkbox"]{
	margin:0;
}

.cssform label.required{ /*font-weight:bold;*/ }
.cssform label.required:after{ content:"*";color:red;font-weight:normal; }

.cssform div.submit{
  padding:8px 0 0 150px;
  border-top:1px solid #c0c0c0;
  margin-top:8px;
}

.cssform div.submit input{
	/* background-image:url(images/ui/bullet_disk.png);
	background-position:2px 50%;
	background-repeat:no-repeat; */
	padding:0px 4px;
}

.cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/
/*width: 180px;*/
}

.cssform textarea{
/*width: 250px;
height: 150px;*/
/*border:2px inset;*/
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

.cssform p.hint,
.cssform ul.hint {
  padding-top:1px;
  background:#fff;
  font-size:85%;
  color:#777;
  padding-left: 145px; /*width of left column containing the label elements*/
}

.cssform ul.hint {
	margin-left: 15px;
}

.cssform div.formfield{margin-left:150px;}


.cssform p.error span, span.error{ background:#FBE6F2; color:#000; padding:2px; line-height:150%;}
.cssform p.error span{ font-size:105%; }

p.hint span.error{font-size:100%;}


span.error{ padding:0; font-size:90%;}


.sidebox{
	border:1px solid #ff6400;
	background:#ffffef;
	padding:10px;
}

h5 {
	margin: 0 0 10px 0;
}

.cssform-stacked label {
	margin: 0 0 5px 0;
	padding: 0;
	display: block;
	float: none;
	width: auto;
}

.cssform-stacked .input-group,
.cssform-stacked input,
.cssform-stacked textarea,
.cssform-stacked select {
	margin: 0 0 5px 0;
	padding: 0;
	float: none;
	display: block;
}

.cssform-stacked .input-group {
	margin-bottom: 12px;
}




/* Gallery */
div.iconbox{
	height:180px;
	width:300px;
	border:1px solid #ccc;
	overflow:scroll;
	margin-left:5px;
}
div.g, div.g1{
	float:left;
	margin:0 8px 8px 0;
	width:22px;
	text-align:center;
	border:0px solid transparent;
}
div.g1{ background:#d894a1; border:0px solid #D893A1; }
div.g p, div.g1 p {
	margin:0;
	padding:0;
	text-align:center;
}




/* Image preview */
.border_b{
   border: 1px solid #000000;
}

.float{
   visibility: hidden;
   position: absolute;
   left: -3000px;
   z-index: 10;
}



table.bookings td{ font-size:90%;font-family:tahoma,verdana,sans-serif; padding:3px;}

table.bookings td.free{ background:#fff;border:1px solid #ccc; /*#D3E6CF;  /*#C7F2BC;*/ color:#000; }   /* Free period */
table.bookings td.static{ background:#E68A73; color:#fff; border:1px solid #E68A73; }   /* Timetabled lesson */
table.bookings td.staff{ background:#3082BF; color:#fff; border:1px solid #3082BF; }    /* Booked by staff */
table.bookings td.holiday{ background:#f6f6f6; color:#333; border:1px solid #ccc; }    /* Holiday */

table.bookings td.free a{ color:#00f;text-decoration:none; }
table.bookings td.free a:hover{ color:#f00;text-decoration:none; }

.button-empty {
	background: transparent;
	padding: 0;
	margin: 0;
	cursor: pointer;
	border: 0;
}

.booking-action {
	display: inline-block;
	margin: 4px 2px;
	font-size: 100%;
	color: inherit;
}

.booking-action:hover,
a.booking-action:hover {
	color: inherit;
}



.pagination {
	padding: 5px 0;
}

.pagination strong,
.pagination a {
	display: inline-block;
	padding: 5px;
}



.maintenance-wrapper {
	padding: 8px 0;
	background: #ffffaa;
}


.hidden {
	display: none;
}


.up-form .loading-notice {
	display: none;
}

.up-form.up-active .loading-notice {
	display: block;
}


.room-info {
	min-width: 300px;
}

.room-info .zebra-table {
	margin-bottom: 30px;
}

.room-photo {
	max-width: 420px;
}

	.room-photo img {
		display: block;
		width: 100%;
		max-width: 100%;
		height: auto;
	}