/* CSS for live system. */

/* admin page specific */

html
{
	font-size: 62.5%;
	background: #fffdf1 url("https://my.herrang.com/myherrang/images/yellow-bg-texture.png") repeat scroll 0 0;
}

table#powerlog .currentyear
{
	font-weight: bold;
	font-size: 1.2em;
}

table.dataTable thead th
{
	background-color: #c62128;
}

.discount-codes tr.Cancelled td
{
	color: #999999;
}	

table.discountcodes tr.Cancelled
{
	color: #999999;
	text-decoration: line-through;
}

table.discountcodes tr.Expired
{
	color: #999999;
	
}

table.discountcodes tr.Active td.used
{
	color: green;
}

table.discountcodes tr.Used td.used
{
	color: red;
}


#reportslist li a
{
	font-size: 1.2em;
	line-height: 2em;
	font-weight: bold;
}
.auditionresult
{
	border: 1px solid #dddddd;
	padding: 5px;
	margin: 10px;
	float: left;
}


.disabled, .ui-widget-content .disabled
{
	color: #999999;
}


#fastfeet
{
	margin-left:20px;
}
#fastfeet li
{
	list-style-type:disc;
}

#checkintable tr.course td 
{
	color: #999999;
}
#checkintable tr.course.checkingin td 
{
	color: #000000;
}

#checkinsummary
{
	margin-left: 20px;
}
#checkinsummary li
{
	list-style-type:disc;
}
.auditionpic 
{
	vertical-align:top;
}
table.audition td
{
	vertical-align: top;
}

div.auditionpic 
{
	width:80px;
	height:180px;
	position:relative;
	overflow: hidden;
	margin: 2px;
	padding: 2px;
	border: 1px solid #eeeeee;
	float: left;
}
tr.highlight td
{
	background: red;
}

tr.highlight2 td
{
	background: orange;
}

tr.highlight td a, tr.highlight2 td a
{
	color: white;
}
#userinfo_tabs
{
	margin-top: 4px;
}

.access label
{
	margin-left: 4px;
}

.accessarea
{
	float: left;
	border: 1px solid black;
	padding: 4px;
	margin: 2px;
}

#manageCourse
{
	margin-top: 8px;
}

.ui-button
{
	display: -moz-inline-stack;	
}
#PassThroughError
{
	margin-bottom: 15px;
}

#ratings span
{
	margin-left: 10px;
	display:block;
	float:left;
	height:1.2em;
}

.formcontainer label.paymentweektitle
{
	width: 2em;
}

#addnewnote
{
	
}
#addnewnote textarea, #addnewusernote textarea
{
	width: 400px;
	height: 100px;
	margin-bottom: 10px;
}
/***************************/



.howdoipayinfo
{
	
	border: 1px solid black;
	padding: 4px;
	margin: 4px auto;	
}

.formrowwrapper
{
	margin-top: 4px;
	margin-bottom: 4px;
}

.infobox
{
	margin: 8px;
	border: 1px solid black;
	padding: 4px;
	float: left;
}

.infobox h3
{
	
}

.infobox table.noborders, .infobox table.noborders td, .infobox table.noborders th  
{
	border: 0;
}
.infobox table.noborders th
{
	text-align: right;	
}
#description
{
	width: 600px;
	height: 100px;
}
.howdoipayinfo li
{
	margin-left: 20px;
	list-style-type: circle;
}
#PassThroughMessage
{
	margin-bottom: 10px;
}

#Dbg
{
	margin-top:300px;
}


.loginfo
{
	border-left: 2px solid black;
	border-bottom: 2px solid black;
	margin-bottom: 6px;
	margin-top: 3px;
	padding: 6px;
}

.waitlistchanged td
{
	background: #FFFF99;
}

.stats table
{
	float: left;	
	margin-right: 8px;
	margin-bottom: 8px;
}

li.even
{
	background: #dedede;
}

body
{
	font-family:Arial,Helvetica,sans-serif;
	margin:0px 10px;
	text-align:left;
	font-size: 1.6rem;
    line-height: 2.2rem;
	height: 100%;
	background: #fffdf1 url("https://my.herrang.com/myherrang/images/yellow-bg-texture.png") repeat scroll 0 0;
}

.mandatory
{
	font-weight: bold;
}

#header
{
	clear: both;
	/*height:245px;*/
	width:100%;
	margin:2rem auto 0.5rem;
	display: none;
}

#header img
{
	width:200px;
	margin-bottom: 0.5rem;
}

h2.search span
{
	font-size: 10pt;
	font-weight: normal;
}

.formcontainer label
{
	width: 20em;
	display: block;
	float: left;
	clear: left;
	margin-right: 8px;
}

.ui-dialog .formcontainer label
{
	width: auto;
}
.formcontainer div.caption label
{
	width: auto;
}

.formcontainer input.textinput
{
	width: 16em;
}
.formcontainer input.numericinput
{
	width: 4em;
}

.coursestatus
{
	border: 1px solid black;
	padding: 4px;
}
.coursestatus p
{
	margin: 0px auto;
}

.formcontainer p.info
{
	font-style: italic;
}

.formcontainer p.info strong
{
	font-style: normal;
	font-weight: bold;
}

.errortext, .infotext, .errorText, .errortext span
{
	color: red;
	font-weight: bold;
}

.successtext
{
	color: green;
	font-weight: bold;
}

.errorsummary, p.infotext
{
	border: 2px solid red;
	margin: 20px;
	padding: 10px;
	background: #FFEEEE;
	text-align: center;
}

.errorsummary h2
{
	margin: 0;
	margin-bottom:8px;
	padding: 0;
	text-align: center;
}

table, td, th
{
	border: 1px solid black;
	background: white;
}

.paymentnotification
{
	border: 1px solid black;
}

#coursetabs .weekdates
{
	text-align: left;
	margin-top: 0;
}

.partnerresult, .partnernameresult
{
	color: #229922;
	font-weight: bold;
}

td, th
{
	padding: 4px;
}

th
{
	background: #c62128;
	color:white;
}
th a {
    color: WHITE;
    text-decoration: UNDERLINE;
}

#overDiv td, #overDiv th
{
	padding: 1px;
}

#overDiv table table td
{
	padding: 4px;
	border: 0px;
}


.wide #layoutdiv
{
	margin-bottom: 10px;
	padding-bottom: 10px;
	width: 1180px;
	margin-left: auto;
	margin-right: auto;
}

#layoutdiv
{
	margin-bottom: 10px;
	padding-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	width: 1180px;
}



a.dhtmllink, .dhtmllink
{
	cursor: pointer;
	color:#c72027;
	text-decoration:none;
}

a
{
	color:#c72027;
	text-decoration:none;
}

.ui-state-error a
{
	text-decoration: underline;
}

h1
{
	/*color:#D21804;*/
	color:#c72027;
	font-family: "mostra-nuova",​Futura,​sans-serif;
	font-size: 28px;
	font-weight: bold;
}

#BodyTitleContainer
{
	font-size: 28px;
}

h1#BodyTitle
{
	font-size: 1.385em;
}

#sidetitle
{
	float: right;
	color: black;
	text-align: right;
	padding-top: 2px;
}

#sidetitle h1, #sidetitle h2
{
	margin:6px 6px 4px 6px;
	
	color: black;
}

#form-activate label
{
	width: 100px;
	display: block;
}

#form-activate input
{
	width: 20em;
}
#form-activate input.button
{
	width: auto;
}

.donation-row {
	display: inline-flex;
	gap: 10px;
	width: 100%;
	align-items: center;
}
.donation-row .desc {
	flex-grow: 1;
	font-style: italic;
}
.icon-embed-xsmall-2 {
	width: 2rem;
  height: 2rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
	margin-right: 0.8em;
}

.contact15_item {
	display: flex;
}

.contact15_item h6 {
	margin:0;
	font-size: 1.1em;
}
.contact15_item {
	margin-top: .5em;
	margin-bottom: .8em;
}

h1#BodyTitle
{
	padding-top: 8px;
	margin: 0 0 12px 0;
	float:left;
	padding: 2rem 0 0.2rem;
}

.captcha_wrapper
{
	float: left;
}

#bottombarNOTUSED
{
	background: url("https://www.herrang.com/sites/all/themes/herrang/images/bottombar.gif") repeat-x scroll 0 0 ;
	height:10px;
	margin-bottom:10px;
}

h1#BodyTitle span a
{
	text-decoration: underline;
}
h1#BodyTitle span 
{
	font-size: 16px;
	color: #c72027;
}

h2
{
	size: 140%;
	color:#c72027;
}

h3, .h3
{
	size: 120%;
	color:#c72027;
}

.h3
{
	display: block;
    font-size: 1.17em;
    font-weight: bold;
    margin: 1em 0;
}

.modifyaccommodation #map_canvas
{
	margin-left: 200px;
}

.daysofweek
{
	cursor: pointer;
	
}

#herrangcalendar td table.daysofweek td
{
	padding: 0px 4px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 12px;
	border: 1px solid black;
}

#herrangcalendar tr.row0 td table.daysofweek td
{
	padding: 0px 4px;
	border: 1px solid black;
}
table.daysofweek
{
	border: 0px;	
}

#herrangcalendar td
{
	padding: 0px;
	border-bottom:0px;
	border-top: 1px solid black;
}

#herrangcalendar tr.row0 td
{
	padding: 0px;
	border-top: 0px;
	border-bottom: 0px;
}

input.readonly
{
	background: #dedede;
}

.result .daysofweek
{
	cursor: auto;
}
.daysofweek .Reserved, .legend .Reserved, .daysofweek.Reserved
{
	background: orange;
}

.daysofweek .AltBooked, .legend .AltBooked, .daysofweek.AltBooked
{
	background: #FFCC66;
}  	

.daysofweek .BookingRequested, .legend .BookingRequested, .daysofweek.BookingRequested
{
	background: #9900CC;
	color: white;
}

.daysofweek .Unavailable, .legend .Unavailable, .daysofweek.Unavailable
{
	background: red;
	color: white;
}
.daysofweek .Booked, .legend .Booked, .daysofweek.Booked
{
	background: blue;
	color: white;
}
.daysofweek .Free, .legend .Free, .daysofweek.Free
{
	background: #00FF00;
}
.daysofweek .Mixed, .legend .Mixed, .daysofweek.Mixed
{
	background: #FF00FF;
}

.daysofweek .Arrived, .legend .Arrived, .daysofweek.Arrived
{
	background: #00FFFF;
}

.daysofweek .Left, .legend .Left, .daysofweek.Left
{
	background: #99FFFF;
}


.daysof week
{
	vertical-align: middle;
}
.daysofweek p.compact
{
	width: 100%;
	text-align: center;
	padding-top: 4px;
	padding-bottom: 4px;
	margin: 0;
}

ul.actionlist
{
	padding-left: 0;	
}
ul.actionlist li
{
	display: inline;
	margin-right: 6px;
}

#logininfo
{
	
}

/*
.wide #body
{
	width: 1180px;	
	margin-bottom: 20px;
	
}
*/
#body
{
	margin-left:auto;
	margin-right:auto;
	width:90%;
	margin-bottom: 20px;
	clear: none;
	float:left;
	position:relative;
}



#layoutdiv {
	min-width: 320px;
	max-width: 95%;
	width: auto;
}
#nav
{
	display: none;
}
#layoutdiv-inner
{
	height: 1px;
}



.alignedform input, .alignedform select
{
	vertical-align: top;
}

.result p.fact
{
	margin:0;
}

.result h1
{
	margin: 0;
	font-size: 1.8em;
	font-weight: bold;	
}

.result .map
{
	margin-bottom: 8px;	
	margin-top: 8px;
}

.result .pictures
{
	margin-top: 8px;
}
.pictures, .pictures a, .pictures a img
{
	vertical-align: top;
}
.pictures img
{
	margin-bottom: 8px;
}
.result .details
{
	
}

	
.result
{
	border-bottom: 1px solid #aaaaaa;
	padding: 8px;
	margin-bottom: 0px;
	margin-top: 8px;
	float: left;
	clear: both;	
}

div.clr
{
	float: none;
	clear: both;	
}

div#keys, div#pics
{
	border: 1px solid black;
	padding: 4px;
	float: left;
	margin-right: 10px;
	margin-bottom: 5px;	
}

div#keys input,div#keys select
{
	margin: 4px auto;
}

.calendarkeytable td, .calendarkeytable th
{
	border: 0;
}

#overDiv table table.calendarkeytable tr.toprow td
{
	border-top: 2px solid black;
}

tr.odd, tr.odd td, tr.odd th
{
	background: #eeeefa;	
}

div.csstable div.headerrow span
{
	
	font-weight: bold;
	display: block;
	float: left;
	padding: 4px;
}

div.csstable div.row div.cell, div#languagetable div.row div.smallcell
{
	display: block;
	float: left;
	padding: 4px 0px;
	margin-right: 8px;
	height: 100%;
	
}

div#languagetable div.headerrow span, div#languagetable div.row div.cell, div#languagetable textarea
{
	width: 20em;	
}
div#languagetable div.row div.smallcell
{
	width: 6em;
}

div.csstable div.row
{
	display: block;
	position: relative;
	clear: both;
	height: 100%;
	overflow:auto;
	width: 70em;
	border-bottom: 1px solid black;
}

div.csstable div.row.top
{
	border-top: 1px solid black;
		
}


div.csstable div.even, div.csstable div.even div 
{
	background-color: #FFFFFF;	
}

td.money, th.money
{
	text-align: right;
}

.modifyaccommodation #keys h2, .modifyaccommodation #pics h2
{
	margin-top: 4px;
	padding-top: 0px;
	margin-bottom: 0px;
	padding-bottom: 0px;
}
div.tabcontainer
{
	border-bottom: 1px solid black;
}

ul.bookingactions
{
	margin:0;
	padding:0;
}

ul.bookingactions li
{
	display: inline;
	padding: 3px 8px 3px 0px;
	list-style-type: none;
}
ul.tabs
{
	padding-left: 0;
	z-index:100;
	margin-bottom:0;
}
ul.tabs li
{
	display: inline;
	list-style-type: none;
	cursor: pointer;
	padding: 4px;
	padding-bottom:4px;
	border-top: 1px solid black;
	border-left: 1px solid black;
	border-right: 1px solid black;
	
	margin: 0px 4px 0px 4px;
	z-index:101;
	background: #ffffd3;
	position: relative;
	top: 2px;
	top: -3px !important;
	color:#c72027;
}



ul.tabs li.active
{
	background: white;
	border-bottom: 0;
	top: 2px;
	top: -2px !important;
}

.viewbooking h2 span
{
	font-size: 10pt;
	font-weight: normal;
}

h1 span.smalllink
{
	font-size: 16px;
}

#adminsection
{
	padding: 4px;
	border: 1px solid black;
}

#adminsection h2
{
	padding-top:0;
	margin-top:0;
}

body.calendar #overDiv a
{
	border: 2px solid #D4D0C8;
	border-style: outset;
	line-height: 27px;
	margin: 2px;
	padding: 3px 8px;
	background: #D4D0C8;
	color: black;
}

body.calendar #overDiv td.closebutton a
{
	border: 0;
	line-height: auto;
	margin: 0px;
	padding: 0px;
	background: transparent;
}

.allweeks
{
	border: 2px solid black;
	border-style: outset;
	background: #D4D0C8;
	float: left;
	color: black;
	height: 100%;
	font-weight: bold;
	cursor: pointer;
}

/* Date Picker */
/* the div that holds the date picker calendar */
.dpDiv {
	}
 
 
/* the table (within the div) that holds the date picker calendar */
.dpTable {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #505050;
	background-color: #ece9d8;
	border: 1px solid #AAAAAA;
	}
 
.dpTable td
{
	padding: 1px;
} 
/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
	}
 
 
/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
	}
 
 
/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {
	}
 
 
/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
	}
 
 
/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
	border: 1px solid #ece9d8;
	}
 
 
/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	}
 
 
/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
	background-color: #aca998;
	border: 1px solid #888888;
	cursor: pointer;
	color: red;
	}
 
 
/* the table cell that holds the name of the month and the year */
.dpTitleTD {
	}
 
 
/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD {
	}
 
 
/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
	}
 
 
/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	color: white;
	}
 
 
/* additional style information for the text that indicates the month and year */
.dpTitleText {
	font-size: 12px;
	color: gray;
	font-weight: bold;
	}
 
 
/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 
.dpDayHighlight {
	color: 4060ff;
	font-weight: bold;
	}
 
 
/* the forward/backward buttons at the top */
.dpButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: gray;
	background: #d8e8ff;
	font-weight: bold;
	padding: 0px;
	}
 
 
/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: gray;
	background: #d8e8ff;
	font-weight: bold;
	}
	
#accommodation tr td
{
	vertical-align: top;
}
#herrangcalendar tr.child td.firstcol, #accommodation tr.child td.firstcol
{
	padding-left: 30px;
	background: url(images/child.gif);
	background-repeat: no-repeat;
}

#herrangcalendar tr.orphan td.firstcol, #accommodation tr.orphan td.firstcol
{
	padding-left: 30px;
	background: url(images/orphan.gif);
	background-repeat: no-repeat;
}

table.inner
{
	width: 100%;
	border: 0;
}

table.inner td
{
	border: 0;
	text-align: left;
}

table.inner td.right
{
	width: 25%;
}
table.inner td.left
{
	width: 20%;
}

table.report
{
	width: 100%;
}

body.today h2 span
{
	font-size: 12px;
	color: #c72027;
	cursor: pointer;
	text-decoration: underline;
}

#cleaningss
{
	margin-top: 10px;
}

tr.linethrough td.cd_date, table.CleaningHDC tr.linethrough td
{
	text-decoration: line-through;
}

.keysurround
{
	border: 1px solid #aaaaaa;
	margin-bottom: 5px;
}

table.receipt, table.receipt td, table.receipt th
{
	border: 0;
	text-align: right;
	margin: 0;
	padding:1px 4px;
}

.similarcleaning
{
	border: 1px solid #aaaaaa;
	padding: 5px;
	margin: 5px 0px;
}

table#herrangcalendar td.first
{
	border-right:0 !important;
}
table#herrangcalendar td.middle
{
	border-right:0 !important;
	border-left:0 !important;
}
table#herrangcalendar td.last
{
	border-left:0 !important;
}

table.ownerreport td
{
	border-bottom: 0;
}

tr.urgent
{
	background: #ffff66;
}
tr.owesmoney
{
	background: #cc99ff;
}

div.notes
{
	border: 2px solid blue;
	padding: 6px;
	background: #bbbbff;
	margin: 0 0 12px 0;
}

table.writtendata td.writtendata
{
	border-bottom: 1px solid black;
	width: 30em;
	
}
table.writtendata, table.writtendata td,  table.writtendata tr
{
	border: 0;	
}

table.writtendata td
{
	padding: 20px 10px 0 0;
}
table.writtendata td.toprow
{
	padding-top: 0;
}

#receipttoplayout 
{
	
}
#receipttoplayout div#col1
{
	float: left;
	padding-right: 20px;
}

#receipttoplayout div#col2
{
	float: left;
	border-left: 1px solid black;
	padding-left: 30px;
	margin-bottom: 20px;
}

ul
{
	padding: 0;
}
ul li
{
	list-style-type: none;
}

#course_selection
{
	clear: both;
	margin: 10px;
}

.ui-widget-content a { color: #c72027; }
.ui-widget-content th a { color: white; }

#course_details
{
	clear: both;
	margin: 10px;
}

ul.paymentdetails li
{
	margin-bottom: 5px;
}

.partnerinfo
{
	border: 1px solid black;
	padding: 3px;
	margin-top: 3px;
}

#creditcards img
{
	margin-right: 10px;
}

.hold .st
{
	text-decoration: line-through;
}
#vholdinfo
{
	font-style: italic;
	padding: 10px;
}
#adminnav
{
	height: 100%;
	width: 8em;
	margin-right: 10px;
	padding: 20px 0px 20px 8px;
	background: #C62128;
    min-height: 600px;
	float: left;
	border-right: 10px solid black;
}

#secondarynav
{
	height: 100%;
	float: left;
	margin-top:0;
}

#secondarynav li
{
	margin-bottom: 15px;
}

#secondarynav a
{
	color: white;
	text-decoration: underline;
	font-weight: bold;
	font-size: 16px;
}

#bodycontent
{
	width:820px;
	float: left;
	max-width: calc(100% - 8em - 28px);
}

tr.notavailable td
{
	color: #999999;
}

span.movedcourse a, span.movedcourse
{
	text-decoration: line-through;
}


tr.pending td
{	
	color: #999999;
}
tr.refunded td
{
	text-decoration: line-through;
	color: #999999;
}

tr.partiallyrefunded td.received
{
	color: red;
}


img.ui-icon {
    height: 16px;
    width: 16px;
    position: relative;
    display: inline-block;
    vertical-align: bottom;
	

}

.h2hide, #maindetailsheader {cursor: pointer;}
#contracttabwrapperdiv {margin-top:10px;}


.championship
{
    clear:both;
    float:none;
}
.championship .cb
{
    margin-right:4px;
    display: inline-block;
    width: 30px;
}

.lf, .comppartner
{
    margin-top:4px;
    margin-bottom: 10px;
    margin-left: 34px;
}

.personal_details
{
    position: relative;
}
.personal_details table.basicinfo
{
    width: 100%;
}

.personal_details table.basicinfo td.profilepic
{
    width: 120px;
    vertical-align: top;
    text-align: right;
    padding-top:0;
}


ul.bullets
{
    padding: 0px 20px;
}
ul.bullets li
{
    list-style-type: disc;
    font-weight: bold;
    font-size: 1.1em;
}


.PreviousYear
{
    color: #666666;

}

.PreviousYear p
{

    color: #999999;
}

.contract_Canceled td
{

    color: #999999;
}

#paymentstable tr.Cancelled td{
	text-decoration: line-through;
	color: #999999;
}

#nav.admin
{
	position: relative;
}

#admininfo
{
	position: absolute;
	top:0;
	right:10px;
}

#admininfo h1
{
	color: white;
}

#topmenu
{
	float: right;
	/*background-color: #000;*/
	margin-top: 0.85rem;
}
#nav{
	background-color: #000;
	height: 4rem;
	margin-bottom:1rem;

}
.admin #nav{ margin-bottom:0;}
#topmenu ul, #nav ul
{
	margin: 0;
	padding: 0;
}

#nav ul
{
	height: 4rem;

	width: 100%;
	list-style: outside none none;

}
#topmenu li
{
	vertical-align: middle;
	padding: 0;
	margin: 0;
	display: inline-block;

}

#mainnav li{
	padding:0;
	margin:0;
	display:block;
	float: left;
	height: 100%;
	background: black;

}
#topmenu li.signed-in-as a
{
	height: auto;
	padding: 0;
	margin: 0;
}
#topmenu li a.button
{
	padding: 0.2em 0.4em;
	margin: 0;
	font-size: 0.9em;
	font-weight: bold;
	vertical-align: top;
}

#topmenu li a.button span.ui-button-text
{
	padding: 0;
	margin: 0;
}
#mainnav li a
{
	background-color: #000;
	border: 0 none;
	color: #fff !important;
	font-size: 2rem;
	text-decoration: none;
	text-transform: uppercase;
	font-family: "mostra-nuova";

}


#topmenu li a
{
	padding: 0.65rem 1.4rem;
	height: 2rem;
}
#mainnav li > span
{
	margin-top:10px;
	display: block;
}
#mainnav li a
{
	display: block;
	height: 2rem;
	padding: 1rem;
}
#topmenu li a:hover, #mainnav li a:hover , #mainnav li a span:hover, #mainnav li.selected a, #mainnav li.selected a span, #mainnav li a:hover
{
	background-color: #c72027;
	color: #000;
}

/*


ul#mainnav
{
	float: none;
	width: 1180px;
	background: black;
	clear: both;

padding-left:0px;
margin-left:auto;
margin-right:auto;
margin-top:0;
margin-bottom:0;
height: 4rem;
}



#mainnav li
{

	list-style-image:none;
	list-style-type:none;
	margin:0px;
	padding:0px;


	display: inline-block;

}

#mainnav li a
{
	background-color: #000;
	border: 0 none;
	color: #fff !important;
	font-size: 2rem;
	padding: 1rem 1.4rem;
	text-decoration: none;
	text-transform: uppercase;
	font-family: "Mostra Nuova Regular";
}
#mainnav li a
{
	text-decoration: none;
}

#mainnav li.selected
{

}
#mainnav
{
	clear: both;
}
*/

.pay-auto-scroll
{
	float: right;
	clear: both;
	margin-top: 0.5rem;
}

.pay-now
{
	float: right;
	clear: both;
	margin-top: 0.5rem;
}

.page-narrowing
{
	width: 800px;
}

ul.normalbullets
{
	padding: 0px 20px;
}

ul.normalbullets li
{
	list-style-type: disc;
}

#admininfo
{
	color: white;
	margin-top: 0.85rem;
	font-size: 2rem;
}

select, option
{
	font-size: 1.6rem;
}

tr.cancelled td{
	color: #999999;
	text-decoration: line-through;
}

.allocatepayments
{
	line-height: 2em;
}

table.noborders, table.noborders th, table.noborders td
{
	border:0;
}

#mobilemenutoggle
{
	float: right;
	width:55px;
	height:55px;
	position: absolute;
	right:5px;
	top:0;
	display: block;
	cursor: pointer;
	background: url(https://my.herrang.com/myherrang/images/menu-button-red.png)  no-repeat scroll right center / 55px auto;
}
body.mobile-menu-open #mobilemenutoggle
{
	background: url(https://my.herrang.com/myherrang/images/menu-close-thin-32.png);
	background-size: 55px 55px;
}
#mobilefrankie
{
	float: left;
	width:55px;
}
#mobilemyherranglogo
{
	margin: 0 auto;
	display: block;
	width: 300px;
	padding-top: 5px;
	padding-right: 55px;
}

@media screen and (max-width: 1100px) {
	input[type=checkbox],input[type=radio], html input.extraspace[type=checkbox]
	{
		min-height: 24px;
		min-width: 24px;
		width: 24px;
		height: 24px;
		margin-top: 0;

		vertical-align: middle;
	}
	input[type=radio]
	{
		margin-bottom: 5px;
	}
	#body
	{
		margin-right: 5px;
		margin-left: 5px;
	}
	#Country, #Currency, #fileToUpload{
		width: 90%;
	}
}
@media screen and (max-width: 450px) {
	#mobilemyherranglogo
	{
		width: 250px;
	}
}
@media screen and (max-width: 400px) {
	#mobilemyherranglogo
	{
		width: 200px;
	}
	.ui-dialog
	{
		max-width: 350px;
	}
}
@media screen and (max-width: 350px) {
	#mobilemyherranglogo
	{
		width: 150px;
	}
	.ui-dialog
	{
		max-width: 300px;
	}
}
@media screen and (max-width: 300px) {
	#mobilemyherranglogo
	{
		width: 100px;
	}
	.ui-dialog
	{
		max-width: 250px;
	}
}
#mobileheader
{
	clear: both;
	float: none;
	position: relative;
	height: 55px;
	margin-top:5px;
	margin-bottom:20px;
	width: 100%;
}

#footer
{
	border-top: 1px solid #cccccc;
	padding-top: 10px;
}
#footer .block
{
	width: 33%;
	float: left;
}

div.week table td.status
{
	width: 8.5em;
}
.changeacco {display: inline;}
#feedback textarea
{
	height: 8em;
	width: 95%;
}

@media screen and (max-width: 600px) {
	/* Make the nav the mobile version */
	.paymentclass-wrapper
	{
		font-size: 65%;
	}

	#user-vouchers table{
		font-size: 65%;
	}
	#paymentstable{
		font-size: 60%;
	}
}

@media screen and (max-width: 400px) {
	/* Make the nav the mobile version */
	.paymentclass-wrapper
	{
		font-size: 65%;
	}

	#user-vouchers table{
		font-size: 65%;
	}
	#paymentstable{
		font-size: 60%;
	}
}
@media screen and (max-width: 1100px) {
	/* Make the nav the mobile version */

	a.changeacco {display: inline;margin-left:0;}
	label, .formcontainer label
	{
		width: auto;
		float: none;
		clear: both;
		display: block;
	}

	label.inline, .formcontainer label.inline
	{

		display: inline;
	}
	textarea
	{
		width: 95%;
	}

	.desktoponly
	{
		display: none;
	}
	.page-narrowing
	{
		width: auto;
	}
	.ui-tabs .ui-tabs-panel
	{
		padding: 1em 0;
	}
	h1
	{
		font-size: 24px;
		line-height: 1.2em;
	}
	.changeacco {float: none;}
	div.week table td.status
	{
		width: auto;
	}

	#footer, #mobileheader-inner
	{
		padding-left: 5px;
		padding-right: 5px;
	}
	#footer .block
	{
		width: auto;
		margin-right: 5em;

	}


	body{
		margin: 0px;
		overflow-x: auto;
	}
	#nav{
		display: none;
		visibility: visible;
		position: absolute;

		right: -250px;
		top: 0;
		min-height: 100%;
		z-index: 1000;
		background: black url("https://my.herrang.com/myherrang/images/navItem.jpg") repeat;

		width: 250px;

	}

	ul.normalbullets {
		padding: 0px 0px 0 20px;
	}

	#course_selection ul li
	{
		margin-bottom: 10px;
	}
	#description
	{
		width: 90%;
	}
	#nav ul{
		margin-left:0;
	}

	#nav li{
		display: block;
		clear: both;
		float: none;
		height: auto;
		padding: 0;
		width: 250px;

	}
	#nav li a{
		background: black url("https://my.herrang.com/myherrang/images/navItem.jpg") repeat-x scroll left bottom;
		border-left: medium none;
		border-top: medium none;
		color: #ffffff;
		float: left;
		font-family: "mostra-nuova",Futura,"Gill Sans",sans-serif;
		font-size: 1.5rem;
		font-size-adjust: 0.475;
		font-style: normal;
		font-weight: bold;
		line-height: 50px;
		padding: 0 10px;
		text-decoration: none;
		width: 230px;
		height: auto;

	}


	.wide #layoutdiv
	{

		margin-left: 0px;
		margin-right: 0px;
		width: 100%;
		max-width: 100%;
	}

	#layoutdiv
	{
		margin-left: 0px;
		margin-right: 0px;
		width: 100%;
		max-width: 100%;
	}
	#mainnav li.selected a, #mainnav li.selected a span, #mainnav li.selected
	{
		background: #a70007;
		color: white;
	}
	#body{
		width: auto;
	}

}


@media screen and (min-width: 1101px) {
	.mobileonly {display: none;}

	#layoutdiv {
		width: 95%;
		max-width: 95%;
		min-width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
	#header, #nav{
		display: block;
	}
	#mobileheader, .mobileonly, #mainnav li.mobileonly {
		display: none;

	}
}

@media screen and (min-width: 1300px) {
	#layoutdiv {
		width: 1180px;
		max-width: 1180px;
		min-width: 1180px;
	}
}

table.invisible, table.invisible td,table.invisible th{
	border: 0;
	vertical-align: baseline;
	background: transparent;
}

td.actual-checkbox
{
	width: 20px;
}

tr.border-top td {
	margin: 0;
	border-top: 1px solid #999999;
}
td.notes
{
	font-size: 0.6em;
	vertical-align: baseline;
	font-style: italic;
}
tr.border-top td.notes {
	margin: 0;
	border-top: none;

}

div.week table td.owed
{
	width: 6em;
}



.smallnotes
{
	font-size: 0.7em;
	font-style: italic;
	line-height: 1rem;
}

.notifications
{
	border: 2px dashed red;
	padding: 0 10px;
	float: left;
	clear: both;
	font-weight: bold;
}


.regreceivedmessage
{
	margin-bottom:1em;
}

.payments-checkbox
{
	word-break: keep-all;
	text-align: right;
	width: 7em;
}

.clevercurrency a, th .clevercurrency a
{
	text-decoration: none;
}

tr.discount-codes td{
	border:0;
}

h1 .button.smallbutton
{
	font-size: 0.6em;
	vertical-align: middle;
}

h1 .button.smallbutton .ui-button-text
{
	padding: 0.2em 1em;

}

input[type="checkbox"].extraspace
{
	margin: 1.5em 0;
}


.mobile-box
{
	background: #eeeeee;
	margin-bottom: 1em;
	padding: 5px 0;
}

select{
	max-width: 90%;
}

.availability-graph
{
	max-width: 99%;
}
label.block
{
	display: block;
	clear:both;
	float:none;
	vertical-align: middle;
}
label.disabled
{
	color: #999999;
}

table.course_summary
{
	margin-top: 1.4em;
}

ul.emailconfig li span.edit
{
	display: block;
	border: 1px solid black;
	margin: 2px;
	padding: 5px;
}

.expand-image
{
	height: 70px;
	cursor: pointer;
}

table.top-align th, table.top-align td{
	vertical-align: top;
}

.pr_unpaid
{
	text-decoration: line-through;
	color: #999999;
}

.pr_received
{
	text-decoration: line-through;
	color: #7eb07e;

}

.pr_notdue
{
	text-decoration: line-through;
	color: #ffc57e;

}

#floatingManagingHeader {
	position: fixed;
	top: 10px;
	right: 10px;
	z-index:1000;
	background: #fffdf1;
	border: 1px solid black;
	padding: 5px 10px;
	line-height: 1.5em;
	cursor: move;
}

#floatingManagingHeader h2 {
	margin:0;
	padding:0;
}

#BodyTitle.fixedHeader {
	position: fixed;
	background: #fffdf1;
	padding:15px 0;
	width: 100%;
	top: 0;
}

#coursetabs li a {

    padding: 0.5em 0.8em;

}